@elementor/editor-panels 0.4.16 → 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
  1. package/CHANGELOG.md +10 -116
  2. package/dist/index.js +17 -43
  3. package/dist/index.js.map +1 -1
  4. package/dist/index.mjs +17 -43
  5. package/dist/index.mjs.map +1 -1
  6. package/package.json +43 -43
  7. package/src/__tests__/api.test.tsx +2 -6
  8. package/src/__tests__/sync.test.tsx +23 -11
  9. package/src/api.ts +4 -4
  10. package/src/components/external/panel-body.tsx +3 -1
  11. package/src/components/external/panel-header-title.tsx +2 -6
  12. package/src/components/internal/portal.tsx +2 -4
  13. package/src/hooks/use-open-panel-injection.ts +1 -4
  14. package/src/index.ts +1 -4
  15. package/src/location.ts +1 -4
  16. package/src/store/selectors.ts +1 -1
  17. package/src/store/slice.ts +2 -2
  18. package/src/sync.ts +31 -50
package/CHANGELOG.md CHANGED
@@ -3,235 +3,129 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
- ## [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)
6
+ ## [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)
7
7
 
8
8
  **Note:** Version bump only for package @elementor/editor-panels
9
9
 
10
+ ## [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)
10
11
 
11
-
12
-
12
+ **Note:** Version bump only for package @elementor/editor-panels
13
13
 
14
14
  ## [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)
15
15
 
16
16
  **Note:** Version bump only for package @elementor/editor-panels
17
17
 
18
-
19
-
20
-
21
-
22
18
  ## [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)
23
19
 
24
20
  **Note:** Version bump only for package @elementor/editor-panels
25
21
 
26
-
27
-
28
-
29
-
30
22
  ## [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)
31
23
 
32
24
  **Note:** Version bump only for package @elementor/editor-panels
33
25
 
34
-
35
-
36
-
37
-
38
26
  ## [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)
39
27
 
40
28
  **Note:** Version bump only for package @elementor/editor-panels
41
29
 
42
-
43
-
44
-
45
-
46
30
  ## [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)
47
31
 
48
32
  **Note:** Version bump only for package @elementor/editor-panels
49
33
 
50
-
51
-
52
-
53
-
54
34
  ## [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)
55
35
 
56
36
  **Note:** Version bump only for package @elementor/editor-panels
57
37
 
58
-
59
-
60
-
61
-
62
38
  ## [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)
63
39
 
64
40
  **Note:** Version bump only for package @elementor/editor-panels
65
41
 
66
-
67
-
68
-
69
-
70
42
  ## [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)
71
43
 
72
44
  **Note:** Version bump only for package @elementor/editor-panels
73
45
 
74
-
75
-
76
-
77
-
78
46
  ## [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)
79
47
 
80
48
  **Note:** Version bump only for package @elementor/editor-panels
81
49
 
82
-
83
-
84
-
85
-
86
50
  ## [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)
87
51
 
88
-
89
52
  ### Bug Fixes
90
53
 
91
- * **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))
92
-
93
-
94
-
95
-
54
+ - **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))
96
55
 
97
56
  ## [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)
98
57
 
99
58
  **Note:** Version bump only for package @elementor/editor-panels
100
59
 
101
-
102
-
103
-
104
-
105
60
  ## [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)
106
61
 
107
62
  **Note:** Version bump only for package @elementor/editor-panels
108
63
 
109
-
110
-
111
-
112
-
113
64
  ## [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)
114
65
 
115
66
  **Note:** Version bump only for package @elementor/editor-panels
116
67
 
117
-
118
-
119
-
120
-
121
68
  ## [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)
122
69
 
123
70
  **Note:** Version bump only for package @elementor/editor-panels
124
71
 
125
-
126
-
127
-
128
-
129
72
  ## [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)
130
73
 
131
74
  **Note:** Version bump only for package @elementor/editor-panels
132
75
 
133
-
134
-
135
-
136
-
137
76
  # [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)
138
77
 
139
-
140
78
  ### Features
141
79
 
142
- * **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))
143
-
144
-
145
-
146
-
80
+ - **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))
147
81
 
148
82
  # [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)
149
83
 
150
-
151
84
  ### Bug Fixes
152
85
 
153
- * ui adaptations [ED-11933] ([#107](https://github.com/elementor/elementor-packages/issues/107)) ([18ef329](https://github.com/elementor/elementor-packages/commit/18ef32928cbe921d7f5340c37c3c965b117d8d63))
154
-
86
+ - ui adaptations [ED-11933] ([#107](https://github.com/elementor/elementor-packages/issues/107)) ([18ef329](https://github.com/elementor/elementor-packages/commit/18ef32928cbe921d7f5340c37c3c965b117d8d63))
155
87
 
156
88
  ### Features
157
89
 
158
- * **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))
159
- * **store:** mark experimental functions [ED-12070] ([#114](https://github.com/elementor/elementor-packages/issues/114)) ([d790829](https://github.com/elementor/elementor-packages/commit/d79082911195c75f6d3a89a5619b234e2f5ce158))
160
-
161
-
162
-
163
-
90
+ - **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))
91
+ - **store:** mark experimental functions [ED-12070] ([#114](https://github.com/elementor/elementor-packages/issues/114)) ([d790829](https://github.com/elementor/elementor-packages/commit/d79082911195c75f6d3a89a5619b234e2f5ce158))
164
92
 
165
93
  ## [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)
166
94
 
167
95
  **Note:** Version bump only for package @elementor/editor-panels
168
96
 
169
-
170
-
171
-
172
-
173
97
  # [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)
174
98
 
175
-
176
99
  ### Features
177
100
 
178
- * **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))
179
-
180
-
181
-
182
-
101
+ - **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))
183
102
 
184
103
  ## [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)
185
104
 
186
105
  **Note:** Version bump only for package @elementor/editor-panels
187
106
 
188
-
189
-
190
-
191
-
192
107
  ## [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)
193
108
 
194
109
  **Note:** Version bump only for package @elementor/editor-panels
195
110
 
196
-
197
-
198
-
199
-
200
111
  ## [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)
201
112
 
202
113
  **Note:** Version bump only for package @elementor/editor-panels
203
114
 
204
-
205
-
206
-
207
-
208
115
  ## [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)
209
116
 
210
117
  **Note:** Version bump only for package @elementor/editor-panels
211
118
 
212
-
213
-
214
-
215
-
216
119
  ## [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)
217
120
 
218
121
  **Note:** Version bump only for package @elementor/editor-panels
219
122
 
220
-
221
-
222
-
223
-
224
123
  ## [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)
225
124
 
226
125
  **Note:** Version bump only for package @elementor/editor-panels
227
126
 
228
-
229
-
230
-
231
-
232
127
  # 0.1.0 (2023-06-11)
233
128
 
234
-
235
129
  ### Features
236
130
 
237
- * **editor-panels:** init [ED-10804] ([#44](https://github.com/elementor/elementor-packages/issues/44)) ([1ed4113](https://github.com/elementor/elementor-packages/commit/1ed41131db8fb9151163175bfa614f784159e04b))
131
+ - **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
@@ -51,10 +51,7 @@ var import_store2 = require("@elementor/store");
51
51
 
52
52
  // src/location.ts
53
53
  var import_locations = require("@elementor/locations");
54
- var {
55
- inject: injectIntoPanels,
56
- useInjections: usePanelsInjections
57
- } = (0, import_locations.createLocation)();
54
+ var { inject: injectIntoPanels, useInjections: usePanelsInjections } = (0, import_locations.createLocation)();
58
55
 
59
56
  // src/store/selectors.ts
60
57
  var selectOpenId = (state) => state.panels.openId;
@@ -84,10 +81,7 @@ var import_react = require("react");
84
81
  function useOpenPanelInjection() {
85
82
  const injections = usePanelsInjections();
86
83
  const openId = (0, import_store2.__useSelector)(selectOpenId);
87
- return (0, import_react.useMemo)(
88
- () => injections.find((injection) => openId === injection.id),
89
- [injections, openId]
90
- );
84
+ return (0, import_react.useMemo)(() => injections.find((injection) => openId === injection.id), [injections, openId]);
91
85
  }
92
86
 
93
87
  // src/components/internal/portal.tsx
@@ -109,32 +103,20 @@ function useV1PanelStatus() {
109
103
  });
110
104
  }
111
105
  function sync() {
112
- (0, import_editor_v1_adapters.__privateListenTo)(
113
- (0, import_editor_v1_adapters.windowEvent)("elementor/panel/init"),
114
- () => (0, import_editor_v1_adapters.__privateRegisterRoute)(V2_PANEL)
115
- );
116
- (0, import_editor_v1_adapters.__privateListenTo)(
117
- (0, import_editor_v1_adapters.routeOpenEvent)(V2_PANEL),
118
- () => {
119
- getV1PanelElements().forEach((el) => {
120
- el.setAttribute("hidden", "hidden");
121
- el.setAttribute("aria-hidden", "true");
122
- });
123
- }
124
- );
125
- (0, import_editor_v1_adapters.__privateListenTo)(
126
- (0, import_editor_v1_adapters.routeCloseEvent)(V2_PANEL),
127
- () => selectOpenId((0, import_store4.__getState)()) && (0, import_store4.__dispatch)(slice_default.actions.close())
128
- );
129
- (0, import_editor_v1_adapters.__privateListenTo)(
130
- (0, import_editor_v1_adapters.routeCloseEvent)(V2_PANEL),
131
- () => {
132
- getV1PanelElements().forEach((el) => {
133
- el.removeAttribute("hidden");
134
- el.removeAttribute("aria-hidden");
135
- });
136
- }
137
- );
106
+ (0, import_editor_v1_adapters.__privateListenTo)((0, import_editor_v1_adapters.windowEvent)("elementor/panel/init"), () => (0, import_editor_v1_adapters.__privateRegisterRoute)(V2_PANEL));
107
+ (0, import_editor_v1_adapters.__privateListenTo)((0, import_editor_v1_adapters.routeOpenEvent)(V2_PANEL), () => {
108
+ getV1PanelElements().forEach((el) => {
109
+ el.setAttribute("hidden", "hidden");
110
+ el.setAttribute("aria-hidden", "true");
111
+ });
112
+ });
113
+ (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()));
114
+ (0, import_editor_v1_adapters.__privateListenTo)((0, import_editor_v1_adapters.routeCloseEvent)(V2_PANEL), () => {
115
+ getV1PanelElements().forEach((el) => {
116
+ el.removeAttribute("hidden");
117
+ el.removeAttribute("aria-hidden");
118
+ });
119
+ });
138
120
  (0, import_editor_v1_adapters.__privateListenTo)(
139
121
  (0, import_editor_v1_adapters.windowEvent)("elementor/panel/init"),
140
122
  () => subscribe({
@@ -311,15 +293,7 @@ var Typography = (0, import_ui4.styled)(import_ui4.Typography)(({ theme, variant
311
293
  };
312
294
  });
313
295
  function PanelHeaderTitle({ children, ...props }) {
314
- return /* @__PURE__ */ React5.createElement(
315
- Typography,
316
- {
317
- component: "h2",
318
- variant: "subtitle1",
319
- ...props
320
- },
321
- children
322
- );
296
+ return /* @__PURE__ */ React5.createElement(Typography, { component: "h2", variant: "subtitle1", ...props }, children);
323
297
  }
324
298
 
325
299
  // src/components/external/panel-body.tsx
package/dist/index.js.map CHANGED
@@ -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
@@ -10,10 +10,7 @@ import { __useSelector as useSelector } from "@elementor/store";
10
10
 
11
11
  // src/location.ts
12
12
  import { createLocation } from "@elementor/locations";
13
- var {
14
- inject: injectIntoPanels,
15
- useInjections: usePanelsInjections
16
- } = createLocation();
13
+ var { inject: injectIntoPanels, useInjections: usePanelsInjections } = createLocation();
17
14
 
18
15
  // src/store/selectors.ts
19
16
  var selectOpenId = (state) => state.panels.openId;
@@ -43,10 +40,7 @@ import { useMemo } from "react";
43
40
  function useOpenPanelInjection() {
44
41
  const injections = usePanelsInjections();
45
42
  const openId = useSelector(selectOpenId);
46
- return useMemo(
47
- () => injections.find((injection) => openId === injection.id),
48
- [injections, openId]
49
- );
43
+ return useMemo(() => injections.find((injection) => openId === injection.id), [injections, openId]);
50
44
  }
51
45
 
52
46
  // src/components/internal/portal.tsx
@@ -77,32 +71,20 @@ function useV1PanelStatus() {
77
71
  });
78
72
  }
79
73
  function sync() {
80
- listenTo(
81
- windowEvent("elementor/panel/init"),
82
- () => registerRoute(V2_PANEL)
83
- );
84
- listenTo(
85
- routeOpenEvent(V2_PANEL),
86
- () => {
87
- getV1PanelElements().forEach((el) => {
88
- el.setAttribute("hidden", "hidden");
89
- el.setAttribute("aria-hidden", "true");
90
- });
91
- }
92
- );
93
- listenTo(
94
- routeCloseEvent(V2_PANEL),
95
- () => selectOpenId(__getState()) && __dispatch(slice_default.actions.close())
96
- );
97
- listenTo(
98
- routeCloseEvent(V2_PANEL),
99
- () => {
100
- getV1PanelElements().forEach((el) => {
101
- el.removeAttribute("hidden");
102
- el.removeAttribute("aria-hidden");
103
- });
104
- }
105
- );
74
+ listenTo(windowEvent("elementor/panel/init"), () => registerRoute(V2_PANEL));
75
+ listenTo(routeOpenEvent(V2_PANEL), () => {
76
+ getV1PanelElements().forEach((el) => {
77
+ el.setAttribute("hidden", "hidden");
78
+ el.setAttribute("aria-hidden", "true");
79
+ });
80
+ });
81
+ listenTo(routeCloseEvent(V2_PANEL), () => selectOpenId(__getState()) && __dispatch(slice_default.actions.close()));
82
+ listenTo(routeCloseEvent(V2_PANEL), () => {
83
+ getV1PanelElements().forEach((el) => {
84
+ el.removeAttribute("hidden");
85
+ el.removeAttribute("aria-hidden");
86
+ });
87
+ });
106
88
  listenTo(
107
89
  windowEvent("elementor/panel/init"),
108
90
  () => subscribe({
@@ -279,15 +261,7 @@ var Typography = styled2(TypographySource)(({ theme, variant = "body1" }) => {
279
261
  };
280
262
  });
281
263
  function PanelHeaderTitle({ children, ...props }) {
282
- return /* @__PURE__ */ React5.createElement(
283
- Typography,
284
- {
285
- component: "h2",
286
- variant: "subtitle1",
287
- ...props
288
- },
289
- children
290
- );
264
+ return /* @__PURE__ */ React5.createElement(Typography, { component: "h2", variant: "subtitle1", ...props }, children);
291
265
  }
292
266
 
293
267
  // src/components/external/panel-body.tsx
package/dist/index.mjs.map CHANGED
@@ -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":";AAAA,SAAS,qBAAqB;AAC9B,SAAS,uBAAuB;;;ACDhC,YAAYA,YAAW;;;ACAvB,SAAS,iBAAiB,mBAAmB;;;ACA7C,SAAS,sBAAsB;AAExB,IAAM,EAAE,QAAQ,kBAAkB,eAAe,oBAAoB,IAAI,eAAe;;;ACGxF,IAAM,eAAe,CAAE,UAAkB,MAAM,OAAO;;;ACL7D,SAAS,qBAAoC;AAE7C,IAAM,eAEF;AAAA,EACH,QAAQ;AACT;AAEA,IAAO,gBAAQ,cAAe;AAAA,EAC7B,MAAM;AAAA,EACN;AAAA,EACA,UAAU;AAAA,IACT,KAAM,OAAO,QAAkC;AAC9C,YAAM,SAAS,OAAO;AAAA,IACvB;AAAA,IACA,MAAO,OAAO,QAA8C;AAC3D,UAAK,CAAE,OAAO,WAAW,MAAM,WAAW,OAAO,SAAU;AAC1D,cAAM,SAAS;AAAA,MAChB;AAAA,IACD;AAAA,EACD;AACD,CAAE;;;AHlBF,SAAS,eAAe;AAET,SAAR,wBAAyC;AAC/C,QAAM,aAAa,oBAAoB;AACvC,QAAM,SAAS,YAAa,YAAa;AAEzC,SAAO,QAAS,MAAM,WAAW,KAAM,CAAE,cAAe,WAAW,UAAU,EAAG,GAAG,CAAE,YAAY,MAAO,CAAE;AAC3G;;;AIVA,YAAY,WAAW;AACvB,SAAS,UAAU,kBAA+B;AAClD,SAAS,cAAc;;;ACFvB;AAAA,EACC,sBAAsB;AAAA,EACtB,qBAAqB;AAAA,EACrB;AAAA,EACA,2BAA2B;AAAA,EAC3B;AAAA,EACA;AAAA,EACA,0BAA0B;AAAA,EAC1B,0BAA0B;AAAA,OACpB;AACP,SAAS,YAAY,YAAY,eAAe,yBAAyB;AAGzE,IAAM,WAAW;AAEV,SAAS,qBAAqB;AACpC,SAAO,SAAS,cAAe,wBAAyB;AACzD;AAEO,SAAS,mBAAmB;AAElC,SAAO,eAAgB,UAAU;AAAA,IAChC,kBAAkB;AAAA,IAClB,oBAAoB;AAAA,EACrB,CAAE;AACH;AAEO,SAAS,OAAO;AAEtB,WAAU,YAAa,sBAAuB,GAAG,MAAM,cAAe,QAAS,CAAE;AAGjF,WAAU,eAAgB,QAAS,GAAG,MAAM;AAC3C,uBAAmB,EAAE,QAAS,CAAE,OAAQ;AACvC,SAAG,aAAc,UAAU,QAAS;AACpC,SAAG,aAAc,eAAe,MAAO;AAAA,IACxC,CAAE;AAAA,EACH,CAAE;AAGF,WAAU,gBAAiB,QAAS,GAAG,MAAM,aAAc,WAAW,CAAE,KAAK,WAAY,cAAM,QAAQ,MAAM,CAAE,CAAE;AAGjH,WAAU,gBAAiB,QAAS,GAAG,MAAM;AAC5C,uBAAmB,EAAE,QAAS,CAAE,OAAQ;AACvC,SAAG,gBAAiB,QAAS;AAC7B,SAAG,gBAAiB,aAAc;AAAA,IACnC,CAAE;AAAA,EACH,CAAE;AAGF;AAAA,IAAU,YAAa,sBAAuB;AAAA,IAAG,MAChD,UAAW;AAAA,MACV,IAAI,CAAE,UAAW,aAAc,KAAM;AAAA,MACrC,MAAM,CAAE,EAAE,MAAM,QAAQ,MAAO,CAAC,EAAI,CAAE,QAAQ;AAAA;AAAA,MAC9C,UAAU,MAAM,UAAW,QAAS;AAAA,IACrC,CAAE;AAAA,EACH;AAGA;AAAA,IAAU,YAAa,sBAAuB;AAAA,IAAG,MAChD,UAAW;AAAA,MACV,IAAI,CAAE,UAAW,aAAc,KAAM;AAAA,MACrC,MAAM,CAAE,EAAE,MAAM,QAAQ,MAAO,CAAC,EAAI,CAAE,WAAW;AAAA;AAAA,MACjD,UAAU,MAAM,cAAe,QAAS,KAAK,UAAW,gBAAgB,CAAE;AAAA,IAC3E,CAAE;AAAA,EACH;AACD;AAEA,SAAS,qBAAqB;AAC7B,QAAM,qBAAqB;AAAA,IAC1B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,EAAE,KAAM,IAAK;AAEb,SAAO,SAAS,iBAAkB,kBAAmB;AACtD;AAEA,SAAS,kBAAkB;AAe1B,QAAM,eAAiB,QAAuC,WAAW,WAAW,aAAa,GAAG,QAAQ,OACzG;AAEH,SAAO,gBAAgB;AACxB;AAEA,SAAS,UAAmB;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AACD,GAII;AACH,MAAI;AAEJ,oBAAmB,MAAM;AACxB,UAAM,UAAU,GAAI,WAAW,CAAE;AAEjC,QAAK,KAAM,EAAE,MAAM,QAAQ,CAAE,GAAI;AAChC,eAAU,EAAE,MAAM,QAAQ,CAAE;AAAA,IAC7B;AAEA,WAAO;AAAA,EACR,CAAE;AACH;;;ADlHe,SAAR,OAAyB,OAAe;AAC9C,QAAM,eAAe,OAAQ,kBAAmB;AAEhD,MAAK,CAAE,aAAa,SAAU;AAC7B,WAAO;AAAA,EACR;AAEA,SAAO,oCAAC,cAAW,WAAY,aAAa,SAAY,GAAG,OAAQ;AACpE;;;ALXe,SAAR,SAA0B;AAChC,QAAM,YAAY,sBAAsB;AACxC,QAAM,YAAY,WAAW,aAAa;AAE1C,MAAK,CAAE,WAAY;AAClB,WAAO;AAAA,EACR;AAEA,SACC,qCAAC,cACA,qCAAC,eAAU,CACZ;AAEF;;;ADXe,SAAR,OAAwB;AAC9B,OAAK;AAEL,kBAAiB,aAAM;AAEvB,gBAAe,EAAE,IAAI,UAAU,WAAW,OAAO,CAAE;AACpD;;;AQTA,SAAS,iBAAiBC,cAAa,iBAAiB,mBAAmB;AAQpE,SAAS,YAAa,EAAE,IAAI,UAAU,GAAsB;AAClE,QAAM,iBAAiB,gBAAiB,EAAG;AAC3C,QAAM,kBAAkB,iBAAkB,IAAI,cAAe;AAE7D,SAAO;AAAA,IACN,OAAO;AAAA,MACN;AAAA,MACA;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,EACD;AACD;AAEO,SAAS,cAAe,EAAE,IAAI,UAAU,GAAkD;AAChG,mBAAkB;AAAA,IACjB;AAAA,IACA;AAAA,EACD,CAAE;AACH;AAEA,SAAS,gBAAiB,IAA+B;AACxD,SAAO,MAAM;AACZ,UAAM,cAAcC,aAAa,YAAa;AAC9C,UAAM,gBAAgB,iBAAiB;AAEvC,WAAO;AAAA,MACN,QAAQ,gBAAgB,MAAM,cAAc;AAAA,MAC5C,WAAW,cAAc;AAAA,IAC1B;AAAA,EACD;AACD;AAEA,SAAS,iBAAkB,IAA8B,WAAkD;AAC1G,SAAO,MAAM;AACZ,UAAM,WAAW,YAAY;AAC7B,UAAM,EAAE,UAAU,IAAI,UAAU;AAEhC,WAAO;AAAA,MACN,MAAM,YAAY;AACjB,YAAK,WAAY;AAChB;AAAA,QACD;AAEA,iBAAU,cAAM,QAAQ,KAAM,EAAG,CAAE;AAAA,MACpC;AAAA,MACA,OAAO,YAAY;AAClB,YAAK,WAAY;AAChB;AAAA,QACD;AAEA,iBAAU,cAAM,QAAQ,MAAO,EAAG,CAAE;AAAA,MACrC;AAAA,IACD;AAAA,EACD;AACD;;;AClEA,YAAYC,YAAW;AACvB,SAAS,cAA2B;AAErB,SAAR,MAAwB,EAAE,UAAU,IAAI,GAAG,MAAM,GAAiB;AACxE,SACC;AAAA,IAAC;AAAA;AAAA,MACA,MAAO;AAAA,MACP,SAAQ;AAAA,MACR,QAAO;AAAA,MACP,YAAa;AAAA,QACZ,IAAI;AAAA,UACH,UAAU;AAAA,UACV,OAAO;AAAA,UACP,SAAS;AAAA,UACT,QAAQ;AAAA,QACT;AAAA,MACD;AAAA,MACA,IAAK,EAAE,QAAQ,QAAQ,GAAG,GAAG;AAAA,MAC3B,GAAG;AAAA;AAAA,IAEH;AAAA,EACH;AAEF;;;ACvBA,YAAYC,YAAW;AACvB,SAAS,KAAe,SAAS,cAAc;AAE/C,IAAM,SAAS,OAAQ,GAAI,EAAG,CAAE,EAAE,MAAM,OAAS;AAAA,EAChD,QAAQ,OAAO,QAAS,CAAE,KAAK;AAAA,EAC/B,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,gBAAgB;AACjB,EAAI;AAEW,SAAR,YAA8B,EAAE,UAAU,GAAG,MAAM,GAAc;AACvE,SACC,4DACC,qCAAC,UAAO,WAAU,UAAW,GAAG,SAC7B,QACH,GACA,qCAAC,aAAQ,CACV;AAEF;;;ACnBA,YAAYC,YAAW;AACvB,SAAS,cAAc,kBAAmC,UAAAC,eAAc;AAGxE,IAAM,aAAaA,QAAQ,gBAAiB,EAAsB,CAAE,EAAE,OAAO,UAAU,QAAQ,MAAO;AACrG,MAAK,YAAY,WAAY;AAC5B,WAAO,CAAC;AAAA,EACT;AAEA,SAAO;AAAA,IACN,wBAAwB;AAAA,MACvB,GAAG,MAAM,WAAY,OAAQ;AAAA,IAC9B;AAAA,EACD;AACD,CAAE;AAEa,SAAR,iBAAmC,EAAE,UAAU,GAAG,MAAM,GAAqB;AACnF,SACC,qCAAC,cAAW,WAAU,MAAK,SAAQ,aAAc,GAAG,SACjD,QACH;AAEF;;;ACtBA,YAAYC,YAAW;AACvB,SAAS,OAAAC,YAAqB;AAEf,SAAR,UAA4B,EAAE,UAAU,IAAI,GAAG,MAAM,GAAc;AACzE,SACC;AAAA,IAACA;AAAA,IAAA;AAAA,MACA,WAAU;AAAA,MACV,IAAK;AAAA,QACJ,WAAW;AAAA,QACX,QAAQ;AAAA,QACR,GAAG;AAAA,MACJ;AAAA,MACE,GAAG;AAAA;AAAA,IAEH;AAAA,EACH;AAEF;;;ACXA,KAAK;","names":["React","useSelector","useSelector","React","React","React","styled","React","Box"]}
package/package.json CHANGED
@@ -1,45 +1,45 @@
1
1
  {
2
- "name": "@elementor/editor-panels",
3
- "version": "0.4.16",
4
- "private": false,
5
- "author": "Elementor Team",
6
- "homepage": "https://elementor.com/",
7
- "license": "GPL-3.0-or-later",
8
- "main": "dist/index.js",
9
- "module": "dist/index.mjs",
10
- "types": "dist/index.d.ts",
11
- "exports": {
12
- ".": {
13
- "import": "./dist/index.mjs",
14
- "require": "./dist/index.js",
15
- "types": "./dist/index.d.ts"
16
- },
17
- "./package.json": "./package.json"
18
- },
19
- "repository": {
20
- "type": "git",
21
- "url": "https://github.com/elementor/elementor-packages.git",
22
- "directory": "packages/core/editor-panels"
23
- },
24
- "bugs": {
25
- "url": "https://github.com/elementor/elementor-packages/issues"
26
- },
27
- "publishConfig": {
28
- "access": "public"
29
- },
30
- "scripts": {
31
- "build": "tsup --config=../../tsup.build.ts",
32
- "dev": "tsup --config=../../tsup.dev.ts"
33
- },
34
- "dependencies": {
35
- "@elementor/editor": "^0.11.1",
36
- "@elementor/editor-v1-adapters": "^0.7.0",
37
- "@elementor/locations": "^0.7.3",
38
- "@elementor/store": "^0.8.3",
39
- "@elementor/ui": "^1.4.61"
40
- },
41
- "peerDependencies": {
42
- "react": "^18.3.1"
43
- },
44
- "gitHead": "ea48212f4a9084fa323c3e70af093c5c0f6aa2d1"
2
+ "name": "@elementor/editor-panels",
3
+ "version": "0.4.17",
4
+ "private": false,
5
+ "author": "Elementor Team",
6
+ "homepage": "https://elementor.com/",
7
+ "license": "GPL-3.0-or-later",
8
+ "main": "dist/index.js",
9
+ "module": "dist/index.mjs",
10
+ "types": "dist/index.d.ts",
11
+ "exports": {
12
+ ".": {
13
+ "import": "./dist/index.mjs",
14
+ "require": "./dist/index.js",
15
+ "types": "./dist/index.d.ts"
16
+ },
17
+ "./package.json": "./package.json"
18
+ },
19
+ "repository": {
20
+ "type": "git",
21
+ "url": "https://github.com/elementor/elementor-packages.git",
22
+ "directory": "packages/core/editor-panels"
23
+ },
24
+ "bugs": {
25
+ "url": "https://github.com/elementor/elementor-packages/issues"
26
+ },
27
+ "publishConfig": {
28
+ "access": "public"
29
+ },
30
+ "scripts": {
31
+ "build": "tsup --config=../../tsup.build.ts",
32
+ "dev": "tsup --config=../../tsup.dev.ts"
33
+ },
34
+ "dependencies": {
35
+ "@elementor/editor": "^0.11.2",
36
+ "@elementor/editor-v1-adapters": "^0.8.0",
37
+ "@elementor/locations": "^0.7.4",
38
+ "@elementor/store": "^0.8.4",
39
+ "@elementor/ui": "^1.4.61"
40
+ },
41
+ "peerDependencies": {
42
+ "react": "^18.3.1"
43
+ },
44
+ "gitHead": "10fd8663495a9ced2521f27a74879684ed0cf322"
45
45
  }
package/src/__tests__/api.test.tsx CHANGED
@@ -17,11 +17,7 @@ jest.mock( '@elementor/editor-v1-adapters', () => ( {
17
17
  } ) );
18
18
 
19
19
  describe( '@elementor/editor-panels api', () => {
20
- const {
21
- panel,
22
- usePanelStatus,
23
- usePanelActions,
24
- } = createPanel( {
20
+ const { panel, usePanelStatus, usePanelActions } = createPanel( {
25
21
  id: 'test-panel',
26
22
  component: () => (
27
23
  <Panel>
@@ -41,7 +37,7 @@ describe( '@elementor/editor-panels api', () => {
41
37
  const { open, close } = usePanelActions();
42
38
 
43
39
  return (
44
- <button onClick={ () => isOpen ? close() : open() } disabled={ isBlocked }>
40
+ <button onClick={ () => ( isOpen ? close() : open() ) } disabled={ isBlocked }>
45
41
  { isOpen ? 'Close Panel' : 'Open Panel' }
46
42
  </button>
47
43
  );
package/src/__tests__/sync.test.tsx CHANGED
@@ -1,5 +1,9 @@
1
1
  import { sync } from '../sync';
2
- import { __privateIsRouteActive as isRouteActive, __privateOpenRoute as openRoute, __privateRegisterRoute as registerRoute } from '@elementor/editor-v1-adapters';
2
+ import {
3
+ __privateIsRouteActive as isRouteActive,
4
+ __privateOpenRoute as openRoute,
5
+ __privateRegisterRoute as registerRoute,
6
+ } from '@elementor/editor-v1-adapters';
3
7
  import { __createStore, __dispatch, __getState, __registerSlice } from '@elementor/store';
4
8
  import { selectOpenId, slice } from '../store';
5
9
 
@@ -89,9 +93,11 @@ describe( '@elementor/editor-panels sync', () => {
89
93
  __dispatch( slice.actions.open( 'test' ) );
90
94
 
91
95
  // Act.
92
- window.dispatchEvent( new CustomEvent( 'elementor/routes/close', {
93
- detail: { route: 'panel/v2' },
94
- } ) );
96
+ window.dispatchEvent(
97
+ new CustomEvent( 'elementor/routes/close', {
98
+ detail: { route: 'panel/v2' },
99
+ } )
100
+ );
95
101
 
96
102
  // Act.
97
103
  expect( selectOpenId( __getState() ) ).toBe( null );
@@ -102,9 +108,11 @@ describe( '@elementor/editor-panels sync', () => {
102
108
  document.body.innerHTML = v1PanelElementsIds.map( ( id ) => `<div id="${ id }"></div>` ).join( '' );
103
109
 
104
110
  // Act.
105
- window.dispatchEvent( new CustomEvent( 'elementor/routes/open', {
106
- detail: { route: 'panel/v2' },
107
- } ) );
111
+ window.dispatchEvent(
112
+ new CustomEvent( 'elementor/routes/open', {
113
+ detail: { route: 'panel/v2' },
114
+ } )
115
+ );
108
116
 
109
117
  // Assert.
110
118
  v1PanelElementsIds.forEach( ( id ) => {
@@ -114,12 +122,16 @@ describe( '@elementor/editor-panels sync', () => {
114
122
 
115
123
  it( 'should show old panel elements when navigating out of the empty route', () => {
116
124
  // Arrange.
117
- document.body.innerHTML = v1PanelElementsIds.map( ( id ) => `<div id="${ id }" aria-hidden="true" hidden="hidden"></div>` ).join( '' );
125
+ document.body.innerHTML = v1PanelElementsIds
126
+ .map( ( id ) => `<div id="${ id }" aria-hidden="true" hidden="hidden"></div>` )
127
+ .join( '' );
118
128
 
119
129
  // Act.
120
- window.dispatchEvent( new CustomEvent( 'elementor/routes/close', {
121
- detail: { route: 'panel/v2' },
122
- } ) );
130
+ window.dispatchEvent(
131
+ new CustomEvent( 'elementor/routes/close', {
132
+ detail: { route: 'panel/v2' },
133
+ } )
134
+ );
123
135
 
124
136
  // Assert.
125
137
  v1PanelElementsIds.forEach( ( id ) => {
package/src/api.ts CHANGED
@@ -7,7 +7,7 @@ import { useV1PanelStatus } from './sync';
7
7
  export type PanelDeclaration = {
8
8
  id: string;
9
9
  component: ComponentType;
10
- }
10
+ };
11
11
 
12
12
  export function createPanel( { id, component }: PanelDeclaration ) {
13
13
  const usePanelStatus = createUseStatus( id );
@@ -23,14 +23,14 @@ export function createPanel( { id, component }: PanelDeclaration ) {
23
23
  };
24
24
  }
25
25
 
26
- export function registerPanel( { id, component }: Pick<PanelDeclaration, 'id' | 'component'> ) {
26
+ export function registerPanel( { id, component }: Pick< PanelDeclaration, 'id' | 'component' > ) {
27
27
  injectIntoPanels( {
28
28
  id,
29
29
  component,
30
30
  } );
31
31
  }
32
32
 
33
- function createUseStatus( id: PanelDeclaration['id'] ) {
33
+ function createUseStatus( id: PanelDeclaration[ 'id' ] ) {
34
34
  return () => {
35
35
  const openPanelId = useSelector( selectOpenId );
36
36
  const v1PanelStatus = useV1PanelStatus();
@@ -42,7 +42,7 @@ function createUseStatus( id: PanelDeclaration['id'] ) {
42
42
  };
43
43
  }
44
44
 
45
- function createUseActions( id: PanelDeclaration['id'], useStatus: ReturnType<typeof createUseStatus> ) {
45
+ function createUseActions( id: PanelDeclaration[ 'id' ], useStatus: ReturnType< typeof createUseStatus > ) {
46
46
  return () => {
47
47
  const dispatch = useDispatch();
48
48
  const { isBlocked } = useStatus();
package/src/components/external/panel-body.tsx CHANGED
@@ -11,6 +11,8 @@ export default function PanelBody( { children, sx, ...props }: BoxProps ) {
11
11
  ...sx,
12
12
  } }
13
13
  { ...props }
14
- >{ children }</Box>
14
+ >
15
+ { children }
16
+ </Box>
15
17
  );
16
18
  }
package/src/components/external/panel-header-title.tsx CHANGED
@@ -2,7 +2,7 @@ import * as React from 'react';
2
2
  import { Typography as TypographySource, TypographyProps, styled } from '@elementor/ui';
3
3
 
4
4
  // This is to override Editor reset.scss that overrides eui styles
5
- const Typography = styled( TypographySource )<TypographyProps>( ( { theme, variant = 'body1' } ) => {
5
+ const Typography = styled( TypographySource )< TypographyProps >( ( { theme, variant = 'body1' } ) => {
6
6
  if ( variant === 'inherit' ) {
7
7
  return {};
8
8
  }
@@ -16,11 +16,7 @@ const Typography = styled( TypographySource )<TypographyProps>( ( { theme, varia
16
16
 
17
17
  export default function PanelHeaderTitle( { children, ...props }: TypographyProps ) {
18
18
  return (
19
- <Typography
20
- component="h2"
21
- variant="subtitle1"
22
- { ...props }
23
- >
19
+ <Typography component="h2" variant="subtitle1" { ...props }>
24
20
  { children }
25
21
  </Typography>
26
22
  );
package/src/components/internal/portal.tsx CHANGED
@@ -3,7 +3,7 @@ import { Portal as BasePortal, PortalProps } from '@elementor/ui';
3
3
  import { useRef } from 'react';
4
4
  import { getPortalContainer } from '../../sync';
5
5
 
6
- type Props = Omit<PortalProps, 'container'>;
6
+ type Props = Omit< PortalProps, 'container' >;
7
7
 
8
8
  export default function Portal( props: Props ) {
9
9
  const containerRef = useRef( getPortalContainer );
@@ -12,7 +12,5 @@ export default function Portal( props: Props ) {
12
12
  return null;
13
13
  }
14
14
 
15
- return (
16
- <BasePortal container={ containerRef.current } { ...props } />
17
- );
15
+ return <BasePortal container={ containerRef.current } { ...props } />;
18
16
  }
package/src/hooks/use-open-panel-injection.ts CHANGED
@@ -7,8 +7,5 @@ export default function useOpenPanelInjection() {
7
7
  const injections = usePanelsInjections();
8
8
  const openId = useSelector( selectOpenId );
9
9
 
10
- return useMemo(
11
- () => injections.find( ( injection ) => openId === injection.id ),
12
- [ injections, openId ]
13
- );
10
+ return useMemo( () => injections.find( ( injection ) => openId === injection.id ), [ injections, openId ] );
14
11
  }
package/src/index.ts CHANGED
@@ -1,9 +1,6 @@
1
1
  import init from './init';
2
2
 
3
- export {
4
- createPanel as __createPanel,
5
- registerPanel as __registerPanel,
6
- } from './api';
3
+ export { createPanel as __createPanel, registerPanel as __registerPanel } from './api';
7
4
 
8
5
  export * from './components/external';
9
6
 
package/src/location.ts CHANGED
@@ -1,6 +1,3 @@
1
1
  import { createLocation } from '@elementor/locations';
2
2
 
3
- export const {
4
- inject: injectIntoPanels,
5
- useInjections: usePanelsInjections,
6
- } = createLocation();
3
+ export const { inject: injectIntoPanels, useInjections: usePanelsInjections } = createLocation();
package/src/store/selectors.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { SliceState } from '@elementor/store';
2
2
  import slice from './slice';
3
3
 
4
- type State = SliceState<typeof slice>;
4
+ type State = SliceState< typeof slice >;
5
5
 
6
6
  export const selectOpenId = ( state: State ) => state.panels.openId;
package/src/store/slice.ts CHANGED
@@ -10,10 +10,10 @@ export default __createSlice( {
10
10
  name: 'panels',
11
11
  initialState,
12
12
  reducers: {
13
- open( state, action: PayloadAction<string> ) {
13
+ open( state, action: PayloadAction< string > ) {
14
14
  state.openId = action.payload;
15
15
  },
16
- close( state, action: PayloadAction<string | undefined> ) {
16
+ close( state, action: PayloadAction< string | undefined > ) {
17
17
  if ( ! action.payload || state.openId === action.payload ) {
18
18
  state.openId = null;
19
19
  }
package/src/sync.ts CHANGED
@@ -27,43 +27,30 @@ export function useV1PanelStatus() {
27
27
 
28
28
  export function sync() {
29
29
  // Register the V2 panel route on panel init.
30
- listenTo(
31
- windowEvent( 'elementor/panel/init' ),
32
- () => registerRoute( V2_PANEL )
33
- );
30
+ listenTo( windowEvent( 'elementor/panel/init' ), () => registerRoute( V2_PANEL ) );
34
31
 
35
32
  // On empty route open, hide V1 panel elements.
36
- listenTo(
37
- routeOpenEvent( V2_PANEL ),
38
- () => {
39
- getV1PanelElements().forEach( ( el ) => {
40
- el.setAttribute( 'hidden', 'hidden' );
41
- el.setAttribute( 'aria-hidden', 'true' );
42
- } );
43
- },
44
- );
33
+ listenTo( routeOpenEvent( V2_PANEL ), () => {
34
+ getV1PanelElements().forEach( ( el ) => {
35
+ el.setAttribute( 'hidden', 'hidden' );
36
+ el.setAttribute( 'aria-hidden', 'true' );
37
+ } );
38
+ } );
45
39
 
46
40
  // On empty route close, close the V2 panel.
47
- listenTo(
48
- routeCloseEvent( V2_PANEL ),
49
- () => selectOpenId( __getState() ) && __dispatch( slice.actions.close() )
50
- );
41
+ listenTo( routeCloseEvent( V2_PANEL ), () => selectOpenId( __getState() ) && __dispatch( slice.actions.close() ) );
51
42
 
52
43
  // On empty route close, show V1 panel elements.
53
- listenTo(
54
- routeCloseEvent( V2_PANEL ),
55
- () => {
56
- getV1PanelElements().forEach( ( el ) => {
57
- el.removeAttribute( 'hidden' );
58
- el.removeAttribute( 'aria-hidden' );
59
- } );
60
- },
61
- );
44
+ listenTo( routeCloseEvent( V2_PANEL ), () => {
45
+ getV1PanelElements().forEach( ( el ) => {
46
+ el.removeAttribute( 'hidden' );
47
+ el.removeAttribute( 'aria-hidden' );
48
+ } );
49
+ } );
62
50
 
63
51
  // On V2 panel open, open the V2 panel route.
64
- listenTo(
65
- windowEvent( 'elementor/panel/init' ),
66
- () => subscribe( {
52
+ listenTo( windowEvent( 'elementor/panel/init' ), () =>
53
+ subscribe( {
67
54
  on: ( state ) => selectOpenId( state ),
68
55
  when: ( { prev, current } ) => !! ( ! prev && current ), // is panel opened
69
56
  callback: () => openRoute( V2_PANEL ),
@@ -71,9 +58,8 @@ export function sync() {
71
58
  );
72
59
 
73
60
  // On V2 panel close, close the V2 panel route.
74
- listenTo(
75
- windowEvent( 'elementor/panel/init' ),
76
- () => subscribe( {
61
+ listenTo( windowEvent( 'elementor/panel/init' ), () =>
62
+ subscribe( {
77
63
  on: ( state ) => selectOpenId( state ),
78
64
  when: ( { prev, current } ) => !! ( ! current && prev ), // is panel closed
79
65
  callback: () => isRouteActive( V2_PANEL ) && openRoute( getDefaultRoute() ),
@@ -99,33 +85,28 @@ function getDefaultRoute() {
99
85
  getCurrent?: () => {
100
86
  config?: {
101
87
  panel?: {
102
- default_route?: string,
103
- }
104
- }
105
- },
106
- }
107
- }
108
- }
109
-
110
- const defaultRoute = ( window as unknown as ExtendedWindow )
111
- ?.elementor
112
- ?.documents
113
- ?.getCurrent?.()
114
- ?.config
115
- ?.panel
88
+ default_route?: string;
89
+ };
90
+ };
91
+ };
92
+ };
93
+ };
94
+ };
95
+
96
+ const defaultRoute = ( window as unknown as ExtendedWindow )?.elementor?.documents?.getCurrent?.()?.config?.panel
116
97
  ?.default_route;
117
98
 
118
99
  return defaultRoute || 'panel/elements/categories';
119
100
  }
120
101
 
121
- function subscribe<TVal>( {
102
+ function subscribe< TVal >( {
122
103
  on,
123
104
  when,
124
105
  callback,
125
106
  }: {
126
- on: ( state: ReturnType<typeof __getState> ) => TVal,
127
- when: ( { prev, current }: { prev: TVal, current: TVal } ) => boolean,
128
- callback: ( { prev, current }: { prev: TVal, current: TVal } ) => void,
107
+ on: ( state: ReturnType< typeof __getState > ) => TVal;
108
+ when: ( { prev, current }: { prev: TVal; current: TVal } ) => boolean;
109
+ callback: ( { prev, current }: { prev: TVal; current: TVal } ) => void;
129
110
  } ) {
130
111
  let prev: TVal;
131
112