@elementor/editor 0.11.0 → 0.11.1
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.js +4 -24
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +3 -23
- package/dist/index.mjs.map +1 -1
- package/package.json +3 -5
- package/src/components/__tests__/shell.test.tsx +1 -97
- package/src/components/shell.tsx +0 -3
- package/src/hooks/use-sync-document-title.ts +0 -25
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.1](https://github.com/elementor/elementor-packages/compare/@elementor/editor@0.11.0...@elementor/editor@0.11.1) (2024-07-16)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* **editor:** remove extensions dependency [EDS-263] ([#204](https://github.com/elementor/elementor-packages/issues/204)) ([22ca6a4](https://github.com/elementor/elementor-packages/commit/22ca6a423818c479ef7fafc177bba6e45dd697ff))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
6
17
|
# [0.11.0](https://github.com/elementor/elementor-packages/compare/@elementor/editor@0.10.13...@elementor/editor@0.11.0) (2024-07-08)
|
|
7
18
|
|
|
8
19
|
|
package/dist/index.js
CHANGED
|
@@ -54,27 +54,7 @@ var import_client = require("react-dom/client");
|
|
|
54
54
|
|
|
55
55
|
// src/components/shell.tsx
|
|
56
56
|
var React = __toESM(require("react"));
|
|
57
|
-
|
|
58
|
-
// src/hooks/use-sync-document-title.ts
|
|
59
|
-
var import_react = require("react");
|
|
60
|
-
var import_editor_documents = require("@elementor/editor-documents");
|
|
61
|
-
var import_i18n = require("@wordpress/i18n");
|
|
62
|
-
function useSyncDocumentTitle() {
|
|
63
|
-
const activeDocument = (0, import_editor_documents.__useActiveDocument)();
|
|
64
|
-
const hostDocument = (0, import_editor_documents.__useHostDocument)();
|
|
65
|
-
const document = activeDocument && activeDocument.type.value !== "kit" ? activeDocument : hostDocument;
|
|
66
|
-
(0, import_react.useEffect)(() => {
|
|
67
|
-
if (document?.title === void 0) {
|
|
68
|
-
return;
|
|
69
|
-
}
|
|
70
|
-
const title = (0, import_i18n.__)('Edit "%s" with Elementor', "elementor").replace("%s", document.title);
|
|
71
|
-
window.document.title = title;
|
|
72
|
-
}, [document?.title]);
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
// src/components/shell.tsx
|
|
76
57
|
function Shell() {
|
|
77
|
-
useSyncDocumentTitle();
|
|
78
58
|
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TopSlot, null), /* @__PURE__ */ React.createElement("div", { style: { display: "none" } }, /* @__PURE__ */ React.createElement(LogicSlot, null)));
|
|
79
59
|
}
|
|
80
60
|
|
|
@@ -88,17 +68,17 @@ var React2 = __toESM(require("react"));
|
|
|
88
68
|
var import_ui = require("@elementor/ui");
|
|
89
69
|
|
|
90
70
|
// src/sync/use-color-scheme.ts
|
|
91
|
-
var
|
|
71
|
+
var import_react = require("react");
|
|
92
72
|
var import_editor_v1_adapters = require("@elementor/editor-v1-adapters");
|
|
93
73
|
function useColorScheme() {
|
|
94
|
-
const [colorScheme, setColorScheme] = (0,
|
|
95
|
-
(0,
|
|
74
|
+
const [colorScheme, setColorScheme] = (0, import_react.useState)(() => getV1ColorScheme());
|
|
75
|
+
(0, import_react.useEffect)(() => {
|
|
96
76
|
return (0, import_editor_v1_adapters.__privateListenTo)(
|
|
97
77
|
(0, import_editor_v1_adapters.v1ReadyEvent)(),
|
|
98
78
|
() => setColorScheme(getV1ColorScheme())
|
|
99
79
|
);
|
|
100
80
|
}, []);
|
|
101
|
-
(0,
|
|
81
|
+
(0, import_react.useEffect)(() => {
|
|
102
82
|
return (0, import_editor_v1_adapters.__privateListenTo)(
|
|
103
83
|
(0, import_editor_v1_adapters.commandEndEvent)("document/elements/settings"),
|
|
104
84
|
(e) => {
|
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/
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/locations.ts","../src/init.tsx","../src/components/shell.tsx","../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 { LogicSlot, TopSlot } from '../locations';\n\nexport default function Shell() {\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 * 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;AAGR,SAAR,QAAyB;AAC/B,SACC,0DACC,oCAAC,aAAQ,GACT,oCAAC,SAAI,OAAQ,EAAE,SAAS,OAAO,KAC9B,oCAAC,eAAU,CACZ,CACD;AAEF;;;ADPA,IAAAC,aAAkC;AAClC,mBAAgE;AAChE,IAAAC,6BAAkE;;;AEPlE,IAAAC,SAAuB;AACvB,gBAAmD;;;ACDnD,mBAAoC;AACpC,gCAA2F;AAUpF,SAAS,iBAAiB;AAChC,QAAM,CAAE,aAAa,cAAe,QAAI,uBAAuB,MAAM,iBAAiB,CAAE;AAExF,8BAAW,MAAM;AAChB,eAAO,0BAAAC;AAAA,UACN,wCAAa;AAAA,MACb,MAAM,eAAgB,iBAAiB,CAAE;AAAA,IAC1C;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,8BAAW,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;;;AFHA,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","import_ui","import_editor_v1_adapters","React","listenTo","ThemeProviderBase","dispatchReadyEvent","render","StoreProvider"]}
|
package/dist/index.mjs
CHANGED
|
@@ -16,27 +16,7 @@ import { createRoot } from "react-dom/client";
|
|
|
16
16
|
|
|
17
17
|
// src/components/shell.tsx
|
|
18
18
|
import * as React from "react";
|
|
19
|
-
|
|
20
|
-
// src/hooks/use-sync-document-title.ts
|
|
21
|
-
import { useEffect } from "react";
|
|
22
|
-
import { __useActiveDocument as useActiveDocument, __useHostDocument as useHostDocument } from "@elementor/editor-documents";
|
|
23
|
-
import { __ } from "@wordpress/i18n";
|
|
24
|
-
function useSyncDocumentTitle() {
|
|
25
|
-
const activeDocument = useActiveDocument();
|
|
26
|
-
const hostDocument = useHostDocument();
|
|
27
|
-
const document = activeDocument && activeDocument.type.value !== "kit" ? activeDocument : hostDocument;
|
|
28
|
-
useEffect(() => {
|
|
29
|
-
if (document?.title === void 0) {
|
|
30
|
-
return;
|
|
31
|
-
}
|
|
32
|
-
const title = __('Edit "%s" with Elementor', "elementor").replace("%s", document.title);
|
|
33
|
-
window.document.title = title;
|
|
34
|
-
}, [document?.title]);
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
// src/components/shell.tsx
|
|
38
19
|
function Shell() {
|
|
39
|
-
useSyncDocumentTitle();
|
|
40
20
|
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TopSlot, null), /* @__PURE__ */ React.createElement("div", { style: { display: "none" } }, /* @__PURE__ */ React.createElement(LogicSlot, null)));
|
|
41
21
|
}
|
|
42
22
|
|
|
@@ -50,17 +30,17 @@ import * as React2 from "react";
|
|
|
50
30
|
import { ThemeProvider as ThemeProviderBase } from "@elementor/ui";
|
|
51
31
|
|
|
52
32
|
// src/sync/use-color-scheme.ts
|
|
53
|
-
import { useEffect
|
|
33
|
+
import { useEffect, useState } from "react";
|
|
54
34
|
import { commandEndEvent, __privateListenTo as listenTo, v1ReadyEvent } from "@elementor/editor-v1-adapters";
|
|
55
35
|
function useColorScheme() {
|
|
56
36
|
const [colorScheme, setColorScheme] = useState(() => getV1ColorScheme());
|
|
57
|
-
|
|
37
|
+
useEffect(() => {
|
|
58
38
|
return listenTo(
|
|
59
39
|
v1ReadyEvent(),
|
|
60
40
|
() => setColorScheme(getV1ColorScheme())
|
|
61
41
|
);
|
|
62
42
|
}, []);
|
|
63
|
-
|
|
43
|
+
useEffect(() => {
|
|
64
44
|
return listenTo(
|
|
65
45
|
commandEndEvent("document/elements/settings"),
|
|
66
46
|
(e) => {
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/locations.ts","../src/init.tsx","../src/components/shell.tsx","../src/
|
|
1
|
+
{"version":3,"sources":["../src/locations.ts","../src/init.tsx","../src/components/shell.tsx","../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 { LogicSlot, TopSlot } from '../locations';\n\nexport default function Shell() {\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 * 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;AAGR,SAAR,QAAyB;AAC/B,SACC,0DACC,oCAAC,aAAQ,GACT,oCAAC,SAAI,OAAQ,EAAE,SAAS,OAAO,KAC9B,oCAAC,eAAU,CACZ,CACD;AAEF;;;ADPA,SAAS,yBAAyB;AAClC,SAAS,mBAAmB,eAAe,qBAAqB;AAChE,SAAS,+BAA+B,0BAA0B;;;AEPlE,YAAYC,YAAW;AACvB,SAAS,iBAAiB,yBAAyB;;;ACDnD,SAAS,WAAW,gBAAgB;AACpC,SAAS,iBAA+B,qBAAqB,UAAU,oBAAoB;AAUpF,SAAS,iBAAiB;AAChC,QAAM,CAAE,aAAa,cAAe,IAAI,SAAuB,MAAM,iBAAiB,CAAE;AAExF,YAAW,MAAM;AAChB,WAAO;AAAA,MACN,aAAa;AAAA,MACb,MAAM,eAAgB,iBAAiB,CAAE;AAAA,IAC1C;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,YAAW,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;;;AFHA,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","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.11.
|
|
4
|
+
"version": "0.11.1",
|
|
5
5
|
"private": false,
|
|
6
6
|
"author": "Elementor Team",
|
|
7
7
|
"homepage": "https://elementor.com/",
|
|
@@ -33,17 +33,15 @@
|
|
|
33
33
|
"dev": "tsup --config=../../tsup.dev.ts"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@elementor/editor-documents": "^0.11.3",
|
|
37
36
|
"@elementor/editor-v1-adapters": "^0.7.0",
|
|
38
37
|
"@elementor/locations": "^0.7.3",
|
|
39
38
|
"@elementor/query": "^0.2.1",
|
|
40
39
|
"@elementor/store": "^0.8.3",
|
|
41
|
-
"@elementor/ui": "^1.4.61"
|
|
42
|
-
"@wordpress/i18n": "^4.45.0"
|
|
40
|
+
"@elementor/ui": "^1.4.61"
|
|
43
41
|
},
|
|
44
42
|
"peerDependencies": {
|
|
45
43
|
"react": "^18.3.1",
|
|
46
44
|
"react-dom": "^18.3.1"
|
|
47
45
|
},
|
|
48
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "ea48212f4a9084fa323c3e70af093c5c0f6aa2d1"
|
|
49
47
|
}
|
|
@@ -2,19 +2,8 @@ import * as React from 'react';
|
|
|
2
2
|
import { render, screen } from '@testing-library/react';
|
|
3
3
|
import Shell from '../shell';
|
|
4
4
|
import { injectIntoTop } from '../../locations';
|
|
5
|
-
import { __useActiveDocument as useActiveDocument, __useHostDocument as useHostDocument } from '@elementor/editor-documents';
|
|
6
|
-
import { createMockDocument } from 'test-utils';
|
|
7
|
-
|
|
8
|
-
jest.mock( '@elementor/editor-documents', () => ( {
|
|
9
|
-
__useActiveDocument: jest.fn(),
|
|
10
|
-
__useHostDocument: jest.fn(),
|
|
11
|
-
} ) );
|
|
12
|
-
|
|
13
|
-
describe( '@elementor/editor Shell component', () => {
|
|
14
|
-
beforeEach( () => {
|
|
15
|
-
jest.resetAllMocks();
|
|
16
|
-
} );
|
|
17
5
|
|
|
6
|
+
describe( '<Shell />', () => {
|
|
18
7
|
it( 'should render', () => {
|
|
19
8
|
// Arrange.
|
|
20
9
|
injectIntoTop( {
|
|
@@ -28,89 +17,4 @@ describe( '@elementor/editor Shell component', () => {
|
|
|
28
17
|
// Assert.
|
|
29
18
|
expect( screen.getByText( 'test' ) ).toBeInTheDocument();
|
|
30
19
|
} );
|
|
31
|
-
|
|
32
|
-
it( 'should set the document title to be the active document', () => {
|
|
33
|
-
// Arrange - set the initial document.
|
|
34
|
-
jest.mocked( useActiveDocument ).mockReturnValue( createMockDocument( {
|
|
35
|
-
type: {
|
|
36
|
-
value: 'page',
|
|
37
|
-
label: 'Page',
|
|
38
|
-
},
|
|
39
|
-
title: 'Initial Document',
|
|
40
|
-
} ) );
|
|
41
|
-
|
|
42
|
-
// Act.
|
|
43
|
-
const { rerender } = render( <Shell /> );
|
|
44
|
-
|
|
45
|
-
// Assert.
|
|
46
|
-
expect( window.document.title ).toBe( 'Edit "Initial Document" with Elementor' );
|
|
47
|
-
|
|
48
|
-
// Arrange - set the new document.
|
|
49
|
-
jest.mocked( useActiveDocument ).mockReturnValue( createMockDocument( {
|
|
50
|
-
type: {
|
|
51
|
-
value: 'page',
|
|
52
|
-
label: 'Page',
|
|
53
|
-
},
|
|
54
|
-
title: 'New Document',
|
|
55
|
-
} ) );
|
|
56
|
-
|
|
57
|
-
// Act.
|
|
58
|
-
rerender( <Shell /> );
|
|
59
|
-
|
|
60
|
-
// Assert.
|
|
61
|
-
expect( window.document.title ).toBe( 'Edit "New Document" with Elementor' );
|
|
62
|
-
} );
|
|
63
|
-
|
|
64
|
-
it( 'should use the host document title when the active document is a kit', () => {
|
|
65
|
-
// Arrange.
|
|
66
|
-
jest.mocked( useActiveDocument ).mockReturnValue( createMockDocument( {
|
|
67
|
-
type: {
|
|
68
|
-
value: 'kit',
|
|
69
|
-
label: 'Kit',
|
|
70
|
-
},
|
|
71
|
-
title: 'My Kit',
|
|
72
|
-
} ) );
|
|
73
|
-
|
|
74
|
-
jest.mocked( useHostDocument ).mockReturnValue( createMockDocument( {
|
|
75
|
-
type: {
|
|
76
|
-
value: 'page',
|
|
77
|
-
label: 'Page',
|
|
78
|
-
},
|
|
79
|
-
title: 'My Page',
|
|
80
|
-
} ) );
|
|
81
|
-
|
|
82
|
-
window.document.title = 'Old title';
|
|
83
|
-
|
|
84
|
-
// Act.
|
|
85
|
-
render( <Shell /> );
|
|
86
|
-
|
|
87
|
-
// Assert.
|
|
88
|
-
expect( window.document.title ).toBe( 'Edit "My Page" with Elementor' );
|
|
89
|
-
} );
|
|
90
|
-
|
|
91
|
-
it( 'should not modify the title when there is no active document', () => {
|
|
92
|
-
// Arrange.
|
|
93
|
-
jest.mocked( useActiveDocument ).mockReturnValue( null );
|
|
94
|
-
|
|
95
|
-
window.document.title = 'Old title';
|
|
96
|
-
|
|
97
|
-
// Act.
|
|
98
|
-
render( <Shell /> );
|
|
99
|
-
|
|
100
|
-
// Assert.
|
|
101
|
-
expect( window.document.title ).toBe( 'Old title' );
|
|
102
|
-
} );
|
|
103
|
-
|
|
104
|
-
it( 'should allow empty string as title', () => {
|
|
105
|
-
// Arrange.
|
|
106
|
-
jest.mocked( useActiveDocument ).mockReturnValue( createMockDocument( {
|
|
107
|
-
title: '',
|
|
108
|
-
} ) );
|
|
109
|
-
|
|
110
|
-
// Act.
|
|
111
|
-
render( <Shell /> );
|
|
112
|
-
|
|
113
|
-
// Assert.
|
|
114
|
-
expect( window.document.title ).toBe( 'Edit "" with Elementor' );
|
|
115
|
-
} );
|
|
116
20
|
} );
|
package/src/components/shell.tsx
CHANGED
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import { useEffect } from 'react';
|
|
2
|
-
import { __useActiveDocument as useActiveDocument, __useHostDocument as useHostDocument } from '@elementor/editor-documents';
|
|
3
|
-
import { __ } from '@wordpress/i18n';
|
|
4
|
-
|
|
5
|
-
export default function useSyncDocumentTitle() {
|
|
6
|
-
const activeDocument = useActiveDocument();
|
|
7
|
-
const hostDocument = useHostDocument();
|
|
8
|
-
|
|
9
|
-
const document = activeDocument && activeDocument.type.value !== 'kit'
|
|
10
|
-
? activeDocument
|
|
11
|
-
: hostDocument;
|
|
12
|
-
|
|
13
|
-
useEffect( () => {
|
|
14
|
-
// Allow empty string as title.
|
|
15
|
-
if ( document?.title === undefined ) {
|
|
16
|
-
return;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
// translators: %s: Document title.
|
|
20
|
-
const title = __( 'Edit "%s" with Elementor', 'elementor' )
|
|
21
|
-
.replace( '%s', document.title );
|
|
22
|
-
|
|
23
|
-
window.document.title = title;
|
|
24
|
-
}, [ document?.title ] );
|
|
25
|
-
}
|