@wordpress/edit-site 6.49.1 → 6.50.1-next.v.202607070741.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 +2 -0
- package/build/components/editor/index.cjs +33 -101
- package/build/components/editor/index.cjs.map +3 -3
- package/build/components/layout/index.cjs +12 -14
- package/build/components/layout/index.cjs.map +3 -3
- package/build/components/page-patterns/fields.cjs +0 -36
- package/build/components/page-patterns/fields.cjs.map +2 -2
- package/build/components/page-patterns/index.cjs +4 -15
- package/build/components/page-patterns/index.cjs.map +2 -2
- package/build/components/save-panel/index.cjs +1 -2
- package/build/components/save-panel/index.cjs.map +2 -2
- package/build/components/site-hub/index.cjs +24 -155
- package/build/components/site-hub/index.cjs.map +3 -3
- package/build/index.cjs +3 -1
- package/build/index.cjs.map +2 -2
- package/build-module/components/editor/index.mjs +36 -104
- package/build-module/components/editor/index.mjs.map +2 -2
- package/build-module/components/layout/index.mjs +12 -14
- package/build-module/components/layout/index.mjs.map +2 -2
- package/build-module/components/page-patterns/fields.mjs +2 -41
- package/build-module/components/page-patterns/fields.mjs.map +2 -2
- package/build-module/components/page-patterns/index.mjs +5 -16
- package/build-module/components/page-patterns/index.mjs.map +2 -2
- package/build-module/components/save-panel/index.mjs +1 -2
- package/build-module/components/save-panel/index.mjs.map +2 -2
- package/build-module/components/site-hub/index.mjs +27 -158
- package/build-module/components/site-hub/index.mjs.map +2 -2
- package/build-module/index.mjs +3 -1
- package/build-module/index.mjs.map +2 -2
- package/build-style/style-rtl.css +71 -189
- package/build-style/style.css +71 -189
- package/package.json +48 -48
- package/src/components/editor/index.js +18 -101
- package/src/components/editor/style.scss +8 -19
- package/src/components/layout/index.js +12 -15
- package/src/components/layout/style.scss +5 -7
- package/src/components/page-patterns/fields.js +2 -50
- package/src/components/page-patterns/index.js +5 -23
- package/src/components/page-patterns/style.scss +1 -1
- package/src/components/save-panel/index.js +1 -2
- package/src/components/sidebar/style.scss +2 -0
- package/src/components/sidebar-global-styles/style.scss +7 -4
- package/src/components/sidebar-navigation-screen/style.scss +1 -1
- package/src/components/site-hub/index.js +7 -141
- package/src/components/site-hub/style.scss +0 -72
- package/src/index.js +3 -1
- package/src/style.scss +14 -11
- package/build/components/site-icon/index.cjs +0 -73
- package/build/components/site-icon/index.cjs.map +0 -7
- package/build-module/components/site-icon/index.mjs +0 -42
- package/build-module/components/site-icon/index.mjs.map +0 -7
- package/build-style/experimental-omnibar-rtl.css +0 -103
- package/build-style/experimental-omnibar.css +0 -103
- package/src/components/site-icon/index.js +0 -51
- package/src/components/site-icon/style.scss +0 -41
- package/src/experimental-omnibar.scss +0 -75
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
// packages/edit-site/src/components/editor/index.js
|
|
2
|
-
import clsx from "clsx";
|
|
3
2
|
import { useDispatch, useSelect } from "@wordpress/data";
|
|
4
|
-
import { Button
|
|
5
|
-
import { useInstanceId
|
|
3
|
+
import { Button } from "@wordpress/components";
|
|
4
|
+
import { useInstanceId } from "@wordpress/compose";
|
|
6
5
|
import {
|
|
7
6
|
EditorKeyboardShortcutsRegister,
|
|
8
7
|
privateApis as editorPrivateApis,
|
|
@@ -15,7 +14,7 @@ import { useCallback } from "@wordpress/element";
|
|
|
15
14
|
import { store as noticesStore } from "@wordpress/notices";
|
|
16
15
|
import { privateApis as routerPrivateApis } from "@wordpress/router";
|
|
17
16
|
import { decodeEntities } from "@wordpress/html-entities";
|
|
18
|
-
import { Icon,
|
|
17
|
+
import { Icon, chevronLeft, chevronRight } from "@wordpress/icons";
|
|
19
18
|
import { store as blockEditorStore } from "@wordpress/block-editor";
|
|
20
19
|
import { addQueryArgs } from "@wordpress/url";
|
|
21
20
|
import WelcomeGuide from "../welcome-guide/index.mjs";
|
|
@@ -27,7 +26,6 @@ import { isPreviewingTheme } from "../../utils/is-previewing-theme.mjs";
|
|
|
27
26
|
import SaveButton from "../save-button/index.mjs";
|
|
28
27
|
import SavePanel from "../save-panel/index.mjs";
|
|
29
28
|
import SiteEditorMoreMenu from "../more-menu/index.mjs";
|
|
30
|
-
import SiteIcon from "../site-icon/index.mjs";
|
|
31
29
|
import useEditorIframeProps from "../block-editor/use-editor-iframe-props.mjs";
|
|
32
30
|
import { ViewportSync } from "../block-editor/use-viewport-sync.mjs";
|
|
33
31
|
import useEditorTitle from "./use-editor-title.mjs";
|
|
@@ -42,28 +40,6 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
|
42
40
|
var { Editor, BackButton } = unlock(editorPrivateApis);
|
|
43
41
|
var { useHistory, useLocation } = unlock(routerPrivateApis);
|
|
44
42
|
var { BlockKeyboardShortcuts } = unlock(blockLibraryPrivateApis);
|
|
45
|
-
var toggleHomeIconVariants = {
|
|
46
|
-
edit: {
|
|
47
|
-
opacity: 0,
|
|
48
|
-
scale: 0.2
|
|
49
|
-
},
|
|
50
|
-
hover: {
|
|
51
|
-
opacity: 1,
|
|
52
|
-
scale: 1,
|
|
53
|
-
clipPath: "inset( 22% round 2px )"
|
|
54
|
-
}
|
|
55
|
-
};
|
|
56
|
-
var siteIconVariants = {
|
|
57
|
-
edit: {
|
|
58
|
-
clipPath: "inset(0% round 0px)"
|
|
59
|
-
},
|
|
60
|
-
hover: {
|
|
61
|
-
clipPath: "inset( 22% round 2px )"
|
|
62
|
-
},
|
|
63
|
-
tap: {
|
|
64
|
-
clipPath: "inset(0% round 0px)"
|
|
65
|
-
}
|
|
66
|
-
};
|
|
67
43
|
function getListPathForPostType(postType) {
|
|
68
44
|
switch (postType) {
|
|
69
45
|
case "navigation":
|
|
@@ -96,7 +72,6 @@ function getNavigationPath(location, postType) {
|
|
|
96
72
|
return addQueryArgs(path, { canvas: void 0 });
|
|
97
73
|
}
|
|
98
74
|
function EditSiteEditor({ isHomeRoute = false }) {
|
|
99
|
-
const disableMotion = useReducedMotion();
|
|
100
75
|
const location = useLocation();
|
|
101
76
|
const history = useHistory();
|
|
102
77
|
const { canvas = "view" } = location.query;
|
|
@@ -105,14 +80,10 @@ function EditSiteEditor({ isHomeRoute = false }) {
|
|
|
105
80
|
const entity = useResolveEditedEntity();
|
|
106
81
|
useSyncDeprecatedEntityIntoState(entity);
|
|
107
82
|
const { postType, postId, context } = entity;
|
|
108
|
-
const
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
isBlockBasedTheme: getCurrentTheme()?.is_block_theme,
|
|
113
|
-
hasSiteIcon: !!siteData?.site_icon_url
|
|
114
|
-
};
|
|
115
|
-
}, []);
|
|
83
|
+
const isBlockBasedTheme = useSelect(
|
|
84
|
+
(select) => select(coreDataStore).getCurrentTheme()?.is_block_theme,
|
|
85
|
+
[]
|
|
86
|
+
);
|
|
116
87
|
const postWithTemplate = !!context?.postId;
|
|
117
88
|
useEditorTitle(
|
|
118
89
|
postWithTemplate ? context.postType : postType,
|
|
@@ -180,10 +151,6 @@ function EditSiteEditor({ isHomeRoute = false }) {
|
|
|
180
151
|
]
|
|
181
152
|
);
|
|
182
153
|
const isReady = !isLoading;
|
|
183
|
-
const transition = {
|
|
184
|
-
duration: disableMotion ? 0 : 0.2
|
|
185
|
-
};
|
|
186
|
-
const hasAdminBarInEditor = window.__experimentalAdminBarInEditor;
|
|
187
154
|
return !isBlockBasedTheme && isHomeRoute ? /* @__PURE__ */ jsx(SitePreview, {}) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
188
155
|
/* @__PURE__ */ jsx(EditorKeyboardShortcutsRegister, {}),
|
|
189
156
|
isEditMode && /* @__PURE__ */ jsx(BlockKeyboardShortcuts, {}),
|
|
@@ -209,71 +176,36 @@ function EditSiteEditor({ isHomeRoute = false }) {
|
|
|
209
176
|
extraSidebarPanels: !postWithTemplate && /* @__PURE__ */ jsx(PluginTemplateSettingPanel.Slot, {}),
|
|
210
177
|
children: [
|
|
211
178
|
isEditMode && /* @__PURE__ */ jsx(ViewportSync, {}),
|
|
212
|
-
isEditMode && /* @__PURE__ */ jsx(BackButton, { children: ({ length }) => length <= 1 && /* @__PURE__ */ jsxs(
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
showTooltip: true,
|
|
228
|
-
tooltipPosition: "middle right",
|
|
229
|
-
onClick: () => {
|
|
230
|
-
resetZoomLevel();
|
|
231
|
-
setCurrentRevisionId(null);
|
|
232
|
-
history.navigate(
|
|
233
|
-
getNavigationPath(
|
|
234
|
-
location,
|
|
235
|
-
postWithTemplate ? context.postType : postType
|
|
236
|
-
),
|
|
237
|
-
{
|
|
238
|
-
transition: "canvas-mode-view-transition"
|
|
239
|
-
}
|
|
240
|
-
);
|
|
241
|
-
},
|
|
242
|
-
children: !hasAdminBarInEditor && /* @__PURE__ */ jsx(
|
|
243
|
-
motion.div,
|
|
244
|
-
{
|
|
245
|
-
variants: !disableMotion && siteIconVariants,
|
|
246
|
-
children: /* @__PURE__ */ jsx(SiteIcon, { className: "edit-site-editor__view-mode-toggle-icon" })
|
|
247
|
-
}
|
|
248
|
-
)
|
|
249
|
-
}
|
|
250
|
-
),
|
|
251
|
-
hasAdminBarInEditor ? /* @__PURE__ */ jsx("div", { className: "edit-site-editor__back-icon", children: /* @__PURE__ */ jsx(
|
|
252
|
-
Icon,
|
|
253
|
-
{
|
|
254
|
-
icon: isRTL() ? arrowUpRight : arrowUpLeft
|
|
255
|
-
}
|
|
256
|
-
) }) : /* @__PURE__ */ jsx(
|
|
257
|
-
motion.div,
|
|
258
|
-
{
|
|
259
|
-
className: clsx(
|
|
260
|
-
"edit-site-editor__back-icon",
|
|
261
|
-
{
|
|
262
|
-
"has-site-icon": hasSiteIcon
|
|
263
|
-
}
|
|
179
|
+
isEditMode && /* @__PURE__ */ jsx(BackButton, { children: ({ length }) => length <= 1 && /* @__PURE__ */ jsxs("div", { className: "edit-site-editor__view-mode-toggle", children: [
|
|
180
|
+
/* @__PURE__ */ jsx(
|
|
181
|
+
Button,
|
|
182
|
+
{
|
|
183
|
+
__next40pxDefaultSize: true,
|
|
184
|
+
label: __("Open Navigation"),
|
|
185
|
+
showTooltip: true,
|
|
186
|
+
tooltipPosition: "middle right",
|
|
187
|
+
onClick: () => {
|
|
188
|
+
resetZoomLevel();
|
|
189
|
+
setCurrentRevisionId(null);
|
|
190
|
+
history.navigate(
|
|
191
|
+
getNavigationPath(
|
|
192
|
+
location,
|
|
193
|
+
postWithTemplate ? context.postType : postType
|
|
264
194
|
),
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
195
|
+
{
|
|
196
|
+
transition: "canvas-mode-view-transition"
|
|
197
|
+
}
|
|
198
|
+
);
|
|
199
|
+
}
|
|
200
|
+
}
|
|
201
|
+
),
|
|
202
|
+
/* @__PURE__ */ jsx("div", { className: "edit-site-editor__back-icon", children: /* @__PURE__ */ jsx(
|
|
203
|
+
Icon,
|
|
204
|
+
{
|
|
205
|
+
icon: isRTL() ? chevronRight : chevronLeft
|
|
206
|
+
}
|
|
207
|
+
) })
|
|
208
|
+
] }) }),
|
|
277
209
|
/* @__PURE__ */ jsx(SiteEditorMoreMenu, {})
|
|
278
210
|
]
|
|
279
211
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/editor/index.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { Button, __unstableMotion as motion } from '@wordpress/components';\nimport { useInstanceId, useReducedMotion } from '@wordpress/compose';\nimport {\n\tEditorKeyboardShortcutsRegister,\n\tprivateApis as editorPrivateApis,\n\tstore as editorStore,\n} from '@wordpress/editor';\nimport { __, isRTL, sprintf } from '@wordpress/i18n';\nimport { store as coreDataStore } from '@wordpress/core-data';\nimport { privateApis as blockLibraryPrivateApis } from '@wordpress/block-library';\nimport { useCallback } from '@wordpress/element';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { Icon, arrowUpLeft, arrowUpRight } from '@wordpress/icons';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\nimport { addQueryArgs } from '@wordpress/url';\n\n/**\n * Internal dependencies\n */\nimport WelcomeGuide from '../welcome-guide';\nimport CanvasLoader from '../canvas-loader';\nimport { unlock } from '../../lock-unlock';\nimport { useSpecificEditorSettings } from '../block-editor/use-site-editor-settings';\nimport PluginTemplateSettingPanel from '../plugin-template-setting-panel';\nimport { isPreviewingTheme } from '../../utils/is-previewing-theme';\nimport SaveButton from '../save-button';\nimport SavePanel from '../save-panel';\nimport SiteEditorMoreMenu from '../more-menu';\nimport SiteIcon from '../site-icon';\nimport useEditorIframeProps from '../block-editor/use-editor-iframe-props';\nimport { ViewportSync } from '../block-editor/use-viewport-sync';\nimport useEditorTitle from './use-editor-title';\nimport { useIsSiteEditorLoading } from '../layout/hooks';\nimport { useAdaptEditorToCanvas } from './use-adapt-editor-to-canvas';\nimport {\n\tuseResolveEditedEntity,\n\tuseSyncDeprecatedEntityIntoState,\n} from './use-resolve-edited-entity';\nimport SitePreview from './site-preview';\n\nconst { Editor, BackButton } = unlock( editorPrivateApis );\nconst { useHistory, useLocation } = unlock( routerPrivateApis );\nconst { BlockKeyboardShortcuts } = unlock( blockLibraryPrivateApis );\n\nconst toggleHomeIconVariants = {\n\tedit: {\n\t\topacity: 0,\n\t\tscale: 0.2,\n\t},\n\thover: {\n\t\topacity: 1,\n\t\tscale: 1,\n\t\tclipPath: 'inset( 22% round 2px )',\n\t},\n};\n\nconst siteIconVariants = {\n\tedit: {\n\t\tclipPath: 'inset(0% round 0px)',\n\t},\n\thover: {\n\t\tclipPath: 'inset( 22% round 2px )',\n\t},\n\ttap: {\n\t\tclipPath: 'inset(0% round 0px)',\n\t},\n};\n\nfunction getListPathForPostType( postType ) {\n\tswitch ( postType ) {\n\t\tcase 'navigation':\n\t\t\treturn '/navigation';\n\t\tcase 'wp_block':\n\t\t\treturn '/pattern?postType=wp_block';\n\t\tcase 'wp_template_part':\n\t\t\treturn '/pattern?postType=wp_template_part';\n\t\tcase 'wp_template':\n\t\t\treturn '/template';\n\t\tcase 'page':\n\t\t\treturn '/page';\n\t\tcase 'post':\n\t\t\treturn '/';\n\t}\n\tthrow 'Unknown post type';\n}\n\nfunction getNavigationPath( location, postType ) {\n\tconst { path, name } = location;\n\tif (\n\t\t[\n\t\t\t'pattern-item',\n\t\t\t'template-part-item',\n\t\t\t'page-item',\n\t\t\t'template-item',\n\t\t\t'static-template-item',\n\t\t\t'post-item',\n\t\t].includes( name )\n\t) {\n\t\treturn getListPathForPostType( postType );\n\t}\n\treturn addQueryArgs( path, { canvas: undefined } );\n}\n\nexport default function EditSiteEditor( { isHomeRoute = false } ) {\n\tconst disableMotion = useReducedMotion();\n\tconst location = useLocation();\n\tconst history = useHistory();\n\tconst { canvas = 'view' } = location.query;\n\tconst isLoading = useIsSiteEditorLoading();\n\tuseAdaptEditorToCanvas( canvas );\n\tconst entity = useResolveEditedEntity();\n\t// deprecated sync state with url\n\tuseSyncDeprecatedEntityIntoState( entity );\n\tconst { postType, postId, context } = entity;\n\tconst { isBlockBasedTheme, hasSiteIcon } = useSelect( ( select ) => {\n\t\tconst { getCurrentTheme, getEntityRecord } = select( coreDataStore );\n\t\tconst siteData = getEntityRecord( 'root', '__unstableBase', undefined );\n\n\t\treturn {\n\t\t\tisBlockBasedTheme: getCurrentTheme()?.is_block_theme,\n\t\t\thasSiteIcon: !! siteData?.site_icon_url,\n\t\t};\n\t}, [] );\n\tconst postWithTemplate = !! context?.postId;\n\tuseEditorTitle(\n\t\tpostWithTemplate ? context.postType : postType,\n\t\tpostWithTemplate ? context.postId : postId\n\t);\n\tconst _isPreviewingTheme = isPreviewingTheme();\n\tconst iframeProps = useEditorIframeProps();\n\tconst isEditMode = canvas === 'edit';\n\tconst loadingProgressId = useInstanceId(\n\t\tCanvasLoader,\n\t\t'edit-site-editor__loading-progress'\n\t);\n\n\tconst editorSettings = useSpecificEditorSettings();\n\tconst { resetZoomLevel } = unlock( useDispatch( blockEditorStore ) );\n\tconst { setCurrentRevisionId } = unlock( useDispatch( editorStore ) );\n\tconst { createSuccessNotice } = useDispatch( noticesStore );\n\tconst onActionPerformed = useCallback(\n\t\t( actionId, items ) => {\n\t\t\tswitch ( actionId ) {\n\t\t\t\tcase 'move-to-trash':\n\t\t\t\tcase 'delete-post':\n\t\t\t\t\t{\n\t\t\t\t\t\thistory.navigate(\n\t\t\t\t\t\t\tgetListPathForPostType(\n\t\t\t\t\t\t\t\tpostWithTemplate ? context.postType : postType\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'duplicate-post':\n\t\t\t\t\t{\n\t\t\t\t\t\tconst newItem = items[ 0 ];\n\t\t\t\t\t\tconst _title =\n\t\t\t\t\t\t\ttypeof newItem.title === 'string'\n\t\t\t\t\t\t\t\t? newItem.title\n\t\t\t\t\t\t\t\t: newItem.title?.rendered;\n\t\t\t\t\t\tcreateSuccessNotice(\n\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t// translators: %s: Title of the created post or template, e.g: \"Hello world\".\n\t\t\t\t\t\t\t\t__( '\"%s\" successfully created.' ),\n\t\t\t\t\t\t\t\tdecodeEntities( _title ) || __( '(no title)' )\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\t\t\t\tid: 'duplicate-post-action',\n\t\t\t\t\t\t\t\tactions: [\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tlabel: __( 'Edit' ),\n\t\t\t\t\t\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\t\t\t\t\t\thistory.navigate(\n\t\t\t\t\t\t\t\t\t\t\t\t`/${ newItem.type }/${ newItem.id }?canvas=edit`\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tpostType,\n\t\t\tcontext?.postType,\n\t\t\tpostWithTemplate,\n\t\t\thistory,\n\t\t\tcreateSuccessNotice,\n\t\t]\n\t);\n\n\tconst isReady = ! isLoading;\n\tconst transition = {\n\t\tduration: disableMotion ? 0 : 0.2,\n\t};\n\n\tconst hasAdminBarInEditor = window.__experimentalAdminBarInEditor;\n\n\treturn ! isBlockBasedTheme && isHomeRoute ? (\n\t\t<SitePreview />\n\t) : (\n\t\t<>\n\t\t\t<EditorKeyboardShortcutsRegister />\n\t\t\t{ isEditMode && <BlockKeyboardShortcuts /> }\n\t\t\t{ ! isReady ? <CanvasLoader id={ loadingProgressId } /> : null }\n\t\t\t{ isEditMode && isReady && (\n\t\t\t\t<WelcomeGuide\n\t\t\t\t\tpostType={ postWithTemplate ? context.postType : postType }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ isReady && (\n\t\t\t\t<Editor\n\t\t\t\t\tpostType={ postWithTemplate ? context.postType : postType }\n\t\t\t\t\tpostId={ postWithTemplate ? context.postId : postId }\n\t\t\t\t\ttemplateId={ postWithTemplate ? postId : undefined }\n\t\t\t\t\tsettings={ editorSettings }\n\t\t\t\t\tclassName=\"edit-site-editor__editor-interface\"\n\t\t\t\t\tcustomSaveButton={\n\t\t\t\t\t\t_isPreviewingTheme && <SaveButton size=\"compact\" />\n\t\t\t\t\t}\n\t\t\t\t\tcustomSavePanel={ _isPreviewingTheme && <SavePanel /> }\n\t\t\t\t\tiframeProps={ iframeProps }\n\t\t\t\t\tonActionPerformed={ onActionPerformed }\n\t\t\t\t\textraSidebarPanels={\n\t\t\t\t\t\t! postWithTemplate && (\n\t\t\t\t\t\t\t<PluginTemplateSettingPanel.Slot />\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{ isEditMode && <ViewportSync /> }\n\t\t\t\t\t{ isEditMode && (\n\t\t\t\t\t\t<BackButton>\n\t\t\t\t\t\t\t{ ( { length } ) =>\n\t\t\t\t\t\t\t\tlength <= 1 && (\n\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-editor__view-mode-toggle\"\n\t\t\t\t\t\t\t\t\t\ttransition={ transition }\n\t\t\t\t\t\t\t\t\t\tanimate=\"edit\"\n\t\t\t\t\t\t\t\t\t\tinitial=\"edit\"\n\t\t\t\t\t\t\t\t\t\twhileHover=\"hover\"\n\t\t\t\t\t\t\t\t\t\twhileTap=\"tap\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Open Navigation' ) }\n\t\t\t\t\t\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\t\t\t\t\t\ttooltipPosition=\"middle right\"\n\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\tresetZoomLevel();\n\t\t\t\t\t\t\t\t\t\t\t\tsetCurrentRevisionId( null );\n\t\t\t\t\t\t\t\t\t\t\t\thistory.navigate(\n\t\t\t\t\t\t\t\t\t\t\t\t\tgetNavigationPath(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tlocation,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tpostWithTemplate\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? context.postType\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: postType\n\t\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttransition:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'canvas-mode-view-transition',\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ ! hasAdminBarInEditor && (\n\t\t\t\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariants={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t! disableMotion &&\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsiteIconVariants\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<SiteIcon className=\"edit-site-editor__view-mode-toggle-icon\" />\n\t\t\t\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t{ hasAdminBarInEditor ? (\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"edit-site-editor__back-icon\">\n\t\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisRTL()\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? arrowUpRight\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: arrowUpLeft\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t\t\t\t'edit-site-editor__back-icon',\n\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'has-site-icon':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\thasSiteIcon,\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\tvariants={\n\t\t\t\t\t\t\t\t\t\t\t\t\t! disableMotion &&\n\t\t\t\t\t\t\t\t\t\t\t\t\ttoggleHomeIconVariants\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisRTL()\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? arrowUpRight\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: arrowUpLeft\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</BackButton>\n\t\t\t\t\t) }\n\t\t\t\t\t<SiteEditorMoreMenu />\n\t\t\t\t</Editor>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],
|
|
5
|
-
"mappings": ";AAGA,
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { Button } from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport {\n\tEditorKeyboardShortcutsRegister,\n\tprivateApis as editorPrivateApis,\n\tstore as editorStore,\n} from '@wordpress/editor';\nimport { __, isRTL, sprintf } from '@wordpress/i18n';\nimport { store as coreDataStore } from '@wordpress/core-data';\nimport { privateApis as blockLibraryPrivateApis } from '@wordpress/block-library';\nimport { useCallback } from '@wordpress/element';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { Icon, chevronLeft, chevronRight } from '@wordpress/icons';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\nimport { addQueryArgs } from '@wordpress/url';\n\n/**\n * Internal dependencies\n */\nimport WelcomeGuide from '../welcome-guide';\nimport CanvasLoader from '../canvas-loader';\nimport { unlock } from '../../lock-unlock';\nimport { useSpecificEditorSettings } from '../block-editor/use-site-editor-settings';\nimport PluginTemplateSettingPanel from '../plugin-template-setting-panel';\nimport { isPreviewingTheme } from '../../utils/is-previewing-theme';\nimport SaveButton from '../save-button';\nimport SavePanel from '../save-panel';\nimport SiteEditorMoreMenu from '../more-menu';\nimport useEditorIframeProps from '../block-editor/use-editor-iframe-props';\nimport { ViewportSync } from '../block-editor/use-viewport-sync';\nimport useEditorTitle from './use-editor-title';\nimport { useIsSiteEditorLoading } from '../layout/hooks';\nimport { useAdaptEditorToCanvas } from './use-adapt-editor-to-canvas';\nimport {\n\tuseResolveEditedEntity,\n\tuseSyncDeprecatedEntityIntoState,\n} from './use-resolve-edited-entity';\nimport SitePreview from './site-preview';\n\nconst { Editor, BackButton } = unlock( editorPrivateApis );\nconst { useHistory, useLocation } = unlock( routerPrivateApis );\nconst { BlockKeyboardShortcuts } = unlock( blockLibraryPrivateApis );\n\nfunction getListPathForPostType( postType ) {\n\tswitch ( postType ) {\n\t\tcase 'navigation':\n\t\t\treturn '/navigation';\n\t\tcase 'wp_block':\n\t\t\treturn '/pattern?postType=wp_block';\n\t\tcase 'wp_template_part':\n\t\t\treturn '/pattern?postType=wp_template_part';\n\t\tcase 'wp_template':\n\t\t\treturn '/template';\n\t\tcase 'page':\n\t\t\treturn '/page';\n\t\tcase 'post':\n\t\t\treturn '/';\n\t}\n\tthrow 'Unknown post type';\n}\n\nfunction getNavigationPath( location, postType ) {\n\tconst { path, name } = location;\n\tif (\n\t\t[\n\t\t\t'pattern-item',\n\t\t\t'template-part-item',\n\t\t\t'page-item',\n\t\t\t'template-item',\n\t\t\t'static-template-item',\n\t\t\t'post-item',\n\t\t].includes( name )\n\t) {\n\t\treturn getListPathForPostType( postType );\n\t}\n\treturn addQueryArgs( path, { canvas: undefined } );\n}\n\nexport default function EditSiteEditor( { isHomeRoute = false } ) {\n\tconst location = useLocation();\n\tconst history = useHistory();\n\tconst { canvas = 'view' } = location.query;\n\tconst isLoading = useIsSiteEditorLoading();\n\tuseAdaptEditorToCanvas( canvas );\n\tconst entity = useResolveEditedEntity();\n\t// deprecated sync state with url\n\tuseSyncDeprecatedEntityIntoState( entity );\n\tconst { postType, postId, context } = entity;\n\tconst isBlockBasedTheme = useSelect(\n\t\t( select ) => select( coreDataStore ).getCurrentTheme()?.is_block_theme,\n\t\t[]\n\t);\n\tconst postWithTemplate = !! context?.postId;\n\tuseEditorTitle(\n\t\tpostWithTemplate ? context.postType : postType,\n\t\tpostWithTemplate ? context.postId : postId\n\t);\n\tconst _isPreviewingTheme = isPreviewingTheme();\n\tconst iframeProps = useEditorIframeProps();\n\tconst isEditMode = canvas === 'edit';\n\tconst loadingProgressId = useInstanceId(\n\t\tCanvasLoader,\n\t\t'edit-site-editor__loading-progress'\n\t);\n\n\tconst editorSettings = useSpecificEditorSettings();\n\tconst { resetZoomLevel } = unlock( useDispatch( blockEditorStore ) );\n\tconst { setCurrentRevisionId } = unlock( useDispatch( editorStore ) );\n\tconst { createSuccessNotice } = useDispatch( noticesStore );\n\tconst onActionPerformed = useCallback(\n\t\t( actionId, items ) => {\n\t\t\tswitch ( actionId ) {\n\t\t\t\tcase 'move-to-trash':\n\t\t\t\tcase 'delete-post':\n\t\t\t\t\t{\n\t\t\t\t\t\thistory.navigate(\n\t\t\t\t\t\t\tgetListPathForPostType(\n\t\t\t\t\t\t\t\tpostWithTemplate ? context.postType : postType\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'duplicate-post':\n\t\t\t\t\t{\n\t\t\t\t\t\tconst newItem = items[ 0 ];\n\t\t\t\t\t\tconst _title =\n\t\t\t\t\t\t\ttypeof newItem.title === 'string'\n\t\t\t\t\t\t\t\t? newItem.title\n\t\t\t\t\t\t\t\t: newItem.title?.rendered;\n\t\t\t\t\t\tcreateSuccessNotice(\n\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t// translators: %s: Title of the created post or template, e.g: \"Hello world\".\n\t\t\t\t\t\t\t\t__( '\"%s\" successfully created.' ),\n\t\t\t\t\t\t\t\tdecodeEntities( _title ) || __( '(no title)' )\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\t\t\t\tid: 'duplicate-post-action',\n\t\t\t\t\t\t\t\tactions: [\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tlabel: __( 'Edit' ),\n\t\t\t\t\t\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\t\t\t\t\t\thistory.navigate(\n\t\t\t\t\t\t\t\t\t\t\t\t`/${ newItem.type }/${ newItem.id }?canvas=edit`\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tpostType,\n\t\t\tcontext?.postType,\n\t\t\tpostWithTemplate,\n\t\t\thistory,\n\t\t\tcreateSuccessNotice,\n\t\t]\n\t);\n\n\tconst isReady = ! isLoading;\n\n\treturn ! isBlockBasedTheme && isHomeRoute ? (\n\t\t<SitePreview />\n\t) : (\n\t\t<>\n\t\t\t<EditorKeyboardShortcutsRegister />\n\t\t\t{ isEditMode && <BlockKeyboardShortcuts /> }\n\t\t\t{ ! isReady ? <CanvasLoader id={ loadingProgressId } /> : null }\n\t\t\t{ isEditMode && isReady && (\n\t\t\t\t<WelcomeGuide\n\t\t\t\t\tpostType={ postWithTemplate ? context.postType : postType }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ isReady && (\n\t\t\t\t<Editor\n\t\t\t\t\tpostType={ postWithTemplate ? context.postType : postType }\n\t\t\t\t\tpostId={ postWithTemplate ? context.postId : postId }\n\t\t\t\t\ttemplateId={ postWithTemplate ? postId : undefined }\n\t\t\t\t\tsettings={ editorSettings }\n\t\t\t\t\tclassName=\"edit-site-editor__editor-interface\"\n\t\t\t\t\tcustomSaveButton={\n\t\t\t\t\t\t_isPreviewingTheme && <SaveButton size=\"compact\" />\n\t\t\t\t\t}\n\t\t\t\t\tcustomSavePanel={ _isPreviewingTheme && <SavePanel /> }\n\t\t\t\t\tiframeProps={ iframeProps }\n\t\t\t\t\tonActionPerformed={ onActionPerformed }\n\t\t\t\t\textraSidebarPanels={\n\t\t\t\t\t\t! postWithTemplate && (\n\t\t\t\t\t\t\t<PluginTemplateSettingPanel.Slot />\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{ isEditMode && <ViewportSync /> }\n\t\t\t\t\t{ isEditMode && (\n\t\t\t\t\t\t<BackButton>\n\t\t\t\t\t\t\t{ ( { length } ) =>\n\t\t\t\t\t\t\t\tlength <= 1 && (\n\t\t\t\t\t\t\t\t\t<div className=\"edit-site-editor__view-mode-toggle\">\n\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Open Navigation' ) }\n\t\t\t\t\t\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\t\t\t\t\t\ttooltipPosition=\"middle right\"\n\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\tresetZoomLevel();\n\t\t\t\t\t\t\t\t\t\t\t\tsetCurrentRevisionId( null );\n\t\t\t\t\t\t\t\t\t\t\t\thistory.navigate(\n\t\t\t\t\t\t\t\t\t\t\t\t\tgetNavigationPath(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tlocation,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tpostWithTemplate\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? context.postType\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: postType\n\t\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttransition:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'canvas-mode-view-transition',\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<div className=\"edit-site-editor__back-icon\">\n\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\t\t\tisRTL()\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? chevronRight\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: chevronLeft\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</BackButton>\n\t\t\t\t\t) }\n\t\t\t\t\t<SiteEditorMoreMenu />\n\t\t\t\t</Editor>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -13,6 +13,7 @@ import {
|
|
|
13
13
|
useResizeObserver,
|
|
14
14
|
usePrevious
|
|
15
15
|
} from "@wordpress/compose";
|
|
16
|
+
import { focus } from "@wordpress/dom";
|
|
16
17
|
import { __, sprintf } from "@wordpress/i18n";
|
|
17
18
|
import { useState, useRef, useEffect, useMemo } from "@wordpress/element";
|
|
18
19
|
import {
|
|
@@ -27,7 +28,7 @@ import { SnackbarNotices, store as noticesStore } from "@wordpress/notices";
|
|
|
27
28
|
import { useDispatch, useSelect } from "@wordpress/data";
|
|
28
29
|
import { store as preferencesStore } from "@wordpress/preferences";
|
|
29
30
|
import { Tooltip } from "@wordpress/ui";
|
|
30
|
-
import {
|
|
31
|
+
import { SiteHubMobile } from "../site-hub/index.mjs";
|
|
31
32
|
import ResizableFrame from "../resizable-frame/index.mjs";
|
|
32
33
|
import { unlock } from "../../lock-unlock.mjs";
|
|
33
34
|
import SaveKeyboardShortcut from "../save-keyboard-shortcut/index.mjs";
|
|
@@ -44,12 +45,11 @@ var CONTENT_COLOR = { background: "#ffffff" };
|
|
|
44
45
|
function Layout() {
|
|
45
46
|
const { query, name: routeKey, areas, widths } = useLocation();
|
|
46
47
|
const canvas = routeKey === "notfound" ? "view" : query?.canvas ?? "view";
|
|
47
|
-
const
|
|
48
|
-
const showDesktopSiteHub = !hasAdminBarInEditor;
|
|
49
|
-
const showMobileSiteHub = !hasAdminBarInEditor || routeKey !== "home";
|
|
48
|
+
const showMobileSiteHub = !!areas.mobileContent;
|
|
50
49
|
const hasMobileAreas = areas.mobileSidebar || areas.mobileContent || areas.preview;
|
|
51
50
|
const isMobileViewport = useViewportMatch("medium", "<");
|
|
52
|
-
const
|
|
51
|
+
const mobileToggleRef = useRef();
|
|
52
|
+
const sidebarRegionRef = useRef();
|
|
53
53
|
const navigateRegionsProps = useNavigateRegions();
|
|
54
54
|
const disableMotion = useReducedMotion();
|
|
55
55
|
const [canvasResizer, canvasSize] = useResizeObserver();
|
|
@@ -71,7 +71,11 @@ function Layout() {
|
|
|
71
71
|
const previousCanvaMode = usePrevious(canvas);
|
|
72
72
|
useEffect(() => {
|
|
73
73
|
if (previousCanvaMode === "edit") {
|
|
74
|
-
|
|
74
|
+
const desktopToggle = sidebarRegionRef.current ? (
|
|
75
|
+
// We're typically expecting the `<DashboardBackButton />` component as the first tabbable element.
|
|
76
|
+
focus.tabbable.find(sidebarRegionRef.current)[0]
|
|
77
|
+
) : void 0;
|
|
78
|
+
(desktopToggle ?? mobileToggleRef.current)?.focus();
|
|
75
79
|
}
|
|
76
80
|
}, [canvas]);
|
|
77
81
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
@@ -94,6 +98,7 @@ function Layout() {
|
|
|
94
98
|
(!isMobileViewport || !hasMobileAreas) && /* @__PURE__ */ jsx(
|
|
95
99
|
NavigableRegion,
|
|
96
100
|
{
|
|
101
|
+
ref: sidebarRegionRef,
|
|
97
102
|
ariaLabel: __("Navigation"),
|
|
98
103
|
className: "edit-site-layout__sidebar-region",
|
|
99
104
|
children: /* @__PURE__ */ jsx(AnimatePresence, { children: canvas === "view" && /* @__PURE__ */ jsxs(
|
|
@@ -112,13 +117,6 @@ function Layout() {
|
|
|
112
117
|
},
|
|
113
118
|
className: "edit-site-layout__sidebar",
|
|
114
119
|
children: [
|
|
115
|
-
showDesktopSiteHub && /* @__PURE__ */ jsx(
|
|
116
|
-
SiteHub,
|
|
117
|
-
{
|
|
118
|
-
ref: toggleRef,
|
|
119
|
-
isTransparent: isResizableFrameOversized
|
|
120
|
-
}
|
|
121
|
-
),
|
|
122
120
|
/* @__PURE__ */ jsx(SidebarNavigationProvider, { children: /* @__PURE__ */ jsx(
|
|
123
121
|
SidebarContent,
|
|
124
122
|
{
|
|
@@ -140,7 +138,7 @@ function Layout() {
|
|
|
140
138
|
showMobileSiteHub && /* @__PURE__ */ jsx(
|
|
141
139
|
SiteHubMobile,
|
|
142
140
|
{
|
|
143
|
-
ref:
|
|
141
|
+
ref: mobileToggleRef,
|
|
144
142
|
isTransparent: isResizableFrameOversized
|
|
145
143
|
}
|
|
146
144
|
),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/layout/index.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { NavigableRegion, getAdminThemeColors } from '@wordpress/admin-ui';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n\t__unstableUseNavigateRegions as useNavigateRegions,\n\tSlotFillProvider,\n} from '@wordpress/components';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tuseResizeObserver,\n\tusePrevious,\n} from '@wordpress/compose';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useState, useRef, useEffect, useMemo } from '@wordpress/element';\nimport {\n\tUnsavedChangesWarning,\n\tErrorBoundary,\n\tprivateApis as editorPrivateApis,\n} from '@wordpress/editor';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\nimport { ThemeProvider } from '@wordpress/theme';\nimport { PluginArea } from '@wordpress/plugins';\nimport { SnackbarNotices, store as noticesStore } from '@wordpress/notices';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { Tooltip } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { default as SiteHub, SiteHubMobile } from '../site-hub';\nimport ResizableFrame from '../resizable-frame';\nimport { unlock } from '../../lock-unlock';\nimport SaveKeyboardShortcut from '../save-keyboard-shortcut';\nimport { useIsSiteEditorLoading } from './hooks';\nimport useMovingAnimation from './animation';\nimport { SidebarContent, SidebarNavigationProvider } from '../sidebar';\nimport SaveHub from '../save-hub';\nimport SavePanel from '../save-panel';\n\nconst { useLocation } = unlock( routerPrivateApis );\nconst { useStyle, UploadProgressSnackbar } = unlock( editorPrivateApis );\n\nconst ANIMATION_DURATION = 0.3;\nconst CONTENT_COLOR = { background: '#ffffff' };\n\nfunction Layout() {\n\tconst { query, name: routeKey, areas, widths } = useLocation();\n\t// Force canvas to 'view' on notfound route to show the error message and allow navigation.\n\tconst canvas = routeKey === 'notfound' ? 'view' : query?.canvas ?? 'view';\n\tconst hasAdminBarInEditor = window.__experimentalAdminBarInEditor;\n\tconst showDesktopSiteHub = ! hasAdminBarInEditor;\n\tconst showMobileSiteHub = ! hasAdminBarInEditor || routeKey !== 'home';\n\tconst hasMobileAreas =\n\t\tareas.mobileSidebar || areas.mobileContent || areas.preview;\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst toggleRef = useRef();\n\tconst navigateRegionsProps = useNavigateRegions();\n\tconst disableMotion = useReducedMotion();\n\tconst [ canvasResizer, canvasSize ] = useResizeObserver();\n\tconst isEditorLoading = useIsSiteEditorLoading();\n\tconst [ isResizableFrameOversized, setIsResizableFrameOversized ] =\n\t\tuseState( false );\n\tconst animationRef = useMovingAnimation( {\n\t\ttriggerAnimationOnChange: routeKey + '-' + canvas,\n\t} );\n\n\tconst { showIconLabels } = useSelect( ( select ) => {\n\t\treturn {\n\t\t\tshowIconLabels: select( preferencesStore ).get(\n\t\t\t\t'core',\n\t\t\t\t'showIconLabels'\n\t\t\t),\n\t\t};\n\t} );\n\n\tconst backgroundColor = useStyle( 'color.background' );\n\tconst gradientValue = useStyle( 'color.gradient' );\n\tconst previousCanvaMode = usePrevious( canvas );\n\tuseEffect( () => {\n\t\tif ( previousCanvaMode === 'edit' ) {\n\t\t\ttoggleRef.current?.focus();\n\t\t}\n\t\t// Should not depend on the previous canvas mode value but the next.\n\t}, [ canvas ] );\n\n\treturn (\n\t\t<>\n\t\t\t<UnsavedChangesWarning />\n\t\t\t{ canvas === 'view' && <SaveKeyboardShortcut /> }\n\t\t\t<div\n\t\t\t\t{ ...navigateRegionsProps }\n\t\t\t\tref={ navigateRegionsProps.ref }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'edit-site-layout',\n\t\t\t\t\tnavigateRegionsProps.className,\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-full-canvas': canvas === 'edit',\n\t\t\t\t\t\t'show-icon-labels': showIconLabels,\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<div className=\"edit-site-layout__content\">\n\t\t\t\t\t{ /*\n\t\t\t\t\t\tThe NavigableRegion must always be rendered and not use\n\t\t\t\t\t\t`inert` otherwise `useNavigateRegions` will fail.\n\t\t\t\t\t*/ }\n\t\t\t\t\t{ ( ! isMobileViewport || ! hasMobileAreas ) && (\n\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\tariaLabel={ __( 'Navigation' ) }\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar-region\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<AnimatePresence>\n\t\t\t\t\t\t\t\t{ canvas === 'view' && (\n\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\tinitial={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\tanimate={ { opacity: 1 } }\n\t\t\t\t\t\t\t\t\t\texit={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\t\tduration:\n\t\t\t\t\t\t\t\t\t\t\t\t// Disable transition in mobile to emulate a full page transition.\n\t\t\t\t\t\t\t\t\t\t\t\tdisableMotion ||\n\t\t\t\t\t\t\t\t\t\t\t\tisMobileViewport\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ showDesktopSiteHub && (\n\t\t\t\t\t\t\t\t\t\t\t<SiteHub\n\t\t\t\t\t\t\t\t\t\t\t\tref={ toggleRef }\n\t\t\t\t\t\t\t\t\t\t\t\tisTransparent={\n\t\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t<SidebarNavigationProvider>\n\t\t\t\t\t\t\t\t\t\t\t<SidebarContent\n\t\t\t\t\t\t\t\t\t\t\t\tshouldAnimate={\n\t\t\t\t\t\t\t\t\t\t\t\t\trouteKey !== 'styles' &&\n\t\t\t\t\t\t\t\t\t\t\t\t\trouteKey !== 'identity'\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\trouteKey={ routeKey }\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ areas.sidebar }\n\t\t\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t</SidebarContent>\n\t\t\t\t\t\t\t\t\t\t</SidebarNavigationProvider>\n\t\t\t\t\t\t\t\t\t\t<SaveHub />\n\t\t\t\t\t\t\t\t\t\t<SavePanel />\n\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</AnimatePresence>\n\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<SnackbarNotices className=\"edit-site-layout__snackbar\" />\n\t\t\t\t\t<UploadProgressSnackbar />\n\n\t\t\t\t\t{ isMobileViewport && hasMobileAreas && (\n\t\t\t\t\t\t<div className=\"edit-site-layout__mobile\">\n\t\t\t\t\t\t\t<SidebarNavigationProvider>\n\t\t\t\t\t\t\t\t{ canvas !== 'edit' ? (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t{ showMobileSiteHub && (\n\t\t\t\t\t\t\t\t\t\t\t<SiteHubMobile\n\t\t\t\t\t\t\t\t\t\t\t\tref={ toggleRef }\n\t\t\t\t\t\t\t\t\t\t\t\tisTransparent={\n\t\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t{ areas.mobileContent ? (\n\t\t\t\t\t\t\t\t\t\t\t/*\n\t\t\t\t\t\t\t\t\t\t\t * ThemeProvider wraps SidebarContent (rather than\n\t\t\t\t\t\t\t\t\t\t\t * just the content) so the scroll wrapper it renders\n\t\t\t\t\t\t\t\t\t\t\t * inherits the content background tokens. See\n\t\t\t\t\t\t\t\t\t\t\t * `.edit-site-sidebar__screen-wrapper` in style.scss.\n\t\t\t\t\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\t\t\t\t\t<ThemeProvider\n\t\t\t\t\t\t\t\t\t\t\t\tcolor={ CONTENT_COLOR }\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<SidebarContent\n\t\t\t\t\t\t\t\t\t\t\t\t\trouteKey={ routeKey }\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"edit-site-layout__mobile-content\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tareas.mobileContent\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t</SidebarContent>\n\t\t\t\t\t\t\t\t\t\t\t</ThemeProvider>\n\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t<SidebarContent\n\t\t\t\t\t\t\t\t\t\t\t\trouteKey={ routeKey }\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ areas.mobileSidebar }\n\t\t\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t</SidebarContent>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t<SaveHub />\n\t\t\t\t\t\t\t\t\t\t<SavePanel />\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<ThemeProvider color={ CONTENT_COLOR }>\n\t\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t{ areas.preview }\n\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t</ThemeProvider>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</SidebarNavigationProvider>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport &&\n\t\t\t\t\t\tareas.content &&\n\t\t\t\t\t\tcanvas !== 'edit' && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__area\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tmaxWidth: widths?.content,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ThemeProvider color={ CONTENT_COLOR }>\n\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t{ areas.content }\n\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t</ThemeProvider>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport && areas.edit && canvas !== 'edit' && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__area\"\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tmaxWidth: widths?.edit,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ThemeProvider color={ CONTENT_COLOR }>\n\t\t\t\t\t\t\t\t<ErrorBoundary>{ areas.edit }</ErrorBoundary>\n\t\t\t\t\t\t\t</ThemeProvider>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport && areas.preview && (\n\t\t\t\t\t\t<div className=\"edit-site-layout__canvas-container\">\n\t\t\t\t\t\t\t{ canvasResizer }\n\t\t\t\t\t\t\t{ !! canvasSize.width && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'edit-site-layout__canvas',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'is-right-aligned':\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized,\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tref={ animationRef }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t<ResizableFrame\n\t\t\t\t\t\t\t\t\t\t\tisReady={ ! isEditorLoading }\n\t\t\t\t\t\t\t\t\t\t\tisFullWidth={ canvas === 'edit' }\n\t\t\t\t\t\t\t\t\t\t\tdefaultSize={ {\n\t\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\t\tcanvasSize.width -\n\t\t\t\t\t\t\t\t\t\t\t\t\t24 /* $canvas-padding */,\n\t\t\t\t\t\t\t\t\t\t\t\theight: canvasSize.height,\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\tisOversized={\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tsetIsOversized={\n\t\t\t\t\t\t\t\t\t\t\t\tsetIsResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tinnerContentStyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\tbackground:\n\t\t\t\t\t\t\t\t\t\t\t\t\tgradientValue ??\n\t\t\t\t\t\t\t\t\t\t\t\t\tbackgroundColor,\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<ThemeProvider\n\t\t\t\t\t\t\t\t\t\t\t\tcolor={ CONTENT_COLOR }\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{ areas.preview }\n\t\t\t\t\t\t\t\t\t\t\t</ThemeProvider>\n\t\t\t\t\t\t\t\t\t\t</ResizableFrame>\n\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default function LayoutWithGlobalStylesProvider( props ) {\n\tconst themeColors = useMemo( getAdminThemeColors, [] );\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tfunction onPluginAreaError( name ) {\n\t\tcreateErrorNotice(\n\t\t\tsprintf(\n\t\t\t\t/* translators: %s: plugin name */\n\t\t\t\t__(\n\t\t\t\t\t'The \"%s\" plugin has encountered an error and cannot be rendered.'\n\t\t\t\t),\n\t\t\t\tname\n\t\t\t)\n\t\t);\n\t}\n\n\treturn (\n\t\t<SlotFillProvider>\n\t\t\t<Tooltip.Provider>\n\t\t\t\t{ /** This needs to be within the SlotFillProvider */ }\n\t\t\t\t<PluginArea onError={ onPluginAreaError } />\n\t\t\t\t<ThemeProvider color={ themeColors }>\n\t\t\t\t\t<Layout { ...props } />\n\t\t\t\t</ThemeProvider>\n\t\t\t</Tooltip.Provider>\n\t\t</SlotFillProvider>\n\t);\n}\n"],
|
|
5
|
-
"mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,iBAAiB,2BAA2B;AACrD;AAAA,EACC,oBAAoB;AAAA,EACpB,6BAA6B;AAAA,EAC7B,gCAAgC;AAAA,EAChC;AAAA,OACM;AACP;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,IAAI,eAAe;AAC5B,SAAS,UAAU,QAAQ,WAAW,eAAe;AACrD;AAAA,EACC;AAAA,EACA;AAAA,EACA,eAAe;AAAA,OACT;AACP,SAAS,eAAe,yBAAyB;AACjD,SAAS,qBAAqB;AAC9B,SAAS,kBAAkB;AAC3B,SAAS,iBAAiB,SAAS,oBAAoB;AACvD,SAAS,aAAa,iBAAiB;AACvC,SAAS,SAAS,wBAAwB;AAC1C,SAAS,eAAe;AAKxB,SAAS,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { NavigableRegion, getAdminThemeColors } from '@wordpress/admin-ui';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n\t__unstableUseNavigateRegions as useNavigateRegions,\n\tSlotFillProvider,\n} from '@wordpress/components';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tuseResizeObserver,\n\tusePrevious,\n} from '@wordpress/compose';\nimport { focus } from '@wordpress/dom';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useState, useRef, useEffect, useMemo } from '@wordpress/element';\nimport {\n\tUnsavedChangesWarning,\n\tErrorBoundary,\n\tprivateApis as editorPrivateApis,\n} from '@wordpress/editor';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\nimport { ThemeProvider } from '@wordpress/theme';\nimport { PluginArea } from '@wordpress/plugins';\nimport { SnackbarNotices, store as noticesStore } from '@wordpress/notices';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { Tooltip } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { SiteHubMobile } from '../site-hub';\nimport ResizableFrame from '../resizable-frame';\nimport { unlock } from '../../lock-unlock';\nimport SaveKeyboardShortcut from '../save-keyboard-shortcut';\nimport { useIsSiteEditorLoading } from './hooks';\nimport useMovingAnimation from './animation';\nimport { SidebarContent, SidebarNavigationProvider } from '../sidebar';\nimport SaveHub from '../save-hub';\nimport SavePanel from '../save-panel';\n\nconst { useLocation } = unlock( routerPrivateApis );\nconst { useStyle, UploadProgressSnackbar } = unlock( editorPrivateApis );\n\nconst ANIMATION_DURATION = 0.3;\nconst CONTENT_COLOR = { background: '#ffffff' };\n\nfunction Layout() {\n\tconst { query, name: routeKey, areas, widths } = useLocation();\n\t// Force canvas to 'view' on notfound route to show the error message and allow navigation.\n\tconst canvas = routeKey === 'notfound' ? 'view' : query?.canvas ?? 'view';\n\tconst showMobileSiteHub = !! areas.mobileContent;\n\tconst hasMobileAreas =\n\t\tareas.mobileSidebar || areas.mobileContent || areas.preview;\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst mobileToggleRef = useRef();\n\tconst sidebarRegionRef = useRef();\n\tconst navigateRegionsProps = useNavigateRegions();\n\tconst disableMotion = useReducedMotion();\n\tconst [ canvasResizer, canvasSize ] = useResizeObserver();\n\tconst isEditorLoading = useIsSiteEditorLoading();\n\tconst [ isResizableFrameOversized, setIsResizableFrameOversized ] =\n\t\tuseState( false );\n\tconst animationRef = useMovingAnimation( {\n\t\ttriggerAnimationOnChange: routeKey + '-' + canvas,\n\t} );\n\n\tconst { showIconLabels } = useSelect( ( select ) => {\n\t\treturn {\n\t\t\tshowIconLabels: select( preferencesStore ).get(\n\t\t\t\t'core',\n\t\t\t\t'showIconLabels'\n\t\t\t),\n\t\t};\n\t} );\n\n\tconst backgroundColor = useStyle( 'color.background' );\n\tconst gradientValue = useStyle( 'color.gradient' );\n\tconst previousCanvaMode = usePrevious( canvas );\n\tuseEffect( () => {\n\t\tif ( previousCanvaMode === 'edit' ) {\n\t\t\tconst desktopToggle = sidebarRegionRef.current\n\t\t\t\t? // We're typically expecting the `<DashboardBackButton />` component as the first tabbable element.\n\t\t\t\t focus.tabbable.find( sidebarRegionRef.current )[ 0 ]\n\t\t\t\t: undefined;\n\t\t\t( desktopToggle ?? mobileToggleRef.current )?.focus();\n\t\t}\n\t\t// Should not depend on the previous canvas mode value but the next.\n\t}, [ canvas ] );\n\n\treturn (\n\t\t<>\n\t\t\t<UnsavedChangesWarning />\n\t\t\t{ canvas === 'view' && <SaveKeyboardShortcut /> }\n\t\t\t<div\n\t\t\t\t{ ...navigateRegionsProps }\n\t\t\t\tref={ navigateRegionsProps.ref }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'edit-site-layout',\n\t\t\t\t\tnavigateRegionsProps.className,\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-full-canvas': canvas === 'edit',\n\t\t\t\t\t\t'show-icon-labels': showIconLabels,\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<div className=\"edit-site-layout__content\">\n\t\t\t\t\t{ /*\n\t\t\t\t\t\tThe NavigableRegion must always be rendered and not use\n\t\t\t\t\t\t`inert` otherwise `useNavigateRegions` will fail.\n\t\t\t\t\t*/ }\n\t\t\t\t\t{ ( ! isMobileViewport || ! hasMobileAreas ) && (\n\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\tref={ sidebarRegionRef }\n\t\t\t\t\t\t\tariaLabel={ __( 'Navigation' ) }\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar-region\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<AnimatePresence>\n\t\t\t\t\t\t\t\t{ canvas === 'view' && (\n\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\tinitial={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\tanimate={ { opacity: 1 } }\n\t\t\t\t\t\t\t\t\t\texit={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\t\tduration:\n\t\t\t\t\t\t\t\t\t\t\t\t// Disable transition in mobile to emulate a full page transition.\n\t\t\t\t\t\t\t\t\t\t\t\tdisableMotion ||\n\t\t\t\t\t\t\t\t\t\t\t\tisMobileViewport\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<SidebarNavigationProvider>\n\t\t\t\t\t\t\t\t\t\t\t<SidebarContent\n\t\t\t\t\t\t\t\t\t\t\t\tshouldAnimate={\n\t\t\t\t\t\t\t\t\t\t\t\t\trouteKey !== 'styles' &&\n\t\t\t\t\t\t\t\t\t\t\t\t\trouteKey !== 'identity'\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\trouteKey={ routeKey }\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ areas.sidebar }\n\t\t\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t</SidebarContent>\n\t\t\t\t\t\t\t\t\t\t</SidebarNavigationProvider>\n\t\t\t\t\t\t\t\t\t\t<SaveHub />\n\t\t\t\t\t\t\t\t\t\t<SavePanel />\n\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</AnimatePresence>\n\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<SnackbarNotices className=\"edit-site-layout__snackbar\" />\n\t\t\t\t\t<UploadProgressSnackbar />\n\n\t\t\t\t\t{ isMobileViewport && hasMobileAreas && (\n\t\t\t\t\t\t<div className=\"edit-site-layout__mobile\">\n\t\t\t\t\t\t\t<SidebarNavigationProvider>\n\t\t\t\t\t\t\t\t{ canvas !== 'edit' ? (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t{ showMobileSiteHub && (\n\t\t\t\t\t\t\t\t\t\t\t<SiteHubMobile\n\t\t\t\t\t\t\t\t\t\t\t\tref={ mobileToggleRef }\n\t\t\t\t\t\t\t\t\t\t\t\tisTransparent={\n\t\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t{ areas.mobileContent ? (\n\t\t\t\t\t\t\t\t\t\t\t/*\n\t\t\t\t\t\t\t\t\t\t\t * ThemeProvider wraps SidebarContent (rather than\n\t\t\t\t\t\t\t\t\t\t\t * just the content) so the scroll wrapper it renders\n\t\t\t\t\t\t\t\t\t\t\t * inherits the content background tokens. See\n\t\t\t\t\t\t\t\t\t\t\t * `.edit-site-sidebar__screen-wrapper` in style.scss.\n\t\t\t\t\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\t\t\t\t\t<ThemeProvider\n\t\t\t\t\t\t\t\t\t\t\t\tcolor={ CONTENT_COLOR }\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<SidebarContent\n\t\t\t\t\t\t\t\t\t\t\t\t\trouteKey={ routeKey }\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"edit-site-layout__mobile-content\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tareas.mobileContent\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t</SidebarContent>\n\t\t\t\t\t\t\t\t\t\t\t</ThemeProvider>\n\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t<SidebarContent\n\t\t\t\t\t\t\t\t\t\t\t\trouteKey={ routeKey }\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ areas.mobileSidebar }\n\t\t\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t</SidebarContent>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t<SaveHub />\n\t\t\t\t\t\t\t\t\t\t<SavePanel />\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<ThemeProvider color={ CONTENT_COLOR }>\n\t\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t\t{ areas.preview }\n\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t</ThemeProvider>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</SidebarNavigationProvider>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport &&\n\t\t\t\t\t\tareas.content &&\n\t\t\t\t\t\tcanvas !== 'edit' && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__area\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tmaxWidth: widths?.content,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ThemeProvider color={ CONTENT_COLOR }>\n\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t{ areas.content }\n\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t</ThemeProvider>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport && areas.edit && canvas !== 'edit' && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__area\"\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tmaxWidth: widths?.edit,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ThemeProvider color={ CONTENT_COLOR }>\n\t\t\t\t\t\t\t\t<ErrorBoundary>{ areas.edit }</ErrorBoundary>\n\t\t\t\t\t\t\t</ThemeProvider>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport && areas.preview && (\n\t\t\t\t\t\t<div className=\"edit-site-layout__canvas-container\">\n\t\t\t\t\t\t\t{ canvasResizer }\n\t\t\t\t\t\t\t{ !! canvasSize.width && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'edit-site-layout__canvas',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'is-right-aligned':\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized,\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tref={ animationRef }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t<ResizableFrame\n\t\t\t\t\t\t\t\t\t\t\tisReady={ ! isEditorLoading }\n\t\t\t\t\t\t\t\t\t\t\tisFullWidth={ canvas === 'edit' }\n\t\t\t\t\t\t\t\t\t\t\tdefaultSize={ {\n\t\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\t\tcanvasSize.width -\n\t\t\t\t\t\t\t\t\t\t\t\t\t24 /* $canvas-padding */,\n\t\t\t\t\t\t\t\t\t\t\t\theight: canvasSize.height,\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\tisOversized={\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tsetIsOversized={\n\t\t\t\t\t\t\t\t\t\t\t\tsetIsResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tinnerContentStyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\tbackground:\n\t\t\t\t\t\t\t\t\t\t\t\t\tgradientValue ??\n\t\t\t\t\t\t\t\t\t\t\t\t\tbackgroundColor,\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<ThemeProvider\n\t\t\t\t\t\t\t\t\t\t\t\tcolor={ CONTENT_COLOR }\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{ areas.preview }\n\t\t\t\t\t\t\t\t\t\t\t</ThemeProvider>\n\t\t\t\t\t\t\t\t\t\t</ResizableFrame>\n\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default function LayoutWithGlobalStylesProvider( props ) {\n\tconst themeColors = useMemo( getAdminThemeColors, [] );\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tfunction onPluginAreaError( name ) {\n\t\tcreateErrorNotice(\n\t\t\tsprintf(\n\t\t\t\t/* translators: %s: plugin name */\n\t\t\t\t__(\n\t\t\t\t\t'The \"%s\" plugin has encountered an error and cannot be rendered.'\n\t\t\t\t),\n\t\t\t\tname\n\t\t\t)\n\t\t);\n\t}\n\n\treturn (\n\t\t<SlotFillProvider>\n\t\t\t<Tooltip.Provider>\n\t\t\t\t{ /** This needs to be within the SlotFillProvider */ }\n\t\t\t\t<PluginArea onError={ onPluginAreaError } />\n\t\t\t\t<ThemeProvider color={ themeColors }>\n\t\t\t\t\t<Layout { ...props } />\n\t\t\t\t</ThemeProvider>\n\t\t\t</Tooltip.Provider>\n\t\t</SlotFillProvider>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,14 +1,10 @@
|
|
|
1
1
|
// packages/edit-site/src/components/page-patterns/fields.js
|
|
2
|
-
import { __
|
|
2
|
+
import { __ } from "@wordpress/i18n";
|
|
3
3
|
import { useMemo, useId } from "@wordpress/element";
|
|
4
4
|
import { BlockPreview } from "@wordpress/block-editor";
|
|
5
5
|
import { parse } from "@wordpress/blocks";
|
|
6
6
|
import { privateApis as editorPrivateApis } from "@wordpress/editor";
|
|
7
|
-
import {
|
|
8
|
-
TEMPLATE_PART_POST_TYPE,
|
|
9
|
-
PATTERN_SYNC_TYPES,
|
|
10
|
-
OPERATOR_IS
|
|
11
|
-
} from "../../utils/constants.mjs";
|
|
7
|
+
import { TEMPLATE_PART_POST_TYPE } from "../../utils/constants.mjs";
|
|
12
8
|
import { unlock } from "../../lock-unlock.mjs";
|
|
13
9
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
14
10
|
var { useStyle } = unlock(editorPrivateApis);
|
|
@@ -50,42 +46,7 @@ var previewField = {
|
|
|
50
46
|
render: PreviewField,
|
|
51
47
|
enableSorting: false
|
|
52
48
|
};
|
|
53
|
-
var SYNC_FILTERS = [
|
|
54
|
-
{
|
|
55
|
-
value: PATTERN_SYNC_TYPES.full,
|
|
56
|
-
label: _x("Synced", "pattern (singular)"),
|
|
57
|
-
description: __("Patterns that are kept in sync across the site.")
|
|
58
|
-
},
|
|
59
|
-
{
|
|
60
|
-
value: PATTERN_SYNC_TYPES.unsynced,
|
|
61
|
-
label: _x("Not synced", "pattern (singular)"),
|
|
62
|
-
description: __(
|
|
63
|
-
"Patterns that can be changed freely without affecting the site."
|
|
64
|
-
)
|
|
65
|
-
}
|
|
66
|
-
];
|
|
67
|
-
var patternStatusField = {
|
|
68
|
-
label: __("Sync status"),
|
|
69
|
-
id: "sync-status",
|
|
70
|
-
render: ({ item }) => {
|
|
71
|
-
const syncStatus = "wp_pattern_sync_status" in item ? item.wp_pattern_sync_status || PATTERN_SYNC_TYPES.full : PATTERN_SYNC_TYPES.unsynced;
|
|
72
|
-
return /* @__PURE__ */ jsx(
|
|
73
|
-
"span",
|
|
74
|
-
{
|
|
75
|
-
className: `edit-site-patterns__field-sync-status-${syncStatus}`,
|
|
76
|
-
children: SYNC_FILTERS.find(({ value }) => value === syncStatus).label
|
|
77
|
-
}
|
|
78
|
-
);
|
|
79
|
-
},
|
|
80
|
-
elements: SYNC_FILTERS,
|
|
81
|
-
filterBy: {
|
|
82
|
-
operators: [OPERATOR_IS],
|
|
83
|
-
isPrimary: true
|
|
84
|
-
},
|
|
85
|
-
enableSorting: false
|
|
86
|
-
};
|
|
87
49
|
export {
|
|
88
|
-
patternStatusField,
|
|
89
50
|
previewField
|
|
90
51
|
};
|
|
91
52
|
//# sourceMappingURL=fields.mjs.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/page-patterns/fields.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __
|
|
5
|
-
"mappings": ";AAGA,SAAS,
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useMemo, useId } from '@wordpress/element';\nimport { BlockPreview } from '@wordpress/block-editor';\nimport { parse } from '@wordpress/blocks';\nimport { privateApis as editorPrivateApis } from '@wordpress/editor';\n\n/**\n * Internal dependencies\n */\nimport { TEMPLATE_PART_POST_TYPE } from '../../utils/constants';\nimport { unlock } from '../../lock-unlock';\n\nconst { useStyle } = unlock( editorPrivateApis );\n\nfunction PreviewField( { item } ) {\n\tconst descriptionId = useId();\n\tconst description = item.description || item?.excerpt?.raw;\n\tconst isTemplatePart = item.type === TEMPLATE_PART_POST_TYPE;\n\tconst backgroundColor = useStyle( 'color.background' );\n\tconst blocks = useMemo( () => {\n\t\treturn (\n\t\t\titem.blocks ??\n\t\t\tparse( item.content.raw, {\n\t\t\t\t__unstableSkipMigrationLogs: true,\n\t\t\t} )\n\t\t);\n\t}, [ item?.content?.raw, item.blocks ] );\n\tconst isEmpty = ! blocks?.length;\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"page-patterns-preview-field\"\n\t\t\tstyle={ { backgroundColor } }\n\t\t\taria-describedby={ !! description ? descriptionId : undefined }\n\t\t>\n\t\t\t{ isEmpty && isTemplatePart && __( 'Empty template part' ) }\n\t\t\t{ isEmpty && ! isTemplatePart && __( 'Empty pattern' ) }\n\t\t\t{ ! isEmpty && (\n\t\t\t\t<BlockPreview.Async>\n\t\t\t\t\t<BlockPreview\n\t\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\t\tviewportWidth={ item.viewportWidth }\n\t\t\t\t\t/>\n\t\t\t\t</BlockPreview.Async>\n\t\t\t) }\n\t\t\t{ !! description && (\n\t\t\t\t<div hidden id={ descriptionId }>\n\t\t\t\t\t{ description }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport const previewField = {\n\tlabel: __( 'Preview' ),\n\tid: 'preview',\n\trender: PreviewField,\n\tenableSorting: false,\n};\n"],
|
|
5
|
+
"mappings": ";AAGA,SAAS,UAAU;AACnB,SAAS,SAAS,aAAa;AAC/B,SAAS,oBAAoB;AAC7B,SAAS,aAAa;AACtB,SAAS,eAAe,yBAAyB;AAKjD,SAAS,+BAA+B;AACxC,SAAS,cAAc;AAoBrB,SASG,KATH;AAlBF,IAAM,EAAE,SAAS,IAAI,OAAQ,iBAAkB;AAE/C,SAAS,aAAc,EAAE,KAAK,GAAI;AACjC,QAAM,gBAAgB,MAAM;AAC5B,QAAM,cAAc,KAAK,eAAe,MAAM,SAAS;AACvD,QAAM,iBAAiB,KAAK,SAAS;AACrC,QAAM,kBAAkB,SAAU,kBAAmB;AACrD,QAAM,SAAS,QAAS,MAAM;AAC7B,WACC,KAAK,UACL,MAAO,KAAK,QAAQ,KAAK;AAAA,MACxB,6BAA6B;AAAA,IAC9B,CAAE;AAAA,EAEJ,GAAG,CAAE,MAAM,SAAS,KAAK,KAAK,MAAO,CAAE;AACvC,QAAM,UAAU,CAAE,QAAQ;AAE1B,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,OAAQ,EAAE,gBAAgB;AAAA,MAC1B,oBAAmB,CAAC,CAAE,cAAc,gBAAgB;AAAA,MAElD;AAAA,mBAAW,kBAAkB,GAAI,qBAAsB;AAAA,QACvD,WAAW,CAAE,kBAAkB,GAAI,eAAgB;AAAA,QACnD,CAAE,WACH,oBAAC,aAAa,OAAb,EACA;AAAA,UAAC;AAAA;AAAA,YACA;AAAA,YACA,eAAgB,KAAK;AAAA;AAAA,QACtB,GACD;AAAA,QAEC,CAAC,CAAE,eACJ,oBAAC,SAAI,QAAM,MAAC,IAAK,eACd,uBACH;AAAA;AAAA;AAAA,EAEF;AAEF;AAEO,IAAM,eAAe;AAAA,EAC3B,OAAO,GAAI,SAAU;AAAA,EACrB,IAAI;AAAA,EACJ,QAAQ;AAAA,EACR,eAAe;AAChB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -20,11 +20,11 @@ import { unlock } from "../../lock-unlock.mjs";
|
|
|
20
20
|
import usePatterns, { useAugmentPatternsWithPermissions } from "./use-patterns.mjs";
|
|
21
21
|
import PatternsActions from "./actions.mjs";
|
|
22
22
|
import { useEditPostAction } from "../dataviews-actions/index.mjs";
|
|
23
|
-
import {
|
|
23
|
+
import { previewField } from "./fields.mjs";
|
|
24
24
|
import usePatternCategories from "../sidebar-navigation-screen-patterns/use-pattern-categories.mjs";
|
|
25
25
|
import { jsx } from "react/jsx-runtime";
|
|
26
26
|
var { ExperimentalBlockEditorProvider } = unlock(blockEditorPrivateApis);
|
|
27
|
-
var { usePostActions, usePostFields
|
|
27
|
+
var { usePostActions, usePostFields } = unlock(editorPrivateApis);
|
|
28
28
|
var { useLocation, useHistory } = unlock(routerPrivateApis);
|
|
29
29
|
var EMPTY_ARRAY = [];
|
|
30
30
|
var VIEW_CONFIG_FIELDS = ["default_view", "default_layouts"];
|
|
@@ -87,21 +87,10 @@ function DataviewsPatterns() {
|
|
|
87
87
|
search: view.search,
|
|
88
88
|
syncStatus: viewSyncStatus
|
|
89
89
|
});
|
|
90
|
-
const
|
|
91
|
-
postType: TEMPLATE_PART_POST_TYPE
|
|
92
|
-
});
|
|
93
|
-
const templatePartAuthorField = templatePartFields.find(
|
|
94
|
-
(field) => field.id === "author"
|
|
95
|
-
);
|
|
90
|
+
const postTypeFields = usePostFields({ postType });
|
|
96
91
|
const fields = useMemo(() => {
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
_fields.push(patternStatusField);
|
|
100
|
-
} else if (postType === TEMPLATE_PART_POST_TYPE && templatePartAuthorField) {
|
|
101
|
-
_fields.push(templatePartAuthorField);
|
|
102
|
-
}
|
|
103
|
-
return _fields;
|
|
104
|
-
}, [postType, templatePartAuthorField]);
|
|
92
|
+
return [previewField, ...postTypeFields || []];
|
|
93
|
+
}, [postTypeFields]);
|
|
105
94
|
const { data, paginationInfo } = useMemo(() => {
|
|
106
95
|
const viewWithoutFilters = { ...view };
|
|
107
96
|
delete viewWithoutFilters.search;
|