@wordpress/edit-site 6.37.1-next.ba3aee3a2.0 → 6.38.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/layout/index.cjs +1 -1
- package/build/components/layout/index.cjs.map +2 -2
- package/build/components/sidebar-navigation-screen-patterns/index.cjs +2 -2
- package/build/components/sidebar-navigation-screen-patterns/index.cjs.map +2 -2
- package/build-module/components/layout/index.mjs +1 -1
- package/build-module/components/layout/index.mjs.map +2 -2
- package/build-module/components/sidebar-navigation-screen-patterns/index.mjs +2 -2
- package/build-module/components/sidebar-navigation-screen-patterns/index.mjs.map +2 -2
- package/build-style/style-rtl.css +13 -28
- package/build-style/style.css +13 -28
- package/package.json +46 -46
- package/src/components/layout/index.js +2 -1
- package/src/components/sidebar-navigation-screen-patterns/index.js +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -60,7 +60,7 @@ var { useStyle } = (0, import_lock_unlock.unlock)(import_editor.privateApis);
|
|
|
60
60
|
var ANIMATION_DURATION = 0.3;
|
|
61
61
|
function Layout() {
|
|
62
62
|
const { query, name: routeKey, areas, widths } = useLocation();
|
|
63
|
-
const
|
|
63
|
+
const canvas = routeKey === "notfound" ? "view" : query?.canvas ?? "view";
|
|
64
64
|
const isMobileViewport = (0, import_compose.useViewportMatch)("medium", "<");
|
|
65
65
|
const toggleRef = (0, import_element.useRef)();
|
|
66
66
|
const navigateRegionsProps = (0, import_components.__unstableUseNavigateRegions)();
|
|
@@ -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 } 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 } from '@wordpress/element';\nimport {\n\tEditorSnackbars,\n\tUnsavedChangesWarning,\n\tErrorBoundary,\n\tprivateApis as editorPrivateApis,\n} from '@wordpress/editor';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\nimport { PluginArea } from '@wordpress/plugins';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { store as preferencesStore } from '@wordpress/preferences';\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 } = unlock( editorPrivateApis );\n\nconst ANIMATION_DURATION = 0.3;\n\nfunction Layout() {\n\tconst { query, name: routeKey, areas, widths } = useLocation();\n\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,sBAAgC;AAChC,wBAKO;AACP,qBAKO;AACP,kBAA4B;AAC5B,qBAA4C;AAC5C,oBAKO;AACP,oBAAiD;AACjD,qBAA2B;AAC3B,qBAAsC;AACtC,kBAAuC;AACvC,yBAA0C;AAK1C,sBAAkD;AAClD,6BAA2B;AAC3B,yBAAuB;AACvB,oCAAiC;AACjC,mBAAuC;AACvC,uBAA+B;AAC/B,qBAA0D;AAC1D,sBAAoB;AACpB,wBAAsB;
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { NavigableRegion } 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 } from '@wordpress/element';\nimport {\n\tEditorSnackbars,\n\tUnsavedChangesWarning,\n\tErrorBoundary,\n\tprivateApis as editorPrivateApis,\n} from '@wordpress/editor';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\nimport { PluginArea } from '@wordpress/plugins';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { store as preferencesStore } from '@wordpress/preferences';\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 } = unlock( editorPrivateApis );\n\nconst ANIMATION_DURATION = 0.3;\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 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 || ! areas.mobile ) && (\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<SiteHub\n\t\t\t\t\t\t\t\t\t\t\tref={ toggleRef }\n\t\t\t\t\t\t\t\t\t\t\tisTransparent={\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/>\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}\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<EditorSnackbars />\n\n\t\t\t\t\t{ isMobileViewport && areas.mobile && (\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<SiteHubMobile\n\t\t\t\t\t\t\t\t\t\t\tref={ toggleRef }\n\t\t\t\t\t\t\t\t\t\t\tisTransparent={\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/>\n\t\t\t\t\t\t\t\t\t\t<SidebarContent routeKey={ routeKey }>\n\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{ areas.mobile }\n\t\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t</SidebarContent>\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<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t{ areas.mobile }\n\t\t\t\t\t\t\t\t\t</ErrorBoundary>\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<ErrorBoundary>{ areas.content }</ErrorBoundary>\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<ErrorBoundary>{ areas.edit }</ErrorBoundary>\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{ areas.preview }\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 { 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{ /** This needs to be within the SlotFillProvider */ }\n\t\t\t<PluginArea onError={ onPluginAreaError } />\n\t\t\t<Layout { ...props } />\n\t\t</SlotFillProvider>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["routerPrivateApis", "editorPrivateApis", "useNavigateRegions", "useMovingAnimation", "preferencesStore", "SaveKeyboardShortcut", "clsx", "AnimatePresence", "motion", "SiteHub", "SaveHub", "SavePanel", "ResizableFrame", "noticesStore"]
|
|
7
7
|
}
|
|
@@ -67,11 +67,11 @@ function CategoriesGroup({
|
|
|
67
67
|
"all"
|
|
68
68
|
),
|
|
69
69
|
Object.entries(templatePartAreas).map(
|
|
70
|
-
([area, { label, templateParts }]) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
70
|
+
([area, { label, templateParts, icon }]) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
71
71
|
import_category_item.default,
|
|
72
72
|
{
|
|
73
73
|
count: templateParts?.length,
|
|
74
|
-
icon: (0, import_editor.getTemplatePartIcon)(
|
|
74
|
+
icon: (0, import_editor.getTemplatePartIcon)(icon),
|
|
75
75
|
label,
|
|
76
76
|
id: area,
|
|
77
77
|
type: import_constants.TEMPLATE_PART_POST_TYPE,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/sidebar-navigation-screen-patterns/index.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalItem as Item,\n} from '@wordpress/components';\nimport { getTemplatePartIcon } from '@wordpress/editor';\nimport { __ } from '@wordpress/i18n';\nimport { file } from '@wordpress/icons';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\n\n/**\n * Internal dependencies\n */\nimport SidebarNavigationScreen from '../sidebar-navigation-screen';\nimport CategoryItem from './category-item';\nimport {\n\tPATTERN_DEFAULT_CATEGORY,\n\tPATTERN_TYPES,\n\tTEMPLATE_PART_POST_TYPE,\n\tTEMPLATE_PART_ALL_AREAS_CATEGORY,\n} from '../../utils/constants';\nimport usePatternCategories from './use-pattern-categories';\nimport useTemplatePartAreas from './use-template-part-areas';\nimport { unlock } from '../../lock-unlock';\n\nconst { useLocation } = unlock( routerPrivateApis );\n\nfunction CategoriesGroup( {\n\ttemplatePartAreas,\n\tpatternCategories,\n\tcurrentCategory,\n\tcurrentType,\n} ) {\n\tconst [ allPatterns, ...otherPatterns ] = patternCategories;\n\n\treturn (\n\t\t<ItemGroup className=\"edit-site-sidebar-navigation-screen-patterns__group\">\n\t\t\t<CategoryItem\n\t\t\t\tkey=\"all\"\n\t\t\t\tcount={ Object.values( templatePartAreas )\n\t\t\t\t\t.map( ( { templateParts } ) => templateParts?.length || 0 )\n\t\t\t\t\t.reduce( ( acc, val ) => acc + val, 0 ) }\n\t\t\t\ticon={ getTemplatePartIcon() } /* no name, so it provides the fallback icon */\n\t\t\t\tlabel={ __( 'All template parts' ) }\n\t\t\t\tid={ TEMPLATE_PART_ALL_AREAS_CATEGORY }\n\t\t\t\ttype={ TEMPLATE_PART_POST_TYPE }\n\t\t\t\tisActive={\n\t\t\t\t\tcurrentCategory === TEMPLATE_PART_ALL_AREAS_CATEGORY &&\n\t\t\t\t\tcurrentType === TEMPLATE_PART_POST_TYPE\n\t\t\t\t}\n\t\t\t/>\n\t\t\t{ Object.entries( templatePartAreas ).map(\n\t\t\t\t( [ area, { label, templateParts } ] ) => (\n\t\t\t\t\t<CategoryItem\n\t\t\t\t\t\tkey={ area }\n\t\t\t\t\t\tcount={ templateParts?.length }\n\t\t\t\t\t\ticon={ getTemplatePartIcon(
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAGO;AACP,oBAAoC;AACpC,kBAAmB;AACnB,mBAAqB;AACrB,oBAAiD;AAKjD,uCAAoC;AACpC,2BAAyB;AACzB,uBAKO;AACP,oCAAiC;AACjC,qCAAiC;AACjC,yBAAuB;AAarB;AAXF,IAAM,EAAE,YAAY,QAAI,2BAAQ,cAAAA,WAAkB;AAElD,SAAS,gBAAiB;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,CAAE,aAAa,GAAG,aAAc,IAAI;AAE1C,SACC,6CAAC,kBAAAC,yBAAA,EAAU,WAAU,uDACpB;AAAA;AAAA,MAAC,qBAAAC;AAAA,MAAA;AAAA,QAEA,OAAQ,OAAO,OAAQ,iBAAkB,EACvC,IAAK,CAAE,EAAE,cAAc,MAAO,eAAe,UAAU,CAAE,EACzD,OAAQ,CAAE,KAAK,QAAS,MAAM,KAAK,CAAE;AAAA,QACvC,UAAO,mCAAoB;AAAA,QAC3B,WAAQ,gBAAI,oBAAqB;AAAA,QACjC,IAAK;AAAA,QACL,MAAO;AAAA,QACP,UACC,oBAAoB,qDACpB,gBAAgB;AAAA;AAAA,MAVb;AAAA,IAYL;AAAA,IACE,OAAO,QAAS,iBAAkB,EAAE;AAAA,MACrC,CAAE,CAAE,MAAM,EAAE,OAAO,
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalItem as Item,\n} from '@wordpress/components';\nimport { getTemplatePartIcon } from '@wordpress/editor';\nimport { __ } from '@wordpress/i18n';\nimport { file } from '@wordpress/icons';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\n\n/**\n * Internal dependencies\n */\nimport SidebarNavigationScreen from '../sidebar-navigation-screen';\nimport CategoryItem from './category-item';\nimport {\n\tPATTERN_DEFAULT_CATEGORY,\n\tPATTERN_TYPES,\n\tTEMPLATE_PART_POST_TYPE,\n\tTEMPLATE_PART_ALL_AREAS_CATEGORY,\n} from '../../utils/constants';\nimport usePatternCategories from './use-pattern-categories';\nimport useTemplatePartAreas from './use-template-part-areas';\nimport { unlock } from '../../lock-unlock';\n\nconst { useLocation } = unlock( routerPrivateApis );\n\nfunction CategoriesGroup( {\n\ttemplatePartAreas,\n\tpatternCategories,\n\tcurrentCategory,\n\tcurrentType,\n} ) {\n\tconst [ allPatterns, ...otherPatterns ] = patternCategories;\n\n\treturn (\n\t\t<ItemGroup className=\"edit-site-sidebar-navigation-screen-patterns__group\">\n\t\t\t<CategoryItem\n\t\t\t\tkey=\"all\"\n\t\t\t\tcount={ Object.values( templatePartAreas )\n\t\t\t\t\t.map( ( { templateParts } ) => templateParts?.length || 0 )\n\t\t\t\t\t.reduce( ( acc, val ) => acc + val, 0 ) }\n\t\t\t\ticon={ getTemplatePartIcon() } /* no name, so it provides the fallback icon */\n\t\t\t\tlabel={ __( 'All template parts' ) }\n\t\t\t\tid={ TEMPLATE_PART_ALL_AREAS_CATEGORY }\n\t\t\t\ttype={ TEMPLATE_PART_POST_TYPE }\n\t\t\t\tisActive={\n\t\t\t\t\tcurrentCategory === TEMPLATE_PART_ALL_AREAS_CATEGORY &&\n\t\t\t\t\tcurrentType === TEMPLATE_PART_POST_TYPE\n\t\t\t\t}\n\t\t\t/>\n\t\t\t{ Object.entries( templatePartAreas ).map(\n\t\t\t\t( [ area, { label, templateParts, icon } ] ) => (\n\t\t\t\t\t<CategoryItem\n\t\t\t\t\t\tkey={ area }\n\t\t\t\t\t\tcount={ templateParts?.length }\n\t\t\t\t\t\ticon={ getTemplatePartIcon( icon ) }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\tid={ area }\n\t\t\t\t\t\ttype={ TEMPLATE_PART_POST_TYPE }\n\t\t\t\t\t\tisActive={\n\t\t\t\t\t\t\tcurrentCategory === area &&\n\t\t\t\t\t\t\tcurrentType === TEMPLATE_PART_POST_TYPE\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t) }\n\t\t\t<div className=\"edit-site-sidebar-navigation-screen-patterns__divider\" />\n\t\t\t{ allPatterns && (\n\t\t\t\t<CategoryItem\n\t\t\t\t\tkey={ allPatterns.name }\n\t\t\t\t\tcount={ allPatterns.count }\n\t\t\t\t\tlabel={ allPatterns.label }\n\t\t\t\t\ticon={ file }\n\t\t\t\t\tid={ allPatterns.name }\n\t\t\t\t\ttype={ PATTERN_TYPES.user }\n\t\t\t\t\tisActive={\n\t\t\t\t\t\tcurrentCategory === `${ allPatterns.name }` &&\n\t\t\t\t\t\tcurrentType === PATTERN_TYPES.user\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ otherPatterns.map( ( category ) => (\n\t\t\t\t<CategoryItem\n\t\t\t\t\tkey={ category.name }\n\t\t\t\t\tcount={ category.count }\n\t\t\t\t\tlabel={ category.label }\n\t\t\t\t\ticon={ file }\n\t\t\t\t\tid={ category.name }\n\t\t\t\t\ttype={ PATTERN_TYPES.user }\n\t\t\t\t\tisActive={\n\t\t\t\t\t\tcurrentCategory === `${ category.name }` &&\n\t\t\t\t\t\tcurrentType === PATTERN_TYPES.user\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</ItemGroup>\n\t);\n}\n\nexport default function SidebarNavigationScreenPatterns( { backPath } ) {\n\tconst {\n\t\tquery: { postType = 'wp_block', categoryId },\n\t} = useLocation();\n\tconst currentCategory =\n\t\tcategoryId ||\n\t\t( postType === PATTERN_TYPES.user\n\t\t\t? PATTERN_DEFAULT_CATEGORY\n\t\t\t: TEMPLATE_PART_ALL_AREAS_CATEGORY );\n\n\tconst { templatePartAreas, hasTemplateParts, isLoading } =\n\t\tuseTemplatePartAreas();\n\tconst { patternCategories, hasPatterns } = usePatternCategories();\n\n\treturn (\n\t\t<SidebarNavigationScreen\n\t\t\ttitle={ __( 'Patterns' ) }\n\t\t\tdescription={ __(\n\t\t\t\t'Manage what patterns are available when editing the site.'\n\t\t\t) }\n\t\t\tisRoot={ ! backPath }\n\t\t\tbackPath={ backPath }\n\t\t\tcontent={\n\t\t\t\t<>\n\t\t\t\t\t{ isLoading && __( 'Loading items\u2026' ) }\n\t\t\t\t\t{ ! isLoading && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ ! hasTemplateParts && ! hasPatterns && (\n\t\t\t\t\t\t\t\t<ItemGroup className=\"edit-site-sidebar-navigation-screen-patterns__group\">\n\t\t\t\t\t\t\t\t\t<Item>{ __( 'No items found' ) }</Item>\n\t\t\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<CategoriesGroup\n\t\t\t\t\t\t\t\ttemplatePartAreas={ templatePartAreas }\n\t\t\t\t\t\t\t\tpatternCategories={ patternCategories }\n\t\t\t\t\t\t\t\tcurrentCategory={ currentCategory }\n\t\t\t\t\t\t\t\tcurrentType={ 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</>\n\t\t\t}\n\t\t/>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["routerPrivateApis", "ItemGroup", "CategoryItem", "useTemplatePartAreas", "usePatternCategories", "SidebarNavigationScreen", "Item"]
|
|
7
7
|
}
|
|
@@ -41,7 +41,7 @@ var { useStyle } = unlock(editorPrivateApis);
|
|
|
41
41
|
var ANIMATION_DURATION = 0.3;
|
|
42
42
|
function Layout() {
|
|
43
43
|
const { query, name: routeKey, areas, widths } = useLocation();
|
|
44
|
-
const
|
|
44
|
+
const canvas = routeKey === "notfound" ? "view" : query?.canvas ?? "view";
|
|
45
45
|
const isMobileViewport = useViewportMatch("medium", "<");
|
|
46
46
|
const toggleRef = useRef();
|
|
47
47
|
const navigateRegionsProps = useNavigateRegions();
|
|
@@ -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 } 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 } from '@wordpress/element';\nimport {\n\tEditorSnackbars,\n\tUnsavedChangesWarning,\n\tErrorBoundary,\n\tprivateApis as editorPrivateApis,\n} from '@wordpress/editor';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\nimport { PluginArea } from '@wordpress/plugins';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { store as preferencesStore } from '@wordpress/preferences';\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 } = unlock( editorPrivateApis );\n\nconst ANIMATION_DURATION = 0.3;\n\nfunction Layout() {\n\tconst { query, name: routeKey, areas, widths } = useLocation();\n\
|
|
5
|
-
"mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,uBAAuB;AAChC;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,iBAAiB;AAC5C;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,OACT;AACP,SAAS,eAAe,yBAAyB;AACjD,SAAS,kBAAkB;AAC3B,SAAS,SAAS,oBAAoB;AACtC,SAAS,aAAa,iBAAiB;AACvC,SAAS,SAAS,wBAAwB;AAK1C,SAAS,WAAW,SAAS,qBAAqB;AAClD,OAAO,oBAAoB;AAC3B,SAAS,cAAc;AACvB,OAAO,0BAA0B;AACjC,SAAS,8BAA8B;AACvC,OAAO,wBAAwB;AAC/B,SAAS,gBAAgB,iCAAiC;AAC1D,OAAO,aAAa;AACpB,OAAO,eAAe;
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { NavigableRegion } 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 } from '@wordpress/element';\nimport {\n\tEditorSnackbars,\n\tUnsavedChangesWarning,\n\tErrorBoundary,\n\tprivateApis as editorPrivateApis,\n} from '@wordpress/editor';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\nimport { PluginArea } from '@wordpress/plugins';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { store as preferencesStore } from '@wordpress/preferences';\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 } = unlock( editorPrivateApis );\n\nconst ANIMATION_DURATION = 0.3;\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 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 || ! areas.mobile ) && (\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<SiteHub\n\t\t\t\t\t\t\t\t\t\t\tref={ toggleRef }\n\t\t\t\t\t\t\t\t\t\t\tisTransparent={\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/>\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}\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<EditorSnackbars />\n\n\t\t\t\t\t{ isMobileViewport && areas.mobile && (\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<SiteHubMobile\n\t\t\t\t\t\t\t\t\t\t\tref={ toggleRef }\n\t\t\t\t\t\t\t\t\t\t\tisTransparent={\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/>\n\t\t\t\t\t\t\t\t\t\t<SidebarContent routeKey={ routeKey }>\n\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{ areas.mobile }\n\t\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t</SidebarContent>\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<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t{ areas.mobile }\n\t\t\t\t\t\t\t\t\t</ErrorBoundary>\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<ErrorBoundary>{ areas.content }</ErrorBoundary>\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<ErrorBoundary>{ areas.edit }</ErrorBoundary>\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{ areas.preview }\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 { 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{ /** This needs to be within the SlotFillProvider */ }\n\t\t\t<PluginArea onError={ onPluginAreaError } />\n\t\t\t<Layout { ...props } />\n\t\t</SlotFillProvider>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -41,11 +41,11 @@ function CategoriesGroup({
|
|
|
41
41
|
"all"
|
|
42
42
|
),
|
|
43
43
|
Object.entries(templatePartAreas).map(
|
|
44
|
-
([area, { label, templateParts }]) => /* @__PURE__ */ jsx(
|
|
44
|
+
([area, { label, templateParts, icon }]) => /* @__PURE__ */ jsx(
|
|
45
45
|
CategoryItem,
|
|
46
46
|
{
|
|
47
47
|
count: templateParts?.length,
|
|
48
|
-
icon: getTemplatePartIcon(
|
|
48
|
+
icon: getTemplatePartIcon(icon),
|
|
49
49
|
label,
|
|
50
50
|
id: area,
|
|
51
51
|
type: TEMPLATE_PART_POST_TYPE,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/sidebar-navigation-screen-patterns/index.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalItem as Item,\n} from '@wordpress/components';\nimport { getTemplatePartIcon } from '@wordpress/editor';\nimport { __ } from '@wordpress/i18n';\nimport { file } from '@wordpress/icons';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\n\n/**\n * Internal dependencies\n */\nimport SidebarNavigationScreen from '../sidebar-navigation-screen';\nimport CategoryItem from './category-item';\nimport {\n\tPATTERN_DEFAULT_CATEGORY,\n\tPATTERN_TYPES,\n\tTEMPLATE_PART_POST_TYPE,\n\tTEMPLATE_PART_ALL_AREAS_CATEGORY,\n} from '../../utils/constants';\nimport usePatternCategories from './use-pattern-categories';\nimport useTemplatePartAreas from './use-template-part-areas';\nimport { unlock } from '../../lock-unlock';\n\nconst { useLocation } = unlock( routerPrivateApis );\n\nfunction CategoriesGroup( {\n\ttemplatePartAreas,\n\tpatternCategories,\n\tcurrentCategory,\n\tcurrentType,\n} ) {\n\tconst [ allPatterns, ...otherPatterns ] = patternCategories;\n\n\treturn (\n\t\t<ItemGroup className=\"edit-site-sidebar-navigation-screen-patterns__group\">\n\t\t\t<CategoryItem\n\t\t\t\tkey=\"all\"\n\t\t\t\tcount={ Object.values( templatePartAreas )\n\t\t\t\t\t.map( ( { templateParts } ) => templateParts?.length || 0 )\n\t\t\t\t\t.reduce( ( acc, val ) => acc + val, 0 ) }\n\t\t\t\ticon={ getTemplatePartIcon() } /* no name, so it provides the fallback icon */\n\t\t\t\tlabel={ __( 'All template parts' ) }\n\t\t\t\tid={ TEMPLATE_PART_ALL_AREAS_CATEGORY }\n\t\t\t\ttype={ TEMPLATE_PART_POST_TYPE }\n\t\t\t\tisActive={\n\t\t\t\t\tcurrentCategory === TEMPLATE_PART_ALL_AREAS_CATEGORY &&\n\t\t\t\t\tcurrentType === TEMPLATE_PART_POST_TYPE\n\t\t\t\t}\n\t\t\t/>\n\t\t\t{ Object.entries( templatePartAreas ).map(\n\t\t\t\t( [ area, { label, templateParts } ] ) => (\n\t\t\t\t\t<CategoryItem\n\t\t\t\t\t\tkey={ area }\n\t\t\t\t\t\tcount={ templateParts?.length }\n\t\t\t\t\t\ticon={ getTemplatePartIcon(
|
|
5
|
-
"mappings": ";AAGA;AAAA,EACC,2BAA2B;AAAA,EAC3B,sBAAsB;AAAA,OAChB;AACP,SAAS,2BAA2B;AACpC,SAAS,UAAU;AACnB,SAAS,YAAY;AACrB,SAAS,eAAe,yBAAyB;AAKjD,OAAO,6BAA6B;AACpC,OAAO,kBAAkB;AACzB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,OAAO,0BAA0B;AACjC,OAAO,0BAA0B;AACjC,SAAS,cAAc;AAarB,SA0FI,UAzFH,KADD;AAXF,IAAM,EAAE,YAAY,IAAI,OAAQ,iBAAkB;AAElD,SAAS,gBAAiB;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,CAAE,aAAa,GAAG,aAAc,IAAI;AAE1C,SACC,qBAAC,aAAU,WAAU,uDACpB;AAAA;AAAA,MAAC;AAAA;AAAA,QAEA,OAAQ,OAAO,OAAQ,iBAAkB,EACvC,IAAK,CAAE,EAAE,cAAc,MAAO,eAAe,UAAU,CAAE,EACzD,OAAQ,CAAE,KAAK,QAAS,MAAM,KAAK,CAAE;AAAA,QACvC,MAAO,oBAAoB;AAAA,QAC3B,OAAQ,GAAI,oBAAqB;AAAA,QACjC,IAAK;AAAA,QACL,MAAO;AAAA,QACP,UACC,oBAAoB,oCACpB,gBAAgB;AAAA;AAAA,MAVb;AAAA,IAYL;AAAA,IACE,OAAO,QAAS,iBAAkB,EAAE;AAAA,MACrC,CAAE,CAAE,MAAM,EAAE,OAAO,
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalItem as Item,\n} from '@wordpress/components';\nimport { getTemplatePartIcon } from '@wordpress/editor';\nimport { __ } from '@wordpress/i18n';\nimport { file } from '@wordpress/icons';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\n\n/**\n * Internal dependencies\n */\nimport SidebarNavigationScreen from '../sidebar-navigation-screen';\nimport CategoryItem from './category-item';\nimport {\n\tPATTERN_DEFAULT_CATEGORY,\n\tPATTERN_TYPES,\n\tTEMPLATE_PART_POST_TYPE,\n\tTEMPLATE_PART_ALL_AREAS_CATEGORY,\n} from '../../utils/constants';\nimport usePatternCategories from './use-pattern-categories';\nimport useTemplatePartAreas from './use-template-part-areas';\nimport { unlock } from '../../lock-unlock';\n\nconst { useLocation } = unlock( routerPrivateApis );\n\nfunction CategoriesGroup( {\n\ttemplatePartAreas,\n\tpatternCategories,\n\tcurrentCategory,\n\tcurrentType,\n} ) {\n\tconst [ allPatterns, ...otherPatterns ] = patternCategories;\n\n\treturn (\n\t\t<ItemGroup className=\"edit-site-sidebar-navigation-screen-patterns__group\">\n\t\t\t<CategoryItem\n\t\t\t\tkey=\"all\"\n\t\t\t\tcount={ Object.values( templatePartAreas )\n\t\t\t\t\t.map( ( { templateParts } ) => templateParts?.length || 0 )\n\t\t\t\t\t.reduce( ( acc, val ) => acc + val, 0 ) }\n\t\t\t\ticon={ getTemplatePartIcon() } /* no name, so it provides the fallback icon */\n\t\t\t\tlabel={ __( 'All template parts' ) }\n\t\t\t\tid={ TEMPLATE_PART_ALL_AREAS_CATEGORY }\n\t\t\t\ttype={ TEMPLATE_PART_POST_TYPE }\n\t\t\t\tisActive={\n\t\t\t\t\tcurrentCategory === TEMPLATE_PART_ALL_AREAS_CATEGORY &&\n\t\t\t\t\tcurrentType === TEMPLATE_PART_POST_TYPE\n\t\t\t\t}\n\t\t\t/>\n\t\t\t{ Object.entries( templatePartAreas ).map(\n\t\t\t\t( [ area, { label, templateParts, icon } ] ) => (\n\t\t\t\t\t<CategoryItem\n\t\t\t\t\t\tkey={ area }\n\t\t\t\t\t\tcount={ templateParts?.length }\n\t\t\t\t\t\ticon={ getTemplatePartIcon( icon ) }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\tid={ area }\n\t\t\t\t\t\ttype={ TEMPLATE_PART_POST_TYPE }\n\t\t\t\t\t\tisActive={\n\t\t\t\t\t\t\tcurrentCategory === area &&\n\t\t\t\t\t\t\tcurrentType === TEMPLATE_PART_POST_TYPE\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t) }\n\t\t\t<div className=\"edit-site-sidebar-navigation-screen-patterns__divider\" />\n\t\t\t{ allPatterns && (\n\t\t\t\t<CategoryItem\n\t\t\t\t\tkey={ allPatterns.name }\n\t\t\t\t\tcount={ allPatterns.count }\n\t\t\t\t\tlabel={ allPatterns.label }\n\t\t\t\t\ticon={ file }\n\t\t\t\t\tid={ allPatterns.name }\n\t\t\t\t\ttype={ PATTERN_TYPES.user }\n\t\t\t\t\tisActive={\n\t\t\t\t\t\tcurrentCategory === `${ allPatterns.name }` &&\n\t\t\t\t\t\tcurrentType === PATTERN_TYPES.user\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ otherPatterns.map( ( category ) => (\n\t\t\t\t<CategoryItem\n\t\t\t\t\tkey={ category.name }\n\t\t\t\t\tcount={ category.count }\n\t\t\t\t\tlabel={ category.label }\n\t\t\t\t\ticon={ file }\n\t\t\t\t\tid={ category.name }\n\t\t\t\t\ttype={ PATTERN_TYPES.user }\n\t\t\t\t\tisActive={\n\t\t\t\t\t\tcurrentCategory === `${ category.name }` &&\n\t\t\t\t\t\tcurrentType === PATTERN_TYPES.user\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</ItemGroup>\n\t);\n}\n\nexport default function SidebarNavigationScreenPatterns( { backPath } ) {\n\tconst {\n\t\tquery: { postType = 'wp_block', categoryId },\n\t} = useLocation();\n\tconst currentCategory =\n\t\tcategoryId ||\n\t\t( postType === PATTERN_TYPES.user\n\t\t\t? PATTERN_DEFAULT_CATEGORY\n\t\t\t: TEMPLATE_PART_ALL_AREAS_CATEGORY );\n\n\tconst { templatePartAreas, hasTemplateParts, isLoading } =\n\t\tuseTemplatePartAreas();\n\tconst { patternCategories, hasPatterns } = usePatternCategories();\n\n\treturn (\n\t\t<SidebarNavigationScreen\n\t\t\ttitle={ __( 'Patterns' ) }\n\t\t\tdescription={ __(\n\t\t\t\t'Manage what patterns are available when editing the site.'\n\t\t\t) }\n\t\t\tisRoot={ ! backPath }\n\t\t\tbackPath={ backPath }\n\t\t\tcontent={\n\t\t\t\t<>\n\t\t\t\t\t{ isLoading && __( 'Loading items\u2026' ) }\n\t\t\t\t\t{ ! isLoading && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ ! hasTemplateParts && ! hasPatterns && (\n\t\t\t\t\t\t\t\t<ItemGroup className=\"edit-site-sidebar-navigation-screen-patterns__group\">\n\t\t\t\t\t\t\t\t\t<Item>{ __( 'No items found' ) }</Item>\n\t\t\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<CategoriesGroup\n\t\t\t\t\t\t\t\ttemplatePartAreas={ templatePartAreas }\n\t\t\t\t\t\t\t\tpatternCategories={ patternCategories }\n\t\t\t\t\t\t\t\tcurrentCategory={ currentCategory }\n\t\t\t\t\t\t\t\tcurrentType={ 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</>\n\t\t\t}\n\t\t/>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -287,40 +287,29 @@
|
|
|
287
287
|
--wpds-border-width-surface-md: 4px; /* Medium width for surfaces */
|
|
288
288
|
--wpds-border-width-surface-sm: 2px; /* Small width for surfaces */
|
|
289
289
|
--wpds-border-width-surface-xs: 1px; /* Extra small width for surfaces */
|
|
290
|
-
--wpds-color-bg-interactive-brand: #00000000; /* Background color for interactive elements with brand tone and normal emphasis. */
|
|
291
|
-
--wpds-color-bg-interactive-brand-active: #f6f8fd; /* Background color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active. */
|
|
292
|
-
--wpds-color-bg-interactive-brand-disabled: #e2e2e2; /* Background color for interactive elements with brand tone and normal emphasis, in their disabled state. */
|
|
293
290
|
--wpds-color-bg-interactive-brand-strong: #3858e9; /* Background color for interactive elements with brand tone and strong emphasis. */
|
|
294
291
|
--wpds-color-bg-interactive-brand-strong-active: #2e49d9; /* Background color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active. */
|
|
295
|
-
--wpds-color-bg-interactive-brand-strong-disabled: #d2d2d2; /* Background color for interactive elements with brand tone and strong emphasis, in their disabled state. */
|
|
296
292
|
--wpds-color-bg-interactive-brand-weak: #00000000; /* Background color for interactive elements with brand tone and weak emphasis. */
|
|
297
293
|
--wpds-color-bg-interactive-brand-weak-active: #e6eaf4; /* Background color for interactive elements with brand tone and weak emphasis that are hovered, focused, or active. */
|
|
298
|
-
--wpds-color-bg-interactive-brand-weak-disabled: #e2e2e2; /* Background color for interactive elements with brand tone and weak emphasis, in their disabled state. */
|
|
299
294
|
--wpds-color-bg-interactive-error: #00000000; /* Background color for interactive elements with error tone and normal emphasis. */
|
|
300
295
|
--wpds-color-bg-interactive-error-active: #fff6f4; /* Background color for interactive elements with error tone and normal emphasis that are hovered, focused, or active. */
|
|
301
|
-
--wpds-color-bg-interactive-error-disabled: #e2e2e2; /* Background color for interactive elements with error tone and normal emphasis, in their disabled state. */
|
|
302
296
|
--wpds-color-bg-interactive-error-strong: #cc1818; /* Background color for interactive elements with error tone and strong emphasis. */
|
|
303
297
|
--wpds-color-bg-interactive-error-strong-active: #b90000; /* Background color for interactive elements with error tone and strong emphasis that are hovered, focused, or active. */
|
|
304
|
-
--wpds-color-bg-interactive-error-strong-disabled: #d2d2d2; /* Background color for interactive elements with error tone and strong emphasis, in their disabled state. */
|
|
305
298
|
--wpds-color-bg-interactive-error-weak: #00000000; /* Background color for interactive elements with error tone and weak emphasis. */
|
|
306
299
|
--wpds-color-bg-interactive-error-weak-active: #f6e6e3; /* Background color for interactive elements with error tone and weak emphasis that are hovered, focused, or active. */
|
|
307
|
-
--wpds-color-bg-interactive-error-weak-disabled: #e2e2e2; /* Background color for interactive elements with error tone and weak emphasis, in their disabled state. */
|
|
308
|
-
--wpds-color-bg-interactive-neutral: #00000000; /* Background color for interactive elements with neutral tone and normal emphasis. */
|
|
309
|
-
--wpds-color-bg-interactive-neutral-active: #eaeaea; /* Background color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active. */
|
|
310
|
-
--wpds-color-bg-interactive-neutral-disabled: #e2e2e2; /* Background color for interactive elements with neutral tone and normal emphasis, in their disabled state. */
|
|
311
300
|
--wpds-color-bg-interactive-neutral-strong: #2d2d2d; /* Background color for interactive elements with neutral tone and strong emphasis. */
|
|
312
301
|
--wpds-color-bg-interactive-neutral-strong-active: #1e1e1e; /* Background color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active. */
|
|
313
|
-
--wpds-color-bg-interactive-neutral-strong-disabled: #
|
|
302
|
+
--wpds-color-bg-interactive-neutral-strong-disabled: #e2e2e2; /* Background color for interactive elements with neutral tone and strong emphasis, in their disabled state. */
|
|
314
303
|
--wpds-color-bg-interactive-neutral-weak: #00000000; /* Background color for interactive elements with neutral tone and weak emphasis. */
|
|
315
304
|
--wpds-color-bg-interactive-neutral-weak-active: #eaeaea; /* Background color for interactive elements with neutral tone and weak emphasis that are hovered, focused, or active. */
|
|
316
|
-
--wpds-color-bg-interactive-neutral-weak-disabled: #
|
|
305
|
+
--wpds-color-bg-interactive-neutral-weak-disabled: #00000000; /* Background color for interactive elements with weak emphasis, in their disabled state, regardless of the tone. */
|
|
317
306
|
--wpds-color-bg-surface-brand: #ecf0f9; /* Background color for surfaces with brand tone and normal emphasis. */
|
|
318
307
|
--wpds-color-bg-surface-caution: #fee994; /* Background color for surfaces with caution tone and normal emphasis. */
|
|
319
308
|
--wpds-color-bg-surface-caution-weak: #fff9c9; /* Background color for surfaces with caution tone and weak emphasis. */
|
|
320
309
|
--wpds-color-bg-surface-error: #f6e6e3; /* Background color for surfaces with error tone and normal emphasis. */
|
|
321
310
|
--wpds-color-bg-surface-error-weak: #fff6f4; /* Background color for surfaces with error tone and weak emphasis. */
|
|
322
311
|
--wpds-color-bg-surface-info: #deebfa; /* Background color for surfaces with info tone and normal emphasis. */
|
|
323
|
-
--wpds-color-bg-surface-info-weak: #
|
|
312
|
+
--wpds-color-bg-surface-info-weak: #f2f9ff; /* Background color for surfaces with info tone and weak emphasis. */
|
|
324
313
|
--wpds-color-bg-surface-neutral: #f8f8f8; /* Background color for surfaces with normal emphasis. */
|
|
325
314
|
--wpds-color-bg-surface-neutral-strong: #ffffff; /* Background color for surfaces with strong emphasis. */
|
|
326
315
|
--wpds-color-bg-surface-neutral-weak: #f0f0f0; /* Background color for surfaces with weak emphasis. */
|
|
@@ -330,7 +319,7 @@
|
|
|
330
319
|
--wpds-color-bg-surface-warning-weak: #fff7e0; /* Background color for surfaces with warning tone and weak emphasis. */
|
|
331
320
|
--wpds-color-bg-thumb-brand: #3858e9; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track). */
|
|
332
321
|
--wpds-color-bg-thumb-brand-active: #3858e9; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track) that are hovered, focused, or active. */
|
|
333
|
-
--wpds-color-bg-thumb-
|
|
322
|
+
--wpds-color-bg-thumb-neutral-disabled: #d8d8d8; /* Background color for thumbs with normal emphasis (eg. slider thumb and filled track), in their disabled state, regardless of the tone. */
|
|
334
323
|
--wpds-color-bg-thumb-neutral-weak: #8a8a8a; /* Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb). */
|
|
335
324
|
--wpds-color-bg-thumb-neutral-weak-active: #6c6c6c; /* Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb) that are hovered, focused, or active. */
|
|
336
325
|
--wpds-color-bg-track-neutral: #d8d8d8; /* Background color for tracks with a neutral tone and normal emphasis (eg. slider or progressbar track). */
|
|
@@ -349,24 +338,20 @@
|
|
|
349
338
|
--wpds-color-fg-content-warning-weak: #926300; /* Foreground color for content like text with warning tone and weak emphasis. */
|
|
350
339
|
--wpds-color-fg-interactive-brand: #3858e9; /* Foreground color for interactive elements with brand tone and normal emphasis. */
|
|
351
340
|
--wpds-color-fg-interactive-brand-active: #3858e9; /* Foreground color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active. */
|
|
352
|
-
--wpds-color-fg-interactive-brand-disabled: #8a8a8a; /* Foreground color for interactive elements with brand tone and normal emphasis, in their disabled state. */
|
|
353
341
|
--wpds-color-fg-interactive-brand-strong: #eff0f2; /* Foreground color for interactive elements with brand tone and strong emphasis. */
|
|
354
342
|
--wpds-color-fg-interactive-brand-strong-active: #eff0f2; /* Foreground color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active. */
|
|
355
|
-
--wpds-color-fg-interactive-brand-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with brand tone and strong emphasis, in their disabled state. */
|
|
356
343
|
--wpds-color-fg-interactive-error: #cc1818; /* Foreground color for interactive elements with error tone and normal emphasis. */
|
|
357
344
|
--wpds-color-fg-interactive-error-active: #cc1818; /* Foreground color for interactive elements with error tone and normal emphasis that are hovered, focused, or active. */
|
|
358
|
-
--wpds-color-fg-interactive-error-disabled: #8a8a8a; /* Foreground color for interactive elements with error tone and normal emphasis, in their disabled state. */
|
|
359
345
|
--wpds-color-fg-interactive-error-strong: #f2efef; /* Foreground color for interactive elements with error tone and strong emphasis. */
|
|
360
346
|
--wpds-color-fg-interactive-error-strong-active: #f2efef; /* Foreground color for interactive elements with error tone and strong emphasis that are hovered, focused, or active. */
|
|
361
|
-
--wpds-color-fg-interactive-error-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with error tone and strong emphasis, in their disabled state. */
|
|
362
347
|
--wpds-color-fg-interactive-neutral: #1e1e1e; /* Foreground color for interactive elements with neutral tone and normal emphasis. */
|
|
363
348
|
--wpds-color-fg-interactive-neutral-active: #1e1e1e; /* Foreground color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active. */
|
|
364
|
-
--wpds-color-fg-interactive-neutral-disabled: #8a8a8a; /* Foreground color for interactive elements with
|
|
349
|
+
--wpds-color-fg-interactive-neutral-disabled: #8a8a8a; /* Foreground color for interactive elements with normal emphasis, in their disabled state, regardless of the tone. */
|
|
365
350
|
--wpds-color-fg-interactive-neutral-strong: #f0f0f0; /* Foreground color for interactive elements with neutral tone and strong emphasis. */
|
|
366
351
|
--wpds-color-fg-interactive-neutral-strong-active: #f0f0f0; /* Foreground color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active. */
|
|
367
|
-
--wpds-color-fg-interactive-neutral-strong-disabled: #
|
|
352
|
+
--wpds-color-fg-interactive-neutral-strong-disabled: #8a8a8a; /* Foreground color for interactive elements with strong emphasis, in their disabled state, regardless of the tone. */
|
|
368
353
|
--wpds-color-fg-interactive-neutral-weak: #6d6d6d; /* Foreground color for interactive elements with neutral tone and weak emphasis. */
|
|
369
|
-
--wpds-color-fg-interactive-neutral-weak-disabled: #8a8a8a; /* Foreground color for interactive elements with
|
|
354
|
+
--wpds-color-fg-interactive-neutral-weak-disabled: #8a8a8a; /* Foreground color for interactive elements with weak emphasis, in their disabled state, regardless of the tone. */
|
|
370
355
|
--wpds-color-stroke-focus-brand: #3858e9; /* Accessible stroke color applied to focus rings. */
|
|
371
356
|
--wpds-color-stroke-interactive-brand: #3858e9; /* Accessible stroke color used for interactive brand-toned elements with normal emphasis. */
|
|
372
357
|
--wpds-color-stroke-interactive-brand-active: #2337c8; /* Accessible stroke color used for interactive brand-toned elements with normal emphasis that are hovered, focused, or active. */
|
|
@@ -375,7 +360,7 @@
|
|
|
375
360
|
--wpds-color-stroke-interactive-error-strong: #cc1818; /* Accessible stroke color used for interactive error-toned elements with strong emphasis. */
|
|
376
361
|
--wpds-color-stroke-interactive-neutral: #8a8a8a; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis. */
|
|
377
362
|
--wpds-color-stroke-interactive-neutral-active: #6c6c6c; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis that are hovered, focused, or active. */
|
|
378
|
-
--wpds-color-stroke-interactive-neutral-disabled: #d8d8d8; /* Accessible stroke color used for interactive
|
|
363
|
+
--wpds-color-stroke-interactive-neutral-disabled: #d8d8d8; /* Accessible stroke color used for interactive elements with normal emphasis, in their disabled state, regardless of the tone. */
|
|
379
364
|
--wpds-color-stroke-interactive-neutral-strong: #6c6c6c; /* Accessible stroke color used for interactive neutrally-toned elements with strong emphasis. */
|
|
380
365
|
--wpds-color-stroke-surface-brand: #a3b1d4; /* Decorative stroke color used to define brand-toned surface boundaries with normal emphasis. */
|
|
381
366
|
--wpds-color-stroke-surface-brand-strong: #3858e9; /* Decorative stroke color used to define brand-toned surface boundaries with strong emphasis. */
|
|
@@ -410,11 +395,11 @@
|
|
|
410
395
|
0 6px 6px 0 #00000008, 0 8px 8px 0 #00000005; /* For components that provide contextual feedback without being intrusive. Generally non-interruptive. Example: Tooltips, Snackbar. */
|
|
411
396
|
--wpds-elevation-x-small: 0 1px 1px 0 #00000008, 0 1px 2px 0 #00000005,
|
|
412
397
|
0 3px 3px 0 #00000005, 0 4px 4px 0 #00000003; /* For sections and containers that group related content and controls, which may overlap other content. Example: Preview Frame. */
|
|
413
|
-
--wpds-font-family-body: -apple-system, system-ui,
|
|
414
|
-
|
|
415
|
-
--wpds-font-family-heading: -apple-system, system-ui,
|
|
416
|
-
|
|
417
|
-
--wpds-font-family-mono:
|
|
398
|
+
--wpds-font-family-body: -apple-system, system-ui, 'Segoe UI', 'Roboto',
|
|
399
|
+
'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif; /* Body font family */
|
|
400
|
+
--wpds-font-family-heading: -apple-system, system-ui, 'Segoe UI', 'Roboto',
|
|
401
|
+
'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif; /* Headings font family */
|
|
402
|
+
--wpds-font-family-mono: 'Menlo', 'Consolas', monaco, monospace; /* Monospace font family */
|
|
418
403
|
--wpds-font-line-height-2xl: 40px; /* 2X large line height */
|
|
419
404
|
--wpds-font-line-height-lg: 28px; /* Large line height */
|
|
420
405
|
--wpds-font-line-height-md: 24px; /* Medium line height */
|
package/build-style/style.css
CHANGED
|
@@ -287,40 +287,29 @@
|
|
|
287
287
|
--wpds-border-width-surface-md: 4px; /* Medium width for surfaces */
|
|
288
288
|
--wpds-border-width-surface-sm: 2px; /* Small width for surfaces */
|
|
289
289
|
--wpds-border-width-surface-xs: 1px; /* Extra small width for surfaces */
|
|
290
|
-
--wpds-color-bg-interactive-brand: #00000000; /* Background color for interactive elements with brand tone and normal emphasis. */
|
|
291
|
-
--wpds-color-bg-interactive-brand-active: #f6f8fd; /* Background color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active. */
|
|
292
|
-
--wpds-color-bg-interactive-brand-disabled: #e2e2e2; /* Background color for interactive elements with brand tone and normal emphasis, in their disabled state. */
|
|
293
290
|
--wpds-color-bg-interactive-brand-strong: #3858e9; /* Background color for interactive elements with brand tone and strong emphasis. */
|
|
294
291
|
--wpds-color-bg-interactive-brand-strong-active: #2e49d9; /* Background color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active. */
|
|
295
|
-
--wpds-color-bg-interactive-brand-strong-disabled: #d2d2d2; /* Background color for interactive elements with brand tone and strong emphasis, in their disabled state. */
|
|
296
292
|
--wpds-color-bg-interactive-brand-weak: #00000000; /* Background color for interactive elements with brand tone and weak emphasis. */
|
|
297
293
|
--wpds-color-bg-interactive-brand-weak-active: #e6eaf4; /* Background color for interactive elements with brand tone and weak emphasis that are hovered, focused, or active. */
|
|
298
|
-
--wpds-color-bg-interactive-brand-weak-disabled: #e2e2e2; /* Background color for interactive elements with brand tone and weak emphasis, in their disabled state. */
|
|
299
294
|
--wpds-color-bg-interactive-error: #00000000; /* Background color for interactive elements with error tone and normal emphasis. */
|
|
300
295
|
--wpds-color-bg-interactive-error-active: #fff6f4; /* Background color for interactive elements with error tone and normal emphasis that are hovered, focused, or active. */
|
|
301
|
-
--wpds-color-bg-interactive-error-disabled: #e2e2e2; /* Background color for interactive elements with error tone and normal emphasis, in their disabled state. */
|
|
302
296
|
--wpds-color-bg-interactive-error-strong: #cc1818; /* Background color for interactive elements with error tone and strong emphasis. */
|
|
303
297
|
--wpds-color-bg-interactive-error-strong-active: #b90000; /* Background color for interactive elements with error tone and strong emphasis that are hovered, focused, or active. */
|
|
304
|
-
--wpds-color-bg-interactive-error-strong-disabled: #d2d2d2; /* Background color for interactive elements with error tone and strong emphasis, in their disabled state. */
|
|
305
298
|
--wpds-color-bg-interactive-error-weak: #00000000; /* Background color for interactive elements with error tone and weak emphasis. */
|
|
306
299
|
--wpds-color-bg-interactive-error-weak-active: #f6e6e3; /* Background color for interactive elements with error tone and weak emphasis that are hovered, focused, or active. */
|
|
307
|
-
--wpds-color-bg-interactive-error-weak-disabled: #e2e2e2; /* Background color for interactive elements with error tone and weak emphasis, in their disabled state. */
|
|
308
|
-
--wpds-color-bg-interactive-neutral: #00000000; /* Background color for interactive elements with neutral tone and normal emphasis. */
|
|
309
|
-
--wpds-color-bg-interactive-neutral-active: #eaeaea; /* Background color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active. */
|
|
310
|
-
--wpds-color-bg-interactive-neutral-disabled: #e2e2e2; /* Background color for interactive elements with neutral tone and normal emphasis, in their disabled state. */
|
|
311
300
|
--wpds-color-bg-interactive-neutral-strong: #2d2d2d; /* Background color for interactive elements with neutral tone and strong emphasis. */
|
|
312
301
|
--wpds-color-bg-interactive-neutral-strong-active: #1e1e1e; /* Background color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active. */
|
|
313
|
-
--wpds-color-bg-interactive-neutral-strong-disabled: #
|
|
302
|
+
--wpds-color-bg-interactive-neutral-strong-disabled: #e2e2e2; /* Background color for interactive elements with neutral tone and strong emphasis, in their disabled state. */
|
|
314
303
|
--wpds-color-bg-interactive-neutral-weak: #00000000; /* Background color for interactive elements with neutral tone and weak emphasis. */
|
|
315
304
|
--wpds-color-bg-interactive-neutral-weak-active: #eaeaea; /* Background color for interactive elements with neutral tone and weak emphasis that are hovered, focused, or active. */
|
|
316
|
-
--wpds-color-bg-interactive-neutral-weak-disabled: #
|
|
305
|
+
--wpds-color-bg-interactive-neutral-weak-disabled: #00000000; /* Background color for interactive elements with weak emphasis, in their disabled state, regardless of the tone. */
|
|
317
306
|
--wpds-color-bg-surface-brand: #ecf0f9; /* Background color for surfaces with brand tone and normal emphasis. */
|
|
318
307
|
--wpds-color-bg-surface-caution: #fee994; /* Background color for surfaces with caution tone and normal emphasis. */
|
|
319
308
|
--wpds-color-bg-surface-caution-weak: #fff9c9; /* Background color for surfaces with caution tone and weak emphasis. */
|
|
320
309
|
--wpds-color-bg-surface-error: #f6e6e3; /* Background color for surfaces with error tone and normal emphasis. */
|
|
321
310
|
--wpds-color-bg-surface-error-weak: #fff6f4; /* Background color for surfaces with error tone and weak emphasis. */
|
|
322
311
|
--wpds-color-bg-surface-info: #deebfa; /* Background color for surfaces with info tone and normal emphasis. */
|
|
323
|
-
--wpds-color-bg-surface-info-weak: #
|
|
312
|
+
--wpds-color-bg-surface-info-weak: #f2f9ff; /* Background color for surfaces with info tone and weak emphasis. */
|
|
324
313
|
--wpds-color-bg-surface-neutral: #f8f8f8; /* Background color for surfaces with normal emphasis. */
|
|
325
314
|
--wpds-color-bg-surface-neutral-strong: #ffffff; /* Background color for surfaces with strong emphasis. */
|
|
326
315
|
--wpds-color-bg-surface-neutral-weak: #f0f0f0; /* Background color for surfaces with weak emphasis. */
|
|
@@ -330,7 +319,7 @@
|
|
|
330
319
|
--wpds-color-bg-surface-warning-weak: #fff7e0; /* Background color for surfaces with warning tone and weak emphasis. */
|
|
331
320
|
--wpds-color-bg-thumb-brand: #3858e9; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track). */
|
|
332
321
|
--wpds-color-bg-thumb-brand-active: #3858e9; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track) that are hovered, focused, or active. */
|
|
333
|
-
--wpds-color-bg-thumb-
|
|
322
|
+
--wpds-color-bg-thumb-neutral-disabled: #d8d8d8; /* Background color for thumbs with normal emphasis (eg. slider thumb and filled track), in their disabled state, regardless of the tone. */
|
|
334
323
|
--wpds-color-bg-thumb-neutral-weak: #8a8a8a; /* Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb). */
|
|
335
324
|
--wpds-color-bg-thumb-neutral-weak-active: #6c6c6c; /* Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb) that are hovered, focused, or active. */
|
|
336
325
|
--wpds-color-bg-track-neutral: #d8d8d8; /* Background color for tracks with a neutral tone and normal emphasis (eg. slider or progressbar track). */
|
|
@@ -349,24 +338,20 @@
|
|
|
349
338
|
--wpds-color-fg-content-warning-weak: #926300; /* Foreground color for content like text with warning tone and weak emphasis. */
|
|
350
339
|
--wpds-color-fg-interactive-brand: #3858e9; /* Foreground color for interactive elements with brand tone and normal emphasis. */
|
|
351
340
|
--wpds-color-fg-interactive-brand-active: #3858e9; /* Foreground color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active. */
|
|
352
|
-
--wpds-color-fg-interactive-brand-disabled: #8a8a8a; /* Foreground color for interactive elements with brand tone and normal emphasis, in their disabled state. */
|
|
353
341
|
--wpds-color-fg-interactive-brand-strong: #eff0f2; /* Foreground color for interactive elements with brand tone and strong emphasis. */
|
|
354
342
|
--wpds-color-fg-interactive-brand-strong-active: #eff0f2; /* Foreground color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active. */
|
|
355
|
-
--wpds-color-fg-interactive-brand-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with brand tone and strong emphasis, in their disabled state. */
|
|
356
343
|
--wpds-color-fg-interactive-error: #cc1818; /* Foreground color for interactive elements with error tone and normal emphasis. */
|
|
357
344
|
--wpds-color-fg-interactive-error-active: #cc1818; /* Foreground color for interactive elements with error tone and normal emphasis that are hovered, focused, or active. */
|
|
358
|
-
--wpds-color-fg-interactive-error-disabled: #8a8a8a; /* Foreground color for interactive elements with error tone and normal emphasis, in their disabled state. */
|
|
359
345
|
--wpds-color-fg-interactive-error-strong: #f2efef; /* Foreground color for interactive elements with error tone and strong emphasis. */
|
|
360
346
|
--wpds-color-fg-interactive-error-strong-active: #f2efef; /* Foreground color for interactive elements with error tone and strong emphasis that are hovered, focused, or active. */
|
|
361
|
-
--wpds-color-fg-interactive-error-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with error tone and strong emphasis, in their disabled state. */
|
|
362
347
|
--wpds-color-fg-interactive-neutral: #1e1e1e; /* Foreground color for interactive elements with neutral tone and normal emphasis. */
|
|
363
348
|
--wpds-color-fg-interactive-neutral-active: #1e1e1e; /* Foreground color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active. */
|
|
364
|
-
--wpds-color-fg-interactive-neutral-disabled: #8a8a8a; /* Foreground color for interactive elements with
|
|
349
|
+
--wpds-color-fg-interactive-neutral-disabled: #8a8a8a; /* Foreground color for interactive elements with normal emphasis, in their disabled state, regardless of the tone. */
|
|
365
350
|
--wpds-color-fg-interactive-neutral-strong: #f0f0f0; /* Foreground color for interactive elements with neutral tone and strong emphasis. */
|
|
366
351
|
--wpds-color-fg-interactive-neutral-strong-active: #f0f0f0; /* Foreground color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active. */
|
|
367
|
-
--wpds-color-fg-interactive-neutral-strong-disabled: #
|
|
352
|
+
--wpds-color-fg-interactive-neutral-strong-disabled: #8a8a8a; /* Foreground color for interactive elements with strong emphasis, in their disabled state, regardless of the tone. */
|
|
368
353
|
--wpds-color-fg-interactive-neutral-weak: #6d6d6d; /* Foreground color for interactive elements with neutral tone and weak emphasis. */
|
|
369
|
-
--wpds-color-fg-interactive-neutral-weak-disabled: #8a8a8a; /* Foreground color for interactive elements with
|
|
354
|
+
--wpds-color-fg-interactive-neutral-weak-disabled: #8a8a8a; /* Foreground color for interactive elements with weak emphasis, in their disabled state, regardless of the tone. */
|
|
370
355
|
--wpds-color-stroke-focus-brand: #3858e9; /* Accessible stroke color applied to focus rings. */
|
|
371
356
|
--wpds-color-stroke-interactive-brand: #3858e9; /* Accessible stroke color used for interactive brand-toned elements with normal emphasis. */
|
|
372
357
|
--wpds-color-stroke-interactive-brand-active: #2337c8; /* Accessible stroke color used for interactive brand-toned elements with normal emphasis that are hovered, focused, or active. */
|
|
@@ -375,7 +360,7 @@
|
|
|
375
360
|
--wpds-color-stroke-interactive-error-strong: #cc1818; /* Accessible stroke color used for interactive error-toned elements with strong emphasis. */
|
|
376
361
|
--wpds-color-stroke-interactive-neutral: #8a8a8a; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis. */
|
|
377
362
|
--wpds-color-stroke-interactive-neutral-active: #6c6c6c; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis that are hovered, focused, or active. */
|
|
378
|
-
--wpds-color-stroke-interactive-neutral-disabled: #d8d8d8; /* Accessible stroke color used for interactive
|
|
363
|
+
--wpds-color-stroke-interactive-neutral-disabled: #d8d8d8; /* Accessible stroke color used for interactive elements with normal emphasis, in their disabled state, regardless of the tone. */
|
|
379
364
|
--wpds-color-stroke-interactive-neutral-strong: #6c6c6c; /* Accessible stroke color used for interactive neutrally-toned elements with strong emphasis. */
|
|
380
365
|
--wpds-color-stroke-surface-brand: #a3b1d4; /* Decorative stroke color used to define brand-toned surface boundaries with normal emphasis. */
|
|
381
366
|
--wpds-color-stroke-surface-brand-strong: #3858e9; /* Decorative stroke color used to define brand-toned surface boundaries with strong emphasis. */
|
|
@@ -410,11 +395,11 @@
|
|
|
410
395
|
0 6px 6px 0 #00000008, 0 8px 8px 0 #00000005; /* For components that provide contextual feedback without being intrusive. Generally non-interruptive. Example: Tooltips, Snackbar. */
|
|
411
396
|
--wpds-elevation-x-small: 0 1px 1px 0 #00000008, 0 1px 2px 0 #00000005,
|
|
412
397
|
0 3px 3px 0 #00000005, 0 4px 4px 0 #00000003; /* For sections and containers that group related content and controls, which may overlap other content. Example: Preview Frame. */
|
|
413
|
-
--wpds-font-family-body: -apple-system, system-ui,
|
|
414
|
-
|
|
415
|
-
--wpds-font-family-heading: -apple-system, system-ui,
|
|
416
|
-
|
|
417
|
-
--wpds-font-family-mono:
|
|
398
|
+
--wpds-font-family-body: -apple-system, system-ui, 'Segoe UI', 'Roboto',
|
|
399
|
+
'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif; /* Body font family */
|
|
400
|
+
--wpds-font-family-heading: -apple-system, system-ui, 'Segoe UI', 'Roboto',
|
|
401
|
+
'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif; /* Headings font family */
|
|
402
|
+
--wpds-font-family-mono: 'Menlo', 'Consolas', monaco, monospace; /* Monospace font family */
|
|
418
403
|
--wpds-font-line-height-2xl: 40px; /* 2X large line height */
|
|
419
404
|
--wpds-font-line-height-lg: 28px; /* Large line height */
|
|
420
405
|
--wpds-font-line-height-md: 24px; /* Medium line height */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wordpress/edit-site",
|
|
3
|
-
"version": "6.
|
|
3
|
+
"version": "6.38.0",
|
|
4
4
|
"description": "Edit Site Page module for WordPress.",
|
|
5
5
|
"author": "The WordPress Contributors",
|
|
6
6
|
"license": "GPL-2.0-or-later",
|
|
@@ -48,50 +48,50 @@
|
|
|
48
48
|
],
|
|
49
49
|
"dependencies": {
|
|
50
50
|
"@react-spring/web": "^9.4.5",
|
|
51
|
-
"@wordpress/a11y": "^4.
|
|
52
|
-
"@wordpress/admin-ui": "^1.
|
|
53
|
-
"@wordpress/api-fetch": "^7.
|
|
54
|
-
"@wordpress/base-styles": "^6.
|
|
55
|
-
"@wordpress/blob": "^4.
|
|
56
|
-
"@wordpress/block-editor": "^15.
|
|
57
|
-
"@wordpress/block-library": "^9.
|
|
58
|
-
"@wordpress/blocks": "^15.
|
|
59
|
-
"@wordpress/commands": "^1.
|
|
60
|
-
"@wordpress/components": "^32.0.
|
|
61
|
-
"@wordpress/compose": "^7.
|
|
62
|
-
"@wordpress/core-data": "^7.
|
|
63
|
-
"@wordpress/data": "^10.
|
|
64
|
-
"@wordpress/dataviews": "^11.2.
|
|
65
|
-
"@wordpress/date": "^5.
|
|
66
|
-
"@wordpress/deprecated": "^4.
|
|
67
|
-
"@wordpress/dom": "^4.
|
|
68
|
-
"@wordpress/editor": "^14.
|
|
69
|
-
"@wordpress/element": "^6.
|
|
70
|
-
"@wordpress/escape-html": "^3.
|
|
71
|
-
"@wordpress/fields": "^0.
|
|
72
|
-
"@wordpress/global-styles-engine": "^1.
|
|
73
|
-
"@wordpress/global-styles-ui": "^1.
|
|
74
|
-
"@wordpress/hooks": "^4.
|
|
75
|
-
"@wordpress/html-entities": "^4.
|
|
76
|
-
"@wordpress/i18n": "^6.
|
|
77
|
-
"@wordpress/icons": "^11.
|
|
78
|
-
"@wordpress/keyboard-shortcuts": "^5.
|
|
79
|
-
"@wordpress/keycodes": "^4.38.
|
|
80
|
-
"@wordpress/media-utils": "^5.
|
|
81
|
-
"@wordpress/notices": "^5.
|
|
82
|
-
"@wordpress/patterns": "^2.
|
|
83
|
-
"@wordpress/plugins": "^7.
|
|
84
|
-
"@wordpress/preferences": "^4.
|
|
85
|
-
"@wordpress/primitives": "^4.
|
|
86
|
-
"@wordpress/private-apis": "^1.
|
|
87
|
-
"@wordpress/reusable-blocks": "^5.
|
|
88
|
-
"@wordpress/router": "^1.
|
|
89
|
-
"@wordpress/style-engine": "^2.
|
|
90
|
-
"@wordpress/url": "^4.
|
|
91
|
-
"@wordpress/viewport": "^6.
|
|
92
|
-
"@wordpress/views": "^1.
|
|
93
|
-
"@wordpress/widgets": "^4.
|
|
94
|
-
"@wordpress/wordcount": "^4.
|
|
51
|
+
"@wordpress/a11y": "^4.38.0",
|
|
52
|
+
"@wordpress/admin-ui": "^1.6.0",
|
|
53
|
+
"@wordpress/api-fetch": "^7.38.0",
|
|
54
|
+
"@wordpress/base-styles": "^6.14.0",
|
|
55
|
+
"@wordpress/blob": "^4.38.0",
|
|
56
|
+
"@wordpress/block-editor": "^15.11.0",
|
|
57
|
+
"@wordpress/block-library": "^9.38.0",
|
|
58
|
+
"@wordpress/blocks": "^15.11.0",
|
|
59
|
+
"@wordpress/commands": "^1.38.0",
|
|
60
|
+
"@wordpress/components": "^32.0.0",
|
|
61
|
+
"@wordpress/compose": "^7.38.0",
|
|
62
|
+
"@wordpress/core-data": "^7.38.0",
|
|
63
|
+
"@wordpress/data": "^10.38.0",
|
|
64
|
+
"@wordpress/dataviews": "^11.2.0",
|
|
65
|
+
"@wordpress/date": "^5.38.0",
|
|
66
|
+
"@wordpress/deprecated": "^4.38.0",
|
|
67
|
+
"@wordpress/dom": "^4.38.0",
|
|
68
|
+
"@wordpress/editor": "^14.38.0",
|
|
69
|
+
"@wordpress/element": "^6.38.0",
|
|
70
|
+
"@wordpress/escape-html": "^3.38.0",
|
|
71
|
+
"@wordpress/fields": "^0.30.0",
|
|
72
|
+
"@wordpress/global-styles-engine": "^1.5.0",
|
|
73
|
+
"@wordpress/global-styles-ui": "^1.5.0",
|
|
74
|
+
"@wordpress/hooks": "^4.38.0",
|
|
75
|
+
"@wordpress/html-entities": "^4.38.0",
|
|
76
|
+
"@wordpress/i18n": "^6.11.0",
|
|
77
|
+
"@wordpress/icons": "^11.5.0",
|
|
78
|
+
"@wordpress/keyboard-shortcuts": "^5.38.0",
|
|
79
|
+
"@wordpress/keycodes": "^4.38.0",
|
|
80
|
+
"@wordpress/media-utils": "^5.38.0",
|
|
81
|
+
"@wordpress/notices": "^5.38.0",
|
|
82
|
+
"@wordpress/patterns": "^2.38.0",
|
|
83
|
+
"@wordpress/plugins": "^7.38.0",
|
|
84
|
+
"@wordpress/preferences": "^4.38.0",
|
|
85
|
+
"@wordpress/primitives": "^4.38.0",
|
|
86
|
+
"@wordpress/private-apis": "^1.38.0",
|
|
87
|
+
"@wordpress/reusable-blocks": "^5.38.0",
|
|
88
|
+
"@wordpress/router": "^1.38.0",
|
|
89
|
+
"@wordpress/style-engine": "^2.38.0",
|
|
90
|
+
"@wordpress/url": "^4.38.0",
|
|
91
|
+
"@wordpress/viewport": "^6.38.0",
|
|
92
|
+
"@wordpress/views": "^1.5.0",
|
|
93
|
+
"@wordpress/widgets": "^4.38.0",
|
|
94
|
+
"@wordpress/wordcount": "^4.38.0",
|
|
95
95
|
"change-case": "^4.1.2",
|
|
96
96
|
"clsx": "^2.1.1",
|
|
97
97
|
"colord": "^2.9.2",
|
|
@@ -106,5 +106,5 @@
|
|
|
106
106
|
"publishConfig": {
|
|
107
107
|
"access": "public"
|
|
108
108
|
},
|
|
109
|
-
"gitHead": "
|
|
109
|
+
"gitHead": "50c4c0f51e4797c217946ce42adfaa5eb026f33f"
|
|
110
110
|
}
|
|
@@ -53,7 +53,8 @@ const ANIMATION_DURATION = 0.3;
|
|
|
53
53
|
|
|
54
54
|
function Layout() {
|
|
55
55
|
const { query, name: routeKey, areas, widths } = useLocation();
|
|
56
|
-
|
|
56
|
+
// Force canvas to 'view' on notfound route to show the error message and allow navigation.
|
|
57
|
+
const canvas = routeKey === 'notfound' ? 'view' : query?.canvas ?? 'view';
|
|
57
58
|
const isMobileViewport = useViewportMatch( 'medium', '<' );
|
|
58
59
|
const toggleRef = useRef();
|
|
59
60
|
const navigateRegionsProps = useNavigateRegions();
|
|
@@ -52,11 +52,11 @@ function CategoriesGroup( {
|
|
|
52
52
|
}
|
|
53
53
|
/>
|
|
54
54
|
{ Object.entries( templatePartAreas ).map(
|
|
55
|
-
( [ area, { label, templateParts } ] ) => (
|
|
55
|
+
( [ area, { label, templateParts, icon } ] ) => (
|
|
56
56
|
<CategoryItem
|
|
57
57
|
key={ area }
|
|
58
58
|
count={ templateParts?.length }
|
|
59
|
-
icon={ getTemplatePartIcon(
|
|
59
|
+
icon={ getTemplatePartIcon( icon ) }
|
|
60
60
|
label={ label }
|
|
61
61
|
id={ area }
|
|
62
62
|
type={ TEMPLATE_PART_POST_TYPE }
|