@wordpress/global-styles-ui 1.1.0 → 1.2.0

package/build-module/variations/variations-panel.js

@@ -1,9 +1,10 @@
-import { jsx } from "react/jsx-runtime";
+// packages/global-styles-ui/src/variations/variations-panel.tsx
 import { store as blocksStore } from "@wordpress/blocks";
 import { useSelect } from "@wordpress/data";
 import { __experimentalItemGroup as ItemGroup } from "@wordpress/components";
 import { NavigationButtonAsItem } from "../navigation-button";
 import { useSetting } from "../hooks";
+import { jsx } from "react/jsx-runtime";
 function getFilteredBlockStyles(blockStyles, variations) {
   return blockStyles?.filter(
     (style) => style.source === "block" || variations.includes(style.name)

package/build-module/variations/variations-panel.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/variations/variations-panel.tsx"],
   "sourcesContent": ["/**\n * WordPress dependencies\n */\n// @ts-expect-error: Not typed yet.\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { useSelect } from '@wordpress/data';\nimport { __experimentalItemGroup as ItemGroup } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { NavigationButtonAsItem } from '../navigation-button';\nimport { useSetting } from '../hooks';\n\ninterface BlockStyle {\n\tname: string;\n\tlabel: string;\n\tsource?: string;\n\tisDefault?: boolean;\n}\n\ninterface VariationsPanelProps {\n\tname: string;\n}\n\n// Only core block styles (source === block) or block styles with a matching\n// theme.json style variation will be configurable via Global Styles.\nfunction getFilteredBlockStyles(\n\tblockStyles: BlockStyle[],\n\tvariations: string[]\n): BlockStyle[] {\n\treturn (\n\t\tblockStyles?.filter(\n\t\t\t( style ) =>\n\t\t\t\tstyle.source === 'block' || variations.includes( style.name )\n\t\t) || []\n\t);\n}\n\nexport function useBlockVariations( name: string ): BlockStyle[] {\n\tconst blockStyles = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockStyles } = select( blocksStore );\n\t\t\treturn getBlockStyles( name );\n\t\t},\n\t\t[ name ]\n\t);\n\tconst [ variations ] = useSetting( 'variations', name );\n\tconst variationNames = Object.keys( variations ?? {} );\n\n\treturn getFilteredBlockStyles( blockStyles, variationNames );\n}\n\nexport function VariationsPanel( { name }: VariationsPanelProps ) {\n\tconst coreBlockStyles = useBlockVariations( name );\n\n\treturn (\n\t\t<ItemGroup isBordered isSeparated>\n\t\t\t{ coreBlockStyles.map( ( style, index ) => {\n\t\t\t\tif ( style?.isDefault ) {\n\t\t\t\t\treturn null;\n\t\t\t\t}\n\t\t\t\treturn (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\tpath={\n\t\t\t\t\t\t\t'/blocks/' +\n\t\t\t\t\t\t\tencodeURIComponent( name ) +\n\t\t\t\t\t\t\t'/variations/' +\n\t\t\t\t\t\t\tencodeURIComponent( style.name )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{ style.label }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ItemGroup>\n\t);\n}\n"],
-  "mappings": "AA+DK;AA3DL,SAAS,SAAS,mBAAmB;AACrC,SAAS,iBAAiB;AAC1B,SAAS,2BAA2B,iBAAiB;AAKrD,SAAS,8BAA8B;AACvC,SAAS,kBAAkB;AAe3B,SAAS,uBACR,aACA,YACe;AACf,SACC,aAAa;AAAA,IACZ,CAAE,UACD,MAAM,WAAW,WAAW,WAAW,SAAU,MAAM,IAAK;AAAA,EAC9D,KAAK,CAAC;AAER;AAEO,SAAS,mBAAoB,MAA6B;AAChE,QAAM,cAAc;AAAA,IACnB,CAAE,WAAY;AACb,YAAM,EAAE,eAAe,IAAI,OAAQ,WAAY;AAC/C,aAAO,eAAgB,IAAK;AAAA,IAC7B;AAAA,IACA,CAAE,IAAK;AAAA,EACR;AACA,QAAM,CAAE,UAAW,IAAI,WAAY,cAAc,IAAK;AACtD,QAAM,iBAAiB,OAAO,KAAM,cAAc,CAAC,CAAE;AAErD,SAAO,uBAAwB,aAAa,cAAe;AAC5D;AAEO,SAAS,gBAAiB,EAAE,KAAK,GAA0B;AACjE,QAAM,kBAAkB,mBAAoB,IAAK;AAEjD,SACC,oBAAC,aAAU,YAAU,MAAC,aAAW,MAC9B,0BAAgB,IAAK,CAAE,OAAO,UAAW;AAC1C,QAAK,OAAO,WAAY;AACvB,aAAO;AAAA,IACR;AACA,WACC;AAAA,MAAC;AAAA;AAAA,QAEA,MACC,aACA,mBAAoB,IAAK,IACzB,iBACA,mBAAoB,MAAM,IAAK;AAAA,QAG9B,gBAAM;AAAA;AAAA,MARF;AAAA,IASP;AAAA,EAEF,CAAE,GACH;AAEF;",
+  "mappings": ";AAIA,SAAS,SAAS,mBAAmB;AACrC,SAAS,iBAAiB;AAC1B,SAAS,2BAA2B,iBAAiB;AAKrD,SAAS,8BAA8B;AACvC,SAAS,kBAAkB;AAmDtB;AApCL,SAAS,uBACR,aACA,YACe;AACf,SACC,aAAa;AAAA,IACZ,CAAE,UACD,MAAM,WAAW,WAAW,WAAW,SAAU,MAAM,IAAK;AAAA,EAC9D,KAAK,CAAC;AAER;AAEO,SAAS,mBAAoB,MAA6B;AAChE,QAAM,cAAc;AAAA,IACnB,CAAE,WAAY;AACb,YAAM,EAAE,eAAe,IAAI,OAAQ,WAAY;AAC/C,aAAO,eAAgB,IAAK;AAAA,IAC7B;AAAA,IACA,CAAE,IAAK;AAAA,EACR;AACA,QAAM,CAAE,UAAW,IAAI,WAAY,cAAc,IAAK;AACtD,QAAM,iBAAiB,OAAO,KAAM,cAAc,CAAC,CAAE;AAErD,SAAO,uBAAwB,aAAa,cAAe;AAC5D;AAEO,SAAS,gBAAiB,EAAE,KAAK,GAA0B;AACjE,QAAM,kBAAkB,mBAAoB,IAAK;AAEjD,SACC,oBAAC,aAAU,YAAU,MAAC,aAAW,MAC9B,0BAAgB,IAAK,CAAE,OAAO,UAAW;AAC1C,QAAK,OAAO,WAAY;AACvB,aAAO;AAAA,IACR;AACA,WACC;AAAA,MAAC;AAAA;AAAA,QAEA,MACC,aACA,mBAAoB,IAAK,IACzB,iBACA,mBAAoB,MAAM,IAAK;AAAA,QAG9B,gBAAM;AAAA;AAAA,MARF;AAAA,IASP;AAAA,EAEF,CAAE,GACH;AAEF;",
   "names": []
 }

package/build-module/variations/variations-typography.js

@@ -1,4 +1,4 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+// packages/global-styles-ui/src/variations/variations-typography.tsx
 import {
   __experimentalGrid as Grid,
   __experimentalVStack as VStack
@@ -7,7 +7,8 @@ import StylesPreviewTypography from "../preview-typography";
 import { useCurrentMergeThemeStyleVariationsWithUserConfig } from "../hooks";
 import { Subtitle } from "../subtitle";
 import Variation from "./variation";
-const propertiesToFilter = ["typography"];
+import { jsx, jsxs } from "react/jsx-runtime";
+var propertiesToFilter = ["typography"];
 function TypographyVariations({
   title,
   gap = 2

package/build-module/variations/variations-typography.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/variations/variations-typography.tsx"],
   "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGrid as Grid,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport StylesPreviewTypography from '../preview-typography';\nimport { useCurrentMergeThemeStyleVariationsWithUserConfig } from '../hooks';\nimport { Subtitle } from '../subtitle';\nimport Variation from './variation';\n\ninterface TypographyVariationsProps {\n\ttitle?: string;\n\tgap?: number;\n}\n\nconst propertiesToFilter = [ 'typography' ];\n\nexport default function TypographyVariations( {\n\ttitle,\n\tgap = 2,\n}: TypographyVariationsProps ) {\n\tconst typographyVariations =\n\t\tuseCurrentMergeThemeStyleVariationsWithUserConfig( propertiesToFilter );\n\n\t// Return null if there is only one variation (the default).\n\tif ( typographyVariations?.length <= 1 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<VStack spacing={ 3 }>\n\t\t\t{ title && <Subtitle level={ 3 }>{ title }</Subtitle> }\n\t\t\t<Grid\n\t\t\t\tcolumns={ 3 }\n\t\t\t\tgap={ gap }\n\t\t\t\tclassName=\"global-styles-ui-style-variations-container\"\n\t\t\t>\n\t\t\t\t{ typographyVariations.map(\n\t\t\t\t\t( variation: any, index: number ) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<Variation\n\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t\tproperties={ propertiesToFilter }\n\t\t\t\t\t\t\t\tshowTooltip\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<StylesPreviewTypography\n\t\t\t\t\t\t\t\t\t\tvariation={ variation }\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</Variation>\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t</Grid>\n\t\t</VStack>\n\t);\n}\n"],
-  "mappings": "AAoCE,SACY,KADZ;AAjCF;AAAA,EACC,sBAAsB;AAAA,EACtB,wBAAwB;AAAA,OAClB;AAKP,OAAO,6BAA6B;AACpC,SAAS,yDAAyD;AAClE,SAAS,gBAAgB;AACzB,OAAO,eAAe;AAOtB,MAAM,qBAAqB,CAAE,YAAa;AAE3B,SAAR,qBAAuC;AAAA,EAC7C;AAAA,EACA,MAAM;AACP,GAA+B;AAC9B,QAAM,uBACL,kDAAmD,kBAAmB;AAGvE,MAAK,sBAAsB,UAAU,GAAI;AACxC,WAAO;AAAA,EACR;AAEA,SACC,qBAAC,UAAO,SAAU,GACf;AAAA,aAAS,oBAAC,YAAS,OAAQ,GAAM,iBAAO;AAAA,IAC1C;AAAA,MAAC;AAAA;AAAA,QACA,SAAU;AAAA,QACV;AAAA,QACA,WAAU;AAAA,QAER,+BAAqB;AAAA,UACtB,CAAE,WAAgB,UAAmB;AACpC,mBACC;AAAA,cAAC;AAAA;AAAA,gBAEA;AAAA,gBACA,YAAa;AAAA,gBACb,aAAW;AAAA,gBAET,gBACD;AAAA,kBAAC;AAAA;AAAA,oBACA;AAAA;AAAA,gBACD;AAAA;AAAA,cARK;AAAA,YAUP;AAAA,UAEF;AAAA,QACD;AAAA;AAAA,IACD;AAAA,KACD;AAEF;",
+  "mappings": ";AAGA;AAAA,EACC,sBAAsB;AAAA,EACtB,wBAAwB;AAAA,OAClB;AAKP,OAAO,6BAA6B;AACpC,SAAS,yDAAyD;AAClE,SAAS,gBAAgB;AACzB,OAAO,eAAe;AAsBpB,SACY,KADZ;AAfF,IAAM,qBAAqB,CAAE,YAAa;AAE3B,SAAR,qBAAuC;AAAA,EAC7C;AAAA,EACA,MAAM;AACP,GAA+B;AAC9B,QAAM,uBACL,kDAAmD,kBAAmB;AAGvE,MAAK,sBAAsB,UAAU,GAAI;AACxC,WAAO;AAAA,EACR;AAEA,SACC,qBAAC,UAAO,SAAU,GACf;AAAA,aAAS,oBAAC,YAAS,OAAQ,GAAM,iBAAO;AAAA,IAC1C;AAAA,MAAC;AAAA;AAAA,QACA,SAAU;AAAA,QACV;AAAA,QACA,WAAU;AAAA,QAER,+BAAqB;AAAA,UACtB,CAAE,WAAgB,UAAmB;AACpC,mBACC;AAAA,cAAC;AAAA;AAAA,gBAEA;AAAA,gBACA,YAAa;AAAA,gBACb,aAAW;AAAA,gBAET,gBACD;AAAA,kBAAC;AAAA;AAAA,oBACA;AAAA;AAAA,gBACD;AAAA;AAAA,cARK;AAAA,YAUP;AAAA,UAEF;AAAA,QACD;AAAA;AAAA,IACD;AAAA,KACD;AAEF;",
   "names": []
 }

package/build-module/with-global-styles-provider.js

@@ -1,5 +1,6 @@
-import { jsx } from "react/jsx-runtime";
+// packages/global-styles-ui/src/with-global-styles-provider.tsx
 import { GlobalStylesProvider } from "./provider";
+import { jsx } from "react/jsx-runtime";
 function withGlobalStylesProvider(Component) {
   return function WrappedComponent({
     value,

package/build-module/with-global-styles-provider.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../src/with-global-styles-provider.tsx"],
   "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport type { GlobalStylesConfig } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport { GlobalStylesProvider } from './provider';\n\ninterface GlobalStylesProviderProps {\n\tvalue: GlobalStylesConfig;\n\tbaseValue: GlobalStylesConfig;\n\tonChange: ( config: GlobalStylesConfig ) => void;\n}\n\n/**\n * Higher-order component that wraps a component with GlobalStylesProvider.\n * This allows components to access GlobalStylesContext without exposing\n * the provider directly in the public API.\n *\n * @param Component - The component to wrap\n * @return A wrapped component that accepts value, baseValue, and onChange props\n */\nexport function withGlobalStylesProvider< P extends object >(\n\tComponent: React.ComponentType< P >\n) {\n\treturn function WrappedComponent( {\n\t\tvalue,\n\t\tbaseValue,\n\t\tonChange,\n\t\t...props\n\t}: P & GlobalStylesProviderProps ) {\n\t\treturn (\n\t\t\t<GlobalStylesProvider\n\t\t\t\tvalue={ value }\n\t\t\t\tbaseValue={ baseValue }\n\t\t\t\tonChange={ onChange }\n\t\t\t>\n\t\t\t\t<Component { ...( props as P ) } />\n\t\t\t</GlobalStylesProvider>\n\t\t);\n\t};\n}\n"],
-  "mappings": "AAuCI;AA/BJ,SAAS,4BAA4B;AAgB9B,SAAS,yBACf,WACC;AACD,SAAO,SAAS,iBAAkB;AAAA,IACjC;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACJ,GAAmC;AAClC,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA,8BAAC,aAAY,GAAK,OAAe;AAAA;AAAA,IAClC;AAAA,EAEF;AACD;",
+  "mappings": ";AAQA,SAAS,4BAA4B;AA+BjC;AAfG,SAAS,yBACf,WACC;AACD,SAAO,SAAS,iBAAkB;AAAA,IACjC;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACJ,GAAmC;AAClC,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA,8BAAC,aAAY,GAAK,OAAe;AAAA;AAAA,IAClC;AAAA,EAEF;AACD;",
   "names": []
 }

package/build-types/block-preview-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"block-preview-panel.d.ts","sourceRoot":"","sources":["../src/block-preview-panel.tsx"],"names":[],"mappings":"AAeA,UAAU,sBAAsB;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,QAAA,MAAM,iBAAiB,yBAGpB,sBAAsB,uCAiExB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"block-preview-panel.d.ts","sourceRoot":"","sources":["../src/block-preview-panel.tsx"],"names":[],"mappings":"AAeA,UAAU,sBAAsB;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,QAAA,MAAM,iBAAiB,GAAK,sBAGzB,sBAAsB,uCAiExB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/build-types/font-library-modal/font-collection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"font-collection.d.ts","sourceRoot":"","sources":["../../src/font-library-modal/font-collection.tsx"],"names":[],"mappings":"AA6DA,iBAAS,cAAc,CAAE,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,+BAghBlD;AAED,eAAe,cAAc,CAAC"}
+{"version":3,"file":"font-collection.d.ts","sourceRoot":"","sources":["../../src/font-library-modal/font-collection.tsx"],"names":[],"mappings":"AA6DA,iBAAS,cAAc,CAAE,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,+BA+gBlD;AAED,eAAe,cAAc,CAAC"}

package/build-types/font-library-modal/google-fonts-confirm-dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"google-fonts-confirm-dialog.d.ts","sourceRoot":"","sources":["../../src/font-library-modal/google-fonts-confirm-dialog.tsx"],"names":[],"mappings":"AAaA,iBAAS,wBAAwB,IAAI,GAAG,CAAC,OAAO,CAyC/C;AAED,eAAe,wBAAwB,CAAC"}
+{"version":3,"file":"google-fonts-confirm-dialog.d.ts","sourceRoot":"","sources":["../../src/font-library-modal/google-fonts-confirm-dialog.tsx"],"names":[],"mappings":"AAaA,iBAAS,wBAAwB,IAAI,GAAG,CAAC,OAAO,CAwC/C;AAED,eAAe,wBAAwB,CAAC"}

package/build-types/font-library-modal/resolvers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"resolvers.d.ts","sourceRoot":"","sources":["../../src/font-library-modal/resolvers.tsx"],"names":[],"mappings":"AAQA;;GAEG;AACH,OAAO,KAAK,EAGX,cAAc,EACd,QAAQ,EACR,MAAM,SAAS,CAAC;AAKjB,wBAAsB,sBAAsB,CAAE,IAAI,EAAE,QAAQ;;;;;;;;;;;;;;;GAY3D;AAED,wBAAsB,oBAAoB,CACzC,YAAY,EAAE,MAAM,EACpB,IAAI,EAAE,QAAQ,GACZ,OAAO,CAAE,QAAQ,CAAE,CAWrB;AAED,wBAAsB,wBAAwB,CAAE,IAAI,EAAE,MAAM;;;;;;;;;;;;;;;UAoB3D;AAED,wBAAsB,wBAAwB,CAC7C,YAAY,EAAE,MAAM,GAClB,OAAO,CAAE;IACX,OAAO,EAAE,OAAO,CAAC;CACjB,CAAE,CAMF;AAED,wBAAsB,oBAAoB,8BAMzC;AAED,wBAAsB,mBAAmB,CAAE,EAAE,EAAE,MAAM,2BAMpD"}
+{"version":3,"file":"resolvers.d.ts","sourceRoot":"","sources":["../../src/font-library-modal/resolvers.tsx"],"names":[],"mappings":"AAKA;;GAEG;AACH,OAAO,KAAK,EAGX,cAAc,EACd,QAAQ,EACR,MAAM,SAAS,CAAC;AAKjB,wBAAsB,sBAAsB,CAAE,IAAI,EAAE,QAAQ;;;;;;;;;;;;;;;GAY3D;AAED,wBAAsB,oBAAoB,CACzC,YAAY,EAAE,MAAM,EACpB,IAAI,EAAE,QAAQ,GACZ,OAAO,CAAE,QAAQ,CAAE,CAWrB;AAED,wBAAsB,wBAAwB,CAAE,IAAI,EAAE,MAAM;;;;;;;;;;;;;;;UAoB3D;AAED,wBAAsB,wBAAwB,CAC7C,YAAY,EAAE,MAAM,GAClB,OAAO,CAAE;IACX,OAAO,EAAE,OAAO,CAAC;CACjB,CAAE,CAMF;AAED,wBAAsB,oBAAoB,8BAMzC;AAED,wBAAsB,mBAAmB,CAAE,EAAE,EAAE,MAAM,2BAMpD"}

package/build-types/font-library-modal/upload-fonts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"upload-fonts.d.ts","sourceRoot":"","sources":["../../src/font-library-modal/upload-fonts.tsx"],"names":[],"mappings":"AA2BA,iBAAS,WAAW,gCA+OnB;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"upload-fonts.d.ts","sourceRoot":"","sources":["../../src/font-library-modal/upload-fonts.tsx"],"names":[],"mappings":"AA2BA,iBAAS,WAAW,gCA8OnB;AAED,eAAe,WAAW,CAAC"}

package/build-types/font-library-modal/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/font-library-modal/utils/index.ts"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AASvE,wBAAgB,iBAAiB,CAChC,IAAI,EAAE,UAAU,EAChB,WAAW,GAAE,OAAO,CAAE,UAAU,CAAO,GACrC,UAAU,CAQZ;AAED,wBAAgB,YAAY,CAAE,GAAG,EAAE,MAAM,GAAI,OAAO,CAKnD;AAED,wBAAgB,sBAAsB,CAAE,IAAI,EAAE,QAAQ,GAAI,MAAM,CAO/D;AAED,wBAAgB,cAAc,CAC7B,QAAQ,GAAE,QAAQ,EAAO,EACzB,QAAQ,GAAE,QAAQ,EAAO,GACvB,QAAQ,EAAE,CAUZ;AAED,wBAAgB,iBAAiB,CAChC,QAAQ,GAAE,UAAU,EAAO,EAC3B,QAAQ,GAAE,UAAU,EAAO,GACzB,UAAU,EAAE,CA0Bd;AAMD,wBAAsB,qBAAqB,CAC1C,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,GAAG,IAAI,EACrB,KAAK,GAAE,KAAK,GAAG,UAAU,GAAG,QAAgB,GAC1C,OAAO,CAAE,IAAI,CAAE,CAmCjB;AAWD,wBAAgB,uBAAuB,CACtC,QAAQ,EAAE,QAAQ,EAClB,UAAU,GAAE,KAAK,GAAG,UAAU,GAAG,QAAgB,GAC/C,IAAI,CAyBN;AAED;;;;;GAKG;AACH,wBAAgB,yBAAyB,CACxC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,GACtB,MAAM,GAAG,SAAS,CAmBpB;AAED,wBAAgB,sBAAsB,CAAE,UAAU,EAAE,UAAU,GAAI,QAAQ,CAezE;AAED,wBAAgB,qBAAqB,CAAE,IAAI,EAAE,UAAU,GAAI,QAAQ,EAAE,CAgCpE;AAED,wBAAsB,qBAAqB,CAC1C,YAAY,EAAE,MAAM,EACpB,aAAa,EAAE,QAAQ,EAAE,GACvB,OAAO,CAAE,gBAAgB,CAAE,CAgD7B;AAKD,wBAAsB,sBAAsB,CAC3C,GAAG,EAAE,MAAM,GAAG,MAAM,EAAE,GACpB,OAAO,CAAE,IAAI,GAAG,IAAI,EAAE,CAAE,CA2B1B;AAUD,wBAAgB,sBAAsB,CACrC,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,QAAQ,EAAE,GACpB,OAAO,CAUT"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/font-library-modal/utils/index.ts"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AASvE,wBAAgB,iBAAiB,CAChC,IAAI,EAAE,UAAU,EAChB,WAAW,GAAE,OAAO,CAAE,UAAU,CAAO,GACrC,UAAU,CAQZ;AAED,wBAAgB,YAAY,CAAE,GAAG,EAAE,MAAM,GAAI,OAAO,CAKnD;AAED,wBAAgB,sBAAsB,CAAE,IAAI,EAAE,QAAQ,GAAI,MAAM,CAO/D;AAED,wBAAgB,cAAc,CAC7B,QAAQ,GAAE,QAAQ,EAAO,EACzB,QAAQ,GAAE,QAAQ,EAAO,GACvB,QAAQ,EAAE,CAUZ;AAED,wBAAgB,iBAAiB,CAChC,QAAQ,GAAE,UAAU,EAAO,EAC3B,QAAQ,GAAE,UAAU,EAAO,GACzB,UAAU,EAAE,CA0Bd;AAMD,wBAAsB,qBAAqB,CAC1C,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,GAAG,IAAI,EACrB,KAAK,GAAE,KAAK,GAAG,UAAU,GAAG,QAAgB,GAC1C,OAAO,CAAE,IAAI,CAAE,CAkCjB;AAWD,wBAAgB,uBAAuB,CACtC,QAAQ,EAAE,QAAQ,EAClB,UAAU,GAAE,KAAK,GAAG,UAAU,GAAG,QAAgB,GAC/C,IAAI,CAyBN;AAED;;;;;GAKG;AACH,wBAAgB,yBAAyB,CACxC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,GACtB,MAAM,GAAG,SAAS,CAmBpB;AAED,wBAAgB,sBAAsB,CAAE,UAAU,EAAE,UAAU,GAAI,QAAQ,CAczE;AAED,wBAAgB,qBAAqB,CAAE,IAAI,EAAE,UAAU,GAAI,QAAQ,EAAE,CAgCpE;AAED,wBAAsB,qBAAqB,CAC1C,YAAY,EAAE,MAAM,EACpB,aAAa,EAAE,QAAQ,EAAE,GACvB,OAAO,CAAE,gBAAgB,CAAE,CAgD7B;AAKD,wBAAsB,sBAAsB,CAC3C,GAAG,EAAE,MAAM,GAAG,MAAM,EAAE,GACpB,OAAO,CAAE,IAAI,GAAG,IAAI,EAAE,CAAE,CA2B1B;AAUD,wBAAgB,sBAAsB,CACrC,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,QAAQ,EAAE,GACpB,OAAO,CAUT"}

package/build-types/global-styles-ui.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"global-styles-ui.d.ts","sourceRoot":"","sources":["../src/global-styles-ui.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EACX,kBAAkB,EAElB,MAAM,iCAAiC,CAAC;AAgFzC,UAAU,mBAAmB;IAC5B,mDAAmD;IACnD,KAAK,EAAE,kBAAkB,CAAC;IAC1B,gDAAgD;IAChD,SAAS,EAAE,kBAAkB,CAAC;IAC9B,yCAAyC;IACzC,QAAQ,EAAE,CAAE,QAAQ,EAAE,kBAAkB,KAAM,IAAI,CAAC;IACnD,yCAAyC;IACzC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,YAAY,CAAC,EAAE,CAAE,IAAI,EAAE,MAAM,KAAM,IAAI,CAAC;IACxC,iDAAiD;IACjD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,2DAA2D;IAC3D,SAAS,CAAC,EAAE;QAAE,cAAc,CAAC,EAAE,OAAO,CAAA;KAAE,EAAE,CAAC;IAC3C,yDAAyD;IACzD,cAAc,CAAC,EAAE;QAAE,wBAAwB,EAAE,MAAM,CAAE,MAAM,EAAE,OAAO,CAAE,CAAA;KAAE,CAAC;CACzE;AAED,wBAAgB,cAAc,CAAE,EAC/B,KAAK,EACL,SAAS,EACT,QAAQ,EACR,IAAI,EACJ,YAAY,EACZ,kBAA0B,EAC1B,SAAS,EACT,cAAc,GACd,EAAE,mBAAmB,+BA4HrB"}
+{"version":3,"file":"global-styles-ui.d.ts","sourceRoot":"","sources":["../src/global-styles-ui.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EACX,kBAAkB,EAElB,MAAM,iCAAiC,CAAC;AAuFzC,UAAU,mBAAmB;IAC5B,mDAAmD;IACnD,KAAK,EAAE,kBAAkB,CAAC;IAC1B,gDAAgD;IAChD,SAAS,EAAE,kBAAkB,CAAC;IAC9B,yCAAyC;IACzC,QAAQ,EAAE,CAAE,QAAQ,EAAE,kBAAkB,KAAM,IAAI,CAAC;IACnD,yCAAyC;IACzC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,YAAY,CAAC,EAAE,CAAE,IAAI,EAAE,MAAM,KAAM,IAAI,CAAC;IACxC,iDAAiD;IACjD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,2DAA2D;IAC3D,SAAS,CAAC,EAAE;QAAE,cAAc,CAAC,EAAE,OAAO,CAAA;KAAE,EAAE,CAAC;IAC3C,yDAAyD;IACzD,cAAc,CAAC,EAAE;QAAE,wBAAwB,EAAE,MAAM,CAAE,MAAM,EAAE,OAAO,CAAE,CAAA;KAAE,CAAC;CACzE;AAED,wBAAgB,cAAc,CAAE,EAC/B,KAAK,EACL,SAAS,EACT,QAAQ,EACR,IAAI,EACJ,YAAY,EACZ,kBAA0B,EAC1B,SAAS,EACT,cAAc,GACd,EAAE,mBAAmB,+BA4HrB"}

package/build-types/preview-colors.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"preview-colors.d.ts","sourceRoot":"","sources":["../src/preview-colors.tsx"],"names":[],"mappings":"AAyBA,UAAU,wBAAwB;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,mBAAmB,yCAItB,wBAAwB,gCA8B1B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"preview-colors.d.ts","sourceRoot":"","sources":["../src/preview-colors.tsx"],"names":[],"mappings":"AAyBA,UAAU,wBAAwB;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,mBAAmB,GAAK,sCAI3B,wBAAwB,gCA8B1B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/build-types/preview-typography.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"preview-typography.d.ts","sourceRoot":"","sources":["../src/preview-typography.tsx"],"names":[],"mappings":"AAWA,UAAU,4BAA4B;IACrC,SAAS,EAAE,GAAG,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,uBAAuB,6CAI1B,4BAA4B,gCAyB9B,CAAC;AAEF,eAAe,uBAAuB,CAAC"}
+{"version":3,"file":"preview-typography.d.ts","sourceRoot":"","sources":["../src/preview-typography.tsx"],"names":[],"mappings":"AAWA,UAAU,4BAA4B;IACrC,SAAS,EAAE,GAAG,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,uBAAuB,GAAK,0CAI/B,4BAA4B,gCAyB9B,CAAC;AAEF,eAAe,uBAAuB,CAAC"}

package/build-types/screen-block-list.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"screen-block-list.d.ts","sourceRoot":"","sources":["../src/screen-block-list.tsx"],"names":[],"mappings":"AAoEA,wBAAgB,uBAAuB,CAAE,SAAS,EAAE,MAAM,OAezD;AAyFD,iBAAS,eAAe,gCAuBvB;AAED,eAAe,eAAe,CAAC"}
+{"version":3,"file":"screen-block-list.d.ts","sourceRoot":"","sources":["../src/screen-block-list.tsx"],"names":[],"mappings":"AAoEA,wBAAgB,uBAAuB,CAAE,SAAS,EAAE,MAAM,OAezD;AAwFD,iBAAS,eAAe,gCAuBvB;AAED,eAAe,eAAe,CAAC"}

package/build-types/screen-css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"screen-css.d.ts","sourceRoot":"","sources":["../src/screen-css.tsx"],"names":[],"mappings":"AAkBA,iBAAS,SAAS,gCAmCjB;AAED,eAAe,SAAS,CAAC"}
+{"version":3,"file":"screen-css.d.ts","sourceRoot":"","sources":["../src/screen-css.tsx"],"names":[],"mappings":"AAkBA,iBAAS,SAAS,gCAyCjB;AAED,eAAe,SAAS,CAAC"}

package/build-types/screen-root.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"screen-root.d.ts","sourceRoot":"","sources":["../src/screen-root.tsx"],"names":[],"mappings":"AA4BA,iBAAS,UAAU,gCAmHlB;AAED,eAAe,UAAU,CAAC"}
+{"version":3,"file":"screen-root.d.ts","sourceRoot":"","sources":["../src/screen-root.tsx"],"names":[],"mappings":"AA2BA,iBAAS,UAAU,gCAmElB;AAED,eAAe,UAAU,CAAC"}

package/build-types/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAE1E;;;;;;GAMG;AACH,wBAAgB,0BAA0B,CACzC,MAAM,EAAE,GAAG,EACX,UAAU,EAAE,MAAM,EAAE,GAClB,GAAG,CAqBL;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,wBAAwB,WAC5B,GAAG,cACC,MAAM,EAAE,KAClB,GAoBF,CAAC;AAEF;;;;;;;GAOG;AACH,wBAAgB,yBAAyB,CACxC,SAAS,EAAE,kBAAkB,EAC7B,UAAU,EAAE,MAAM,EAAE,GAClB,OAAO,CAOT;AAeD;;;;;GAKG;AACH,wBAAgB,eAAe,CAAE,SAAS,EAAE,GAAG,GAAI,CAAE,GAAG,EAAE,GAAG,CAAE,CAkC9D;AA4CD,wBAAgB,gBAAgB,CAAE,KAAK,EAAE,MAAM,GAAI,MAAM,CAwBxD;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAE,MAAM,EAAE,GAAG,GAAI,KAAK,CAAC,aAAa,CAkCxE;AAED;;;;;;;;;GASG;AACH;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAE,SAAS,EAAE,MAAM,GAAI,MAAM,CAKjE;AAED,wBAAgB,sBAAsB,CACrC,OAAO,EAAE,GAAG,EAAE,EACd,UAAU,EAAE,MAAM,GAChB,MAAM,CAeR"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAE1E;;;;;;GAMG;AACH,wBAAgB,0BAA0B,CACzC,MAAM,EAAE,GAAG,EACX,UAAU,EAAE,MAAM,EAAE,GAClB,GAAG,CAqBL;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,wBAAwB,GACpC,QAAQ,GAAG,EACX,YAAY,MAAM,EAAE,KAClB,GAoBF,CAAC;AAEF;;;;;;;GAOG;AACH,wBAAgB,yBAAyB,CACxC,SAAS,EAAE,kBAAkB,EAC7B,UAAU,EAAE,MAAM,EAAE,GAClB,OAAO,CAOT;AAeD;;;;;GAKG;AACH,wBAAgB,eAAe,CAAE,SAAS,EAAE,GAAG,GAAI,CAAE,GAAG,EAAE,GAAG,CAAE,CAkC9D;AA4CD,wBAAgB,gBAAgB,CAAE,KAAK,EAAE,MAAM,GAAI,MAAM,CAwBxD;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAE,MAAM,EAAE,GAAG,GAAI,KAAK,CAAC,aAAa,CAkCxE;AAED;;;;;;;;;GASG;AACH;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAE,SAAS,EAAE,MAAM,GAAI,MAAM,CAKjE;AAED,wBAAgB,sBAAsB,CACrC,OAAO,EAAE,GAAG,EAAE,EACd,UAAU,EAAE,MAAM,GAChB,MAAM,CAeR"}

package/build-types/with-global-styles-provider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"with-global-styles-provider.d.ts","sourceRoot":"","sources":["../src/with-global-styles-provider.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAO1E,UAAU,yBAAyB;IAClC,KAAK,EAAE,kBAAkB,CAAC;IAC1B,SAAS,EAAE,kBAAkB,CAAC;IAC9B,QAAQ,EAAE,CAAE,MAAM,EAAE,kBAAkB,KAAM,IAAI,CAAC;CACjD;AAED;;;;;;;GAOG;AACH,wBAAgB,wBAAwB,CAAE,CAAC,SAAS,MAAM,EACzD,SAAS,EAAE,KAAK,CAAC,aAAa,CAAE,CAAC,CAAE,8CAOhC,CAAC,GAAG,yBAAyB,iCAWhC"}
+{"version":3,"file":"with-global-styles-provider.d.ts","sourceRoot":"","sources":["../src/with-global-styles-provider.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAO1E,UAAU,yBAAyB;IAClC,KAAK,EAAE,kBAAkB,CAAC;IAC1B,SAAS,EAAE,kBAAkB,CAAC;IAC9B,QAAQ,EAAE,CAAE,MAAM,EAAE,kBAAkB,KAAM,IAAI,CAAC;CACjD;AAED;;;;;;;GAOG;AACH,wBAAgB,wBAAwB,CAAE,CAAC,SAAS,MAAM,EACzD,SAAS,EAAE,KAAK,CAAC,aAAa,CAAE,CAAC,CAAE,IAED,0CAK/B,CAAC,GAAG,yBAAyB,iCAWhC"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/global-styles-ui",
-	"version": "1.1.0",
+	"version": "1.2.0",
 	"description": "Global Styles UI components for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -36,21 +36,21 @@
 	},
 	"react-native": "src/index",
 	"dependencies": {
-		"@wordpress/a11y": "^4.34.0",
-		"@wordpress/api-fetch": "^7.34.0",
-		"@wordpress/block-editor": "^15.7.0",
-		"@wordpress/blocks": "^15.7.0",
-		"@wordpress/components": "^30.7.0",
-		"@wordpress/compose": "^7.34.0",
-		"@wordpress/core-data": "^7.34.0",
-		"@wordpress/data": "^10.34.0",
-		"@wordpress/date": "^5.34.0",
-		"@wordpress/element": "^6.34.0",
-		"@wordpress/global-styles-engine": "^1.1.0",
-		"@wordpress/i18n": "^6.7.0",
-		"@wordpress/icons": "^11.1.0",
-		"@wordpress/keycodes": "^4.34.0",
-		"@wordpress/private-apis": "^1.34.0",
+		"@wordpress/a11y": "^4.35.0",
+		"@wordpress/api-fetch": "^7.35.0",
+		"@wordpress/block-editor": "^15.8.0",
+		"@wordpress/blocks": "^15.8.0",
+		"@wordpress/components": "^30.8.0",
+		"@wordpress/compose": "^7.35.0",
+		"@wordpress/core-data": "^7.35.0",
+		"@wordpress/data": "^10.35.0",
+		"@wordpress/date": "^5.35.0",
+		"@wordpress/element": "^6.35.0",
+		"@wordpress/global-styles-engine": "^1.2.0",
+		"@wordpress/i18n": "^6.8.0",
+		"@wordpress/icons": "^11.2.0",
+		"@wordpress/keycodes": "^4.35.0",
+		"@wordpress/private-apis": "^1.35.0",
 		"change-case": "^4.1.2",
 		"classnames": "^2.3.2",
 		"clsx": "^2.1.0",
@@ -63,5 +63,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "ceebff807958d2e8fc755b5a20473939c78b4d1d"
+	"gitHead": "77aa1f194edceafe8ac2a1b9438bf84b557e76e3"
 }

package/src/font-library-modal/font-collection.tsx

@@ -226,7 +226,6 @@ function FontCollection( { slug }: { slug: string } ) {
 					} )
 				);
 			}
-			// eslint-disable-next-line @typescript-eslint/no-unused-vars
 		} catch ( error ) {
 			// If any of the fonts fail to download,
 			// show an error notice and stop the request from being sent.

package/src/font-library-modal/google-fonts-confirm-dialog.tsx

@@ -13,7 +13,6 @@ import {
 
 function GoogleFontsConfirmDialog(): JSX.Element {
 	const handleConfirm = (): void => {
-		// eslint-disable-next-line no-undef
 		window.localStorage.setItem(
 			'wp-font-library-google-fonts-permission',
 			'true'

package/src/font-library-modal/resolvers.tsx

@@ -1,9 +1,6 @@
 /**
  * WordPress dependencies
  */
-// The font library modal is pre-existent in Gutenberg
-// It needs to be refactored to move all the API calls to core-data.
-// eslint-disable-next-line no-restricted-imports
 import apiFetch from '@wordpress/api-fetch';
 
 /**

package/src/font-library-modal/upload-fonts.tsx

@@ -132,7 +132,6 @@ function UploadFonts() {
 			const buffer = await readFileAsArrayBuffer( file );
 			await font.fromDataBuffer( buffer, 'font' );
 			return true;
-			// eslint-disable-next-line @typescript-eslint/no-unused-vars
 		} catch ( error ) {
 			return false;
 		}

package/src/font-library-modal/utils/index.ts

@@ -106,7 +106,6 @@ export async function loadFontFaceInBrowser(
 
 	if ( typeof source === 'string' ) {
 		dataSource = `url(${ source })`;
-		// eslint-disable-next-line no-undef
 	} else if ( source instanceof File ) {
 		dataSource = await source.arrayBuffer();
 	} else {
@@ -209,7 +208,6 @@ export function getDisplaySrcFromFontFace(
 export function makeFontFamilyFormData( fontFamily: FontFamily ): FormData {
 	const formData = new FormData();
 
-	// eslint-disable-next-line @typescript-eslint/no-unused-vars
 	const { fontFace, category, ...familyWithValidParameters } = fontFamily;
 	const fontFamilySettings = {
 		...familyWithValidParameters,

package/src/global-styles-ui.tsx

@@ -67,6 +67,11 @@ interface ContextScreensProps {
 	parentMenu?: string;
 }
 
+interface GlobalStylesNavigationScreenProps {
+	path: string;
+	children: React.ReactNode;
+}
+
 function ContextScreens( { name, parentMenu = '' }: ContextScreensProps ) {
 	const blockStyleVariations = useSelect(
 		( select ) => {
@@ -81,9 +86,11 @@ function ContextScreens( { name, parentMenu = '' }: ContextScreensProps ) {
 
 	return (
 		<>
-			<Navigator.Screen path={ parentMenu + '/colors/palette' }>
+			<GlobalStylesNavigationScreen
+				path={ parentMenu + '/colors/palette' }
+			>
 				<ScreenColorPalette name={ name } />
-			</Navigator.Screen>
+			</GlobalStylesNavigationScreen>
 
 			{ !! blockStyleVariations?.length && (
 				<BlockStylesNavigationScreens
@@ -165,72 +172,72 @@ export function GlobalStylesUI( {
 							onPathChange={ onPathChange }
 						/>
 					) }
-					<Navigator.Screen path="/">
+					<GlobalStylesNavigationScreen path="/">
 						<ScreenRoot />
-					</Navigator.Screen>
-					<Navigator.Screen path="/colors">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/colors">
 						<ScreenColors />
-					</Navigator.Screen>
-					<Navigator.Screen path="/typography">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/typography">
 						<ScreenTypography />
-					</Navigator.Screen>
-					<Navigator.Screen path="/typography/font-sizes">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/typography/font-sizes">
 						<FontSizes />
-					</Navigator.Screen>
-					<Navigator.Screen path="/typography/font-sizes/:origin/:slug">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/typography/font-sizes/:origin/:slug">
 						<FontSize />
-					</Navigator.Screen>
-					<Navigator.Screen path="/layout">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/layout">
 						<ScreenLayout />
-					</Navigator.Screen>
-					<Navigator.Screen path="/colors/palette">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/colors/palette">
 						<ScreenColorPalette />
-					</Navigator.Screen>
-					<Navigator.Screen path="/variations">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/variations">
 						<ScreenStyleVariations />
-					</Navigator.Screen>
-					<Navigator.Screen path="/css">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/css">
 						<ScreenCSS />
-					</Navigator.Screen>
-					<Navigator.Screen path="/revisions/:revisionId?">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/revisions/:revisionId?">
 						<ScreenRevisions />
-					</Navigator.Screen>
-					<Navigator.Screen path="/shadows">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/shadows">
 						<ScreenShadows />
-					</Navigator.Screen>
-					<Navigator.Screen path="/shadows/edit/:category/:slug">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/shadows/edit/:category/:slug">
 						<ScreenShadowsEdit />
-					</Navigator.Screen>
-					<Navigator.Screen path="/background">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/background">
 						<ScreenBackground />
-					</Navigator.Screen>
-					<Navigator.Screen path="/typography/text">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/typography/text">
 						<ScreenTypographyElement element="text" />
-					</Navigator.Screen>
-					<Navigator.Screen path="/typography/link">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/typography/link">
 						<ScreenTypographyElement element="link" />
-					</Navigator.Screen>
-					<Navigator.Screen path="/typography/heading">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/typography/heading">
 						<ScreenTypographyElement element="heading" />
-					</Navigator.Screen>
-					<Navigator.Screen path="/typography/caption">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/typography/caption">
 						<ScreenTypographyElement element="caption" />
-					</Navigator.Screen>
-					<Navigator.Screen path="/typography/button">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/typography/button">
 						<ScreenTypographyElement element="button" />
-					</Navigator.Screen>
-					<Navigator.Screen path="/blocks">
+					</GlobalStylesNavigationScreen>
+					<GlobalStylesNavigationScreen path="/blocks">
 						<ScreenBlockList />
-					</Navigator.Screen>
+					</GlobalStylesNavigationScreen>
 					{ blocks.map( ( block: BlockType ) => (
-						<Navigator.Screen
+						<GlobalStylesNavigationScreen
 							key={ 'menu-block-' + block.name }
 							path={
 								'/blocks/' + encodeURIComponent( block.name )
 							}
 						>
 							<ScreenBlock name={ block.name } />
-						</Navigator.Screen>
+						</GlobalStylesNavigationScreen>
 					) ) }
 
 					<ContextScreens />
@@ -250,6 +257,20 @@ export function GlobalStylesUI( {
 	);
 }
 
+function GlobalStylesNavigationScreen( {
+	path,
+	children,
+}: GlobalStylesNavigationScreenProps ) {
+	return (
+		<Navigator.Screen
+			className="global-styles-ui-sidebar__navigator-screen"
+			path={ path }
+		>
+			{ children }
+		</Navigator.Screen>
+	);
+}
+
 /*
  * Component that handles path synchronization between external path prop and Navigator's internal path.
  */

package/src/screen-block-list.tsx

@@ -112,7 +112,6 @@ interface BlockListProps {
 function BlockList( { filterValue }: BlockListProps ) {
 	const sortedBlockTypes = useSortedBlockTypes();
 	const debouncedSpeak = useDebounce( speak, 500 );
-	// @ts-expect-error - useSelect supports single argument calls
 	const { isMatchingSearchTerm } = useSelect( blocksStore );
 
 	const filteredBlockTypes = ! filterValue

package/src/screen-css.tsx

@@ -17,10 +17,6 @@ import { unlock } from './lock-unlock';
 const { AdvancedPanel: StylesAdvancedPanel } = unlock( blockEditorPrivateApis );
 
 function ScreenCSS() {
-	const description = __(
-		'Add your own CSS to customize the appearance and layout of your site.'
-	);
-
 	// Get user-only styles (should not decode/encode to preserve raw CSS)
 	const [ style ] = useStyle( '', undefined, 'user', false );
 	// Get all styles (inherited + user) for context
@@ -33,16 +29,26 @@ function ScreenCSS() {
 
 	return (
 		<>
-			<ScreenHeader title={ __( 'CSS' ) } description={ description } />
+			<ScreenHeader
+				title={ __( 'Additional CSS' ) }
+				description={
+					<>
+						{ __(
+							'You can add custom CSS to further customize the appearance and layout of your site.'
+						) }
+						<br />
+						<ExternalLink
+							href={ __(
+								'https://developer.wordpress.org/advanced-administration/wordpress/css/'
+							) }
+							className="global-styles-ui-screen-css-help-link"
+						>
+							{ __( 'Learn more about CSS' ) }
+						</ExternalLink>
+					</>
+				}
+			/>
 			<div className="global-styles-ui-screen-css">
-				<ExternalLink
-					href={ __(
-						'https://developer.wordpress.org/advanced-administration/wordpress/css/'
-					) }
-					className="global-styles-ui-screen-css-help-link"
-				>
-					{ __( 'Learn more about CSS' ) }
-				</ExternalLink>
 				<StylesAdvancedPanel
 					value={ style }
 					onChange={ setStyle }

package/src/screen-root.tsx

@@ -16,7 +16,6 @@ import { isRTL, __ } from '@wordpress/i18n';
 import { chevronLeft, chevronRight } from '@wordpress/icons';
 import { useSelect } from '@wordpress/data';
 import { store as coreStore } from '@wordpress/core-data';
-import type { GlobalStylesConfig } from '@wordpress/global-styles-engine';
 
 /**
  * Internal dependencies
@@ -27,26 +26,10 @@ import RootMenu from './root-menu';
 import PreviewStyles from './preview-styles';
 
 function ScreenRoot() {
-	const { hasVariations, canEditCSS } = useSelect( ( select ) => {
-		const {
-			__experimentalGetCurrentThemeGlobalStylesVariations,
-			__experimentalGetCurrentGlobalStylesId,
-			getEntityRecord,
-		} = select( coreStore );
-
-		const globalStylesId = __experimentalGetCurrentGlobalStylesId();
-		const globalStyles = globalStylesId
-			? getEntityRecord( 'root', 'globalStyles', globalStylesId )
-			: undefined;
-
-		return {
-			hasVariations:
-				!! __experimentalGetCurrentThemeGlobalStylesVariations()
-					?.length,
-			canEditCSS: !! ( globalStyles as GlobalStylesConfig )?._links?.[
-				'wp:action-edit-css'
-			],
-		};
+	const hasVariations = useSelect( ( select ) => {
+		const { __experimentalGetCurrentThemeGlobalStylesVariations } =
+			select( coreStore );
+		return !! __experimentalGetCurrentThemeGlobalStylesVariations()?.length;
 	}, [] );
 
 	return (
@@ -107,38 +90,6 @@ function ScreenRoot() {
 					</NavigationButtonAsItem>
 				</ItemGroup>
 			</CardBody>
-
-			{ canEditCSS && (
-				<>
-					<CardDivider />
-					<CardBody>
-						<Spacer
-							as="p"
-							paddingTop={ 2 }
-							paddingX="13px"
-							marginBottom={ 4 }
-						>
-							{ __(
-								'Add your own CSS to customize the appearance and layout of your site.'
-							) }
-						</Spacer>
-						<ItemGroup>
-							<NavigationButtonAsItem path="/css">
-								<HStack justify="space-between">
-									<FlexItem>
-										{ __( 'Additional CSS' ) }
-									</FlexItem>
-									<IconWithCurrentColor
-										icon={
-											isRTL() ? chevronLeft : chevronRight
-										}
-									/>
-								</HStack>
-							</NavigationButtonAsItem>
-						</ItemGroup>
-					</CardBody>
-				</>
-			) }
 		</Card>
 	);
 }