npm - @wordpress/block-editor - Versions diffs - 15.21.1 → 15.22.0 - Mend

@wordpress/block-editor 15.21.1 → 15.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (490) hide show

package/build-module/hooks/layout.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/hooks/layout.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { createHigherOrderComponent, useInstanceId } from '@wordpress/compose';\nimport { addFilter } from '@wordpress/hooks';\nimport { useCallback } from '@wordpress/element';\nimport {\n\tgetBlockSupport,\n\thasBlockSupport,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { useSelect } from '@wordpress/data';\nimport {\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\tToggleControl,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../store';\nimport { InspectorControls } from '../components';\nimport { useSettings } from '../components/use-settings';\nimport { getLayoutType, getLayoutTypes } from '../layouts';\nimport { useBlockEditingMode } from '../components/block-editing-mode';\nimport { LAYOUT_DEFINITIONS } from '../layouts/definitions';\nimport { cleanEmptyObject, useBlockSettings, useStyleOverride } from './utils';\nimport { unlock } from '../lock-unlock';\nimport { globalStylesDataKey } from '../store/private-keys';\nimport { getVariationNameFromClass } from './block-style-variation';\nimport {\n\tDEFAULT_BLOCK_STYLE_STATE,\n\tgetStyleForState,\n\thasPseudoBlockStyleState,\n\thasViewportBlockStyleState,\n\tisDefaultBlockStyleState,\n\tsetStyleForState,\n} from './block-style-state';\n\nconst VARIATION_PREFIX = 'is-style-';\n\nconst layoutBlockSupportKey = 'layout';\n// Keep in sync with WP_Theme_JSON_Gutenberg::RESPONSIVE_BREAKPOINTS and\n// packages/global-styles-engine/src/core/render.tsx.\nconst RESPONSIVE_BREAKPOINTS = {\n\tmobile: '@media (width <= 480px)',\n\ttablet: '@media (480px < width <= 782px)',\n};\nconst CHILD_LAYOUT_KEYS = [\n\t'selfStretch',\n\t'flexSize',\n\t'columnStart',\n\t'columnSpan',\n\t'rowStart',\n\t'rowSpan',\n];\nconst { kebabCase } = unlock( componentsPrivateApis );\n\nfunction getDefaultLayout( layoutBlockSupport = {}, blockVariation ) {\n\tconst defaultBlockLayout = layoutBlockSupport?.default;\n\n\treturn blockVariation?.attributes?.layout ?? defaultBlockLayout;\n}\n\n/**\n * Returns the layout values to use when resetting layout controls.\n *\n * @param { Object }           layoutBlockSupport Block layout support settings.\n * @param { Object|undefined } blockVariation     Block variation settings.\n *\n * @return { Object|undefined } Reset layout values.\n */\nexport function getResetLayout( layoutBlockSupport = {}, blockVariation ) {\n\treturn cleanEmptyObject( {\n\t\t...getDefaultLayout( layoutBlockSupport, blockVariation ),\n\t} );\n}\n\nfunction getLayoutStateOverrides(\n\tlayout = {},\n\tbaseLayout = {},\n\texistingLayout = {}\n) {\n\tconst overrides = {};\n\tconst childLayoutValues = Object.fromEntries(\n\t\tCHILD_LAYOUT_KEYS.filter( ( key ) =>\n\t\t\tObject.hasOwn( existingLayout || {}, key )\n\t\t).map( ( key ) => [ key, existingLayout[ key ] ] )\n\t);\n\n\tObject.entries( layout || {} ).forEach( ( [ key, value ] ) => {\n\t\tif (\n\t\t\t! CHILD_LAYOUT_KEYS.includes( key ) &&\n\t\t\tvalue !== baseLayout?.[ key ]\n\t\t) {\n\t\t\toverrides[ key ] = value;\n\t\t}\n\t} );\n\n\treturn cleanEmptyObject( {\n\t\t...childLayoutValues,\n\t\t...overrides,\n\t} );\n}\n\nfunction getLayoutContainerValues( layout = {} ) {\n\treturn Object.fromEntries(\n\t\tObject.entries( layout || {} ).filter(\n\t\t\t( [ key ] ) => ! CHILD_LAYOUT_KEYS.includes( key )\n\t\t)\n\t);\n}\n\nfunction hasLayoutBlockSupport( blockName ) {\n\treturn (\n\t\thasBlockSupport( blockName, 'layout' ) ||\n\t\thasBlockSupport( blockName, '__experimentalLayout' )\n\t);\n}\n\n/**\n * Generates the utility classnames for the given block's layout attributes.\n *\n * @param { Object } blockAttributes Block attributes.\n * @param { string } blockName       Block name.\n *\n * @return { Array } Array of CSS classname strings.\n */\nexport function useLayoutClasses( blockAttributes = {}, blockName = '' ) {\n\tconst { layout } = blockAttributes;\n\tconst { default: defaultBlockLayout } =\n\t\tgetBlockSupport( blockName, layoutBlockSupportKey ) || {};\n\tconst usedLayout =\n\t\tlayout?.inherit || layout?.contentSize || layout?.wideSize\n\t\t\t? { ...layout, type: 'constrained' }\n\t\t\t: layout || defaultBlockLayout || {};\n\n\tconst layoutClassnames = [];\n\n\tif ( LAYOUT_DEFINITIONS[ usedLayout?.type || 'default' ]?.className ) {\n\t\tconst baseClassName =\n\t\t\tLAYOUT_DEFINITIONS[ usedLayout?.type || 'default' ]?.className;\n\t\tconst splitBlockName = blockName.split( '/' );\n\t\tconst fullBlockName =\n\t\t\tsplitBlockName[ 0 ] === 'core'\n\t\t\t\t? splitBlockName.pop()\n\t\t\t\t: splitBlockName.join( '-' );\n\t\tconst compoundClassName = `wp-block-${ fullBlockName }-${ baseClassName }`;\n\t\tlayoutClassnames.push( baseClassName, compoundClassName );\n\t}\n\n\tconst hasGlobalPadding = useSelect(\n\t\t( select ) => {\n\t\t\t// Early return to avoid subscription when layout doesn't use global padding\n\t\t\tif (\n\t\t\t\t! usedLayout?.inherit &&\n\t\t\t\t! usedLayout?.contentSize &&\n\t\t\t\tusedLayout?.type !== 'constrained'\n\t\t\t) {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\treturn select( blockEditorStore ).getSettings()\n\t\t\t\t.__experimentalFeatures?.useRootPaddingAwareAlignments;\n\t\t},\n\t\t[ usedLayout?.contentSize, usedLayout?.inherit, usedLayout?.type ]\n\t);\n\n\tif ( hasGlobalPadding ) {\n\t\tlayoutClassnames.push( 'has-global-padding' );\n\t}\n\n\tif ( usedLayout?.orientation ) {\n\t\tlayoutClassnames.push( `is-${ kebabCase( usedLayout.orientation ) }` );\n\t}\n\n\tif ( usedLayout?.justifyContent ) {\n\t\tlayoutClassnames.push(\n\t\t\t`is-content-justification-${ kebabCase(\n\t\t\t\tusedLayout.justifyContent\n\t\t\t) }`\n\t\t);\n\t}\n\n\tif ( usedLayout?.flexWrap && usedLayout.flexWrap === 'nowrap' ) {\n\t\tlayoutClassnames.push( 'is-nowrap' );\n\t}\n\n\treturn layoutClassnames;\n}\n\n/**\n * Generates a CSS rule with the given block's layout styles.\n *\n * @param { Object } blockAttributes Block attributes.\n * @param { string } blockName       Block name.\n * @param { string } selector        A selector to use in generating the CSS rule.\n *\n * @return { string } CSS rule.\n */\nexport function useLayoutStyles( blockAttributes = {}, blockName, selector ) {\n\tconst { layout = {}, style = {} } = blockAttributes;\n\t// Update type for blocks using legacy layouts.\n\tconst usedLayout =\n\t\tlayout?.inherit || layout?.contentSize || layout?.wideSize\n\t\t\t? { ...layout, type: 'constrained' }\n\t\t\t: layout || {};\n\tconst fullLayoutType = getLayoutType( usedLayout?.type || 'default' );\n\tconst [ blockGapSupport ] = useSettings( 'spacing.blockGap' );\n\tconst hasBlockGapSupport = blockGapSupport !== null;\n\treturn fullLayoutType?.getLayoutStyle?.( {\n\t\tblockName,\n\t\tselector,\n\t\tlayout,\n\t\tstyle,\n\t\thasBlockGapSupport,\n\t} );\n}\n\n/**\n * Generates responsive layout CSS for viewport state styles.\n *\n * Viewport state blockGap values need to go through the layout definitions\n * because flow/constrained layouts use child margins while flex/grid use gap.\n *\n * @param { Object }  options                     Options.\n * @param { Object }  options.attributes          Block attributes.\n * @param { string }  options.blockName           Block name.\n * @param { string }  options.selector            CSS selector.\n * @param { Object }  options.layout              Active block layout.\n * @param { boolean } options.hasBlockGapSupport  Whether block gap is supported.\n * @param { * }       options.globalBlockGapValue Global block gap fallback.\n *\n * @return { string } CSS rule.\n */\nexport function getResponsiveLayoutStyles( {\n\tattributes = {},\n\tblockName,\n\tselector,\n\tlayout = {},\n\thasBlockGapSupport,\n\tglobalBlockGapValue,\n} ) {\n\treturn Object.entries( RESPONSIVE_BREAKPOINTS )\n\t\t.map( ( [ viewport, mediaQuery ] ) => {\n\t\t\tconst viewportStyle = attributes?.style?.[ viewport ];\n\t\t\tconst viewportLayout = getLayoutContainerValues(\n\t\t\t\tviewportStyle?.layout\n\t\t\t);\n\t\t\tconst hasViewportLayout = Object.keys( viewportLayout ).length > 0;\n\t\t\tconst hasViewportBlockGap =\n\t\t\t\tviewportStyle?.spacing &&\n\t\t\t\tObject.hasOwn( viewportStyle.spacing, 'blockGap' );\n\t\t\tconst hasViewportPadding =\n\t\t\t\tviewportStyle?.spacing &&\n\t\t\t\tObject.hasOwn( viewportStyle.spacing, 'padding' );\n\t\t\tif (\n\t\t\t\t! hasViewportLayout &&\n\t\t\t\t! hasViewportBlockGap &&\n\t\t\t\t! hasViewportPadding\n\t\t\t) {\n\t\t\t\treturn '';\n\t\t\t}\n\n\t\t\tconst layoutType = getLayoutType( layout?.type || 'default' );\n\t\t\tconst viewportCSS = layoutType?.getLayoutStyle?.( {\n\t\t\t\tblockName,\n\t\t\t\tselector,\n\t\t\t\tlayout,\n\t\t\t\tviewportOverrides: viewportLayout,\n\t\t\t\tstyle: viewportStyle,\n\t\t\t\thasBlockGapSupport,\n\t\t\t\tglobalBlockGapValue,\n\t\t\t} );\n\n\t\t\treturn viewportCSS ? `${ mediaQuery }{${ viewportCSS }}` : '';\n\t\t} )\n\t\t.filter( Boolean )\n\t\t.join( '' );\n}\n\nfunction LayoutPanelPure( {\n\tlayout,\n\tstyle,\n\tsetAttributes,\n\tname: blockName,\n\tclientId,\n} ) {\n\tconst settings = useBlockSettings( blockName );\n\t// Block settings come from theme.json under settings.[blockName].\n\tconst { layout: layoutSettings } = settings;\n\tconst { themeSupportsLayout, activeBlockVariation, selectedState } =\n\t\tuseSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst blockEditorSelect = select( blockEditorStore );\n\t\t\t\tconst { getBlockAttributes, getSettings } = blockEditorSelect;\n\t\t\t\tconst { getSelectedBlockStyleState } =\n\t\t\t\t\tunlock( blockEditorSelect );\n\t\t\t\treturn {\n\t\t\t\t\tactiveBlockVariation: select(\n\t\t\t\t\t\tblocksStore\n\t\t\t\t\t).getActiveBlockVariation(\n\t\t\t\t\t\tblockName,\n\t\t\t\t\t\tgetBlockAttributes( clientId ) || {},\n\t\t\t\t\t\t'block'\n\t\t\t\t\t),\n\t\t\t\t\tthemeSupportsLayout: getSettings().supportsLayout,\n\t\t\t\t\tselectedState:\n\t\t\t\t\t\tgetSelectedBlockStyleState?.( clientId ) ??\n\t\t\t\t\t\tDEFAULT_BLOCK_STYLE_STATE,\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ blockName, clientId ]\n\t\t);\n\n\tconst blockEditingMode = useBlockEditingMode();\n\tconst isViewportLayoutState =\n\t\thasViewportBlockStyleState( selectedState ) &&\n\t\t! hasPseudoBlockStyleState( selectedState );\n\tconst resetLayoutFilter = useCallback(\n\t\t( ...resetArgs ) => {\n\t\t\tconst attributes = resetArgs[ 0 ] || {};\n\t\t\tconst context = resetArgs[ 1 ] || {};\n\n\t\t\tif ( isViewportLayoutState ) {\n\t\t\t\tconst existingStateStyle =\n\t\t\t\t\tgetStyleForState(\n\t\t\t\t\t\tattributes.style ?? style,\n\t\t\t\t\t\tselectedState\n\t\t\t\t\t) || {};\n\t\t\t\tconst nextStateStyle = cleanEmptyObject( {\n\t\t\t\t\t...existingStateStyle,\n\t\t\t\t\tlayout: undefined,\n\t\t\t\t} );\n\n\t\t\t\treturn {\n\t\t\t\t\tstyle: setStyleForState(\n\t\t\t\t\t\tattributes.style ?? style,\n\t\t\t\t\t\tselectedState,\n\t\t\t\t\t\tnextStateStyle\n\t\t\t\t\t),\n\t\t\t\t};\n\t\t\t}\n\n\t\t\tconst resetBlockName = context.name || blockName;\n\t\t\tconst resetLayoutBlockSupport = getBlockSupport(\n\t\t\t\tresetBlockName,\n\t\t\t\tlayoutBlockSupportKey,\n\t\t\t\t{}\n\t\t\t);\n\n\t\t\treturn {\n\t\t\t\tlayout: getResetLayout(\n\t\t\t\t\tresetLayoutBlockSupport,\n\t\t\t\t\tactiveBlockVariation\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[\n\t\t\tblockName,\n\t\t\tactiveBlockVariation,\n\t\t\tisViewportLayoutState,\n\t\t\tselectedState,\n\t\t\tstyle,\n\t\t]\n\t);\n\n\tif ( blockEditingMode !== 'default' ) {\n\t\treturn null;\n\t}\n\n\t// Layout block support comes from the block's block.json.\n\tconst layoutBlockSupport = getBlockSupport(\n\t\tblockName,\n\t\tlayoutBlockSupportKey,\n\t\t{}\n\t);\n\tconst blockSupportAndThemeSettings = {\n\t\t...layoutSettings,\n\t\t...layoutBlockSupport,\n\t};\n\tconst {\n\t\tallowSwitching,\n\t\tallowEditing = true,\n\t\tallowInheriting = true,\n\t\tdefault: defaultBlockLayout,\n\t} = blockSupportAndThemeSettings;\n\n\tif ( ! allowEditing ) {\n\t\treturn null;\n\t}\n\n\t/*\n\t * Try to find the layout type from either the\n\t * block's layout settings or any saved layout config.\n\t */\n\tconst baseLayout = layout || defaultBlockLayout || {};\n\tconst stateStyle = isViewportLayoutState\n\t\t? getStyleForState( style, selectedState )\n\t\t: undefined;\n\tconst stateLayout = stateStyle?.layout;\n\tconst usedLayout = isViewportLayoutState\n\t\t? cleanEmptyObject( {\n\t\t\t\t...baseLayout,\n\t\t\t\t...stateLayout,\n\t\t  } ) || {}\n\t\t: baseLayout;\n\tconst resetLayoutDefaults = isViewportLayoutState\n\t\t? baseLayout\n\t\t: getResetLayout( layoutBlockSupport, activeBlockVariation );\n\tconst blockSupportAndLayout = {\n\t\t...layoutBlockSupport,\n\t\t...usedLayout,\n\t};\n\tconst { type, default: { type: defaultType = 'default' } = {} } =\n\t\tblockSupportAndLayout;\n\tconst blockLayoutType = type || defaultType;\n\n\t// Only show the inherit toggle if it's supported,\n\t// and either the default / flow or the constrained layout type is in use, as the toggle switches from one to the other.\n\tconst showInheritToggle = !! (\n\t\tallowInheriting &&\n\t\t( ! blockLayoutType ||\n\t\t\tblockLayoutType === 'default' ||\n\t\t\tblockLayoutType === 'constrained' ||\n\t\t\tblockSupportAndLayout.inherit )\n\t);\n\n\tconst { inherit = false, contentSize = null } = usedLayout;\n\t/**\n\t * `themeSupportsLayout` is only relevant to the `default/flow` or\n\t * `constrained` layouts and it should not be taken into account when other\n\t * `layout` types are used.\n\t */\n\tif (\n\t\t( blockLayoutType === 'default' ||\n\t\t\tblockLayoutType === 'constrained' ) &&\n\t\t! themeSupportsLayout\n\t) {\n\t\treturn null;\n\t}\n\tconst layoutType = getLayoutType( blockLayoutType );\n\tconst constrainedType = getLayoutType( 'constrained' );\n\tconst displayControlsForLegacyLayouts =\n\t\t! usedLayout.type && ( contentSize || inherit );\n\tconst hasContentSizeOrLegacySettings = !! inherit || !! contentSize;\n\tconst showLayoutTypeSwitcher =\n\t\tisDefaultBlockStyleState( selectedState ) &&\n\t\t! inherit &&\n\t\tallowSwitching;\n\n\tconst onChangeLayout = ( newLayout ) => {\n\t\tif ( isViewportLayoutState ) {\n\t\t\tconst nextStateStyle = cleanEmptyObject( {\n\t\t\t\t...stateStyle,\n\t\t\t\tlayout: getLayoutStateOverrides(\n\t\t\t\t\tcleanEmptyObject( newLayout ),\n\t\t\t\t\tbaseLayout,\n\t\t\t\t\tstateStyle?.layout\n\t\t\t\t),\n\t\t\t} );\n\t\t\tsetAttributes( {\n\t\t\t\tstyle: setStyleForState( style, selectedState, nextStateStyle ),\n\t\t\t} );\n\t\t\treturn;\n\t\t}\n\n\t\tsetAttributes( { layout: cleanEmptyObject( newLayout ) } );\n\t};\n\tconst onChangeType = ( newType ) => onChangeLayout( { type: newType } );\n\tconst resetLayout = () => onChangeLayout( resetLayoutDefaults );\n\tconst resetInheritToggle = () => onChangeLayout( { type: 'default' } );\n\tconst isUsingContentWidth = () =>\n\t\tlayoutType?.name === 'constrained' || hasContentSizeOrLegacySettings;\n\tconst hasInheritToggleValue = () =>\n\t\tisViewportLayoutState\n\t\t\t? ( usedLayout?.type ?? 'default' ) !==\n\t\t\t  ( resetLayoutDefaults?.type ?? 'default' )\n\t\t\t: layout?.type === 'constrained';\n\tconst hasLayoutTypeValue = () =>\n\t\t( usedLayout?.type ?? 'default' ) !==\n\t\t( resetLayoutDefaults?.type ?? 'default' );\n\n\treturn (\n\t\t<>\n\t\t\t<InspectorControls\n\t\t\t\tgroup=\"layout\"\n\t\t\t\tresetAllFilter={ resetLayoutFilter }\n\t\t\t>\n\t\t\t\t{ showInheritToggle && (\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tlabel={ __( 'Use content width' ) }\n\t\t\t\t\t\thasValue={ hasInheritToggleValue }\n\t\t\t\t\t\tonDeselect={ resetInheritToggle }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tlabel={ __( 'Inner blocks use content width' ) }\n\t\t\t\t\t\t\tchecked={ isUsingContentWidth() }\n\t\t\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\t\t\tonChangeLayout( {\n\t\t\t\t\t\t\t\t\ttype: isUsingContentWidth()\n\t\t\t\t\t\t\t\t\t\t? 'default'\n\t\t\t\t\t\t\t\t\t\t: 'constrained',\n\t\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\thelp={\n\t\t\t\t\t\t\t\tisUsingContentWidth()\n\t\t\t\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t\t\t\t'Nested blocks use content width with options for full and wide widths.'\n\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t\t\t'Nested blocks will fill the width of this container.'\n\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t) }\n\n\t\t\t\t{ showLayoutTypeSwitcher && (\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tlabel={ __( 'Layout type' ) }\n\t\t\t\t\t\thasValue={ hasLayoutTypeValue }\n\t\t\t\t\t\tonDeselect={ resetLayout }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t\t>\n\t\t\t\t\t\t<LayoutTypeSwitcher\n\t\t\t\t\t\t\ttype={ blockLayoutType }\n\t\t\t\t\t\t\tonChange={ onChangeType }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t) }\n\n\t\t\t\t{ layoutType && layoutType.name !== 'default' && (\n\t\t\t\t\t<layoutType.inspectorControls\n\t\t\t\t\t\tlayout={ usedLayout }\n\t\t\t\t\t\tvalue={ layout }\n\t\t\t\t\t\tonChange={ onChangeLayout }\n\t\t\t\t\t\tlayoutBlockSupport={ blockSupportAndThemeSettings }\n\t\t\t\t\t\tresetLayout={ resetLayoutDefaults }\n\t\t\t\t\t\tname={ blockName }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ constrainedType && displayControlsForLegacyLayouts && (\n\t\t\t\t\t<constrainedType.inspectorControls\n\t\t\t\t\t\tlayout={ usedLayout }\n\t\t\t\t\t\tvalue={ layout }\n\t\t\t\t\t\tonChange={ onChangeLayout }\n\t\t\t\t\t\tlayoutBlockSupport={ blockSupportAndThemeSettings }\n\t\t\t\t\t\tresetLayout={ resetLayoutDefaults }\n\t\t\t\t\t\tname={ blockName }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</InspectorControls>\n\t\t\t{ ! inherit && layoutType && (\n\t\t\t\t<layoutType.toolBarControls\n\t\t\t\t\tlayout={ usedLayout }\n\t\t\t\t\tonChange={ onChangeLayout }\n\t\t\t\t\tlayoutBlockSupport={ layoutBlockSupport }\n\t\t\t\t\tname={ blockName }\n\t\t\t\t\tclientId={ clientId }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default {\n\tshareWithChildBlocks: true,\n\tedit: LayoutPanelPure,\n\tattributeKeys: [ 'layout', 'style' ],\n\thasSupport( name ) {\n\t\treturn hasLayoutBlockSupport( name );\n\t},\n};\n\nfunction LayoutTypeSwitcher( { type, onChange } ) {\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Layout type' ) }\n\t\t\thideLabelFromVision\n\t\t\tisAdaptiveWidth\n\t\t\tvalue={ type }\n\t\t\tonChange={ onChange }\n\t\t>\n\t\t\t{ getLayoutTypes().map( ( { name, label } ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\tkey={ name }\n\t\t\t\t\t\tvalue={ name }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\n/**\n * Filters registered block settings, extending attributes to include `layout`.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nexport function addAttribute( settings ) {\n\tif ( 'type' in ( settings.attributes?.layout ?? {} ) ) {\n\t\treturn settings;\n\t}\n\tif ( hasLayoutBlockSupport( settings ) ) {\n\t\tsettings.attributes = {\n\t\t\t...settings.attributes,\n\t\t\tlayout: {\n\t\t\t\ttype: 'object',\n\t\t\t},\n\t\t};\n\t}\n\n\treturn settings;\n}\n\nfunction BlockWithLayoutStyles( {\n\tblock: BlockListBlock,\n\tprops,\n\tblockGapSupport,\n\tglobalBlockGapValue,\n\tlayoutClasses,\n} ) {\n\tconst { name, attributes } = props;\n\tconst id = useInstanceId( BlockListBlock );\n\tconst { layout } = attributes;\n\tconst { default: defaultBlockLayout } =\n\t\tgetBlockSupport( name, layoutBlockSupportKey ) || {};\n\tconst usedLayout =\n\t\tlayout?.inherit || layout?.contentSize || layout?.wideSize\n\t\t\t? { ...layout, type: 'constrained' }\n\t\t\t: layout || defaultBlockLayout || {};\n\n\tconst selectorPrefix = `wp-container-${ kebabCase( name ) }-is-layout-`;\n\t// Higher specificity to override defaults from theme.json.\n\tconst selector = `.${ selectorPrefix }${ id }`;\n\tconst hasBlockGapSupport = blockGapSupport !== null;\n\n\t// Get CSS string for the current layout type.\n\t// The CSS and `style` element is only output if it is not empty.\n\tconst fullLayoutType = getLayoutType( usedLayout?.type || 'default' );\n\tconst baseLayoutCSS = fullLayoutType?.getLayoutStyle?.( {\n\t\tblockName: name,\n\t\tselector,\n\t\tlayout: usedLayout,\n\t\tstyle: attributes?.style,\n\t\thasBlockGapSupport,\n\t\tglobalBlockGapValue,\n\t} );\n\tconst responsiveLayoutCSS = getResponsiveLayoutStyles( {\n\t\tattributes,\n\t\tblockName: name,\n\t\tselector,\n\t\tlayout: usedLayout,\n\t\thasBlockGapSupport,\n\t\tglobalBlockGapValue,\n\t} );\n\tconst css = [ baseLayoutCSS, responsiveLayoutCSS ]\n\t\t.filter( Boolean )\n\t\t.join( '' );\n\n\t// Attach a `wp-container-` id-based class name as well as a layout class name such as `is-layout-flex`.\n\tconst layoutClassNames = clsx(\n\t\t{\n\t\t\t[ `${ selectorPrefix }${ id }` ]: !! css, // Only attach a container class if there is generated CSS to be attached.\n\t\t},\n\t\tlayoutClasses\n\t);\n\n\tuseStyleOverride( { css } );\n\n\treturn (\n\t\t<BlockListBlock\n\t\t\t{ ...props }\n\t\t\t__unstableLayoutClassNames={ layoutClassNames }\n\t\t/>\n\t);\n}\n\n/**\n * Override the default block element to add the layout styles.\n *\n * @param {Function} BlockListBlock Original component.\n *\n * @return {Function} Wrapped component.\n */\nexport const withLayoutStyles = createHigherOrderComponent(\n\t( BlockListBlock ) =>\n\t\tfunction WithLayoutStyles( props ) {\n\t\t\tconst { clientId, name, attributes } = props;\n\t\t\tconst blockSupportsLayout = hasLayoutBlockSupport( name );\n\t\t\tconst layoutClasses = useLayoutClasses( attributes, name );\n\t\t\tconst extraProps = useSelect(\n\t\t\t\t( select ) => {\n\t\t\t\t\t// The callback returns early to avoid block editor subscription.\n\t\t\t\t\tif ( ! blockSupportsLayout ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst { getSettings, getBlockSettings } = unlock(\n\t\t\t\t\t\tselect( blockEditorStore )\n\t\t\t\t\t);\n\t\t\t\t\tconst settings = getSettings();\n\t\t\t\t\tconst { disableLayoutStyles } = settings;\n\n\t\t\t\t\tif ( disableLayoutStyles ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst [ blockGapSupport ] = getBlockSettings(\n\t\t\t\t\t\tclientId,\n\t\t\t\t\t\t'spacing.blockGap'\n\t\t\t\t\t);\n\n\t\t\t\t\t// Get default blockGap value from global styles for use in layouts like grid.\n\t\t\t\t\t// Check style variation first, then block-specific styles, then fall back to root styles.\n\t\t\t\t\tconst globalStyles = settings[ globalStylesDataKey ];\n\n\t\t\t\t\t// Check if the block has an active style variation with a blockGap value.\n\t\t\t\t\t// Only check the registry if the className contains a variation class to avoid unnecessary lookups.\n\t\t\t\t\tlet variationBlockGapValue;\n\t\t\t\t\tconst className = attributes?.className;\n\t\t\t\t\tif ( className?.includes( VARIATION_PREFIX ) ) {\n\t\t\t\t\t\tconst { getBlockStyles } = select( blocksStore );\n\t\t\t\t\t\tconst registeredStyles = getBlockStyles( name );\n\t\t\t\t\t\tconst variationName = getVariationNameFromClass(\n\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\tregisteredStyles\n\t\t\t\t\t\t);\n\t\t\t\t\t\tvariationBlockGapValue = variationName\n\t\t\t\t\t\t\t? globalStyles?.blocks?.[ name ]?.variations?.[\n\t\t\t\t\t\t\t\t\tvariationName\n\t\t\t\t\t\t\t  ]?.spacing?.blockGap\n\t\t\t\t\t\t\t: undefined;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst globalBlockGapValue =\n\t\t\t\t\t\tvariationBlockGapValue ??\n\t\t\t\t\t\tglobalStyles?.blocks?.[ name ]?.spacing?.blockGap ??\n\t\t\t\t\t\tglobalStyles?.spacing?.blockGap;\n\n\t\t\t\t\treturn { blockGapSupport, globalBlockGapValue };\n\t\t\t\t},\n\t\t\t\t[ blockSupportsLayout, clientId, attributes?.className, name ]\n\t\t\t);\n\n\t\t\tif ( ! extraProps ) {\n\t\t\t\treturn (\n\t\t\t\t\t<BlockListBlock\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t__unstableLayoutClassNames={\n\t\t\t\t\t\t\tblockSupportsLayout ? layoutClasses : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn (\n\t\t\t\t<BlockWithLayoutStyles\n\t\t\t\t\tblock={ BlockListBlock }\n\t\t\t\t\tprops={ props }\n\t\t\t\t\tlayoutClasses={ layoutClasses }\n\t\t\t\t\t{ ...extraProps }\n\t\t\t\t/>\n\t\t\t);\n\t\t},\n\t'withLayoutStyles'\n);\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/layout/addAttribute',\n\taddAttribute\n);\naddFilter(\n\t'editor.BlockListBlock',\n\t'core/editor/layout/with-layout-styles',\n\twithLayoutStyles\n);\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { createHigherOrderComponent, useInstanceId } from '@wordpress/compose';\nimport { addFilter } from '@wordpress/hooks';\nimport { useCallback } from '@wordpress/element';\nimport {\n\tgetBlockSupport,\n\thasBlockSupport,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { useSelect } from '@wordpress/data';\nimport {\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\tToggleControl,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../store';\nimport { InspectorControls } from '../components';\nimport { useSettings } from '../components/use-settings';\nimport { getLayoutType, getLayoutTypes } from '../layouts';\nimport { useBlockEditingMode } from '../components/block-editing-mode';\nimport { LAYOUT_DEFINITIONS } from '../layouts/definitions';\nimport { cleanEmptyObject, useBlockSettings, useStyleOverride } from './utils';\nimport { unlock } from '../lock-unlock';\nimport { globalStylesDataKey } from '../store/private-keys';\nimport { getVariationNameFromClass } from './block-style-variation';\nimport {\n\tDEFAULT_BLOCK_STYLE_STATE,\n\tgetStyleForState,\n\thasPseudoBlockStyleState,\n\thasViewportBlockStyleState,\n\tisDefaultBlockStyleState,\n\tsetStyleForState,\n} from './block-style-state';\n\nconst VARIATION_PREFIX = 'is-style-';\n\nconst layoutBlockSupportKey = 'layout';\n// Keep in sync with WP_Theme_JSON_Gutenberg::RESPONSIVE_BREAKPOINTS and\n// packages/global-styles-engine/src/core/render.tsx.\nconst RESPONSIVE_BREAKPOINTS = {\n\t'@mobile': '@media (width <= 480px)',\n\t'@tablet': '@media (480px < width <= 782px)',\n};\nconst CHILD_LAYOUT_KEYS = [\n\t'selfStretch',\n\t'flexSize',\n\t'columnStart',\n\t'columnSpan',\n\t'rowStart',\n\t'rowSpan',\n];\nconst { kebabCase } = unlock( componentsPrivateApis );\n\nfunction getDefaultLayout( layoutBlockSupport = {}, blockVariation ) {\n\tconst defaultBlockLayout = layoutBlockSupport?.default;\n\n\treturn blockVariation?.attributes?.layout ?? defaultBlockLayout;\n}\n\n/**\n * Returns the layout values to use when resetting layout controls.\n *\n * @param { Object }           layoutBlockSupport Block layout support settings.\n * @param { Object|undefined } blockVariation     Block variation settings.\n *\n * @return { Object|undefined } Reset layout values.\n */\nexport function getResetLayout( layoutBlockSupport = {}, blockVariation ) {\n\treturn cleanEmptyObject( {\n\t\t...getDefaultLayout( layoutBlockSupport, blockVariation ),\n\t} );\n}\n\nfunction getLayoutStateOverrides(\n\tlayout = {},\n\tbaseLayout = {},\n\texistingLayout = {}\n) {\n\tconst overrides = {};\n\tconst childLayoutValues = Object.fromEntries(\n\t\tCHILD_LAYOUT_KEYS.filter( ( key ) =>\n\t\t\tObject.hasOwn( existingLayout || {}, key )\n\t\t).map( ( key ) => [ key, existingLayout[ key ] ] )\n\t);\n\n\tObject.entries( layout || {} ).forEach( ( [ key, value ] ) => {\n\t\tif (\n\t\t\t! CHILD_LAYOUT_KEYS.includes( key ) &&\n\t\t\tvalue !== baseLayout?.[ key ]\n\t\t) {\n\t\t\toverrides[ key ] = value;\n\t\t}\n\t} );\n\n\treturn cleanEmptyObject( {\n\t\t...childLayoutValues,\n\t\t...overrides,\n\t} );\n}\n\nfunction getLayoutContainerValues( layout = {} ) {\n\treturn Object.fromEntries(\n\t\tObject.entries( layout || {} ).filter(\n\t\t\t( [ key ] ) => ! CHILD_LAYOUT_KEYS.includes( key )\n\t\t)\n\t);\n}\n\nfunction hasLayoutBlockSupport( blockName ) {\n\treturn (\n\t\thasBlockSupport( blockName, 'layout' ) ||\n\t\thasBlockSupport( blockName, '__experimentalLayout' )\n\t);\n}\n\n/**\n * Generates the utility classnames for the given block's layout attributes.\n *\n * @param { Object } blockAttributes Block attributes.\n * @param { string } blockName       Block name.\n *\n * @return { Array } Array of CSS classname strings.\n */\nexport function useLayoutClasses( blockAttributes = {}, blockName = '' ) {\n\tconst { layout } = blockAttributes;\n\tconst { default: defaultBlockLayout } =\n\t\tgetBlockSupport( blockName, layoutBlockSupportKey ) || {};\n\tconst usedLayout =\n\t\tlayout?.inherit || layout?.contentSize || layout?.wideSize\n\t\t\t? { ...layout, type: 'constrained' }\n\t\t\t: layout || defaultBlockLayout || {};\n\n\tconst layoutClassnames = [];\n\n\tif ( LAYOUT_DEFINITIONS[ usedLayout?.type || 'default' ]?.className ) {\n\t\tconst baseClassName =\n\t\t\tLAYOUT_DEFINITIONS[ usedLayout?.type || 'default' ]?.className;\n\t\tconst splitBlockName = blockName.split( '/' );\n\t\tconst fullBlockName =\n\t\t\tsplitBlockName[ 0 ] === 'core'\n\t\t\t\t? splitBlockName.pop()\n\t\t\t\t: splitBlockName.join( '-' );\n\t\tconst compoundClassName = `wp-block-${ fullBlockName }-${ baseClassName }`;\n\t\tlayoutClassnames.push( baseClassName, compoundClassName );\n\t}\n\n\tconst hasGlobalPadding = useSelect(\n\t\t( select ) => {\n\t\t\t// Early return to avoid subscription when layout doesn't use global padding\n\t\t\tif (\n\t\t\t\t! usedLayout?.inherit &&\n\t\t\t\t! usedLayout?.contentSize &&\n\t\t\t\tusedLayout?.type !== 'constrained'\n\t\t\t) {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\treturn select( blockEditorStore ).getSettings()\n\t\t\t\t.__experimentalFeatures?.useRootPaddingAwareAlignments;\n\t\t},\n\t\t[ usedLayout?.contentSize, usedLayout?.inherit, usedLayout?.type ]\n\t);\n\n\tif ( hasGlobalPadding ) {\n\t\tlayoutClassnames.push( 'has-global-padding' );\n\t}\n\n\tif ( usedLayout?.orientation ) {\n\t\tlayoutClassnames.push( `is-${ kebabCase( usedLayout.orientation ) }` );\n\t}\n\n\tif ( usedLayout?.justifyContent ) {\n\t\tlayoutClassnames.push(\n\t\t\t`is-content-justification-${ kebabCase(\n\t\t\t\tusedLayout.justifyContent\n\t\t\t) }`\n\t\t);\n\t}\n\n\tif ( usedLayout?.flexWrap && usedLayout.flexWrap === 'nowrap' ) {\n\t\tlayoutClassnames.push( 'is-nowrap' );\n\t}\n\n\treturn layoutClassnames;\n}\n\n/**\n * Generates a CSS rule with the given block's layout styles.\n *\n * @param { Object } blockAttributes Block attributes.\n * @param { string } blockName       Block name.\n * @param { string } selector        A selector to use in generating the CSS rule.\n *\n * @return { string } CSS rule.\n */\nexport function useLayoutStyles( blockAttributes = {}, blockName, selector ) {\n\tconst { layout = {}, style = {} } = blockAttributes;\n\t// Update type for blocks using legacy layouts.\n\tconst usedLayout =\n\t\tlayout?.inherit || layout?.contentSize || layout?.wideSize\n\t\t\t? { ...layout, type: 'constrained' }\n\t\t\t: layout || {};\n\tconst fullLayoutType = getLayoutType( usedLayout?.type || 'default' );\n\tconst [ blockGapSupport ] = useSettings( 'spacing.blockGap' );\n\tconst hasBlockGapSupport = blockGapSupport !== null;\n\treturn fullLayoutType?.getLayoutStyle?.( {\n\t\tblockName,\n\t\tselector,\n\t\tlayout,\n\t\tstyle,\n\t\thasBlockGapSupport,\n\t} );\n}\n\n/**\n * Generates responsive layout CSS for viewport state styles.\n *\n * Viewport state blockGap values need to go through the layout definitions\n * because flow/constrained layouts use child margins while flex/grid use gap.\n *\n * @param { Object }  options                     Options.\n * @param { Object }  options.attributes          Block attributes.\n * @param { string }  options.blockName           Block name.\n * @param { string }  options.selector            CSS selector.\n * @param { Object }  options.layout              Active block layout.\n * @param { boolean } options.hasBlockGapSupport  Whether block gap is supported.\n * @param { * }       options.globalBlockGapValue Global block gap fallback.\n *\n * @return { string } CSS rule.\n */\nexport function getResponsiveLayoutStyles( {\n\tattributes = {},\n\tblockName,\n\tselector,\n\tlayout = {},\n\thasBlockGapSupport,\n\tglobalBlockGapValue,\n} ) {\n\treturn Object.entries( RESPONSIVE_BREAKPOINTS )\n\t\t.map( ( [ viewport, mediaQuery ] ) => {\n\t\t\tconst viewportStyle = getStyleForState( attributes?.style, {\n\t\t\t\tviewport,\n\t\t\t\tpseudo: DEFAULT_BLOCK_STYLE_STATE.pseudo,\n\t\t\t} );\n\t\t\tconst viewportLayout = getLayoutContainerValues(\n\t\t\t\tviewportStyle?.layout\n\t\t\t);\n\t\t\tconst hasViewportLayout = Object.keys( viewportLayout ).length > 0;\n\t\t\tconst hasViewportBlockGap =\n\t\t\t\tviewportStyle?.spacing &&\n\t\t\t\tObject.hasOwn( viewportStyle.spacing, 'blockGap' );\n\t\t\tconst hasViewportPadding =\n\t\t\t\tviewportStyle?.spacing &&\n\t\t\t\tObject.hasOwn( viewportStyle.spacing, 'padding' );\n\t\t\tif (\n\t\t\t\t! hasViewportLayout &&\n\t\t\t\t! hasViewportBlockGap &&\n\t\t\t\t! hasViewportPadding\n\t\t\t) {\n\t\t\t\treturn '';\n\t\t\t}\n\n\t\t\tconst layoutType = getLayoutType( layout?.type || 'default' );\n\t\t\tconst viewportCSS = layoutType?.getLayoutStyle?.( {\n\t\t\t\tblockName,\n\t\t\t\tselector,\n\t\t\t\tlayout,\n\t\t\t\tviewportOverrides: viewportLayout,\n\t\t\t\tstyle: viewportStyle,\n\t\t\t\thasBlockGapSupport,\n\t\t\t\tglobalBlockGapValue,\n\t\t\t} );\n\n\t\t\treturn viewportCSS ? `${ mediaQuery }{${ viewportCSS }}` : '';\n\t\t} )\n\t\t.filter( Boolean )\n\t\t.join( '' );\n}\n\nfunction LayoutPanelPure( {\n\tlayout,\n\tstyle,\n\tsetAttributes,\n\tname: blockName,\n\tclientId,\n} ) {\n\tconst settings = useBlockSettings( blockName );\n\t// Block settings come from theme.json under settings.[blockName].\n\tconst { layout: layoutSettings } = settings;\n\tconst { themeSupportsLayout, activeBlockVariation, selectedState } =\n\t\tuseSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst blockEditorSelect = select( blockEditorStore );\n\t\t\t\tconst { getBlockAttributes, getSettings } = blockEditorSelect;\n\t\t\t\tconst { getSelectedBlockStyleState } =\n\t\t\t\t\tunlock( blockEditorSelect );\n\t\t\t\treturn {\n\t\t\t\t\tactiveBlockVariation: select(\n\t\t\t\t\t\tblocksStore\n\t\t\t\t\t).getActiveBlockVariation(\n\t\t\t\t\t\tblockName,\n\t\t\t\t\t\tgetBlockAttributes( clientId ) || {},\n\t\t\t\t\t\t'block'\n\t\t\t\t\t),\n\t\t\t\t\tthemeSupportsLayout: getSettings().supportsLayout,\n\t\t\t\t\tselectedState:\n\t\t\t\t\t\tgetSelectedBlockStyleState?.( clientId ) ??\n\t\t\t\t\t\tDEFAULT_BLOCK_STYLE_STATE,\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ blockName, clientId ]\n\t\t);\n\n\tconst blockEditingMode = useBlockEditingMode();\n\tconst isViewportLayoutState =\n\t\thasViewportBlockStyleState( selectedState ) &&\n\t\t! hasPseudoBlockStyleState( selectedState );\n\tconst resetLayoutFilter = useCallback(\n\t\t( ...resetArgs ) => {\n\t\t\tconst attributes = resetArgs[ 0 ] || {};\n\t\t\tconst context = resetArgs[ 1 ] || {};\n\n\t\t\tif ( isViewportLayoutState ) {\n\t\t\t\tconst existingStateStyle =\n\t\t\t\t\tgetStyleForState(\n\t\t\t\t\t\tattributes.style ?? style,\n\t\t\t\t\t\tselectedState\n\t\t\t\t\t) || {};\n\t\t\t\tconst nextStateStyle = cleanEmptyObject( {\n\t\t\t\t\t...existingStateStyle,\n\t\t\t\t\tlayout: undefined,\n\t\t\t\t} );\n\n\t\t\t\treturn {\n\t\t\t\t\tstyle: setStyleForState(\n\t\t\t\t\t\tattributes.style ?? style,\n\t\t\t\t\t\tselectedState,\n\t\t\t\t\t\tnextStateStyle\n\t\t\t\t\t),\n\t\t\t\t};\n\t\t\t}\n\n\t\t\tconst resetBlockName = context.name || blockName;\n\t\t\tconst resetLayoutBlockSupport = getBlockSupport(\n\t\t\t\tresetBlockName,\n\t\t\t\tlayoutBlockSupportKey,\n\t\t\t\t{}\n\t\t\t);\n\n\t\t\treturn {\n\t\t\t\tlayout: getResetLayout(\n\t\t\t\t\tresetLayoutBlockSupport,\n\t\t\t\t\tactiveBlockVariation\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[\n\t\t\tblockName,\n\t\t\tactiveBlockVariation,\n\t\t\tisViewportLayoutState,\n\t\t\tselectedState,\n\t\t\tstyle,\n\t\t]\n\t);\n\n\tif ( blockEditingMode !== 'default' ) {\n\t\treturn null;\n\t}\n\n\t// Layout block support comes from the block's block.json.\n\tconst layoutBlockSupport = getBlockSupport(\n\t\tblockName,\n\t\tlayoutBlockSupportKey,\n\t\t{}\n\t);\n\tconst blockSupportAndThemeSettings = {\n\t\t...layoutSettings,\n\t\t...layoutBlockSupport,\n\t};\n\tconst {\n\t\tallowSwitching,\n\t\tallowEditing = true,\n\t\tallowInheriting = true,\n\t\tdefault: defaultBlockLayout,\n\t} = blockSupportAndThemeSettings;\n\n\tif ( ! allowEditing ) {\n\t\treturn null;\n\t}\n\n\t/*\n\t * Try to find the layout type from either the\n\t * block's layout settings or any saved layout config.\n\t */\n\tconst baseLayout = layout || defaultBlockLayout || {};\n\tconst stateStyle = isViewportLayoutState\n\t\t? getStyleForState( style, selectedState )\n\t\t: undefined;\n\tconst stateLayout = stateStyle?.layout;\n\tconst usedLayout = isViewportLayoutState\n\t\t? cleanEmptyObject( {\n\t\t\t\t...baseLayout,\n\t\t\t\t...stateLayout,\n\t\t  } ) || {}\n\t\t: baseLayout;\n\tconst resetLayoutDefaults = isViewportLayoutState\n\t\t? baseLayout\n\t\t: getResetLayout( layoutBlockSupport, activeBlockVariation );\n\tconst blockSupportAndLayout = {\n\t\t...layoutBlockSupport,\n\t\t...usedLayout,\n\t};\n\tconst { type, default: { type: defaultType = 'default' } = {} } =\n\t\tblockSupportAndLayout;\n\tconst blockLayoutType = type || defaultType;\n\n\t// Only show the inherit toggle if it's supported,\n\t// and either the default / flow or the constrained layout type is in use, as the toggle switches from one to the other.\n\tconst showInheritToggle = !! (\n\t\tallowInheriting &&\n\t\t( ! blockLayoutType ||\n\t\t\tblockLayoutType === 'default' ||\n\t\t\tblockLayoutType === 'constrained' ||\n\t\t\tblockSupportAndLayout.inherit )\n\t);\n\n\tconst { inherit = false, contentSize = null } = usedLayout;\n\t/**\n\t * `themeSupportsLayout` is only relevant to the `default/flow` or\n\t * `constrained` layouts and it should not be taken into account when other\n\t * `layout` types are used.\n\t */\n\tif (\n\t\t( blockLayoutType === 'default' ||\n\t\t\tblockLayoutType === 'constrained' ) &&\n\t\t! themeSupportsLayout\n\t) {\n\t\treturn null;\n\t}\n\tconst layoutType = getLayoutType( blockLayoutType );\n\tconst constrainedType = getLayoutType( 'constrained' );\n\tconst displayControlsForLegacyLayouts =\n\t\t! usedLayout.type && ( contentSize || inherit );\n\tconst hasContentSizeOrLegacySettings = !! inherit || !! contentSize;\n\tconst showLayoutTypeSwitcher =\n\t\tisDefaultBlockStyleState( selectedState ) &&\n\t\t! inherit &&\n\t\tallowSwitching;\n\n\tconst onChangeLayout = ( newLayout ) => {\n\t\tif ( isViewportLayoutState ) {\n\t\t\tconst nextStateStyle = cleanEmptyObject( {\n\t\t\t\t...stateStyle,\n\t\t\t\tlayout: getLayoutStateOverrides(\n\t\t\t\t\tcleanEmptyObject( newLayout ),\n\t\t\t\t\tbaseLayout,\n\t\t\t\t\tstateStyle?.layout\n\t\t\t\t),\n\t\t\t} );\n\t\t\tsetAttributes( {\n\t\t\t\tstyle: setStyleForState( style, selectedState, nextStateStyle ),\n\t\t\t} );\n\t\t\treturn;\n\t\t}\n\n\t\tsetAttributes( { layout: cleanEmptyObject( newLayout ) } );\n\t};\n\tconst onChangeType = ( newType ) => onChangeLayout( { type: newType } );\n\tconst resetLayout = () => onChangeLayout( resetLayoutDefaults );\n\tconst resetInheritToggle = () => onChangeLayout( { type: 'default' } );\n\tconst isUsingContentWidth = () =>\n\t\tlayoutType?.name === 'constrained' || hasContentSizeOrLegacySettings;\n\tconst hasInheritToggleValue = () =>\n\t\tisViewportLayoutState\n\t\t\t? ( usedLayout?.type ?? 'default' ) !==\n\t\t\t  ( resetLayoutDefaults?.type ?? 'default' )\n\t\t\t: layout?.type === 'constrained';\n\tconst hasLayoutTypeValue = () =>\n\t\t( usedLayout?.type ?? 'default' ) !==\n\t\t( resetLayoutDefaults?.type ?? 'default' );\n\n\treturn (\n\t\t<>\n\t\t\t<InspectorControls\n\t\t\t\tgroup=\"layout\"\n\t\t\t\tresetAllFilter={ resetLayoutFilter }\n\t\t\t>\n\t\t\t\t{ showInheritToggle && (\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tlabel={ __( 'Use content width' ) }\n\t\t\t\t\t\thasValue={ hasInheritToggleValue }\n\t\t\t\t\t\tonDeselect={ resetInheritToggle }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tlabel={ __( 'Inner blocks use content width' ) }\n\t\t\t\t\t\t\tchecked={ isUsingContentWidth() }\n\t\t\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\t\t\tonChangeLayout( {\n\t\t\t\t\t\t\t\t\ttype: isUsingContentWidth()\n\t\t\t\t\t\t\t\t\t\t? 'default'\n\t\t\t\t\t\t\t\t\t\t: 'constrained',\n\t\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\thelp={\n\t\t\t\t\t\t\t\tisUsingContentWidth()\n\t\t\t\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t\t\t\t'Nested blocks use content width with options for full and wide widths.'\n\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t\t\t'Nested blocks will fill the width of this container.'\n\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t) }\n\n\t\t\t\t{ showLayoutTypeSwitcher && (\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tlabel={ __( 'Layout type' ) }\n\t\t\t\t\t\thasValue={ hasLayoutTypeValue }\n\t\t\t\t\t\tonDeselect={ resetLayout }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t\t>\n\t\t\t\t\t\t<LayoutTypeSwitcher\n\t\t\t\t\t\t\ttype={ blockLayoutType }\n\t\t\t\t\t\t\tonChange={ onChangeType }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t) }\n\n\t\t\t\t{ layoutType && layoutType.name !== 'default' && (\n\t\t\t\t\t<layoutType.inspectorControls\n\t\t\t\t\t\tlayout={ usedLayout }\n\t\t\t\t\t\tvalue={ layout }\n\t\t\t\t\t\tonChange={ onChangeLayout }\n\t\t\t\t\t\tlayoutBlockSupport={ blockSupportAndThemeSettings }\n\t\t\t\t\t\tresetLayout={ resetLayoutDefaults }\n\t\t\t\t\t\tname={ blockName }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ constrainedType && displayControlsForLegacyLayouts && (\n\t\t\t\t\t<constrainedType.inspectorControls\n\t\t\t\t\t\tlayout={ usedLayout }\n\t\t\t\t\t\tvalue={ layout }\n\t\t\t\t\t\tonChange={ onChangeLayout }\n\t\t\t\t\t\tlayoutBlockSupport={ blockSupportAndThemeSettings }\n\t\t\t\t\t\tresetLayout={ resetLayoutDefaults }\n\t\t\t\t\t\tname={ blockName }\n\t\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</InspectorControls>\n\t\t\t{ ! inherit && layoutType && (\n\t\t\t\t<layoutType.toolBarControls\n\t\t\t\t\tlayout={ usedLayout }\n\t\t\t\t\tonChange={ onChangeLayout }\n\t\t\t\t\tlayoutBlockSupport={ layoutBlockSupport }\n\t\t\t\t\tname={ blockName }\n\t\t\t\t\tclientId={ clientId }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default {\n\tshareWithChildBlocks: true,\n\tedit: LayoutPanelPure,\n\tattributeKeys: [ 'layout', 'style' ],\n\thasSupport( name ) {\n\t\treturn hasLayoutBlockSupport( name );\n\t},\n};\n\nfunction LayoutTypeSwitcher( { type, onChange } ) {\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Layout type' ) }\n\t\t\thideLabelFromVision\n\t\t\tisAdaptiveWidth\n\t\t\tvalue={ type }\n\t\t\tonChange={ onChange }\n\t\t>\n\t\t\t{ getLayoutTypes().map( ( { name, label } ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\tkey={ name }\n\t\t\t\t\t\tvalue={ name }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\n/**\n * Filters registered block settings, extending attributes to include `layout`.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nexport function addAttribute( settings ) {\n\tif ( 'type' in ( settings.attributes?.layout ?? {} ) ) {\n\t\treturn settings;\n\t}\n\tif ( hasLayoutBlockSupport( settings ) ) {\n\t\tsettings.attributes = {\n\t\t\t...settings.attributes,\n\t\t\tlayout: {\n\t\t\t\ttype: 'object',\n\t\t\t},\n\t\t};\n\t}\n\n\treturn settings;\n}\n\nfunction BlockWithLayoutStyles( {\n\tblock: BlockListBlock,\n\tprops,\n\tblockGapSupport,\n\tglobalBlockGapValue,\n\tlayoutClasses,\n} ) {\n\tconst { name, attributes } = props;\n\tconst id = useInstanceId( BlockListBlock );\n\tconst { layout } = attributes;\n\tconst { default: defaultBlockLayout } =\n\t\tgetBlockSupport( name, layoutBlockSupportKey ) || {};\n\tconst usedLayout =\n\t\tlayout?.inherit || layout?.contentSize || layout?.wideSize\n\t\t\t? { ...layout, type: 'constrained' }\n\t\t\t: layout || defaultBlockLayout || {};\n\n\tconst selectorPrefix = `wp-container-${ kebabCase( name ) }-is-layout-`;\n\t// Higher specificity to override defaults from theme.json.\n\tconst selector = `.${ selectorPrefix }${ id }`;\n\tconst hasBlockGapSupport = blockGapSupport !== null;\n\n\t// Get CSS string for the current layout type.\n\t// The CSS and `style` element is only output if it is not empty.\n\tconst fullLayoutType = getLayoutType( usedLayout?.type || 'default' );\n\tconst baseLayoutCSS = fullLayoutType?.getLayoutStyle?.( {\n\t\tblockName: name,\n\t\tselector,\n\t\tlayout: usedLayout,\n\t\tstyle: attributes?.style,\n\t\thasBlockGapSupport,\n\t\tglobalBlockGapValue,\n\t} );\n\tconst responsiveLayoutCSS = getResponsiveLayoutStyles( {\n\t\tattributes,\n\t\tblockName: name,\n\t\tselector,\n\t\tlayout: usedLayout,\n\t\thasBlockGapSupport,\n\t\tglobalBlockGapValue,\n\t} );\n\tconst css = [ baseLayoutCSS, responsiveLayoutCSS ]\n\t\t.filter( Boolean )\n\t\t.join( '' );\n\n\t// Attach a `wp-container-` id-based class name as well as a layout class name such as `is-layout-flex`.\n\tconst layoutClassNames = clsx(\n\t\t{\n\t\t\t[ `${ selectorPrefix }${ id }` ]: !! css, // Only attach a container class if there is generated CSS to be attached.\n\t\t},\n\t\tlayoutClasses\n\t);\n\n\tuseStyleOverride( { css } );\n\n\treturn (\n\t\t<BlockListBlock\n\t\t\t{ ...props }\n\t\t\t__unstableLayoutClassNames={ layoutClassNames }\n\t\t/>\n\t);\n}\n\n/**\n * Override the default block element to add the layout styles.\n *\n * @param {Function} BlockListBlock Original component.\n *\n * @return {Function} Wrapped component.\n */\nexport const withLayoutStyles = createHigherOrderComponent(\n\t( BlockListBlock ) =>\n\t\tfunction WithLayoutStyles( props ) {\n\t\t\tconst { clientId, name, attributes } = props;\n\t\t\tconst blockSupportsLayout = hasLayoutBlockSupport( name );\n\t\t\tconst layoutClasses = useLayoutClasses( attributes, name );\n\t\t\tconst extraProps = useSelect(\n\t\t\t\t( select ) => {\n\t\t\t\t\t// The callback returns early to avoid block editor subscription.\n\t\t\t\t\tif ( ! blockSupportsLayout ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst { getSettings, getBlockSettings } = unlock(\n\t\t\t\t\t\tselect( blockEditorStore )\n\t\t\t\t\t);\n\t\t\t\t\tconst settings = getSettings();\n\t\t\t\t\tconst { disableLayoutStyles } = settings;\n\n\t\t\t\t\tif ( disableLayoutStyles ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst [ blockGapSupport ] = getBlockSettings(\n\t\t\t\t\t\tclientId,\n\t\t\t\t\t\t'spacing.blockGap'\n\t\t\t\t\t);\n\n\t\t\t\t\t// Get default blockGap value from global styles for use in layouts like grid.\n\t\t\t\t\t// Check style variation first, then block-specific styles, then fall back to root styles.\n\t\t\t\t\tconst globalStyles = settings[ globalStylesDataKey ];\n\n\t\t\t\t\t// Check if the block has an active style variation with a blockGap value.\n\t\t\t\t\t// Only check the registry if the className contains a variation class to avoid unnecessary lookups.\n\t\t\t\t\tlet variationBlockGapValue;\n\t\t\t\t\tconst className = attributes?.className;\n\t\t\t\t\tif ( className?.includes( VARIATION_PREFIX ) ) {\n\t\t\t\t\t\tconst { getBlockStyles } = select( blocksStore );\n\t\t\t\t\t\tconst registeredStyles = getBlockStyles( name );\n\t\t\t\t\t\tconst variationName = getVariationNameFromClass(\n\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\tregisteredStyles\n\t\t\t\t\t\t);\n\t\t\t\t\t\tvariationBlockGapValue = variationName\n\t\t\t\t\t\t\t? globalStyles?.blocks?.[ name ]?.variations?.[\n\t\t\t\t\t\t\t\t\tvariationName\n\t\t\t\t\t\t\t  ]?.spacing?.blockGap\n\t\t\t\t\t\t\t: undefined;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst globalBlockGapValue =\n\t\t\t\t\t\tvariationBlockGapValue ??\n\t\t\t\t\t\tglobalStyles?.blocks?.[ name ]?.spacing?.blockGap ??\n\t\t\t\t\t\tglobalStyles?.spacing?.blockGap;\n\n\t\t\t\t\treturn { blockGapSupport, globalBlockGapValue };\n\t\t\t\t},\n\t\t\t\t[ blockSupportsLayout, clientId, attributes?.className, name ]\n\t\t\t);\n\n\t\t\tif ( ! extraProps ) {\n\t\t\t\treturn (\n\t\t\t\t\t<BlockListBlock\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t__unstableLayoutClassNames={\n\t\t\t\t\t\t\tblockSupportsLayout ? layoutClasses : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn (\n\t\t\t\t<BlockWithLayoutStyles\n\t\t\t\t\tblock={ BlockListBlock }\n\t\t\t\t\tprops={ props }\n\t\t\t\t\tlayoutClasses={ layoutClasses }\n\t\t\t\t\t{ ...extraProps }\n\t\t\t\t/>\n\t\t\t);\n\t\t},\n\t'withLayoutStyles'\n);\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/layout/addAttribute',\n\taddAttribute\n);\naddFilter(\n\t'editor.BlockListBlock',\n\t'core/editor/layout/with-layout-styles',\n\twithLayoutStyles\n);\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/hooks/list-view.mjs CHANGED Viewed

@@ -21,16 +21,19 @@ function ListViewPanel({ clientId, name }) {
   const { openListViewContentPanel } = unlock(
     useDispatch(blockEditorStore)
   );
-  const isEnabled = hasListViewSupport(name);
-  const { hasChildren, isNestedListView } = useSelect(
+  const { isEnabled, hasChildren, isNestedListView } = useSelect(
     (select) => {
-      const { getBlockCount, getBlockParents, getBlockName } = select(blockEditorStore);
+      const {
+        getBlockCount,
+        getBlockParents,
+        shouldRenderBlockListView
+      } = unlock(select(blockEditorStore));
       const parents = getBlockParents(clientId, false);
-      const _isNestedListView = parents.find((parentId) => {
-        const parentName = getBlockName(parentId);
-        return parentName === "core/navigation" || hasBlockSupport(parentName, "listView");
-      });
+      const _isNestedListView = parents.find(
+        (parentId) => shouldRenderBlockListView(parentId)
+      );
       return {
+        isEnabled: shouldRenderBlockListView(clientId),
         hasChildren: !!getBlockCount(clientId),
         isNestedListView: _isNestedListView
       };

package/build-module/hooks/list-view.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/hooks/list-view.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { PanelBody } from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { hasBlockSupport, getBlockType } from '@wordpress/blocks';\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../store';\nimport { PrivateListView } from '../components/list-view';\nimport InspectorControls from '../components/inspector-controls/fill';\nimport { PrivateBlockContext } from '../components/block-list/private-block-context';\nimport useListViewPanelState from '../components/use-list-view-panel-state';\n\nimport { unlock } from '../lock-unlock';\n\nexport const LIST_VIEW_SUPPORT_KEY = 'listView';\n\n/**\n * Check if the block has list view support.\n *\n * @param {string|Object} nameOrType Block name or block type object.\n * @return {boolean} Whether the block has list view support.\n */\nexport function hasListViewSupport( nameOrType ) {\n\treturn hasBlockSupport( nameOrType, LIST_VIEW_SUPPORT_KEY );\n}\n\n/**\n * Inspector controls panel for list view.\n *\n * @param {Object} props          Component props.\n * @param {string} props.clientId Block client ID.\n * @param {string} props.name     Block name.\n * @return {Element|null} List view inspector controls or null.\n */\nexport function ListViewPanel( { clientId, name } ) {\n\tconst { isSelectionWithinCurrentSection } =\n\t\tuseContext( PrivateBlockContext );\n\n\tconst { isOpened, expandRevision, handleToggle } =\n\t\tuseListViewPanelState( clientId );\n\n\t// eslint-disable-next-line @wordpress/no-unused-vars-before-return\n\tconst { openListViewContentPanel } = unlock(\n\t\tuseDispatch( blockEditorStore )\n\t);\n\n\tconst isEnabled = hasListViewSupport( name );\n\tconst { hasChildren, isNestedListView } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockCount, getBlockParents, getBlockName } =\n\t\t\t\tselect( blockEditorStore );\n\n\t\t\t// Avoid showing List Views for both parent and child blocks that have support.\n\t\t\t// In this situation the parent will show the child in its list already.\n\t\t\t// Search parents to see if there's one that also has support, and if so skip rendering.\n\t\t\t// This matches closely the logic in the `BlockCard` component.\n\t\t\tconst parents = getBlockParents( clientId, false );\n\t\t\tconst _isNestedListView = parents.find( ( parentId ) => {\n\t\t\t\tconst parentName = getBlockName( parentId );\n\t\t\t\treturn (\n\t\t\t\t\tparentName === 'core/navigation' ||\n\t\t\t\t\thasBlockSupport( parentName, 'listView' )\n\t\t\t\t);\n\t\t\t} );\n\n\t\t\treturn {\n\t\t\t\thasChildren: !! getBlockCount( clientId ),\n\t\t\t\tisNestedListView: _isNestedListView,\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\tconst blockType = getBlockType( name );\n\tconst title = blockType?.title || name;\n\n\tif ( ! isEnabled || isNestedListView ) {\n\t\treturn null;\n\t}\n\n\tconst showBlockTitle = isSelectionWithinCurrentSection;\n\n\treturn (\n\t\t<InspectorControls group=\"list\">\n\t\t\t<PanelBody\n\t\t\t\ttitle={ showBlockTitle ? title : undefined }\n\t\t\t\topened={ isOpened }\n\t\t\t\tonToggle={ handleToggle }\n\t\t\t>\n\t\t\t\t{ ! hasChildren && (\n\t\t\t\t\t<p className=\"block-editor-block-inspector__no-blocks\">\n\t\t\t\t\t\t{ __( 'No items yet.' ) }\n\t\t\t\t\t</p>\n\t\t\t\t) }\n\t\t\t\t<PrivateListView\n\t\t\t\t\tkey={ `${ clientId }-${ expandRevision }` }\n\t\t\t\t\trootClientId={ clientId }\n\t\t\t\t\tisExpanded\n\t\t\t\t\tdescription={ title }\n\t\t\t\t\tshowAppender\n\t\t\t\t\tonSelect={ openListViewContentPanel }\n\t\t\t\t/>\n\t\t\t</PanelBody>\n\t\t</InspectorControls>\n\t);\n}\n\n/**\n * Export block support definition.\n */\nexport default {\n\tedit: ListViewPanel,\n\thasSupport: hasListViewSupport,\n\tattributeKeys: [],\n\tsupportsPatternEditing: true,\n};\n"],
-  "mappings": ";AAGA,SAAS,UAAU;AACnB,SAAS,iBAAiB;AAC1B,SAAS,aAAa,iBAAiB;AACvC,SAAS,iBAAiB,oBAAoB;AAC9C,SAAS,kBAAkB;AAK3B,SAAS,SAAS,wBAAwB;AAC1C,SAAS,uBAAuB;AAChC,OAAO,uBAAuB;AAC9B,SAAS,2BAA2B;AACpC,OAAO,2BAA2B;AAElC,SAAS,cAAc;AAwEpB,SAME,KANF;AAtEI,IAAM,wBAAwB;AAQ9B,SAAS,mBAAoB,YAAa;AAChD,SAAO,gBAAiB,YAAY,qBAAsB;AAC3D;AAUO,SAAS,cAAe,EAAE,UAAU,KAAK,GAAI;AACnD,QAAM,EAAE,gCAAgC,IACvC,WAAY,mBAAoB;AAEjC,QAAM,EAAE,UAAU,gBAAgB,aAAa,IAC9C,sBAAuB,QAAS;AAGjC,QAAM,EAAE,yBAAyB,IAAI;AAAA,IACpC,YAAa,gBAAiB;AAAA,EAC/B;AAEA,QAAM,YAAY,mBAAoB,IAAK;AAC3C,QAAM,EAAE,aAAa,iBAAiB,IAAI;AAAA,IACzC,CAAE,WAAY;AACb,YAAM,EAAE,eAAe,iBAAiB,aAAa,IACpD,OAAQ,gBAAiB;AAM1B,YAAM,UAAU,gBAAiB,UAAU,KAAM;AACjD,YAAM,oBAAoB,QAAQ,KAAM,CAAE,aAAc;AACvD,cAAM,aAAa,aAAc,QAAS;AAC1C,eACC,eAAe,qBACf,gBAAiB,YAAY,UAAW;AAAA,MAE1C,CAAE;AAEF,aAAO;AAAA,QACN,aAAa,CAAC,CAAE,cAAe,QAAS;AAAA,QACxC,kBAAkB;AAAA,MACnB;AAAA,IACD;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AAEA,QAAM,YAAY,aAAc,IAAK;AACrC,QAAM,QAAQ,WAAW,SAAS;AAElC,MAAK,CAAE,aAAa,kBAAmB;AACtC,WAAO;AAAA,EACR;AAEA,QAAM,iBAAiB;AAEvB,SACC,oBAAC,qBAAkB,OAAM,QACxB;AAAA,IAAC;AAAA;AAAA,MACA,OAAQ,iBAAiB,QAAQ;AAAA,MACjC,QAAS;AAAA,MACT,UAAW;AAAA,MAET;AAAA,SAAE,eACH,oBAAC,OAAE,WAAU,2CACV,aAAI,eAAgB,GACvB;AAAA,QAED;AAAA,UAAC;AAAA;AAAA,YAEA,cAAe;AAAA,YACf,YAAU;AAAA,YACV,aAAc;AAAA,YACd,cAAY;AAAA,YACZ,UAAW;AAAA;AAAA,UALL,GAAI,QAAS,IAAK,cAAe;AAAA,QAMxC;AAAA;AAAA;AAAA,EACD,GACD;AAEF;AAKA,IAAO,oBAAQ;AAAA,EACd,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,eAAe,CAAC;AAAA,EAChB,wBAAwB;AACzB;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { PanelBody } from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { hasBlockSupport, getBlockType } from '@wordpress/blocks';\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../store';\nimport { PrivateListView } from '../components/list-view';\nimport InspectorControls from '../components/inspector-controls/fill';\nimport { PrivateBlockContext } from '../components/block-list/private-block-context';\nimport useListViewPanelState from '../components/use-list-view-panel-state';\n\nimport { unlock } from '../lock-unlock';\n\nexport const LIST_VIEW_SUPPORT_KEY = 'listView';\n\n/**\n * Check if the block has list view support.\n *\n * @param {string|Object} nameOrType Block name or block type object.\n * @return {boolean} Whether the block has list view support.\n */\nexport function hasListViewSupport( nameOrType ) {\n\treturn hasBlockSupport( nameOrType, LIST_VIEW_SUPPORT_KEY );\n}\n\n/**\n * Inspector controls panel for list view.\n *\n * @param {Object} props          Component props.\n * @param {string} props.clientId Block client ID.\n * @param {string} props.name     Block name.\n * @return {Element|null} List view inspector controls or null.\n */\nexport function ListViewPanel( { clientId, name } ) {\n\tconst { isSelectionWithinCurrentSection } =\n\t\tuseContext( PrivateBlockContext );\n\n\tconst { isOpened, expandRevision, handleToggle } =\n\t\tuseListViewPanelState( clientId );\n\n\t// eslint-disable-next-line @wordpress/no-unused-vars-before-return\n\tconst { openListViewContentPanel } = unlock(\n\t\tuseDispatch( blockEditorStore )\n\t);\n\n\tconst { isEnabled, hasChildren, isNestedListView } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockCount,\n\t\t\t\tgetBlockParents,\n\t\t\t\tshouldRenderBlockListView,\n\t\t\t} = unlock( select( blockEditorStore ) );\n\n\t\t\t// Avoid showing List Views for both parent and child blocks that have support.\n\t\t\t// In this situation the parent will show the child in its list already.\n\t\t\t// Search parents to see if there's one that also has support, and if so skip rendering.\n\t\t\t// This matches closely the logic in the `BlockCard` component.\n\t\t\tconst parents = getBlockParents( clientId, false );\n\t\t\tconst _isNestedListView = parents.find( ( parentId ) =>\n\t\t\t\tshouldRenderBlockListView( parentId )\n\t\t\t);\n\n\t\t\treturn {\n\t\t\t\tisEnabled: shouldRenderBlockListView( clientId ),\n\t\t\t\thasChildren: !! getBlockCount( clientId ),\n\t\t\t\tisNestedListView: _isNestedListView,\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\tconst blockType = getBlockType( name );\n\tconst title = blockType?.title || name;\n\n\tif ( ! isEnabled || isNestedListView ) {\n\t\treturn null;\n\t}\n\n\tconst showBlockTitle = isSelectionWithinCurrentSection;\n\n\treturn (\n\t\t<InspectorControls group=\"list\">\n\t\t\t<PanelBody\n\t\t\t\ttitle={ showBlockTitle ? title : undefined }\n\t\t\t\topened={ isOpened }\n\t\t\t\tonToggle={ handleToggle }\n\t\t\t>\n\t\t\t\t{ ! hasChildren && (\n\t\t\t\t\t<p className=\"block-editor-block-inspector__no-blocks\">\n\t\t\t\t\t\t{ __( 'No items yet.' ) }\n\t\t\t\t\t</p>\n\t\t\t\t) }\n\t\t\t\t<PrivateListView\n\t\t\t\t\tkey={ `${ clientId }-${ expandRevision }` }\n\t\t\t\t\trootClientId={ clientId }\n\t\t\t\t\tisExpanded\n\t\t\t\t\tdescription={ title }\n\t\t\t\t\tshowAppender\n\t\t\t\t\tonSelect={ openListViewContentPanel }\n\t\t\t\t/>\n\t\t\t</PanelBody>\n\t\t</InspectorControls>\n\t);\n}\n\n/**\n * Export block support definition.\n */\nexport default {\n\tedit: ListViewPanel,\n\thasSupport: hasListViewSupport,\n\tattributeKeys: [],\n\tsupportsPatternEditing: true,\n};\n"],
+  "mappings": ";AAGA,SAAS,UAAU;AACnB,SAAS,iBAAiB;AAC1B,SAAS,aAAa,iBAAiB;AACvC,SAAS,iBAAiB,oBAAoB;AAC9C,SAAS,kBAAkB;AAK3B,SAAS,SAAS,wBAAwB;AAC1C,SAAS,uBAAuB;AAChC,OAAO,uBAAuB;AAC9B,SAAS,2BAA2B;AACpC,OAAO,2BAA2B;AAElC,SAAS,cAAc;AAuEpB,SAME,KANF;AArEI,IAAM,wBAAwB;AAQ9B,SAAS,mBAAoB,YAAa;AAChD,SAAO,gBAAiB,YAAY,qBAAsB;AAC3D;AAUO,SAAS,cAAe,EAAE,UAAU,KAAK,GAAI;AACnD,QAAM,EAAE,gCAAgC,IACvC,WAAY,mBAAoB;AAEjC,QAAM,EAAE,UAAU,gBAAgB,aAAa,IAC9C,sBAAuB,QAAS;AAGjC,QAAM,EAAE,yBAAyB,IAAI;AAAA,IACpC,YAAa,gBAAiB;AAAA,EAC/B;AAEA,QAAM,EAAE,WAAW,aAAa,iBAAiB,IAAI;AAAA,IACpD,CAAE,WAAY;AACb,YAAM;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,MACD,IAAI,OAAQ,OAAQ,gBAAiB,CAAE;AAMvC,YAAM,UAAU,gBAAiB,UAAU,KAAM;AACjD,YAAM,oBAAoB,QAAQ;AAAA,QAAM,CAAE,aACzC,0BAA2B,QAAS;AAAA,MACrC;AAEA,aAAO;AAAA,QACN,WAAW,0BAA2B,QAAS;AAAA,QAC/C,aAAa,CAAC,CAAE,cAAe,QAAS;AAAA,QACxC,kBAAkB;AAAA,MACnB;AAAA,IACD;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AAEA,QAAM,YAAY,aAAc,IAAK;AACrC,QAAM,QAAQ,WAAW,SAAS;AAElC,MAAK,CAAE,aAAa,kBAAmB;AACtC,WAAO;AAAA,EACR;AAEA,QAAM,iBAAiB;AAEvB,SACC,oBAAC,qBAAkB,OAAM,QACxB;AAAA,IAAC;AAAA;AAAA,MACA,OAAQ,iBAAiB,QAAQ;AAAA,MACjC,QAAS;AAAA,MACT,UAAW;AAAA,MAET;AAAA,SAAE,eACH,oBAAC,OAAE,WAAU,2CACV,aAAI,eAAgB,GACvB;AAAA,QAED;AAAA,UAAC;AAAA;AAAA,YAEA,cAAe;AAAA,YACf,YAAU;AAAA,YACV,aAAc;AAAA,YACd,cAAY;AAAA,YACZ,UAAW;AAAA;AAAA,UALL,GAAI,QAAS,IAAK,cAAe;AAAA,QAMxC;AAAA;AAAA;AAAA,EACD,GACD;AAEF;AAKA,IAAO,oBAAQ;AAAA,EACd,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,eAAe,CAAC;AAAA,EAChB,wBAAwB;AACzB;",
   "names": []
 }

package/build-module/hooks/spacing-visualizer.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/hooks/spacing-visualizer.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useState, useRef, useEffect, useReducer } from '@wordpress/element';\nimport { isShallowEqual } from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport BlockPopoverCover from '../components/block-popover/cover';\nimport { useBlockElement } from '../components/block-list/use-block-props/use-block-refs';\n\nfunction SpacingVisualizer( { clientId, value, computeStyle, forceShow } ) {\n\tconst blockElement = useBlockElement( clientId );\n\tconst [ style, updateStyle ] = useReducer( () =>\n\t\tcomputeStyle( blockElement )\n\t);\n\n\t// Force style computation when forceShow becomes true (e.g., when hovering control)\n\t// to ensure visualizer displays correct dimensions on first render.\n\tuseEffect( () => {\n\t\tif ( blockElement && forceShow ) {\n\t\t\tupdateStyle();\n\t\t}\n\t}, [ blockElement, forceShow ] );\n\n\t// It's not sufficient to read the block's computed style when `value` changes because\n\t// the effect would run before the block\u2019s style has updated. Thus observing mutations\n\t// to the block\u2019s attributes is used to trigger updates to the visualizer\u2019s styles.\n\tuseEffect( () => {\n\t\tif ( ! blockElement ) {\n\t\t\treturn;\n\t\t}\n\t\tconst observer = new window.MutationObserver( updateStyle );\n\t\tobserver.observe( blockElement, {\n\t\t\tattributes: true,\n\t\t\tattributeFilter: [ 'style', 'class' ],\n\t\t} );\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t};\n\t}, [ blockElement ] );\n\n\tconst previousValueRef = useRef( value );\n\tconst [ isActive, setIsActive ] = useState( false );\n\n\tuseEffect( () => {\n\t\tif ( isShallowEqual( value, previousValueRef.current ) || forceShow ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetIsActive( true );\n\t\tpreviousValueRef.current = value;\n\n\t\tconst timeout = setTimeout( () => {\n\t\t\tsetIsActive( false );\n\t\t}, 400 );\n\n\t\treturn () => {\n\t\t\tsetIsActive( false );\n\t\t\tclearTimeout( timeout );\n\t\t};\n\t}, [ value, forceShow ] );\n\n\tif ( ! isActive && ! forceShow ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<BlockPopoverCover\n\t\t\tclientId={ clientId }\n\t\t\t__unstablePopoverSlot=\"block-toolbar\"\n\t\t>\n\t\t\t<div className=\"block-editor__spacing-visualizer\" style={ style } />\n\t\t</BlockPopoverCover>\n\t);\n}\n\nfunction getComputedCSS( element, property ) {\n\treturn element.ownerDocument.defaultView\n\t\t.getComputedStyle( element )\n\t\t.getPropertyValue( property );\n}\n\nexport function MarginVisualizer( { clientId, value, forceShow } ) {\n\treturn (\n\t\t<SpacingVisualizer\n\t\t\tclientId={ clientId }\n\t\t\tvalue={ value?.spacing?.margin }\n\t\t\tcomputeStyle={ ( blockElement ) => {\n\t\t\t\tconst top = getComputedCSS( blockElement, 'margin-top' );\n\t\t\t\tconst right = getComputedCSS( blockElement, 'margin-right' );\n\t\t\t\tconst bottom = getComputedCSS( blockElement, 'margin-bottom' );\n\t\t\t\tconst left = getComputedCSS( blockElement, 'margin-left' );\n\t\t\t\treturn {\n\t\t\t\t\tborderTopWidth: top,\n\t\t\t\t\tborderRightWidth: right,\n\t\t\t\t\tborderBottomWidth: bottom,\n\t\t\t\t\tborderLeftWidth: left,\n\t\t\t\t\ttop: top ? `-${ top }` : 0,\n\t\t\t\t\tright: right ? `-${ right }` : 0,\n\t\t\t\t\tbottom: bottom ? `-${ bottom }` : 0,\n\t\t\t\t\tleft: left ? `-${ left }` : 0,\n\t\t\t\t};\n\t\t\t} }\n\t\t\tforceShow={ forceShow }\n\t\t/>\n\t);\n}\n\nexport function PaddingVisualizer( { clientId, value, forceShow } ) {\n\treturn (\n\t\t<SpacingVisualizer\n\t\t\tclientId={ clientId }\n\t\t\tvalue={ value?.spacing?.padding }\n\t\t\tcomputeStyle={ ( blockElement ) => ( {\n\t\t\t\tborderTopWidth: getComputedCSS( blockElement, 'padding-top' ),\n\t\t\t\tborderRightWidth: getComputedCSS(\n\t\t\t\t\tblockElement,\n\t\t\t\t\t'padding-right'\n\t\t\t\t),\n\t\t\t\tborderBottomWidth: getComputedCSS(\n\t\t\t\t\tblockElement,\n\t\t\t\t\t'padding-bottom'\n\t\t\t\t),\n\t\t\t\tborderLeftWidth: getComputedCSS( blockElement, 'padding-left' ),\n\t\t\t} ) }\n\t\t\tforceShow={ forceShow }\n\t\t/>\n\t);\n}\n"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useState, useRef, useEffect, useReducer } from '@wordpress/element';\nimport { isShallowEqual } from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport BlockPopoverCover from '../components/block-popover/cover';\nimport { useBlockElement } from '../components/block-list/use-block-props/use-block-refs';\n\nfunction SpacingVisualizer( { clientId, value, computeStyle, forceShow } ) {\n\tconst blockElement = useBlockElement( clientId );\n\tconst [ style, updateStyle ] = useReducer( () =>\n\t\tcomputeStyle( blockElement )\n\t);\n\n\t// Force style computation when forceShow becomes true (e.g., when hovering control)\n\t// to ensure visualizer displays correct dimensions on first render.\n\tuseEffect( () => {\n\t\tif ( blockElement && forceShow ) {\n\t\t\tupdateStyle();\n\t\t}\n\t}, [ blockElement, forceShow ] );\n\n\t// It's not sufficient to read the block's computed style when `value` changes because\n\t// the effect would run before the block’s style has updated. Thus observing mutations\n\t// to the block’s attributes is used to trigger updates to the visualizer’s styles.\n\tuseEffect( () => {\n\t\tif ( ! blockElement ) {\n\t\t\treturn;\n\t\t}\n\t\tconst observer = new window.MutationObserver( updateStyle );\n\t\tobserver.observe( blockElement, {\n\t\t\tattributes: true,\n\t\t\tattributeFilter: [ 'style', 'class' ],\n\t\t} );\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t};\n\t}, [ blockElement ] );\n\n\tconst previousValueRef = useRef( value );\n\tconst [ isActive, setIsActive ] = useState( false );\n\n\tuseEffect( () => {\n\t\tif ( isShallowEqual( value, previousValueRef.current ) || forceShow ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetIsActive( true );\n\t\tpreviousValueRef.current = value;\n\n\t\tconst timeout = setTimeout( () => {\n\t\t\tsetIsActive( false );\n\t\t}, 400 );\n\n\t\treturn () => {\n\t\t\tsetIsActive( false );\n\t\t\tclearTimeout( timeout );\n\t\t};\n\t}, [ value, forceShow ] );\n\n\tif ( ! isActive && ! forceShow ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<BlockPopoverCover\n\t\t\tclientId={ clientId }\n\t\t\t__unstablePopoverSlot=\"block-toolbar\"\n\t\t>\n\t\t\t<div className=\"block-editor__spacing-visualizer\" style={ style } />\n\t\t</BlockPopoverCover>\n\t);\n}\n\nfunction getComputedCSS( element, property ) {\n\treturn element.ownerDocument.defaultView\n\t\t.getComputedStyle( element )\n\t\t.getPropertyValue( property );\n}\n\nexport function MarginVisualizer( { clientId, value, forceShow } ) {\n\treturn (\n\t\t<SpacingVisualizer\n\t\t\tclientId={ clientId }\n\t\t\tvalue={ value?.spacing?.margin }\n\t\t\tcomputeStyle={ ( blockElement ) => {\n\t\t\t\tconst top = getComputedCSS( blockElement, 'margin-top' );\n\t\t\t\tconst right = getComputedCSS( blockElement, 'margin-right' );\n\t\t\t\tconst bottom = getComputedCSS( blockElement, 'margin-bottom' );\n\t\t\t\tconst left = getComputedCSS( blockElement, 'margin-left' );\n\t\t\t\treturn {\n\t\t\t\t\tborderTopWidth: top,\n\t\t\t\t\tborderRightWidth: right,\n\t\t\t\t\tborderBottomWidth: bottom,\n\t\t\t\t\tborderLeftWidth: left,\n\t\t\t\t\ttop: top ? `-${ top }` : 0,\n\t\t\t\t\tright: right ? `-${ right }` : 0,\n\t\t\t\t\tbottom: bottom ? `-${ bottom }` : 0,\n\t\t\t\t\tleft: left ? `-${ left }` : 0,\n\t\t\t\t};\n\t\t\t} }\n\t\t\tforceShow={ forceShow }\n\t\t/>\n\t);\n}\n\nexport function PaddingVisualizer( { clientId, value, forceShow } ) {\n\treturn (\n\t\t<SpacingVisualizer\n\t\t\tclientId={ clientId }\n\t\t\tvalue={ value?.spacing?.padding }\n\t\t\tcomputeStyle={ ( blockElement ) => ( {\n\t\t\t\tborderTopWidth: getComputedCSS( blockElement, 'padding-top' ),\n\t\t\t\tborderRightWidth: getComputedCSS(\n\t\t\t\t\tblockElement,\n\t\t\t\t\t'padding-right'\n\t\t\t\t),\n\t\t\t\tborderBottomWidth: getComputedCSS(\n\t\t\t\t\tblockElement,\n\t\t\t\t\t'padding-bottom'\n\t\t\t\t),\n\t\t\t\tborderLeftWidth: getComputedCSS( blockElement, 'padding-left' ),\n\t\t\t} ) }\n\t\t\tforceShow={ forceShow }\n\t\t/>\n\t);\n}\n"],
   "mappings": "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",
   "names": []
 }

package/build-module/hooks/state-utils.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/hooks/state-utils.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\nimport { splitSelectorList } from '@wordpress/global-styles-engine';\n\n/**\n * Given a block's `selectors.root` value, returns the part of the selector\n * that is relative to the block wrapper \u2014 i.e., everything after the first\n * compound selector segment.\n *\n * Examples:\n *   \".wp-block-button .wp-block-button__link\" \u2192 \".wp-block-button__link\"\n *   \".wp-block-foo > .inner\"                 \u2192 \"> .inner\"\n *   \".wp-block-foo\"                          \u2192 null (no descendant)\n *\n * @param {string} rootSelector The block's `selectors.root` value.\n * @return {string|null} Relative selector, or null if rootSelector targets the wrapper itself.\n */\nexport function getRelativeRootSelector( rootSelector ) {\n\t// Match everything after the first compound selector (up to the first\n\t// whitespace or combinator character).\n\t// Require at least one combinator character (space, >, +, ~) between the\n\t// first compound selector and the rest. Without this anchor, a greedy\n\t// quantifier would backtrack into the first token and produce false matches.\n\tconst match = rootSelector.trim().match( /^[^ >+~]+[ >+~](.*)$/ );\n\tif ( ! match ) {\n\t\treturn null;\n\t}\n\tconst rest = match[ 1 ].trim();\n\treturn rest || null;\n}\n\n/**\n * Builds a scoped selector from a block selector and optional suffix.\n *\n * If the block selector targets a descendant, the descendant portion is scoped\n * under the provided base selector. Otherwise the base selector itself is used.\n *\n * @param {string} baseSelector  The block-instance scoping selector.\n * @param {string} blockSelector The block or feature selector from block metadata.\n * @param {string} suffix        Optional selector suffix, e.g. \":hover\".\n * @return {string} The scoped CSS selector.\n */\nexport function buildScopedBlockSelector(\n\tbaseSelector,\n\tblockSelector,\n\tsuffix = ''\n) {\n\tif ( typeof blockSelector !== 'string' || ! blockSelector ) {\n\t\treturn splitSelectorList( baseSelector )\n\t\t\t.map( ( selector ) => `${ selector.trim() }${ suffix }` )\n\t\t\t.join( ', ' );\n\t}\n\n\tconst baseSelectors = splitSelectorList( baseSelector ).filter(\n\t\t( selector ) => selector.trim()\n\t);\n\tconst selectors = splitSelectorList( blockSelector ).filter( ( selector ) =>\n\t\tselector.trim()\n\t);\n\n\tif ( ! selectors.length ) {\n\t\treturn baseSelectors\n\t\t\t.map( ( selector ) => `${ selector.trim() }${ suffix }` )\n\t\t\t.join( ', ' );\n\t}\n\n\treturn selectors\n\t\t.map( ( selector ) => {\n\t\t\tselector = selector.trim();\n\n\t\t\t/*\n\t\t\t * Replace only the leading block selector part (e.g. class name,\n\t\t\t * attribute selector, ID, or tag name) with the block instance selector.\n\t\t\t * Preserve anything after that prefix, including modifier classes on the\n\t\t\t * same element and combinators without spaces.\n\t\t\t */\n\t\t\tconst match = selector.match( /^([.#]?[-_a-zA-Z0-9]+|\\[[^\\]]+\\])/ );\n\t\t\tif ( match ) {\n\t\t\t\treturn baseSelectors\n\t\t\t\t\t.map(\n\t\t\t\t\t\t( base ) =>\n\t\t\t\t\t\t\t`${ base.trim() }${ selector.slice(\n\t\t\t\t\t\t\t\tmatch[ 0 ].length\n\t\t\t\t\t\t\t) }${ suffix }`\n\t\t\t\t\t)\n\t\t\t\t\t.join( ', ' );\n\t\t\t}\n\n\t\t\treturn baseSelectors\n\t\t\t\t.map( ( base ) => `${ base.trim() }${ suffix }` )\n\t\t\t\t.join( ', ' );\n\t\t} )\n\t\t.join( ', ' );\n}\n\n/**\n * Builds the scoped selector for root block style state styles.\n *\n * Uses the block's `selectors.root` to determine which element should receive\n * root-level state styles. If `selectors.root` describes a descendant element\n * (e.g. `.wp-block-button .wp-block-button__link`), the relative portion is\n * scoped under `baseSelector`. If no descendant is present, falls back to the\n * base selector.\n *\n * @param {string} baseSelector The block-instance scoping class selector.\n * @param {string} name         The block name, used to look up selectors.\n * @return {string} The fully-scoped CSS selector for root state styles.\n */\nexport function buildRootStyleStateSelector( baseSelector, name ) {\n\tconst rootSelector = getBlockType( name )?.selectors?.root;\n\treturn buildScopedBlockSelector( baseSelector, rootSelector );\n}\n\n/**\n * Builds the scoped CSS selector for a block state (e.g. :hover, :focus).\n *\n * Uses the block's `selectors.root` to determine which element the state\n * pseudo-class should apply to. If `selectors.root` describes a descendant\n * element (e.g. \".wp-block-button .wp-block-button__link\"), the relative\n * portion (\".wp-block-button__link\") is scoped under `baseSelector`. If no\n * descendant is present, falls back to appending the state to `baseSelector`.\n *\n * @param {string} baseSelector The block-instance scoping class selector.\n * @param {string} name         The block name, used to look up selectors.\n * @param {string} state        The pseudo-class string, e.g. \":hover\".\n * @return {string} The fully-scoped CSS selector for this state.\n */\nexport function buildPseudoStyleStateSelector( baseSelector, name, state ) {\n\treturn `${ buildRootStyleStateSelector( baseSelector, name ) }${ state }`;\n}\n\nexport function buildStateSelector( baseSelector, name, state ) {\n\tconst rootSelector = getBlockType( name )?.selectors?.root;\n\treturn buildScopedBlockSelector( baseSelector, rootSelector, state );\n}\n\n/**\n * Builds the CSS selector used to preview a state on the editor canvas,\n * scoped to a specific block instance via its `data-block` attribute.\n *\n * For blocks whose `selectors.root` targets a descendant element\n * (e.g. \".wp-block-button .wp-block-button__link\"), the selector targets\n * that descendant inside the block wrapper. Otherwise it targets the wrapper\n * itself.\n *\n * @param {string} clientId The block's clientId.\n * @param {string} name     The block name, used to look up selectors.\n * @return {string} CSS selector scoped to this block instance.\n */\nexport function buildCanvasStateSelector( clientId, name ) {\n\tconst rootSelector = getBlockType( name )?.selectors?.root;\n\treturn buildScopedBlockSelector(\n\t\t`[data-block=\"${ clientId }\"]`,\n\t\trootSelector\n\t);\n}\n"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\nimport { splitSelectorList } from '@wordpress/global-styles-engine';\n\n/**\n * Given a block's `selectors.root` value, returns the part of the selector\n * that is relative to the block wrapper — i.e., everything after the first\n * compound selector segment.\n *\n * Examples:\n *   \".wp-block-button .wp-block-button__link\" → \".wp-block-button__link\"\n *   \".wp-block-foo > .inner\"                 → \"> .inner\"\n *   \".wp-block-foo\"                          → null (no descendant)\n *\n * @param {string} rootSelector The block's `selectors.root` value.\n * @return {string|null} Relative selector, or null if rootSelector targets the wrapper itself.\n */\nexport function getRelativeRootSelector( rootSelector ) {\n\t// Match everything after the first compound selector (up to the first\n\t// whitespace or combinator character).\n\t// Require at least one combinator character (space, >, +, ~) between the\n\t// first compound selector and the rest. Without this anchor, a greedy\n\t// quantifier would backtrack into the first token and produce false matches.\n\tconst match = rootSelector.trim().match( /^[^ >+~]+[ >+~](.*)$/ );\n\tif ( ! match ) {\n\t\treturn null;\n\t}\n\tconst rest = match[ 1 ].trim();\n\treturn rest || null;\n}\n\n/**\n * Builds a scoped selector from a block selector and optional suffix.\n *\n * If the block selector targets a descendant, the descendant portion is scoped\n * under the provided base selector. Otherwise the base selector itself is used.\n *\n * @param {string} baseSelector  The block-instance scoping selector.\n * @param {string} blockSelector The block or feature selector from block metadata.\n * @param {string} suffix        Optional selector suffix, e.g. \":hover\".\n * @return {string} The scoped CSS selector.\n */\nexport function buildScopedBlockSelector(\n\tbaseSelector,\n\tblockSelector,\n\tsuffix = ''\n) {\n\tif ( typeof blockSelector !== 'string' || ! blockSelector ) {\n\t\treturn splitSelectorList( baseSelector )\n\t\t\t.map( ( selector ) => `${ selector.trim() }${ suffix }` )\n\t\t\t.join( ', ' );\n\t}\n\n\tconst baseSelectors = splitSelectorList( baseSelector ).filter(\n\t\t( selector ) => selector.trim()\n\t);\n\tconst selectors = splitSelectorList( blockSelector ).filter( ( selector ) =>\n\t\tselector.trim()\n\t);\n\n\tif ( ! selectors.length ) {\n\t\treturn baseSelectors\n\t\t\t.map( ( selector ) => `${ selector.trim() }${ suffix }` )\n\t\t\t.join( ', ' );\n\t}\n\n\treturn selectors\n\t\t.map( ( selector ) => {\n\t\t\tselector = selector.trim();\n\n\t\t\t/*\n\t\t\t * Replace only the leading block selector part (e.g. class name,\n\t\t\t * attribute selector, ID, or tag name) with the block instance selector.\n\t\t\t * Preserve anything after that prefix, including modifier classes on the\n\t\t\t * same element and combinators without spaces.\n\t\t\t */\n\t\t\tconst match = selector.match( /^([.#]?[-_a-zA-Z0-9]+|\\[[^\\]]+\\])/ );\n\t\t\tif ( match ) {\n\t\t\t\treturn baseSelectors\n\t\t\t\t\t.map(\n\t\t\t\t\t\t( base ) =>\n\t\t\t\t\t\t\t`${ base.trim() }${ selector.slice(\n\t\t\t\t\t\t\t\tmatch[ 0 ].length\n\t\t\t\t\t\t\t) }${ suffix }`\n\t\t\t\t\t)\n\t\t\t\t\t.join( ', ' );\n\t\t\t}\n\n\t\t\treturn baseSelectors\n\t\t\t\t.map( ( base ) => `${ base.trim() }${ suffix }` )\n\t\t\t\t.join( ', ' );\n\t\t} )\n\t\t.join( ', ' );\n}\n\n/**\n * Builds the scoped selector for root block style state styles.\n *\n * Uses the block's `selectors.root` to determine which element should receive\n * root-level state styles. If `selectors.root` describes a descendant element\n * (e.g. `.wp-block-button .wp-block-button__link`), the relative portion is\n * scoped under `baseSelector`. If no descendant is present, falls back to the\n * base selector.\n *\n * @param {string} baseSelector The block-instance scoping class selector.\n * @param {string} name         The block name, used to look up selectors.\n * @return {string} The fully-scoped CSS selector for root state styles.\n */\nexport function buildRootStyleStateSelector( baseSelector, name ) {\n\tconst rootSelector = getBlockType( name )?.selectors?.root;\n\treturn buildScopedBlockSelector( baseSelector, rootSelector );\n}\n\n/**\n * Builds the scoped CSS selector for a block state (e.g. :hover, :focus).\n *\n * Uses the block's `selectors.root` to determine which element the state\n * pseudo-class should apply to. If `selectors.root` describes a descendant\n * element (e.g. \".wp-block-button .wp-block-button__link\"), the relative\n * portion (\".wp-block-button__link\") is scoped under `baseSelector`. If no\n * descendant is present, falls back to appending the state to `baseSelector`.\n *\n * @param {string} baseSelector The block-instance scoping class selector.\n * @param {string} name         The block name, used to look up selectors.\n * @param {string} state        The pseudo-class string, e.g. \":hover\".\n * @return {string} The fully-scoped CSS selector for this state.\n */\nexport function buildPseudoStyleStateSelector( baseSelector, name, state ) {\n\treturn `${ buildRootStyleStateSelector( baseSelector, name ) }${ state }`;\n}\n\nexport function buildStateSelector( baseSelector, name, state ) {\n\tconst rootSelector = getBlockType( name )?.selectors?.root;\n\treturn buildScopedBlockSelector( baseSelector, rootSelector, state );\n}\n\n/**\n * Builds the CSS selector used to preview a state on the editor canvas,\n * scoped to a specific block instance via its `data-block` attribute.\n *\n * For blocks whose `selectors.root` targets a descendant element\n * (e.g. \".wp-block-button .wp-block-button__link\"), the selector targets\n * that descendant inside the block wrapper. Otherwise it targets the wrapper\n * itself.\n *\n * @param {string} clientId The block's clientId.\n * @param {string} name     The block name, used to look up selectors.\n * @return {string} CSS selector scoped to this block instance.\n */\nexport function buildCanvasStateSelector( clientId, name ) {\n\tconst rootSelector = getBlockType( name )?.selectors?.root;\n\treturn buildScopedBlockSelector(\n\t\t`[data-block=\"${ clientId }\"]`,\n\t\trootSelector\n\t);\n}\n"],
   "mappings": ";AAGA,SAAS,oBAAoB;AAC7B,SAAS,yBAAyB;AAe3B,SAAS,wBAAyB,cAAe;AAMvD,QAAM,QAAQ,aAAa,KAAK,EAAE,MAAO,sBAAuB;AAChE,MAAK,CAAE,OAAQ;AACd,WAAO;AAAA,EACR;AACA,QAAM,OAAO,MAAO,CAAE,EAAE,KAAK;AAC7B,SAAO,QAAQ;AAChB;AAaO,SAAS,yBACf,cACA,eACA,SAAS,IACR;AACD,MAAK,OAAO,kBAAkB,YAAY,CAAE,eAAgB;AAC3D,WAAO,kBAAmB,YAAa,EACrC,IAAK,CAAE,aAAc,GAAI,SAAS,KAAK,CAAE,GAAI,MAAO,EAAG,EACvD,KAAM,IAAK;AAAA,EACd;AAEA,QAAM,gBAAgB,kBAAmB,YAAa,EAAE;AAAA,IACvD,CAAE,aAAc,SAAS,KAAK;AAAA,EAC/B;AACA,QAAM,YAAY,kBAAmB,aAAc,EAAE;AAAA,IAAQ,CAAE,aAC9D,SAAS,KAAK;AAAA,EACf;AAEA,MAAK,CAAE,UAAU,QAAS;AACzB,WAAO,cACL,IAAK,CAAE,aAAc,GAAI,SAAS,KAAK,CAAE,GAAI,MAAO,EAAG,EACvD,KAAM,IAAK;AAAA,EACd;AAEA,SAAO,UACL,IAAK,CAAE,aAAc;AACrB,eAAW,SAAS,KAAK;AAQzB,UAAM,QAAQ,SAAS,MAAO,mCAAoC;AAClE,QAAK,OAAQ;AACZ,aAAO,cACL;AAAA,QACA,CAAE,SACD,GAAI,KAAK,KAAK,CAAE,GAAI,SAAS;AAAA,UAC5B,MAAO,CAAE,EAAE;AAAA,QACZ,CAAE,GAAI,MAAO;AAAA,MACf,EACC,KAAM,IAAK;AAAA,IACd;AAEA,WAAO,cACL,IAAK,CAAE,SAAU,GAAI,KAAK,KAAK,CAAE,GAAI,MAAO,EAAG,EAC/C,KAAM,IAAK;AAAA,EACd,CAAE,EACD,KAAM,IAAK;AACd;AAeO,SAAS,4BAA6B,cAAc,MAAO;AACjE,QAAM,eAAe,aAAc,IAAK,GAAG,WAAW;AACtD,SAAO,yBAA0B,cAAc,YAAa;AAC7D;AAgBO,SAAS,8BAA+B,cAAc,MAAM,OAAQ;AAC1E,SAAO,GAAI,4BAA6B,cAAc,IAAK,CAAE,GAAI,KAAM;AACxE;AAEO,SAAS,mBAAoB,cAAc,MAAM,OAAQ;AAC/D,QAAM,eAAe,aAAc,IAAK,GAAG,WAAW;AACtD,SAAO,yBAA0B,cAAc,cAAc,KAAM;AACpE;AAeO,SAAS,yBAA0B,UAAU,MAAO;AAC1D,QAAM,eAAe,aAAc,IAAK,GAAG,WAAW;AACtD,SAAO;AAAA,IACN,gBAAiB,QAAS;AAAA,IAC1B;AAAA,EACD;AACD;",
   "names": []
 }

package/build-module/hooks/states.mjs CHANGED Viewed

@@ -12,8 +12,8 @@ var PSEUDO_STATE_LABELS = {
   ":active": __("Active")
 };
 var RESPONSIVE_STATE_LABELS = {
-  tablet: __("Tablet"),
-  mobile: __("Mobile")
+  "@tablet": __("Tablet"),
+  "@mobile": __("Mobile")
 };
 var VALID_BLOCK_PSEUDO_STATES = {
   "core/button": [":hover", ":focus", ":focus-visible", ":active"],

package/build-module/hooks/states.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/hooks/states.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport StateControl from '../components/global-styles/state-control';\nimport StateControlBadges from '../components/global-styles/state-control-badges';\nimport { useToolsPanelDropdownMenuProps } from '../components/global-styles/utils';\n\nexport const PSEUDO_STATE_LABELS = {\n\t':hover': __( 'Hover' ),\n\t':focus': __( 'Focus' ),\n\t':focus-visible': __( 'Focus-visible' ),\n\t':active': __( 'Active' ),\n};\n\nexport const RESPONSIVE_STATE_LABELS = {\n\ttablet: __( 'Tablet' ),\n\tmobile: __( 'Mobile' ),\n};\n\n// Keep in sync with WP_Theme_JSON_Gutenberg::VALID_BLOCK_PSEUDO_SELECTORS\n// and packages/global-styles-engine/src/core/render.tsx.\nexport const VALID_BLOCK_PSEUDO_STATES = {\n\t'core/button': [ ':hover', ':focus', ':focus-visible', ':active' ],\n\t'core/navigation-link': [ ':hover', ':focus', ':focus-visible', ':active' ],\n};\n\nfunction getPseudoStateOptions( name ) {\n\tconst validStates = VALID_BLOCK_PSEUDO_STATES[ name ] ?? [];\n\n\treturn validStates\n\t\t.filter( ( state ) => PSEUDO_STATE_LABELS[ state ] )\n\t\t.map( ( state ) => ( {\n\t\t\tvalue: state,\n\t\t\tlabel: PSEUDO_STATE_LABELS[ state ],\n\t\t} ) );\n}\n\nconst DEFAULT_STATE_VALUE = 'default';\n\nfunction getViewportStateOptions( name ) {\n\tif ( ! getBlockType( name )?.attributes?.style ) {\n\t\treturn [];\n\t}\n\n\treturn Object.entries( RESPONSIVE_STATE_LABELS ).map(\n\t\t( [ value, label ] ) => ( {\n\t\t\tvalue,\n\t\t\tlabel,\n\t\t} )\n\t);\n}\n\n/**\n * Renders a style-state selector in the block card header.\n * Viewport states are shown for blocks with a style attribute, while\n * pseudo-states are shown for blocks with configured pseudo-state support.\n *\n * @param {Object}   props          Component props.\n * @param {string}   props.name     Block name.\n * @param {Object}   props.value    Currently selected style-state value.\n * @param {Function} props.onChange Callback when style-state selection changes.\n * @return {Element|null} State control component, or null if not applicable.\n */\nexport function BlockStatesControl( { name, value, onChange } ) {\n\tconst viewportStateOptions = getViewportStateOptions( name );\n\tconst pseudoStateOptions = getPseudoStateOptions( name );\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\n\tif ( ! viewportStateOptions.length && ! pseudoStateOptions.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<StateControl\n\t\t\tviewportStates={ viewportStateOptions }\n\t\t\tpseudoStates={ pseudoStateOptions }\n\t\t\tviewportValue={ value?.viewport ?? DEFAULT_STATE_VALUE }\n\t\t\tpseudoStateValue={ value?.pseudo ?? DEFAULT_STATE_VALUE }\n\t\t\tonChangeViewport={ ( viewport ) => onChange( { viewport } ) }\n\t\t\tonChangePseudoState={ ( pseudo ) => onChange( { pseudo } ) }\n\t\t\tpopoverProps={ dropdownMenuProps.popoverProps }\n\t\t\tshowText={ false }\n\t\t/>\n\t);\n}\n\nexport function BlockStateBadges( { name, value } ) {\n\tconst viewportStateOptions = getViewportStateOptions( name );\n\tconst pseudoStateOptions = getPseudoStateOptions( name );\n\n\tif ( ! viewportStateOptions.length && ! pseudoStateOptions.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<StateControlBadges\n\t\t\tviewportStates={ viewportStateOptions }\n\t\t\tpseudoStates={ pseudoStateOptions }\n\t\t\tviewportValue={ value?.viewport ?? DEFAULT_STATE_VALUE }\n\t\t\tpseudoStateValue={ value?.pseudo ?? DEFAULT_STATE_VALUE }\n\t\t/>\n\t);\n}\n"],
-  "mappings": ";AAGA,SAAS,oBAAoB;AAC7B,SAAS,UAAU;AAKnB,OAAO,kBAAkB;AACzB,OAAO,wBAAwB;AAC/B,SAAS,sCAAsC;AAoE7C;AAlEK,IAAM,sBAAsB;AAAA,EAClC,UAAU,GAAI,OAAQ;AAAA,EACtB,UAAU,GAAI,OAAQ;AAAA,EACtB,kBAAkB,GAAI,eAAgB;AAAA,EACtC,WAAW,GAAI,QAAS;AACzB;AAEO,IAAM,0BAA0B;AAAA,EACtC,QAAQ,GAAI,QAAS;AAAA,EACrB,QAAQ,GAAI,QAAS;AACtB;AAIO,IAAM,4BAA4B;AAAA,EACxC,eAAe,CAAE,UAAU,UAAU,kBAAkB,SAAU;AAAA,EACjE,wBAAwB,CAAE,UAAU,UAAU,kBAAkB,SAAU;AAC3E;AAEA,SAAS,sBAAuB,MAAO;AACtC,QAAM,cAAc,0BAA2B,IAAK,KAAK,CAAC;AAE1D,SAAO,YACL,OAAQ,CAAE,UAAW,oBAAqB,KAAM,CAAE,EAClD,IAAK,CAAE,WAAa;AAAA,IACpB,OAAO;AAAA,IACP,OAAO,oBAAqB,KAAM;AAAA,EACnC,EAAI;AACN;AAEA,IAAM,sBAAsB;AAE5B,SAAS,wBAAyB,MAAO;AACxC,MAAK,CAAE,aAAc,IAAK,GAAG,YAAY,OAAQ;AAChD,WAAO,CAAC;AAAA,EACT;AAEA,SAAO,OAAO,QAAS,uBAAwB,EAAE;AAAA,IAChD,CAAE,CAAE,OAAO,KAAM,OAAS;AAAA,MACzB;AAAA,MACA;AAAA,IACD;AAAA,EACD;AACD;AAaO,SAAS,mBAAoB,EAAE,MAAM,OAAO,SAAS,GAAI;AAC/D,QAAM,uBAAuB,wBAAyB,IAAK;AAC3D,QAAM,qBAAqB,sBAAuB,IAAK;AACvD,QAAM,oBAAoB,+BAA+B;AAEzD,MAAK,CAAE,qBAAqB,UAAU,CAAE,mBAAmB,QAAS;AACnE,WAAO;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,gBAAiB;AAAA,MACjB,cAAe;AAAA,MACf,eAAgB,OAAO,YAAY;AAAA,MACnC,kBAAmB,OAAO,UAAU;AAAA,MACpC,kBAAmB,CAAE,aAAc,SAAU,EAAE,SAAS,CAAE;AAAA,MAC1D,qBAAsB,CAAE,WAAY,SAAU,EAAE,OAAO,CAAE;AAAA,MACzD,cAAe,kBAAkB;AAAA,MACjC,UAAW;AAAA;AAAA,EACZ;AAEF;AAEO,SAAS,iBAAkB,EAAE,MAAM,MAAM,GAAI;AACnD,QAAM,uBAAuB,wBAAyB,IAAK;AAC3D,QAAM,qBAAqB,sBAAuB,IAAK;AAEvD,MAAK,CAAE,qBAAqB,UAAU,CAAE,mBAAmB,QAAS;AACnE,WAAO;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,gBAAiB;AAAA,MACjB,cAAe;AAAA,MACf,eAAgB,OAAO,YAAY;AAAA,MACnC,kBAAmB,OAAO,UAAU;AAAA;AAAA,EACrC;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport StateControl from '../components/global-styles/state-control';\nimport StateControlBadges from '../components/global-styles/state-control-badges';\nimport { useToolsPanelDropdownMenuProps } from '../components/global-styles/utils';\n\nexport const PSEUDO_STATE_LABELS = {\n\t':hover': __( 'Hover' ),\n\t':focus': __( 'Focus' ),\n\t':focus-visible': __( 'Focus-visible' ),\n\t':active': __( 'Active' ),\n};\n\nexport const RESPONSIVE_STATE_LABELS = {\n\t'@tablet': __( 'Tablet' ),\n\t'@mobile': __( 'Mobile' ),\n};\n\n// Keep in sync with WP_Theme_JSON_Gutenberg::VALID_BLOCK_PSEUDO_SELECTORS\n// and packages/global-styles-engine/src/core/render.tsx.\nexport const VALID_BLOCK_PSEUDO_STATES = {\n\t'core/button': [ ':hover', ':focus', ':focus-visible', ':active' ],\n\t'core/navigation-link': [ ':hover', ':focus', ':focus-visible', ':active' ],\n};\n\nfunction getPseudoStateOptions( name ) {\n\tconst validStates = VALID_BLOCK_PSEUDO_STATES[ name ] ?? [];\n\n\treturn validStates\n\t\t.filter( ( state ) => PSEUDO_STATE_LABELS[ state ] )\n\t\t.map( ( state ) => ( {\n\t\t\tvalue: state,\n\t\t\tlabel: PSEUDO_STATE_LABELS[ state ],\n\t\t} ) );\n}\n\nconst DEFAULT_STATE_VALUE = 'default';\n\nfunction getViewportStateOptions( name ) {\n\tif ( ! getBlockType( name )?.attributes?.style ) {\n\t\treturn [];\n\t}\n\n\treturn Object.entries( RESPONSIVE_STATE_LABELS ).map(\n\t\t( [ value, label ] ) => ( {\n\t\t\tvalue,\n\t\t\tlabel,\n\t\t} )\n\t);\n}\n\n/**\n * Renders a style-state selector in the block card header.\n * Viewport states are shown for blocks with a style attribute, while\n * pseudo-states are shown for blocks with configured pseudo-state support.\n *\n * @param {Object}   props          Component props.\n * @param {string}   props.name     Block name.\n * @param {Object}   props.value    Currently selected style-state value.\n * @param {Function} props.onChange Callback when style-state selection changes.\n * @return {Element|null} State control component, or null if not applicable.\n */\nexport function BlockStatesControl( { name, value, onChange } ) {\n\tconst viewportStateOptions = getViewportStateOptions( name );\n\tconst pseudoStateOptions = getPseudoStateOptions( name );\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\n\tif ( ! viewportStateOptions.length && ! pseudoStateOptions.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<StateControl\n\t\t\tviewportStates={ viewportStateOptions }\n\t\t\tpseudoStates={ pseudoStateOptions }\n\t\t\tviewportValue={ value?.viewport ?? DEFAULT_STATE_VALUE }\n\t\t\tpseudoStateValue={ value?.pseudo ?? DEFAULT_STATE_VALUE }\n\t\t\tonChangeViewport={ ( viewport ) => onChange( { viewport } ) }\n\t\t\tonChangePseudoState={ ( pseudo ) => onChange( { pseudo } ) }\n\t\t\tpopoverProps={ dropdownMenuProps.popoverProps }\n\t\t\tshowText={ false }\n\t\t/>\n\t);\n}\n\nexport function BlockStateBadges( { name, value } ) {\n\tconst viewportStateOptions = getViewportStateOptions( name );\n\tconst pseudoStateOptions = getPseudoStateOptions( name );\n\n\tif ( ! viewportStateOptions.length && ! pseudoStateOptions.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<StateControlBadges\n\t\t\tviewportStates={ viewportStateOptions }\n\t\t\tpseudoStates={ pseudoStateOptions }\n\t\t\tviewportValue={ value?.viewport ?? DEFAULT_STATE_VALUE }\n\t\t\tpseudoStateValue={ value?.pseudo ?? DEFAULT_STATE_VALUE }\n\t\t/>\n\t);\n}\n"],
+  "mappings": ";AAGA,SAAS,oBAAoB;AAC7B,SAAS,UAAU;AAKnB,OAAO,kBAAkB;AACzB,OAAO,wBAAwB;AAC/B,SAAS,sCAAsC;AAoE7C;AAlEK,IAAM,sBAAsB;AAAA,EAClC,UAAU,GAAI,OAAQ;AAAA,EACtB,UAAU,GAAI,OAAQ;AAAA,EACtB,kBAAkB,GAAI,eAAgB;AAAA,EACtC,WAAW,GAAI,QAAS;AACzB;AAEO,IAAM,0BAA0B;AAAA,EACtC,WAAW,GAAI,QAAS;AAAA,EACxB,WAAW,GAAI,QAAS;AACzB;AAIO,IAAM,4BAA4B;AAAA,EACxC,eAAe,CAAE,UAAU,UAAU,kBAAkB,SAAU;AAAA,EACjE,wBAAwB,CAAE,UAAU,UAAU,kBAAkB,SAAU;AAC3E;AAEA,SAAS,sBAAuB,MAAO;AACtC,QAAM,cAAc,0BAA2B,IAAK,KAAK,CAAC;AAE1D,SAAO,YACL,OAAQ,CAAE,UAAW,oBAAqB,KAAM,CAAE,EAClD,IAAK,CAAE,WAAa;AAAA,IACpB,OAAO;AAAA,IACP,OAAO,oBAAqB,KAAM;AAAA,EACnC,EAAI;AACN;AAEA,IAAM,sBAAsB;AAE5B,SAAS,wBAAyB,MAAO;AACxC,MAAK,CAAE,aAAc,IAAK,GAAG,YAAY,OAAQ;AAChD,WAAO,CAAC;AAAA,EACT;AAEA,SAAO,OAAO,QAAS,uBAAwB,EAAE;AAAA,IAChD,CAAE,CAAE,OAAO,KAAM,OAAS;AAAA,MACzB;AAAA,MACA;AAAA,IACD;AAAA,EACD;AACD;AAaO,SAAS,mBAAoB,EAAE,MAAM,OAAO,SAAS,GAAI;AAC/D,QAAM,uBAAuB,wBAAyB,IAAK;AAC3D,QAAM,qBAAqB,sBAAuB,IAAK;AACvD,QAAM,oBAAoB,+BAA+B;AAEzD,MAAK,CAAE,qBAAqB,UAAU,CAAE,mBAAmB,QAAS;AACnE,WAAO;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,gBAAiB;AAAA,MACjB,cAAe;AAAA,MACf,eAAgB,OAAO,YAAY;AAAA,MACnC,kBAAmB,OAAO,UAAU;AAAA,MACpC,kBAAmB,CAAE,aAAc,SAAU,EAAE,SAAS,CAAE;AAAA,MAC1D,qBAAsB,CAAE,WAAY,SAAU,EAAE,OAAO,CAAE;AAAA,MACzD,cAAe,kBAAkB;AAAA,MACjC,UAAW;AAAA;AAAA,EACZ;AAEF;AAEO,SAAS,iBAAkB,EAAE,MAAM,MAAM,GAAI;AACnD,QAAM,uBAAuB,wBAAyB,IAAK;AAC3D,QAAM,qBAAqB,sBAAuB,IAAK;AAEvD,MAAK,CAAE,qBAAqB,UAAU,CAAE,mBAAmB,QAAS;AACnE,WAAO;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,gBAAiB;AAAA,MACjB,cAAe;AAAA,MACf,eAAgB,OAAO,YAAY;AAAA,MACnC,kBAAmB,OAAO,UAAU;AAAA;AAAA,EACrC;AAEF;",
   "names": []
 }

package/build-module/hooks/style.mjs CHANGED Viewed

@@ -13,7 +13,8 @@ import { useInstanceId } from "@wordpress/compose";
 import { getCSSRules, compileCSS } from "@wordpress/style-engine";
 import { BACKGROUND_SUPPORT_KEY, BackgroundImagePanel } from "./background.mjs";
 import { BORDER_SUPPORT_KEY, BorderPanel, SHADOW_SUPPORT_KEY } from "./border.mjs";
-import { COLOR_SUPPORT_KEY, ColorEdit } from "./color.mjs";
+import { COLOR_SUPPORT_KEY } from "./color.mjs";
+import { ElementsEdit } from "./elements.mjs";
 import {
   TypographyPanel,
   TYPOGRAPHY_SUPPORT_KEY,
@@ -22,7 +23,8 @@ import {
 import {
   DIMENSIONS_SUPPORT_KEY,
   SPACING_SUPPORT_KEY,
-  DimensionsPanel
+  DimensionsPanel,
+  isExplicitAspectRatio
 } from "./dimensions.mjs";
 import {
   cleanEmptyObject,
@@ -47,8 +49,8 @@ import { unlock } from "../lock-unlock.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 var BORDER_SIDES = ["Top", "Right", "Bottom", "Left"];
 var RESPONSIVE_BREAKPOINTS = {
-  mobile: "@media (width <= 480px)",
-  tablet: "@media (480px < width <= 782px)"
+  "@mobile": "@media (width <= 480px)",
+  "@tablet": "@media (480px < width <= 782px)"
 };
 var styleSupportKeys = [
   ...TYPOGRAPHY_SUPPORT_KEYS,
@@ -91,12 +93,52 @@ function getStateFallbackBorderStyles(stateStyles) {
   });
   return cleanEmptyObject({ border: cleanEmptyObject(fallbackBorder) });
 }
+function getStateBackgroundResetCSS(stateStyles, selector) {
+  const hasSolidBackground = !!stateStyles?.color?.background;
+  if (!hasSolidBackground) {
+    return void 0;
+  }
+  const hasColorGradient = !!stateStyles?.color?.gradient;
+  const hasBackgroundGradient = !!stateStyles?.background?.gradient || !!stateStyles?.background?.backgroundImage;
+  if (hasColorGradient || hasBackgroundGradient) {
+    return void 0;
+  }
+  const declaration = "background-image: unset !important";
+  return selector ? `${selector} { ${declaration}; }` : `${declaration};`;
+}
+function getStateFallbackDimensionStyles(stateStyles) {
+  const dimensions = stateStyles?.dimensions;
+  if (!dimensions) {
+    return void 0;
+  }
+  if (isExplicitAspectRatio(dimensions.aspectRatio)) {
+    return {
+      dimensions: {
+        minHeight: "unset",
+        height: "unset"
+      }
+    };
+  }
+  if (dimensions.minHeight || dimensions.height) {
+    return {
+      dimensions: {
+        aspectRatio: "unset"
+      }
+    };
+  }
+}
 function getStateStylesCSS(stateStyles, selector) {
-  const css = compileCSS(stateStyles, { selector });
+  const fallbackDimensionStyles = getStateFallbackDimensionStyles(stateStyles);
+  const stylesWithDimensionFallbacks = fallbackDimensionStyles ? mergeStyleObjects(stateStyles, fallbackDimensionStyles) : stateStyles;
+  const css = compileCSS(stylesWithDimensionFallbacks, { selector });
   const importantCSS = css ? css.replace(/;/g, " !important;") : void 0;
   const fallbackBorderStyles = getStateFallbackBorderStyles(stateStyles);
   const fallbackCSS = fallbackBorderStyles ? compileCSS(fallbackBorderStyles, { selector }) : void 0;
-  return [importantCSS, fallbackCSS].filter(Boolean).join("\n");
+  const backgroundResetCSS = getStateBackgroundResetCSS(
+    stateStyles,
+    selector
+  );
+  return [importantCSS, fallbackCSS, backgroundResetCSS].filter(Boolean).join("\n");
 }
 function isPlainObject(value) {
   return !!value && typeof value === "object" && !Array.isArray(value);
@@ -208,7 +250,10 @@ function getResponsiveStateCSSRules(style, name, baseSelector) {
   const nestedStateKeys = ["elements", ...validPseudoStates];
   Object.entries(RESPONSIVE_BREAKPOINTS).forEach(
     ([viewport, mediaQuery]) => {
-      const viewportStyles = style?.[viewport];
+      const viewportStyles = getStyleForState(style, {
+        viewport,
+        pseudo: DEFAULT_BLOCK_STYLE_STATE.pseudo
+      });
       if (!viewportStyles) {
         return;
       }
@@ -437,7 +482,7 @@ function BlockStyleControls({
     settings: panelSettings
   };
   return /* @__PURE__ */ jsxs(BlockStyleStateProvider, { value: selectedState, children: [
-    /* @__PURE__ */ jsx(ColorEdit, { ...passedProps }),
+    /* @__PURE__ */ jsx(ElementsEdit, { ...passedProps }),
     /* @__PURE__ */ jsx(BackgroundImagePanel, { ...passedProps }),
     /* @__PURE__ */ jsx(TypographyPanel, { ...passedProps }),
     /* @__PURE__ */ jsx(BorderPanel, { ...passedProps }),