npm - @elementor/editor-panels - Versions diffs - 0.4.15 → 0.4.17 - Mend

@elementor/editor-panels 0.4.15 → 0.4.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (18) hide show

package/CHANGELOG.md +12 -110
package/dist/index.js +17 -43
package/dist/index.js.map +1 -1
package/dist/index.mjs +17 -43
package/dist/index.mjs.map +1 -1
package/package.json +43 -43
package/src/__tests__/api.test.tsx +2 -6
package/src/__tests__/sync.test.tsx +23 -11
package/src/api.ts +4 -4
package/src/components/external/panel-body.tsx +3 -1
package/src/components/external/panel-header-title.tsx +2 -6
package/src/components/internal/portal.tsx +2 -4
package/src/hooks/use-open-panel-injection.ts +1 -4
package/src/index.ts +1 -4
package/src/location.ts +1 -4
package/src/store/selectors.ts +1 -1
package/src/store/slice.ts +2 -2
package/src/sync.ts +31 -50

package/CHANGELOG.md CHANGED Viewed

@@ -3,227 +3,129 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
-## [0.4.15](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.14...@elementor/editor-panels@0.4.15) (2024-07-08)
+## [0.4.17](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.16...@elementor/editor-panels@0.4.17) (2024-07-16)
 **Note:** Version bump only for package @elementor/editor-panels
+## [0.4.16](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.15...@elementor/editor-panels@0.4.16) (2024-07-16)
+**Note:** Version bump only for package @elementor/editor-panels
+## [0.4.15](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.14...@elementor/editor-panels@0.4.15) (2024-07-08)
+**Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.14](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.13...@elementor/editor-panels@0.4.14) (2024-07-03)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.13](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.12...@elementor/editor-panels@0.4.13) (2024-07-02)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.12](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.11...@elementor/editor-panels@0.4.12) (2024-05-09)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.11](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.10...@elementor/editor-panels@0.4.11) (2024-05-07)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.10](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.9...@elementor/editor-panels@0.4.10) (2024-04-16)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.9](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.8...@elementor/editor-panels@0.4.9) (2024-02-28)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.8](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.7...@elementor/editor-panels@0.4.8) (2024-02-22)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.7](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.6...@elementor/editor-panels@0.4.7) (2024-01-29)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.6](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.5...@elementor/editor-panels@0.4.6) (2024-01-02)
 ### Bug Fixes
-* **editor-site-navigation:** add error state and fix UI [ED-13182] ([#150](https://github.com/elementor/elementor-packages/issues/150)) ([177c709](https://github.com/elementor/elementor-packages/commit/177c7090c8198c29077d77b9c4f10b80ee1ca9b9))
+- **editor-site-navigation:** add error state and fix UI [ED-13182] ([#150](https://github.com/elementor/elementor-packages/issues/150)) ([177c709](https://github.com/elementor/elementor-packages/commit/177c7090c8198c29077d77b9c4f10b80ee1ca9b9))
 ## [0.4.5](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.4...@elementor/editor-panels@0.4.5) (2023-11-07)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.4](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.3...@elementor/editor-panels@0.4.4) (2023-11-02)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.3](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.2...@elementor/editor-panels@0.4.3) (2023-10-19)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.2](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.1...@elementor/editor-panels@0.4.2) (2023-10-19)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.4.1](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.4.0...@elementor/editor-panels@0.4.1) (2023-09-26)
 **Note:** Version bump only for package @elementor/editor-panels
 # [0.4.0](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.3.0...@elementor/editor-panels@0.4.0) (2023-09-14)
 ### Features
-* **v1-adapters:** mark private functions [ED-12029] ([#122](https://github.com/elementor/elementor-packages/issues/122)) ([2e79ccc](https://github.com/elementor/elementor-packages/commit/2e79ccc87add5f0508b5a142f9f6d832b4657062))
+- **v1-adapters:** mark private functions [ED-12029] ([#122](https://github.com/elementor/elementor-packages/issues/122)) ([2e79ccc](https://github.com/elementor/elementor-packages/commit/2e79ccc87add5f0508b5a142f9f6d832b4657062))
 # [0.3.0](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.2.1...@elementor/editor-panels@0.3.0) (2023-09-11)
 ### Bug Fixes
-* ui adaptations [ED-11933] ([#107](https://github.com/elementor/elementor-packages/issues/107)) ([18ef329](https://github.com/elementor/elementor-packages/commit/18ef32928cbe921d7f5340c37c3c965b117d8d63))
+- ui adaptations [ED-11933] ([#107](https://github.com/elementor/elementor-packages/issues/107)) ([18ef329](https://github.com/elementor/elementor-packages/commit/18ef32928cbe921d7f5340c37c3c965b117d8d63))
 ### Features
-* **editor-panels:** mark experimental functions [ED-12067] ([#113](https://github.com/elementor/elementor-packages/issues/113)) ([152ef9f](https://github.com/elementor/elementor-packages/commit/152ef9f6980cd27571537db1738c69de63e2d4bb))
-* **store:** mark experimental functions [ED-12070] ([#114](https://github.com/elementor/elementor-packages/issues/114)) ([d790829](https://github.com/elementor/elementor-packages/commit/d79082911195c75f6d3a89a5619b234e2f5ce158))
+- **editor-panels:** mark experimental functions [ED-12067] ([#113](https://github.com/elementor/elementor-packages/issues/113)) ([152ef9f](https://github.com/elementor/elementor-packages/commit/152ef9f6980cd27571537db1738c69de63e2d4bb))
+- **store:** mark experimental functions [ED-12070] ([#114](https://github.com/elementor/elementor-packages/issues/114)) ([d790829](https://github.com/elementor/elementor-packages/commit/d79082911195c75f6d3a89a5619b234e2f5ce158))
 ## [0.2.1](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.2.0...@elementor/editor-panels@0.2.1) (2023-08-02)
 **Note:** Version bump only for package @elementor/editor-panels
 # [0.2.0](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.1.6...@elementor/editor-panels@0.2.0) (2023-08-02)
 ### Features
-* **site-navigation:** pages panel UI changes [ED-11348] ([#98](https://github.com/elementor/elementor-packages/issues/98)) ([d07930c](https://github.com/elementor/elementor-packages/commit/d07930c1c70c90ea59152648bfc5fe405a1f50e3))
+- **site-navigation:** pages panel UI changes [ED-11348] ([#98](https://github.com/elementor/elementor-packages/issues/98)) ([d07930c](https://github.com/elementor/elementor-packages/commit/d07930c1c70c90ea59152648bfc5fe405a1f50e3))
 ## [0.1.6](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.1.5...@elementor/editor-panels@0.1.6) (2023-08-01)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.1.5](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.1.4...@elementor/editor-panels@0.1.5) (2023-07-17)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.1.4](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.1.3...@elementor/editor-panels@0.1.4) (2023-07-17)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.1.3](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.1.2...@elementor/editor-panels@0.1.3) (2023-06-29)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.1.2](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.1.1...@elementor/editor-panels@0.1.2) (2023-06-28)
 **Note:** Version bump only for package @elementor/editor-panels
 ## [0.1.1](https://github.com/elementor/elementor-packages/compare/@elementor/editor-panels@0.1.0...@elementor/editor-panels@0.1.1) (2023-06-25)
 **Note:** Version bump only for package @elementor/editor-panels
 # 0.1.0 (2023-06-11)
 ### Features
-* **editor-panels:** init [ED-10804] ([#44](https://github.com/elementor/elementor-packages/issues/44)) ([1ed4113](https://github.com/elementor/elementor-packages/commit/1ed41131db8fb9151163175bfa614f784159e04b))
+- **editor-panels:** init [ED-10804] ([#44](https://github.com/elementor/elementor-packages/issues/44)) ([1ed4113](https://github.com/elementor/elementor-packages/commit/1ed41131db8fb9151163175bfa614f784159e04b))

package/dist/index.js CHANGED Viewed

@@ -51,10 +51,7 @@ var import_store2 = require("@elementor/store");
 // src/location.ts
 var import_locations = require("@elementor/locations");
-var {
-  inject: injectIntoPanels,
-  useInjections: usePanelsInjections
-} = (0, import_locations.createLocation)();
+var { inject: injectIntoPanels, useInjections: usePanelsInjections } = (0, import_locations.createLocation)();
 // src/store/selectors.ts
 var selectOpenId = (state) => state.panels.openId;
@@ -84,10 +81,7 @@ var import_react = require("react");
 function useOpenPanelInjection() {
   const injections = usePanelsInjections();
   const openId = (0, import_store2.__useSelector)(selectOpenId);
-  return (0, import_react.useMemo)(
-    () => injections.find((injection) => openId === injection.id),
-    [injections, openId]
-  );
+  return (0, import_react.useMemo)(() => injections.find((injection) => openId === injection.id), [injections, openId]);
 }
 // src/components/internal/portal.tsx
@@ -109,32 +103,20 @@ function useV1PanelStatus() {
   });
 }
 function sync() {
-  (0, import_editor_v1_adapters.__privateListenTo)(
-    (0, import_editor_v1_adapters.windowEvent)("elementor/panel/init"),
-    () => (0, import_editor_v1_adapters.__privateRegisterRoute)(V2_PANEL)
-  );
-  (0, import_editor_v1_adapters.__privateListenTo)(
-    (0, import_editor_v1_adapters.routeOpenEvent)(V2_PANEL),
-    () => {
-      getV1PanelElements().forEach((el) => {
-        el.setAttribute("hidden", "hidden");
-        el.setAttribute("aria-hidden", "true");
-      });
-    }
-  );
-  (0, import_editor_v1_adapters.__privateListenTo)(
-    (0, import_editor_v1_adapters.routeCloseEvent)(V2_PANEL),
-    () => selectOpenId((0, import_store4.__getState)()) && (0, import_store4.__dispatch)(slice_default.actions.close())
-  );
-  (0, import_editor_v1_adapters.__privateListenTo)(
-    (0, import_editor_v1_adapters.routeCloseEvent)(V2_PANEL),
-    () => {
-      getV1PanelElements().forEach((el) => {
-        el.removeAttribute("hidden");
-        el.removeAttribute("aria-hidden");
-      });
-    }
-  );
+  (0, import_editor_v1_adapters.__privateListenTo)((0, import_editor_v1_adapters.windowEvent)("elementor/panel/init"), () => (0, import_editor_v1_adapters.__privateRegisterRoute)(V2_PANEL));
+  (0, import_editor_v1_adapters.__privateListenTo)((0, import_editor_v1_adapters.routeOpenEvent)(V2_PANEL), () => {
+    getV1PanelElements().forEach((el) => {
+      el.setAttribute("hidden", "hidden");
+      el.setAttribute("aria-hidden", "true");
+    });
+  });
+  (0, import_editor_v1_adapters.__privateListenTo)((0, import_editor_v1_adapters.routeCloseEvent)(V2_PANEL), () => selectOpenId((0, import_store4.__getState)()) && (0, import_store4.__dispatch)(slice_default.actions.close()));
+  (0, import_editor_v1_adapters.__privateListenTo)((0, import_editor_v1_adapters.routeCloseEvent)(V2_PANEL), () => {
+    getV1PanelElements().forEach((el) => {
+      el.removeAttribute("hidden");
+      el.removeAttribute("aria-hidden");
+    });
+  });
   (0, import_editor_v1_adapters.__privateListenTo)(
     (0, import_editor_v1_adapters.windowEvent)("elementor/panel/init"),
     () => subscribe({
@@ -311,15 +293,7 @@ var Typography = (0, import_ui4.styled)(import_ui4.Typography)(({ theme, variant
   };
 });
 function PanelHeaderTitle({ children, ...props }) {
-  return /* @__PURE__ */ React5.createElement(
-    Typography,
-    {
-      component: "h2",
-      variant: "subtitle1",
-      ...props
-    },
-    children
-  );
+  return /* @__PURE__ */ React5.createElement(Typography, { component: "h2", variant: "subtitle1", ...props }, children);
 }
 // src/components/external/panel-body.tsx

package/dist/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/index.ts","../src/init.ts","../src/components/internal/panels.tsx","../src/hooks/use-open-panel-injection.ts","../src/location.ts","../src/store/selectors.ts","../src/store/slice.ts","../src/components/internal/portal.tsx","../src/sync.ts","../src/api.ts","../src/components/external/panel.tsx","../src/components/external/panel-header.tsx","../src/components/external/panel-header-title.tsx","../src/components/external/panel-body.tsx"],"sourcesContent":["import init from './init';\n\nexport {\n\tcreatePanel as __createPanel,\n\tregisterPanel as __registerPanel,\n} from './api';\n\nexport * from './components/external';\n\ninit();\n","import { injectIntoTop } from '@elementor/editor';\nimport { __registerSlice } from '@elementor/store';\nimport Panels from './components/internal/panels';\nimport { sync } from './sync';\nimport { slice } from './store';\n\nexport default function init() {\n\tsync();\n\n\t__registerSlice( slice );\n\n\tinjectIntoTop( { id: 'panels', component: Panels } );\n}\n","import * as React from 'react';\nimport useOpenPanelInjection from '../../hooks/use-open-panel-injection';\nimport Portal from './portal';\n\nexport default function Panels() {\n\tconst openPanel = useOpenPanelInjection();\n\tconst Component = openPanel?.component ?? null;\n\n\tif ( ! Component ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Portal>\n\t\t\t<Component />\n\t\t</Portal>\n\t);\n}\n","import { __useSelector as useSelector } from '@elementor/store';\nimport { usePanelsInjections } from '../location';\nimport { selectOpenId } from '../store';\nimport { useMemo } from 'react';\n\nexport default function useOpenPanelInjection() {\n\tconst injections = usePanelsInjections();\n\tconst openId = useSelector( selectOpenId );\n\n\treturn useMemo(\n\t\t() => injections.find( ( injection ) => openId === injection.id ),\n\t\t[ injections, openId ]\n\t);\n}\n","import { createLocation } from '@elementor/locations';\n\nexport const {\n\tinject: injectIntoPanels,\n\tuseInjections: usePanelsInjections,\n} = createLocation();\n","import { SliceState } from '@elementor/store';\nimport slice from './slice';\n\ntype State = SliceState<typeof slice>;\n\nexport const selectOpenId = ( state: State ) => state.panels.openId;\n","import { __createSlice, PayloadAction } from '@elementor/store';\n\nconst initialState: {\n\topenId: string \| null;\n} = {\n\topenId: null,\n};\n\nexport default __createSlice( {\n\tname: 'panels',\n\tinitialState,\n\treducers: {\n\t\topen( state, action: PayloadAction<string> ) {\n\t\t\tstate.openId = action.payload;\n\t\t},\n\t\tclose( state, action: PayloadAction<string \| undefined> ) {\n\t\t\tif ( ! action.payload \|\| state.openId === action.payload ) {\n\t\t\t\tstate.openId = null;\n\t\t\t}\n\t\t},\n\t},\n} );\n","import * as React from 'react';\nimport { Portal as BasePortal, PortalProps } from '@elementor/ui';\nimport { useRef } from 'react';\nimport { getPortalContainer } from '../../sync';\n\ntype Props = Omit<PortalProps, 'container'>;\n\nexport default function Portal( props: Props ) {\n\tconst containerRef = useRef( getPortalContainer );\n\n\tif ( ! containerRef.current ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<BasePortal container={ containerRef.current } { ...props } />\n\t);\n}\n","import {\n\t__privateOpenRoute as openRoute,\n\t__privateListenTo as listenTo,\n\trouteCloseEvent,\n\t__privateUseRouteStatus as useRouteStatus,\n\trouteOpenEvent,\n\twindowEvent,\n\t__privateRegisterRoute as registerRoute,\n\t__privateIsRouteActive as isRouteActive,\n} from '@elementor/editor-v1-adapters';\nimport { __dispatch, __getState, __subscribe as originalSubscribe } from '@elementor/store';\nimport { selectOpenId, slice } from './store';\n\nconst V2_PANEL = 'panel/v2';\n\nexport function getPortalContainer() {\n\treturn document.querySelector( '#elementor-panel-inner' );\n}\n\nexport function useV1PanelStatus() {\n\t// For now supporting only panels that are not part of the kit and not in preview mode.\n\treturn useRouteStatus( V2_PANEL, {\n\t\tblockOnKitRoutes: true,\n\t\tblockOnPreviewMode: true,\n\t} );\n}\n\nexport function sync() {\n\t// Register the V2 panel route on panel init.\n\tlistenTo(\n\t\twindowEvent( 'elementor/panel/init' ),\n\t\t() => registerRoute( V2_PANEL )\n\t);\n\n\t// On empty route open, hide V1 panel elements.\n\tlistenTo(\n\t\trouteOpenEvent( V2_PANEL ),\n\t\t() => {\n\t\t\tgetV1PanelElements().forEach( ( el ) => {\n\t\t\t\tel.setAttribute( 'hidden', 'hidden' );\n\t\t\t\tel.setAttribute( 'aria-hidden', 'true' );\n\t\t\t} );\n\t\t},\n\t);\n\n\t// On empty route close, close the V2 panel.\n\tlistenTo(\n\t\trouteCloseEvent( V2_PANEL ),\n\t\t() => selectOpenId( __getState() ) && __dispatch( slice.actions.close() )\n\t);\n\n\t// On empty route close, show V1 panel elements.\n\tlistenTo(\n\t\trouteCloseEvent( V2_PANEL ),\n\t\t() => {\n\t\t\tgetV1PanelElements().forEach( ( el ) => {\n\t\t\t\tel.removeAttribute( 'hidden' );\n\t\t\t\tel.removeAttribute( 'aria-hidden' );\n\t\t\t} );\n\t\t},\n\t);\n\n\t// On V2 panel open, open the V2 panel route.\n\tlistenTo(\n\t\twindowEvent( 'elementor/panel/init' ),\n\t\t() => subscribe( {\n\t\t\ton: ( state ) => selectOpenId( state ),\n\t\t\twhen: ( { prev, current } ) => !! ( ! prev && current ), // is panel opened\n\t\t\tcallback: () => openRoute( V2_PANEL ),\n\t\t} )\n\t);\n\n\t// On V2 panel close, close the V2 panel route.\n\tlistenTo(\n\t\twindowEvent( 'elementor/panel/init' ),\n\t\t() => subscribe( {\n\t\t\ton: ( state ) => selectOpenId( state ),\n\t\t\twhen: ( { prev, current } ) => !! ( ! current && prev ), // is panel closed\n\t\t\tcallback: () => isRouteActive( V2_PANEL ) && openRoute( getDefaultRoute() ),\n\t\t} )\n\t);\n}\n\nfunction getV1PanelElements() {\n\tconst v1ElementsSelector = [\n\t\t'#elementor-panel-header-wrapper',\n\t\t'#elementor-panel-content-wrapper',\n\t\t'#elementor-panel-state-loading',\n\t\t'#elementor-panel-footer',\n\t].join( ', ' );\n\n\treturn document.querySelectorAll( v1ElementsSelector );\n}\n\nfunction getDefaultRoute() {\n\ttype ExtendedWindow = Window & {\n\t\telementor?: {\n\t\t\tdocuments?: {\n\t\t\t\tgetCurrent?: () => {\n\t\t\t\t\tconfig?: {\n\t\t\t\t\t\tpanel?: {\n\t\t\t\t\t\t\tdefault_route?: string,\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\t}\n\n\tconst defaultRoute = ( window as unknown as ExtendedWindow )\n\t\t?.elementor\n\t\t?.documents\n\t\t?.getCurrent?.()\n\t\t?.config\n\t\t?.panel\n\t\t?.default_route;\n\n\treturn defaultRoute \|\| 'panel/elements/categories';\n}\n\nfunction subscribe<TVal>( {\n\ton,\n\twhen,\n\tcallback,\n}: {\n\ton: ( state: ReturnType<typeof __getState> ) => TVal,\n\twhen: ( { prev, current }: { prev: TVal, current: TVal } ) => boolean,\n\tcallback: ( { prev, current }: { prev: TVal, current: TVal } ) => void,\n} ) {\n\tlet prev: TVal;\n\n\toriginalSubscribe( () => {\n\t\tconst current = on( __getState() );\n\n\t\tif ( when( { prev, current } ) ) {\n\t\t\tcallback( { prev, current } );\n\t\t}\n\n\t\tprev = current;\n\t} );\n}\n","import { ComponentType } from 'react';\nimport { injectIntoPanels } from './location';\nimport { selectOpenId, slice } from './store';\nimport { __useSelector as useSelector, __useDispatch as useDispatch } from '@elementor/store';\nimport { useV1PanelStatus } from './sync';\n\nexport type PanelDeclaration = {\n\tid: string;\n\tcomponent: ComponentType;\n}\n\nexport function createPanel( { id, component }: PanelDeclaration ) {\n\tconst usePanelStatus = createUseStatus( id );\n\tconst usePanelActions = createUseActions( id, usePanelStatus );\n\n\treturn {\n\t\tpanel: {\n\t\t\tid,\n\t\t\tcomponent,\n\t\t},\n\t\tusePanelStatus,\n\t\tusePanelActions,\n\t};\n}\n\nexport function registerPanel( { id, component }: Pick<PanelDeclaration, 'id' \| 'component'> ) {\n\tinjectIntoPanels( {\n\t\tid,\n\t\tcomponent,\n\t} );\n}\n\nfunction createUseStatus( id: PanelDeclaration['id'] ) {\n\treturn () => {\n\t\tconst openPanelId = useSelector( selectOpenId );\n\t\tconst v1PanelStatus = useV1PanelStatus();\n\n\t\treturn {\n\t\t\tisOpen: openPanelId === id && v1PanelStatus.isActive,\n\t\t\tisBlocked: v1PanelStatus.isBlocked,\n\t\t};\n\t};\n}\n\nfunction createUseActions( id: PanelDeclaration['id'], useStatus: ReturnType<typeof createUseStatus> ) {\n\treturn () => {\n\t\tconst dispatch = useDispatch();\n\t\tconst { isBlocked } = useStatus();\n\n\t\treturn {\n\t\t\topen: async () => {\n\t\t\t\tif ( isBlocked ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tdispatch( slice.actions.open( id ) );\n\t\t\t},\n\t\t\tclose: async () => {\n\t\t\t\tif ( isBlocked ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tdispatch( slice.actions.close( id ) );\n\t\t\t},\n\t\t};\n\t};\n}\n","import * as React from 'react';\nimport { Drawer, DrawerProps } from '@elementor/ui';\n\nexport default function Panel( { children, sx, ...props }: DrawerProps ) {\n\treturn (\n\t\t<Drawer\n\t\t\topen={ true }\n\t\t\tvariant=\"persistent\"\n\t\t\tanchor=\"left\"\n\t\t\tPaperProps={ {\n\t\t\t\tsx: {\n\t\t\t\t\tposition: 'relative',\n\t\t\t\t\twidth: '100%',\n\t\t\t\t\tbgcolor: 'background.default',\n\t\t\t\t\tborder: 'none',\n\t\t\t\t},\n\t\t\t} }\n\t\t\tsx={ { height: '100%', ...sx } }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t</Drawer>\n\t);\n}\n","import * as React from 'react';\nimport { Box, BoxProps, Divider, styled } from '@elementor/ui';\n\nconst Header = styled( Box )( ( { theme } ) => ( {\n\theight: theme?.spacing( 6 ) \|\| '48px',\n\tdisplay: 'flex',\n\talignItems: 'center',\n\tjustifyContent: 'center',\n} ) );\n\nexport default function PanelHeader( { children, ...props }: BoxProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Header component=\"header\" { ...props }>\n\t\t\t\t{ children }\n\t\t\t</Header>\n\t\t\t<Divider />\n\t\t</>\n\t);\n}\n","import * as React from 'react';\nimport { Typography as TypographySource, TypographyProps, styled } from '@elementor/ui';\n\n// This is to override Editor reset.scss that overrides eui styles\nconst Typography = styled( TypographySource )<TypographyProps>( ( { theme, variant = 'body1' } ) => {\n\tif ( variant === 'inherit' ) {\n\t\treturn {};\n\t}\n\n\treturn {\n\t\t'&.MuiTypography-root': {\n\t\t\t...theme.typography[ variant ],\n\t\t},\n\t};\n} );\n\nexport default function PanelHeaderTitle( { children, ...props }: TypographyProps ) {\n\treturn (\n\t\t<Typography\n\t\t\tcomponent=\"h2\"\n\t\t\tvariant=\"subtitle1\"\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t</Typography>\n\t);\n}\n","import * as React from 'react';\nimport { Box, BoxProps } from '@elementor/ui';\n\nexport default function PanelBody( { children, sx, ...props }: BoxProps ) {\n\treturn (\n\t\t<Box\n\t\t\tcomponent=\"main\"\n\t\t\tsx={ {\n\t\t\t\toverflowY: 'auto',\n\t\t\t\theight: '100%',\n\t\t\t\t...sx,\n\t\t\t} }\n\t\t\t{ ...props }\n\t\t>{ children }</Box>\n\t);\n}\n"],"mappings":"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","names":["import_store","React","import_store","useSelector","import_react","import_store","useRouteStatus","listenTo","registerRoute","openRoute","isRouteActive","originalSubscribe","BasePortal","import_store","useSelector","useDispatch","React","import_ui","React","import_ui","React","import_ui","TypographySource","React","import_ui"]}
1	+ {"version":3,"sources":["../src/index.ts","../src/init.ts","../src/components/internal/panels.tsx","../src/hooks/use-open-panel-injection.ts","../src/location.ts","../src/store/selectors.ts","../src/store/slice.ts","../src/components/internal/portal.tsx","../src/sync.ts","../src/api.ts","../src/components/external/panel.tsx","../src/components/external/panel-header.tsx","../src/components/external/panel-header-title.tsx","../src/components/external/panel-body.tsx"],"sourcesContent":["import init from './init';\n\nexport { createPanel as __createPanel, registerPanel as __registerPanel } from './api';\n\nexport * from './components/external';\n\ninit();\n","import { injectIntoTop } from '@elementor/editor';\nimport { __registerSlice } from '@elementor/store';\nimport Panels from './components/internal/panels';\nimport { sync } from './sync';\nimport { slice } from './store';\n\nexport default function init() {\n\tsync();\n\n\t__registerSlice( slice );\n\n\tinjectIntoTop( { id: 'panels', component: Panels } );\n}\n","import * as React from 'react';\nimport useOpenPanelInjection from '../../hooks/use-open-panel-injection';\nimport Portal from './portal';\n\nexport default function Panels() {\n\tconst openPanel = useOpenPanelInjection();\n\tconst Component = openPanel?.component ?? null;\n\n\tif ( ! Component ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Portal>\n\t\t\t<Component />\n\t\t</Portal>\n\t);\n}\n","import { __useSelector as useSelector } from '@elementor/store';\nimport { usePanelsInjections } from '../location';\nimport { selectOpenId } from '../store';\nimport { useMemo } from 'react';\n\nexport default function useOpenPanelInjection() {\n\tconst injections = usePanelsInjections();\n\tconst openId = useSelector( selectOpenId );\n\n\treturn useMemo( () => injections.find( ( injection ) => openId === injection.id ), [ injections, openId ] );\n}\n","import { createLocation } from '@elementor/locations';\n\nexport const { inject: injectIntoPanels, useInjections: usePanelsInjections } = createLocation();\n","import { SliceState } from '@elementor/store';\nimport slice from './slice';\n\ntype State = SliceState< typeof slice >;\n\nexport const selectOpenId = ( state: State ) => state.panels.openId;\n","import { __createSlice, PayloadAction } from '@elementor/store';\n\nconst initialState: {\n\topenId: string \| null;\n} = {\n\topenId: null,\n};\n\nexport default __createSlice( {\n\tname: 'panels',\n\tinitialState,\n\treducers: {\n\t\topen( state, action: PayloadAction< string > ) {\n\t\t\tstate.openId = action.payload;\n\t\t},\n\t\tclose( state, action: PayloadAction< string \| undefined > ) {\n\t\t\tif ( ! action.payload \|\| state.openId === action.payload ) {\n\t\t\t\tstate.openId = null;\n\t\t\t}\n\t\t},\n\t},\n} );\n","import * as React from 'react';\nimport { Portal as BasePortal, PortalProps } from '@elementor/ui';\nimport { useRef } from 'react';\nimport { getPortalContainer } from '../../sync';\n\ntype Props = Omit< PortalProps, 'container' >;\n\nexport default function Portal( props: Props ) {\n\tconst containerRef = useRef( getPortalContainer );\n\n\tif ( ! containerRef.current ) {\n\t\treturn null;\n\t}\n\n\treturn <BasePortal container={ containerRef.current } { ...props } />;\n}\n","import {\n\t__privateOpenRoute as openRoute,\n\t__privateListenTo as listenTo,\n\trouteCloseEvent,\n\t__privateUseRouteStatus as useRouteStatus,\n\trouteOpenEvent,\n\twindowEvent,\n\t__privateRegisterRoute as registerRoute,\n\t__privateIsRouteActive as isRouteActive,\n} from '@elementor/editor-v1-adapters';\nimport { __dispatch, __getState, __subscribe as originalSubscribe } from '@elementor/store';\nimport { selectOpenId, slice } from './store';\n\nconst V2_PANEL = 'panel/v2';\n\nexport function getPortalContainer() {\n\treturn document.querySelector( '#elementor-panel-inner' );\n}\n\nexport function useV1PanelStatus() {\n\t// For now supporting only panels that are not part of the kit and not in preview mode.\n\treturn useRouteStatus( V2_PANEL, {\n\t\tblockOnKitRoutes: true,\n\t\tblockOnPreviewMode: true,\n\t} );\n}\n\nexport function sync() {\n\t// Register the V2 panel route on panel init.\n\tlistenTo( windowEvent( 'elementor/panel/init' ), () => registerRoute( V2_PANEL ) );\n\n\t// On empty route open, hide V1 panel elements.\n\tlistenTo( routeOpenEvent( V2_PANEL ), () => {\n\t\tgetV1PanelElements().forEach( ( el ) => {\n\t\t\tel.setAttribute( 'hidden', 'hidden' );\n\t\t\tel.setAttribute( 'aria-hidden', 'true' );\n\t\t} );\n\t} );\n\n\t// On empty route close, close the V2 panel.\n\tlistenTo( routeCloseEvent( V2_PANEL ), () => selectOpenId( __getState() ) && __dispatch( slice.actions.close() ) );\n\n\t// On empty route close, show V1 panel elements.\n\tlistenTo( routeCloseEvent( V2_PANEL ), () => {\n\t\tgetV1PanelElements().forEach( ( el ) => {\n\t\t\tel.removeAttribute( 'hidden' );\n\t\t\tel.removeAttribute( 'aria-hidden' );\n\t\t} );\n\t} );\n\n\t// On V2 panel open, open the V2 panel route.\n\tlistenTo( windowEvent( 'elementor/panel/init' ), () =>\n\t\tsubscribe( {\n\t\t\ton: ( state ) => selectOpenId( state ),\n\t\t\twhen: ( { prev, current } ) => !! ( ! prev && current ), // is panel opened\n\t\t\tcallback: () => openRoute( V2_PANEL ),\n\t\t} )\n\t);\n\n\t// On V2 panel close, close the V2 panel route.\n\tlistenTo( windowEvent( 'elementor/panel/init' ), () =>\n\t\tsubscribe( {\n\t\t\ton: ( state ) => selectOpenId( state ),\n\t\t\twhen: ( { prev, current } ) => !! ( ! current && prev ), // is panel closed\n\t\t\tcallback: () => isRouteActive( V2_PANEL ) && openRoute( getDefaultRoute() ),\n\t\t} )\n\t);\n}\n\nfunction getV1PanelElements() {\n\tconst v1ElementsSelector = [\n\t\t'#elementor-panel-header-wrapper',\n\t\t'#elementor-panel-content-wrapper',\n\t\t'#elementor-panel-state-loading',\n\t\t'#elementor-panel-footer',\n\t].join( ', ' );\n\n\treturn document.querySelectorAll( v1ElementsSelector );\n}\n\nfunction getDefaultRoute() {\n\ttype ExtendedWindow = Window & {\n\t\telementor?: {\n\t\t\tdocuments?: {\n\t\t\t\tgetCurrent?: () => {\n\t\t\t\t\tconfig?: {\n\t\t\t\t\t\tpanel?: {\n\t\t\t\t\t\t\tdefault_route?: string;\n\t\t\t\t\t\t};\n\t\t\t\t\t};\n\t\t\t\t};\n\t\t\t};\n\t\t};\n\t};\n\n\tconst defaultRoute = ( window as unknown as ExtendedWindow )?.elementor?.documents?.getCurrent?.()?.config?.panel\n\t\t?.default_route;\n\n\treturn defaultRoute \|\| 'panel/elements/categories';\n}\n\nfunction subscribe< TVal >( {\n\ton,\n\twhen,\n\tcallback,\n}: {\n\ton: ( state: ReturnType< typeof __getState > ) => TVal;\n\twhen: ( { prev, current }: { prev: TVal; current: TVal } ) => boolean;\n\tcallback: ( { prev, current }: { prev: TVal; current: TVal } ) => void;\n} ) {\n\tlet prev: TVal;\n\n\toriginalSubscribe( () => {\n\t\tconst current = on( __getState() );\n\n\t\tif ( when( { prev, current } ) ) {\n\t\t\tcallback( { prev, current } );\n\t\t}\n\n\t\tprev = current;\n\t} );\n}\n","import { ComponentType } from 'react';\nimport { injectIntoPanels } from './location';\nimport { selectOpenId, slice } from './store';\nimport { __useSelector as useSelector, __useDispatch as useDispatch } from '@elementor/store';\nimport { useV1PanelStatus } from './sync';\n\nexport type PanelDeclaration = {\n\tid: string;\n\tcomponent: ComponentType;\n};\n\nexport function createPanel( { id, component }: PanelDeclaration ) {\n\tconst usePanelStatus = createUseStatus( id );\n\tconst usePanelActions = createUseActions( id, usePanelStatus );\n\n\treturn {\n\t\tpanel: {\n\t\t\tid,\n\t\t\tcomponent,\n\t\t},\n\t\tusePanelStatus,\n\t\tusePanelActions,\n\t};\n}\n\nexport function registerPanel( { id, component }: Pick< PanelDeclaration, 'id' \| 'component' > ) {\n\tinjectIntoPanels( {\n\t\tid,\n\t\tcomponent,\n\t} );\n}\n\nfunction createUseStatus( id: PanelDeclaration[ 'id' ] ) {\n\treturn () => {\n\t\tconst openPanelId = useSelector( selectOpenId );\n\t\tconst v1PanelStatus = useV1PanelStatus();\n\n\t\treturn {\n\t\t\tisOpen: openPanelId === id && v1PanelStatus.isActive,\n\t\t\tisBlocked: v1PanelStatus.isBlocked,\n\t\t};\n\t};\n}\n\nfunction createUseActions( id: PanelDeclaration[ 'id' ], useStatus: ReturnType< typeof createUseStatus > ) {\n\treturn () => {\n\t\tconst dispatch = useDispatch();\n\t\tconst { isBlocked } = useStatus();\n\n\t\treturn {\n\t\t\topen: async () => {\n\t\t\t\tif ( isBlocked ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tdispatch( slice.actions.open( id ) );\n\t\t\t},\n\t\t\tclose: async () => {\n\t\t\t\tif ( isBlocked ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tdispatch( slice.actions.close( id ) );\n\t\t\t},\n\t\t};\n\t};\n}\n","import * as React from 'react';\nimport { Drawer, DrawerProps } from '@elementor/ui';\n\nexport default function Panel( { children, sx, ...props }: DrawerProps ) {\n\treturn (\n\t\t<Drawer\n\t\t\topen={ true }\n\t\t\tvariant=\"persistent\"\n\t\t\tanchor=\"left\"\n\t\t\tPaperProps={ {\n\t\t\t\tsx: {\n\t\t\t\t\tposition: 'relative',\n\t\t\t\t\twidth: '100%',\n\t\t\t\t\tbgcolor: 'background.default',\n\t\t\t\t\tborder: 'none',\n\t\t\t\t},\n\t\t\t} }\n\t\t\tsx={ { height: '100%', ...sx } }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t</Drawer>\n\t);\n}\n","import * as React from 'react';\nimport { Box, BoxProps, Divider, styled } from '@elementor/ui';\n\nconst Header = styled( Box )( ( { theme } ) => ( {\n\theight: theme?.spacing( 6 ) \|\| '48px',\n\tdisplay: 'flex',\n\talignItems: 'center',\n\tjustifyContent: 'center',\n} ) );\n\nexport default function PanelHeader( { children, ...props }: BoxProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Header component=\"header\" { ...props }>\n\t\t\t\t{ children }\n\t\t\t</Header>\n\t\t\t<Divider />\n\t\t</>\n\t);\n}\n","import * as React from 'react';\nimport { Typography as TypographySource, TypographyProps, styled } from '@elementor/ui';\n\n// This is to override Editor reset.scss that overrides eui styles\nconst Typography = styled( TypographySource )< TypographyProps >( ( { theme, variant = 'body1' } ) => {\n\tif ( variant === 'inherit' ) {\n\t\treturn {};\n\t}\n\n\treturn {\n\t\t'&.MuiTypography-root': {\n\t\t\t...theme.typography[ variant ],\n\t\t},\n\t};\n} );\n\nexport default function PanelHeaderTitle( { children, ...props }: TypographyProps ) {\n\treturn (\n\t\t<Typography component=\"h2\" variant=\"subtitle1\" { ...props }>\n\t\t\t{ children }\n\t\t</Typography>\n\t);\n}\n","import * as React from 'react';\nimport { Box, BoxProps } from '@elementor/ui';\n\nexport default function PanelBody( { children, sx, ...props }: BoxProps ) {\n\treturn (\n\t\t<Box\n\t\t\tcomponent=\"main\"\n\t\t\tsx={ {\n\t\t\t\toverflowY: 'auto',\n\t\t\t\theight: '100%',\n\t\t\t\t...sx,\n\t\t\t} }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t</Box>\n\t);\n}\n"],"mappings":"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","names":["import_store","React","import_store","useSelector","import_react","import_store","useRouteStatus","listenTo","registerRoute","openRoute","isRouteActive","originalSubscribe","BasePortal","import_store","useSelector","useDispatch","React","import_ui","React","import_ui","React","import_ui","TypographySource","React","import_ui"]}

package/dist/index.mjs CHANGED Viewed

@@ -10,10 +10,7 @@ import { __useSelector as useSelector } from "@elementor/store";
 // src/location.ts
 import { createLocation } from "@elementor/locations";
-var {
-  inject: injectIntoPanels,
-  useInjections: usePanelsInjections
-} = createLocation();
+var { inject: injectIntoPanels, useInjections: usePanelsInjections } = createLocation();
 // src/store/selectors.ts
 var selectOpenId = (state) => state.panels.openId;
@@ -43,10 +40,7 @@ import { useMemo } from "react";
 function useOpenPanelInjection() {
   const injections = usePanelsInjections();
   const openId = useSelector(selectOpenId);
-  return useMemo(
-    () => injections.find((injection) => openId === injection.id),
-    [injections, openId]
-  );
+  return useMemo(() => injections.find((injection) => openId === injection.id), [injections, openId]);
 }
 // src/components/internal/portal.tsx
@@ -77,32 +71,20 @@ function useV1PanelStatus() {
   });
 }
 function sync() {
-  listenTo(
-    windowEvent("elementor/panel/init"),
-    () => registerRoute(V2_PANEL)
-  );
-  listenTo(
-    routeOpenEvent(V2_PANEL),
-    () => {
-      getV1PanelElements().forEach((el) => {
-        el.setAttribute("hidden", "hidden");
-        el.setAttribute("aria-hidden", "true");
-      });
-    }
-  );
-  listenTo(
-    routeCloseEvent(V2_PANEL),
-    () => selectOpenId(__getState()) && __dispatch(slice_default.actions.close())
-  );
-  listenTo(
-    routeCloseEvent(V2_PANEL),
-    () => {
-      getV1PanelElements().forEach((el) => {
-        el.removeAttribute("hidden");
-        el.removeAttribute("aria-hidden");
-      });
-    }
-  );
+  listenTo(windowEvent("elementor/panel/init"), () => registerRoute(V2_PANEL));
+  listenTo(routeOpenEvent(V2_PANEL), () => {
+    getV1PanelElements().forEach((el) => {
+      el.setAttribute("hidden", "hidden");
+      el.setAttribute("aria-hidden", "true");
+    });
+  });
+  listenTo(routeCloseEvent(V2_PANEL), () => selectOpenId(__getState()) && __dispatch(slice_default.actions.close()));
+  listenTo(routeCloseEvent(V2_PANEL), () => {
+    getV1PanelElements().forEach((el) => {
+      el.removeAttribute("hidden");
+      el.removeAttribute("aria-hidden");
+    });
+  });
   listenTo(
     windowEvent("elementor/panel/init"),
     () => subscribe({
@@ -279,15 +261,7 @@ var Typography = styled2(TypographySource)(({ theme, variant = "body1" }) => {
   };
 });
 function PanelHeaderTitle({ children, ...props }) {
-  return /* @__PURE__ */ React5.createElement(
-    Typography,
-    {
-      component: "h2",
-      variant: "subtitle1",
-      ...props
-    },
-    children
-  );
+  return /* @__PURE__ */ React5.createElement(Typography, { component: "h2", variant: "subtitle1", ...props }, children);
 }
 // src/components/external/panel-body.tsx

package/dist/index.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/init.ts","../src/components/internal/panels.tsx","../src/hooks/use-open-panel-injection.ts","../src/location.ts","../src/store/selectors.ts","../src/store/slice.ts","../src/components/internal/portal.tsx","../src/sync.ts","../src/api.ts","../src/components/external/panel.tsx","../src/components/external/panel-header.tsx","../src/components/external/panel-header-title.tsx","../src/components/external/panel-body.tsx","../src/index.ts"],"sourcesContent":["import { injectIntoTop } from '@elementor/editor';\nimport { __registerSlice } from '@elementor/store';\nimport Panels from './components/internal/panels';\nimport { sync } from './sync';\nimport { slice } from './store';\n\nexport default function init() {\n\tsync();\n\n\t__registerSlice( slice );\n\n\tinjectIntoTop( { id: 'panels', component: Panels } );\n}\n","import * as React from 'react';\nimport useOpenPanelInjection from '../../hooks/use-open-panel-injection';\nimport Portal from './portal';\n\nexport default function Panels() {\n\tconst openPanel = useOpenPanelInjection();\n\tconst Component = openPanel?.component ?? null;\n\n\tif ( ! Component ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Portal>\n\t\t\t<Component />\n\t\t</Portal>\n\t);\n}\n","import { __useSelector as useSelector } from '@elementor/store';\nimport { usePanelsInjections } from '../location';\nimport { selectOpenId } from '../store';\nimport { useMemo } from 'react';\n\nexport default function useOpenPanelInjection() {\n\tconst injections = usePanelsInjections();\n\tconst openId = useSelector( selectOpenId );\n\n\treturn useMemo(\n\t\t() => injections.find( ( injection ) => openId === injection.id ),\n\t\t[ injections, openId ]\n\t);\n}\n","import { createLocation } from '@elementor/locations';\n\nexport const {\n\tinject: injectIntoPanels,\n\tuseInjections: usePanelsInjections,\n} = createLocation();\n","import { SliceState } from '@elementor/store';\nimport slice from './slice';\n\ntype State = SliceState<typeof slice>;\n\nexport const selectOpenId = ( state: State ) => state.panels.openId;\n","import { __createSlice, PayloadAction } from '@elementor/store';\n\nconst initialState: {\n\topenId: string \| null;\n} = {\n\topenId: null,\n};\n\nexport default __createSlice( {\n\tname: 'panels',\n\tinitialState,\n\treducers: {\n\t\topen( state, action: PayloadAction<string> ) {\n\t\t\tstate.openId = action.payload;\n\t\t},\n\t\tclose( state, action: PayloadAction<string \| undefined> ) {\n\t\t\tif ( ! action.payload \|\| state.openId === action.payload ) {\n\t\t\t\tstate.openId = null;\n\t\t\t}\n\t\t},\n\t},\n} );\n","import * as React from 'react';\nimport { Portal as BasePortal, PortalProps } from '@elementor/ui';\nimport { useRef } from 'react';\nimport { getPortalContainer } from '../../sync';\n\ntype Props = Omit<PortalProps, 'container'>;\n\nexport default function Portal( props: Props ) {\n\tconst containerRef = useRef( getPortalContainer );\n\n\tif ( ! containerRef.current ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<BasePortal container={ containerRef.current } { ...props } />\n\t);\n}\n","import {\n\t__privateOpenRoute as openRoute,\n\t__privateListenTo as listenTo,\n\trouteCloseEvent,\n\t__privateUseRouteStatus as useRouteStatus,\n\trouteOpenEvent,\n\twindowEvent,\n\t__privateRegisterRoute as registerRoute,\n\t__privateIsRouteActive as isRouteActive,\n} from '@elementor/editor-v1-adapters';\nimport { __dispatch, __getState, __subscribe as originalSubscribe } from '@elementor/store';\nimport { selectOpenId, slice } from './store';\n\nconst V2_PANEL = 'panel/v2';\n\nexport function getPortalContainer() {\n\treturn document.querySelector( '#elementor-panel-inner' );\n}\n\nexport function useV1PanelStatus() {\n\t// For now supporting only panels that are not part of the kit and not in preview mode.\n\treturn useRouteStatus( V2_PANEL, {\n\t\tblockOnKitRoutes: true,\n\t\tblockOnPreviewMode: true,\n\t} );\n}\n\nexport function sync() {\n\t// Register the V2 panel route on panel init.\n\tlistenTo(\n\t\twindowEvent( 'elementor/panel/init' ),\n\t\t() => registerRoute( V2_PANEL )\n\t);\n\n\t// On empty route open, hide V1 panel elements.\n\tlistenTo(\n\t\trouteOpenEvent( V2_PANEL ),\n\t\t() => {\n\t\t\tgetV1PanelElements().forEach( ( el ) => {\n\t\t\t\tel.setAttribute( 'hidden', 'hidden' );\n\t\t\t\tel.setAttribute( 'aria-hidden', 'true' );\n\t\t\t} );\n\t\t},\n\t);\n\n\t// On empty route close, close the V2 panel.\n\tlistenTo(\n\t\trouteCloseEvent( V2_PANEL ),\n\t\t() => selectOpenId( __getState() ) && __dispatch( slice.actions.close() )\n\t);\n\n\t// On empty route close, show V1 panel elements.\n\tlistenTo(\n\t\trouteCloseEvent( V2_PANEL ),\n\t\t() => {\n\t\t\tgetV1PanelElements().forEach( ( el ) => {\n\t\t\t\tel.removeAttribute( 'hidden' );\n\t\t\t\tel.removeAttribute( 'aria-hidden' );\n\t\t\t} );\n\t\t},\n\t);\n\n\t// On V2 panel open, open the V2 panel route.\n\tlistenTo(\n\t\twindowEvent( 'elementor/panel/init' ),\n\t\t() => subscribe( {\n\t\t\ton: ( state ) => selectOpenId( state ),\n\t\t\twhen: ( { prev, current } ) => !! ( ! prev && current ), // is panel opened\n\t\t\tcallback: () => openRoute( V2_PANEL ),\n\t\t} )\n\t);\n\n\t// On V2 panel close, close the V2 panel route.\n\tlistenTo(\n\t\twindowEvent( 'elementor/panel/init' ),\n\t\t() => subscribe( {\n\t\t\ton: ( state ) => selectOpenId( state ),\n\t\t\twhen: ( { prev, current } ) => !! ( ! current && prev ), // is panel closed\n\t\t\tcallback: () => isRouteActive( V2_PANEL ) && openRoute( getDefaultRoute() ),\n\t\t} )\n\t);\n}\n\nfunction getV1PanelElements() {\n\tconst v1ElementsSelector = [\n\t\t'#elementor-panel-header-wrapper',\n\t\t'#elementor-panel-content-wrapper',\n\t\t'#elementor-panel-state-loading',\n\t\t'#elementor-panel-footer',\n\t].join( ', ' );\n\n\treturn document.querySelectorAll( v1ElementsSelector );\n}\n\nfunction getDefaultRoute() {\n\ttype ExtendedWindow = Window & {\n\t\telementor?: {\n\t\t\tdocuments?: {\n\t\t\t\tgetCurrent?: () => {\n\t\t\t\t\tconfig?: {\n\t\t\t\t\t\tpanel?: {\n\t\t\t\t\t\t\tdefault_route?: string,\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t}\n\t\t}\n\t}\n\n\tconst defaultRoute = ( window as unknown as ExtendedWindow )\n\t\t?.elementor\n\t\t?.documents\n\t\t?.getCurrent?.()\n\t\t?.config\n\t\t?.panel\n\t\t?.default_route;\n\n\treturn defaultRoute \|\| 'panel/elements/categories';\n}\n\nfunction subscribe<TVal>( {\n\ton,\n\twhen,\n\tcallback,\n}: {\n\ton: ( state: ReturnType<typeof __getState> ) => TVal,\n\twhen: ( { prev, current }: { prev: TVal, current: TVal } ) => boolean,\n\tcallback: ( { prev, current }: { prev: TVal, current: TVal } ) => void,\n} ) {\n\tlet prev: TVal;\n\n\toriginalSubscribe( () => {\n\t\tconst current = on( __getState() );\n\n\t\tif ( when( { prev, current } ) ) {\n\t\t\tcallback( { prev, current } );\n\t\t}\n\n\t\tprev = current;\n\t} );\n}\n","import { ComponentType } from 'react';\nimport { injectIntoPanels } from './location';\nimport { selectOpenId, slice } from './store';\nimport { __useSelector as useSelector, __useDispatch as useDispatch } from '@elementor/store';\nimport { useV1PanelStatus } from './sync';\n\nexport type PanelDeclaration = {\n\tid: string;\n\tcomponent: ComponentType;\n}\n\nexport function createPanel( { id, component }: PanelDeclaration ) {\n\tconst usePanelStatus = createUseStatus( id );\n\tconst usePanelActions = createUseActions( id, usePanelStatus );\n\n\treturn {\n\t\tpanel: {\n\t\t\tid,\n\t\t\tcomponent,\n\t\t},\n\t\tusePanelStatus,\n\t\tusePanelActions,\n\t};\n}\n\nexport function registerPanel( { id, component }: Pick<PanelDeclaration, 'id' \| 'component'> ) {\n\tinjectIntoPanels( {\n\t\tid,\n\t\tcomponent,\n\t} );\n}\n\nfunction createUseStatus( id: PanelDeclaration['id'] ) {\n\treturn () => {\n\t\tconst openPanelId = useSelector( selectOpenId );\n\t\tconst v1PanelStatus = useV1PanelStatus();\n\n\t\treturn {\n\t\t\tisOpen: openPanelId === id && v1PanelStatus.isActive,\n\t\t\tisBlocked: v1PanelStatus.isBlocked,\n\t\t};\n\t};\n}\n\nfunction createUseActions( id: PanelDeclaration['id'], useStatus: ReturnType<typeof createUseStatus> ) {\n\treturn () => {\n\t\tconst dispatch = useDispatch();\n\t\tconst { isBlocked } = useStatus();\n\n\t\treturn {\n\t\t\topen: async () => {\n\t\t\t\tif ( isBlocked ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tdispatch( slice.actions.open( id ) );\n\t\t\t},\n\t\t\tclose: async () => {\n\t\t\t\tif ( isBlocked ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tdispatch( slice.actions.close( id ) );\n\t\t\t},\n\t\t};\n\t};\n}\n","import * as React from 'react';\nimport { Drawer, DrawerProps } from '@elementor/ui';\n\nexport default function Panel( { children, sx, ...props }: DrawerProps ) {\n\treturn (\n\t\t<Drawer\n\t\t\topen={ true }\n\t\t\tvariant=\"persistent\"\n\t\t\tanchor=\"left\"\n\t\t\tPaperProps={ {\n\t\t\t\tsx: {\n\t\t\t\t\tposition: 'relative',\n\t\t\t\t\twidth: '100%',\n\t\t\t\t\tbgcolor: 'background.default',\n\t\t\t\t\tborder: 'none',\n\t\t\t\t},\n\t\t\t} }\n\t\t\tsx={ { height: '100%', ...sx } }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t</Drawer>\n\t);\n}\n","import * as React from 'react';\nimport { Box, BoxProps, Divider, styled } from '@elementor/ui';\n\nconst Header = styled( Box )( ( { theme } ) => ( {\n\theight: theme?.spacing( 6 ) \|\| '48px',\n\tdisplay: 'flex',\n\talignItems: 'center',\n\tjustifyContent: 'center',\n} ) );\n\nexport default function PanelHeader( { children, ...props }: BoxProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Header component=\"header\" { ...props }>\n\t\t\t\t{ children }\n\t\t\t</Header>\n\t\t\t<Divider />\n\t\t</>\n\t);\n}\n","import * as React from 'react';\nimport { Typography as TypographySource, TypographyProps, styled } from '@elementor/ui';\n\n// This is to override Editor reset.scss that overrides eui styles\nconst Typography = styled( TypographySource )<TypographyProps>( ( { theme, variant = 'body1' } ) => {\n\tif ( variant === 'inherit' ) {\n\t\treturn {};\n\t}\n\n\treturn {\n\t\t'&.MuiTypography-root': {\n\t\t\t...theme.typography[ variant ],\n\t\t},\n\t};\n} );\n\nexport default function PanelHeaderTitle( { children, ...props }: TypographyProps ) {\n\treturn (\n\t\t<Typography\n\t\t\tcomponent=\"h2\"\n\t\t\tvariant=\"subtitle1\"\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t</Typography>\n\t);\n}\n","import * as React from 'react';\nimport { Box, BoxProps } from '@elementor/ui';\n\nexport default function PanelBody( { children, sx, ...props }: BoxProps ) {\n\treturn (\n\t\t<Box\n\t\t\tcomponent=\"main\"\n\t\t\tsx={ {\n\t\t\t\toverflowY: 'auto',\n\t\t\t\theight: '100%',\n\t\t\t\t...sx,\n\t\t\t} }\n\t\t\t{ ...props }\n\t\t>{ children }</Box>\n\t);\n}\n","import init from './init';\n\nexport {\n\tcreatePanel as __createPanel,\n\tregisterPanel as __registerPanel,\n} from './api';\n\nexport * from './components/external';\n\ninit();\n"],"mappings":"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","names":["React","useSelector","useSelector","React","React","React","styled","React","Box"]}
1	+ {"version":3,"sources":["../src/init.ts","../src/components/internal/panels.tsx","../src/hooks/use-open-panel-injection.ts","../src/location.ts","../src/store/selectors.ts","../src/store/slice.ts","../src/components/internal/portal.tsx","../src/sync.ts","../src/api.ts","../src/components/external/panel.tsx","../src/components/external/panel-header.tsx","../src/components/external/panel-header-title.tsx","../src/components/external/panel-body.tsx","../src/index.ts"],"sourcesContent":["import { injectIntoTop } from '@elementor/editor';\nimport { __registerSlice } from '@elementor/store';\nimport Panels from './components/internal/panels';\nimport { sync } from './sync';\nimport { slice } from './store';\n\nexport default function init() {\n\tsync();\n\n\t__registerSlice( slice );\n\n\tinjectIntoTop( { id: 'panels', component: Panels } );\n}\n","import * as React from 'react';\nimport useOpenPanelInjection from '../../hooks/use-open-panel-injection';\nimport Portal from './portal';\n\nexport default function Panels() {\n\tconst openPanel = useOpenPanelInjection();\n\tconst Component = openPanel?.component ?? null;\n\n\tif ( ! Component ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Portal>\n\t\t\t<Component />\n\t\t</Portal>\n\t);\n}\n","import { __useSelector as useSelector } from '@elementor/store';\nimport { usePanelsInjections } from '../location';\nimport { selectOpenId } from '../store';\nimport { useMemo } from 'react';\n\nexport default function useOpenPanelInjection() {\n\tconst injections = usePanelsInjections();\n\tconst openId = useSelector( selectOpenId );\n\n\treturn useMemo( () => injections.find( ( injection ) => openId === injection.id ), [ injections, openId ] );\n}\n","import { createLocation } from '@elementor/locations';\n\nexport const { inject: injectIntoPanels, useInjections: usePanelsInjections } = createLocation();\n","import { SliceState } from '@elementor/store';\nimport slice from './slice';\n\ntype State = SliceState< typeof slice >;\n\nexport const selectOpenId = ( state: State ) => state.panels.openId;\n","import { __createSlice, PayloadAction } from '@elementor/store';\n\nconst initialState: {\n\topenId: string \| null;\n} = {\n\topenId: null,\n};\n\nexport default __createSlice( {\n\tname: 'panels',\n\tinitialState,\n\treducers: {\n\t\topen( state, action: PayloadAction< string > ) {\n\t\t\tstate.openId = action.payload;\n\t\t},\n\t\tclose( state, action: PayloadAction< string \| undefined > ) {\n\t\t\tif ( ! action.payload \|\| state.openId === action.payload ) {\n\t\t\t\tstate.openId = null;\n\t\t\t}\n\t\t},\n\t},\n} );\n","import * as React from 'react';\nimport { Portal as BasePortal, PortalProps } from '@elementor/ui';\nimport { useRef } from 'react';\nimport { getPortalContainer } from '../../sync';\n\ntype Props = Omit< PortalProps, 'container' >;\n\nexport default function Portal( props: Props ) {\n\tconst containerRef = useRef( getPortalContainer );\n\n\tif ( ! containerRef.current ) {\n\t\treturn null;\n\t}\n\n\treturn <BasePortal container={ containerRef.current } { ...props } />;\n}\n","import {\n\t__privateOpenRoute as openRoute,\n\t__privateListenTo as listenTo,\n\trouteCloseEvent,\n\t__privateUseRouteStatus as useRouteStatus,\n\trouteOpenEvent,\n\twindowEvent,\n\t__privateRegisterRoute as registerRoute,\n\t__privateIsRouteActive as isRouteActive,\n} from '@elementor/editor-v1-adapters';\nimport { __dispatch, __getState, __subscribe as originalSubscribe } from '@elementor/store';\nimport { selectOpenId, slice } from './store';\n\nconst V2_PANEL = 'panel/v2';\n\nexport function getPortalContainer() {\n\treturn document.querySelector( '#elementor-panel-inner' );\n}\n\nexport function useV1PanelStatus() {\n\t// For now supporting only panels that are not part of the kit and not in preview mode.\n\treturn useRouteStatus( V2_PANEL, {\n\t\tblockOnKitRoutes: true,\n\t\tblockOnPreviewMode: true,\n\t} );\n}\n\nexport function sync() {\n\t// Register the V2 panel route on panel init.\n\tlistenTo( windowEvent( 'elementor/panel/init' ), () => registerRoute( V2_PANEL ) );\n\n\t// On empty route open, hide V1 panel elements.\n\tlistenTo( routeOpenEvent( V2_PANEL ), () => {\n\t\tgetV1PanelElements().forEach( ( el ) => {\n\t\t\tel.setAttribute( 'hidden', 'hidden' );\n\t\t\tel.setAttribute( 'aria-hidden', 'true' );\n\t\t} );\n\t} );\n\n\t// On empty route close, close the V2 panel.\n\tlistenTo( routeCloseEvent( V2_PANEL ), () => selectOpenId( __getState() ) && __dispatch( slice.actions.close() ) );\n\n\t// On empty route close, show V1 panel elements.\n\tlistenTo( routeCloseEvent( V2_PANEL ), () => {\n\t\tgetV1PanelElements().forEach( ( el ) => {\n\t\t\tel.removeAttribute( 'hidden' );\n\t\t\tel.removeAttribute( 'aria-hidden' );\n\t\t} );\n\t} );\n\n\t// On V2 panel open, open the V2 panel route.\n\tlistenTo( windowEvent( 'elementor/panel/init' ), () =>\n\t\tsubscribe( {\n\t\t\ton: ( state ) => selectOpenId( state ),\n\t\t\twhen: ( { prev, current } ) => !! ( ! prev && current ), // is panel opened\n\t\t\tcallback: () => openRoute( V2_PANEL ),\n\t\t} )\n\t);\n\n\t// On V2 panel close, close the V2 panel route.\n\tlistenTo( windowEvent( 'elementor/panel/init' ), () =>\n\t\tsubscribe( {\n\t\t\ton: ( state ) => selectOpenId( state ),\n\t\t\twhen: ( { prev, current } ) => !! ( ! current && prev ), // is panel closed\n\t\t\tcallback: () => isRouteActive( V2_PANEL ) && openRoute( getDefaultRoute() ),\n\t\t} )\n\t);\n}\n\nfunction getV1PanelElements() {\n\tconst v1ElementsSelector = [\n\t\t'#elementor-panel-header-wrapper',\n\t\t'#elementor-panel-content-wrapper',\n\t\t'#elementor-panel-state-loading',\n\t\t'#elementor-panel-footer',\n\t].join( ', ' );\n\n\treturn document.querySelectorAll( v1ElementsSelector );\n}\n\nfunction getDefaultRoute() {\n\ttype ExtendedWindow = Window & {\n\t\telementor?: {\n\t\t\tdocuments?: {\n\t\t\t\tgetCurrent?: () => {\n\t\t\t\t\tconfig?: {\n\t\t\t\t\t\tpanel?: {\n\t\t\t\t\t\t\tdefault_route?: string;\n\t\t\t\t\t\t};\n\t\t\t\t\t};\n\t\t\t\t};\n\t\t\t};\n\t\t};\n\t};\n\n\tconst defaultRoute = ( window as unknown as ExtendedWindow )?.elementor?.documents?.getCurrent?.()?.config?.panel\n\t\t?.default_route;\n\n\treturn defaultRoute \|\| 'panel/elements/categories';\n}\n\nfunction subscribe< TVal >( {\n\ton,\n\twhen,\n\tcallback,\n}: {\n\ton: ( state: ReturnType< typeof __getState > ) => TVal;\n\twhen: ( { prev, current }: { prev: TVal; current: TVal } ) => boolean;\n\tcallback: ( { prev, current }: { prev: TVal; current: TVal } ) => void;\n} ) {\n\tlet prev: TVal;\n\n\toriginalSubscribe( () => {\n\t\tconst current = on( __getState() );\n\n\t\tif ( when( { prev, current } ) ) {\n\t\t\tcallback( { prev, current } );\n\t\t}\n\n\t\tprev = current;\n\t} );\n}\n","import { ComponentType } from 'react';\nimport { injectIntoPanels } from './location';\nimport { selectOpenId, slice } from './store';\nimport { __useSelector as useSelector, __useDispatch as useDispatch } from '@elementor/store';\nimport { useV1PanelStatus } from './sync';\n\nexport type PanelDeclaration = {\n\tid: string;\n\tcomponent: ComponentType;\n};\n\nexport function createPanel( { id, component }: PanelDeclaration ) {\n\tconst usePanelStatus = createUseStatus( id );\n\tconst usePanelActions = createUseActions( id, usePanelStatus );\n\n\treturn {\n\t\tpanel: {\n\t\t\tid,\n\t\t\tcomponent,\n\t\t},\n\t\tusePanelStatus,\n\t\tusePanelActions,\n\t};\n}\n\nexport function registerPanel( { id, component }: Pick< PanelDeclaration, 'id' \| 'component' > ) {\n\tinjectIntoPanels( {\n\t\tid,\n\t\tcomponent,\n\t} );\n}\n\nfunction createUseStatus( id: PanelDeclaration[ 'id' ] ) {\n\treturn () => {\n\t\tconst openPanelId = useSelector( selectOpenId );\n\t\tconst v1PanelStatus = useV1PanelStatus();\n\n\t\treturn {\n\t\t\tisOpen: openPanelId === id && v1PanelStatus.isActive,\n\t\t\tisBlocked: v1PanelStatus.isBlocked,\n\t\t};\n\t};\n}\n\nfunction createUseActions( id: PanelDeclaration[ 'id' ], useStatus: ReturnType< typeof createUseStatus > ) {\n\treturn () => {\n\t\tconst dispatch = useDispatch();\n\t\tconst { isBlocked } = useStatus();\n\n\t\treturn {\n\t\t\topen: async () => {\n\t\t\t\tif ( isBlocked ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tdispatch( slice.actions.open( id ) );\n\t\t\t},\n\t\t\tclose: async () => {\n\t\t\t\tif ( isBlocked ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tdispatch( slice.actions.close( id ) );\n\t\t\t},\n\t\t};\n\t};\n}\n","import * as React from 'react';\nimport { Drawer, DrawerProps } from '@elementor/ui';\n\nexport default function Panel( { children, sx, ...props }: DrawerProps ) {\n\treturn (\n\t\t<Drawer\n\t\t\topen={ true }\n\t\t\tvariant=\"persistent\"\n\t\t\tanchor=\"left\"\n\t\t\tPaperProps={ {\n\t\t\t\tsx: {\n\t\t\t\t\tposition: 'relative',\n\t\t\t\t\twidth: '100%',\n\t\t\t\t\tbgcolor: 'background.default',\n\t\t\t\t\tborder: 'none',\n\t\t\t\t},\n\t\t\t} }\n\t\t\tsx={ { height: '100%', ...sx } }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t</Drawer>\n\t);\n}\n","import * as React from 'react';\nimport { Box, BoxProps, Divider, styled } from '@elementor/ui';\n\nconst Header = styled( Box )( ( { theme } ) => ( {\n\theight: theme?.spacing( 6 ) \|\| '48px',\n\tdisplay: 'flex',\n\talignItems: 'center',\n\tjustifyContent: 'center',\n} ) );\n\nexport default function PanelHeader( { children, ...props }: BoxProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Header component=\"header\" { ...props }>\n\t\t\t\t{ children }\n\t\t\t</Header>\n\t\t\t<Divider />\n\t\t</>\n\t);\n}\n","import * as React from 'react';\nimport { Typography as TypographySource, TypographyProps, styled } from '@elementor/ui';\n\n// This is to override Editor reset.scss that overrides eui styles\nconst Typography = styled( TypographySource )< TypographyProps >( ( { theme, variant = 'body1' } ) => {\n\tif ( variant === 'inherit' ) {\n\t\treturn {};\n\t}\n\n\treturn {\n\t\t'&.MuiTypography-root': {\n\t\t\t...theme.typography[ variant ],\n\t\t},\n\t};\n} );\n\nexport default function PanelHeaderTitle( { children, ...props }: TypographyProps ) {\n\treturn (\n\t\t<Typography component=\"h2\" variant=\"subtitle1\" { ...props }>\n\t\t\t{ children }\n\t\t</Typography>\n\t);\n}\n","import * as React from 'react';\nimport { Box, BoxProps } from '@elementor/ui';\n\nexport default function PanelBody( { children, sx, ...props }: BoxProps ) {\n\treturn (\n\t\t<Box\n\t\t\tcomponent=\"main\"\n\t\t\tsx={ {\n\t\t\t\toverflowY: 'auto',\n\t\t\t\theight: '100%',\n\t\t\t\t...sx,\n\t\t\t} }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t</Box>\n\t);\n}\n","import init from './init';\n\nexport { createPanel as __createPanel, registerPanel as __registerPanel } from './api';\n\nexport * from './components/external';\n\ninit();\n"],"mappings":"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","names":["React","useSelector","useSelector","React","React","React","styled","React","Box"]}

package/package.json CHANGED Viewed

@@ -1,45 +1,45 @@
 {
-	"name": "@elementor/editor-panels",
-	"version": "0.4.15",
-	"private": false,
-	"author": "Elementor Team",
-	"homepage": "https://elementor.com/",
-	"license": "GPL-3.0-or-later",
-	"main": "dist/index.js",
-	"module": "dist/index.mjs",
-	"types": "dist/index.d.ts",
-	"exports": {
-		".": {
-			"import": "./dist/index.mjs",
-			"require": "./dist/index.js",
-			"types": "./dist/index.d.ts"
-		},
-		"./package.json": "./package.json"
-	},
-	"repository": {
-		"type": "git",
-		"url": "https://github.com/elementor/elementor-packages.git",
-		"directory": "packages/core/editor-panels"
-	},
-	"bugs": {
-		"url": "https://github.com/elementor/elementor-packages/issues"
-	},
-	"publishConfig": {
-		"access": "public"
-	},
-	"scripts": {
-		"build": "tsup --config=../../tsup.build.ts",
-		"dev": "tsup --config=../../tsup.dev.ts"
-	},
-	"dependencies": {
-		"@elementor/editor": "^0.11.0",
-		"@elementor/editor-v1-adapters": "^0.7.0",
-		"@elementor/locations": "^0.7.3",
-		"@elementor/store": "^0.8.3",
-		"@elementor/ui": "^1.4.61"
-	},
-	"peerDependencies": {
-		"react": "^18.3.1"
-	},
-	"gitHead": "33d28e27101a9bf272b11d19d7092830e8cb69d0"
+  "name": "@elementor/editor-panels",
+  "version": "0.4.17",
+  "private": false,
+  "author": "Elementor Team",
+  "homepage": "https://elementor.com/",
+  "license": "GPL-3.0-or-later",
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./package.json": "./package.json"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/elementor/elementor-packages.git",
+    "directory": "packages/core/editor-panels"
+  },
+  "bugs": {
+    "url": "https://github.com/elementor/elementor-packages/issues"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsup --config=../../tsup.build.ts",
+    "dev": "tsup --config=../../tsup.dev.ts"
+  },
+  "dependencies": {
+    "@elementor/editor": "^0.11.2",
+    "@elementor/editor-v1-adapters": "^0.8.0",
+    "@elementor/locations": "^0.7.4",
+    "@elementor/store": "^0.8.4",
+    "@elementor/ui": "^1.4.61"
+  },
+  "peerDependencies": {
+    "react": "^18.3.1"
+  },
+  "gitHead": "10fd8663495a9ced2521f27a74879684ed0cf322"
 }

package/src/__tests__/api.test.tsx CHANGED Viewed

@@ -17,11 +17,7 @@ jest.mock( '@elementor/editor-v1-adapters', () => ( {
 } ) );
 describe( '@elementor/editor-panels api', () => {
-	const {
-		panel,
-		usePanelStatus,
-		usePanelActions,
-	} = createPanel( {
+	const { panel, usePanelStatus, usePanelActions } = createPanel( {
 		id: 'test-panel',
 		component: () => (
 			<Panel>
@@ -41,7 +37,7 @@ describe( '@elementor/editor-panels api', () => {
 			const { open, close } = usePanelActions();
 			return (
-				<button onClick={ () => isOpen ? close() : open() } disabled={ isBlocked }>
+				<button onClick={ () => ( isOpen ? close() : open() ) } disabled={ isBlocked }>
 					{ isOpen ? 'Close Panel' : 'Open Panel' }
 				</button>
 			);

package/src/__tests__/sync.test.tsx CHANGED Viewed

@@ -1,5 +1,9 @@
 import { sync } from '../sync';
-import { __privateIsRouteActive as isRouteActive, __privateOpenRoute as openRoute, __privateRegisterRoute as registerRoute } from '@elementor/editor-v1-adapters';
+import {
+	__privateIsRouteActive as isRouteActive,
+	__privateOpenRoute as openRoute,
+	__privateRegisterRoute as registerRoute,
+} from '@elementor/editor-v1-adapters';
 import { __createStore, __dispatch, __getState, __registerSlice } from '@elementor/store';
 import { selectOpenId, slice } from '../store';
@@ -89,9 +93,11 @@ describe( '@elementor/editor-panels sync', () => {
 		__dispatch( slice.actions.open( 'test' ) );
 		// Act.
-		window.dispatchEvent( new CustomEvent( 'elementor/routes/close', {
-			detail: { route: 'panel/v2' },
-		} ) );
+		window.dispatchEvent(
+			new CustomEvent( 'elementor/routes/close', {
+				detail: { route: 'panel/v2' },
+			} )
+		);
 		// Act.
 		expect( selectOpenId( __getState() ) ).toBe( null );
@@ -102,9 +108,11 @@ describe( '@elementor/editor-panels sync', () => {
 		document.body.innerHTML = v1PanelElementsIds.map( ( id ) => `<div id="${ id }"></div>` ).join( '' );
 		// Act.
-		window.dispatchEvent( new CustomEvent( 'elementor/routes/open', {
-			detail: { route: 'panel/v2' },
-		} ) );
+		window.dispatchEvent(
+			new CustomEvent( 'elementor/routes/open', {
+				detail: { route: 'panel/v2' },
+			} )
+		);
 		// Assert.
 		v1PanelElementsIds.forEach( ( id ) => {
@@ -114,12 +122,16 @@ describe( '@elementor/editor-panels sync', () => {
 	it( 'should show old panel elements when navigating out of the empty route', () => {
 		// Arrange.
-		document.body.innerHTML = v1PanelElementsIds.map( ( id ) => `<div id="${ id }" aria-hidden="true" hidden="hidden"></div>` ).join( '' );
+		document.body.innerHTML = v1PanelElementsIds
+			.map( ( id ) => `<div id="${ id }" aria-hidden="true" hidden="hidden"></div>` )
+			.join( '' );
 		// Act.
-		window.dispatchEvent( new CustomEvent( 'elementor/routes/close', {
-			detail: { route: 'panel/v2' },
-		} ) );
+		window.dispatchEvent(
+			new CustomEvent( 'elementor/routes/close', {
+				detail: { route: 'panel/v2' },
+			} )
+		);
 		// Assert.
 		v1PanelElementsIds.forEach( ( id ) => {

package/src/api.ts CHANGED Viewed

@@ -7,7 +7,7 @@ import { useV1PanelStatus } from './sync';
 export type PanelDeclaration = {
 	id: string;
 	component: ComponentType;
-}
+};
 export function createPanel( { id, component }: PanelDeclaration ) {
 	const usePanelStatus = createUseStatus( id );
@@ -23,14 +23,14 @@ export function createPanel( { id, component }: PanelDeclaration ) {
 	};
 }
-export function registerPanel( { id, component }: Pick<PanelDeclaration, 'id' | 'component'> ) {
+export function registerPanel( { id, component }: Pick< PanelDeclaration, 'id' | 'component' > ) {
 	injectIntoPanels( {
 		id,
 		component,
 	} );
 }
-function createUseStatus( id: PanelDeclaration['id'] ) {
+function createUseStatus( id: PanelDeclaration[ 'id' ] ) {
 	return () => {
 		const openPanelId = useSelector( selectOpenId );
 		const v1PanelStatus = useV1PanelStatus();
@@ -42,7 +42,7 @@ function createUseStatus( id: PanelDeclaration['id'] ) {
 	};
 }
-function createUseActions( id: PanelDeclaration['id'], useStatus: ReturnType<typeof createUseStatus> ) {
+function createUseActions( id: PanelDeclaration[ 'id' ], useStatus: ReturnType< typeof createUseStatus > ) {
 	return () => {
 		const dispatch = useDispatch();
 		const { isBlocked } = useStatus();

package/src/components/external/panel-body.tsx CHANGED Viewed

@@ -11,6 +11,8 @@ export default function PanelBody( { children, sx, ...props }: BoxProps ) {
 				...sx,
 			} }
 			{ ...props }
-		>{ children }</Box>
+		>
+			{ children }
+		</Box>
 	);
 }

package/src/components/external/panel-header-title.tsx CHANGED Viewed

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Typography as TypographySource, TypographyProps, styled } from '@elementor/ui';
 // This is to override Editor reset.scss that overrides eui styles
-const Typography = styled( TypographySource )<TypographyProps>( ( { theme, variant = 'body1' } ) => {
+const Typography = styled( TypographySource )< TypographyProps >( ( { theme, variant = 'body1' } ) => {
 	if ( variant === 'inherit' ) {
 		return {};
 	}
@@ -16,11 +16,7 @@ const Typography = styled( TypographySource )<TypographyProps>( ( { theme, varia
 export default function PanelHeaderTitle( { children, ...props }: TypographyProps ) {
 	return (
-		<Typography
-			component="h2"
-			variant="subtitle1"
-			{ ...props }
-		>
+		<Typography component="h2" variant="subtitle1" { ...props }>
 			{ children }
 		</Typography>
 	);

package/src/components/internal/portal.tsx CHANGED Viewed

@@ -3,7 +3,7 @@ import { Portal as BasePortal, PortalProps } from '@elementor/ui';
 import { useRef } from 'react';
 import { getPortalContainer } from '../../sync';
-type Props = Omit<PortalProps, 'container'>;
+type Props = Omit< PortalProps, 'container' >;
 export default function Portal( props: Props ) {
 	const containerRef = useRef( getPortalContainer );
@@ -12,7 +12,5 @@ export default function Portal( props: Props ) {
 		return null;
 	}
-	return (
-		<BasePortal container={ containerRef.current } { ...props } />
-	);
+	return <BasePortal container={ containerRef.current } { ...props } />;
 }

package/src/hooks/use-open-panel-injection.ts CHANGED Viewed

@@ -7,8 +7,5 @@ export default function useOpenPanelInjection() {
 	const injections = usePanelsInjections();
 	const openId = useSelector( selectOpenId );
-	return useMemo(
-		() => injections.find( ( injection ) => openId === injection.id ),
-		[ injections, openId ]
-	);
+	return useMemo( () => injections.find( ( injection ) => openId === injection.id ), [ injections, openId ] );
 }

package/src/index.ts CHANGED Viewed

@@ -1,9 +1,6 @@
 import init from './init';
-export {
-	createPanel as __createPanel,
-	registerPanel as __registerPanel,
-} from './api';
+export { createPanel as __createPanel, registerPanel as __registerPanel } from './api';
 export * from './components/external';

package/src/location.ts CHANGED Viewed

@@ -1,6 +1,3 @@
 import { createLocation } from '@elementor/locations';
-export const {
-	inject: injectIntoPanels,
-	useInjections: usePanelsInjections,
-} = createLocation();
+export const { inject: injectIntoPanels, useInjections: usePanelsInjections } = createLocation();

package/src/store/selectors.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import { SliceState } from '@elementor/store';
 import slice from './slice';
-type State = SliceState<typeof slice>;
+type State = SliceState< typeof slice >;
 export const selectOpenId = ( state: State ) => state.panels.openId;

package/src/store/slice.ts CHANGED Viewed

@@ -10,10 +10,10 @@ export default __createSlice( {
 	name: 'panels',
 	initialState,
 	reducers: {
-		open( state, action: PayloadAction<string> ) {
+		open( state, action: PayloadAction< string > ) {
 			state.openId = action.payload;
 		},
-		close( state, action: PayloadAction<string | undefined> ) {
+		close( state, action: PayloadAction< string | undefined > ) {
 			if ( ! action.payload || state.openId === action.payload ) {
 				state.openId = null;
 			}

package/src/sync.ts CHANGED Viewed

@@ -27,43 +27,30 @@ export function useV1PanelStatus() {
 export function sync() {
 	// Register the V2 panel route on panel init.
-	listenTo(
-		windowEvent( 'elementor/panel/init' ),
-		() => registerRoute( V2_PANEL )
-	);
+	listenTo( windowEvent( 'elementor/panel/init' ), () => registerRoute( V2_PANEL ) );
 	// On empty route open, hide V1 panel elements.
-	listenTo(
-		routeOpenEvent( V2_PANEL ),
-		() => {
-			getV1PanelElements().forEach( ( el ) => {
-				el.setAttribute( 'hidden', 'hidden' );
-				el.setAttribute( 'aria-hidden', 'true' );
-			} );
-		},
-	);
+	listenTo( routeOpenEvent( V2_PANEL ), () => {
+		getV1PanelElements().forEach( ( el ) => {
+			el.setAttribute( 'hidden', 'hidden' );
+			el.setAttribute( 'aria-hidden', 'true' );
+		} );
+	} );
 	// On empty route close, close the V2 panel.
-	listenTo(
-		routeCloseEvent( V2_PANEL ),
-		() => selectOpenId( __getState() ) && __dispatch( slice.actions.close() )
-	);
+	listenTo( routeCloseEvent( V2_PANEL ), () => selectOpenId( __getState() ) && __dispatch( slice.actions.close() ) );
 	// On empty route close, show V1 panel elements.
-	listenTo(
-		routeCloseEvent( V2_PANEL ),
-		() => {
-			getV1PanelElements().forEach( ( el ) => {
-				el.removeAttribute( 'hidden' );
-				el.removeAttribute( 'aria-hidden' );
-			} );
-		},
-	);
+	listenTo( routeCloseEvent( V2_PANEL ), () => {
+		getV1PanelElements().forEach( ( el ) => {
+			el.removeAttribute( 'hidden' );
+			el.removeAttribute( 'aria-hidden' );
+		} );
+	} );
 	// On V2 panel open, open the V2 panel route.
-	listenTo(
-		windowEvent( 'elementor/panel/init' ),
-		() => subscribe( {
+	listenTo( windowEvent( 'elementor/panel/init' ), () =>
+		subscribe( {
 			on: ( state ) => selectOpenId( state ),
 			when: ( { prev, current } ) => !! ( ! prev && current ), // is panel opened
 			callback: () => openRoute( V2_PANEL ),
@@ -71,9 +58,8 @@ export function sync() {
 	);
 	// On V2 panel close, close the V2 panel route.
-	listenTo(
-		windowEvent( 'elementor/panel/init' ),
-		() => subscribe( {
+	listenTo( windowEvent( 'elementor/panel/init' ), () =>
+		subscribe( {
 			on: ( state ) => selectOpenId( state ),
 			when: ( { prev, current } ) => !! ( ! current && prev ), // is panel closed
 			callback: () => isRouteActive( V2_PANEL ) && openRoute( getDefaultRoute() ),
@@ -99,33 +85,28 @@ function getDefaultRoute() {
 				getCurrent?: () => {
 					config?: {
 						panel?: {
-							default_route?: string,
-						}
-					}
-				},
-			}
-		}
-	}
-	const defaultRoute = ( window as unknown as ExtendedWindow )
-		?.elementor
-		?.documents
-		?.getCurrent?.()
-		?.config
-		?.panel
+							default_route?: string;
+						};
+					};
+				};
+			};
+		};
+	};
+	const defaultRoute = ( window as unknown as ExtendedWindow )?.elementor?.documents?.getCurrent?.()?.config?.panel
 		?.default_route;
 	return defaultRoute || 'panel/elements/categories';
 }
-function subscribe<TVal>( {
+function subscribe< TVal >( {
 	on,
 	when,
 	callback,
 }: {
-	on: ( state: ReturnType<typeof __getState> ) => TVal,
-	when: ( { prev, current }: { prev: TVal, current: TVal } ) => boolean,
-	callback: ( { prev, current }: { prev: TVal, current: TVal } ) => void,
+	on: ( state: ReturnType< typeof __getState > ) => TVal;
+	when: ( { prev, current }: { prev: TVal; current: TVal } ) => boolean;
+	callback: ( { prev, current }: { prev: TVal; current: TVal } ) => void;
 } ) {
 	let prev: TVal;