npm - @wordpress/edit-site - Versions diffs - 5.5.0 → 5.7.0 - Mend

@wordpress/edit-site 5.5.0 → 5.7.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.

Files changed (310) hide show

package/build/components/editor/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/edit-site/src/components/editor/index.js"],"names":["interfaceLabels","body","sidebar","actions","footer","Editor","record","editedPost","getTitle","isLoaded","hasLoadedPost","id","editedPostId","type","editedPostType","context","editorMode","canvasMode","blockEditorMode","isRightSidebarOpen","isInserterOpen","isListViewOpen","showIconLabels","select","getEditedPostContext","getEditorMode","getCanvasMode","isInserterOpened","isListViewOpened","editSiteStore","__unstableGetEditorMode","blockEditorStore","getActiveComplementaryArea","interfaceStore","name","preferencesStore","get","setEditedPostContext","isViewMode","isEditMode","showVisualEditor","showBlockBreakcrumb","shouldShowInserter","shouldShowListView","secondarySidebarLabel","blockContext","queryContext","page","newQueryContext","title","secondarySidebar"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport { useMemo } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { Notice } from '@wordpress/components';\nimport { EntityProvider } from '@wordpress/core-data';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tBlockContextProvider,\n\tBlockBreadcrumb,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport {\n\tInterfaceSkeleton,\n\tComplementaryArea,\n\tstore as interfaceStore,\n} from '@wordpress/interface';\nimport { EditorNotices, EditorSnackbars } from '@wordpress/editor';\nimport { __, sprintf } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport { SidebarComplementaryAreaFills } from '../sidebar-edit-mode';\nimport BlockEditor from '../block-editor';\nimport CodeEditor from '../code-editor';\nimport KeyboardShortcutsEditMode from '../keyboard-shortcuts/edit-mode';\nimport InserterSidebar from '../secondary-sidebar/inserter-sidebar';\nimport ListViewSidebar from '../secondary-sidebar/list-view-sidebar';\nimport WelcomeGuide from '../welcome-guide';\nimport StartTemplateOptions from '../start-template-options';\nimport { store as editSiteStore } from '../../store';\nimport { GlobalStylesRenderer } from '../global-styles-renderer';\nimport { GlobalStylesProvider } from '../global-styles/global-styles-provider';\nimport useTitle from '../routes/use-title';\nimport CanvasSpinner from '../canvas-spinner';\nimport { unlock } from '../../private-apis';\nimport useEditedEntityRecord from '../use-edited-entity-record';\n\nconst interfaceLabels = {\n\t/ translators: accessibility text for the editor content landmark region. /\n\tbody: __( 'Editor content' ),\n\t/ translators: accessibility text for the editor settings landmark region. /\n\tsidebar: __( 'Editor settings' ),\n\t/ translators: accessibility text for the editor publish landmark region. /\n\tactions: __( 'Editor publish' ),\n\t/ translators: accessibility text for the editor footer landmark region. */\n\tfooter: __( 'Editor footer' ),\n};\n\nexport default function Editor() {\n\tconst {\n\t\trecord: editedPost,\n\t\tgetTitle,\n\t\tisLoaded: hasLoadedPost,\n\t} = useEditedEntityRecord();\n\n\tconst { id: editedPostId, type: editedPostType } = editedPost;\n\n\tconst {\n\t\tcontext,\n\t\teditorMode,\n\t\tcanvasMode,\n\t\tblockEditorMode,\n\t\tisRightSidebarOpen,\n\t\tisInserterOpen,\n\t\tisListViewOpen,\n\t\tshowIconLabels,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetEditedPostContext,\n\t\t\tgetEditorMode,\n\t\t\tgetCanvasMode,\n\t\t\tisInserterOpened,\n\t\t\tisListViewOpened,\n\t\t} = unlock( select( editSiteStore ) );\n\t\tconst { __unstableGetEditorMode } = select( blockEditorStore );\n\t\tconst { getActiveComplementaryArea } = select( interfaceStore );\n\n\t\t// The currently selected entity to display.\n\t\t// Typically template or template part in the site editor.\n\t\treturn {\n\t\t\tcontext: getEditedPostContext(),\n\t\t\teditorMode: getEditorMode(),\n\t\t\tcanvasMode: getCanvasMode(),\n\t\t\tblockEditorMode: __unstableGetEditorMode(),\n\t\t\tisInserterOpen: isInserterOpened(),\n\t\t\tisListViewOpen: isListViewOpened(),\n\t\t\tisRightSidebarOpen: getActiveComplementaryArea(\n\t\t\t\teditSiteStore.name\n\t\t\t),\n\t\t\tshowIconLabels: select( preferencesStore ).get(\n\t\t\t\t'core/edit-site',\n\t\t\t\t'showIconLabels'\n\t\t\t),\n\t\t};\n\t}, [] );\n\tconst { setEditedPostContext } = useDispatch( editSiteStore );\n\n\tconst isViewMode = canvasMode === 'view';\n\tconst isEditMode = canvasMode === 'edit';\n\tconst showVisualEditor = isViewMode \|\| editorMode === 'visual';\n\tconst showBlockBreakcrumb =\n\t\tisEditMode && showVisualEditor && blockEditorMode !== 'zoom-out';\n\tconst shouldShowInserter = isEditMode && showVisualEditor && isInserterOpen;\n\tconst shouldShowListView = isEditMode && showVisualEditor && isListViewOpen;\n\tconst secondarySidebarLabel = isListViewOpen\n\t\t? __( 'List View' )\n\t\t: __( 'Block Library' );\n\tconst blockContext = useMemo(\n\t\t() => ( {\n\t\t\t...context,\n\t\t\tqueryContext: [\n\t\t\t\tcontext?.queryContext \|\| { page: 1 },\n\t\t\t\t( newQueryContext ) =>\n\t\t\t\t\tsetEditedPostContext( {\n\t\t\t\t\t\t...context,\n\t\t\t\t\t\tqueryContext: {\n\t\t\t\t\t\t\t...context?.queryContext,\n\t\t\t\t\t\t\t...newQueryContext,\n\t\t\t\t\t\t},\n\t\t\t\t\t} ),\n\t\t\t],\n\t\t} ),\n\t\t[ context, setEditedPostContext ]\n\t);\n\n\tlet title;\n\tif ( hasLoadedPost ) {\n\t\tconst type =\n\t\t\teditedPostType === 'wp_template'\n\t\t\t\t? __( 'Template' )\n\t\t\t\t: __( 'Template Part' );\n\t\ttitle = sprintf(\n\t\t\t// translators: A breadcrumb trail in browser tab. %1$s: title of template being edited, %2$s: type of template (Template or Template Part).\n\t\t\t__( '%1$s ‹ %2$s ‹ Editor' ),\n\t\t\tgetTitle(),\n\t\t\ttype\n\t\t);\n\t}\n\n\t// Only announce the title once the editor is ready to prevent \"Replace\"\n\t// action in <URlQueryController> from double-announcing.\n\tuseTitle( hasLoadedPost && title );\n\n\tif ( ! hasLoadedPost ) {\n\t\treturn <CanvasSpinner />;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ isEditMode && <WelcomeGuide /> }\n\t\t\t<EntityProvider kind=\"root\" type=\"site\">\n\t\t\t\t<EntityProvider\n\t\t\t\t\tkind=\"postType\"\n\t\t\t\t\ttype={ editedPostType }\n\t\t\t\t\tid={ editedPostId }\n\t\t\t\t>\n\t\t\t\t\t<GlobalStylesProvider>\n\t\t\t\t\t\t<BlockContextProvider value={ blockContext }>\n\t\t\t\t\t\t\t<SidebarComplementaryAreaFills />\n\t\t\t\t\t\t\t{ isEditMode && <StartTemplateOptions /> }\n\t\t\t\t\t\t\t<InterfaceSkeleton\n\t\t\t\t\t\t\t\tenableRegionNavigation={ false }\n\t\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\t\tshowIconLabels && 'show-icon-labels'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tnotices={ isEditMode && <EditorSnackbars /> }\n\t\t\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<GlobalStylesRenderer />\n\t\t\t\t\t\t\t\t\t\t{ isEditMode && <EditorNotices /> }\n\t\t\t\t\t\t\t\t\t\t{ showVisualEditor && editedPost && (\n\t\t\t\t\t\t\t\t\t\t\t<BlockEditor />\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t{ editorMode === 'text' &&\n\t\t\t\t\t\t\t\t\t\t\teditedPost &&\n\t\t\t\t\t\t\t\t\t\t\tisEditMode && <CodeEditor /> }\n\t\t\t\t\t\t\t\t\t\t{ hasLoadedPost && ! editedPost && (\n\t\t\t\t\t\t\t\t\t\t\t<Notice\n\t\t\t\t\t\t\t\t\t\t\t\tstatus=\"warning\"\n\t\t\t\t\t\t\t\t\t\t\t\tisDismissible={ false }\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{ __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"You attempted to edit an item that doesn't exist. Perhaps it was deleted?\"\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</Notice>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t{ isEditMode && (\n\t\t\t\t\t\t\t\t\t\t\t<KeyboardShortcutsEditMode />\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\tsecondarySidebar={\n\t\t\t\t\t\t\t\t\tisEditMode &&\n\t\t\t\t\t\t\t\t\t( ( shouldShowInserter && (\n\t\t\t\t\t\t\t\t\t\t<InserterSidebar />\n\t\t\t\t\t\t\t\t\t) ) \|\|\n\t\t\t\t\t\t\t\t\t\t( shouldShowListView && (\n\t\t\t\t\t\t\t\t\t\t\t<ListViewSidebar />\n\t\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\tsidebar={\n\t\t\t\t\t\t\t\t\tisEditMode &&\n\t\t\t\t\t\t\t\t\tisRightSidebarOpen && (\n\t\t\t\t\t\t\t\t\t\t<ComplementaryArea.Slot scope=\"core/edit-site\" />\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\tfooter={\n\t\t\t\t\t\t\t\t\tshowBlockBreakcrumb && (\n\t\t\t\t\t\t\t\t\t\t<BlockBreadcrumb\n\t\t\t\t\t\t\t\t\t\t\trootLabelText={ __( 'Template' ) }\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\tlabels={ {\n\t\t\t\t\t\t\t\t\t...interfaceLabels,\n\t\t\t\t\t\t\t\t\tsecondarySidebar: secondarySidebarLabel,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</BlockContextProvider>\n\t\t\t\t\t</GlobalStylesProvider>\n\t\t\t\t</EntityProvider>\n\t\t\t</EntityProvider>\n\t\t</>\n\t);\n}\n"]}
1	+ {"version":3,"sources":["@wordpress/edit-site/src/components/editor/index.js"],"names":["interfaceLabels","body","sidebar","actions","footer","Editor","record","editedPost","getTitle","isLoaded","hasLoadedPost","id","editedPostId","type","editedPostType","context","editorMode","canvasMode","blockEditorMode","isRightSidebarOpen","isInserterOpen","isListViewOpen","showIconLabels","select","getEditedPostContext","getEditorMode","getCanvasMode","isInserterOpened","isListViewOpened","editSiteStore","__unstableGetEditorMode","blockEditorStore","getActiveComplementaryArea","interfaceStore","name","preferencesStore","get","setEditedPostContext","isViewMode","isEditMode","showVisualEditor","showBlockBreakcrumb","shouldShowInserter","shouldShowListView","secondarySidebarLabel","blockContext","queryContext","page","newQueryContext","title","secondarySidebar"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport { useMemo } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { Notice } from '@wordpress/components';\nimport { EntityProvider } from '@wordpress/core-data';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tBlockContextProvider,\n\tBlockBreadcrumb,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport {\n\tInterfaceSkeleton,\n\tComplementaryArea,\n\tstore as interfaceStore,\n} from '@wordpress/interface';\nimport { EditorNotices, EditorSnackbars } from '@wordpress/editor';\nimport { __, sprintf } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport { SidebarComplementaryAreaFills } from '../sidebar-edit-mode';\nimport BlockEditor from '../block-editor';\nimport CodeEditor from '../code-editor';\nimport KeyboardShortcutsEditMode from '../keyboard-shortcuts/edit-mode';\nimport InserterSidebar from '../secondary-sidebar/inserter-sidebar';\nimport ListViewSidebar from '../secondary-sidebar/list-view-sidebar';\nimport WelcomeGuide from '../welcome-guide';\nimport StartTemplateOptions from '../start-template-options';\nimport { store as editSiteStore } from '../../store';\nimport { GlobalStylesRenderer } from '../global-styles-renderer';\n\nimport useTitle from '../routes/use-title';\nimport CanvasSpinner from '../canvas-spinner';\nimport { unlock } from '../../private-apis';\nimport useEditedEntityRecord from '../use-edited-entity-record';\n\nconst interfaceLabels = {\n\t/ translators: accessibility text for the editor content landmark region. /\n\tbody: __( 'Editor content' ),\n\t/ translators: accessibility text for the editor settings landmark region. /\n\tsidebar: __( 'Editor settings' ),\n\t/ translators: accessibility text for the editor publish landmark region. /\n\tactions: __( 'Editor publish' ),\n\t/ translators: accessibility text for the editor footer landmark region. */\n\tfooter: __( 'Editor footer' ),\n};\n\nexport default function Editor() {\n\tconst {\n\t\trecord: editedPost,\n\t\tgetTitle,\n\t\tisLoaded: hasLoadedPost,\n\t} = useEditedEntityRecord();\n\n\tconst { id: editedPostId, type: editedPostType } = editedPost;\n\n\tconst {\n\t\tcontext,\n\t\teditorMode,\n\t\tcanvasMode,\n\t\tblockEditorMode,\n\t\tisRightSidebarOpen,\n\t\tisInserterOpen,\n\t\tisListViewOpen,\n\t\tshowIconLabels,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetEditedPostContext,\n\t\t\tgetEditorMode,\n\t\t\tgetCanvasMode,\n\t\t\tisInserterOpened,\n\t\t\tisListViewOpened,\n\t\t} = unlock( select( editSiteStore ) );\n\t\tconst { __unstableGetEditorMode } = select( blockEditorStore );\n\t\tconst { getActiveComplementaryArea } = select( interfaceStore );\n\n\t\t// The currently selected entity to display.\n\t\t// Typically template or template part in the site editor.\n\t\treturn {\n\t\t\tcontext: getEditedPostContext(),\n\t\t\teditorMode: getEditorMode(),\n\t\t\tcanvasMode: getCanvasMode(),\n\t\t\tblockEditorMode: __unstableGetEditorMode(),\n\t\t\tisInserterOpen: isInserterOpened(),\n\t\t\tisListViewOpen: isListViewOpened(),\n\t\t\tisRightSidebarOpen: getActiveComplementaryArea(\n\t\t\t\teditSiteStore.name\n\t\t\t),\n\t\t\tshowIconLabels: select( preferencesStore ).get(\n\t\t\t\t'core/edit-site',\n\t\t\t\t'showIconLabels'\n\t\t\t),\n\t\t};\n\t}, [] );\n\tconst { setEditedPostContext } = useDispatch( editSiteStore );\n\n\tconst isViewMode = canvasMode === 'view';\n\tconst isEditMode = canvasMode === 'edit';\n\tconst showVisualEditor = isViewMode \|\| editorMode === 'visual';\n\tconst showBlockBreakcrumb =\n\t\tisEditMode && showVisualEditor && blockEditorMode !== 'zoom-out';\n\tconst shouldShowInserter = isEditMode && showVisualEditor && isInserterOpen;\n\tconst shouldShowListView = isEditMode && showVisualEditor && isListViewOpen;\n\tconst secondarySidebarLabel = isListViewOpen\n\t\t? __( 'List View' )\n\t\t: __( 'Block Library' );\n\tconst blockContext = useMemo(\n\t\t() => ( {\n\t\t\t...context,\n\t\t\tqueryContext: [\n\t\t\t\tcontext?.queryContext \|\| { page: 1 },\n\t\t\t\t( newQueryContext ) =>\n\t\t\t\t\tsetEditedPostContext( {\n\t\t\t\t\t\t...context,\n\t\t\t\t\t\tqueryContext: {\n\t\t\t\t\t\t\t...context?.queryContext,\n\t\t\t\t\t\t\t...newQueryContext,\n\t\t\t\t\t\t},\n\t\t\t\t\t} ),\n\t\t\t],\n\t\t} ),\n\t\t[ context, setEditedPostContext ]\n\t);\n\n\tlet title;\n\tif ( hasLoadedPost ) {\n\t\tconst type =\n\t\t\teditedPostType === 'wp_template'\n\t\t\t\t? __( 'Template' )\n\t\t\t\t: __( 'Template Part' );\n\t\ttitle = sprintf(\n\t\t\t// translators: A breadcrumb trail in browser tab. %1$s: title of template being edited, %2$s: type of template (Template or Template Part).\n\t\t\t__( '%1$s ‹ %2$s ‹ Editor' ),\n\t\t\tgetTitle(),\n\t\t\ttype\n\t\t);\n\t}\n\n\t// Only announce the title once the editor is ready to prevent \"Replace\"\n\t// action in <URlQueryController> from double-announcing.\n\tuseTitle( hasLoadedPost && title );\n\n\tif ( ! hasLoadedPost ) {\n\t\treturn <CanvasSpinner />;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ isEditMode && <WelcomeGuide /> }\n\t\t\t<EntityProvider kind=\"root\" type=\"site\">\n\t\t\t\t<EntityProvider\n\t\t\t\t\tkind=\"postType\"\n\t\t\t\t\ttype={ editedPostType }\n\t\t\t\t\tid={ editedPostId }\n\t\t\t\t>\n\t\t\t\t\t<BlockContextProvider value={ blockContext }>\n\t\t\t\t\t\t<SidebarComplementaryAreaFills />\n\t\t\t\t\t\t{ isEditMode && <StartTemplateOptions /> }\n\t\t\t\t\t\t<InterfaceSkeleton\n\t\t\t\t\t\t\tenableRegionNavigation={ false }\n\t\t\t\t\t\t\tclassName={ showIconLabels && 'show-icon-labels' }\n\t\t\t\t\t\t\tnotices={ isEditMode && <EditorSnackbars /> }\n\t\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<GlobalStylesRenderer />\n\t\t\t\t\t\t\t\t\t{ isEditMode && <EditorNotices /> }\n\t\t\t\t\t\t\t\t\t{ showVisualEditor && editedPost && (\n\t\t\t\t\t\t\t\t\t\t<BlockEditor />\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ editorMode === 'text' &&\n\t\t\t\t\t\t\t\t\t\teditedPost &&\n\t\t\t\t\t\t\t\t\t\tisEditMode && <CodeEditor /> }\n\t\t\t\t\t\t\t\t\t{ hasLoadedPost && ! editedPost && (\n\t\t\t\t\t\t\t\t\t\t<Notice\n\t\t\t\t\t\t\t\t\t\t\tstatus=\"warning\"\n\t\t\t\t\t\t\t\t\t\t\tisDismissible={ false }\n\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\"You attempted to edit an item that doesn't exist. Perhaps it was deleted?\"\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t</Notice>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ isEditMode && (\n\t\t\t\t\t\t\t\t\t\t<KeyboardShortcutsEditMode />\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\tsecondarySidebar={\n\t\t\t\t\t\t\t\tisEditMode &&\n\t\t\t\t\t\t\t\t( ( shouldShowInserter && (\n\t\t\t\t\t\t\t\t\t<InserterSidebar />\n\t\t\t\t\t\t\t\t) ) \|\|\n\t\t\t\t\t\t\t\t\t( shouldShowListView && (\n\t\t\t\t\t\t\t\t\t\t<ListViewSidebar />\n\t\t\t\t\t\t\t\t\t) ) )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsidebar={\n\t\t\t\t\t\t\t\tisEditMode &&\n\t\t\t\t\t\t\t\tisRightSidebarOpen && (\n\t\t\t\t\t\t\t\t\t<ComplementaryArea.Slot scope=\"core/edit-site\" />\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tfooter={\n\t\t\t\t\t\t\t\tshowBlockBreakcrumb && (\n\t\t\t\t\t\t\t\t\t<BlockBreadcrumb\n\t\t\t\t\t\t\t\t\t\trootLabelText={ __( 'Template' ) }\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\tlabels={ {\n\t\t\t\t\t\t\t\t...interfaceLabels,\n\t\t\t\t\t\t\t\tsecondarySidebar: secondarySidebarLabel,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</BlockContextProvider>\n\t\t\t\t</EntityProvider>\n\t\t\t</EntityProvider>\n\t\t</>\n\t);\n}\n"]}

package/build/components/global-styles/border-panel.js CHANGED Viewed

@@ -4,18 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = BorderPanel;
-exports.useHasBorderPanel = useHasBorderPanel;
 var _element = require("@wordpress/element");
 var _blockEditor = require("@wordpress/block-editor");
-var _components = require("@wordpress/components");
-var _i18n = require("@wordpress/i18n");
-var _hooks = require("./hooks");
 var _privateApis = require("../../private-apis");
 /**
@@ -26,167 +19,35 @@ var _privateApis = require("../../private-apis");
  * Internal dependencies
  */
 const {
+  useGlobalStyle,
   useGlobalSetting,
-  useGlobalStyle
+  useSettingsForBlockElement,
+  BorderPanel: StylesBorderPanel
 } = (0, _privateApis.unlock)(_blockEditor.privateApis);
-function useHasBorderPanel(name) {
-  const controls = [useHasBorderColorControl(name), useHasBorderRadiusControl(name), useHasBorderStyleControl(name), useHasBorderWidthControl(name)];
-  return controls.some(Boolean);
-}
-function useHasBorderColorControl(name) {
-  const supports = (0, _hooks.useSupportedStyles)(name);
-  return useGlobalSetting('border.color', name)[0] && supports.includes('borderColor');
-}
-function useHasBorderRadiusControl(name) {
-  const supports = (0, _hooks.useSupportedStyles)(name);
-  return useGlobalSetting('border.radius', name)[0] && supports.includes('borderRadius');
-}
-function useHasBorderStyleControl(name) {
-  const supports = (0, _hooks.useSupportedStyles)(name);
-  return useGlobalSetting('border.style', name)[0] && supports.includes('borderStyle');
-}
-function useHasBorderWidthControl(name) {
-  const supports = (0, _hooks.useSupportedStyles)(name);
-  return useGlobalSetting('border.width', name)[0] && supports.includes('borderWidth');
-}
-function applyFallbackStyle(border) {
-  if (!border) {
-    return border;
-  }
-  if (!border.style && (border.color || border.width)) {
-    return { ...border,
-      style: 'solid'
-    };
-  }
-  return border;
-}
-function applyAllFallbackStyles(border) {
-  if (!border) {
-    return border;
-  }
-  if ((0, _components.__experimentalHasSplitBorders)(border)) {
-    return {
-      top: applyFallbackStyle(border.top),
-      right: applyFallbackStyle(border.right),
-      bottom: applyFallbackStyle(border.bottom),
-      left: applyFallbackStyle(border.left)
-    };
-  }
-  return applyFallbackStyle(border);
-}
 function BorderPanel(_ref) {
   let {
     name,
     variation = ''
   } = _ref;
-  const prefix = variation ? `variations.${variation}.` : ''; // To better reflect if the user has customized a value we need to
-  // ensure the style value being checked is from the `user` origin.
-  const [userBorderStyles] = useGlobalStyle(`${prefix}border`, name, 'user');
-  const [border, setBorder] = useGlobalStyle(`${prefix}border`, name);
-  const colors = (0, _hooks.useColorsPerOrigin)(name);
-  const showBorderColor = useHasBorderColorControl(name);
-  const showBorderStyle = useHasBorderStyleControl(name);
-  const showBorderWidth = useHasBorderWidthControl(name); // Border radius.
+  let prefixParts = [];
-  const showBorderRadius = useHasBorderRadiusControl(name);
-  const [borderRadiusValues, setBorderRadius] = useGlobalStyle(`${prefix}border.radius`, name);
-  const hasBorderRadius = () => {
-    const borderValues = userBorderStyles === null || userBorderStyles === void 0 ? void 0 : userBorderStyles.radius;
-    if (typeof borderValues === 'object') {
-      return Object.entries(borderValues).some(Boolean);
-    }
-    return !!borderValues;
-  };
-  const resetBorder = () => {
-    if (hasBorderRadius()) {
-      return setBorder({
-        radius: userBorderStyles.radius
-      });
-    }
-    setBorder(undefined);
-  };
-  const resetAll = (0, _element.useCallback)(() => setBorder(undefined), [setBorder]);
-  const onBorderChange = (0, _element.useCallback)(newBorder => {
-    // Ensure we have a visible border style when a border width or
-    // color is being selected.
-    const newBorderWithStyle = applyAllFallbackStyles(newBorder); // As we can't conditionally generate styles based on if other
-    // style properties have been set we need to force split border
-    // definitions for user set border styles. Border radius is derived
-    // from the same property i.e. `border.radius` if it is a string
-    // that is used. The longhand border radii styles are only generated
-    // if that property is an object.
-    //
-    // For borders (color, style, and width) those are all properties on
-    // the `border` style property. This means if the theme.json defined
-    // split borders and the user condenses them into a flat border or
-    // vice-versa we'd get both sets of styles which would conflict.
-    const updatedBorder = !(0, _components.__experimentalHasSplitBorders)(newBorderWithStyle) ? {
-      top: newBorderWithStyle,
-      right: newBorderWithStyle,
-      bottom: newBorderWithStyle,
-      left: newBorderWithStyle
-    } : {
-      color: null,
-      style: null,
-      width: null,
-      ...newBorderWithStyle
-    }; // As radius is maintained separately to color, style, and width
-    // maintain its value. Undefined values here will be cleaned when
-    // global styles are saved.
+  if (variation) {
+    prefixParts = ['variations', variation].concat(prefixParts);
+  }
-    setBorder({
-      radius: border === null || border === void 0 ? void 0 : border.radius,
-      ...updatedBorder
-    });
-  }, [setBorder, border === null || border === void 0 ? void 0 : border.radius]);
-  return (0, _element.createElement)(_components.__experimentalToolsPanel, {
-    label: (0, _i18n.__)('Border'),
-    resetAll: resetAll
-  }, (showBorderWidth || showBorderColor) && (0, _element.createElement)(_components.__experimentalToolsPanelItem, {
-    hasValue: () => (0, _components.__experimentalIsDefinedBorder)(userBorderStyles),
-    label: (0, _i18n.__)('Border'),
-    onDeselect: () => resetBorder(),
-    isShownByDefault: true
-  }, (0, _element.createElement)(_components.__experimentalBorderBoxControl, {
-    colors: colors,
-    enableAlpha: true,
-    enableStyle: showBorderStyle,
-    onChange: onBorderChange,
-    popoverOffset: 40,
-    popoverPlacement: "left-start",
-    value: border,
-    __experimentalIsRenderedInSidebar: true,
-    size: '__unstable-large'
-  })), showBorderRadius && (0, _element.createElement)(_components.__experimentalToolsPanelItem, {
-    hasValue: hasBorderRadius,
-    label: (0, _i18n.__)('Radius'),
-    onDeselect: () => setBorderRadius(undefined),
-    isShownByDefault: true
-  }, (0, _element.createElement)(_blockEditor.__experimentalBorderRadiusControl, {
-    values: borderRadiusValues,
-    onChange: value => {
-      setBorderRadius(value || undefined);
-    }
-  })));
+  const prefix = prefixParts.join('.');
+  const [style] = useGlobalStyle(prefix, name, 'user', false);
+  const [inheritedStyle, setStyle] = useGlobalStyle(prefix, name, 'all', {
+    shouldDecodeEncode: false
+  });
+  const [rawSettings] = useGlobalSetting('', name);
+  const settings = useSettingsForBlockElement(rawSettings, name);
+  return (0, _element.createElement)(StylesBorderPanel, {
+    inheritedValue: inheritedStyle,
+    value: style,
+    onChange: setStyle,
+    settings: settings
+  });
 }
 //# sourceMappingURL=border-panel.js.map

package/build/components/global-styles/border-panel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/border-panel.js"],"names":["useGlobalSetting","useGlobalStyle","blockEditorPrivateApis","useHasBorderPanel","name","controls","useHasBorderColorControl","useHasBorderRadiusControl","useHasBorderStyleControl","useHasBorderWidthControl","some","Boolean","supports","includes","applyFallbackStyle","border","style","color","width","applyAllFallbackStyles","top","right","bottom","left","BorderPanel","variation","prefix","userBorderStyles","setBorder","colors","showBorderColor","showBorderStyle","showBorderWidth","showBorderRadius","borderRadiusValues","setBorderRadius","hasBorderRadius","borderValues","radius","Object","entries","resetBorder","undefined","resetAll","onBorderChange","newBorder","newBorderWithStyle","updatedBorder","value"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalBorderRadiusControl as BorderRadiusControl,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport {\n\t__experimentalBorderBoxControl as BorderBoxControl,\n\t__experimentalHasSplitBorders as hasSplitBorders,\n\t__experimentalIsDefinedBorder as isDefinedBorder,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n */\nimport { useSupportedStyles, useColorsPerOrigin } from './hooks';\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting, useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nexport function useHasBorderPanel( name ) {\n\tconst controls = [\n\t\tuseHasBorderColorControl( name ),\n\t\tuseHasBorderRadiusControl( name ),\n\t\tuseHasBorderStyleControl( name ),\n\t\tuseHasBorderWidthControl( name ),\n\t];\n\n\treturn controls.some( Boolean );\n}\n\nfunction useHasBorderColorControl( name ) {\n\tconst supports = useSupportedStyles( name );\n\treturn (\n\t\tuseGlobalSetting( 'border.color', name )[ 0 ] &&\n\t\tsupports.includes( 'borderColor' )\n\t);\n}\n\nfunction useHasBorderRadiusControl( name ) {\n\tconst supports = useSupportedStyles( name );\n\treturn (\n\t\tuseGlobalSetting( 'border.radius', name )[ 0 ] &&\n\t\tsupports.includes( 'borderRadius' )\n\t);\n}\n\nfunction useHasBorderStyleControl( name ) {\n\tconst supports = useSupportedStyles( name );\n\treturn (\n\t\tuseGlobalSetting( 'border.style', name )[ 0 ] &&\n\t\tsupports.includes( 'borderStyle' )\n\t);\n}\n\nfunction useHasBorderWidthControl( name ) {\n\tconst supports = useSupportedStyles( name );\n\treturn (\n\t\tuseGlobalSetting( 'border.width', name )[ 0 ] &&\n\t\tsupports.includes( 'borderWidth' )\n\t);\n}\n\nfunction applyFallbackStyle( border ) {\n\tif ( ! border ) {\n\t\treturn border;\n\t}\n\n\tif ( ! border.style && ( border.color \|\| border.width ) ) {\n\t\treturn { ...border, style: 'solid' };\n\t}\n\n\treturn border;\n}\n\nfunction applyAllFallbackStyles( border ) {\n\tif ( ! border ) {\n\t\treturn border;\n\t}\n\n\tif ( hasSplitBorders( border ) ) {\n\t\treturn {\n\t\t\ttop: applyFallbackStyle( border.top ),\n\t\t\tright: applyFallbackStyle( border.right ),\n\t\t\tbottom: applyFallbackStyle( border.bottom ),\n\t\t\tleft: applyFallbackStyle( border.left ),\n\t\t};\n\t}\n\n\treturn applyFallbackStyle( border );\n}\n\nexport default function BorderPanel( { name, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\t// To better reflect if the user has customized a value we need to\n\t// ensure the style value being checked is from the `user` origin.\n\tconst [ userBorderStyles ] = useGlobalStyle(\n\t\t`${ prefix }border`,\n\t\tname,\n\t\t'user'\n\t);\n\tconst [ border, setBorder ] = useGlobalStyle( `${ prefix }border`, name );\n\tconst colors = useColorsPerOrigin( name );\n\n\tconst showBorderColor = useHasBorderColorControl( name );\n\tconst showBorderStyle = useHasBorderStyleControl( name );\n\tconst showBorderWidth = useHasBorderWidthControl( name );\n\n\t// Border radius.\n\tconst showBorderRadius = useHasBorderRadiusControl( name );\n\tconst [ borderRadiusValues, setBorderRadius ] = useGlobalStyle(\n\t\t`${ prefix }border.radius`,\n\t\tname\n\t);\n\tconst hasBorderRadius = () => {\n\t\tconst borderValues = userBorderStyles?.radius;\n\t\tif ( typeof borderValues === 'object' ) {\n\t\t\treturn Object.entries( borderValues ).some( Boolean );\n\t\t}\n\t\treturn !! borderValues;\n\t};\n\n\tconst resetBorder = () => {\n\t\tif ( hasBorderRadius() ) {\n\t\t\treturn setBorder( { radius: userBorderStyles.radius } );\n\t\t}\n\n\t\tsetBorder( undefined );\n\t};\n\n\tconst resetAll = useCallback( () => setBorder( undefined ), [ setBorder ] );\n\tconst onBorderChange = useCallback(\n\t\t( newBorder ) => {\n\t\t\t// Ensure we have a visible border style when a border width or\n\t\t\t// color is being selected.\n\t\t\tconst newBorderWithStyle = applyAllFallbackStyles( newBorder );\n\n\t\t\t// As we can't conditionally generate styles based on if other\n\t\t\t// style properties have been set we need to force split border\n\t\t\t// definitions for user set border styles. Border radius is derived\n\t\t\t// from the same property i.e. `border.radius` if it is a string\n\t\t\t// that is used. The longhand border radii styles are only generated\n\t\t\t// if that property is an object.\n\t\t\t//\n\t\t\t// For borders (color, style, and width) those are all properties on\n\t\t\t// the `border` style property. This means if the theme.json defined\n\t\t\t// split borders and the user condenses them into a flat border or\n\t\t\t// vice-versa we'd get both sets of styles which would conflict.\n\t\t\tconst updatedBorder = ! hasSplitBorders( newBorderWithStyle )\n\t\t\t\t? {\n\t\t\t\t\t\ttop: newBorderWithStyle,\n\t\t\t\t\t\tright: newBorderWithStyle,\n\t\t\t\t\t\tbottom: newBorderWithStyle,\n\t\t\t\t\t\tleft: newBorderWithStyle,\n\t\t\t\t }\n\t\t\t\t: {\n\t\t\t\t\t\tcolor: null,\n\t\t\t\t\t\tstyle: null,\n\t\t\t\t\t\twidth: null,\n\t\t\t\t\t\t...newBorderWithStyle,\n\t\t\t\t };\n\n\t\t\t// As radius is maintained separately to color, style, and width\n\t\t\t// maintain its value. Undefined values here will be cleaned when\n\t\t\t// global styles are saved.\n\t\t\tsetBorder( { radius: border?.radius, ...updatedBorder } );\n\t\t},\n\t\t[ setBorder, border?.radius ]\n\t);\n\n\treturn (\n\t\t<ToolsPanel label={ __( 'Border' ) } resetAll={ resetAll }>\n\t\t\t{ ( showBorderWidth \|\| showBorderColor ) && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ () => isDefinedBorder( userBorderStyles ) }\n\t\t\t\t\tlabel={ __( 'Border' ) }\n\t\t\t\t\tonDeselect={ () => resetBorder() }\n\t\t\t\t\tisShownByDefault={ true }\n\t\t\t\t>\n\t\t\t\t\t<BorderBoxControl\n\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\tenableAlpha={ true }\n\t\t\t\t\t\tenableStyle={ showBorderStyle }\n\t\t\t\t\t\tonChange={ onBorderChange }\n\t\t\t\t\t\tpopoverOffset={ 40 }\n\t\t\t\t\t\tpopoverPlacement=\"left-start\"\n\t\t\t\t\t\tvalue={ border }\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={ true }\n\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t\t{ showBorderRadius && (\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\thasValue={ hasBorderRadius }\n\t\t\t\t\tlabel={ __( 'Radius' ) }\n\t\t\t\t\tonDeselect={ () => setBorderRadius( undefined ) }\n\t\t\t\t\tisShownByDefault={ true }\n\t\t\t\t>\n\t\t\t\t\t<BorderRadiusControl\n\t\t\t\t\t\tvalues={ borderRadiusValues }\n\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\tsetBorderRadius( value \|\| undefined );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t) }\n\t\t</ToolsPanel>\n\t);\n}\n"]}
1	+ {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/border-panel.js"],"names":["useGlobalStyle","useGlobalSetting","useSettingsForBlockElement","BorderPanel","StylesBorderPanel","blockEditorPrivateApis","name","variation","prefixParts","concat","prefix","join","style","inheritedStyle","setStyle","shouldDecodeEncode","rawSettings","settings"],"mappings":";;;;;;;;;AAGA;;AAKA;;AARA;AACA;AACA;;AAGA;AACA;AACA;AAGA,MAAM;AACLA,EAAAA,cADK;AAELC,EAAAA,gBAFK;AAGLC,EAAAA,0BAHK;AAILC,EAAAA,WAAW,EAAEC;AAJR,IAKF,yBAAQC,wBAAR,CALJ;;AAOe,SAASF,WAAT,OAAiD;AAAA,MAA3B;AAAEG,IAAAA,IAAF;AAAQC,IAAAA,SAAS,GAAG;AAApB,GAA2B;AAC/D,MAAIC,WAAW,GAAG,EAAlB;;AACA,MAAKD,SAAL,EAAiB;AAChBC,IAAAA,WAAW,GAAG,CAAE,YAAF,EAAgBD,SAAhB,EAA4BE,MAA5B,CAAoCD,WAApC,CAAd;AACA;;AACD,QAAME,MAAM,GAAGF,WAAW,CAACG,IAAZ,CAAkB,GAAlB,CAAf;AAEA,QAAM,CAAEC,KAAF,IAAYZ,cAAc,CAAEU,MAAF,EAAUJ,IAAV,EAAgB,MAAhB,EAAwB,KAAxB,CAAhC;AACA,QAAM,CAAEO,cAAF,EAAkBC,QAAlB,IAA+Bd,cAAc,CAAEU,MAAF,EAAUJ,IAAV,EAAgB,KAAhB,EAAuB;AACzES,IAAAA,kBAAkB,EAAE;AADqD,GAAvB,CAAnD;AAGA,QAAM,CAAEC,WAAF,IAAkBf,gBAAgB,CAAE,EAAF,EAAMK,IAAN,CAAxC;AACA,QAAMW,QAAQ,GAAGf,0BAA0B,CAAEc,WAAF,EAAeV,IAAf,CAA3C;AAEA,SACC,4BAAC,iBAAD;AACC,IAAA,cAAc,EAAGO,cADlB;AAEC,IAAA,KAAK,EAAGD,KAFT;AAGC,IAAA,QAAQ,EAAGE,QAHZ;AAIC,IAAA,QAAQ,EAAGG;AAJZ,IADD;AAQA","sourcesContent":["/*\n WordPress dependencies\n /\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n */\nimport { unlock } from '../../private-apis';\n\nconst {\n\tuseGlobalStyle,\n\tuseGlobalSetting,\n\tuseSettingsForBlockElement,\n\tBorderPanel: StylesBorderPanel,\n} = unlock( blockEditorPrivateApis );\n\nexport default function BorderPanel( { name, variation = '' } ) {\n\tlet prefixParts = [];\n\tif ( variation ) {\n\t\tprefixParts = [ 'variations', variation ].concat( prefixParts );\n\t}\n\tconst prefix = prefixParts.join( '.' );\n\n\tconst [ style ] = useGlobalStyle( prefix, name, 'user', false );\n\tconst [ inheritedStyle, setStyle ] = useGlobalStyle( prefix, name, 'all', {\n\t\tshouldDecodeEncode: false,\n\t} );\n\tconst [ rawSettings ] = useGlobalSetting( '', name );\n\tconst settings = useSettingsForBlockElement( rawSettings, name );\n\n\treturn (\n\t\t<StylesBorderPanel\n\t\t\tinheritedValue={ inheritedStyle }\n\t\t\tvalue={ style }\n\t\t\tonChange={ setStyle }\n\t\t\tsettings={ settings }\n\t\t/>\n\t);\n}\n"]}

package/build/components/global-styles/context-menu.js CHANGED Viewed

@@ -19,10 +19,6 @@ var _coreData = require("@wordpress/core-data");
 var _blockEditor = require("@wordpress/block-editor");
-var _borderPanel = require("./border-panel");
-var _colorUtils = require("./color-utils");
 var _filterUtils = require("./filter-utils");
 var _variationsPanel = require("./variations-panel");
@@ -47,6 +43,8 @@ var _privateApis = require("../../private-apis");
 const {
   useHasDimensionsPanel,
   useHasTypographyPanel,
+  useHasBorderPanel,
+  useHasColorPanel,
   useGlobalSetting,
   useSettingsForBlockElement
 } = (0, _privateApis.unlock)(_blockEditor.privateApis);
@@ -59,8 +57,8 @@ function ContextMenu(_ref) {
   const [rawSettings] = useGlobalSetting('', name);
   const settings = useSettingsForBlockElement(rawSettings, name);
   const hasTypographyPanel = useHasTypographyPanel(settings);
-  const hasColorPanel = (0, _colorUtils.useHasColorPanel)(name);
-  const hasBorderPanel = (0, _borderPanel.useHasBorderPanel)(name);
+  const hasColorPanel = useHasColorPanel(settings);
+  const hasBorderPanel = useHasBorderPanel(settings);
   const hasEffectsPanel = (0, _shadowPanel.useHasShadowControl)(name);
   const hasFilterPanel = (0, _filterUtils.useHasFilterPanel)(name);
   const hasDimensionsPanel = useHasDimensionsPanel(settings);

package/build/components/global-styles/context-menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/context-menu.js"],"names":["useHasDimensionsPanel","useHasTypographyPanel","useGlobalSetting","useSettingsForBlockElement","blockEditorPrivateApis","ContextMenu","name","parentMenu","rawSettings","settings","hasTypographyPanel","hasColorPanel","hasBorderPanel","hasEffectsPanel","hasFilterPanel","hasDimensionsPanel","hasLayoutPanel","hasVariationsPanel","canEditCSS","select","getEntityRecord","__experimentalGetCurrentGlobalStylesId","coreStore","globalStylesId","globalStyles","undefined","_links","isBlocksPanel","includes","typography","color","border","shadow","filter","layout","chevronLeft","chevronRight"],"mappings":";;;;;;;;;AAGA;;AAQA;;AAUA;;AACA;;AACA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;~~AACA;;AACA;;AArCA~~;AACA;AACA;;AAwBA;AACA;AACA;~~AAWA~~,MAAM;AACLA,EAAAA,qBADK;AAELC,EAAAA,qBAFK;AAGLC,EAAAA,~~gBAHK~~;AAILC,EAAAA;~~AAJK~~,~~IAKF~~,yBAAQC,wBAAR,~~CALJ~~;;~~AAOA~~,SAASC,WAAT,OAAkD;AAAA,MAA5B;AAAEC,IAAAA,IAAF;AAAQC,IAAAA,UAAU,GAAG;AAArB,GAA4B;AACjD,QAAM,CAAEC,WAAF,IAAkBN,gBAAgB,CAAE,EAAF,EAAMI,IAAN,CAAxC;AACA,QAAMG,QAAQ,GAAGN,0BAA0B,CAAEK,WAAF,EAAeF,IAAf,CAA3C;AACA,QAAMI,kBAAkB,~~GAAGT~~,qBAAqB,~~CAAEQ~~,QAAF,CAAhD;AACA,QAAME,aAAa,~~GAAG~~,~~kCAAkBL~~,~~IAAlB~~,~~CAAtB~~;AACA,~~QAAMM~~,cAAc,~~GAAG~~,~~oCAAmBN~~,~~IAAnB~~,~~CAAvB~~;AACA,~~QAAMO~~,eAAe,GAAG,sCAAqBP,IAArB,CAAxB;AACA,QAAMQ,cAAc,GAAG,oCAAmBR,IAAnB,CAAvB;AACA,QAAMS,kBAAkB,~~GAAGf~~,qBAAqB,~~CAAES~~,QAAF,CAAhD;AACA,QAAMO,cAAc,GAAGD,kBAAvB;AACA,QAAME,kBAAkB,GAAG,4CAAuBX,IAAvB,EAA6BC,UAA7B,CAA3B;AAEA,QAAM;AAAEW,IAAAA;AAAF,MAAiB,qBAAaC,MAAF,IAAc;AAAA;;AAC/C,UAAM;AAAEC,MAAAA,eAAF;AAAmBC,MAAAA;AAAnB,QACLF,MAAM,CAAEG,eAAF,CADP;;AAGA,UAAMC,cAAc,GAAGF,sCAAsC,EAA7D;;AACA,UAAMG,YAAY,GAAGD,cAAc,GAChCH,eAAe,CAAE,MAAF,EAAU,cAAV,EAA0BG,cAA1B,CADiB,GAEhCE,SAFH;AAIA,WAAO;AACNP,MAAAA,UAAU,2BACT,CAAC,EAAEM,YAAF,aAAEA,YAAF,uCAAEA,YAAY,CAAEE,MAAhB,iDAAE,qBAAwB,oBAAxB,CAAF,CADQ,yEAC4C;AAFhD,KAAP;AAIA,GAbsB,EAapB,EAboB,CAAvB;AAeA,QAAMC,aAAa,GAClBpB,UAAU,CAACqB,QAAX,CAAqB,QAArB,KACA,CAAErB,UAAU,CAACqB,QAAX,CAAqB,YAArB,CAFH;AAIA,SACC,qDACC,4BAAC,mCAAD,QACGlB,kBAAkB,IACnB,4BAAC,wCAAD;AACC,IAAA,IAAI,EAAGmB,iBADR;AAEC,IAAA,IAAI,EAAGtB,UAAU,GAAG,aAFrB;AAGC,kBAAa,cAAI,mBAAJ;AAHd,KAKG,cAAI,YAAJ,CALH,CAFF,EAUGI,aAAa,IACd,4BAAC,wCAAD;AACC,IAAA,IAAI,EAAGmB,YADR;AAEC,IAAA,IAAI,EAAGvB,UAAU,GAAG,SAFrB;AAGC,kBAAa,cAAI,eAAJ;AAHd,KAKG,cAAI,QAAJ,CALH,CAXF,EAmBGK,cAAc,IACf,4BAAC,wCAAD;AACC,IAAA,IAAI,EAAGmB,aADR;AAEC,IAAA,IAAI,EAAGxB,UAAU,GAAG,SAFrB;AAGC,kBAAa,cAAI,QAAJ;AAHd,KAKG,cAAI,QAAJ,CALH,CApBF,EA4BGM,eAAe,IAChB,4BAAC,wCAAD;AACC,IAAA,IAAI,EAAGmB,aADR;AAEC,IAAA,IAAI,EAAGzB,UAAU,GAAG,UAFrB;AAGC,kBAAa,cAAI,QAAJ;AAHd,KAKG,cAAI,QAAJ,CALH,CA7BF,EAqCGO,cAAc,IACf,4BAAC,wCAAD;AACC,IAAA,IAAI,EAAGmB,aADR;AAEC,IAAA,IAAI,EAAG1B,UAAU,GAAG,UAFrB;AAGC,kBAAa,cAAI,gBAAJ;AAHd,KAKG,cAAI,SAAJ,CALH,CAtCF,EA8CGS,cAAc,IACf,4BAAC,wCAAD;AACC,IAAA,IAAI,EAAGkB,aADR;AAEC,IAAA,IAAI,EAAG3B,UAAU,GAAG,SAFrB;AAGC,kBAAa,cAAI,eAAJ;AAHd,KAKG,cAAI,QAAJ,CALH,CA/CF,EAuDGU,kBAAkB,IACnB,4BAAC,kCAAD;AAAkB,IAAA,IAAI,EAAGX,IAAzB;AAAgC,IAAA,IAAI,EAAGC;AAAvC,IAxDF,EA0DGoB,aAAa,IAAIT,UAAjB,IACD,qDACC,4BAAC,uBAAD,OADD,EAEC,4BAAC,oBAAD,QACC,4BAAC,gCAAD;AAAQ,IAAA,EAAE,EAAC,GAAX;AAAe,IAAA,UAAU,EAAG,CAA5B;AAAgC,IAAA,YAAY,EAAG;AAA/C,KACG,cACD,qDADC,CADH,CADD,EAMC,4BAAC,mCAAD,QACC,4BAAC,wCAAD;AACC,IAAA,IAAI,EAAGX,UAAU,GAAG,MADrB;AAEC,kBAAa,cAAI,sBAAJ;AAFd,KAIC,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAC;AAAhB,KACC,4BAAC,oBAAD,QACG,cAAI,sBAAJ,CADH,CADD,EAIC,4BAAC,0CAAD;AACC,IAAA,IAAI,EACH,qBACG4B,kBADH,GAEGC;AAJL,IAJD,CAJD,CADD,CAND,CAFD,EA4BC,4BAAC,uBAAD,OA5BD,CA3DF,CADD,CADD;AA+FA;;eAEc/B,W","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalHStack as HStack,\n\t__experimentalSpacer as Spacer,\n\tFlexItem,\n\tCardBody,\n\tCardDivider,\n} from '@wordpress/components';\nimport {\n\ttypography,\n\tborder,\n\tfilter,\n\tshadow,\n\tcolor,\n\tlayout,\n\tchevronLeft,\n\tchevronRight,\n} from '@wordpress/icons';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n */\nimport { ~~useHasBorderPanel } from './border-panel';\nimport { useHasColorPanel } from './color-utils';\nimport {~~ useHasFilterPanel } from './filter-utils';\nimport { useHasVariationsPanel } from './variations-panel';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { IconWithCurrentColor } from './icon-with-current-color';\nimport { ScreenVariations } from './screen-variations';\nimport { useHasShadowControl } from './shadow-panel';\nimport { unlock } from '../../private-apis';\n\nconst {\n\tuseHasDimensionsPanel,\n\tuseHasTypographyPanel,\n\tuseGlobalSetting,\n\tuseSettingsForBlockElement,\n} = unlock( blockEditorPrivateApis );\n\nfunction ContextMenu( { name, parentMenu = '' } ) {\n\tconst [ rawSettings ] = useGlobalSetting( '', name );\n\tconst settings = useSettingsForBlockElement( rawSettings, name );\n\tconst hasTypographyPanel = useHasTypographyPanel( settings );\n\tconst hasColorPanel = useHasColorPanel( ~~name~~ );\n\tconst hasBorderPanel = useHasBorderPanel( ~~name~~ );\n\tconst hasEffectsPanel = useHasShadowControl( name );\n\tconst hasFilterPanel = useHasFilterPanel( name );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( settings );\n\tconst hasLayoutPanel = hasDimensionsPanel;\n\tconst hasVariationsPanel = useHasVariationsPanel( name, parentMenu );\n\n\tconst { canEditCSS } = useSelect( ( select ) => {\n\t\tconst { getEntityRecord, __experimentalGetCurrentGlobalStylesId } =\n\t\t\tselect( coreStore );\n\n\t\tconst globalStylesId = __experimentalGetCurrentGlobalStylesId();\n\t\tconst globalStyles = globalStylesId\n\t\t\t? getEntityRecord( 'root', 'globalStyles', globalStylesId )\n\t\t\t: undefined;\n\n\t\treturn {\n\t\t\tcanEditCSS:\n\t\t\t\t!! globalStyles?._links?.[ 'wp:action-edit-css' ] ?? false,\n\t\t};\n\t}, [] );\n\n\tconst isBlocksPanel =\n\t\tparentMenu.includes( 'blocks' ) &&\n\t\t! parentMenu.includes( 'variations' );\n\n\treturn (\n\t\t<>\n\t\t\t<ItemGroup>\n\t\t\t\t{ hasTypographyPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ typography }\n\t\t\t\t\t\tpath={ parentMenu + '/typography' }\n\t\t\t\t\t\taria-label={ __( 'Typography styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Typography' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasColorPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ color }\n\t\t\t\t\t\tpath={ parentMenu + '/colors' }\n\t\t\t\t\t\taria-label={ __( 'Colors styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Colors' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasBorderPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ border }\n\t\t\t\t\t\tpath={ parentMenu + '/border' }\n\t\t\t\t\t\taria-label={ __( 'Border' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Border' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasEffectsPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ shadow }\n\t\t\t\t\t\tpath={ parentMenu + '/effects' }\n\t\t\t\t\t\taria-label={ __( 'Shadow' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Shadow' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasFilterPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ filter }\n\t\t\t\t\t\tpath={ parentMenu + '/filters' }\n\t\t\t\t\t\taria-label={ __( 'Filters styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Filters' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasLayoutPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ layout }\n\t\t\t\t\t\tpath={ parentMenu + '/layout' }\n\t\t\t\t\t\taria-label={ __( 'Layout styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Layout' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasVariationsPanel && (\n\t\t\t\t\t<ScreenVariations name={ name } path={ parentMenu } />\n\t\t\t\t) }\n\t\t\t\t{ isBlocksPanel && canEditCSS && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<CardDivider />\n\t\t\t\t\t\t<CardBody>\n\t\t\t\t\t\t\t<Spacer as=\"p\" paddingTop={ 2 } marginBottom={ 4 }>\n\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t'Add your own CSS to customize the block appearance.'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t\t\t<ItemGroup>\n\t\t\t\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\t\t\t\tpath={ parentMenu + '/css' }\n\t\t\t\t\t\t\t\t\taria-label={ __( 'Additional block CSS' ) }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<HStack justify=\"space-between\">\n\t\t\t\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t\t\t\t{ __( 'Additional block CSS' ) }\n\t\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t\t<IconWithCurrentColor\n\t\t\t\t\t\t\t\t\t\t\ticon={\n\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? chevronLeft\n\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}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t\t</CardBody>\n\t\t\t\t\t\t<CardDivider />\n\t\t\t\t\t</>\n\t\t\t\t) }\n\t\t\t</ItemGroup>\n\t\t</>\n\t);\n}\n\nexport default ContextMenu;\n"]}
1	+ {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/context-menu.js"],"names":["useHasDimensionsPanel","useHasTypographyPanel","useHasBorderPanel","useHasColorPanel","useGlobalSetting","useSettingsForBlockElement","blockEditorPrivateApis","ContextMenu","name","parentMenu","rawSettings","settings","hasTypographyPanel","hasColorPanel","hasBorderPanel","hasEffectsPanel","hasFilterPanel","hasDimensionsPanel","hasLayoutPanel","hasVariationsPanel","canEditCSS","select","getEntityRecord","__experimentalGetCurrentGlobalStylesId","coreStore","globalStylesId","globalStyles","undefined","_links","isBlocksPanel","includes","typography","color","border","shadow","filter","layout","chevronLeft","chevronRight"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalHStack as HStack,\n\t__experimentalSpacer as Spacer,\n\tFlexItem,\n\tCardBody,\n\tCardDivider,\n} from '@wordpress/components';\nimport {\n\ttypography,\n\tborder,\n\tfilter,\n\tshadow,\n\tcolor,\n\tlayout,\n\tchevronLeft,\n\tchevronRight,\n} from '@wordpress/icons';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n */\nimport { useHasFilterPanel } from './filter-utils';\nimport { useHasVariationsPanel } from './variations-panel';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { IconWithCurrentColor } from './icon-with-current-color';\nimport { ScreenVariations } from './screen-variations';\nimport { useHasShadowControl } from './shadow-panel';\nimport { unlock } from '../../private-apis';\n\nconst {\n\tuseHasDimensionsPanel,\n\tuseHasTypographyPanel,\n\tuseHasBorderPanel,\n\tuseHasColorPanel,\n\tuseGlobalSetting,\n\tuseSettingsForBlockElement,\n} = unlock( blockEditorPrivateApis );\n\nfunction ContextMenu( { name, parentMenu = '' } ) {\n\tconst [ rawSettings ] = useGlobalSetting( '', name );\n\tconst settings = useSettingsForBlockElement( rawSettings, name );\n\tconst hasTypographyPanel = useHasTypographyPanel( settings );\n\tconst hasColorPanel = useHasColorPanel( settings );\n\tconst hasBorderPanel = useHasBorderPanel( settings );\n\tconst hasEffectsPanel = useHasShadowControl( name );\n\tconst hasFilterPanel = useHasFilterPanel( name );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( settings );\n\tconst hasLayoutPanel = hasDimensionsPanel;\n\tconst hasVariationsPanel = useHasVariationsPanel( name, parentMenu );\n\n\tconst { canEditCSS } = useSelect( ( select ) => {\n\t\tconst { getEntityRecord, __experimentalGetCurrentGlobalStylesId } =\n\t\t\tselect( coreStore );\n\n\t\tconst globalStylesId = __experimentalGetCurrentGlobalStylesId();\n\t\tconst globalStyles = globalStylesId\n\t\t\t? getEntityRecord( 'root', 'globalStyles', globalStylesId )\n\t\t\t: undefined;\n\n\t\treturn {\n\t\t\tcanEditCSS:\n\t\t\t\t!! globalStyles?._links?.[ 'wp:action-edit-css' ] ?? false,\n\t\t};\n\t}, [] );\n\n\tconst isBlocksPanel =\n\t\tparentMenu.includes( 'blocks' ) &&\n\t\t! parentMenu.includes( 'variations' );\n\n\treturn (\n\t\t<>\n\t\t\t<ItemGroup>\n\t\t\t\t{ hasTypographyPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ typography }\n\t\t\t\t\t\tpath={ parentMenu + '/typography' }\n\t\t\t\t\t\taria-label={ __( 'Typography styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Typography' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasColorPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ color }\n\t\t\t\t\t\tpath={ parentMenu + '/colors' }\n\t\t\t\t\t\taria-label={ __( 'Colors styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Colors' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasBorderPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ border }\n\t\t\t\t\t\tpath={ parentMenu + '/border' }\n\t\t\t\t\t\taria-label={ __( 'Border' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Border' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasEffectsPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ shadow }\n\t\t\t\t\t\tpath={ parentMenu + '/effects' }\n\t\t\t\t\t\taria-label={ __( 'Shadow' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Shadow' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasFilterPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ filter }\n\t\t\t\t\t\tpath={ parentMenu + '/filters' }\n\t\t\t\t\t\taria-label={ __( 'Filters styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Filters' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasLayoutPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ layout }\n\t\t\t\t\t\tpath={ parentMenu + '/layout' }\n\t\t\t\t\t\taria-label={ __( 'Layout styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Layout' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasVariationsPanel && (\n\t\t\t\t\t<ScreenVariations name={ name } path={ parentMenu } />\n\t\t\t\t) }\n\t\t\t\t{ isBlocksPanel && canEditCSS && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<CardDivider />\n\t\t\t\t\t\t<CardBody>\n\t\t\t\t\t\t\t<Spacer as=\"p\" paddingTop={ 2 } marginBottom={ 4 }>\n\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t'Add your own CSS to customize the block appearance.'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t\t\t<ItemGroup>\n\t\t\t\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\t\t\t\tpath={ parentMenu + '/css' }\n\t\t\t\t\t\t\t\t\taria-label={ __( 'Additional block CSS' ) }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<HStack justify=\"space-between\">\n\t\t\t\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t\t\t\t{ __( 'Additional block CSS' ) }\n\t\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t\t<IconWithCurrentColor\n\t\t\t\t\t\t\t\t\t\t\ticon={\n\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? chevronLeft\n\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}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t\t</CardBody>\n\t\t\t\t\t\t<CardDivider />\n\t\t\t\t\t</>\n\t\t\t\t) }\n\t\t\t</ItemGroup>\n\t\t</>\n\t);\n}\n\nexport default ContextMenu;\n"]}

package/build/components/global-styles/hooks.js CHANGED Viewed

@@ -6,18 +6,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useColorRandomizer = useColorRandomizer;
-exports.useColorsPerOrigin = useColorsPerOrigin;
-exports.useGradientsPerOrigin = useGradientsPerOrigin;
 exports.useSupportedStyles = useSupportedStyles;
 var _colord = require("colord");
 var _a11y = _interopRequireDefault(require("colord/plugins/a11y"));
-var _i18n = require("@wordpress/i18n");
-var _element = require("@wordpress/element");
 var _blocks = require("@wordpress/blocks");
 var _blockEditor = require("@wordpress/block-editor");
@@ -43,72 +37,6 @@ const {
 (0, _colord.extend)([_a11y.default]);
-function useColorsPerOrigin(name) {
-  const [customColors] = useGlobalSetting('color.palette.custom', name);
-  const [themeColors] = useGlobalSetting('color.palette.theme', name);
-  const [defaultColors] = useGlobalSetting('color.palette.default', name);
-  const [shouldDisplayDefaultColors] = useGlobalSetting('color.defaultPalette');
-  return (0, _element.useMemo)(() => {
-    const result = [];
-    if (themeColors && themeColors.length) {
-      result.push({
-        name: (0, _i18n._x)('Theme', 'Indicates this palette comes from the theme.'),
-        colors: themeColors
-      });
-    }
-    if (shouldDisplayDefaultColors && defaultColors && defaultColors.length) {
-      result.push({
-        name: (0, _i18n._x)('Default', 'Indicates this palette comes from WordPress.'),
-        colors: defaultColors
-      });
-    }
-    if (customColors && customColors.length) {
-      result.push({
-        name: (0, _i18n._x)('Custom', 'Indicates this palette is created by the user.'),
-        colors: customColors
-      });
-    }
-    return result;
-  }, [customColors, themeColors, defaultColors]);
-}
-function useGradientsPerOrigin(name) {
-  const [customGradients] = useGlobalSetting('color.gradients.custom', name);
-  const [themeGradients] = useGlobalSetting('color.gradients.theme', name);
-  const [defaultGradients] = useGlobalSetting('color.gradients.default', name);
-  const [shouldDisplayDefaultGradients] = useGlobalSetting('color.defaultGradients');
-  return (0, _element.useMemo)(() => {
-    const result = [];
-    if (themeGradients && themeGradients.length) {
-      result.push({
-        name: (0, _i18n._x)('Theme', 'Indicates this palette comes from the theme.'),
-        gradients: themeGradients
-      });
-    }
-    if (shouldDisplayDefaultGradients && defaultGradients && defaultGradients.length) {
-      result.push({
-        name: (0, _i18n._x)('Default', 'Indicates this palette comes from WordPress.'),
-        gradients: defaultGradients
-      });
-    }
-    if (customGradients && customGradients.length) {
-      result.push({
-        name: (0, _i18n._x)('Custom', 'Indicates this palette is created by the user.'),
-        gradients: customGradients
-      });
-    }
-    return result;
-  }, [customGradients, themeGradients, defaultGradients]);
-}
 function useColorRandomizer(name) {
   const [themeColors, setThemeColors] = useGlobalSetting('color.palette.theme', name);

package/build/components/global-styles/hooks.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/hooks.js"],"names":["useGlobalSetting","blockEditorPrivateApis","a11yPlugin","~~useColorsPerOrigin~~","name","~~customColors","~~themeColors","defaultColors","shouldDisplayDefaultColors","result","length","push","colors","useGradientsPerOrigin","customGradients","themeGradients","defaultGradients","shouldDisplayDefaultGradients","gradients","useColorRandomizer","setThemeColors","randomizeColors","randomRotationValue","Math","floor","random","newColors","map","colorObject","color","newColor","rotate","toHex","window","__experimentalEnableColorRandomizer","useSupportedStyles","element","supportedPanels","select","blocksStore","getSupportedStyles"],"mappings":"~~;;;;;;;;;;;;~~AAGA;;AACA;;AAKA;;AACA;;~~AACA;;AACA;;~~AAKA;;AACA;;~~AAlBA~~;AACA;AACA;;AAIA;AACA;AACA;;~~AAMA~~;AACA;AACA;AAIA,MAAM;AAAEA,EAAAA;AAAF,IAAuB,yBAAQC,wBAAR,CAA7B,C,CAEA;;AACA,oBAAQ,CAAEC,aAAF,CAAR;;AAEO,SAASC,kBAAT,CAA6BC,IAA7B,EAAoC;AAC1C,QAAM,CAAEC,~~YAAF,IAAmBL,gBAAgB,CAAE,sBAAF,EAA0BI,IAA1B,CAAzC;AACA,QAAM,CAAEE,~~WAAF,~~IAAkBN~~,gBAAgB,CAAE,qBAAF,EAAyBI,IAAzB,CAAxC;AACA,QAAM,CAAEG,aAAF,IAAoBP,gBAAgB,CAAE,uBAAF,EAA2BI,IAA3B,CAA1C;AACA,QAAM,CAAEI,0BAAF,IAAiCR,gBAAgB,CACtD,sBADsD,CAAvD;AAIA,SAAO,sBAAS,MAAM;AACrB,UAAMS,MAAM,GAAG,EAAf;;AACA,QAAKH,WAAW,IAAIA,WAAW,CAACI,MAAhC,EAAyC;AACxCD,MAAAA,MAAM,CAACE,IAAP,CAAa;AACZP,QAAAA,IAAI,EAAE,cACL,OADK,EAEL,8CAFK,CADM;AAKZQ,QAAAA,MAAM,EAAEN;AALI,OAAb;AAOA;;AACD,QACCE,0BAA0B,IAC1BD,aADA,IAEAA,aAAa,CAACG,MAHf,EAIE;AACDD,MAAAA,MAAM,CAACE,IAAP,CAAa;AACZP,QAAAA,IAAI,EAAE,cACL,SADK,EAEL,8CAFK,CADM;AAKZQ,QAAAA,MAAM,EAAEL;AALI,OAAb;AAOA;;AACD,QAAKF,YAAY,IAAIA,YAAY,CAACK,MAAlC,EAA2C;AAC1CD,MAAAA,MAAM,CAACE,IAAP,CAAa;AACZP,QAAAA,IAAI,EAAE,cACL,QADK,EAEL,gDAFK,CADM;AAKZQ,QAAAA,MAAM,EAAEP;AALI,OAAb;AAOA;;AACD,WAAOI,MAAP;AACA,GAlCM,EAkCJ,CAAEJ,YAAF,EAAgBC,WAAhB,EAA6BC,aAA7B,CAlCI,CAAP;AAmCA;;AAEM,SAASM,qBAAT,CAAgCT,IAAhC,EAAuC;AAC7C,QAAM,CAAEU,eAAF,IAAsBd,gBAAgB,CAC3C,wBAD2C,EAE3CI,IAF2C,CAA5C;AAIA,QAAM,CAAEW,cAAF,IAAqBf,gBAAgB,CAC1C,uBAD0C,EAE1CI,IAF0C,CAA3C;AAIA,QAAM,CAAEY,gBAAF,IAAuBhB,gBAAgB,CAC5C,yBAD4C,EAE5CI,IAF4C,CAA7C;AAIA,QAAM,CAAEa,6BAAF,IAAoCjB,gBAAgB,CACzD,wBADyD,CAA1D;AAIA,SAAO,sBAAS,MAAM;AACrB,UAAMS,MAAM,GAAG,EAAf;;AACA,QAAKM,cAAc,IAAIA,cAAc,CAACL,MAAtC,EAA+C;AAC9CD,MAAAA,MAAM,CAACE,IAAP,CAAa;AACZP,QAAAA,IAAI,EAAE,cACL,OADK,EAEL,8CAFK,CADM;AAKZc,QAAAA,SAAS,EAAEH;AALC,OAAb;AAOA;;AACD,QACCE,6BAA6B,IAC7BD,gBADA,IAEAA,gBAAgB,CAACN,MAHlB,EAIE;AACDD,MAAAA,MAAM,CAACE,IAAP,CAAa;AACZP,QAAAA,IAAI,EAAE,cACL,SADK,EAEL,8CAFK,CADM;AAKZc,QAAAA,SAAS,EAAEF;AALC,OAAb;AAOA;;AACD,QAAKF,eAAe,IAAIA,eAAe,CAACJ,MAAxC,EAAiD;AAChDD,MAAAA,MAAM,CAACE,IAAP,CAAa;AACZP,QAAAA,IAAI,EAAE,cACL,QADK,EAEL,gDAFK,CADM;AAKZc,QAAAA,SAAS,EAAEJ;AALC,OAAb;AAOA;;AACD,WAAOL,MAAP;AACA,GAlCM,EAkCJ,CAAEK,eAAF,EAAmBC,cAAnB,EAAmCC,gBAAnC,CAlCI,CAAP;AAmCA;;AAEM,SAASG,kBAAT,CAA6Bf,IAA7B,EAAoC;AAC1C,QAAM,CAAEE,WAAF,EAAec,cAAf,~~IAAkCpB~~,gBAAgB,CACvD,qBADuD,EAEvDI,IAFuD,CAAxD;;AAKA,~~WAASiB~~,eAAT,GAA2B;AAC1B;AACA,UAAMC,mBAAmB,GAAGC,IAAI,CAACC,KAAL,CAAYD,IAAI,CAACE,MAAL,KAAgB,GAA5B,CAA5B;AACA;;AAEA,UAAMC,SAAS,~~GAAGpB~~,WAAW,~~CAACqB~~,GAAZ,CAAmBC,WAAF,IAAmB;AACrD,YAAM;AAAEC,QAAAA;AAAF,UAAYD,WAAlB;AACA,YAAME,QAAQ,GAAG,oBAAQD,KAAR,EACfE,MADe,CACPT,mBADO,EAEfU,KAFe,EAAjB;AAIA,aAAO,EACN,GAAGJ,WADG;AAENC,QAAAA,KAAK,EAAEC;AAFD,OAAP;AAIA,KAViB,CAAlB;AAYAV,IAAAA,cAAc,CAAEM,SAAF,CAAd;AACA;;AAED,SAAOO,MAAM,CAACC,mCAAP,GACJ,CAAEb,eAAF,CADI,GAEJ,EAFH;AAGA;;AAEM,SAASc,kBAAT,~~CAA6B/B~~,IAA7B,~~EAAmCgC~~,OAAnC,EAA6C;AACnD,QAAM;AAAEC,IAAAA;AAAF,MAAsB,qBACzBC,MAAF,IAAc;AACb,WAAO;AACND,MAAAA,eAAe,EAAE,yBAChBC,MAAM,CAAEC,aAAF,CADU,EAEfC,kBAFe,~~CAEKpC~~,IAFL,~~EAEWgC~~,OAFX;AADX,KAAP;AAKA,GAP0B,EAQ3B,~~CAAEhC~~,IAAF,~~EAAQgC~~,OAAR,CAR2B,CAA5B;AAWA,SAAOC,eAAP;AACA","sourcesContent":["/*\n External dependencies\n /\nimport { colord, extend } from 'colord';\nimport a11yPlugin from 'colord/plugins/a11y';\n\n/\n WordPress dependencies\n /\nimport { ~~_x } from '@wordpress/i18n';\nimport { useMemo } from '@wordpress/element';\nimport {~~ store as blocksStore } from '@wordpress/blocks';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n /\nimport { unlock } from '../../private-apis';\nimport { useSelect } from '@wordpress/data';\n\nconst { useGlobalSetting } = unlock( blockEditorPrivateApis );\n\n// Enable colord's a11y plugin.\nextend( [ a11yPlugin ] );\n\nexport function useColorsPerOrigin( name ) {\n\tconst [ customColors ] = useGlobalSetting( 'color.palette.custom', name );\n\tconst [ themeColors ] = useGlobalSetting( 'color.palette.theme', name );\n\tconst [ defaultColors ] = useGlobalSetting( 'color.palette.default', name );\n\tconst [ shouldDisplayDefaultColors ] = useGlobalSetting(\n\t\t'color.defaultPalette'\n\t);\n\n\treturn useMemo( () => {\n\t\tconst result = [];\n\t\tif ( themeColors && themeColors.length ) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Theme',\n\t\t\t\t\t'Indicates this palette comes from the theme.'\n\t\t\t\t),\n\t\t\t\tcolors: themeColors,\n\t\t\t} );\n\t\t}\n\t\tif (\n\t\t\tshouldDisplayDefaultColors &&\n\t\t\tdefaultColors &&\n\t\t\tdefaultColors.length\n\t\t) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Default',\n\t\t\t\t\t'Indicates this palette comes from WordPress.'\n\t\t\t\t),\n\t\t\t\tcolors: defaultColors,\n\t\t\t} );\n\t\t}\n\t\tif ( customColors && customColors.length ) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Custom',\n\t\t\t\t\t'Indicates this palette is created by the user.'\n\t\t\t\t),\n\t\t\t\tcolors: customColors,\n\t\t\t} );\n\t\t}\n\t\treturn result;\n\t}, [ customColors, themeColors, defaultColors ] );\n}\n\nexport function useGradientsPerOrigin( name ) {\n\tconst [ customGradients ] = useGlobalSetting(\n\t\t'color.gradients.custom',\n\t\tname\n\t);\n\tconst [ themeGradients ] = useGlobalSetting(\n\t\t'color.gradients.theme',\n\t\tname\n\t);\n\tconst [ defaultGradients ] = useGlobalSetting(\n\t\t'color.gradients.default',\n\t\tname\n\t);\n\tconst [ shouldDisplayDefaultGradients ] = useGlobalSetting(\n\t\t'color.defaultGradients'\n\t);\n\n\treturn useMemo( () => {\n\t\tconst result = [];\n\t\tif ( themeGradients && themeGradients.length ) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Theme',\n\t\t\t\t\t'Indicates this palette comes from the theme.'\n\t\t\t\t),\n\t\t\t\tgradients: themeGradients,\n\t\t\t} );\n\t\t}\n\t\tif (\n\t\t\tshouldDisplayDefaultGradients &&\n\t\t\tdefaultGradients &&\n\t\t\tdefaultGradients.length\n\t\t) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Default',\n\t\t\t\t\t'Indicates this palette comes from WordPress.'\n\t\t\t\t),\n\t\t\t\tgradients: defaultGradients,\n\t\t\t} );\n\t\t}\n\t\tif ( customGradients && customGradients.length ) {\n\t\t\tresult.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Custom',\n\t\t\t\t\t'Indicates this palette is created by the user.'\n\t\t\t\t),\n\t\t\t\tgradients: customGradients,\n\t\t\t} );\n\t\t}\n\t\treturn result;\n\t}, [ customGradients, themeGradients, defaultGradients ] );\n}\n\nexport function useColorRandomizer( name ) {\n\tconst [ themeColors, setThemeColors ] = useGlobalSetting(\n\t\t'color.palette.theme',\n\t\tname\n\t);\n\n\tfunction randomizeColors() {\n\t\t/ eslint-disable no-restricted-syntax /\n\t\tconst randomRotationValue = Math.floor( Math.random() 225 );\n\t\t/* eslint-enable no-restricted-syntax */\n\n\t\tconst newColors = themeColors.map( ( colorObject ) => {\n\t\t\tconst { color } = colorObject;\n\t\t\tconst newColor = colord( color )\n\t\t\t\t.rotate( randomRotationValue )\n\t\t\t\t.toHex();\n\n\t\t\treturn {\n\t\t\t\t...colorObject,\n\t\t\t\tcolor: newColor,\n\t\t\t};\n\t\t} );\n\n\t\tsetThemeColors( newColors );\n\t}\n\n\treturn window.__experimentalEnableColorRandomizer\n\t\t? [ randomizeColors ]\n\t\t: [];\n}\n\nexport function useSupportedStyles( name, element ) {\n\tconst { supportedPanels } = useSelect(\n\t\t( select ) => {\n\t\t\treturn {\n\t\t\t\tsupportedPanels: unlock(\n\t\t\t\t\tselect( blocksStore )\n\t\t\t\t).getSupportedStyles( name, element ),\n\t\t\t};\n\t\t},\n\t\t[ name, element ]\n\t);\n\n\treturn supportedPanels;\n}\n"]}
1	+ {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/hooks.js"],"names":["useGlobalSetting","blockEditorPrivateApis","a11yPlugin","useColorRandomizer","name","themeColors","setThemeColors","randomizeColors","randomRotationValue","Math","floor","random","newColors","map","colorObject","color","newColor","rotate","toHex","window","__experimentalEnableColorRandomizer","useSupportedStyles","element","supportedPanels","select","blocksStore","getSupportedStyles"],"mappings":";;;;;;;;;;AAGA;;AACA;;AAKA;;AACA;;AAKA;;AACA;;AAhBA;AACA;AACA;;AAIA;AACA;AACA;;AAIA;AACA;AACA;AAIA,MAAM;AAAEA,EAAAA;AAAF,IAAuB,yBAAQC,wBAAR,CAA7B,C,CAEA;;AACA,oBAAQ,CAAEC,aAAF,CAAR;;AAEO,SAASC,kBAAT,CAA6BC,IAA7B,EAAoC;AAC1C,QAAM,CAAEC,WAAF,EAAeC,cAAf,IAAkCN,gBAAgB,CACvD,qBADuD,EAEvDI,IAFuD,CAAxD;;AAKA,WAASG,eAAT,GAA2B;AAC1B;AACA,UAAMC,mBAAmB,GAAGC,IAAI,CAACC,KAAL,CAAYD,IAAI,CAACE,MAAL,KAAgB,GAA5B,CAA5B;AACA;;AAEA,UAAMC,SAAS,GAAGP,WAAW,CAACQ,GAAZ,CAAmBC,WAAF,IAAmB;AACrD,YAAM;AAAEC,QAAAA;AAAF,UAAYD,WAAlB;AACA,YAAME,QAAQ,GAAG,oBAAQD,KAAR,EACfE,MADe,CACPT,mBADO,EAEfU,KAFe,EAAjB;AAIA,aAAO,EACN,GAAGJ,WADG;AAENC,QAAAA,KAAK,EAAEC;AAFD,OAAP;AAIA,KAViB,CAAlB;AAYAV,IAAAA,cAAc,CAAEM,SAAF,CAAd;AACA;;AAED,SAAOO,MAAM,CAACC,mCAAP,GACJ,CAAEb,eAAF,CADI,GAEJ,EAFH;AAGA;;AAEM,SAASc,kBAAT,CAA6BjB,IAA7B,EAAmCkB,OAAnC,EAA6C;AACnD,QAAM;AAAEC,IAAAA;AAAF,MAAsB,qBACzBC,MAAF,IAAc;AACb,WAAO;AACND,MAAAA,eAAe,EAAE,yBAChBC,MAAM,CAAEC,aAAF,CADU,EAEfC,kBAFe,CAEKtB,IAFL,EAEWkB,OAFX;AADX,KAAP;AAKA,GAP0B,EAQ3B,CAAElB,IAAF,EAAQkB,OAAR,CAR2B,CAA5B;AAWA,SAAOC,eAAP;AACA","sourcesContent":["/*\n External dependencies\n /\nimport { colord, extend } from 'colord';\nimport a11yPlugin from 'colord/plugins/a11y';\n\n/\n WordPress dependencies\n /\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n /\nimport { unlock } from '../../private-apis';\nimport { useSelect } from '@wordpress/data';\n\nconst { useGlobalSetting } = unlock( blockEditorPrivateApis );\n\n// Enable colord's a11y plugin.\nextend( [ a11yPlugin ] );\n\nexport function useColorRandomizer( name ) {\n\tconst [ themeColors, setThemeColors ] = useGlobalSetting(\n\t\t'color.palette.theme',\n\t\tname\n\t);\n\n\tfunction randomizeColors() {\n\t\t/ eslint-disable no-restricted-syntax /\n\t\tconst randomRotationValue = Math.floor( Math.random() 225 );\n\t\t/* eslint-enable no-restricted-syntax */\n\n\t\tconst newColors = themeColors.map( ( colorObject ) => {\n\t\t\tconst { color } = colorObject;\n\t\t\tconst newColor = colord( color )\n\t\t\t\t.rotate( randomRotationValue )\n\t\t\t\t.toHex();\n\n\t\t\treturn {\n\t\t\t\t...colorObject,\n\t\t\t\tcolor: newColor,\n\t\t\t};\n\t\t} );\n\n\t\tsetThemeColors( newColors );\n\t}\n\n\treturn window.__experimentalEnableColorRandomizer\n\t\t? [ randomizeColors ]\n\t\t: [];\n}\n\nexport function useSupportedStyles( name, element ) {\n\tconst { supportedPanels } = useSelect(\n\t\t( select ) => {\n\t\t\treturn {\n\t\t\t\tsupportedPanels: unlock(\n\t\t\t\t\tselect( blocksStore )\n\t\t\t\t).getSupportedStyles( name, element ),\n\t\t\t};\n\t\t},\n\t\t[ name, element ]\n\t);\n\n\treturn supportedPanels;\n}\n"]}

package/build/components/global-styles/preview.js CHANGED Viewed

@@ -109,16 +109,15 @@ const StylesPreview = _ref => {
     }
   }, containerResizeListener), isReady && (0, _element.createElement)(_blockEditor.__unstableIframe, {
     className: "edit-site-global-styles-preview__iframe",
-    head: (0, _element.createElement)(_blockEditor.__unstableEditorStyles, {
-      styles: editorStyles
-    }),
     style: {
       height: normalizedHeight * ratio
     },
     onMouseEnter: () => setIsHovered(true),
     onMouseLeave: () => setIsHovered(false),
     tabIndex: -1
-  }, (0, _element.createElement)(_components.__unstableMotion.div, {
+  }, (0, _element.createElement)(_blockEditor.__unstableEditorStyles, {
+    styles: editorStyles
+  }), (0, _element.createElement)(_components.__unstableMotion.div, {
     style: {
       height: normalizedHeight * ratio,
       width: '100%',

package/build/components/global-styles/preview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/preview.js"],"names":["useGlobalSetting","useGlobalStyle","useGlobalStylesOutput","blockEditorPrivateApis","firstFrame","start","scale","opacity","hover","midFrame","secondFrame","normalizedWidth","normalizedHeight","normalizedColorSwatchSize","StylesPreview","label","isFocused","withHoverView","fontWeight","fontFamily","headingFontFamily","headingFontWeight","textColor","headingColor","backgroundColor","gradientValue","styles","disableMotion","coreColors","themeColors","customColors","isHovered","setIsHovered","containerResizeListener","width","ratio","paletteColors","concat","highlightedColors","filter","color","slice","editorStyles","css","isGlobalStyles","isReady","position","height","background","cursor","overflow","fontSize","delay","type","map","index","slug","borderRadius","top","flexGrow","padding","boxSizing","lineHeight","textAlign"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__unstableIframe as Iframe,\n\t__unstableEditorStyles as EditorStyles,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport {\n\t__unstableMotion as motion,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useReducedMotion, useResizeObserver } from '@wordpress/compose';\nimport { useState, useMemo } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting, useGlobalStyle, useGlobalStylesOutput } = unlock(\n\tblockEditorPrivateApis\n);\n\nconst firstFrame = {\n\tstart: {\n\t\tscale: 1,\n\t\topacity: 1,\n\t},\n\thover: {\n\t\tscale: 0,\n\t\topacity: 0,\n\t},\n};\n\nconst midFrame = {\n\thover: {\n\t\topacity: 1,\n\t},\n\tstart: {\n\t\topacity: 0.5,\n\t},\n};\n\nconst secondFrame = {\n\thover: {\n\t\tscale: 1,\n\t\topacity: 1,\n\t},\n\tstart: {\n\t\tscale: 0,\n\t\topacity: 0,\n\t},\n};\n\nconst normalizedWidth = 248;\nconst normalizedHeight = 152;\n\nconst normalizedColorSwatchSize = 32;\n\nconst StylesPreview = ( { label, isFocused, withHoverView } ) => {\n\tconst [ fontWeight ] = useGlobalStyle( 'typography.fontWeight' );\n\tconst [ fontFamily = 'serif' ] = useGlobalStyle( 'typography.fontFamily' );\n\tconst [ headingFontFamily = fontFamily ] = useGlobalStyle(\n\t\t'elements.h1.typography.fontFamily'\n\t);\n\tconst [ headingFontWeight = fontWeight ] = useGlobalStyle(\n\t\t'elements.h1.typography.fontWeight'\n\t);\n\tconst [ textColor = 'black' ] = useGlobalStyle( 'color.text' );\n\tconst [ headingColor = textColor ] = useGlobalStyle(\n\t\t'elements.h1.color.text'\n\t);\n\tconst [ backgroundColor = 'white' ] = useGlobalStyle( 'color.background' );\n\tconst [ gradientValue ] = useGlobalStyle( 'color.gradient' );\n\tconst [ styles ] = useGlobalStylesOutput();\n\tconst disableMotion = useReducedMotion();\n\tconst [ coreColors ] = useGlobalSetting( 'color.palette.core' );\n\tconst [ themeColors ] = useGlobalSetting( 'color.palette.theme' );\n\tconst [ customColors ] = useGlobalSetting( 'color.palette.custom' );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ containerResizeListener, { width } ] = useResizeObserver();\n\tconst ratio = width ? width / normalizedWidth : 1;\n\n\tconst paletteColors = ( themeColors ?? [] )\n\t\t.concat( customColors ?? [] )\n\t\t.concat( coreColors ?? [] );\n\tconst highlightedColors = paletteColors\n\t\t.filter(\n\t\t\t// we exclude these two colors because they are already visible in the preview.\n\t\t\t( { color } ) => color !== backgroundColor && color !== headingColor\n\t\t)\n\t\t.slice( 0, 2 );\n\n\t// Reset leaked styles from WP common.css and remove main content layout padding and border.\n\tconst editorStyles = useMemo( () => {\n\t\tif ( styles ) {\n\t\t\treturn [\n\t\t\t\t...styles,\n\t\t\t\t{\n\t\t\t\t\tcss: 'html{overflow:hidden}body{min-width: 0;padding: 0;border: none;}',\n\t\t\t\t\tisGlobalStyles: true,\n\t\t\t\t},\n\t\t\t];\n\t\t}\n\n\t\treturn styles;\n\t}, [ styles ] );\n\tconst isReady = !! width;\n\n\treturn (\n\t\t<>\n\t\t\t<div style={ { position: 'relative' } }>\n\t\t\t\t{ containerResizeListener }\n\t\t\t</div>\n\t\t\t{ isReady && (\n\t\t\t\t<Iframe\n\t\t\t\t\tclassName=\"edit-site-global-styles-preview__iframe\"\n\t\t\t\t\thead={ <EditorStyles styles={ editorStyles } /> }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: normalizedHeight ratio,\n\t\t\t\t\t} }\n\t\t\t\t\tonMouseEnter={ () => setIsHovered( true ) }\n\t\t\t\t\tonMouseLeave={ () => setIsHovered( false ) }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t>\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\theight: normalizedHeight * ratio,\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tbackground: gradientValue ?? backgroundColor,\n\t\t\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tinitial=\"start\"\n\t\t\t\t\t\tanimate={\n\t\t\t\t\t\t\t( isHovered \|\| isFocused ) &&\n\t\t\t\t\t\t\t! disableMotion &&\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t? 'hover'\n\t\t\t\t\t\t\t\t: 'start'\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tvariants={ firstFrame }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\tspacing={ 10 * ratio }\n\t\t\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\toverflow: 'hidden',\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<motion.div\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\tfontFamily: headingFontFamily,\n\t\t\t\t\t\t\t\t\t\tfontSize: 65 * ratio,\n\t\t\t\t\t\t\t\t\t\tcolor: headingColor,\n\t\t\t\t\t\t\t\t\t\tfontWeight: headingFontWeight,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tanimate={ { scale: 1, opacity: 1 } }\n\t\t\t\t\t\t\t\t\tinitial={ { scale: 0.1, opacity: 0 } }\n\t\t\t\t\t\t\t\t\ttransition={ { delay: 0.3, type: 'tween' } }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\tAa\n\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t<VStack spacing={ 4 * ratio }>\n\t\t\t\t\t\t\t\t\t{ highlightedColors.map(\n\t\t\t\t\t\t\t\t\t\t( { slug, color }, index ) => (\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\tkey={ slug }\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\theight:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnormalizedColorSwatchSize \n\t\t\t\t\t\t\t\t\t\t\t\t\t\tratio,\n\t\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\t\tnormalizedColorSwatchSize \n\t\t\t\t\t\t\t\t\t\t\t\t\t\tratio,\n\t\t\t\t\t\t\t\t\t\t\t\t\tbackground: color,\n\t\t\t\t\t\t\t\t\t\t\t\t\tborderRadius:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t( normalizedColorSwatchSize \n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tratio ) /\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t2,\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\tanimate={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\tscale: 1,\n\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 1,\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\tinitial={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\tscale: 0.1,\n\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 0,\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\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\tdelay:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex === 1 ? 0.2 : 0.1,\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) }\n\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tvariants={ withHoverView && midFrame }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\tfilter: 'blur(60px)',\n\t\t\t\t\t\t\t\topacity: 0.1,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\toverflow: 'hidden',\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{ paletteColors\n\t\t\t\t\t\t\t\t\t.slice( 0, 4 )\n\t\t\t\t\t\t\t\t\t.map( ( { color }, index ) => (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\t\t\t\tbackground: color,\n\t\t\t\t\t\t\t\t\t\t\t\tflexGrow: 1,\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</HStack>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tvariants={ secondFrame }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\t\tspacing={ 3 ratio }\n\t\t\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\t\tpadding: 10 * ratio,\n\t\t\t\t\t\t\t\t\tboxSizing: 'border-box',\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{ label && (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\tfontSize: 40 * ratio,\n\t\t\t\t\t\t\t\t\t\t\tfontFamily: headingFontFamily,\n\t\t\t\t\t\t\t\t\t\t\tcolor: headingColor,\n\t\t\t\t\t\t\t\t\t\t\tfontWeight: headingFontWeight,\n\t\t\t\t\t\t\t\t\t\t\tlineHeight: '1em',\n\t\t\t\t\t\t\t\t\t\t\ttextAlign: 'center',\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\t\t{ label }\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</VStack>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t</motion.div>\n\t\t\t\t</Iframe>\n\t\t\t) }\n\t\t</>\n\t);\n};\n\nexport default StylesPreview;\n"]}
1	+ {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/preview.js"],"names":["useGlobalSetting","useGlobalStyle","useGlobalStylesOutput","blockEditorPrivateApis","firstFrame","start","scale","opacity","hover","midFrame","secondFrame","normalizedWidth","normalizedHeight","normalizedColorSwatchSize","StylesPreview","label","isFocused","withHoverView","fontWeight","fontFamily","headingFontFamily","headingFontWeight","textColor","headingColor","backgroundColor","gradientValue","styles","disableMotion","coreColors","themeColors","customColors","isHovered","setIsHovered","containerResizeListener","width","ratio","paletteColors","concat","highlightedColors","filter","color","slice","editorStyles","css","isGlobalStyles","isReady","position","height","background","cursor","overflow","fontSize","delay","type","map","index","slug","borderRadius","top","flexGrow","padding","boxSizing","lineHeight","textAlign"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__unstableIframe as Iframe,\n\t__unstableEditorStyles as EditorStyles,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport {\n\t__unstableMotion as motion,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useReducedMotion, useResizeObserver } from '@wordpress/compose';\nimport { useState, useMemo } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting, useGlobalStyle, useGlobalStylesOutput } = unlock(\n\tblockEditorPrivateApis\n);\n\nconst firstFrame = {\n\tstart: {\n\t\tscale: 1,\n\t\topacity: 1,\n\t},\n\thover: {\n\t\tscale: 0,\n\t\topacity: 0,\n\t},\n};\n\nconst midFrame = {\n\thover: {\n\t\topacity: 1,\n\t},\n\tstart: {\n\t\topacity: 0.5,\n\t},\n};\n\nconst secondFrame = {\n\thover: {\n\t\tscale: 1,\n\t\topacity: 1,\n\t},\n\tstart: {\n\t\tscale: 0,\n\t\topacity: 0,\n\t},\n};\n\nconst normalizedWidth = 248;\nconst normalizedHeight = 152;\n\nconst normalizedColorSwatchSize = 32;\n\nconst StylesPreview = ( { label, isFocused, withHoverView } ) => {\n\tconst [ fontWeight ] = useGlobalStyle( 'typography.fontWeight' );\n\tconst [ fontFamily = 'serif' ] = useGlobalStyle( 'typography.fontFamily' );\n\tconst [ headingFontFamily = fontFamily ] = useGlobalStyle(\n\t\t'elements.h1.typography.fontFamily'\n\t);\n\tconst [ headingFontWeight = fontWeight ] = useGlobalStyle(\n\t\t'elements.h1.typography.fontWeight'\n\t);\n\tconst [ textColor = 'black' ] = useGlobalStyle( 'color.text' );\n\tconst [ headingColor = textColor ] = useGlobalStyle(\n\t\t'elements.h1.color.text'\n\t);\n\tconst [ backgroundColor = 'white' ] = useGlobalStyle( 'color.background' );\n\tconst [ gradientValue ] = useGlobalStyle( 'color.gradient' );\n\tconst [ styles ] = useGlobalStylesOutput();\n\tconst disableMotion = useReducedMotion();\n\tconst [ coreColors ] = useGlobalSetting( 'color.palette.core' );\n\tconst [ themeColors ] = useGlobalSetting( 'color.palette.theme' );\n\tconst [ customColors ] = useGlobalSetting( 'color.palette.custom' );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ containerResizeListener, { width } ] = useResizeObserver();\n\tconst ratio = width ? width / normalizedWidth : 1;\n\n\tconst paletteColors = ( themeColors ?? [] )\n\t\t.concat( customColors ?? [] )\n\t\t.concat( coreColors ?? [] );\n\tconst highlightedColors = paletteColors\n\t\t.filter(\n\t\t\t// we exclude these two colors because they are already visible in the preview.\n\t\t\t( { color } ) => color !== backgroundColor && color !== headingColor\n\t\t)\n\t\t.slice( 0, 2 );\n\n\t// Reset leaked styles from WP common.css and remove main content layout padding and border.\n\tconst editorStyles = useMemo( () => {\n\t\tif ( styles ) {\n\t\t\treturn [\n\t\t\t\t...styles,\n\t\t\t\t{\n\t\t\t\t\tcss: 'html{overflow:hidden}body{min-width: 0;padding: 0;border: none;}',\n\t\t\t\t\tisGlobalStyles: true,\n\t\t\t\t},\n\t\t\t];\n\t\t}\n\n\t\treturn styles;\n\t}, [ styles ] );\n\tconst isReady = !! width;\n\n\treturn (\n\t\t<>\n\t\t\t<div style={ { position: 'relative' } }>\n\t\t\t\t{ containerResizeListener }\n\t\t\t</div>\n\t\t\t{ isReady && (\n\t\t\t\t<Iframe\n\t\t\t\t\tclassName=\"edit-site-global-styles-preview__iframe\"\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: normalizedHeight ratio,\n\t\t\t\t\t} }\n\t\t\t\t\tonMouseEnter={ () => setIsHovered( true ) }\n\t\t\t\t\tonMouseLeave={ () => setIsHovered( false ) }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t>\n\t\t\t\t\t<EditorStyles styles={ editorStyles } />\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\theight: normalizedHeight * ratio,\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tbackground: gradientValue ?? backgroundColor,\n\t\t\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tinitial=\"start\"\n\t\t\t\t\t\tanimate={\n\t\t\t\t\t\t\t( isHovered \|\| isFocused ) &&\n\t\t\t\t\t\t\t! disableMotion &&\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t? 'hover'\n\t\t\t\t\t\t\t\t: 'start'\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tvariants={ firstFrame }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\tspacing={ 10 * ratio }\n\t\t\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\toverflow: 'hidden',\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<motion.div\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\tfontFamily: headingFontFamily,\n\t\t\t\t\t\t\t\t\t\tfontSize: 65 * ratio,\n\t\t\t\t\t\t\t\t\t\tcolor: headingColor,\n\t\t\t\t\t\t\t\t\t\tfontWeight: headingFontWeight,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tanimate={ { scale: 1, opacity: 1 } }\n\t\t\t\t\t\t\t\t\tinitial={ { scale: 0.1, opacity: 0 } }\n\t\t\t\t\t\t\t\t\ttransition={ { delay: 0.3, type: 'tween' } }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\tAa\n\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t<VStack spacing={ 4 * ratio }>\n\t\t\t\t\t\t\t\t\t{ highlightedColors.map(\n\t\t\t\t\t\t\t\t\t\t( { slug, color }, index ) => (\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\tkey={ slug }\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\theight:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnormalizedColorSwatchSize \n\t\t\t\t\t\t\t\t\t\t\t\t\t\tratio,\n\t\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\t\tnormalizedColorSwatchSize \n\t\t\t\t\t\t\t\t\t\t\t\t\t\tratio,\n\t\t\t\t\t\t\t\t\t\t\t\t\tbackground: color,\n\t\t\t\t\t\t\t\t\t\t\t\t\tborderRadius:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t( normalizedColorSwatchSize \n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tratio ) /\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t2,\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\tanimate={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\tscale: 1,\n\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 1,\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\tinitial={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\tscale: 0.1,\n\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 0,\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\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\tdelay:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex === 1 ? 0.2 : 0.1,\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) }\n\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tvariants={ withHoverView && midFrame }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\tfilter: 'blur(60px)',\n\t\t\t\t\t\t\t\topacity: 0.1,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\toverflow: 'hidden',\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{ paletteColors\n\t\t\t\t\t\t\t\t\t.slice( 0, 4 )\n\t\t\t\t\t\t\t\t\t.map( ( { color }, index ) => (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\t\t\t\tbackground: color,\n\t\t\t\t\t\t\t\t\t\t\t\tflexGrow: 1,\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</HStack>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tvariants={ secondFrame }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\t\tspacing={ 3 ratio }\n\t\t\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\t\tpadding: 10 * ratio,\n\t\t\t\t\t\t\t\t\tboxSizing: 'border-box',\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{ label && (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\tfontSize: 40 * ratio,\n\t\t\t\t\t\t\t\t\t\t\tfontFamily: headingFontFamily,\n\t\t\t\t\t\t\t\t\t\t\tcolor: headingColor,\n\t\t\t\t\t\t\t\t\t\t\tfontWeight: headingFontWeight,\n\t\t\t\t\t\t\t\t\t\t\tlineHeight: '1em',\n\t\t\t\t\t\t\t\t\t\t\ttextAlign: 'center',\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\t\t{ label }\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</VStack>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t</motion.div>\n\t\t\t\t</Iframe>\n\t\t\t) }\n\t\t</>\n\t);\n};\n\nexport default StylesPreview;\n"]}