@elementor/editor 0.10.13 → 0.11.0
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.
- package/CHANGELOG.md +11 -0
- package/dist/index.d.mts +2 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +7 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +6 -1
- package/dist/index.mjs.map +1 -1
- package/package.json +4 -4
- package/src/components/shell.tsx +7 -2
- package/src/index.ts +1 -1
- package/src/locations.ts +5 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,17 @@
|
|
|
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.11.0](https://github.com/elementor/elementor-packages/compare/@elementor/editor@0.10.13...@elementor/editor@0.11.0) (2024-07-08)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Features
|
|
10
|
+
|
|
11
|
+
* **editor-editing-panel:** create editor panel package [EDS-226] ([#188](https://github.com/elementor/elementor-packages/issues/188)) ([e361aed](https://github.com/elementor/elementor-packages/commit/e361aed023c3a5d4dd329b354f1403de238da20e))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
6
17
|
## [0.10.13](https://github.com/elementor/elementor-packages/compare/@elementor/editor@0.10.12...@elementor/editor@0.10.13) (2024-07-03)
|
|
7
18
|
|
|
8
19
|
**Note:** Version bump only for package @elementor/editor
|
package/dist/index.d.mts
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import * as _elementor_locations from '@elementor/locations';
|
|
2
2
|
|
|
3
3
|
declare const injectIntoTop: (args: _elementor_locations.InjectArgs<object>) => void;
|
|
4
|
+
declare const injectIntoLogic: (args: _elementor_locations.InjectArgs<object>) => void;
|
|
4
5
|
|
|
5
6
|
declare function init(domElement: Element): void;
|
|
6
7
|
|
|
7
|
-
export { init, injectIntoTop };
|
|
8
|
+
export { init, injectIntoLogic, injectIntoTop };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import * as _elementor_locations from '@elementor/locations';
|
|
2
2
|
|
|
3
3
|
declare const injectIntoTop: (args: _elementor_locations.InjectArgs<object>) => void;
|
|
4
|
+
declare const injectIntoLogic: (args: _elementor_locations.InjectArgs<object>) => void;
|
|
4
5
|
|
|
5
6
|
declare function init(domElement: Element): void;
|
|
6
7
|
|
|
7
|
-
export { init, injectIntoTop };
|
|
8
|
+
export { init, injectIntoLogic, injectIntoTop };
|
package/dist/index.js
CHANGED
|
@@ -31,6 +31,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
31
31
|
var src_exports = {};
|
|
32
32
|
__export(src_exports, {
|
|
33
33
|
init: () => init,
|
|
34
|
+
injectIntoLogic: () => injectIntoLogic,
|
|
34
35
|
injectIntoTop: () => injectIntoTop
|
|
35
36
|
});
|
|
36
37
|
module.exports = __toCommonJS(src_exports);
|
|
@@ -41,6 +42,10 @@ var {
|
|
|
41
42
|
Slot: TopSlot,
|
|
42
43
|
inject: injectIntoTop
|
|
43
44
|
} = (0, import_locations.createLocation)();
|
|
45
|
+
var {
|
|
46
|
+
Slot: LogicSlot,
|
|
47
|
+
inject: injectIntoLogic
|
|
48
|
+
} = (0, import_locations.createLocation)();
|
|
44
49
|
|
|
45
50
|
// src/init.tsx
|
|
46
51
|
var React3 = __toESM(require("react"));
|
|
@@ -70,7 +75,7 @@ function useSyncDocumentTitle() {
|
|
|
70
75
|
// src/components/shell.tsx
|
|
71
76
|
function Shell() {
|
|
72
77
|
useSyncDocumentTitle();
|
|
73
|
-
return /* @__PURE__ */ React.createElement(TopSlot, null);
|
|
78
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TopSlot, null), /* @__PURE__ */ React.createElement("div", { style: { display: "none" } }, /* @__PURE__ */ React.createElement(LogicSlot, null)));
|
|
74
79
|
}
|
|
75
80
|
|
|
76
81
|
// src/init.tsx
|
|
@@ -142,6 +147,7 @@ function render2(app, domElement) {
|
|
|
142
147
|
// Annotate the CommonJS export names for ESM import in node:
|
|
143
148
|
0 && (module.exports = {
|
|
144
149
|
init,
|
|
150
|
+
injectIntoLogic,
|
|
145
151
|
injectIntoTop
|
|
146
152
|
});
|
|
147
153
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/locations.ts","../src/init.tsx","../src/components/shell.tsx","../src/hooks/use-sync-document-title.ts","../src/components/theme-provider.tsx","../src/sync/use-color-scheme.ts"],"sourcesContent":["export { injectIntoTop } from './locations';\nexport { default as init } from './init';\n","import { createLocation } from '@elementor/locations';\n\nexport const {\n\tSlot: TopSlot,\n\tinject: injectIntoTop,\n} = createLocation();\n","import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { JSX } from 'react';\nimport { createRoot } from 'react-dom/client';\nimport Shell from './components/shell';\nimport { DirectionProvider } from '@elementor/ui';\nimport { __StoreProvider as StoreProvider, __createStore } from '@elementor/store';\nimport { __privateDispatchReadyEvent as dispatchReadyEvent } from '@elementor/editor-v1-adapters';\nimport ThemeProvider from './components/theme-provider';\nimport { createQueryClient, QueryClientProvider } from '@elementor/query';\n\nexport default function init( domElement: Element ): void {\n\tconst store = __createStore();\n\tconst queryClient = createQueryClient();\n\n\tdispatchReadyEvent();\n\n\trender( (\n\t\t<StoreProvider store={ store }>\n\t\t\t<QueryClientProvider client={ queryClient }>\n\t\t\t\t<DirectionProvider rtl={ window.document.dir === 'rtl' }>\n\t\t\t\t\t<ThemeProvider>\n\t\t\t\t\t\t<Shell />\n\t\t\t\t\t</ThemeProvider>\n\t\t\t\t</DirectionProvider>\n\t\t\t</QueryClientProvider>\n\t\t</StoreProvider>\n\t), domElement );\n}\n\n// Support conditional rendering based on the React version.\n// We use `createRoot` when available, but fallback to `ReactDOM.render` for older versions.\nfunction render( app: JSX.Element, domElement: Element ) {\n\tlet renderFn: () => void;\n\n\ttry {\n\t\tconst root = createRoot( domElement );\n\n\t\trenderFn = () => {\n\t\t\troot.render( app );\n\t\t};\n\t} catch ( e ) {\n\t\trenderFn = () => {\n\t\t\t// eslint-disable-next-line react/no-deprecated\n\t\t\tReactDOM.render( app, domElement );\n\t\t};\n\t}\n\n\trenderFn();\n}\n","import * as React from 'react';\nimport useSyncDocumentTitle from '../hooks/use-sync-document-title';\nimport { TopSlot } from '../locations';\n\nexport default function Shell() {\n\tuseSyncDocumentTitle();\n\n\treturn (\n\t\t<TopSlot />\n\t);\n}\n","import { useEffect } from 'react';\nimport { __useActiveDocument as useActiveDocument, __useHostDocument as useHostDocument } from '@elementor/editor-documents';\nimport { __ } from '@wordpress/i18n';\n\nexport default function useSyncDocumentTitle() {\n\tconst activeDocument = useActiveDocument();\n\tconst hostDocument = useHostDocument();\n\n\tconst document = activeDocument && activeDocument.type.value !== 'kit'\n\t\t? activeDocument\n\t\t: hostDocument;\n\n\tuseEffect( () => {\n\t\t// Allow empty string as title.\n\t\tif ( document?.title === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// translators: %s: Document title.\n\t\tconst title = __( 'Edit \"%s\" with Elementor', 'elementor' )\n\t\t\t.replace( '%s', document.title );\n\n\t\twindow.document.title = title;\n\t}, [ document?.title ] );\n}\n","import * as React from 'react';\nimport { ThemeProvider as ThemeProviderBase } from '@elementor/ui';\nimport { useColorScheme } from '../sync/use-color-scheme';\n\nexport default function ThemeProvider( { children }: { children: React.ReactNode } ) {\n\tconst colorScheme = useColorScheme();\n\n\treturn (\n\t\t<ThemeProviderBase colorScheme={ colorScheme }>\n\t\t\t{ children }\n\t\t</ThemeProviderBase>\n\t);\n}\n","import { useEffect, useState } from 'react';\nimport { commandEndEvent, CommandEvent, __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\n\nexport type ColorScheme = 'auto' | 'dark' | 'light';\n\nexport type ExtendedWindow = Window & {\n\telementor: {\n\t\tgetPreferences: ( key: 'ui_theme' ) => ColorScheme,\n\t}\n}\n\nexport function useColorScheme() {\n\tconst [ colorScheme, setColorScheme ] = useState<ColorScheme>( () => getV1ColorScheme() );\n\n\tuseEffect( () => {\n\t\treturn listenTo(\n\t\t\tv1ReadyEvent(),\n\t\t\t() => setColorScheme( getV1ColorScheme() )\n\t\t);\n\t}, [] );\n\n\tuseEffect( () => {\n\t\treturn listenTo(\n\t\t\tcommandEndEvent( 'document/elements/settings' ),\n\t\t\t( e ) => {\n\t\t\t\tconst event = e as CommandEvent<{\n\t\t\t\t\tsettings: {\n\t\t\t\t\t\tui_theme?: ColorScheme,\n\t\t\t\t\t},\n\t\t\t\t}>;\n\n\t\t\t\t// The User-Preferences settings object has a key named `ui_theme` that controls the color scheme.\n\t\t\t\tconst isColorScheme = event.args?.settings && 'ui_theme' in event.args.settings;\n\n\t\t\t\tif ( isColorScheme ) {\n\t\t\t\t\tsetColorScheme( getV1ColorScheme() );\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\t}, [] );\n\n\treturn colorScheme;\n}\n\nfunction getV1ColorScheme() {\n\treturn ( window as unknown as ExtendedWindow ).elementor?.getPreferences?.( 'ui_theme' ) || 'auto';\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,uBAA+B;AAExB,IAAM;AAAA,EACZ,MAAM;AAAA,EACN,QAAQ;AACT,QAAI,iCAAe;;;
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/locations.ts","../src/init.tsx","../src/components/shell.tsx","../src/hooks/use-sync-document-title.ts","../src/components/theme-provider.tsx","../src/sync/use-color-scheme.ts"],"sourcesContent":["export { injectIntoTop, injectIntoLogic } from './locations';\nexport { default as init } from './init';\n","import { createLocation } from '@elementor/locations';\n\nexport const {\n\tSlot: TopSlot,\n\tinject: injectIntoTop,\n} = createLocation();\n\nexport const {\n\tSlot: LogicSlot,\n\tinject: injectIntoLogic,\n} = createLocation();\n","import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { JSX } from 'react';\nimport { createRoot } from 'react-dom/client';\nimport Shell from './components/shell';\nimport { DirectionProvider } from '@elementor/ui';\nimport { __StoreProvider as StoreProvider, __createStore } from '@elementor/store';\nimport { __privateDispatchReadyEvent as dispatchReadyEvent } from '@elementor/editor-v1-adapters';\nimport ThemeProvider from './components/theme-provider';\nimport { createQueryClient, QueryClientProvider } from '@elementor/query';\n\nexport default function init( domElement: Element ): void {\n\tconst store = __createStore();\n\tconst queryClient = createQueryClient();\n\n\tdispatchReadyEvent();\n\n\trender( (\n\t\t<StoreProvider store={ store }>\n\t\t\t<QueryClientProvider client={ queryClient }>\n\t\t\t\t<DirectionProvider rtl={ window.document.dir === 'rtl' }>\n\t\t\t\t\t<ThemeProvider>\n\t\t\t\t\t\t<Shell />\n\t\t\t\t\t</ThemeProvider>\n\t\t\t\t</DirectionProvider>\n\t\t\t</QueryClientProvider>\n\t\t</StoreProvider>\n\t), domElement );\n}\n\n// Support conditional rendering based on the React version.\n// We use `createRoot` when available, but fallback to `ReactDOM.render` for older versions.\nfunction render( app: JSX.Element, domElement: Element ) {\n\tlet renderFn: () => void;\n\n\ttry {\n\t\tconst root = createRoot( domElement );\n\n\t\trenderFn = () => {\n\t\t\troot.render( app );\n\t\t};\n\t} catch ( e ) {\n\t\trenderFn = () => {\n\t\t\t// eslint-disable-next-line react/no-deprecated\n\t\t\tReactDOM.render( app, domElement );\n\t\t};\n\t}\n\n\trenderFn();\n}\n","import * as React from 'react';\nimport useSyncDocumentTitle from '../hooks/use-sync-document-title';\nimport { LogicSlot, TopSlot } from '../locations';\n\nexport default function Shell() {\n\tuseSyncDocumentTitle();\n\n\treturn (\n\t\t<>\n\t\t\t<TopSlot />\n\t\t\t<div style={ { display: 'none' } }>\n\t\t\t\t<LogicSlot />\n\t\t\t</div>\n\t\t</>\n\t);\n}\n","import { useEffect } from 'react';\nimport { __useActiveDocument as useActiveDocument, __useHostDocument as useHostDocument } from '@elementor/editor-documents';\nimport { __ } from '@wordpress/i18n';\n\nexport default function useSyncDocumentTitle() {\n\tconst activeDocument = useActiveDocument();\n\tconst hostDocument = useHostDocument();\n\n\tconst document = activeDocument && activeDocument.type.value !== 'kit'\n\t\t? activeDocument\n\t\t: hostDocument;\n\n\tuseEffect( () => {\n\t\t// Allow empty string as title.\n\t\tif ( document?.title === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// translators: %s: Document title.\n\t\tconst title = __( 'Edit \"%s\" with Elementor', 'elementor' )\n\t\t\t.replace( '%s', document.title );\n\n\t\twindow.document.title = title;\n\t}, [ document?.title ] );\n}\n","import * as React from 'react';\nimport { ThemeProvider as ThemeProviderBase } from '@elementor/ui';\nimport { useColorScheme } from '../sync/use-color-scheme';\n\nexport default function ThemeProvider( { children }: { children: React.ReactNode } ) {\n\tconst colorScheme = useColorScheme();\n\n\treturn (\n\t\t<ThemeProviderBase colorScheme={ colorScheme }>\n\t\t\t{ children }\n\t\t</ThemeProviderBase>\n\t);\n}\n","import { useEffect, useState } from 'react';\nimport { commandEndEvent, CommandEvent, __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\n\nexport type ColorScheme = 'auto' | 'dark' | 'light';\n\nexport type ExtendedWindow = Window & {\n\telementor: {\n\t\tgetPreferences: ( key: 'ui_theme' ) => ColorScheme,\n\t}\n}\n\nexport function useColorScheme() {\n\tconst [ colorScheme, setColorScheme ] = useState<ColorScheme>( () => getV1ColorScheme() );\n\n\tuseEffect( () => {\n\t\treturn listenTo(\n\t\t\tv1ReadyEvent(),\n\t\t\t() => setColorScheme( getV1ColorScheme() )\n\t\t);\n\t}, [] );\n\n\tuseEffect( () => {\n\t\treturn listenTo(\n\t\t\tcommandEndEvent( 'document/elements/settings' ),\n\t\t\t( e ) => {\n\t\t\t\tconst event = e as CommandEvent<{\n\t\t\t\t\tsettings: {\n\t\t\t\t\t\tui_theme?: ColorScheme,\n\t\t\t\t\t},\n\t\t\t\t}>;\n\n\t\t\t\t// The User-Preferences settings object has a key named `ui_theme` that controls the color scheme.\n\t\t\t\tconst isColorScheme = event.args?.settings && 'ui_theme' in event.args.settings;\n\n\t\t\t\tif ( isColorScheme ) {\n\t\t\t\t\tsetColorScheme( getV1ColorScheme() );\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\t}, [] );\n\n\treturn colorScheme;\n}\n\nfunction getV1ColorScheme() {\n\treturn ( window as unknown as ExtendedWindow ).elementor?.getPreferences?.( 'ui_theme' ) || 'auto';\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,uBAA+B;AAExB,IAAM;AAAA,EACZ,MAAM;AAAA,EACN,QAAQ;AACT,QAAI,iCAAe;AAEZ,IAAM;AAAA,EACZ,MAAM;AAAA,EACN,QAAQ;AACT,QAAI,iCAAe;;;ACVnB,IAAAA,SAAuB;AACvB,eAA0B;AAE1B,oBAA2B;;;ACH3B,YAAuB;;;ACAvB,mBAA0B;AAC1B,8BAA+F;AAC/F,kBAAmB;AAEJ,SAAR,uBAAwC;AAC9C,QAAM,qBAAiB,wBAAAC,qBAAkB;AACzC,QAAM,mBAAe,wBAAAC,mBAAgB;AAErC,QAAM,WAAW,kBAAkB,eAAe,KAAK,UAAU,QAC9D,iBACA;AAEH,8BAAW,MAAM;AAEhB,QAAK,UAAU,UAAU,QAAY;AACpC;AAAA,IACD;AAGA,UAAM,YAAQ,gBAAI,4BAA4B,WAAY,EACxD,QAAS,MAAM,SAAS,KAAM;AAEhC,WAAO,SAAS,QAAQ;AAAA,EACzB,GAAG,CAAE,UAAU,KAAM,CAAE;AACxB;;;ADpBe,SAAR,QAAyB;AAC/B,uBAAqB;AAErB,SACC,0DACC,oCAAC,aAAQ,GACT,oCAAC,SAAI,OAAQ,EAAE,SAAS,OAAO,KAC9B,oCAAC,eAAU,CACZ,CACD;AAEF;;;ADVA,IAAAC,aAAkC;AAClC,mBAAgE;AAChE,IAAAC,6BAAkE;;;AGPlE,IAAAC,SAAuB;AACvB,gBAAmD;;;ACDnD,IAAAC,gBAAoC;AACpC,gCAA2F;AAUpF,SAAS,iBAAiB;AAChC,QAAM,CAAE,aAAa,cAAe,QAAI,wBAAuB,MAAM,iBAAiB,CAAE;AAExF,+BAAW,MAAM;AAChB,eAAO,0BAAAC;AAAA,UACN,wCAAa;AAAA,MACb,MAAM,eAAgB,iBAAiB,CAAE;AAAA,IAC1C;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,+BAAW,MAAM;AAChB,eAAO,0BAAAA;AAAA,UACN,2CAAiB,4BAA6B;AAAA,MAC9C,CAAE,MAAO;AACR,cAAM,QAAQ;AAOd,cAAM,gBAAgB,MAAM,MAAM,YAAY,cAAc,MAAM,KAAK;AAEvE,YAAK,eAAgB;AACpB,yBAAgB,iBAAiB,CAAE;AAAA,QACpC;AAAA,MACD;AAAA,IACD;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,SAAO;AACR;AAEA,SAAS,mBAAmB;AAC3B,SAAS,OAAsC,WAAW,iBAAkB,UAAW,KAAK;AAC7F;;;AD1Ce,SAAR,cAAgC,EAAE,SAAS,GAAmC;AACpF,QAAM,cAAc,eAAe;AAEnC,SACC,qCAAC,UAAAC,eAAA,EAAkB,eAChB,QACH;AAEF;;;AHHA,mBAAuD;AAExC,SAAR,KAAuB,YAA4B;AACzD,QAAM,YAAQ,4BAAc;AAC5B,QAAM,kBAAc,gCAAkB;AAEtC,iCAAAC,6BAAmB;AAEnB,EAAAC,QACC,qCAAC,aAAAC,iBAAA,EAAc,SACd,qCAAC,oCAAoB,QAAS,eAC7B,qCAAC,gCAAkB,KAAM,OAAO,SAAS,QAAQ,SAChD,qCAAC,qBACA,qCAAC,WAAM,CACR,CACD,CACD,CACD,GACE,UAAW;AACf;AAIA,SAASD,QAAQ,KAAkB,YAAsB;AACxD,MAAI;AAEJ,MAAI;AACH,UAAM,WAAO,0BAAY,UAAW;AAEpC,eAAW,MAAM;AAChB,WAAK,OAAQ,GAAI;AAAA,IAClB;AAAA,EACD,SAAU,GAAI;AACb,eAAW,MAAM;AAEhB,MAAS,gBAAQ,KAAK,UAAW;AAAA,IAClC;AAAA,EACD;AAEA,WAAS;AACV;","names":["React","useActiveDocument","useHostDocument","import_ui","import_editor_v1_adapters","React","import_react","listenTo","ThemeProviderBase","dispatchReadyEvent","render","StoreProvider"]}
|
package/dist/index.mjs
CHANGED
|
@@ -4,6 +4,10 @@ var {
|
|
|
4
4
|
Slot: TopSlot,
|
|
5
5
|
inject: injectIntoTop
|
|
6
6
|
} = createLocation();
|
|
7
|
+
var {
|
|
8
|
+
Slot: LogicSlot,
|
|
9
|
+
inject: injectIntoLogic
|
|
10
|
+
} = createLocation();
|
|
7
11
|
|
|
8
12
|
// src/init.tsx
|
|
9
13
|
import * as React3 from "react";
|
|
@@ -33,7 +37,7 @@ function useSyncDocumentTitle() {
|
|
|
33
37
|
// src/components/shell.tsx
|
|
34
38
|
function Shell() {
|
|
35
39
|
useSyncDocumentTitle();
|
|
36
|
-
return /* @__PURE__ */ React.createElement(TopSlot, null);
|
|
40
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TopSlot, null), /* @__PURE__ */ React.createElement("div", { style: { display: "none" } }, /* @__PURE__ */ React.createElement(LogicSlot, null)));
|
|
37
41
|
}
|
|
38
42
|
|
|
39
43
|
// src/init.tsx
|
|
@@ -104,6 +108,7 @@ function render2(app, domElement) {
|
|
|
104
108
|
}
|
|
105
109
|
export {
|
|
106
110
|
init,
|
|
111
|
+
injectIntoLogic,
|
|
107
112
|
injectIntoTop
|
|
108
113
|
};
|
|
109
114
|
//# sourceMappingURL=index.mjs.map
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/locations.ts","../src/init.tsx","../src/components/shell.tsx","../src/hooks/use-sync-document-title.ts","../src/components/theme-provider.tsx","../src/sync/use-color-scheme.ts"],"sourcesContent":["import { createLocation } from '@elementor/locations';\n\nexport const {\n\tSlot: TopSlot,\n\tinject: injectIntoTop,\n} = createLocation();\n","import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { JSX } from 'react';\nimport { createRoot } from 'react-dom/client';\nimport Shell from './components/shell';\nimport { DirectionProvider } from '@elementor/ui';\nimport { __StoreProvider as StoreProvider, __createStore } from '@elementor/store';\nimport { __privateDispatchReadyEvent as dispatchReadyEvent } from '@elementor/editor-v1-adapters';\nimport ThemeProvider from './components/theme-provider';\nimport { createQueryClient, QueryClientProvider } from '@elementor/query';\n\nexport default function init( domElement: Element ): void {\n\tconst store = __createStore();\n\tconst queryClient = createQueryClient();\n\n\tdispatchReadyEvent();\n\n\trender( (\n\t\t<StoreProvider store={ store }>\n\t\t\t<QueryClientProvider client={ queryClient }>\n\t\t\t\t<DirectionProvider rtl={ window.document.dir === 'rtl' }>\n\t\t\t\t\t<ThemeProvider>\n\t\t\t\t\t\t<Shell />\n\t\t\t\t\t</ThemeProvider>\n\t\t\t\t</DirectionProvider>\n\t\t\t</QueryClientProvider>\n\t\t</StoreProvider>\n\t), domElement );\n}\n\n// Support conditional rendering based on the React version.\n// We use `createRoot` when available, but fallback to `ReactDOM.render` for older versions.\nfunction render( app: JSX.Element, domElement: Element ) {\n\tlet renderFn: () => void;\n\n\ttry {\n\t\tconst root = createRoot( domElement );\n\n\t\trenderFn = () => {\n\t\t\troot.render( app );\n\t\t};\n\t} catch ( e ) {\n\t\trenderFn = () => {\n\t\t\t// eslint-disable-next-line react/no-deprecated\n\t\t\tReactDOM.render( app, domElement );\n\t\t};\n\t}\n\n\trenderFn();\n}\n","import * as React from 'react';\nimport useSyncDocumentTitle from '../hooks/use-sync-document-title';\nimport { TopSlot } from '../locations';\n\nexport default function Shell() {\n\tuseSyncDocumentTitle();\n\n\treturn (\n\t\t<TopSlot />\n\t);\n}\n","import { useEffect } from 'react';\nimport { __useActiveDocument as useActiveDocument, __useHostDocument as useHostDocument } from '@elementor/editor-documents';\nimport { __ } from '@wordpress/i18n';\n\nexport default function useSyncDocumentTitle() {\n\tconst activeDocument = useActiveDocument();\n\tconst hostDocument = useHostDocument();\n\n\tconst document = activeDocument && activeDocument.type.value !== 'kit'\n\t\t? activeDocument\n\t\t: hostDocument;\n\n\tuseEffect( () => {\n\t\t// Allow empty string as title.\n\t\tif ( document?.title === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// translators: %s: Document title.\n\t\tconst title = __( 'Edit \"%s\" with Elementor', 'elementor' )\n\t\t\t.replace( '%s', document.title );\n\n\t\twindow.document.title = title;\n\t}, [ document?.title ] );\n}\n","import * as React from 'react';\nimport { ThemeProvider as ThemeProviderBase } from '@elementor/ui';\nimport { useColorScheme } from '../sync/use-color-scheme';\n\nexport default function ThemeProvider( { children }: { children: React.ReactNode } ) {\n\tconst colorScheme = useColorScheme();\n\n\treturn (\n\t\t<ThemeProviderBase colorScheme={ colorScheme }>\n\t\t\t{ children }\n\t\t</ThemeProviderBase>\n\t);\n}\n","import { useEffect, useState } from 'react';\nimport { commandEndEvent, CommandEvent, __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\n\nexport type ColorScheme = 'auto' | 'dark' | 'light';\n\nexport type ExtendedWindow = Window & {\n\telementor: {\n\t\tgetPreferences: ( key: 'ui_theme' ) => ColorScheme,\n\t}\n}\n\nexport function useColorScheme() {\n\tconst [ colorScheme, setColorScheme ] = useState<ColorScheme>( () => getV1ColorScheme() );\n\n\tuseEffect( () => {\n\t\treturn listenTo(\n\t\t\tv1ReadyEvent(),\n\t\t\t() => setColorScheme( getV1ColorScheme() )\n\t\t);\n\t}, [] );\n\n\tuseEffect( () => {\n\t\treturn listenTo(\n\t\t\tcommandEndEvent( 'document/elements/settings' ),\n\t\t\t( e ) => {\n\t\t\t\tconst event = e as CommandEvent<{\n\t\t\t\t\tsettings: {\n\t\t\t\t\t\tui_theme?: ColorScheme,\n\t\t\t\t\t},\n\t\t\t\t}>;\n\n\t\t\t\t// The User-Preferences settings object has a key named `ui_theme` that controls the color scheme.\n\t\t\t\tconst isColorScheme = event.args?.settings && 'ui_theme' in event.args.settings;\n\n\t\t\t\tif ( isColorScheme ) {\n\t\t\t\t\tsetColorScheme( getV1ColorScheme() );\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\t}, [] );\n\n\treturn colorScheme;\n}\n\nfunction getV1ColorScheme() {\n\treturn ( window as unknown as ExtendedWindow ).elementor?.getPreferences?.( 'ui_theme' ) || 'auto';\n}\n"],"mappings":";AAAA,SAAS,sBAAsB;AAExB,IAAM;AAAA,EACZ,MAAM;AAAA,EACN,QAAQ;AACT,IAAI,eAAe;;;
|
|
1
|
+
{"version":3,"sources":["../src/locations.ts","../src/init.tsx","../src/components/shell.tsx","../src/hooks/use-sync-document-title.ts","../src/components/theme-provider.tsx","../src/sync/use-color-scheme.ts"],"sourcesContent":["import { createLocation } from '@elementor/locations';\n\nexport const {\n\tSlot: TopSlot,\n\tinject: injectIntoTop,\n} = createLocation();\n\nexport const {\n\tSlot: LogicSlot,\n\tinject: injectIntoLogic,\n} = createLocation();\n","import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { JSX } from 'react';\nimport { createRoot } from 'react-dom/client';\nimport Shell from './components/shell';\nimport { DirectionProvider } from '@elementor/ui';\nimport { __StoreProvider as StoreProvider, __createStore } from '@elementor/store';\nimport { __privateDispatchReadyEvent as dispatchReadyEvent } from '@elementor/editor-v1-adapters';\nimport ThemeProvider from './components/theme-provider';\nimport { createQueryClient, QueryClientProvider } from '@elementor/query';\n\nexport default function init( domElement: Element ): void {\n\tconst store = __createStore();\n\tconst queryClient = createQueryClient();\n\n\tdispatchReadyEvent();\n\n\trender( (\n\t\t<StoreProvider store={ store }>\n\t\t\t<QueryClientProvider client={ queryClient }>\n\t\t\t\t<DirectionProvider rtl={ window.document.dir === 'rtl' }>\n\t\t\t\t\t<ThemeProvider>\n\t\t\t\t\t\t<Shell />\n\t\t\t\t\t</ThemeProvider>\n\t\t\t\t</DirectionProvider>\n\t\t\t</QueryClientProvider>\n\t\t</StoreProvider>\n\t), domElement );\n}\n\n// Support conditional rendering based on the React version.\n// We use `createRoot` when available, but fallback to `ReactDOM.render` for older versions.\nfunction render( app: JSX.Element, domElement: Element ) {\n\tlet renderFn: () => void;\n\n\ttry {\n\t\tconst root = createRoot( domElement );\n\n\t\trenderFn = () => {\n\t\t\troot.render( app );\n\t\t};\n\t} catch ( e ) {\n\t\trenderFn = () => {\n\t\t\t// eslint-disable-next-line react/no-deprecated\n\t\t\tReactDOM.render( app, domElement );\n\t\t};\n\t}\n\n\trenderFn();\n}\n","import * as React from 'react';\nimport useSyncDocumentTitle from '../hooks/use-sync-document-title';\nimport { LogicSlot, TopSlot } from '../locations';\n\nexport default function Shell() {\n\tuseSyncDocumentTitle();\n\n\treturn (\n\t\t<>\n\t\t\t<TopSlot />\n\t\t\t<div style={ { display: 'none' } }>\n\t\t\t\t<LogicSlot />\n\t\t\t</div>\n\t\t</>\n\t);\n}\n","import { useEffect } from 'react';\nimport { __useActiveDocument as useActiveDocument, __useHostDocument as useHostDocument } from '@elementor/editor-documents';\nimport { __ } from '@wordpress/i18n';\n\nexport default function useSyncDocumentTitle() {\n\tconst activeDocument = useActiveDocument();\n\tconst hostDocument = useHostDocument();\n\n\tconst document = activeDocument && activeDocument.type.value !== 'kit'\n\t\t? activeDocument\n\t\t: hostDocument;\n\n\tuseEffect( () => {\n\t\t// Allow empty string as title.\n\t\tif ( document?.title === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// translators: %s: Document title.\n\t\tconst title = __( 'Edit \"%s\" with Elementor', 'elementor' )\n\t\t\t.replace( '%s', document.title );\n\n\t\twindow.document.title = title;\n\t}, [ document?.title ] );\n}\n","import * as React from 'react';\nimport { ThemeProvider as ThemeProviderBase } from '@elementor/ui';\nimport { useColorScheme } from '../sync/use-color-scheme';\n\nexport default function ThemeProvider( { children }: { children: React.ReactNode } ) {\n\tconst colorScheme = useColorScheme();\n\n\treturn (\n\t\t<ThemeProviderBase colorScheme={ colorScheme }>\n\t\t\t{ children }\n\t\t</ThemeProviderBase>\n\t);\n}\n","import { useEffect, useState } from 'react';\nimport { commandEndEvent, CommandEvent, __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\n\nexport type ColorScheme = 'auto' | 'dark' | 'light';\n\nexport type ExtendedWindow = Window & {\n\telementor: {\n\t\tgetPreferences: ( key: 'ui_theme' ) => ColorScheme,\n\t}\n}\n\nexport function useColorScheme() {\n\tconst [ colorScheme, setColorScheme ] = useState<ColorScheme>( () => getV1ColorScheme() );\n\n\tuseEffect( () => {\n\t\treturn listenTo(\n\t\t\tv1ReadyEvent(),\n\t\t\t() => setColorScheme( getV1ColorScheme() )\n\t\t);\n\t}, [] );\n\n\tuseEffect( () => {\n\t\treturn listenTo(\n\t\t\tcommandEndEvent( 'document/elements/settings' ),\n\t\t\t( e ) => {\n\t\t\t\tconst event = e as CommandEvent<{\n\t\t\t\t\tsettings: {\n\t\t\t\t\t\tui_theme?: ColorScheme,\n\t\t\t\t\t},\n\t\t\t\t}>;\n\n\t\t\t\t// The User-Preferences settings object has a key named `ui_theme` that controls the color scheme.\n\t\t\t\tconst isColorScheme = event.args?.settings && 'ui_theme' in event.args.settings;\n\n\t\t\t\tif ( isColorScheme ) {\n\t\t\t\t\tsetColorScheme( getV1ColorScheme() );\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\t}, [] );\n\n\treturn colorScheme;\n}\n\nfunction getV1ColorScheme() {\n\treturn ( window as unknown as ExtendedWindow ).elementor?.getPreferences?.( 'ui_theme' ) || 'auto';\n}\n"],"mappings":";AAAA,SAAS,sBAAsB;AAExB,IAAM;AAAA,EACZ,MAAM;AAAA,EACN,QAAQ;AACT,IAAI,eAAe;AAEZ,IAAM;AAAA,EACZ,MAAM;AAAA,EACN,QAAQ;AACT,IAAI,eAAe;;;ACVnB,YAAYA,YAAW;AACvB,YAAY,cAAc;AAE1B,SAAS,kBAAkB;;;ACH3B,YAAY,WAAW;;;ACAvB,SAAS,iBAAiB;AAC1B,SAAS,uBAAuB,mBAAmB,qBAAqB,uBAAuB;AAC/F,SAAS,UAAU;AAEJ,SAAR,uBAAwC;AAC9C,QAAM,iBAAiB,kBAAkB;AACzC,QAAM,eAAe,gBAAgB;AAErC,QAAM,WAAW,kBAAkB,eAAe,KAAK,UAAU,QAC9D,iBACA;AAEH,YAAW,MAAM;AAEhB,QAAK,UAAU,UAAU,QAAY;AACpC;AAAA,IACD;AAGA,UAAM,QAAQ,GAAI,4BAA4B,WAAY,EACxD,QAAS,MAAM,SAAS,KAAM;AAEhC,WAAO,SAAS,QAAQ;AAAA,EACzB,GAAG,CAAE,UAAU,KAAM,CAAE;AACxB;;;ADpBe,SAAR,QAAyB;AAC/B,uBAAqB;AAErB,SACC,0DACC,oCAAC,aAAQ,GACT,oCAAC,SAAI,OAAQ,EAAE,SAAS,OAAO,KAC9B,oCAAC,eAAU,CACZ,CACD;AAEF;;;ADVA,SAAS,yBAAyB;AAClC,SAAS,mBAAmB,eAAe,qBAAqB;AAChE,SAAS,+BAA+B,0BAA0B;;;AGPlE,YAAYC,YAAW;AACvB,SAAS,iBAAiB,yBAAyB;;;ACDnD,SAAS,aAAAC,YAAW,gBAAgB;AACpC,SAAS,iBAA+B,qBAAqB,UAAU,oBAAoB;AAUpF,SAAS,iBAAiB;AAChC,QAAM,CAAE,aAAa,cAAe,IAAI,SAAuB,MAAM,iBAAiB,CAAE;AAExF,EAAAA,WAAW,MAAM;AAChB,WAAO;AAAA,MACN,aAAa;AAAA,MACb,MAAM,eAAgB,iBAAiB,CAAE;AAAA,IAC1C;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,EAAAA,WAAW,MAAM;AAChB,WAAO;AAAA,MACN,gBAAiB,4BAA6B;AAAA,MAC9C,CAAE,MAAO;AACR,cAAM,QAAQ;AAOd,cAAM,gBAAgB,MAAM,MAAM,YAAY,cAAc,MAAM,KAAK;AAEvE,YAAK,eAAgB;AACpB,yBAAgB,iBAAiB,CAAE;AAAA,QACpC;AAAA,MACD;AAAA,IACD;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,SAAO;AACR;AAEA,SAAS,mBAAmB;AAC3B,SAAS,OAAsC,WAAW,iBAAkB,UAAW,KAAK;AAC7F;;;AD1Ce,SAAR,cAAgC,EAAE,SAAS,GAAmC;AACpF,QAAM,cAAc,eAAe;AAEnC,SACC,qCAAC,qBAAkB,eAChB,QACH;AAEF;;;AHHA,SAAS,mBAAmB,2BAA2B;AAExC,SAAR,KAAuB,YAA4B;AACzD,QAAM,QAAQ,cAAc;AAC5B,QAAM,cAAc,kBAAkB;AAEtC,qBAAmB;AAEnB,EAAAC,QACC,qCAAC,iBAAc,SACd,qCAAC,uBAAoB,QAAS,eAC7B,qCAAC,qBAAkB,KAAM,OAAO,SAAS,QAAQ,SAChD,qCAAC,qBACA,qCAAC,WAAM,CACR,CACD,CACD,CACD,GACE,UAAW;AACf;AAIA,SAASA,QAAQ,KAAkB,YAAsB;AACxD,MAAI;AAEJ,MAAI;AACH,UAAM,OAAO,WAAY,UAAW;AAEpC,eAAW,MAAM;AAChB,WAAK,OAAQ,GAAI;AAAA,IAClB;AAAA,EACD,SAAU,GAAI;AACb,eAAW,MAAM;AAEhB,MAAS,gBAAQ,KAAK,UAAW;AAAA,IAClC;AAAA,EACD;AAEA,WAAS;AACV;","names":["React","React","useEffect","render"]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elementor/editor",
|
|
3
3
|
"description": "The main application for Elementor's editor",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.11.0",
|
|
5
5
|
"private": false,
|
|
6
6
|
"author": "Elementor Team",
|
|
7
7
|
"homepage": "https://elementor.com/",
|
|
@@ -33,8 +33,8 @@
|
|
|
33
33
|
"dev": "tsup --config=../../tsup.dev.ts"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@elementor/editor-documents": "^0.11.
|
|
37
|
-
"@elementor/editor-v1-adapters": "^0.
|
|
36
|
+
"@elementor/editor-documents": "^0.11.3",
|
|
37
|
+
"@elementor/editor-v1-adapters": "^0.7.0",
|
|
38
38
|
"@elementor/locations": "^0.7.3",
|
|
39
39
|
"@elementor/query": "^0.2.1",
|
|
40
40
|
"@elementor/store": "^0.8.3",
|
|
@@ -45,5 +45,5 @@
|
|
|
45
45
|
"react": "^18.3.1",
|
|
46
46
|
"react-dom": "^18.3.1"
|
|
47
47
|
},
|
|
48
|
-
"gitHead": "
|
|
48
|
+
"gitHead": "33d28e27101a9bf272b11d19d7092830e8cb69d0"
|
|
49
49
|
}
|
package/src/components/shell.tsx
CHANGED
|
@@ -1,11 +1,16 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import useSyncDocumentTitle from '../hooks/use-sync-document-title';
|
|
3
|
-
import { TopSlot } from '../locations';
|
|
3
|
+
import { LogicSlot, TopSlot } from '../locations';
|
|
4
4
|
|
|
5
5
|
export default function Shell() {
|
|
6
6
|
useSyncDocumentTitle();
|
|
7
7
|
|
|
8
8
|
return (
|
|
9
|
-
|
|
9
|
+
<>
|
|
10
|
+
<TopSlot />
|
|
11
|
+
<div style={ { display: 'none' } }>
|
|
12
|
+
<LogicSlot />
|
|
13
|
+
</div>
|
|
14
|
+
</>
|
|
10
15
|
);
|
|
11
16
|
}
|
package/src/index.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { injectIntoTop } from './locations';
|
|
1
|
+
export { injectIntoTop, injectIntoLogic } from './locations';
|
|
2
2
|
export { default as init } from './init';
|