I was looking for the same thing when I was checking out this plugin, I updated the JavaScript to work for the inspector block control (right sidebar) and the list view (left sidebar).
While it’s not as smooth on the left sidebar, it still works well for my use case.
jQuery(window).ready(function(){
? ? function initResizable(selector, handle, storageKey) {
? ? ? ? setInterval(function(){
? ? ? ? ? ? let sidebar = jQuery(selector);
? ? ? ? ? ? let width = localStorage.getItem(storageKey);
? ? ? ? ? ? sidebar.width(width);
? ? ? ? ? ? // Create or update width indicator
? ? ? ? ? ? if (!sidebar.find('.sidebar-width-indicator').length) {
? ? ? ? ? ? ? ? sidebar.append('<div class="sidebar-width-indicator"></div>');
? ? ? ? ? ? }
? ? ? ? ? ? sidebar.find('.sidebar-width-indicator').text(width + 'px');
? ? ? ? ? ? sidebar.resizable({
? ? ? ? ? ? ? ? handles: handle,
? ? ? ? ? ? ? ? resize: function(event, ui) {
? ? ? ? ? ? ? ? ? ? jQuery(this).css({'left': 0});
? ? ? ? ? ? ? ? ? ? let newWidth = jQuery(this).width();
? ? ? ? ? ? ? ? ? ? localStorage.setItem(storageKey, newWidth);
? ? ? ? ? ? ? ? ? ? jQuery(this).find('.sidebar-width-indicator').text(newWidth + 'px');
? ? ? ? ? ? ? ? }
? ? ? ? ? ? });
? ? ? ? ? ? updateSidebarState();
? ? ? ? }, 500);
? ? }
? ? function updateSidebarState() {
? ? ? ? let sidebarOpen = jQuery('.interface-pinned-items button.is-pressed').length > 0;
? ? ? ? jQuery('.edit-post-layout, .edit-site-layout').toggleClass('is-sidebar-opened', sidebarOpen);
? ? ? ? jQuery('.edit-post-layout, .edit-site-layout').toggleClass('is-list-sidebar-opened', sidebarOpen);
? ? }
? ? jQuery('body').on('click', '.interface-pinned-items button', updateSidebarState);
? ? // Initialize both sidebars with independent settings
? ? initResizable('.interface-interface-skeleton__sidebar', 'w', 'fm_rs_inspector_sidebar_width');
? ? initResizable('.editor-list-view-sidebar', 'e', 'fm_rs_list_view_sidebar_width');
});
