feat: refactor Sidebar into standalone reusable component (#5663)

🚀!

src/tests/__snapshots__/contextmenu.test.tsx.snap

@@ -38,11 +38,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -50,6 +49,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -213,11 +213,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -225,6 +224,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -394,11 +394,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -406,6 +405,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -734,11 +734,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -746,6 +745,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -1074,11 +1074,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -1086,6 +1085,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -1255,11 +1255,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -1267,6 +1266,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -1470,11 +1470,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -1482,6 +1481,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -1744,11 +1744,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -1756,6 +1755,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -2102,11 +2102,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -2114,6 +2113,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": "backgroundColorPicker",
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -2906,11 +2906,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -2918,6 +2917,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -3246,11 +3246,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -3258,6 +3257,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -3586,11 +3586,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -3598,6 +3597,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -4006,11 +4006,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -4018,6 +4017,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -4286,11 +4286,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -4298,6 +4297,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -4647,11 +4647,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -4659,6 +4658,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -4755,11 +4755,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -4767,6 +4766,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -4841,11 +4841,10 @@ Object {
   "gridSize": null,
   "height": 100,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -4853,6 +4852,7 @@ Object {
   "offsetTop": 10,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,

src/tests/__snapshots__/regressionTests.test.tsx.snap

@@ -38,11 +38,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -50,6 +49,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -549,11 +549,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -561,6 +560,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -1066,11 +1066,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": false,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -1078,6 +1077,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -1928,11 +1928,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -1940,6 +1939,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -2151,11 +2151,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -2163,6 +2162,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -2659,11 +2659,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -2671,6 +2670,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -2937,11 +2937,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -2949,6 +2948,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -3116,11 +3116,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -3128,6 +3127,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -3607,11 +3607,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -3619,6 +3618,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": "strokeColorPicker",
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -3866,11 +3866,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -3878,6 +3877,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -4089,11 +4089,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -4101,6 +4100,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -4356,11 +4356,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -4368,6 +4367,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -4633,11 +4633,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -4645,6 +4644,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -5057,11 +5057,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -5069,6 +5068,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -5383,11 +5383,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -5395,6 +5394,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -5684,11 +5684,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -5696,6 +5695,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -5913,11 +5913,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -5925,6 +5924,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -6092,11 +6092,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -6104,6 +6103,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -6595,11 +6595,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -6607,6 +6606,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -6945,11 +6945,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -6957,6 +6956,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -9186,11 +9186,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -9198,6 +9197,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -9586,11 +9586,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -9598,6 +9597,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -9864,11 +9864,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -9876,6 +9875,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -10103,11 +10103,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -10115,6 +10114,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -10411,11 +10411,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -10423,6 +10422,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -10590,11 +10590,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -10602,6 +10601,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -10769,11 +10769,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -10781,6 +10780,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -10948,11 +10948,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -10960,6 +10959,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -11174,11 +11174,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -11186,6 +11185,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -11400,11 +11400,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -11412,6 +11411,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -11627,11 +11627,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -11639,6 +11638,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -11853,11 +11853,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -11865,6 +11864,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -12032,11 +12032,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -12044,6 +12043,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -12258,11 +12258,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -12270,6 +12269,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -12437,11 +12437,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -12449,6 +12448,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -12616,11 +12616,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -12628,6 +12627,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -12843,11 +12843,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -12855,6 +12854,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -13639,11 +13639,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -13651,6 +13650,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -13917,11 +13917,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "touch",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -13929,6 +13928,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -14027,11 +14027,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -14039,6 +14038,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -14135,11 +14135,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -14147,6 +14146,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -14317,11 +14317,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -14329,6 +14328,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -14670,11 +14670,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -14682,6 +14681,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -14889,11 +14889,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -14901,6 +14900,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -15803,11 +15803,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -15815,6 +15814,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -15911,11 +15911,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -15923,6 +15922,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -16752,11 +16752,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -16764,6 +16763,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -17201,11 +17201,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -17213,6 +17212,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -17502,11 +17502,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "touch",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -17514,6 +17513,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -17612,11 +17612,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -17624,6 +17623,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -18158,11 +18158,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -18170,6 +18169,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,
@@ -18266,11 +18266,10 @@ Object {
   "gridSize": null,
   "height": 768,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "Untitled-201933152653",
@@ -18278,6 +18277,7 @@ Object {
   "offsetTop": 0,
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,

src/tests/packages/__snapshots__/utils.test.ts.snap

@@ -38,16 +38,16 @@ Object {
   "fileHandle": null,
   "gridSize": null,
   "isBindingEnabled": true,
-  "isLibraryMenuDocked": false,
-  "isLibraryOpen": false,
   "isLoading": false,
   "isResizing": false,
   "isRotating": false,
+  "isSidebarDocked": false,
   "lastPointerDownWith": "mouse",
   "multiElement": null,
   "name": "name",
   "openMenu": null,
   "openPopup": null,
+  "openSidebar": null,
   "pasteDialog": Object {
     "data": null,
     "shown": false,

src/tests/test-utils.ts

@@ -110,9 +110,18 @@ export const updateSceneData = (data: SceneData) => {
 const originalGetBoundingClientRect =
   global.window.HTMLDivElement.prototype.getBoundingClientRect;
 
-export const mockBoundingClientRect = () => {
-  // override getBoundingClientRect as by default it will always return all values as 0 even if customized in html
-  global.window.HTMLDivElement.prototype.getBoundingClientRect = () => ({
+export const mockBoundingClientRect = (
+  {
+    top = 0,
+    left = 0,
+    bottom = 0,
+    right = 0,
+    width = 1920,
+    height = 1080,
+    x = 0,
+    y = 0,
+    toJSON = () => {},
+  } = {
     top: 10,
     left: 20,
     bottom: 10,
@@ -121,10 +130,39 @@ export const mockBoundingClientRect = () => {
     x: 10,
     y: 20,
     height: 100,
-    toJSON: () => {},
+  },
+) => {
+  // override getBoundingClientRect as by default it will always return all values as 0 even if customized in html
+  global.window.HTMLDivElement.prototype.getBoundingClientRect = () => ({
+    top,
+    left,
+    bottom,
+    right,
+    width,
+    height,
+    x,
+    y,
+    toJSON,
   });
 };
 
+export const withExcalidrawDimensions = async (
+  dimensions: { width: number; height: number },
+  cb: () => void,
+) => {
+  mockBoundingClientRect(dimensions);
+  // @ts-ignore
+  window.h.app.refreshDeviceState(h.app.excalidrawContainerRef.current!);
+  window.h.app.refresh();
+
+  await cb();
+
+  restoreOriginalGetBoundingClientRect();
+  // @ts-ignore
+  window.h.app.refreshDeviceState(h.app.excalidrawContainerRef.current!);
+  window.h.app.refresh();
+};
+
 export const restoreOriginalGetBoundingClientRect = () => {
   global.window.HTMLDivElement.prototype.getBoundingClientRect =
     originalGetBoundingClientRect;