@wordpress/editor 14.33.3-next.36001005c.0 → 14.34.0

package/build/components/editor-interface/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/editor-interface/index.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { InterfaceSkeleton, ComplementaryArea } from '@wordpress/interface';\nimport { useSelect } from '@wordpress/data';\nimport { __, _x } from '@wordpress/i18n';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { BlockBreadcrumb, BlockToolbar } from '@wordpress/block-editor';\nimport { useViewportMatch } from '@wordpress/compose';\nimport { useState, useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as editorStore } from '../../store';\nimport EditorNotices from '../editor-notices';\nimport Header from '../header';\nimport InserterSidebar from '../inserter-sidebar';\nimport ListViewSidebar from '../list-view-sidebar';\nimport SavePublishPanels from '../save-publish-panels';\nimport TextEditor from '../text-editor';\nimport VisualEditor from '../visual-editor';\nimport EditorContentSlotFill from './content-slot-fill';\n\nconst interfaceLabels = {\n\t/* translators: accessibility text for the editor top bar landmark region. */\n\theader: __( 'Editor top bar' ),\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 EditorInterface( {\n\tclassName,\n\tstyles,\n\tchildren,\n\tforceIsDirty,\n\tcontentRef,\n\tdisableIframe,\n\tautoFocus,\n\tcustomSaveButton,\n\tcustomSavePanel,\n\tforceDisableBlockTools,\n\ttitle,\n\tiframeProps,\n} ) {\n\tconst {\n\t\tmode,\n\t\tisInserterOpened,\n\t\tisListViewOpened,\n\t\tisDistractionFree,\n\t\tisPreviewMode,\n\t\tshowBlockBreadcrumbs,\n\t\tdocumentLabel,\n\t} = useSelect( ( select ) => {\n\t\tconst { get } = select( preferencesStore );\n\t\tconst { getEditorSettings, getPostTypeLabel } = select( editorStore );\n\t\tconst editorSettings = getEditorSettings();\n\t\tconst postTypeLabel = getPostTypeLabel();\n\n\t\tlet _mode = select( editorStore ).getEditorMode();\n\t\tif ( ! editorSettings.richEditingEnabled && _mode === 'visual' ) {\n\t\t\t_mode = 'text';\n\t\t}\n\t\tif ( ! editorSettings.codeEditingEnabled && _mode === 'text' ) {\n\t\t\t_mode = 'visual';\n\t\t}\n\n\t\treturn {\n\t\t\tmode: _mode,\n\t\t\tisInserterOpened: select( editorStore ).isInserterOpened(),\n\t\t\tisListViewOpened: select( editorStore ).isListViewOpened(),\n\t\t\tisDistractionFree: get( 'core', 'distractionFree' ),\n\t\t\tisPreviewMode: editorSettings.isPreviewMode,\n\t\t\tshowBlockBreadcrumbs: get( 'core', 'showBlockBreadcrumbs' ),\n\t\t\tdocumentLabel:\n\t\t\t\t// translators: Default label for the Document in the Block Breadcrumb.\n\t\t\t\tpostTypeLabel || _x( 'Document', 'noun, breadcrumb' ),\n\t\t};\n\t}, [] );\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\tconst secondarySidebarLabel = isListViewOpened\n\t\t? __( 'Document Overview' )\n\t\t: __( 'Block Library' );\n\n\t// Local state for save panel.\n\t// Note 'truthy' callback implies an open panel.\n\tconst [ entitiesSavedStatesCallback, setEntitiesSavedStatesCallback ] =\n\t\tuseState( false );\n\tconst closeEntitiesSavedStates = useCallback(\n\t\t( arg ) => {\n\t\t\tif ( typeof entitiesSavedStatesCallback === 'function' ) {\n\t\t\t\tentitiesSavedStatesCallback( arg );\n\t\t\t}\n\t\t\tsetEntitiesSavedStatesCallback( false );\n\t\t},\n\t\t[ entitiesSavedStatesCallback ]\n\t);\n\n\treturn (\n\t\t<InterfaceSkeleton\n\t\t\tisDistractionFree={ isDistractionFree }\n\t\t\tclassName={ clsx( 'editor-editor-interface', className, {\n\t\t\t\t'is-entity-save-view-open': !! entitiesSavedStatesCallback,\n\t\t\t\t'is-distraction-free': isDistractionFree && ! isPreviewMode,\n\t\t\t} ) }\n\t\t\tlabels={ {\n\t\t\t\t...interfaceLabels,\n\t\t\t\tsecondarySidebar: secondarySidebarLabel,\n\t\t\t} }\n\t\t\theader={\n\t\t\t\t! isPreviewMode && (\n\t\t\t\t\t<Header\n\t\t\t\t\t\tforceIsDirty={ forceIsDirty }\n\t\t\t\t\t\tsetEntitiesSavedStatesCallback={\n\t\t\t\t\t\t\tsetEntitiesSavedStatesCallback\n\t\t\t\t\t\t}\n\t\t\t\t\t\tcustomSaveButton={ customSaveButton }\n\t\t\t\t\t\tforceDisableBlockTools={ forceDisableBlockTools }\n\t\t\t\t\t\ttitle={ title }\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t}\n\t\t\teditorNotices={ <EditorNotices /> }\n\t\t\tsecondarySidebar={\n\t\t\t\t! isPreviewMode &&\n\t\t\t\tmode === 'visual' &&\n\t\t\t\t( ( isInserterOpened && <InserterSidebar /> ) ||\n\t\t\t\t\t( isListViewOpened && <ListViewSidebar /> ) )\n\t\t\t}\n\t\t\tsidebar={\n\t\t\t\t! isPreviewMode &&\n\t\t\t\t! isDistractionFree && <ComplementaryArea.Slot scope=\"core\" />\n\t\t\t}\n\t\t\tcontent={\n\t\t\t\t<>\n\t\t\t\t\t{ ! isDistractionFree && ! isPreviewMode && (\n\t\t\t\t\t\t<EditorNotices />\n\t\t\t\t\t) }\n\n\t\t\t\t\t<EditorContentSlotFill.Slot>\n\t\t\t\t\t\t{ ( [ editorCanvasView ] ) =>\n\t\t\t\t\t\t\teditorCanvasView ? (\n\t\t\t\t\t\t\t\teditorCanvasView\n\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{ ! isPreviewMode && mode === 'text' && (\n\t\t\t\t\t\t\t\t\t\t<TextEditor\n\t\t\t\t\t\t\t\t\t\t\t// We should auto-focus the canvas (title) on load.\n\t\t\t\t\t\t\t\t\t\t\t// eslint-disable-next-line jsx-a11y/no-autofocus\n\t\t\t\t\t\t\t\t\t\t\tautoFocus={ autoFocus }\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{ ! isPreviewMode &&\n\t\t\t\t\t\t\t\t\t\t! isLargeViewport &&\n\t\t\t\t\t\t\t\t\t\tmode === 'visual' && (\n\t\t\t\t\t\t\t\t\t\t\t<BlockToolbar hideDragHandle />\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ ( isPreviewMode ||\n\t\t\t\t\t\t\t\t\t\tmode === 'visual' ) && (\n\t\t\t\t\t\t\t\t\t\t<VisualEditor\n\t\t\t\t\t\t\t\t\t\t\tstyles={ styles }\n\t\t\t\t\t\t\t\t\t\t\tcontentRef={ contentRef }\n\t\t\t\t\t\t\t\t\t\t\tdisableIframe={ disableIframe }\n\t\t\t\t\t\t\t\t\t\t\t// We should auto-focus the canvas (title) on load.\n\t\t\t\t\t\t\t\t\t\t\t// eslint-disable-next-line jsx-a11y/no-autofocus\n\t\t\t\t\t\t\t\t\t\t\tautoFocus={ autoFocus }\n\t\t\t\t\t\t\t\t\t\t\tiframeProps={ iframeProps }\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{ children }\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t</EditorContentSlotFill.Slot>\n\t\t\t\t</>\n\t\t\t}\n\t\t\tfooter={\n\t\t\t\t! isPreviewMode &&\n\t\t\t\t! isDistractionFree &&\n\t\t\t\tisLargeViewport &&\n\t\t\t\tshowBlockBreadcrumbs &&\n\t\t\t\tmode === 'visual' && (\n\t\t\t\t\t<BlockBreadcrumb rootLabelText={ documentLabel } />\n\t\t\t\t)\n\t\t\t}\n\t\t\tactions={\n\t\t\t\t! isPreviewMode\n\t\t\t\t\t? customSavePanel || (\n\t\t\t\t\t\t\t<SavePublishPanels\n\t\t\t\t\t\t\t\tcloseEntitiesSavedStates={\n\t\t\t\t\t\t\t\t\tcloseEntitiesSavedStates\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tisEntitiesSavedStatesOpen={\n\t\t\t\t\t\t\t\t\tentitiesSavedStatesCallback\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tsetEntitiesSavedStatesCallback={\n\t\t\t\t\t\t\t\t\tsetEntitiesSavedStatesCallback\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tforceIsDirtyPublishPanel={ forceIsDirty }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t  )\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t/>\n\t);\n}\n"],
-  "mappings": "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",
-  "names": ["preferencesStore", "editorStore", "clsx", "Header", "EditorNotices", "InserterSidebar", "ListViewSidebar", "EditorContentSlotFill", "TextEditor", "VisualEditor", "SavePublishPanels"]
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { InterfaceSkeleton, ComplementaryArea } from '@wordpress/interface';\nimport { useSelect } from '@wordpress/data';\nimport { __, _x } from '@wordpress/i18n';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { BlockBreadcrumb, BlockToolbar } from '@wordpress/block-editor';\nimport { useViewportMatch } from '@wordpress/compose';\nimport { useState, useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as editorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\nimport EditorNotices from '../editor-notices';\nimport Header from '../header';\nimport InserterSidebar from '../inserter-sidebar';\nimport ListViewSidebar from '../list-view-sidebar';\nimport SavePublishPanels from '../save-publish-panels';\nimport TextEditor from '../text-editor';\nimport VisualEditor from '../visual-editor';\nimport StylesCanvas from '../styles-canvas';\n\nconst interfaceLabels = {\n\t/* translators: accessibility text for the editor top bar landmark region. */\n\theader: __( 'Editor top bar' ),\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 EditorInterface( {\n\tclassName,\n\tchildren,\n\tforceIsDirty,\n\tcontentRef,\n\tdisableIframe,\n\tautoFocus,\n\tcustomSaveButton,\n\tcustomSavePanel,\n\tforceDisableBlockTools,\n\tiframeProps,\n} ) {\n\tconst {\n\t\tmode,\n\t\tisInserterOpened,\n\t\tisListViewOpened,\n\t\tisDistractionFree,\n\t\tisPreviewMode,\n\t\tshowBlockBreadcrumbs,\n\t\tdocumentLabel,\n\t\tstylesPath,\n\t\tshowStylebook,\n\t} = useSelect( ( select ) => {\n\t\tconst { get } = select( preferencesStore );\n\t\tconst { getEditorSettings, getPostTypeLabel } = select( editorStore );\n\t\tconst { getStylesPath, getShowStylebook } = unlock(\n\t\t\tselect( editorStore )\n\t\t);\n\t\tconst editorSettings = getEditorSettings();\n\t\tconst postTypeLabel = getPostTypeLabel();\n\n\t\tlet _mode = select( editorStore ).getEditorMode();\n\t\tif ( ! editorSettings.richEditingEnabled && _mode === 'visual' ) {\n\t\t\t_mode = 'text';\n\t\t}\n\t\tif ( ! editorSettings.codeEditingEnabled && _mode === 'text' ) {\n\t\t\t_mode = 'visual';\n\t\t}\n\n\t\treturn {\n\t\t\tmode: _mode,\n\t\t\tisInserterOpened: select( editorStore ).isInserterOpened(),\n\t\t\tisListViewOpened: select( editorStore ).isListViewOpened(),\n\t\t\tisDistractionFree: get( 'core', 'distractionFree' ),\n\t\t\tisPreviewMode: editorSettings.isPreviewMode,\n\t\t\tshowBlockBreadcrumbs: get( 'core', 'showBlockBreadcrumbs' ),\n\t\t\tdocumentLabel:\n\t\t\t\t// translators: Default label for the Document in the Block Breadcrumb.\n\t\t\t\tpostTypeLabel || _x( 'Document', 'noun, breadcrumb' ),\n\t\t\tstylesPath: getStylesPath(),\n\t\t\tshowStylebook: getShowStylebook(),\n\t\t};\n\t}, [] );\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\tconst secondarySidebarLabel = isListViewOpened\n\t\t? __( 'Document Overview' )\n\t\t: __( 'Block Library' );\n\tconst shouldShowStylesCanvas =\n\t\tshowStylebook || stylesPath?.startsWith( '/revisions' );\n\n\t// Local state for save panel.\n\t// Note 'truthy' callback implies an open panel.\n\tconst [ entitiesSavedStatesCallback, setEntitiesSavedStatesCallback ] =\n\t\tuseState( false );\n\tconst closeEntitiesSavedStates = useCallback(\n\t\t( arg ) => {\n\t\t\tif ( typeof entitiesSavedStatesCallback === 'function' ) {\n\t\t\t\tentitiesSavedStatesCallback( arg );\n\t\t\t}\n\t\t\tsetEntitiesSavedStatesCallback( false );\n\t\t},\n\t\t[ entitiesSavedStatesCallback ]\n\t);\n\n\treturn (\n\t\t<InterfaceSkeleton\n\t\t\tisDistractionFree={ isDistractionFree }\n\t\t\tclassName={ clsx( 'editor-editor-interface', className, {\n\t\t\t\t'is-entity-save-view-open': !! entitiesSavedStatesCallback,\n\t\t\t\t'is-distraction-free': isDistractionFree && ! isPreviewMode,\n\t\t\t} ) }\n\t\t\tlabels={ {\n\t\t\t\t...interfaceLabels,\n\t\t\t\tsecondarySidebar: secondarySidebarLabel,\n\t\t\t} }\n\t\t\theader={\n\t\t\t\t! isPreviewMode && (\n\t\t\t\t\t<Header\n\t\t\t\t\t\tforceIsDirty={ forceIsDirty }\n\t\t\t\t\t\tsetEntitiesSavedStatesCallback={\n\t\t\t\t\t\t\tsetEntitiesSavedStatesCallback\n\t\t\t\t\t\t}\n\t\t\t\t\t\tcustomSaveButton={ customSaveButton }\n\t\t\t\t\t\tforceDisableBlockTools={ forceDisableBlockTools }\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t}\n\t\t\teditorNotices={ <EditorNotices /> }\n\t\t\tsecondarySidebar={\n\t\t\t\t! isPreviewMode &&\n\t\t\t\tmode === 'visual' &&\n\t\t\t\t( ( isInserterOpened && <InserterSidebar /> ) ||\n\t\t\t\t\t( isListViewOpened && <ListViewSidebar /> ) )\n\t\t\t}\n\t\t\tsidebar={\n\t\t\t\t! isPreviewMode &&\n\t\t\t\t! isDistractionFree && <ComplementaryArea.Slot scope=\"core\" />\n\t\t\t}\n\t\t\tcontent={\n\t\t\t\t<>\n\t\t\t\t\t{ ! isDistractionFree && ! isPreviewMode && (\n\t\t\t\t\t\t<EditorNotices />\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ shouldShowStylesCanvas ? (\n\t\t\t\t\t\t<StylesCanvas />\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ ! isPreviewMode && mode === 'text' && (\n\t\t\t\t\t\t\t\t<TextEditor\n\t\t\t\t\t\t\t\t\t// We should auto-focus the canvas (title) on load.\n\t\t\t\t\t\t\t\t\t// eslint-disable-next-line jsx-a11y/no-autofocus\n\t\t\t\t\t\t\t\t\tautoFocus={ autoFocus }\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{ ! isPreviewMode &&\n\t\t\t\t\t\t\t\t! isLargeViewport &&\n\t\t\t\t\t\t\t\tmode === 'visual' && (\n\t\t\t\t\t\t\t\t\t<BlockToolbar hideDragHandle />\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t{ ( isPreviewMode || mode === 'visual' ) && (\n\t\t\t\t\t\t\t\t<VisualEditor\n\t\t\t\t\t\t\t\t\tcontentRef={ contentRef }\n\t\t\t\t\t\t\t\t\tdisableIframe={ disableIframe }\n\t\t\t\t\t\t\t\t\t// We should auto-focus the canvas (title) on load.\n\t\t\t\t\t\t\t\t\t// eslint-disable-next-line jsx-a11y/no-autofocus\n\t\t\t\t\t\t\t\t\tautoFocus={ autoFocus }\n\t\t\t\t\t\t\t\t\tiframeProps={ iframeProps }\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{ children }\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\tfooter={\n\t\t\t\t! isPreviewMode &&\n\t\t\t\t! isDistractionFree &&\n\t\t\t\tisLargeViewport &&\n\t\t\t\tshowBlockBreadcrumbs &&\n\t\t\t\tmode === 'visual' && (\n\t\t\t\t\t<BlockBreadcrumb rootLabelText={ documentLabel } />\n\t\t\t\t)\n\t\t\t}\n\t\t\tactions={\n\t\t\t\t! isPreviewMode\n\t\t\t\t\t? customSavePanel || (\n\t\t\t\t\t\t\t<SavePublishPanels\n\t\t\t\t\t\t\t\tcloseEntitiesSavedStates={\n\t\t\t\t\t\t\t\t\tcloseEntitiesSavedStates\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tisEntitiesSavedStatesOpen={\n\t\t\t\t\t\t\t\t\tentitiesSavedStatesCallback\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tsetEntitiesSavedStatesCallback={\n\t\t\t\t\t\t\t\t\tsetEntitiesSavedStatesCallback\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tforceIsDirtyPublishPanel={ forceIsDirty }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t  )\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t/>\n\t);\n}\n"],
+  "mappings": "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",
+  "names": ["preferencesStore", "editorStore", "clsx", "Header", "EditorNotices", "InserterSidebar", "ListViewSidebar", "StylesCanvas", "TextEditor", "VisualEditor", "SavePublishPanels"]
 }

package/build/components/entities-saved-states/entity-type-list.js

@@ -36,13 +36,8 @@ var import_i18n = require("@wordpress/i18n");
 var import_data = require("@wordpress/data");
 var import_components = require("@wordpress/components");
 var import_core_data = require("@wordpress/core-data");
-var import_block_editor = require("@wordpress/block-editor");
-var import_element = require("@wordpress/element");
+var import_global_styles_engine = require("@wordpress/global-styles-engine");
 var import_entity_record_item = __toESM(require("./entity-record-item"));
-var import_lock_unlock = require("../../lock-unlock");
-const { getGlobalStylesChanges, GlobalStylesContext } = (0, import_lock_unlock.unlock)(
-  import_block_editor.privateApis
-);
 function getEntityDescription(entity, count) {
   switch (entity) {
     case "site":
@@ -57,17 +52,26 @@ function getEntityDescription(entity, count) {
   }
 }
 function GlobalStylesDescription({ record }) {
-  const { user: currentEditorGlobalStyles } = (0, import_element.useContext)(GlobalStylesContext);
-  const savedRecord = (0, import_data.useSelect)(
-    (select) => select(import_core_data.store).getEntityRecord(
-      record.kind,
-      record.name,
-      record.key
-    ),
+  const { editedRecord, savedRecord } = (0, import_data.useSelect)(
+    (select) => {
+      const { getEditedEntityRecord, getEntityRecord } = select(import_core_data.store);
+      return {
+        editedRecord: getEditedEntityRecord(
+          record.kind,
+          record.name,
+          record.key
+        ),
+        savedRecord: getEntityRecord(
+          record.kind,
+          record.name,
+          record.key
+        )
+      };
+    },
     [record.kind, record.name, record.key]
   );
-  const globalStylesChanges = getGlobalStylesChanges(
-    currentEditorGlobalStyles,
+  const globalStylesChanges = (0, import_global_styles_engine.getGlobalStylesChanges)(
+    editedRecord,
     savedRecord,
     {
       maxResults: 10

package/build/components/entities-saved-states/entity-type-list.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/entities-saved-states/entity-type-list.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { PanelBody, PanelRow } from '@wordpress/components';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport EntityRecordItem from './entity-record-item';\nimport { unlock } from '../../lock-unlock';\n\nconst { getGlobalStylesChanges, GlobalStylesContext } = unlock(\n\tblockEditorPrivateApis\n);\n\nfunction getEntityDescription( entity, count ) {\n\tswitch ( entity ) {\n\t\tcase 'site':\n\t\t\treturn 1 === count\n\t\t\t\t? __( 'This change will affect your whole site.' )\n\t\t\t\t: __( 'These changes will affect your whole site.' );\n\t\tcase 'wp_template':\n\t\t\treturn __(\n\t\t\t\t'This change will affect other parts of your site that use this template.'\n\t\t\t);\n\t\tcase 'page':\n\t\tcase 'post':\n\t\t\treturn __( 'The following has been modified.' );\n\t}\n}\n\nfunction GlobalStylesDescription( { record } ) {\n\tconst { user: currentEditorGlobalStyles } =\n\t\tuseContext( GlobalStylesContext );\n\tconst savedRecord = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getEntityRecord(\n\t\t\t\trecord.kind,\n\t\t\t\trecord.name,\n\t\t\t\trecord.key\n\t\t\t),\n\t\t[ record.kind, record.name, record.key ]\n\t);\n\n\tconst globalStylesChanges = getGlobalStylesChanges(\n\t\tcurrentEditorGlobalStyles,\n\t\tsavedRecord,\n\t\t{\n\t\t\tmaxResults: 10,\n\t\t}\n\t);\n\treturn globalStylesChanges.length ? (\n\t\t<ul className=\"entities-saved-states__changes\">\n\t\t\t{ globalStylesChanges.map( ( change ) => (\n\t\t\t\t<li key={ change }>{ change }</li>\n\t\t\t) ) }\n\t\t</ul>\n\t) : null;\n}\n\nfunction EntityDescription( { record, count } ) {\n\tif ( 'globalStyles' === record?.name ) {\n\t\treturn null;\n\t}\n\tconst description = getEntityDescription( record?.name, count );\n\treturn description ? <PanelRow>{ description }</PanelRow> : null;\n}\n\nexport default function EntityTypeList( {\n\tlist,\n\tunselectedEntities,\n\tsetUnselectedEntities,\n} ) {\n\tconst count = list.length;\n\tconst firstRecord = list[ 0 ];\n\tconst entityConfig = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getEntityConfig(\n\t\t\t\tfirstRecord.kind,\n\t\t\t\tfirstRecord.name\n\t\t\t),\n\t\t[ firstRecord.kind, firstRecord.name ]\n\t);\n\n\tlet entityLabel = entityConfig.label;\n\tif ( firstRecord?.name === 'wp_template_part' ) {\n\t\tentityLabel =\n\t\t\t1 === count ? __( 'Template Part' ) : __( 'Template Parts' );\n\t}\n\n\treturn (\n\t\t<PanelBody\n\t\t\ttitle={ entityLabel }\n\t\t\tinitialOpen\n\t\t\tclassName=\"entities-saved-states__panel-body\"\n\t\t>\n\t\t\t<EntityDescription record={ firstRecord } count={ count } />\n\t\t\t{ list.map( ( record ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<EntityRecordItem\n\t\t\t\t\t\tkey={ record.key || record.property }\n\t\t\t\t\t\trecord={ record }\n\t\t\t\t\t\tchecked={\n\t\t\t\t\t\t\t! unselectedEntities.some(\n\t\t\t\t\t\t\t\t( elt ) =>\n\t\t\t\t\t\t\t\t\telt.kind === record.kind &&\n\t\t\t\t\t\t\t\t\telt.name === record.name &&\n\t\t\t\t\t\t\t\t\telt.key === record.key &&\n\t\t\t\t\t\t\t\t\telt.property === record.property\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\tsetUnselectedEntities( record, value )\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{ 'globalStyles' === firstRecord?.name && (\n\t\t\t\t<GlobalStylesDescription record={ firstRecord } />\n\t\t\t) }\n\t\t</PanelBody>\n\t);\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA2DI;AAxDJ,kBAAmB;AACnB,kBAA0B;AAC1B,wBAAoC;AACpC,uBAAmC;AACnC,0BAAsD;AACtD,qBAA2B;AAK3B,gCAA6B;AAC7B,yBAAuB;AAEvB,MAAM,EAAE,wBAAwB,oBAAoB,QAAI;AAAA,EACvD,oBAAAA;AACD;AAEA,SAAS,qBAAsB,QAAQ,OAAQ;AAC9C,UAAS,QAAS;AAAA,IACjB,KAAK;AACJ,aAAO,MAAM,YACV,gBAAI,0CAA2C,QAC/C,gBAAI,4CAA6C;AAAA,IACrD,KAAK;AACJ,iBAAO;AAAA,QACN;AAAA,MACD;AAAA,IACD,KAAK;AAAA,IACL,KAAK;AACJ,iBAAO,gBAAI,kCAAmC;AAAA,EAChD;AACD;AAEA,SAAS,wBAAyB,EAAE,OAAO,GAAI;AAC9C,QAAM,EAAE,MAAM,0BAA0B,QACvC,2BAAY,mBAAoB;AACjC,QAAM,kBAAc;AAAA,IACnB,CAAE,WACD,OAAQ,iBAAAC,KAAU,EAAE;AAAA,MACnB,OAAO;AAAA,MACP,OAAO;AAAA,MACP,OAAO;AAAA,IACR;AAAA,IACD,CAAE,OAAO,MAAM,OAAO,MAAM,OAAO,GAAI;AAAA,EACxC;AAEA,QAAM,sBAAsB;AAAA,IAC3B;AAAA,IACA;AAAA,IACA;AAAA,MACC,YAAY;AAAA,IACb;AAAA,EACD;AACA,SAAO,oBAAoB,SAC1B,4CAAC,QAAG,WAAU,kCACX,8BAAoB,IAAK,CAAE,WAC5B,4CAAC,QAAoB,oBAAX,MAAmB,CAC5B,GACH,IACG;AACL;AAEA,SAAS,kBAAmB,EAAE,QAAQ,MAAM,GAAI;AAC/C,MAAK,mBAAmB,QAAQ,MAAO;AACtC,WAAO;AAAA,EACR;AACA,QAAM,cAAc,qBAAsB,QAAQ,MAAM,KAAM;AAC9D,SAAO,cAAc,4CAAC,8BAAW,uBAAa,IAAc;AAC7D;AAEe,SAAR,eAAiC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,QAAQ,KAAK;AACnB,QAAM,cAAc,KAAM,CAAE;AAC5B,QAAM,mBAAe;AAAA,IACpB,CAAE,WACD,OAAQ,iBAAAA,KAAU,EAAE;AAAA,MACnB,YAAY;AAAA,MACZ,YAAY;AAAA,IACb;AAAA,IACD,CAAE,YAAY,MAAM,YAAY,IAAK;AAAA,EACtC;AAEA,MAAI,cAAc,aAAa;AAC/B,MAAK,aAAa,SAAS,oBAAqB;AAC/C,kBACC,MAAM,YAAQ,gBAAI,eAAgB,QAAI,gBAAI,gBAAiB;AAAA,EAC7D;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAQ;AAAA,MACR,aAAW;AAAA,MACX,WAAU;AAAA,MAEV;AAAA,oDAAC,qBAAkB,QAAS,aAAc,OAAgB;AAAA,QACxD,KAAK,IAAK,CAAE,WAAY;AACzB,iBACC;AAAA,YAAC,0BAAAC;AAAA,YAAA;AAAA,cAEA;AAAA,cACA,SACC,CAAE,mBAAmB;AAAA,gBACpB,CAAE,QACD,IAAI,SAAS,OAAO,QACpB,IAAI,SAAS,OAAO,QACpB,IAAI,QAAQ,OAAO,OACnB,IAAI,aAAa,OAAO;AAAA,cAC1B;AAAA,cAED,UAAW,CAAE,UACZ,sBAAuB,QAAQ,KAAM;AAAA;AAAA,YAZhC,OAAO,OAAO,OAAO;AAAA,UAc5B;AAAA,QAEF,CAAE;AAAA,QACA,mBAAmB,aAAa,QACjC,4CAAC,2BAAwB,QAAS,aAAc;AAAA;AAAA;AAAA,EAElD;AAEF;",
-  "names": ["blockEditorPrivateApis", "coreStore", "EntityRecordItem"]
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { PanelBody, PanelRow } from '@wordpress/components';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { getGlobalStylesChanges } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport EntityRecordItem from './entity-record-item';\n\nfunction getEntityDescription( entity, count ) {\n\tswitch ( entity ) {\n\t\tcase 'site':\n\t\t\treturn 1 === count\n\t\t\t\t? __( 'This change will affect your whole site.' )\n\t\t\t\t: __( 'These changes will affect your whole site.' );\n\t\tcase 'wp_template':\n\t\t\treturn __(\n\t\t\t\t'This change will affect other parts of your site that use this template.'\n\t\t\t);\n\t\tcase 'page':\n\t\tcase 'post':\n\t\t\treturn __( 'The following has been modified.' );\n\t}\n}\n\nfunction GlobalStylesDescription( { record } ) {\n\tconst { editedRecord, savedRecord } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getEditedEntityRecord, getEntityRecord } =\n\t\t\t\tselect( coreStore );\n\t\t\treturn {\n\t\t\t\teditedRecord: getEditedEntityRecord(\n\t\t\t\t\trecord.kind,\n\t\t\t\t\trecord.name,\n\t\t\t\t\trecord.key\n\t\t\t\t),\n\t\t\t\tsavedRecord: getEntityRecord(\n\t\t\t\t\trecord.kind,\n\t\t\t\t\trecord.name,\n\t\t\t\t\trecord.key\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[ record.kind, record.name, record.key ]\n\t);\n\n\tconst globalStylesChanges = getGlobalStylesChanges(\n\t\teditedRecord,\n\t\tsavedRecord,\n\t\t{\n\t\t\tmaxResults: 10,\n\t\t}\n\t);\n\treturn globalStylesChanges.length ? (\n\t\t<ul className=\"entities-saved-states__changes\">\n\t\t\t{ globalStylesChanges.map( ( change ) => (\n\t\t\t\t<li key={ change }>{ change }</li>\n\t\t\t) ) }\n\t\t</ul>\n\t) : null;\n}\n\nfunction EntityDescription( { record, count } ) {\n\tif ( 'globalStyles' === record?.name ) {\n\t\treturn null;\n\t}\n\tconst description = getEntityDescription( record?.name, count );\n\treturn description ? <PanelRow>{ description }</PanelRow> : null;\n}\n\nexport default function EntityTypeList( {\n\tlist,\n\tunselectedEntities,\n\tsetUnselectedEntities,\n} ) {\n\tconst count = list.length;\n\tconst firstRecord = list[ 0 ];\n\tconst entityConfig = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getEntityConfig(\n\t\t\t\tfirstRecord.kind,\n\t\t\t\tfirstRecord.name\n\t\t\t),\n\t\t[ firstRecord.kind, firstRecord.name ]\n\t);\n\n\tlet entityLabel = entityConfig.label;\n\tif ( firstRecord?.name === 'wp_template_part' ) {\n\t\tentityLabel =\n\t\t\t1 === count ? __( 'Template Part' ) : __( 'Template Parts' );\n\t}\n\n\treturn (\n\t\t<PanelBody\n\t\t\ttitle={ entityLabel }\n\t\t\tinitialOpen\n\t\t\tclassName=\"entities-saved-states__panel-body\"\n\t\t>\n\t\t\t<EntityDescription record={ firstRecord } count={ count } />\n\t\t\t{ list.map( ( record ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<EntityRecordItem\n\t\t\t\t\t\tkey={ record.key || record.property }\n\t\t\t\t\t\trecord={ record }\n\t\t\t\t\t\tchecked={\n\t\t\t\t\t\t\t! unselectedEntities.some(\n\t\t\t\t\t\t\t\t( elt ) =>\n\t\t\t\t\t\t\t\t\telt.kind === record.kind &&\n\t\t\t\t\t\t\t\t\telt.name === record.name &&\n\t\t\t\t\t\t\t\t\telt.key === record.key &&\n\t\t\t\t\t\t\t\t\telt.property === record.property\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\tsetUnselectedEntities( record, value )\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{ 'globalStyles' === firstRecord?.name && (\n\t\t\t\t<GlobalStylesDescription record={ firstRecord } />\n\t\t\t) }\n\t\t</PanelBody>\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA6DI;AA1DJ,kBAAmB;AACnB,kBAA0B;AAC1B,wBAAoC;AACpC,uBAAmC;AACnC,kCAAuC;AAKvC,gCAA6B;AAE7B,SAAS,qBAAsB,QAAQ,OAAQ;AAC9C,UAAS,QAAS;AAAA,IACjB,KAAK;AACJ,aAAO,MAAM,YACV,gBAAI,0CAA2C,QAC/C,gBAAI,4CAA6C;AAAA,IACrD,KAAK;AACJ,iBAAO;AAAA,QACN;AAAA,MACD;AAAA,IACD,KAAK;AAAA,IACL,KAAK;AACJ,iBAAO,gBAAI,kCAAmC;AAAA,EAChD;AACD;AAEA,SAAS,wBAAyB,EAAE,OAAO,GAAI;AAC9C,QAAM,EAAE,cAAc,YAAY,QAAI;AAAA,IACrC,CAAE,WAAY;AACb,YAAM,EAAE,uBAAuB,gBAAgB,IAC9C,OAAQ,iBAAAA,KAAU;AACnB,aAAO;AAAA,QACN,cAAc;AAAA,UACb,OAAO;AAAA,UACP,OAAO;AAAA,UACP,OAAO;AAAA,QACR;AAAA,QACA,aAAa;AAAA,UACZ,OAAO;AAAA,UACP,OAAO;AAAA,UACP,OAAO;AAAA,QACR;AAAA,MACD;AAAA,IACD;AAAA,IACA,CAAE,OAAO,MAAM,OAAO,MAAM,OAAO,GAAI;AAAA,EACxC;AAEA,QAAM,0BAAsB;AAAA,IAC3B;AAAA,IACA;AAAA,IACA;AAAA,MACC,YAAY;AAAA,IACb;AAAA,EACD;AACA,SAAO,oBAAoB,SAC1B,4CAAC,QAAG,WAAU,kCACX,8BAAoB,IAAK,CAAE,WAC5B,4CAAC,QAAoB,oBAAX,MAAmB,CAC5B,GACH,IACG;AACL;AAEA,SAAS,kBAAmB,EAAE,QAAQ,MAAM,GAAI;AAC/C,MAAK,mBAAmB,QAAQ,MAAO;AACtC,WAAO;AAAA,EACR;AACA,QAAM,cAAc,qBAAsB,QAAQ,MAAM,KAAM;AAC9D,SAAO,cAAc,4CAAC,8BAAW,uBAAa,IAAc;AAC7D;AAEe,SAAR,eAAiC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,QAAQ,KAAK;AACnB,QAAM,cAAc,KAAM,CAAE;AAC5B,QAAM,mBAAe;AAAA,IACpB,CAAE,WACD,OAAQ,iBAAAA,KAAU,EAAE;AAAA,MACnB,YAAY;AAAA,MACZ,YAAY;AAAA,IACb;AAAA,IACD,CAAE,YAAY,MAAM,YAAY,IAAK;AAAA,EACtC;AAEA,MAAI,cAAc,aAAa;AAC/B,MAAK,aAAa,SAAS,oBAAqB;AAC/C,kBACC,MAAM,YAAQ,gBAAI,eAAgB,QAAI,gBAAI,gBAAiB;AAAA,EAC7D;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAQ;AAAA,MACR,aAAW;AAAA,MACX,WAAU;AAAA,MAEV;AAAA,oDAAC,qBAAkB,QAAS,aAAc,OAAgB;AAAA,QACxD,KAAK,IAAK,CAAE,WAAY;AACzB,iBACC;AAAA,YAAC,0BAAAC;AAAA,YAAA;AAAA,cAEA;AAAA,cACA,SACC,CAAE,mBAAmB;AAAA,gBACpB,CAAE,QACD,IAAI,SAAS,OAAO,QACpB,IAAI,SAAS,OAAO,QACpB,IAAI,QAAQ,OAAO,OACnB,IAAI,aAAa,OAAO;AAAA,cAC1B;AAAA,cAED,UAAW,CAAE,UACZ,sBAAuB,QAAQ,KAAM;AAAA;AAAA,YAZhC,OAAO,OAAO,OAAO;AAAA,UAc5B;AAAA,QAEF,CAAE;AAAA,QACA,mBAAmB,aAAa,QACjC,4CAAC,2BAAwB,QAAS,aAAc;AAAA;AAAA;AAAA,EAElD;AAEF;",
+  "names": ["coreStore", "EntityRecordItem"]
 }

package/build/components/global-styles/block-link.js

@@ -0,0 +1,70 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var block_link_exports = {};
+__export(block_link_exports, {
+  GlobalStylesBlockLink: () => GlobalStylesBlockLink
+});
+module.exports = __toCommonJS(block_link_exports);
+var import_data = require("@wordpress/data");
+var import_element = require("@wordpress/element");
+var import_block_editor = require("@wordpress/block-editor");
+var import_compose = require("@wordpress/compose");
+function GlobalStylesBlockLink({ path, onPathChange }) {
+  const { selectedBlockName, selectedBlockClientId } = (0, import_data.useSelect)(
+    (select) => {
+      const { getSelectedBlockClientId, getBlockName } = select(import_block_editor.store);
+      const clientId = getSelectedBlockClientId();
+      return {
+        selectedBlockName: getBlockName(clientId),
+        selectedBlockClientId: clientId
+      };
+    },
+    []
+  );
+  const blockHasGlobalStyles = true;
+  const previousBlockClientId = (0, import_compose.usePrevious)(selectedBlockClientId);
+  (0, import_element.useEffect)(() => {
+    if (selectedBlockClientId === previousBlockClientId) {
+      return;
+    }
+    if (!selectedBlockClientId || !blockHasGlobalStyles) {
+      return;
+    }
+    if (!path || path !== "/blocks" && !path.startsWith("/blocks/")) {
+      return;
+    }
+    const newPath = "/blocks/" + encodeURIComponent(selectedBlockName);
+    if (newPath !== path) {
+      onPathChange?.(newPath);
+    }
+  }, [
+    selectedBlockClientId,
+    previousBlockClientId,
+    selectedBlockName,
+    blockHasGlobalStyles,
+    path,
+    onPathChange
+  ]);
+  return null;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  GlobalStylesBlockLink
+});
+//# sourceMappingURL=block-link.js.map

package/build/components/global-styles/block-link.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/block-link.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useEffect } from '@wordpress/element';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\nimport { usePrevious } from '@wordpress/compose';\n\n/**\n * Auto-navigate to block styles when a block is selected in the canvas.\n *\n * @param {Object}   props\n * @param {string}   props.path         Current navigation path.\n * @param {Function} props.onPathChange Callback to change the navigation path.\n */\nexport function GlobalStylesBlockLink( { path, onPathChange } ) {\n\tconst { selectedBlockName, selectedBlockClientId } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getSelectedBlockClientId, getBlockName } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\tconst clientId = getSelectedBlockClientId();\n\t\t\treturn {\n\t\t\t\tselectedBlockName: getBlockName( clientId ),\n\t\t\t\tselectedBlockClientId: clientId,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\t// const blockHasGlobalStyles = useBlockHasGlobalStyles( selectedBlockName );\n\tconst blockHasGlobalStyles = true;\n\tconst previousBlockClientId = usePrevious( selectedBlockClientId );\n\n\t// When we're in the `Blocks` screen enable deep linking to the selected block.\n\tuseEffect( () => {\n\t\t// Only navigate when block selection changes, not when path changes\n\t\tif ( selectedBlockClientId === previousBlockClientId ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( ! selectedBlockClientId || ! blockHasGlobalStyles ) {\n\t\t\treturn;\n\t\t}\n\t\tif (\n\t\t\t! path ||\n\t\t\t( path !== '/blocks' && ! path.startsWith( '/blocks/' ) )\n\t\t) {\n\t\t\treturn;\n\t\t}\n\t\tconst newPath = '/blocks/' + encodeURIComponent( selectedBlockName );\n\t\t// Avoid navigating to the same path. This can happen when selecting\n\t\t// a new block of the same type.\n\t\tif ( newPath !== path ) {\n\t\t\tonPathChange?.( newPath );\n\t\t}\n\t}, [\n\t\tselectedBlockClientId,\n\t\tpreviousBlockClientId,\n\t\tselectedBlockName,\n\t\tblockHasGlobalStyles,\n\t\tpath,\n\t\tonPathChange,\n\t] );\n\n\treturn null;\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAA0B;AAC1B,qBAA0B;AAC1B,0BAA0C;AAC1C,qBAA4B;AASrB,SAAS,sBAAuB,EAAE,MAAM,aAAa,GAAI;AAC/D,QAAM,EAAE,mBAAmB,sBAAsB,QAAI;AAAA,IACpD,CAAE,WAAY;AACb,YAAM,EAAE,0BAA0B,aAAa,IAC9C,OAAQ,oBAAAA,KAAiB;AAC1B,YAAM,WAAW,yBAAyB;AAC1C,aAAO;AAAA,QACN,mBAAmB,aAAc,QAAS;AAAA,QAC1C,uBAAuB;AAAA,MACxB;AAAA,IACD;AAAA,IACA,CAAC;AAAA,EACF;AAGA,QAAM,uBAAuB;AAC7B,QAAM,4BAAwB,4BAAa,qBAAsB;AAGjE,gCAAW,MAAM;AAEhB,QAAK,0BAA0B,uBAAwB;AACtD;AAAA,IACD;AACA,QAAK,CAAE,yBAAyB,CAAE,sBAAuB;AACxD;AAAA,IACD;AACA,QACC,CAAE,QACA,SAAS,aAAa,CAAE,KAAK,WAAY,UAAW,GACrD;AACD;AAAA,IACD;AACA,UAAM,UAAU,aAAa,mBAAoB,iBAAkB;AAGnE,QAAK,YAAY,MAAO;AACvB,qBAAgB,OAAQ;AAAA,IACzB;AAAA,EACD,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAEF,SAAO;AACR;",
+  "names": ["blockEditorStore"]
+}

package/build/components/global-styles/header.js

@@ -0,0 +1,54 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var header_exports = {};
+__export(header_exports, {
+  default: () => header_default
+});
+module.exports = __toCommonJS(header_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_components = require("@wordpress/components");
+var import_i18n = require("@wordpress/i18n");
+var import_icons = require("@wordpress/icons");
+function ScreenHeader({ title, description, onBack }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalVStack, { spacing: 0, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalView, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalSpacer, { marginBottom: 0, paddingX: 4, paddingY: 3, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalHStack, { spacing: 2, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_components.Navigator.BackButton,
+        {
+          icon: (0, import_i18n.isRTL)() ? import_icons.chevronRight : import_icons.chevronLeft,
+          size: "small",
+          label: (0, import_i18n.__)("Back"),
+          onClick: onBack
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalSpacer, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_components.__experimentalHeading,
+        {
+          className: "editor-global-styles-header",
+          level: 2,
+          size: 13,
+          children: title
+        }
+      ) })
+    ] }) }) }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "editor-global-styles-header__description", children: description })
+  ] });
+}
+var header_default = ScreenHeader;
+//# sourceMappingURL=header.js.map

package/build/components/global-styles/header.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/header.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalSpacer as Spacer,\n\t__experimentalHeading as Heading,\n\t__experimentalView as View,\n\tNavigator,\n} from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { chevronRight, chevronLeft } from '@wordpress/icons';\n\nfunction ScreenHeader( { title, description, onBack } ) {\n\treturn (\n\t\t<VStack spacing={ 0 }>\n\t\t\t<View>\n\t\t\t\t<Spacer marginBottom={ 0 } paddingX={ 4 } paddingY={ 3 }>\n\t\t\t\t\t<HStack spacing={ 2 }>\n\t\t\t\t\t\t<Navigator.BackButton\n\t\t\t\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tlabel={ __( 'Back' ) }\n\t\t\t\t\t\t\tonClick={ onBack }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Spacer>\n\t\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\t\tclassName=\"editor-global-styles-header\"\n\t\t\t\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\t\t\t\tsize={ 13 }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t</HStack>\n\t\t\t\t</Spacer>\n\t\t\t</View>\n\t\t\t{ description && (\n\t\t\t\t<p className=\"editor-global-styles-header__description\">\n\t\t\t\t\t{ description }\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default ScreenHeader;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAmBK;AAhBL,wBAOO;AACP,kBAA0B;AAC1B,mBAA0C;AAE1C,SAAS,aAAc,EAAE,OAAO,aAAa,OAAO,GAAI;AACvD,SACC,6CAAC,kBAAAA,sBAAA,EAAO,SAAU,GACjB;AAAA,gDAAC,kBAAAC,oBAAA,EACA,sDAAC,kBAAAC,sBAAA,EAAO,cAAe,GAAI,UAAW,GAAI,UAAW,GACpD,uDAAC,kBAAAC,sBAAA,EAAO,SAAU,GACjB;AAAA;AAAA,QAAC,4BAAU;AAAA,QAAV;AAAA,UACA,UAAO,mBAAM,IAAI,4BAAe;AAAA,UAChC,MAAK;AAAA,UACL,WAAQ,gBAAI,MAAO;AAAA,UACnB,SAAU;AAAA;AAAA,MACX;AAAA,MACA,4CAAC,kBAAAD,sBAAA,EACA;AAAA,QAAC,kBAAAE;AAAA,QAAA;AAAA,UACA,WAAU;AAAA,UACV,OAAQ;AAAA,UACR,MAAO;AAAA,UAEL;AAAA;AAAA,MACH,GACD;AAAA,OACD,GACD,GACD;AAAA,IACE,eACD,4CAAC,OAAE,WAAU,4CACV,uBACH;AAAA,KAEF;AAEF;AAEA,IAAO,iBAAQ;",
+  "names": ["VStack", "View", "Spacer", "HStack", "Heading"]
+}

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

@@ -0,0 +1,176 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var hooks_exports = {};
+__export(hooks_exports, {
+  useGlobalStyles: () => useGlobalStyles,
+  useSetting: () => useSetting,
+  useStyle: () => useStyle
+});
+module.exports = __toCommonJS(hooks_exports);
+var import_element = require("@wordpress/element");
+var import_global_styles_engine = require("@wordpress/global-styles-engine");
+var import_core_data = require("@wordpress/core-data");
+var import_data = require("@wordpress/data");
+var import_block_editor = require("@wordpress/block-editor");
+var import_lock_unlock = require("../../lock-unlock");
+const { cleanEmptyObject } = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
+function useGlobalStylesUserConfig() {
+  const { globalStylesId, isReady, settings, styles, _links } = (0, import_data.useSelect)(
+    (select) => {
+      const {
+        getEntityRecord,
+        getEditedEntityRecord: getEditedEntityRecord2,
+        hasFinishedResolution,
+        canUser
+      } = select(import_core_data.store);
+      const _globalStylesId = select(import_core_data.store).__experimentalGetCurrentGlobalStylesId();
+      let record;
+      const userCanEditGlobalStyles = _globalStylesId ? canUser("update", {
+        kind: "root",
+        name: "globalStyles",
+        id: _globalStylesId
+      }) : null;
+      if (_globalStylesId && typeof userCanEditGlobalStyles === "boolean") {
+        if (userCanEditGlobalStyles) {
+          record = getEditedEntityRecord2(
+            "root",
+            "globalStyles",
+            _globalStylesId
+          );
+        } else {
+          record = getEntityRecord(
+            "root",
+            "globalStyles",
+            _globalStylesId,
+            { context: "view" }
+          );
+        }
+      }
+      let hasResolved = false;
+      if (hasFinishedResolution(
+        "__experimentalGetCurrentGlobalStylesId"
+      )) {
+        if (_globalStylesId) {
+          hasResolved = userCanEditGlobalStyles ? hasFinishedResolution("getEditedEntityRecord", [
+            "root",
+            "globalStyles",
+            _globalStylesId
+          ]) : hasFinishedResolution("getEntityRecord", [
+            "root",
+            "globalStyles",
+            _globalStylesId,
+            { context: "view" }
+          ]);
+        } else {
+          hasResolved = true;
+        }
+      }
+      return {
+        globalStylesId: _globalStylesId,
+        isReady: hasResolved,
+        settings: record?.settings,
+        styles: record?.styles,
+        _links: record?._links
+      };
+    },
+    []
+  );
+  const { getEditedEntityRecord } = (0, import_data.useSelect)(import_core_data.store);
+  const { editEntityRecord } = (0, import_data.useDispatch)(import_core_data.store);
+  const config = (0, import_element.useMemo)(() => {
+    return {
+      settings: settings ?? {},
+      styles: styles ?? {},
+      _links: _links ?? {}
+    };
+  }, [settings, styles, _links]);
+  const setConfig = (0, import_element.useCallback)(
+    (callbackOrObject, options = {}) => {
+      const record = getEditedEntityRecord(
+        "root",
+        "globalStyles",
+        globalStylesId
+      );
+      const currentConfig = {
+        styles: record?.styles ?? {},
+        settings: record?.settings ?? {},
+        _links: record?._links ?? {}
+      };
+      const updatedConfig = typeof callbackOrObject === "function" ? callbackOrObject(currentConfig) : callbackOrObject;
+      editEntityRecord(
+        "root",
+        "globalStyles",
+        globalStylesId,
+        {
+          styles: cleanEmptyObject(updatedConfig.styles) || {},
+          settings: cleanEmptyObject(updatedConfig.settings) || {},
+          _links: cleanEmptyObject(updatedConfig._links) || {}
+        },
+        options
+      );
+    },
+    [globalStylesId, editEntityRecord, getEditedEntityRecord]
+  );
+  return [isReady, config, setConfig];
+}
+function useGlobalStylesBaseConfig() {
+  const baseConfig = (0, import_data.useSelect)(
+    (select) => select(import_core_data.store).__experimentalGetCurrentThemeBaseGlobalStyles(),
+    []
+  );
+  return [!!baseConfig, baseConfig];
+}
+function useGlobalStyles() {
+  const [isUserConfigReady, userConfig, setUserConfig] = useGlobalStylesUserConfig();
+  const [isBaseConfigReady, baseConfig] = useGlobalStylesBaseConfig();
+  const merged = (0, import_element.useMemo)(() => {
+    if (!isUserConfigReady || !isBaseConfigReady) {
+      return {};
+    }
+    return (0, import_global_styles_engine.mergeGlobalStyles)(baseConfig || {}, userConfig);
+  }, [isUserConfigReady, isBaseConfigReady, baseConfig, userConfig]);
+  return {
+    merged,
+    base: baseConfig || {},
+    user: userConfig,
+    setUser: setUserConfig,
+    isReady: isUserConfigReady && isBaseConfigReady
+  };
+}
+function useStyle(path, blockName) {
+  const { merged } = useGlobalStyles();
+  return (0, import_element.useMemo)(
+    () => (0, import_global_styles_engine.getStyle)(merged, path, blockName),
+    [merged, path, blockName]
+  );
+}
+function useSetting(path, blockName) {
+  const { merged } = useGlobalStyles();
+  return (0, import_element.useMemo)(
+    () => (0, import_global_styles_engine.getSetting)(merged, path, blockName),
+    [merged, path, blockName]
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useGlobalStyles,
+  useSetting,
+  useStyle
+});
+//# sourceMappingURL=hooks.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/global-styles/hooks.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useMemo, useCallback } from '@wordpress/element';\nimport {\n\tmergeGlobalStyles,\n\tgetStyle,\n\tgetSetting,\n} from '@wordpress/global-styles-engine';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\n\nconst { cleanEmptyObject } = unlock( blockEditorPrivateApis );\n\n/**\n * Hook to fetch and manage user global styles config\n */\nfunction useGlobalStylesUserConfig() {\n\tconst { globalStylesId, isReady, settings, styles, _links } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetEntityRecord,\n\t\t\t\tgetEditedEntityRecord,\n\t\t\t\thasFinishedResolution,\n\t\t\t\tcanUser,\n\t\t\t} = select( coreStore );\n\t\t\tconst _globalStylesId =\n\t\t\t\tselect( coreStore ).__experimentalGetCurrentGlobalStylesId();\n\n\t\t\tlet record;\n\n\t\t\tconst userCanEditGlobalStyles = _globalStylesId\n\t\t\t\t? canUser( 'update', {\n\t\t\t\t\t\tkind: 'root',\n\t\t\t\t\t\tname: 'globalStyles',\n\t\t\t\t\t\tid: _globalStylesId,\n\t\t\t\t  } )\n\t\t\t\t: null;\n\n\t\t\tif (\n\t\t\t\t_globalStylesId &&\n\t\t\t\ttypeof userCanEditGlobalStyles === 'boolean'\n\t\t\t) {\n\t\t\t\tif ( userCanEditGlobalStyles ) {\n\t\t\t\t\trecord = getEditedEntityRecord(\n\t\t\t\t\t\t'root',\n\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t_globalStylesId\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\trecord = getEntityRecord(\n\t\t\t\t\t\t'root',\n\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t\t{ context: 'view' }\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tlet hasResolved = false;\n\t\t\tif (\n\t\t\t\thasFinishedResolution(\n\t\t\t\t\t'__experimentalGetCurrentGlobalStylesId'\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tif ( _globalStylesId ) {\n\t\t\t\t\thasResolved = userCanEditGlobalStyles\n\t\t\t\t\t\t? hasFinishedResolution( 'getEditedEntityRecord', [\n\t\t\t\t\t\t\t\t'root',\n\t\t\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t\t  ] )\n\t\t\t\t\t\t: hasFinishedResolution( 'getEntityRecord', [\n\t\t\t\t\t\t\t\t'root',\n\t\t\t\t\t\t\t\t'globalStyles',\n\t\t\t\t\t\t\t\t_globalStylesId,\n\t\t\t\t\t\t\t\t{ context: 'view' },\n\t\t\t\t\t\t  ] );\n\t\t\t\t} else {\n\t\t\t\t\thasResolved = true;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\tglobalStylesId: _globalStylesId,\n\t\t\t\tisReady: hasResolved,\n\t\t\t\tsettings: record?.settings,\n\t\t\t\tstyles: record?.styles,\n\t\t\t\t_links: record?._links,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\tconst { getEditedEntityRecord } = useSelect( coreStore );\n\tconst { editEntityRecord } = useDispatch( coreStore );\n\n\tconst config = useMemo( () => {\n\t\treturn {\n\t\t\tsettings: settings ?? {},\n\t\t\tstyles: styles ?? {},\n\t\t\t_links: _links ?? {},\n\t\t};\n\t}, [ settings, styles, _links ] );\n\n\tconst setConfig = useCallback(\n\t\t( callbackOrObject, options = {} ) => {\n\t\t\tconst record = getEditedEntityRecord(\n\t\t\t\t'root',\n\t\t\t\t'globalStyles',\n\t\t\t\tglobalStylesId\n\t\t\t);\n\n\t\t\tconst currentConfig = {\n\t\t\t\tstyles: record?.styles ?? {},\n\t\t\t\tsettings: record?.settings ?? {},\n\t\t\t\t_links: record?._links ?? {},\n\t\t\t};\n\n\t\t\tconst updatedConfig =\n\t\t\t\ttypeof callbackOrObject === 'function'\n\t\t\t\t\t? callbackOrObject( currentConfig )\n\t\t\t\t\t: callbackOrObject;\n\n\t\t\teditEntityRecord(\n\t\t\t\t'root',\n\t\t\t\t'globalStyles',\n\t\t\t\tglobalStylesId,\n\t\t\t\t{\n\t\t\t\t\tstyles: cleanEmptyObject( updatedConfig.styles ) || {},\n\t\t\t\t\tsettings: cleanEmptyObject( updatedConfig.settings ) || {},\n\t\t\t\t\t_links: cleanEmptyObject( updatedConfig._links ) || {},\n\t\t\t\t},\n\t\t\t\toptions\n\t\t\t);\n\t\t},\n\t\t[ globalStylesId, editEntityRecord, getEditedEntityRecord ]\n\t);\n\n\treturn [ isReady, config, setConfig ];\n}\n\n/**\n * Hook to fetch base/theme global styles config\n */\nfunction useGlobalStylesBaseConfig() {\n\tconst baseConfig = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).__experimentalGetCurrentThemeBaseGlobalStyles(),\n\t\t[]\n\t);\n\treturn [ !! baseConfig, baseConfig ];\n}\n\n/**\n * Hook to get merged global styles configuration\n *\n * @return {Object} Object containing merged, base, user configs and setUser function\n *                  { merged, base, user, setUser }\n */\nexport function useGlobalStyles() {\n\tconst [ isUserConfigReady, userConfig, setUserConfig ] =\n\t\tuseGlobalStylesUserConfig();\n\tconst [ isBaseConfigReady, baseConfig ] = useGlobalStylesBaseConfig();\n\n\tconst merged = useMemo( () => {\n\t\tif ( ! isUserConfigReady || ! isBaseConfigReady ) {\n\t\t\treturn {};\n\t\t}\n\t\treturn mergeGlobalStyles( baseConfig || {}, userConfig );\n\t}, [ isUserConfigReady, isBaseConfigReady, baseConfig, userConfig ] );\n\n\treturn {\n\t\tmerged,\n\t\tbase: baseConfig || {},\n\t\tuser: userConfig,\n\t\tsetUser: setUserConfig,\n\t\tisReady: isUserConfigReady && isBaseConfigReady,\n\t};\n}\n\n/**\n * Hook to get a style value from global styles\n *\n * @param {string} path      Style path (e.g., 'color.background')\n * @param {string} blockName Optional block name\n * @return {*} Style value\n */\nexport function useStyle( path, blockName ) {\n\tconst { merged } = useGlobalStyles();\n\treturn useMemo(\n\t\t() => getStyle( merged, path, blockName ),\n\t\t[ merged, path, blockName ]\n\t);\n}\n\n/**\n * Hook to get a setting value from global styles\n *\n * @param {string} path      Setting path (e.g., 'spacing.blockGap')\n * @param {string} blockName Optional block name\n * @return {*} Setting value\n */\nexport function useSetting( path, blockName ) {\n\tconst { merged } = useGlobalStyles();\n\treturn useMemo(\n\t\t() => getSetting( merged, path, blockName ),\n\t\t[ merged, path, blockName ]\n\t);\n}\n"],
+  "mappings": "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",
+  "names": ["blockEditorPrivateApis", "getEditedEntityRecord", "coreStore"]
+}

package/build/components/global-styles/index.js

@@ -0,0 +1,138 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var global_styles_exports = {};
+__export(global_styles_exports, {
+  default: () => GlobalStylesUIWrapper,
+  useGlobalStyles: () => import_hooks2.useGlobalStyles,
+  useSetting: () => import_hooks2.useSetting,
+  useStyle: () => import_hooks2.useStyle
+});
+module.exports = __toCommonJS(global_styles_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_core_data = require("@wordpress/core-data");
+var import_data = require("@wordpress/data");
+var import_element = require("@wordpress/element");
+var import_global_styles_ui = require("@wordpress/global-styles-ui");
+var import_media_utils = require("@wordpress/media-utils");
+var import_store = require("../../store");
+var import_block_link = require("./block-link");
+var import_hooks = require("./hooks");
+var import_hooks2 = require("./hooks");
+function useServerData() {
+  const {
+    styles,
+    __unstableResolvedAssets,
+    colors,
+    gradients,
+    __experimentalDiscussionSettings,
+    mediaUploadHandler,
+    fontLibraryEnabled
+  } = (0, import_data.useSelect)((select) => {
+    const { getEditorSettings } = select(import_store.store);
+    const { canUser } = select(import_core_data.store);
+    const editorSettings = getEditorSettings();
+    const canUserUploadMedia = canUser("create", {
+      kind: "root",
+      name: "media"
+    });
+    return {
+      styles: editorSettings?.styles || [],
+      __unstableResolvedAssets: editorSettings?.__unstableResolvedAssets || {},
+      colors: editorSettings?.colors || [],
+      gradients: editorSettings?.gradients || [],
+      __experimentalDiscussionSettings: editorSettings?.__experimentalDiscussionSettings,
+      mediaUploadHandler: canUserUploadMedia ? import_media_utils.uploadMedia : void 0,
+      fontLibraryEnabled: editorSettings?.fontLibraryEnabled ?? true
+    };
+  }, []);
+  const serverCSS = (0, import_element.useMemo)(() => {
+    if (!styles) {
+      return [];
+    }
+    return styles.filter((style) => !style.isGlobalStyles);
+  }, [styles]);
+  const serverSettings = (0, import_element.useMemo)(() => {
+    return {
+      __unstableResolvedAssets,
+      settings: {
+        color: {
+          palette: {
+            theme: colors
+          },
+          gradients: {
+            theme: gradients
+          },
+          duotone: {
+            theme: []
+          }
+        }
+      },
+      __experimentalDiscussionSettings,
+      mediaUpload: mediaUploadHandler
+    };
+  }, [
+    __unstableResolvedAssets,
+    colors,
+    gradients,
+    __experimentalDiscussionSettings,
+    mediaUploadHandler
+  ]);
+  return { serverCSS, serverSettings, fontLibraryEnabled };
+}
+function GlobalStylesUIWrapper({ path, onPathChange }) {
+  const {
+    user: userConfig,
+    base: baseConfig,
+    setUser: setUserConfig,
+    isReady
+  } = (0, import_hooks.useGlobalStyles)();
+  const { serverCSS, serverSettings, fontLibraryEnabled } = useServerData();
+  if (!isReady) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_global_styles_ui.GlobalStylesUI,
+      {
+        value: userConfig,
+        baseValue: baseConfig || {},
+        onChange: setUserConfig,
+        path,
+        onPathChange,
+        fontLibraryEnabled,
+        serverCSS,
+        serverSettings
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_block_link.GlobalStylesBlockLink,
+      {
+        path,
+        onPathChange
+      }
+    )
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useGlobalStyles,
+  useSetting,
+  useStyle
+});
+//# sourceMappingURL=index.js.map