@wordpress/edit-site 5.2.0 → 5.3.0

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

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = exports.GlobalStylesMenuSlot = void 0;
 
 var _element = require("@wordpress/element");
 
@@ -17,6 +17,14 @@ var _blocks = require("@wordpress/blocks");
 
 var _data = require("@wordpress/data");
 
+var _blockEditor = require("@wordpress/block-editor");
+
+var _i18n = require("@wordpress/i18n");
+
+var _preferences = require("@wordpress/preferences");
+
+var _icons = require("@wordpress/icons");
+
 var _screenRoot = _interopRequireDefault(require("./screen-root"));
 
 var _screenBlockList = _interopRequireDefault(require("./screen-block-list"));
@@ -53,6 +61,8 @@ var _styleBook = _interopRequireDefault(require("../style-book"));
 
 var _screenCss = _interopRequireDefault(require("./screen-css"));
 
+var _experiments = require("../../experiments");
+
 /**
  * WordPress dependencies
  */
@@ -60,6 +70,44 @@ var _screenCss = _interopRequireDefault(require("./screen-css"));
 /**
  * Internal dependencies
  */
+const SLOT_FILL_NAME = 'GlobalStylesMenu';
+const {
+  Slot: GlobalStylesMenuSlot,
+  Fill: GlobalStylesMenuFill
+} = (0, _components.createSlotFill)(SLOT_FILL_NAME);
+exports.GlobalStylesMenuSlot = GlobalStylesMenuSlot;
+
+function GlobalStylesActionMenu() {
+  const {
+    toggle
+  } = (0, _data.useDispatch)(_preferences.store);
+  const {
+    useGlobalStylesReset
+  } = (0, _experiments.unlock)(_blockEditor.experiments);
+  const [canReset, onReset] = useGlobalStylesReset();
+  const {
+    goTo
+  } = (0, _components.__experimentalUseNavigator)();
+
+  const loadCustomCSS = () => goTo('/css');
+
+  return (0, _element.createElement)(GlobalStylesMenuFill, null, (0, _element.createElement)(_components.DropdownMenu, {
+    icon: _icons.moreVertical,
+    label: (0, _i18n.__)('More Styles actions'),
+    controls: [{
+      title: (0, _i18n.__)('Reset to defaults'),
+      onClick: onReset,
+      isDisabled: !canReset
+    }, {
+      title: (0, _i18n.__)('Welcome Guide'),
+      onClick: () => toggle('core/edit-site', 'welcomeGuideStyles')
+    }, {
+      title: (0, _i18n.__)('Additional CSS'),
+      onClick: loadCustomCSS
+    }]
+  }));
+}
+
 function GlobalStylesNavigationScreen(_ref) {
   let {
     className,
@@ -88,43 +136,43 @@ function BlockStyleVariationsScreens(_ref2) {
   return blockStyleVariations.map(variation => (0, _element.createElement)(ContextScreens, {
     key: variation.name + name,
     name: name,
-    parentMenu: '/blocks/' + encodeURIComponent(name) + '/variations/' + encodeURIComponent(variation.name)
+    parentMenu: '/blocks/' + encodeURIComponent(name) + '/variations/' + encodeURIComponent(variation.name),
+    variation: variation.name
   }));
 }
 
-function ContextScreens(_ref3) {
+function BlockStylesNavigationScreens(_ref3) {
   let {
-    name,
-    parentMenu = ''
+    parentMenu,
+    blockStyles,
+    blockName
   } = _ref3;
-  const hasVariationPath = parentMenu.search('variations');
-  const variationPath = hasVariationPath !== -1 ? parentMenu.substring(hasVariationPath).replace('/', '.').concat('', '.') : '';
+  return blockStyles.map((style, index) => (0, _element.createElement)(GlobalStylesNavigationScreen, {
+    key: index,
+    path: parentMenu + '/variations/' + style.name
+  }, (0, _element.createElement)(_screenVariations.ScreenVariation, {
+    blockName: blockName,
+    style: style
+  })));
+}
+
+function ContextScreens(_ref4) {
+  let {
+    name,
+    parentMenu = '',
+    variation = ''
+  } = _ref4;
   const blockStyleVariations = (0, _data.useSelect)(select => {
     const {
       getBlockStyles
     } = select(_blocks.store);
     return getBlockStyles(name);
   }, [name]);
-
-  const BlockStylesNavigationScreens = _ref4 => {
-    let {
-      blockStyles,
-      blockName
-    } = _ref4;
-    return blockStyles.map((style, index) => (0, _element.createElement)(GlobalStylesNavigationScreen, {
-      key: index,
-      path: parentMenu + '/variations/' + style.name
-    }, (0, _element.createElement)(_screenVariations.ScreenVariation, {
-      blockName: blockName,
-      style: style
-    })));
-  };
-
   return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(GlobalStylesNavigationScreen, {
     path: parentMenu + '/typography'
   }, (0, _element.createElement)(_screenTypography.default, {
     name: name,
-    variationPath: variationPath
+    variation: variation
   })), (0, _element.createElement)(GlobalStylesNavigationScreen, {
     path: parentMenu + '/typography/text'
   }, (0, _element.createElement)(_screenTypographyElement.default, {
@@ -149,7 +197,7 @@ function ContextScreens(_ref3) {
     path: parentMenu + '/colors'
   }, (0, _element.createElement)(_screenColors.default, {
     name: name,
-    variationPath: variationPath
+    variation: variation
   })), (0, _element.createElement)(GlobalStylesNavigationScreen, {
     path: parentMenu + '/colors/palette'
   }, (0, _element.createElement)(_screenColorPalette.default, {
@@ -158,38 +206,43 @@ function ContextScreens(_ref3) {
     path: parentMenu + '/colors/background'
   }, (0, _element.createElement)(_screenBackgroundColor.default, {
     name: name,
-    variationPath: variationPath
+    variation: variation
   })), (0, _element.createElement)(GlobalStylesNavigationScreen, {
     path: parentMenu + '/colors/text'
   }, (0, _element.createElement)(_screenTextColor.default, {
     name: name,
-    variationPath: variationPath
+    variation: variation
   })), (0, _element.createElement)(GlobalStylesNavigationScreen, {
     path: parentMenu + '/colors/link'
   }, (0, _element.createElement)(_screenLinkColor.default, {
     name: name,
-    variationPath: variationPath
+    variation: variation
   })), (0, _element.createElement)(GlobalStylesNavigationScreen, {
     path: parentMenu + '/colors/heading'
   }, (0, _element.createElement)(_screenHeadingColor.default, {
     name: name,
-    variationPath: variationPath
+    variation: variation
   })), (0, _element.createElement)(GlobalStylesNavigationScreen, {
     path: parentMenu + '/colors/button'
   }, (0, _element.createElement)(_screenButtonColor.default, {
     name: name,
-    variationPath: variationPath
+    variation: variation
   })), (0, _element.createElement)(GlobalStylesNavigationScreen, {
     path: parentMenu + '/border'
   }, (0, _element.createElement)(_screenBorder.default, {
     name: name,
-    variationPath: variationPath
+    variation: variation
   })), (0, _element.createElement)(GlobalStylesNavigationScreen, {
     path: parentMenu + '/layout'
   }, (0, _element.createElement)(_screenLayout.default, {
     name: name,
-    variationPath: variationPath
+    variation: variation
+  })), (0, _element.createElement)(GlobalStylesNavigationScreen, {
+    path: parentMenu + '/css'
+  }, (0, _element.createElement)(_screenCss.default, {
+    name: name
   })), !!(blockStyleVariations !== null && blockStyleVariations !== void 0 && blockStyleVariations.length) && (0, _element.createElement)(BlockStylesNavigationScreens, {
+    parentMenu: parentMenu,
     blockStyles: blockStyleVariations,
     blockName: name
   }));
@@ -254,9 +307,7 @@ function GlobalStylesUI(_ref6) {
     });
   }), isStyleBookOpened && (0, _element.createElement)(GlobalStylesStyleBook, {
     onClose: onCloseStyleBook
-  }), (0, _element.createElement)(GlobalStylesNavigationScreen, {
-    path: "/css"
-  }, (0, _element.createElement)(_screenCss.default, null)));
+  }), (0, _element.createElement)(GlobalStylesActionMenu, null));
 }
 
 var _default = GlobalStylesUI;

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/ui.js"],"names":["GlobalStylesNavigationScreen","className","props","filter","Boolean","join","BlockStyleVariationsScreens","name","blockStyleVariations","select","getBlockStyles","blocksStore","length","map","variation","encodeURIComponent","ContextScreens","parentMenu","hasVariationPath","search","variationPath","substring","replace","concat","BlockStylesNavigationScreens","blockStyles","blockName","style","index","GlobalStylesStyleBook","onClose","navigator","path","location","startsWith","depth","match","i","goBack","goTo","GlobalStylesUI","isStyleBookOpened","onCloseStyleBook","blocks","block"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalNavigatorProvider as NavigatorProvider,\n\t__experimentalNavigatorScreen as NavigatorScreen,\n\t__experimentalUseNavigator as useNavigator,\n} from '@wordpress/components';\nimport { getBlockTypes, store as blocksStore } from '@wordpress/blocks';\n\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport ScreenRoot from './screen-root';\nimport ScreenBlockList from './screen-block-list';\nimport ScreenBlock from './screen-block';\nimport ScreenTypography from './screen-typography';\nimport ScreenTypographyElement from './screen-typography-element';\nimport ScreenColors from './screen-colors';\nimport ScreenColorPalette from './screen-color-palette';\nimport ScreenBackgroundColor from './screen-background-color';\nimport ScreenTextColor from './screen-text-color';\nimport ScreenLinkColor from './screen-link-color';\nimport ScreenHeadingColor from './screen-heading-color';\nimport ScreenButtonColor from './screen-button-color';\nimport ScreenLayout from './screen-layout';\nimport ScreenStyleVariations from './screen-style-variations';\nimport { ScreenVariation } from './screen-variations';\nimport ScreenBorder from './screen-border';\nimport StyleBook from '../style-book';\nimport ScreenCSS from './screen-css';\n\nfunction GlobalStylesNavigationScreen( { className, ...props } ) {\n\treturn (\n\t\t<NavigatorScreen\n\t\t\tclassName={ [\n\t\t\t\t'edit-site-global-styles-sidebar__navigator-screen',\n\t\t\t\tclassName,\n\t\t\t]\n\t\t\t\t.filter( Boolean )\n\t\t\t\t.join( ' ' ) }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction BlockStyleVariationsScreens( { name } ) {\n\tconst blockStyleVariations = 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\tif ( ! blockStyleVariations?.length ) {\n\t\treturn null;\n\t}\n\n\treturn blockStyleVariations.map( ( variation ) => (\n\t\t<ContextScreens\n\t\t\tkey={ variation.name + name }\n\t\t\tname={ name }\n\t\t\tparentMenu={\n\t\t\t\t'/blocks/' +\n\t\t\t\tencodeURIComponent( name ) +\n\t\t\t\t'/variations/' +\n\t\t\t\tencodeURIComponent( variation.name )\n\t\t\t}\n\t\t/>\n\t) );\n}\n\nfunction ContextScreens( { name, parentMenu = '' } ) {\n\tconst hasVariationPath = parentMenu.search( 'variations' );\n\tconst variationPath =\n\t\thasVariationPath !== -1\n\t\t\t? parentMenu\n\t\t\t\t\t.substring( hasVariationPath )\n\t\t\t\t\t.replace( '/', '.' )\n\t\t\t\t\t.concat( '', '.' )\n\t\t\t: '';\n\tconst blockStyleVariations = 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\n\tconst BlockStylesNavigationScreens = ( { blockStyles, blockName } ) => {\n\t\treturn blockStyles.map( ( style, index ) => (\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tkey={ index }\n\t\t\t\tpath={ parentMenu + '/variations/' + style.name }\n\t\t\t>\n\t\t\t\t<ScreenVariation blockName={ blockName } style={ style } />\n\t\t\t</GlobalStylesNavigationScreen>\n\t\t) );\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/typography' }>\n\t\t\t\t<ScreenTypography\n\t\t\t\t\tname={ name }\n\t\t\t\t\tvariationPath={ variationPath }\n\t\t\t\t/>\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/typography/text' }\n\t\t\t>\n\t\t\t\t<ScreenTypographyElement name={ name } element=\"text\" />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/typography/link' }\n\t\t\t>\n\t\t\t\t<ScreenTypographyElement name={ name } element=\"link\" />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/typography/heading' }\n\t\t\t>\n\t\t\t\t<ScreenTypographyElement name={ name } element=\"heading\" />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/typography/button' }\n\t\t\t>\n\t\t\t\t<ScreenTypographyElement name={ name } element=\"button\" />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/colors' }>\n\t\t\t\t<ScreenColors name={ name } variationPath={ variationPath } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/colors/palette' }\n\t\t\t>\n\t\t\t\t<ScreenColorPalette name={ name } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/colors/background' }\n\t\t\t>\n\t\t\t\t<ScreenBackgroundColor\n\t\t\t\t\tname={ name }\n\t\t\t\t\tvariationPath={ variationPath }\n\t\t\t\t/>\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/colors/text' }>\n\t\t\t\t<ScreenTextColor\n\t\t\t\t\tname={ name }\n\t\t\t\t\tvariationPath={ variationPath }\n\t\t\t\t/>\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/colors/link' }>\n\t\t\t\t<ScreenLinkColor\n\t\t\t\t\tname={ name }\n\t\t\t\t\tvariationPath={ variationPath }\n\t\t\t\t/>\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/colors/heading' }\n\t\t\t>\n\t\t\t\t<ScreenHeadingColor\n\t\t\t\t\tname={ name }\n\t\t\t\t\tvariationPath={ variationPath }\n\t\t\t\t/>\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/colors/button' }\n\t\t\t>\n\t\t\t\t<ScreenButtonColor\n\t\t\t\t\tname={ name }\n\t\t\t\t\tvariationPath={ variationPath }\n\t\t\t\t/>\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/border' }>\n\t\t\t\t<ScreenBorder name={ name } variationPath={ variationPath } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/layout' }>\n\t\t\t\t<ScreenLayout name={ name } variationPath={ variationPath } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t{ !! blockStyleVariations?.length && (\n\t\t\t\t<BlockStylesNavigationScreens\n\t\t\t\t\tblockStyles={ blockStyleVariations }\n\t\t\t\t\tblockName={ name }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nfunction GlobalStylesStyleBook( { onClose } ) {\n\tconst navigator = useNavigator();\n\tconst { path } = navigator.location;\n\treturn (\n\t\t<StyleBook\n\t\t\tisSelected={ ( blockName ) =>\n\t\t\t\t// Match '/blocks/core%2Fbutton' and\n\t\t\t\t// '/blocks/core%2Fbutton/typography', but not\n\t\t\t\t// '/blocks/core%2Fbuttons'.\n\t\t\t\tpath === `/blocks/${ encodeURIComponent( blockName ) }` ||\n\t\t\t\tpath.startsWith(\n\t\t\t\t\t`/blocks/${ encodeURIComponent( blockName ) }/`\n\t\t\t\t)\n\t\t\t}\n\t\t\tonSelect={ ( blockName ) => {\n\t\t\t\t// Clear navigator history by going back to the root.\n\t\t\t\tconst depth = path.match( /\\//g ).length;\n\t\t\t\tfor ( let i = 0; i < depth; i++ ) {\n\t\t\t\t\tnavigator.goBack();\n\t\t\t\t}\n\t\t\t\t// Now go to the selected block.\n\t\t\t\tnavigator.goTo( '/blocks/' + encodeURIComponent( blockName ) );\n\t\t\t} }\n\t\t\tonClose={ onClose }\n\t\t/>\n\t);\n}\n\nfunction GlobalStylesUI( { isStyleBookOpened, onCloseStyleBook } ) {\n\tconst blocks = getBlockTypes();\n\n\treturn (\n\t\t<NavigatorProvider\n\t\t\tclassName=\"edit-site-global-styles-sidebar__navigator-provider\"\n\t\t\tinitialPath=\"/\"\n\t\t>\n\t\t\t<GlobalStylesNavigationScreen path=\"/\">\n\t\t\t\t<ScreenRoot />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path=\"/variations\">\n\t\t\t\t<ScreenStyleVariations />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path=\"/blocks\">\n\t\t\t\t<ScreenBlockList />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t{ blocks.map( ( block ) => (\n\t\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\t\tkey={ 'menu-block-' + block.name }\n\t\t\t\t\tpath={ '/blocks/' + encodeURIComponent( block.name ) }\n\t\t\t\t>\n\t\t\t\t\t<ScreenBlock name={ block.name } />\n\t\t\t\t</GlobalStylesNavigationScreen>\n\t\t\t) ) }\n\n\t\t\t<ContextScreens />\n\n\t\t\t{ blocks.map( ( block ) => (\n\t\t\t\t<ContextScreens\n\t\t\t\t\tkey={ 'screens-block-' + block.name }\n\t\t\t\t\tname={ block.name }\n\t\t\t\t\tparentMenu={ '/blocks/' + encodeURIComponent( block.name ) }\n\t\t\t\t/>\n\t\t\t) ) }\n\n\t\t\t{ blocks.map( ( block, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<BlockStyleVariationsScreens\n\t\t\t\t\t\tkey={ 'screens-block-styles-' + block.name + index }\n\t\t\t\t\t\tname={ block.name }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t\t{ isStyleBookOpened && (\n\t\t\t\t<GlobalStylesStyleBook onClose={ onCloseStyleBook } />\n\t\t\t) }\n\t\t\t<GlobalStylesNavigationScreen path=\"/css\">\n\t\t\t\t<ScreenCSS />\n\t\t\t</GlobalStylesNavigationScreen>\n\t\t</NavigatorProvider>\n\t);\n}\n\nexport default GlobalStylesUI;\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/ui.js"],"names":["SLOT_FILL_NAME","Slot","GlobalStylesMenuSlot","Fill","GlobalStylesMenuFill","GlobalStylesActionMenu","toggle","preferencesStore","useGlobalStylesReset","blockEditorExperiments","canReset","onReset","goTo","loadCustomCSS","moreVertical","title","onClick","isDisabled","GlobalStylesNavigationScreen","className","props","filter","Boolean","join","BlockStyleVariationsScreens","name","blockStyleVariations","select","getBlockStyles","blocksStore","length","map","variation","encodeURIComponent","BlockStylesNavigationScreens","parentMenu","blockStyles","blockName","style","index","ContextScreens","GlobalStylesStyleBook","onClose","navigator","path","location","startsWith","depth","match","i","goBack","GlobalStylesUI","isStyleBookOpened","onCloseStyleBook","blocks","block"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalNavigatorProvider as NavigatorProvider,\n\t__experimentalNavigatorScreen as NavigatorScreen,\n\t__experimentalUseNavigator as useNavigator,\n\tcreateSlotFill,\n\tDropdownMenu,\n} from '@wordpress/components';\nimport { getBlockTypes, store as blocksStore } from '@wordpress/blocks';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { experiments as blockEditorExperiments } from '@wordpress/block-editor';\nimport { __ } from '@wordpress/i18n';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { moreVertical } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport ScreenRoot from './screen-root';\nimport ScreenBlockList from './screen-block-list';\nimport ScreenBlock from './screen-block';\nimport ScreenTypography from './screen-typography';\nimport ScreenTypographyElement from './screen-typography-element';\nimport ScreenColors from './screen-colors';\nimport ScreenColorPalette from './screen-color-palette';\nimport ScreenBackgroundColor from './screen-background-color';\nimport ScreenTextColor from './screen-text-color';\nimport ScreenLinkColor from './screen-link-color';\nimport ScreenHeadingColor from './screen-heading-color';\nimport ScreenButtonColor from './screen-button-color';\nimport ScreenLayout from './screen-layout';\nimport ScreenStyleVariations from './screen-style-variations';\nimport { ScreenVariation } from './screen-variations';\nimport ScreenBorder from './screen-border';\nimport StyleBook from '../style-book';\nimport ScreenCSS from './screen-css';\nimport { unlock } from '../../experiments';\n\nconst SLOT_FILL_NAME = 'GlobalStylesMenu';\nconst { Slot: GlobalStylesMenuSlot, Fill: GlobalStylesMenuFill } =\n\tcreateSlotFill( SLOT_FILL_NAME );\n\nfunction GlobalStylesActionMenu() {\n\tconst { toggle } = useDispatch( preferencesStore );\n\tconst { useGlobalStylesReset } = unlock( blockEditorExperiments );\n\tconst [ canReset, onReset ] = useGlobalStylesReset();\n\tconst { goTo } = useNavigator();\n\tconst loadCustomCSS = () => goTo( '/css' );\n\treturn (\n\t\t<GlobalStylesMenuFill>\n\t\t\t<DropdownMenu\n\t\t\t\ticon={ moreVertical }\n\t\t\t\tlabel={ __( 'More Styles actions' ) }\n\t\t\t\tcontrols={ [\n\t\t\t\t\t{\n\t\t\t\t\t\ttitle: __( 'Reset to defaults' ),\n\t\t\t\t\t\tonClick: onReset,\n\t\t\t\t\t\tisDisabled: ! canReset,\n\t\t\t\t\t},\n\t\t\t\t\t{\n\t\t\t\t\t\ttitle: __( 'Welcome Guide' ),\n\t\t\t\t\t\tonClick: () =>\n\t\t\t\t\t\t\ttoggle( 'core/edit-site', 'welcomeGuideStyles' ),\n\t\t\t\t\t},\n\t\t\t\t\t{\n\t\t\t\t\t\ttitle: __( 'Additional CSS' ),\n\t\t\t\t\t\tonClick: loadCustomCSS,\n\t\t\t\t\t},\n\t\t\t\t] }\n\t\t\t/>\n\t\t</GlobalStylesMenuFill>\n\t);\n}\n\nfunction GlobalStylesNavigationScreen( { className, ...props } ) {\n\treturn (\n\t\t<NavigatorScreen\n\t\t\tclassName={ [\n\t\t\t\t'edit-site-global-styles-sidebar__navigator-screen',\n\t\t\t\tclassName,\n\t\t\t]\n\t\t\t\t.filter( Boolean )\n\t\t\t\t.join( ' ' ) }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction BlockStyleVariationsScreens( { name } ) {\n\tconst blockStyleVariations = 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\tif ( ! blockStyleVariations?.length ) {\n\t\treturn null;\n\t}\n\n\treturn blockStyleVariations.map( ( variation ) => (\n\t\t<ContextScreens\n\t\t\tkey={ variation.name + name }\n\t\t\tname={ name }\n\t\t\tparentMenu={\n\t\t\t\t'/blocks/' +\n\t\t\t\tencodeURIComponent( name ) +\n\t\t\t\t'/variations/' +\n\t\t\t\tencodeURIComponent( variation.name )\n\t\t\t}\n\t\t\tvariation={ variation.name }\n\t\t/>\n\t) );\n}\n\nfunction BlockStylesNavigationScreens( {\n\tparentMenu,\n\tblockStyles,\n\tblockName,\n} ) {\n\treturn blockStyles.map( ( style, index ) => (\n\t\t<GlobalStylesNavigationScreen\n\t\t\tkey={ index }\n\t\t\tpath={ parentMenu + '/variations/' + style.name }\n\t\t>\n\t\t\t<ScreenVariation blockName={ blockName } style={ style } />\n\t\t</GlobalStylesNavigationScreen>\n\t) );\n}\n\nfunction ContextScreens( { name, parentMenu = '', variation = '' } ) {\n\tconst blockStyleVariations = 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\n\treturn (\n\t\t<>\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/typography' }>\n\t\t\t\t<ScreenTypography name={ name } variation={ variation } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/typography/text' }\n\t\t\t>\n\t\t\t\t<ScreenTypographyElement name={ name } element=\"text\" />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/typography/link' }\n\t\t\t>\n\t\t\t\t<ScreenTypographyElement name={ name } element=\"link\" />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/typography/heading' }\n\t\t\t>\n\t\t\t\t<ScreenTypographyElement name={ name } element=\"heading\" />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/typography/button' }\n\t\t\t>\n\t\t\t\t<ScreenTypographyElement name={ name } element=\"button\" />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/colors' }>\n\t\t\t\t<ScreenColors name={ name } variation={ variation } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/colors/palette' }\n\t\t\t>\n\t\t\t\t<ScreenColorPalette name={ name } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/colors/background' }\n\t\t\t>\n\t\t\t\t<ScreenBackgroundColor name={ name } variation={ variation } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/colors/text' }>\n\t\t\t\t<ScreenTextColor name={ name } variation={ variation } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/colors/link' }>\n\t\t\t\t<ScreenLinkColor name={ name } variation={ variation } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/colors/heading' }\n\t\t\t>\n\t\t\t\t<ScreenHeadingColor name={ name } variation={ variation } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\tpath={ parentMenu + '/colors/button' }\n\t\t\t>\n\t\t\t\t<ScreenButtonColor name={ name } variation={ variation } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/border' }>\n\t\t\t\t<ScreenBorder name={ name } variation={ variation } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/layout' }>\n\t\t\t\t<ScreenLayout name={ name } variation={ variation } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path={ parentMenu + '/css' }>\n\t\t\t\t<ScreenCSS name={ name } />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t{ !! blockStyleVariations?.length && (\n\t\t\t\t<BlockStylesNavigationScreens\n\t\t\t\t\tparentMenu={ parentMenu }\n\t\t\t\t\tblockStyles={ blockStyleVariations }\n\t\t\t\t\tblockName={ name }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nfunction GlobalStylesStyleBook( { onClose } ) {\n\tconst navigator = useNavigator();\n\tconst { path } = navigator.location;\n\treturn (\n\t\t<StyleBook\n\t\t\tisSelected={ ( blockName ) =>\n\t\t\t\t// Match '/blocks/core%2Fbutton' and\n\t\t\t\t// '/blocks/core%2Fbutton/typography', but not\n\t\t\t\t// '/blocks/core%2Fbuttons'.\n\t\t\t\tpath === `/blocks/${ encodeURIComponent( blockName ) }` ||\n\t\t\t\tpath.startsWith(\n\t\t\t\t\t`/blocks/${ encodeURIComponent( blockName ) }/`\n\t\t\t\t)\n\t\t\t}\n\t\t\tonSelect={ ( blockName ) => {\n\t\t\t\t// Clear navigator history by going back to the root.\n\t\t\t\tconst depth = path.match( /\\//g ).length;\n\t\t\t\tfor ( let i = 0; i < depth; i++ ) {\n\t\t\t\t\tnavigator.goBack();\n\t\t\t\t}\n\t\t\t\t// Now go to the selected block.\n\t\t\t\tnavigator.goTo( '/blocks/' + encodeURIComponent( blockName ) );\n\t\t\t} }\n\t\t\tonClose={ onClose }\n\t\t/>\n\t);\n}\n\nfunction GlobalStylesUI( { isStyleBookOpened, onCloseStyleBook } ) {\n\tconst blocks = getBlockTypes();\n\n\treturn (\n\t\t<NavigatorProvider\n\t\t\tclassName=\"edit-site-global-styles-sidebar__navigator-provider\"\n\t\t\tinitialPath=\"/\"\n\t\t>\n\t\t\t<GlobalStylesNavigationScreen path=\"/\">\n\t\t\t\t<ScreenRoot />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path=\"/variations\">\n\t\t\t\t<ScreenStyleVariations />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t<GlobalStylesNavigationScreen path=\"/blocks\">\n\t\t\t\t<ScreenBlockList />\n\t\t\t</GlobalStylesNavigationScreen>\n\n\t\t\t{ blocks.map( ( block ) => (\n\t\t\t\t<GlobalStylesNavigationScreen\n\t\t\t\t\tkey={ 'menu-block-' + block.name }\n\t\t\t\t\tpath={ '/blocks/' + encodeURIComponent( block.name ) }\n\t\t\t\t>\n\t\t\t\t\t<ScreenBlock name={ block.name } />\n\t\t\t\t</GlobalStylesNavigationScreen>\n\t\t\t) ) }\n\n\t\t\t<ContextScreens />\n\n\t\t\t{ blocks.map( ( block ) => (\n\t\t\t\t<ContextScreens\n\t\t\t\t\tkey={ 'screens-block-' + block.name }\n\t\t\t\t\tname={ block.name }\n\t\t\t\t\tparentMenu={ '/blocks/' + encodeURIComponent( block.name ) }\n\t\t\t\t/>\n\t\t\t) ) }\n\n\t\t\t{ blocks.map( ( block, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<BlockStyleVariationsScreens\n\t\t\t\t\t\tkey={ 'screens-block-styles-' + block.name + index }\n\t\t\t\t\t\tname={ block.name }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t\t{ isStyleBookOpened && (\n\t\t\t\t<GlobalStylesStyleBook onClose={ onCloseStyleBook } />\n\t\t\t) }\n\n\t\t\t<GlobalStylesActionMenu />\n\t\t</NavigatorProvider>\n\t);\n}\nexport { GlobalStylesMenuSlot };\nexport default GlobalStylesUI;\n"]}

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

@@ -3,348 +3,19 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.STYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE = exports.STYLE_PATH_TO_CSS_VAR_INFIX = exports.ROOT_BLOCK_SUPPORTS = exports.ROOT_BLOCK_SELECTOR = exports.ROOT_BLOCK_NAME = exports.PRESET_METADATA = void 0;
-exports.getPresetVariableFromValue = getPresetVariableFromValue;
-exports.getValueFromVariable = getValueFromVariable;
-exports.getVariationClassNameFromPath = getVariationClassNameFromPath;
-exports.scopeSelector = scopeSelector;
-
-var _lodash = require("lodash");
-
-var _typographyUtils = require("./typography-utils");
-
-/**
- * External dependencies
- */
+exports.getVariationClassName = getVariationClassName;
 
 /**
- * Internal dependencies
- */
-
-/* Supporting data. */
-const ROOT_BLOCK_NAME = 'root';
-exports.ROOT_BLOCK_NAME = ROOT_BLOCK_NAME;
-const ROOT_BLOCK_SELECTOR = 'body';
-exports.ROOT_BLOCK_SELECTOR = ROOT_BLOCK_SELECTOR;
-const ROOT_BLOCK_SUPPORTS = ['background', 'backgroundColor', 'color', 'linkColor', 'buttonColor', 'fontFamily', 'fontSize', 'fontStyle', 'fontWeight', 'lineHeight', 'textDecoration', 'textTransform', 'padding'];
-exports.ROOT_BLOCK_SUPPORTS = ROOT_BLOCK_SUPPORTS;
-const PRESET_METADATA = [{
-  path: ['color', 'palette'],
-  valueKey: 'color',
-  cssVarInfix: 'color',
-  classes: [{
-    classSuffix: 'color',
-    propertyName: 'color'
-  }, {
-    classSuffix: 'background-color',
-    propertyName: 'background-color'
-  }, {
-    classSuffix: 'border-color',
-    propertyName: 'border-color'
-  }]
-}, {
-  path: ['color', 'gradients'],
-  valueKey: 'gradient',
-  cssVarInfix: 'gradient',
-  classes: [{
-    classSuffix: 'gradient-background',
-    propertyName: 'background'
-  }]
-}, {
-  path: ['color', 'duotone'],
-  cssVarInfix: 'duotone',
-  valueFunc: _ref => {
-    let {
-      slug
-    } = _ref;
-    return `url( '#wp-duotone-${slug}' )`;
-  },
-  classes: []
-}, {
-  path: ['typography', 'fontSizes'],
-  valueFunc: (preset, _ref2) => {
-    let {
-      typography: typographySettings
-    } = _ref2;
-    return (0, _typographyUtils.getTypographyFontSizeValue)(preset, typographySettings);
-  },
-  valueKey: 'size',
-  cssVarInfix: 'font-size',
-  classes: [{
-    classSuffix: 'font-size',
-    propertyName: 'font-size'
-  }]
-}, {
-  path: ['typography', 'fontFamilies'],
-  valueKey: 'fontFamily',
-  cssVarInfix: 'font-family',
-  classes: [{
-    classSuffix: 'font-family',
-    propertyName: 'font-family'
-  }]
-}, {
-  path: ['spacing', 'spacingSizes'],
-  valueKey: 'size',
-  cssVarInfix: 'spacing',
-  valueFunc: _ref3 => {
-    let {
-      size
-    } = _ref3;
-    return size;
-  },
-  classes: []
-}];
-exports.PRESET_METADATA = PRESET_METADATA;
-const STYLE_PATH_TO_CSS_VAR_INFIX = {
-  'color.background': 'color',
-  'color.text': 'color',
-  'elements.link.color.text': 'color',
-  'elements.link.:hover.color.text': 'color',
-  'elements.link.typography.fontFamily': 'font-family',
-  'elements.link.typography.fontSize': 'font-size',
-  'elements.button.color.text': 'color',
-  'elements.button.color.background': 'color',
-  'elements.button.typography.fontFamily': 'font-family',
-  'elements.button.typography.fontSize': 'font-size',
-  'elements.heading.color': 'color',
-  'elements.heading.color.background': 'color',
-  'elements.heading.typography.fontFamily': 'font-family',
-  'elements.heading.gradient': 'gradient',
-  'elements.heading.color.gradient': 'gradient',
-  'elements.h1.color': 'color',
-  'elements.h1.color.background': 'color',
-  'elements.h1.typography.fontFamily': 'font-family',
-  'elements.h1.color.gradient': 'gradient',
-  'elements.h2.color': 'color',
-  'elements.h2.color.background': 'color',
-  'elements.h2.typography.fontFamily': 'font-family',
-  'elements.h2.color.gradient': 'gradient',
-  'elements.h3.color': 'color',
-  'elements.h3.color.background': 'color',
-  'elements.h3.typography.fontFamily': 'font-family',
-  'elements.h3.color.gradient': 'gradient',
-  'elements.h4.color': 'color',
-  'elements.h4.color.background': 'color',
-  'elements.h4.typography.fontFamily': 'font-family',
-  'elements.h4.color.gradient': 'gradient',
-  'elements.h5.color': 'color',
-  'elements.h5.color.background': 'color',
-  'elements.h5.typography.fontFamily': 'font-family',
-  'elements.h5.color.gradient': 'gradient',
-  'elements.h6.color': 'color',
-  'elements.h6.color.background': 'color',
-  'elements.h6.typography.fontFamily': 'font-family',
-  'elements.h6.color.gradient': 'gradient',
-  'color.gradient': 'gradient',
-  'typography.fontSize': 'font-size',
-  'typography.fontFamily': 'font-family'
-}; // A static list of block attributes that store global style preset slugs.
-
-exports.STYLE_PATH_TO_CSS_VAR_INFIX = STYLE_PATH_TO_CSS_VAR_INFIX;
-const STYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE = {
-  'color.background': 'backgroundColor',
-  'color.text': 'textColor',
-  'color.gradient': 'gradient',
-  'typography.fontSize': 'fontSize',
-  'typography.fontFamily': 'fontFamily'
-};
-exports.STYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE = STYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE;
-
-function findInPresetsBy(features, blockName, presetPath, presetProperty, presetValueValue) {
-  // Block presets take priority above root level presets.
-  const orderedPresetsByOrigin = [(0, _lodash.get)(features, ['blocks', blockName, ...presetPath]), (0, _lodash.get)(features, presetPath)];
-
-  for (const presetByOrigin of orderedPresetsByOrigin) {
-    if (presetByOrigin) {
-      // Preset origins ordered by priority.
-      const origins = ['custom', 'theme', 'default'];
-
-      for (const origin of origins) {
-        const presets = presetByOrigin[origin];
-
-        if (presets) {
-          const presetObject = presets.find(preset => preset[presetProperty] === presetValueValue);
-
-          if (presetObject) {
-            if (presetProperty === 'slug') {
-              return presetObject;
-            } // If there is a highest priority preset with the same slug but different value the preset we found was overwritten and should be ignored.
-
-
-            const highestPresetObjectWithSameSlug = findInPresetsBy(features, blockName, presetPath, 'slug', presetObject.slug);
-
-            if (highestPresetObjectWithSameSlug[presetProperty] === presetObject[presetProperty]) {
-              return presetObject;
-            }
-
-            return undefined;
-          }
-        }
-      }
-    }
-  }
-}
-
-function getPresetVariableFromValue(features, blockName, variableStylePath, presetPropertyValue) {
-  if (!presetPropertyValue) {
-    return presetPropertyValue;
-  }
-
-  const cssVarInfix = STYLE_PATH_TO_CSS_VAR_INFIX[variableStylePath];
-  const metadata = PRESET_METADATA.find(data => data.cssVarInfix === cssVarInfix);
-
-  if (!metadata) {
-    // The property doesn't have preset data
-    // so the value should be returned as it is.
-    return presetPropertyValue;
-  }
-
-  const {
-    valueKey,
-    path
-  } = metadata;
-  const presetObject = findInPresetsBy(features, blockName, path, valueKey, presetPropertyValue);
-
-  if (!presetObject) {
-    // Value wasn't found in the presets,
-    // so it must be a custom value.
-    return presetPropertyValue;
-  }
-
-  return `var:preset|${cssVarInfix}|${presetObject.slug}`;
-}
-
-function getValueFromPresetVariable(features, blockName, variable, _ref4) {
-  let [presetType, slug] = _ref4;
-  const metadata = PRESET_METADATA.find(data => data.cssVarInfix === presetType);
-
-  if (!metadata) {
-    return variable;
-  }
-
-  const presetObject = findInPresetsBy(features.settings, blockName, metadata.path, 'slug', slug);
-
-  if (presetObject) {
-    const {
-      valueKey
-    } = metadata;
-    const result = presetObject[valueKey];
-    return getValueFromVariable(features, blockName, result);
-  }
-
-  return variable;
-}
-
-function getValueFromCustomVariable(features, blockName, variable, path) {
-  var _get;
-
-  const result = (_get = (0, _lodash.get)(features.settings, ['blocks', blockName, 'custom', ...path])) !== null && _get !== void 0 ? _get : (0, _lodash.get)(features.settings, ['custom', ...path]);
-
-  if (!result) {
-    return variable;
-  } // A variable may reference another variable so we need recursion until we find the value.
-
-
-  return getValueFromVariable(features, blockName, result);
-}
-/**
- * Attempts to fetch the value of a theme.json CSS variable.
- *
- * @param {Object}   features  GlobalStylesContext config, e.g., user, base or merged. Represents the theme.json tree.
- * @param {string}   blockName The name of a block as represented in the styles property. E.g., 'root' for root-level, and 'core/${blockName}' for blocks.
- * @param {string|*} variable  An incoming style value. A CSS var value is expected, but it could be any value.
- * @return {string|*|{ref}} The value of the CSS var, if found. If not found, the passed variable argument.
- */
-
-
-function getValueFromVariable(features, blockName, variable) {
-  if (!variable || typeof variable !== 'string') {
-    var _variable, _variable2;
-
-    if ((_variable = variable) !== null && _variable !== void 0 && _variable.ref && typeof ((_variable2 = variable) === null || _variable2 === void 0 ? void 0 : _variable2.ref) === 'string') {
-      var _variable3;
-
-      const refPath = variable.ref.split('.');
-      variable = (0, _lodash.get)(features, refPath); // Presence of another ref indicates a reference to another dynamic value.
-      // Pointing to another dynamic value is not supported.
-
-      if (!variable || !!((_variable3 = variable) !== null && _variable3 !== void 0 && _variable3.ref)) {
-        return variable;
-      }
-    } else {
-      return variable;
-    }
-  }
-
-  const USER_VALUE_PREFIX = 'var:';
-  const THEME_VALUE_PREFIX = 'var(--wp--';
-  const THEME_VALUE_SUFFIX = ')';
-  let parsedVar;
-
-  if (variable.startsWith(USER_VALUE_PREFIX)) {
-    parsedVar = variable.slice(USER_VALUE_PREFIX.length).split('|');
-  } else if (variable.startsWith(THEME_VALUE_PREFIX) && variable.endsWith(THEME_VALUE_SUFFIX)) {
-    parsedVar = variable.slice(THEME_VALUE_PREFIX.length, -THEME_VALUE_SUFFIX.length).split('--');
-  } else {
-    // We don't know how to parse the value: either is raw of uses complex CSS such as `calc(1px * var(--wp--variable) )`
-    return variable;
-  }
-
-  const [type, ...path] = parsedVar;
-
-  if (type === 'preset') {
-    return getValueFromPresetVariable(features, blockName, variable, path);
-  }
-
-  if (type === 'custom') {
-    return getValueFromCustomVariable(features, blockName, variable, path);
-  }
-
-  return variable;
-}
-/**
- * Function that scopes a selector with another one. This works a bit like
- * SCSS nesting except the `&` operator isn't supported.
- *
- * @example
- * ```js
- * const scope = '.a, .b .c';
- * const selector = '> .x, .y';
- * const merged = scopeSelector( scope, selector );
- * // merged is '.a > .x, .a .y, .b .c > .x, .b .c .y'
- * ```
  *
- * @param {string} scope    Selector to scope to.
- * @param {string} selector Original selector.
- *
- * @return {string} Scoped selector.
- */
-
-
-function scopeSelector(scope, selector) {
-  const scopes = scope.split(',');
-  const selectors = selector.split(',');
-  const selectorsScoped = [];
-  scopes.forEach(outer => {
-    selectors.forEach(inner => {
-      selectorsScoped.push(`${outer.trim()} ${inner.trim()}`);
-    });
-  });
-  return selectorsScoped.join(', ');
-}
-/**
- *
- * @param {string} path The variation path in the Global Styles tree.
+ * @param {string} variation The variation name.
  *
  * @return {string} The variation class name.
  */
-
-
-function getVariationClassNameFromPath(path) {
-  if (!path) {
+function getVariationClassName(variation) {
+  if (!variation) {
     return '';
   }
 
-  return `is-style-${path.split('.')[1]}`;
+  return `is-style-${variation}`;
 }
 //# sourceMappingURL=utils.js.map