@wordpress/block-editor 15.5.1-next.ff1cebbba.0 → 15.6.1-next.36001005c.0

package/build-module/hooks/duotone.js

@@ -9,6 +9,7 @@ import {
 import { useInstanceId } from "@wordpress/compose";
 import { addFilter } from "@wordpress/hooks";
 import { useMemo, useEffect } from "@wordpress/element";
+import { getBlockSelector } from "@wordpress/global-styles-engine";
 import {
   BlockControls,
   InspectorControls,
@@ -20,7 +21,6 @@ import {
   getDuotoneStylesheet,
   getDuotoneUnsetStylesheet
 } from "../components/duotone/utils";
-import { getBlockCSSSelector } from "../components/global-styles/get-block-css-selector";
 import { scopeSelector } from "../components/global-styles/utils";
 import {
   cleanEmptyObject,
@@ -238,10 +238,10 @@ function useBlockProps({ clientId, name, style }) {
         false
       );
       if (experimentalDuotone) {
-        const rootSelector = getBlockCSSSelector(blockType);
+        const rootSelector = getBlockSelector(blockType);
         return typeof experimentalDuotone === "string" ? scopeSelector(rootSelector, experimentalDuotone) : rootSelector;
       }
-      return getBlockCSSSelector(blockType, "filter.duotone", {
+      return getBlockSelector(blockType, "filter.duotone", {
         fallback: true
       });
     }

package/build-module/hooks/duotone.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/hooks/duotone.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport { extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tgetBlockSupport,\n\tgetBlockType,\n\thasBlockSupport,\n} from '@wordpress/blocks';\nimport { useInstanceId } from '@wordpress/compose';\nimport { addFilter } from '@wordpress/hooks';\nimport { useMemo, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport {\n\tBlockControls,\n\tInspectorControls,\n\t__experimentalDuotoneControl as DuotoneControl,\n\tuseSettings,\n} from '../components';\nimport {\n\tgetDuotoneFilter,\n\tgetDuotoneStylesheet,\n\tgetDuotoneUnsetStylesheet,\n} from '../components/duotone/utils';\nimport { getBlockCSSSelector } from '../components/global-styles/get-block-css-selector';\nimport { scopeSelector } from '../components/global-styles/utils';\nimport {\n\tcleanEmptyObject,\n\tuseBlockSettings,\n\tusePrivateStyleOverride,\n} from './utils';\nimport { default as StylesFiltersPanel } from '../components/global-styles/filters-panel';\nimport { useBlockEditingMode } from '../components/block-editing-mode';\nimport { useBlockElement } from '../components/block-list/use-block-props/use-block-refs';\n\nconst EMPTY_ARRAY = [];\n\n// Safari does not always update the duotone filter when the duotone colors\n// are changed. This browser check is later used to force a re-render of the block\n// element to ensure the duotone filter is updated. The check is included at the\n// root of this file as it only needs to be run once per page load.\nconst isSafari =\n\twindow?.navigator.userAgent &&\n\twindow.navigator.userAgent.includes( 'Safari' ) &&\n\t! window.navigator.userAgent.includes( 'Chrome' ) &&\n\t! window.navigator.userAgent.includes( 'Chromium' );\n\nextend( [ namesPlugin ] );\n\nfunction useMultiOriginPresets( { presetSetting, defaultSetting } ) {\n\tconst [ enableDefault, userPresets, themePresets, defaultPresets ] =\n\t\tuseSettings(\n\t\t\tdefaultSetting,\n\t\t\t`${ presetSetting }.custom`,\n\t\t\t`${ presetSetting }.theme`,\n\t\t\t`${ presetSetting }.default`\n\t\t);\n\treturn useMemo(\n\t\t() => [\n\t\t\t...( userPresets || EMPTY_ARRAY ),\n\t\t\t...( themePresets || EMPTY_ARRAY ),\n\t\t\t...( ( enableDefault && defaultPresets ) || EMPTY_ARRAY ),\n\t\t],\n\t\t[ enableDefault, userPresets, themePresets, defaultPresets ]\n\t);\n}\n\nexport function getColorsFromDuotonePreset( duotone, duotonePalette ) {\n\tif ( ! duotone ) {\n\t\treturn;\n\t}\n\tconst preset = duotonePalette?.find( ( { slug } ) => {\n\t\treturn duotone === `var:preset|duotone|${ slug }`;\n\t} );\n\n\treturn preset ? preset.colors : undefined;\n}\n\nexport function getDuotonePresetFromColors( colors, duotonePalette ) {\n\tif ( ! colors || ! Array.isArray( colors ) ) {\n\t\treturn;\n\t}\n\n\tconst preset = duotonePalette?.find( ( duotonePreset ) => {\n\t\treturn duotonePreset?.colors?.every(\n\t\t\t( val, index ) => val === colors[ index ]\n\t\t);\n\t} );\n\n\treturn preset ? `var:preset|duotone|${ preset.slug }` : undefined;\n}\n\nfunction DuotonePanelPure( { style, setAttributes, name } ) {\n\tconst duotoneStyle = style?.color?.duotone;\n\tconst settings = useBlockSettings( name );\n\tconst blockEditingMode = useBlockEditingMode();\n\n\tconst duotonePalette = useMultiOriginPresets( {\n\t\tpresetSetting: 'color.duotone',\n\t\tdefaultSetting: 'color.defaultDuotone',\n\t} );\n\tconst colorPalette = useMultiOriginPresets( {\n\t\tpresetSetting: 'color.palette',\n\t\tdefaultSetting: 'color.defaultPalette',\n\t} );\n\tconst [ enableCustomColors, enableCustomDuotone ] = useSettings(\n\t\t'color.custom',\n\t\t'color.customDuotone'\n\t);\n\tconst disableCustomColors = ! enableCustomColors;\n\tconst disableCustomDuotone =\n\t\t! enableCustomDuotone ||\n\t\t( colorPalette?.length === 0 && disableCustomColors );\n\n\tif ( duotonePalette?.length === 0 && disableCustomDuotone ) {\n\t\treturn null;\n\t}\n\n\tif ( blockEditingMode !== 'default' ) {\n\t\treturn null;\n\t}\n\n\tconst duotonePresetOrColors =\n\t\tduotoneStyle === 'unset' || Array.isArray( duotoneStyle )\n\t\t\t? duotoneStyle\n\t\t\t: getColorsFromDuotonePreset( duotoneStyle, duotonePalette );\n\n\treturn (\n\t\t<>\n\t\t\t<InspectorControls group=\"filter\">\n\t\t\t\t<StylesFiltersPanel\n\t\t\t\t\tvalue={ { filter: { duotone: duotonePresetOrColors } } }\n\t\t\t\t\tonChange={ ( newDuotone ) => {\n\t\t\t\t\t\tconst newStyle = {\n\t\t\t\t\t\t\t...style,\n\t\t\t\t\t\t\tcolor: {\n\t\t\t\t\t\t\t\t...newDuotone?.filter,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t};\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tstyle: cleanEmptyObject( newStyle ),\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tsettings={ settings }\n\t\t\t\t/>\n\t\t\t</InspectorControls>\n\t\t\t<BlockControls group=\"block\" __experimentalShareWithChildBlocks>\n\t\t\t\t<DuotoneControl\n\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\t\tdisableCustomDuotone={ disableCustomDuotone }\n\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\tvalue={ duotonePresetOrColors }\n\t\t\t\t\tonChange={ ( newDuotone ) => {\n\t\t\t\t\t\tconst maybePreset = getDuotonePresetFromColors(\n\t\t\t\t\t\t\tnewDuotone,\n\t\t\t\t\t\t\tduotonePalette\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\tconst newStyle = {\n\t\t\t\t\t\t\t...style,\n\t\t\t\t\t\t\tcolor: {\n\t\t\t\t\t\t\t\t...style?.color,\n\t\t\t\t\t\t\t\tduotone: maybePreset ?? newDuotone, // use preset or fallback to custom colors.\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t};\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tstyle: cleanEmptyObject( newStyle ),\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tsettings={ settings }\n\t\t\t\t/>\n\t\t\t</BlockControls>\n\t\t</>\n\t);\n}\n\nexport default {\n\tshareWithChildBlocks: true,\n\tedit: DuotonePanelPure,\n\tuseBlockProps,\n\tattributeKeys: [ 'style' ],\n\thasSupport( name ) {\n\t\treturn hasBlockSupport( name, 'filter.duotone' );\n\t},\n};\n\n/**\n * Filters registered block settings, extending attributes to include\n * the `duotone` attribute.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nfunction addDuotoneAttributes( settings ) {\n\t// Previous `color.__experimentalDuotone` support flag is migrated via\n\t// block_type_metadata_settings filter in `lib/block-supports/duotone.php`.\n\tif ( ! hasBlockSupport( settings, 'filter.duotone' ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify their own attribute definition with default\n\t// values if needed.\n\tif ( ! settings.attributes.style ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tstyle: {\n\t\t\t\ttype: 'object',\n\t\t\t},\n\t\t} );\n\t}\n\n\treturn settings;\n}\n\nfunction useDuotoneStyles( {\n\tclientId,\n\tid: filterId,\n\tselector: duotoneSelector,\n\tattribute: duotoneAttr,\n} ) {\n\tconst duotonePalette = useMultiOriginPresets( {\n\t\tpresetSetting: 'color.duotone',\n\t\tdefaultSetting: 'color.defaultDuotone',\n\t} );\n\n\t// Possible values for duotone attribute:\n\t// 1. Array of colors - e.g. ['#000000', '#ffffff'].\n\t// 2. Variable for an existing Duotone preset - e.g. 'var:preset|duotone|green-blue' or 'var(--wp--preset--duotone--green-blue)''\n\t// 3. A CSS string - e.g. 'unset' to remove globally applied duotone.\n\tconst isCustom = Array.isArray( duotoneAttr );\n\tconst duotonePreset = isCustom\n\t\t? undefined\n\t\t: getColorsFromDuotonePreset( duotoneAttr, duotonePalette );\n\tconst isPreset = typeof duotoneAttr === 'string' && duotonePreset;\n\tconst isCSS = typeof duotoneAttr === 'string' && ! isPreset;\n\n\t// Match the structure of WP_Duotone_Gutenberg::render_duotone_support() in PHP.\n\tlet colors = null;\n\tif ( isPreset ) {\n\t\t// Array of colors.\n\t\tcolors = duotonePreset;\n\t} else if ( isCSS ) {\n\t\t// CSS filter property string (e.g. 'unset').\n\t\tcolors = duotoneAttr;\n\t} else if ( isCustom ) {\n\t\t// Array of colors.\n\t\tcolors = duotoneAttr;\n\t}\n\n\t// Build the CSS selectors to which the filter will be applied.\n\tconst selectors = duotoneSelector.split( ',' );\n\n\tconst selectorsScoped = selectors.map( ( selectorPart ) => {\n\t\t// Assuming the selector part is a subclass selector (not a tag name)\n\t\t// so we can prepend the filter id class. If we want to support elements\n\t\t// such as `img` or namespaces, we'll need to add a case for that here.\n\t\treturn `.${ filterId }${ selectorPart.trim() }`;\n\t} );\n\n\tconst selector = selectorsScoped.join( ', ' );\n\n\tconst isValidFilter = Array.isArray( colors ) || colors === 'unset';\n\n\tusePrivateStyleOverride(\n\t\tisValidFilter\n\t\t\t? {\n\t\t\t\t\tcss:\n\t\t\t\t\t\tcolors !== 'unset'\n\t\t\t\t\t\t\t? getDuotoneStylesheet( selector, filterId )\n\t\t\t\t\t\t\t: getDuotoneUnsetStylesheet( selector ),\n\t\t\t\t\t__unstableType: 'presets',\n\t\t\t  }\n\t\t\t: undefined\n\t);\n\tusePrivateStyleOverride(\n\t\tisValidFilter\n\t\t\t? {\n\t\t\t\t\tassets:\n\t\t\t\t\t\tcolors !== 'unset'\n\t\t\t\t\t\t\t? getDuotoneFilter( filterId, colors )\n\t\t\t\t\t\t\t: '',\n\t\t\t\t\t__unstableType: 'svgs',\n\t\t\t  }\n\t\t\t: undefined\n\t);\n\n\tconst blockElement = useBlockElement( clientId );\n\n\tuseEffect( () => {\n\t\tif ( ! isValidFilter ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Safari does not always update the duotone filter when the duotone\n\t\t// colors are changed. When using Safari, force the block element to be\n\t\t// repainted by the browser to ensure any changes are reflected\n\t\t// visually. This logic matches that used on the site frontend in\n\t\t// `block-supports/duotone.php`.\n\t\tif ( blockElement && isSafari ) {\n\t\t\tconst display = blockElement.style.display;\n\t\t\t// Switch to `inline-block` to force a repaint. In the editor,\n\t\t\t// `inline-block` is used instead of `none` to ensure that scroll\n\t\t\t// position is not affected, as `none` results in the editor\n\t\t\t// scrolling to the top of the block.\n\t\t\tblockElement.style.setProperty( 'display', 'inline-block' );\n\t\t\t// Simply accessing el.offsetHeight flushes layout and style changes\n\t\t\t// in WebKit without having to wait for setTimeout.\n\t\t\t// eslint-disable-next-line no-unused-expressions\n\t\t\tblockElement.offsetHeight;\n\t\t\tblockElement.style.setProperty( 'display', display );\n\t\t}\n\t\t// `colors` must be a dependency so this effect runs when the colors\n\t\t// change in Safari.\n\t}, [ isValidFilter, blockElement, colors ] );\n}\n\n// Used for generating the instance ID\nconst DUOTONE_BLOCK_PROPS_REFERENCE = {};\n\nfunction useBlockProps( { clientId, name, style } ) {\n\tconst id = useInstanceId( DUOTONE_BLOCK_PROPS_REFERENCE );\n\tconst selector = useMemo( () => {\n\t\tconst blockType = getBlockType( name );\n\n\t\tif ( blockType ) {\n\t\t\t// Backwards compatibility for `supports.color.__experimentalDuotone`\n\t\t\t// is provided via the `block_type_metadata_settings` filter. If\n\t\t\t// `supports.filter.duotone` has not been set and the\n\t\t\t// experimental property has been, the experimental property\n\t\t\t// value is copied into `supports.filter.duotone`.\n\t\t\tconst duotoneSupport = getBlockSupport(\n\t\t\t\tblockType,\n\t\t\t\t'filter.duotone',\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tif ( ! duotoneSupport ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\t// If the experimental duotone support was set, that value is\n\t\t\t// to be treated as a selector and requires scoping.\n\t\t\tconst experimentalDuotone = getBlockSupport(\n\t\t\t\tblockType,\n\t\t\t\t'color.__experimentalDuotone',\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tif ( experimentalDuotone ) {\n\t\t\t\tconst rootSelector = getBlockCSSSelector( blockType );\n\t\t\t\treturn typeof experimentalDuotone === 'string'\n\t\t\t\t\t? scopeSelector( rootSelector, experimentalDuotone )\n\t\t\t\t\t: rootSelector;\n\t\t\t}\n\n\t\t\t// Regular filter.duotone support uses filter.duotone selectors with fallbacks.\n\t\t\treturn getBlockCSSSelector( blockType, 'filter.duotone', {\n\t\t\t\tfallback: true,\n\t\t\t} );\n\t\t}\n\t}, [ name ] );\n\n\tconst attribute = style?.color?.duotone;\n\n\tconst filterClass = `wp-duotone-${ id }`;\n\n\tconst shouldRender = selector && attribute;\n\n\tuseDuotoneStyles( {\n\t\tclientId,\n\t\tid: filterClass,\n\t\tselector,\n\t\tattribute,\n\t} );\n\n\treturn {\n\t\tclassName: shouldRender ? filterClass : '',\n\t};\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/editor/duotone/add-attributes',\n\taddDuotoneAttributes\n);\n"],
-  "mappings": "AAwIE,mBAEE,KAFF;AArIF,SAAS,cAAc;AACvB,OAAO,iBAAiB;AAKxB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB;AAC1B,SAAS,SAAS,iBAAiB;AAKnC;AAAA,EACC;AAAA,EACA;AAAA,EACA,gCAAgC;AAAA,EAChC;AAAA,OACM;AACP;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,2BAA2B;AACpC,SAAS,qBAAqB;AAC9B;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,WAAW,0BAA0B;AAC9C,SAAS,2BAA2B;AACpC,SAAS,uBAAuB;AAEhC,MAAM,cAAc,CAAC;AAMrB,MAAM,WACL,QAAQ,UAAU,aAClB,OAAO,UAAU,UAAU,SAAU,QAAS,KAC9C,CAAE,OAAO,UAAU,UAAU,SAAU,QAAS,KAChD,CAAE,OAAO,UAAU,UAAU,SAAU,UAAW;AAEnD,OAAQ,CAAE,WAAY,CAAE;AAExB,SAAS,sBAAuB,EAAE,eAAe,eAAe,GAAI;AACnE,QAAM,CAAE,eAAe,aAAa,cAAc,cAAe,IAChE;AAAA,IACC;AAAA,IACA,GAAI,aAAc;AAAA,IAClB,GAAI,aAAc;AAAA,IAClB,GAAI,aAAc;AAAA,EACnB;AACD,SAAO;AAAA,IACN,MAAM;AAAA,MACL,GAAK,eAAe;AAAA,MACpB,GAAK,gBAAgB;AAAA,MACrB,GAAO,iBAAiB,kBAAoB;AAAA,IAC7C;AAAA,IACA,CAAE,eAAe,aAAa,cAAc,cAAe;AAAA,EAC5D;AACD;AAEO,SAAS,2BAA4B,SAAS,gBAAiB;AACrE,MAAK,CAAE,SAAU;AAChB;AAAA,EACD;AACA,QAAM,SAAS,gBAAgB,KAAM,CAAE,EAAE,KAAK,MAAO;AACpD,WAAO,YAAY,sBAAuB,IAAK;AAAA,EAChD,CAAE;AAEF,SAAO,SAAS,OAAO,SAAS;AACjC;AAEO,SAAS,2BAA4B,QAAQ,gBAAiB;AACpE,MAAK,CAAE,UAAU,CAAE,MAAM,QAAS,MAAO,GAAI;AAC5C;AAAA,EACD;AAEA,QAAM,SAAS,gBAAgB,KAAM,CAAE,kBAAmB;AACzD,WAAO,eAAe,QAAQ;AAAA,MAC7B,CAAE,KAAK,UAAW,QAAQ,OAAQ,KAAM;AAAA,IACzC;AAAA,EACD,CAAE;AAEF,SAAO,SAAS,sBAAuB,OAAO,IAAK,KAAK;AACzD;AAEA,SAAS,iBAAkB,EAAE,OAAO,eAAe,KAAK,GAAI;AAC3D,QAAM,eAAe,OAAO,OAAO;AACnC,QAAM,WAAW,iBAAkB,IAAK;AACxC,QAAM,mBAAmB,oBAAoB;AAE7C,QAAM,iBAAiB,sBAAuB;AAAA,IAC7C,eAAe;AAAA,IACf,gBAAgB;AAAA,EACjB,CAAE;AACF,QAAM,eAAe,sBAAuB;AAAA,IAC3C,eAAe;AAAA,IACf,gBAAgB;AAAA,EACjB,CAAE;AACF,QAAM,CAAE,oBAAoB,mBAAoB,IAAI;AAAA,IACnD;AAAA,IACA;AAAA,EACD;AACA,QAAM,sBAAsB,CAAE;AAC9B,QAAM,uBACL,CAAE,uBACA,cAAc,WAAW,KAAK;AAEjC,MAAK,gBAAgB,WAAW,KAAK,sBAAuB;AAC3D,WAAO;AAAA,EACR;AAEA,MAAK,qBAAqB,WAAY;AACrC,WAAO;AAAA,EACR;AAEA,QAAM,wBACL,iBAAiB,WAAW,MAAM,QAAS,YAAa,IACrD,eACA,2BAA4B,cAAc,cAAe;AAE7D,SACC,iCACC;AAAA,wBAAC,qBAAkB,OAAM,UACxB;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,EAAE,QAAQ,EAAE,SAAS,sBAAsB,EAAE;AAAA,QACrD,UAAW,CAAE,eAAgB;AAC5B,gBAAM,WAAW;AAAA,YAChB,GAAG;AAAA,YACH,OAAO;AAAA,cACN,GAAG,YAAY;AAAA,YAChB;AAAA,UACD;AACA,wBAAe;AAAA,YACd,OAAO,iBAAkB,QAAS;AAAA,UACnC,CAAE;AAAA,QACH;AAAA,QACA;AAAA;AAAA,IACD,GACD;AAAA,IACA,oBAAC,iBAAc,OAAM,SAAQ,oCAAkC,MAC9D;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAQ;AAAA,QACR,UAAW,CAAE,eAAgB;AAC5B,gBAAM,cAAc;AAAA,YACnB;AAAA,YACA;AAAA,UACD;AAEA,gBAAM,WAAW;AAAA,YAChB,GAAG;AAAA,YACH,OAAO;AAAA,cACN,GAAG,OAAO;AAAA,cACV,SAAS,eAAe;AAAA;AAAA,YACzB;AAAA,UACD;AACA,wBAAe;AAAA,YACd,OAAO,iBAAkB,QAAS;AAAA,UACnC,CAAE;AAAA,QACH;AAAA,QACA;AAAA;AAAA,IACD,GACD;AAAA,KACD;AAEF;AAEA,IAAO,kBAAQ;AAAA,EACd,sBAAsB;AAAA,EACtB,MAAM;AAAA,EACN;AAAA,EACA,eAAe,CAAE,OAAQ;AAAA,EACzB,WAAY,MAAO;AAClB,WAAO,gBAAiB,MAAM,gBAAiB;AAAA,EAChD;AACD;AAUA,SAAS,qBAAsB,UAAW;AAGzC,MAAK,CAAE,gBAAiB,UAAU,gBAAiB,GAAI;AACtD,WAAO;AAAA,EACR;AAIA,MAAK,CAAE,SAAS,WAAW,OAAQ;AAClC,WAAO,OAAQ,SAAS,YAAY;AAAA,MACnC,OAAO;AAAA,QACN,MAAM;AAAA,MACP;AAAA,IACD,CAAE;AAAA,EACH;AAEA,SAAO;AACR;AAEA,SAAS,iBAAkB;AAAA,EAC1B;AAAA,EACA,IAAI;AAAA,EACJ,UAAU;AAAA,EACV,WAAW;AACZ,GAAI;AACH,QAAM,iBAAiB,sBAAuB;AAAA,IAC7C,eAAe;AAAA,IACf,gBAAgB;AAAA,EACjB,CAAE;AAMF,QAAM,WAAW,MAAM,QAAS,WAAY;AAC5C,QAAM,gBAAgB,WACnB,SACA,2BAA4B,aAAa,cAAe;AAC3D,QAAM,WAAW,OAAO,gBAAgB,YAAY;AACpD,QAAM,QAAQ,OAAO,gBAAgB,YAAY,CAAE;AAGnD,MAAI,SAAS;AACb,MAAK,UAAW;AAEf,aAAS;AAAA,EACV,WAAY,OAAQ;AAEnB,aAAS;AAAA,EACV,WAAY,UAAW;AAEtB,aAAS;AAAA,EACV;AAGA,QAAM,YAAY,gBAAgB,MAAO,GAAI;AAE7C,QAAM,kBAAkB,UAAU,IAAK,CAAE,iBAAkB;AAI1D,WAAO,IAAK,QAAS,GAAI,aAAa,KAAK,CAAE;AAAA,EAC9C,CAAE;AAEF,QAAM,WAAW,gBAAgB,KAAM,IAAK;AAE5C,QAAM,gBAAgB,MAAM,QAAS,MAAO,KAAK,WAAW;AAE5D;AAAA,IACC,gBACG;AAAA,MACA,KACC,WAAW,UACR,qBAAsB,UAAU,QAAS,IACzC,0BAA2B,QAAS;AAAA,MACxC,gBAAgB;AAAA,IAChB,IACA;AAAA,EACJ;AACA;AAAA,IACC,gBACG;AAAA,MACA,QACC,WAAW,UACR,iBAAkB,UAAU,MAAO,IACnC;AAAA,MACJ,gBAAgB;AAAA,IAChB,IACA;AAAA,EACJ;AAEA,QAAM,eAAe,gBAAiB,QAAS;AAE/C,YAAW,MAAM;AAChB,QAAK,CAAE,eAAgB;AACtB;AAAA,IACD;AAOA,QAAK,gBAAgB,UAAW;AAC/B,YAAM,UAAU,aAAa,MAAM;AAKnC,mBAAa,MAAM,YAAa,WAAW,cAAe;AAI1D,mBAAa;AACb,mBAAa,MAAM,YAAa,WAAW,OAAQ;AAAA,IACpD;AAAA,EAGD,GAAG,CAAE,eAAe,cAAc,MAAO,CAAE;AAC5C;AAGA,MAAM,gCAAgC,CAAC;AAEvC,SAAS,cAAe,EAAE,UAAU,MAAM,MAAM,GAAI;AACnD,QAAM,KAAK,cAAe,6BAA8B;AACxD,QAAM,WAAW,QAAS,MAAM;AAC/B,UAAM,YAAY,aAAc,IAAK;AAErC,QAAK,WAAY;AAMhB,YAAM,iBAAiB;AAAA,QACtB;AAAA,QACA;AAAA,QACA;AAAA,MACD;AACA,UAAK,CAAE,gBAAiB;AACvB,eAAO;AAAA,MACR;AAIA,YAAM,sBAAsB;AAAA,QAC3B;AAAA,QACA;AAAA,QACA;AAAA,MACD;AACA,UAAK,qBAAsB;AAC1B,cAAM,eAAe,oBAAqB,SAAU;AACpD,eAAO,OAAO,wBAAwB,WACnC,cAAe,cAAc,mBAAoB,IACjD;AAAA,MACJ;AAGA,aAAO,oBAAqB,WAAW,kBAAkB;AAAA,QACxD,UAAU;AAAA,MACX,CAAE;AAAA,IACH;AAAA,EACD,GAAG,CAAE,IAAK,CAAE;AAEZ,QAAM,YAAY,OAAO,OAAO;AAEhC,QAAM,cAAc,cAAe,EAAG;AAEtC,QAAM,eAAe,YAAY;AAEjC,mBAAkB;AAAA,IACjB;AAAA,IACA,IAAI;AAAA,IACJ;AAAA,IACA;AAAA,EACD,CAAE;AAEF,SAAO;AAAA,IACN,WAAW,eAAe,cAAc;AAAA,EACzC;AACD;AAEA;AAAA,EACC;AAAA,EACA;AAAA,EACA;AACD;",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport { extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tgetBlockSupport,\n\tgetBlockType,\n\thasBlockSupport,\n} from '@wordpress/blocks';\nimport { useInstanceId } from '@wordpress/compose';\nimport { addFilter } from '@wordpress/hooks';\nimport { useMemo, useEffect } from '@wordpress/element';\nimport { getBlockSelector } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport {\n\tBlockControls,\n\tInspectorControls,\n\t__experimentalDuotoneControl as DuotoneControl,\n\tuseSettings,\n} from '../components';\nimport {\n\tgetDuotoneFilter,\n\tgetDuotoneStylesheet,\n\tgetDuotoneUnsetStylesheet,\n} from '../components/duotone/utils';\nimport { scopeSelector } from '../components/global-styles/utils';\nimport {\n\tcleanEmptyObject,\n\tuseBlockSettings,\n\tusePrivateStyleOverride,\n} from './utils';\nimport { default as StylesFiltersPanel } from '../components/global-styles/filters-panel';\nimport { useBlockEditingMode } from '../components/block-editing-mode';\nimport { useBlockElement } from '../components/block-list/use-block-props/use-block-refs';\n\nconst EMPTY_ARRAY = [];\n\n// Safari does not always update the duotone filter when the duotone colors\n// are changed. This browser check is later used to force a re-render of the block\n// element to ensure the duotone filter is updated. The check is included at the\n// root of this file as it only needs to be run once per page load.\nconst isSafari =\n\twindow?.navigator.userAgent &&\n\twindow.navigator.userAgent.includes( 'Safari' ) &&\n\t! window.navigator.userAgent.includes( 'Chrome' ) &&\n\t! window.navigator.userAgent.includes( 'Chromium' );\n\nextend( [ namesPlugin ] );\n\nfunction useMultiOriginPresets( { presetSetting, defaultSetting } ) {\n\tconst [ enableDefault, userPresets, themePresets, defaultPresets ] =\n\t\tuseSettings(\n\t\t\tdefaultSetting,\n\t\t\t`${ presetSetting }.custom`,\n\t\t\t`${ presetSetting }.theme`,\n\t\t\t`${ presetSetting }.default`\n\t\t);\n\treturn useMemo(\n\t\t() => [\n\t\t\t...( userPresets || EMPTY_ARRAY ),\n\t\t\t...( themePresets || EMPTY_ARRAY ),\n\t\t\t...( ( enableDefault && defaultPresets ) || EMPTY_ARRAY ),\n\t\t],\n\t\t[ enableDefault, userPresets, themePresets, defaultPresets ]\n\t);\n}\n\nexport function getColorsFromDuotonePreset( duotone, duotonePalette ) {\n\tif ( ! duotone ) {\n\t\treturn;\n\t}\n\tconst preset = duotonePalette?.find( ( { slug } ) => {\n\t\treturn duotone === `var:preset|duotone|${ slug }`;\n\t} );\n\n\treturn preset ? preset.colors : undefined;\n}\n\nexport function getDuotonePresetFromColors( colors, duotonePalette ) {\n\tif ( ! colors || ! Array.isArray( colors ) ) {\n\t\treturn;\n\t}\n\n\tconst preset = duotonePalette?.find( ( duotonePreset ) => {\n\t\treturn duotonePreset?.colors?.every(\n\t\t\t( val, index ) => val === colors[ index ]\n\t\t);\n\t} );\n\n\treturn preset ? `var:preset|duotone|${ preset.slug }` : undefined;\n}\n\nfunction DuotonePanelPure( { style, setAttributes, name } ) {\n\tconst duotoneStyle = style?.color?.duotone;\n\tconst settings = useBlockSettings( name );\n\tconst blockEditingMode = useBlockEditingMode();\n\n\tconst duotonePalette = useMultiOriginPresets( {\n\t\tpresetSetting: 'color.duotone',\n\t\tdefaultSetting: 'color.defaultDuotone',\n\t} );\n\tconst colorPalette = useMultiOriginPresets( {\n\t\tpresetSetting: 'color.palette',\n\t\tdefaultSetting: 'color.defaultPalette',\n\t} );\n\tconst [ enableCustomColors, enableCustomDuotone ] = useSettings(\n\t\t'color.custom',\n\t\t'color.customDuotone'\n\t);\n\tconst disableCustomColors = ! enableCustomColors;\n\tconst disableCustomDuotone =\n\t\t! enableCustomDuotone ||\n\t\t( colorPalette?.length === 0 && disableCustomColors );\n\n\tif ( duotonePalette?.length === 0 && disableCustomDuotone ) {\n\t\treturn null;\n\t}\n\n\tif ( blockEditingMode !== 'default' ) {\n\t\treturn null;\n\t}\n\n\tconst duotonePresetOrColors =\n\t\tduotoneStyle === 'unset' || Array.isArray( duotoneStyle )\n\t\t\t? duotoneStyle\n\t\t\t: getColorsFromDuotonePreset( duotoneStyle, duotonePalette );\n\n\treturn (\n\t\t<>\n\t\t\t<InspectorControls group=\"filter\">\n\t\t\t\t<StylesFiltersPanel\n\t\t\t\t\tvalue={ { filter: { duotone: duotonePresetOrColors } } }\n\t\t\t\t\tonChange={ ( newDuotone ) => {\n\t\t\t\t\t\tconst newStyle = {\n\t\t\t\t\t\t\t...style,\n\t\t\t\t\t\t\tcolor: {\n\t\t\t\t\t\t\t\t...newDuotone?.filter,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t};\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tstyle: cleanEmptyObject( newStyle ),\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tsettings={ settings }\n\t\t\t\t/>\n\t\t\t</InspectorControls>\n\t\t\t<BlockControls group=\"block\" __experimentalShareWithChildBlocks>\n\t\t\t\t<DuotoneControl\n\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\t\tdisableCustomDuotone={ disableCustomDuotone }\n\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\tvalue={ duotonePresetOrColors }\n\t\t\t\t\tonChange={ ( newDuotone ) => {\n\t\t\t\t\t\tconst maybePreset = getDuotonePresetFromColors(\n\t\t\t\t\t\t\tnewDuotone,\n\t\t\t\t\t\t\tduotonePalette\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\tconst newStyle = {\n\t\t\t\t\t\t\t...style,\n\t\t\t\t\t\t\tcolor: {\n\t\t\t\t\t\t\t\t...style?.color,\n\t\t\t\t\t\t\t\tduotone: maybePreset ?? newDuotone, // use preset or fallback to custom colors.\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t};\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tstyle: cleanEmptyObject( newStyle ),\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tsettings={ settings }\n\t\t\t\t/>\n\t\t\t</BlockControls>\n\t\t</>\n\t);\n}\n\nexport default {\n\tshareWithChildBlocks: true,\n\tedit: DuotonePanelPure,\n\tuseBlockProps,\n\tattributeKeys: [ 'style' ],\n\thasSupport( name ) {\n\t\treturn hasBlockSupport( name, 'filter.duotone' );\n\t},\n};\n\n/**\n * Filters registered block settings, extending attributes to include\n * the `duotone` attribute.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nfunction addDuotoneAttributes( settings ) {\n\t// Previous `color.__experimentalDuotone` support flag is migrated via\n\t// block_type_metadata_settings filter in `lib/block-supports/duotone.php`.\n\tif ( ! hasBlockSupport( settings, 'filter.duotone' ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify their own attribute definition with default\n\t// values if needed.\n\tif ( ! settings.attributes.style ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tstyle: {\n\t\t\t\ttype: 'object',\n\t\t\t},\n\t\t} );\n\t}\n\n\treturn settings;\n}\n\nfunction useDuotoneStyles( {\n\tclientId,\n\tid: filterId,\n\tselector: duotoneSelector,\n\tattribute: duotoneAttr,\n} ) {\n\tconst duotonePalette = useMultiOriginPresets( {\n\t\tpresetSetting: 'color.duotone',\n\t\tdefaultSetting: 'color.defaultDuotone',\n\t} );\n\n\t// Possible values for duotone attribute:\n\t// 1. Array of colors - e.g. ['#000000', '#ffffff'].\n\t// 2. Variable for an existing Duotone preset - e.g. 'var:preset|duotone|green-blue' or 'var(--wp--preset--duotone--green-blue)''\n\t// 3. A CSS string - e.g. 'unset' to remove globally applied duotone.\n\tconst isCustom = Array.isArray( duotoneAttr );\n\tconst duotonePreset = isCustom\n\t\t? undefined\n\t\t: getColorsFromDuotonePreset( duotoneAttr, duotonePalette );\n\tconst isPreset = typeof duotoneAttr === 'string' && duotonePreset;\n\tconst isCSS = typeof duotoneAttr === 'string' && ! isPreset;\n\n\t// Match the structure of WP_Duotone_Gutenberg::render_duotone_support() in PHP.\n\tlet colors = null;\n\tif ( isPreset ) {\n\t\t// Array of colors.\n\t\tcolors = duotonePreset;\n\t} else if ( isCSS ) {\n\t\t// CSS filter property string (e.g. 'unset').\n\t\tcolors = duotoneAttr;\n\t} else if ( isCustom ) {\n\t\t// Array of colors.\n\t\tcolors = duotoneAttr;\n\t}\n\n\t// Build the CSS selectors to which the filter will be applied.\n\tconst selectors = duotoneSelector.split( ',' );\n\n\tconst selectorsScoped = selectors.map( ( selectorPart ) => {\n\t\t// Assuming the selector part is a subclass selector (not a tag name)\n\t\t// so we can prepend the filter id class. If we want to support elements\n\t\t// such as `img` or namespaces, we'll need to add a case for that here.\n\t\treturn `.${ filterId }${ selectorPart.trim() }`;\n\t} );\n\n\tconst selector = selectorsScoped.join( ', ' );\n\n\tconst isValidFilter = Array.isArray( colors ) || colors === 'unset';\n\n\tusePrivateStyleOverride(\n\t\tisValidFilter\n\t\t\t? {\n\t\t\t\t\tcss:\n\t\t\t\t\t\tcolors !== 'unset'\n\t\t\t\t\t\t\t? getDuotoneStylesheet( selector, filterId )\n\t\t\t\t\t\t\t: getDuotoneUnsetStylesheet( selector ),\n\t\t\t\t\t__unstableType: 'presets',\n\t\t\t  }\n\t\t\t: undefined\n\t);\n\tusePrivateStyleOverride(\n\t\tisValidFilter\n\t\t\t? {\n\t\t\t\t\tassets:\n\t\t\t\t\t\tcolors !== 'unset'\n\t\t\t\t\t\t\t? getDuotoneFilter( filterId, colors )\n\t\t\t\t\t\t\t: '',\n\t\t\t\t\t__unstableType: 'svgs',\n\t\t\t  }\n\t\t\t: undefined\n\t);\n\n\tconst blockElement = useBlockElement( clientId );\n\n\tuseEffect( () => {\n\t\tif ( ! isValidFilter ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Safari does not always update the duotone filter when the duotone\n\t\t// colors are changed. When using Safari, force the block element to be\n\t\t// repainted by the browser to ensure any changes are reflected\n\t\t// visually. This logic matches that used on the site frontend in\n\t\t// `block-supports/duotone.php`.\n\t\tif ( blockElement && isSafari ) {\n\t\t\tconst display = blockElement.style.display;\n\t\t\t// Switch to `inline-block` to force a repaint. In the editor,\n\t\t\t// `inline-block` is used instead of `none` to ensure that scroll\n\t\t\t// position is not affected, as `none` results in the editor\n\t\t\t// scrolling to the top of the block.\n\t\t\tblockElement.style.setProperty( 'display', 'inline-block' );\n\t\t\t// Simply accessing el.offsetHeight flushes layout and style changes\n\t\t\t// in WebKit without having to wait for setTimeout.\n\t\t\t// eslint-disable-next-line no-unused-expressions\n\t\t\tblockElement.offsetHeight;\n\t\t\tblockElement.style.setProperty( 'display', display );\n\t\t}\n\t\t// `colors` must be a dependency so this effect runs when the colors\n\t\t// change in Safari.\n\t}, [ isValidFilter, blockElement, colors ] );\n}\n\n// Used for generating the instance ID\nconst DUOTONE_BLOCK_PROPS_REFERENCE = {};\n\nfunction useBlockProps( { clientId, name, style } ) {\n\tconst id = useInstanceId( DUOTONE_BLOCK_PROPS_REFERENCE );\n\tconst selector = useMemo( () => {\n\t\tconst blockType = getBlockType( name );\n\n\t\tif ( blockType ) {\n\t\t\t// Backwards compatibility for `supports.color.__experimentalDuotone`\n\t\t\t// is provided via the `block_type_metadata_settings` filter. If\n\t\t\t// `supports.filter.duotone` has not been set and the\n\t\t\t// experimental property has been, the experimental property\n\t\t\t// value is copied into `supports.filter.duotone`.\n\t\t\tconst duotoneSupport = getBlockSupport(\n\t\t\t\tblockType,\n\t\t\t\t'filter.duotone',\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tif ( ! duotoneSupport ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\t// If the experimental duotone support was set, that value is\n\t\t\t// to be treated as a selector and requires scoping.\n\t\t\tconst experimentalDuotone = getBlockSupport(\n\t\t\t\tblockType,\n\t\t\t\t'color.__experimentalDuotone',\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tif ( experimentalDuotone ) {\n\t\t\t\tconst rootSelector = getBlockSelector( blockType );\n\t\t\t\treturn typeof experimentalDuotone === 'string'\n\t\t\t\t\t? scopeSelector( rootSelector, experimentalDuotone )\n\t\t\t\t\t: rootSelector;\n\t\t\t}\n\n\t\t\t// Regular filter.duotone support uses filter.duotone selectors with fallbacks.\n\t\t\treturn getBlockSelector( blockType, 'filter.duotone', {\n\t\t\t\tfallback: true,\n\t\t\t} );\n\t\t}\n\t}, [ name ] );\n\n\tconst attribute = style?.color?.duotone;\n\n\tconst filterClass = `wp-duotone-${ id }`;\n\n\tconst shouldRender = selector && attribute;\n\n\tuseDuotoneStyles( {\n\t\tclientId,\n\t\tid: filterClass,\n\t\tselector,\n\t\tattribute,\n\t} );\n\n\treturn {\n\t\tclassName: shouldRender ? filterClass : '',\n\t};\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/editor/duotone/add-attributes',\n\taddDuotoneAttributes\n);\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/hooks/fit-text.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { addFilter } from "@wordpress/hooks";
 import { hasBlockSupport } from "@wordpress/blocks";
-import { useEffect, useCallback } from "@wordpress/element";
+import { useEffect, useCallback, useRef } from "@wordpress/element";
 import { useSelect } from "@wordpress/data";
 import { __ } from "@wordpress/i18n";
 import {
@@ -33,15 +33,22 @@ function addAttributes(settings) {
 function useFitText({ fitText, name, clientId }) {
   const hasFitTextSupport2 = hasBlockSupport(name, FIT_TEXT_SUPPORT_KEY);
   const blockElement = useBlockElement(clientId);
-  const blockAttributes = useSelect(
+  const { blockAttributes, isSelected } = useSelect(
     (select) => {
       if (!clientId) {
-        return;
+        return { blockAttributes: void 0, isSelected: false };
       }
-      return select(blockEditorStore).getBlockAttributes(clientId);
+      return {
+        blockAttributes: select(blockEditorStore).getBlockAttributes(clientId),
+        isSelected: select(blockEditorStore).isBlockSelected(clientId)
+      };
     },
     [clientId]
   );
+  const isSelectedRef = useRef();
+  useEffect(() => {
+    isSelectedRef.current = isSelected;
+  }, [isSelected]);
   const applyFitText = useCallback(() => {
     if (!blockElement || !hasFitTextSupport2 || !fitText) {
       return;
@@ -57,8 +64,9 @@ function useFitText({ fitText, name, clientId }) {
     const applyStylesFn = (css) => {
       styleElement.textContent = css;
     };
-    optimizeFitText(blockElement, blockSelector, applyStylesFn);
-  }, [blockElement, clientId, hasFitTextSupport2, fitText]);
+    const maxSize = isSelectedRef.current ? 200 : void 0;
+    optimizeFitText(blockElement, blockSelector, applyStylesFn, maxSize);
+  }, [blockElement, clientId, hasFitTextSupport2, fitText, isSelectedRef]);
   useEffect(() => {
     if (!fitText || !blockElement || !clientId || !hasFitTextSupport2) {
       return;
@@ -83,15 +91,16 @@ function useFitText({ fitText, name, clientId }) {
   }, [fitText, clientId, applyFitText, blockElement, hasFitTextSupport2]);
   useEffect(() => {
     if (fitText && blockElement && hasFitTextSupport2) {
-      const timer = setTimeout(() => {
+      const frameId = window.requestAnimationFrame(() => {
         if (blockElement) {
           applyFitText();
         }
-      }, 1e3);
-      return () => clearTimeout(timer);
+      });
+      return () => window.cancelAnimationFrame(frameId);
     }
   }, [
     blockAttributes,
+    isSelected,
     fitText,
     applyFitText,
     blockElement,

package/build-module/hooks/fit-text.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/hooks/fit-text.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { hasBlockSupport } from '@wordpress/blocks';\nimport { useEffect, useCallback } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tToggleControl,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { optimizeFitText } from '../utils/fit-text-utils';\nimport { store as blockEditorStore } from '../store';\nimport { useBlockElement } from '../components/block-list/use-block-props/use-block-refs';\nimport InspectorControls from '../components/inspector-controls';\n\nexport const FIT_TEXT_SUPPORT_KEY = 'typography.fitText';\n\n/**\n * Filters registered block settings, extending attributes to include\n * the `fitText` attribute.\n *\n * @param {Object} settings Original block settings.\n * @return {Object} Filtered block settings.\n */\nfunction addAttributes( settings ) {\n\tif ( ! hasBlockSupport( settings, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify their own attribute definition.\n\tif ( settings.attributes?.fitText ) {\n\t\treturn settings;\n\t}\n\n\t// Add fitText attribute.\n\treturn {\n\t\t...settings,\n\t\tattributes: {\n\t\t\t...settings.attributes,\n\t\t\tfitText: {\n\t\t\t\ttype: 'boolean',\n\t\t\t},\n\t\t},\n\t};\n}\n\n/**\n * Custom hook to handle fit text functionality in the editor.\n *\n * @param {Object}   props          Component props.\n * @param {?boolean} props.fitText  Fit text attribute.\n * @param {string}   props.name     Block name.\n * @param {string}   props.clientId Block client ID.\n */\nfunction useFitText( { fitText, name, clientId } ) {\n\tconst hasFitTextSupport = hasBlockSupport( name, FIT_TEXT_SUPPORT_KEY );\n\tconst blockElement = useBlockElement( clientId );\n\n\t// Monitor block attribute changes\n\t// Any attribute may change the available space.\n\tconst blockAttributes = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! clientId ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\treturn select( blockEditorStore ).getBlockAttributes( clientId );\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\tconst applyFitText = useCallback( () => {\n\t\tif ( ! blockElement || ! hasFitTextSupport || ! fitText ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Get or create style element with unique ID\n\t\tconst styleId = `fit-text-${ clientId }`;\n\t\tlet styleElement = blockElement.ownerDocument.getElementById( styleId );\n\t\tif ( ! styleElement ) {\n\t\t\tstyleElement = blockElement.ownerDocument.createElement( 'style' );\n\t\t\tstyleElement.id = styleId;\n\t\t\tblockElement.ownerDocument.head.appendChild( styleElement );\n\t\t}\n\n\t\tconst blockSelector = `#block-${ clientId }`;\n\n\t\tconst applyStylesFn = ( css ) => {\n\t\t\tstyleElement.textContent = css;\n\t\t};\n\n\t\toptimizeFitText( blockElement, blockSelector, applyStylesFn );\n\t}, [ blockElement, clientId, hasFitTextSupport, fitText ] );\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\t! fitText ||\n\t\t\t! blockElement ||\n\t\t\t! clientId ||\n\t\t\t! hasFitTextSupport\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Apply initially\n\t\tapplyFitText();\n\n\t\t// Store current element value for cleanup\n\t\tconst currentElement = blockElement;\n\n\t\t// Watch for size changes\n\t\tlet resizeObserver;\n\t\tif ( window.ResizeObserver && currentElement.parentElement ) {\n\t\t\tresizeObserver = new window.ResizeObserver( applyFitText );\n\t\t\tresizeObserver.observe( currentElement.parentElement );\n\t\t}\n\n\t\t// Cleanup function\n\t\treturn () => {\n\t\t\tif ( resizeObserver ) {\n\t\t\t\tresizeObserver.disconnect();\n\t\t\t}\n\n\t\t\tconst styleId = `fit-text-${ clientId }`;\n\t\t\tconst styleElement =\n\t\t\t\tcurrentElement.ownerDocument.getElementById( styleId );\n\t\t\tif ( styleElement ) {\n\t\t\t\tstyleElement.remove();\n\t\t\t}\n\t\t};\n\t}, [ fitText, clientId, applyFitText, blockElement, hasFitTextSupport ] );\n\n\t// Trigger fit text recalculation when content changes\n\tuseEffect( () => {\n\t\tif ( fitText && blockElement && hasFitTextSupport ) {\n\t\t\t// Small delay to ensure DOM has updated after content changes\n\t\t\tconst timer = setTimeout( () => {\n\t\t\t\tif ( blockElement ) {\n\t\t\t\t\tapplyFitText();\n\t\t\t\t}\n\t\t\t}, 1000 );\n\n\t\t\treturn () => clearTimeout( timer );\n\t\t}\n\t}, [\n\t\tblockAttributes,\n\t\tfitText,\n\t\tapplyFitText,\n\t\tblockElement,\n\t\thasFitTextSupport,\n\t] );\n}\n\n/**\n * Fit text control component for the typography panel.\n *\n * @param {Object}   props               Component props.\n * @param {string}   props.clientId      Block client ID.\n * @param {Function} props.setAttributes Function to set block attributes.\n * @param {string}   props.name          Block name.\n * @param {boolean}  props.fitText       Whether fit text is enabled.\n */\nexport function FitTextControl( {\n\tclientId,\n\tfitText = false,\n\tsetAttributes,\n\tname,\n} ) {\n\tif ( ! hasBlockSupport( name, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<InspectorControls group=\"typography\">\n\t\t\t<ToolsPanelItem\n\t\t\t\thasValue={ () => fitText }\n\t\t\t\tlabel={ __( 'Fit text' ) }\n\t\t\t\tonDeselect={ () => setAttributes( { fitText: undefined } ) }\n\t\t\t\tresetAllFilter={ () => ( { fitText: undefined } ) }\n\t\t\t\tpanelId={ clientId }\n\t\t\t>\n\t\t\t\t<ToggleControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tlabel={ __( 'Fit text' ) }\n\t\t\t\t\tchecked={ fitText }\n\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\tsetAttributes( { fitText: ! fitText || undefined } )\n\t\t\t\t\t}\n\t\t\t\t\thelp={\n\t\t\t\t\t\tfitText\n\t\t\t\t\t\t\t? __( 'Text will resize to fit its container.' )\n\t\t\t\t\t\t\t: __( 'Resize text to fit its container.' )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</ToolsPanelItem>\n\t\t</InspectorControls>\n\t);\n}\n\n/**\n * Override props applied to the block element on save.\n *\n * @param {Object} props      Additional props applied to the block element.\n * @param {Object} blockType  Block type.\n * @param {Object} attributes Block attributes.\n * @return {Object} Filtered props applied to the block element.\n */\nfunction addSaveProps( props, blockType, attributes ) {\n\tif ( ! hasBlockSupport( blockType, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn props;\n\t}\n\n\tconst { fitText } = attributes;\n\n\tif ( ! fitText ) {\n\t\treturn props;\n\t}\n\n\t// Add CSS class for frontend detection and styling\n\tconst className = props.className\n\t\t? `${ props.className } has-fit-text`\n\t\t: 'has-fit-text';\n\n\treturn {\n\t\t...props,\n\t\tclassName,\n\t};\n}\n/**\n * Override props applied to the block element in the editor.\n *\n * @param {Object}  props          Component props including block attributes.\n * @param {string}  props.name     Block name.\n * @param {boolean} props.fitText  Whether fit text is enabled.\n * @param {string}  props.clientId Block client ID.\n * @return {Object} Filtered props applied to the block element.\n */\nfunction useBlockProps( { name, fitText, clientId } ) {\n\tuseFitText( { fitText, name, clientId } );\n\tif ( ! fitText || ! hasBlockSupport( name, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn {};\n\t}\n\treturn {\n\t\tclassName: 'has-fit-text',\n\t};\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/fit-text/addAttribute',\n\taddAttributes\n);\n\nconst hasFitTextSupport = ( blockNameOrType ) => {\n\treturn hasBlockSupport( blockNameOrType, FIT_TEXT_SUPPORT_KEY );\n};\n\nexport default {\n\tuseBlockProps,\n\taddSaveProps,\n\tattributeKeys: [ 'fitText' ],\n\thasSupport: hasFitTextSupport,\n\tedit: FitTextControl,\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { hasBlockSupport } from '@wordpress/blocks';\nimport { useEffect, useCallback, useRef } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tToggleControl,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { optimizeFitText } from '../utils/fit-text-utils';\nimport { store as blockEditorStore } from '../store';\nimport { useBlockElement } from '../components/block-list/use-block-props/use-block-refs';\nimport InspectorControls from '../components/inspector-controls';\n\nexport const FIT_TEXT_SUPPORT_KEY = 'typography.fitText';\n\n/**\n * Filters registered block settings, extending attributes to include\n * the `fitText` attribute.\n *\n * @param {Object} settings Original block settings.\n * @return {Object} Filtered block settings.\n */\nfunction addAttributes( settings ) {\n\tif ( ! hasBlockSupport( settings, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify their own attribute definition.\n\tif ( settings.attributes?.fitText ) {\n\t\treturn settings;\n\t}\n\n\t// Add fitText attribute.\n\treturn {\n\t\t...settings,\n\t\tattributes: {\n\t\t\t...settings.attributes,\n\t\t\tfitText: {\n\t\t\t\ttype: 'boolean',\n\t\t\t},\n\t\t},\n\t};\n}\n\n/**\n * Custom hook to handle fit text functionality in the editor.\n *\n * @param {Object}   props          Component props.\n * @param {?boolean} props.fitText  Fit text attribute.\n * @param {string}   props.name     Block name.\n * @param {string}   props.clientId Block client ID.\n */\nfunction useFitText( { fitText, name, clientId } ) {\n\tconst hasFitTextSupport = hasBlockSupport( name, FIT_TEXT_SUPPORT_KEY );\n\tconst blockElement = useBlockElement( clientId );\n\n\t// Monitor block attribute changes and selection state\n\t// Any attribute may change the available space.\n\tconst { blockAttributes, isSelected } = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! clientId ) {\n\t\t\t\treturn { blockAttributes: undefined, isSelected: false };\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tblockAttributes:\n\t\t\t\t\tselect( blockEditorStore ).getBlockAttributes( clientId ),\n\t\t\t\tisSelected:\n\t\t\t\t\tselect( blockEditorStore ).isBlockSelected( clientId ),\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\tconst isSelectedRef = useRef();\n\tuseEffect( () => {\n\t\tisSelectedRef.current = isSelected;\n\t}, [ isSelected ] );\n\n\tconst applyFitText = useCallback( () => {\n\t\tif ( ! blockElement || ! hasFitTextSupport || ! fitText ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Get or create style element with unique ID\n\t\tconst styleId = `fit-text-${ clientId }`;\n\t\tlet styleElement = blockElement.ownerDocument.getElementById( styleId );\n\t\tif ( ! styleElement ) {\n\t\t\tstyleElement = blockElement.ownerDocument.createElement( 'style' );\n\t\t\tstyleElement.id = styleId;\n\t\t\tblockElement.ownerDocument.head.appendChild( styleElement );\n\t\t}\n\n\t\tconst blockSelector = `#block-${ clientId }`;\n\n\t\tconst applyStylesFn = ( css ) => {\n\t\t\tstyleElement.textContent = css;\n\t\t};\n\n\t\t// Avoid very jarring resizes when a user is actively editing the\n\t\t// block. Placing a ceiling on how much the block can grow curbs the\n\t\t// effect of the first few keypresses.\n\t\tconst maxSize = isSelectedRef.current ? 200 : undefined;\n\n\t\toptimizeFitText( blockElement, blockSelector, applyStylesFn, maxSize );\n\t}, [ blockElement, clientId, hasFitTextSupport, fitText, isSelectedRef ] );\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\t! fitText ||\n\t\t\t! blockElement ||\n\t\t\t! clientId ||\n\t\t\t! hasFitTextSupport\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Apply initially\n\t\tapplyFitText();\n\n\t\t// Store current element value for cleanup\n\t\tconst currentElement = blockElement;\n\n\t\t// Watch for size changes\n\t\tlet resizeObserver;\n\t\tif ( window.ResizeObserver && currentElement.parentElement ) {\n\t\t\tresizeObserver = new window.ResizeObserver( applyFitText );\n\t\t\tresizeObserver.observe( currentElement.parentElement );\n\t\t}\n\n\t\t// Cleanup function\n\t\treturn () => {\n\t\t\tif ( resizeObserver ) {\n\t\t\t\tresizeObserver.disconnect();\n\t\t\t}\n\n\t\t\tconst styleId = `fit-text-${ clientId }`;\n\t\t\tconst styleElement =\n\t\t\t\tcurrentElement.ownerDocument.getElementById( styleId );\n\t\t\tif ( styleElement ) {\n\t\t\t\tstyleElement.remove();\n\t\t\t}\n\t\t};\n\t}, [ fitText, clientId, applyFitText, blockElement, hasFitTextSupport ] );\n\n\t// Trigger fit text recalculation when content changes\n\tuseEffect( () => {\n\t\tif ( fitText && blockElement && hasFitTextSupport ) {\n\t\t\t// Wait for next frame to ensure DOM has updated after content changes\n\t\t\tconst frameId = window.requestAnimationFrame( () => {\n\t\t\t\tif ( blockElement ) {\n\t\t\t\t\tapplyFitText();\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\treturn () => window.cancelAnimationFrame( frameId );\n\t\t}\n\t}, [\n\t\tblockAttributes,\n\t\tisSelected,\n\t\tfitText,\n\t\tapplyFitText,\n\t\tblockElement,\n\t\thasFitTextSupport,\n\t] );\n}\n\n/**\n * Fit text control component for the typography panel.\n *\n * @param {Object}   props               Component props.\n * @param {string}   props.clientId      Block client ID.\n * @param {Function} props.setAttributes Function to set block attributes.\n * @param {string}   props.name          Block name.\n * @param {boolean}  props.fitText       Whether fit text is enabled.\n */\nexport function FitTextControl( {\n\tclientId,\n\tfitText = false,\n\tsetAttributes,\n\tname,\n} ) {\n\tif ( ! hasBlockSupport( name, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<InspectorControls group=\"typography\">\n\t\t\t<ToolsPanelItem\n\t\t\t\thasValue={ () => fitText }\n\t\t\t\tlabel={ __( 'Fit text' ) }\n\t\t\t\tonDeselect={ () => setAttributes( { fitText: undefined } ) }\n\t\t\t\tresetAllFilter={ () => ( { fitText: undefined } ) }\n\t\t\t\tpanelId={ clientId }\n\t\t\t>\n\t\t\t\t<ToggleControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tlabel={ __( 'Fit text' ) }\n\t\t\t\t\tchecked={ fitText }\n\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\tsetAttributes( { fitText: ! fitText || undefined } )\n\t\t\t\t\t}\n\t\t\t\t\thelp={\n\t\t\t\t\t\tfitText\n\t\t\t\t\t\t\t? __( 'Text will resize to fit its container.' )\n\t\t\t\t\t\t\t: __( 'Resize text to fit its container.' )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</ToolsPanelItem>\n\t\t</InspectorControls>\n\t);\n}\n\n/**\n * Override props applied to the block element on save.\n *\n * @param {Object} props      Additional props applied to the block element.\n * @param {Object} blockType  Block type.\n * @param {Object} attributes Block attributes.\n * @return {Object} Filtered props applied to the block element.\n */\nfunction addSaveProps( props, blockType, attributes ) {\n\tif ( ! hasBlockSupport( blockType, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn props;\n\t}\n\n\tconst { fitText } = attributes;\n\n\tif ( ! fitText ) {\n\t\treturn props;\n\t}\n\n\t// Add CSS class for frontend detection and styling\n\tconst className = props.className\n\t\t? `${ props.className } has-fit-text`\n\t\t: 'has-fit-text';\n\n\treturn {\n\t\t...props,\n\t\tclassName,\n\t};\n}\n/**\n * Override props applied to the block element in the editor.\n *\n * @param {Object}  props          Component props including block attributes.\n * @param {string}  props.name     Block name.\n * @param {boolean} props.fitText  Whether fit text is enabled.\n * @param {string}  props.clientId Block client ID.\n * @return {Object} Filtered props applied to the block element.\n */\nfunction useBlockProps( { name, fitText, clientId } ) {\n\tuseFitText( { fitText, name, clientId } );\n\tif ( ! fitText || ! hasBlockSupport( name, FIT_TEXT_SUPPORT_KEY ) ) {\n\t\treturn {};\n\t}\n\treturn {\n\t\tclassName: 'has-fit-text',\n\t};\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/fit-text/addAttribute',\n\taddAttributes\n);\n\nconst hasFitTextSupport = ( blockNameOrType ) => {\n\treturn hasBlockSupport( blockNameOrType, FIT_TEXT_SUPPORT_KEY );\n};\n\nexport default {\n\tuseBlockProps,\n\taddSaveProps,\n\tattributeKeys: [ 'fitText' ],\n\thasSupport: hasFitTextSupport,\n\tedit: FitTextControl,\n};\n"],
+  "mappings": "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",
   "names": ["hasFitTextSupport"]
 }

package/build-module/hooks/font-size.js

@@ -2,6 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { addFilter } from "@wordpress/hooks";
 import { hasBlockSupport } from "@wordpress/blocks";
 import TokenList from "@wordpress/token-list";
+import { getTypographyFontSizeValue } from "@wordpress/global-styles-engine";
 import {
   getFontSize,
   getFontSizeClass,
@@ -15,7 +16,6 @@ import {
   shouldSkipSerialization
 } from "./utils";
 import { useSettings } from "../components/use-settings";
-import { getTypographyFontSizeValue } from "../components/global-styles/typography-utils";
 const FONT_SIZE_SUPPORT_KEY = "typography.fontSize";
 function addAttributes(settings) {
   if (!hasBlockSupport(settings, FONT_SIZE_SUPPORT_KEY)) {

package/build-module/hooks/font-size.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/hooks/font-size.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { hasBlockSupport } from '@wordpress/blocks';\nimport TokenList from '@wordpress/token-list';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetFontSize,\n\tgetFontSizeClass,\n\tgetFontSizeObjectByValue,\n\tFontSizePicker,\n} from '../components/font-sizes';\nimport { TYPOGRAPHY_SUPPORT_KEY } from './typography';\nimport {\n\tcleanEmptyObject,\n\ttransformStyles,\n\tshouldSkipSerialization,\n} from './utils';\nimport { useSettings } from '../components/use-settings';\nimport { getTypographyFontSizeValue } from '../components/global-styles/typography-utils';\n\nexport const FONT_SIZE_SUPPORT_KEY = 'typography.fontSize';\n\n/**\n * Filters registered block settings, extending attributes to include\n * `fontSize` and `fontWeight` attributes.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nfunction addAttributes( settings ) {\n\tif ( ! hasBlockSupport( settings, FONT_SIZE_SUPPORT_KEY ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify a default value if needed.\n\tif ( ! settings.attributes.fontSize ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tfontSize: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\n\treturn settings;\n}\n\n/**\n * Override props assigned to save component to inject font size.\n *\n * @param {Object} props           Additional props applied to save element.\n * @param {Object} blockNameOrType Block type.\n * @param {Object} attributes      Block attributes.\n *\n * @return {Object} Filtered props applied to save element.\n */\nfunction addSaveProps( props, blockNameOrType, attributes ) {\n\tif ( ! hasBlockSupport( blockNameOrType, FONT_SIZE_SUPPORT_KEY ) ) {\n\t\treturn props;\n\t}\n\n\tif (\n\t\tshouldSkipSerialization(\n\t\t\tblockNameOrType,\n\t\t\tTYPOGRAPHY_SUPPORT_KEY,\n\t\t\t'fontSize'\n\t\t)\n\t) {\n\t\treturn props;\n\t}\n\n\t// Use TokenList to dedupe classes.\n\tconst classes = new TokenList( props.className );\n\tclasses.add( getFontSizeClass( attributes.fontSize ) );\n\tconst newClassName = classes.value;\n\tprops.className = newClassName ? newClassName : undefined;\n\n\treturn props;\n}\n\n/**\n * Inspector control panel containing the font size related configuration\n *\n * @param {Object} props\n *\n * @return {Element} Font size edit element.\n */\nexport function FontSizeEdit( props ) {\n\tconst {\n\t\tattributes: { fontSize, style },\n\t\tsetAttributes,\n\t} = props;\n\tconst [ fontSizes ] = useSettings( 'typography.fontSizes' );\n\n\tconst onChange = ( value ) => {\n\t\tconst fontSizeSlug = getFontSizeObjectByValue( fontSizes, value ).slug;\n\n\t\tsetAttributes( {\n\t\t\tstyle: cleanEmptyObject( {\n\t\t\t\t...style,\n\t\t\t\ttypography: {\n\t\t\t\t\t...style?.typography,\n\t\t\t\t\tfontSize: fontSizeSlug ? undefined : value,\n\t\t\t\t},\n\t\t\t} ),\n\t\t\tfontSize: fontSizeSlug,\n\t\t} );\n\t};\n\n\tconst fontSizeObject = getFontSize(\n\t\tfontSizes,\n\t\tfontSize,\n\t\tstyle?.typography?.fontSize\n\t);\n\n\tconst fontSizeValue =\n\t\tfontSizeObject?.size || style?.typography?.fontSize || fontSize;\n\n\treturn (\n\t\t<FontSizePicker\n\t\t\tonChange={ onChange }\n\t\t\tvalue={ fontSizeValue }\n\t\t\twithReset={ false }\n\t\t\twithSlider\n\t\t\tsize=\"__unstable-large\"\n\t\t/>\n\t);\n}\n\n/**\n * Custom hook that checks if font-size settings have been disabled.\n *\n * @param {string} name The name of the block.\n * @return {boolean} Whether setting is disabled.\n */\nexport function useIsFontSizeDisabled( { name: blockName } = {} ) {\n\tconst [ fontSizes ] = useSettings( 'typography.fontSizes' );\n\tconst hasFontSizes = !! fontSizes?.length;\n\n\treturn (\n\t\t! hasBlockSupport( blockName, FONT_SIZE_SUPPORT_KEY ) || ! hasFontSizes\n\t);\n}\n\nfunction useBlockProps( { name, fontSize, style } ) {\n\tconst [ fontSizes, fluidTypographySettings, layoutSettings ] = useSettings(\n\t\t'typography.fontSizes',\n\t\t'typography.fluid',\n\t\t'layout'\n\t);\n\n\t/*\n\t * Only add inline styles if the block supports font sizes,\n\t * doesn't skip serialization of font sizes,\n\t * and has either a custom font size or a preset font size.\n\t */\n\tif (\n\t\t! hasBlockSupport( name, FONT_SIZE_SUPPORT_KEY ) ||\n\t\tshouldSkipSerialization( name, TYPOGRAPHY_SUPPORT_KEY, 'fontSize' ) ||\n\t\t( ! fontSize && ! style?.typography?.fontSize )\n\t) {\n\t\treturn;\n\t}\n\n\tlet props;\n\n\tif ( style?.typography?.fontSize ) {\n\t\tprops = {\n\t\t\tstyle: {\n\t\t\t\tfontSize: getTypographyFontSizeValue(\n\t\t\t\t\t{ size: style.typography.fontSize },\n\t\t\t\t\t{\n\t\t\t\t\t\ttypography: {\n\t\t\t\t\t\t\tfluid: fluidTypographySettings,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tlayout: layoutSettings,\n\t\t\t\t\t}\n\t\t\t\t),\n\t\t\t},\n\t\t};\n\t}\n\n\tif ( fontSize ) {\n\t\tprops = {\n\t\t\tstyle: {\n\t\t\t\tfontSize: getFontSize(\n\t\t\t\t\tfontSizes,\n\t\t\t\t\tfontSize,\n\t\t\t\t\tstyle?.typography?.fontSize\n\t\t\t\t).size,\n\t\t\t},\n\t\t};\n\t}\n\n\tif ( ! props ) {\n\t\treturn;\n\t}\n\n\treturn addSaveProps( props, name, { fontSize } );\n}\n\nexport default {\n\tuseBlockProps,\n\taddSaveProps,\n\tattributeKeys: [ 'fontSize', 'style' ],\n\thasSupport( name ) {\n\t\treturn hasBlockSupport( name, FONT_SIZE_SUPPORT_KEY );\n\t},\n};\n\nconst MIGRATION_PATHS = {\n\tfontSize: [ [ 'fontSize' ], [ 'style', 'typography', 'fontSize' ] ],\n};\n\nfunction addTransforms( result, source, index, results ) {\n\tconst destinationBlockType = result.name;\n\tconst activeSupports = {\n\t\tfontSize: hasBlockSupport(\n\t\t\tdestinationBlockType,\n\t\t\tFONT_SIZE_SUPPORT_KEY\n\t\t),\n\t};\n\treturn transformStyles(\n\t\tactiveSupports,\n\t\tMIGRATION_PATHS,\n\t\tresult,\n\t\tsource,\n\t\tindex,\n\t\tresults\n\t);\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/font/addAttribute',\n\taddAttributes\n);\n\naddFilter(\n\t'blocks.switchToBlockType.transformedBlock',\n\t'core/font-size/addTransforms',\n\taddTransforms\n);\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { hasBlockSupport } from '@wordpress/blocks';\nimport TokenList from '@wordpress/token-list';\nimport { getTypographyFontSizeValue } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetFontSize,\n\tgetFontSizeClass,\n\tgetFontSizeObjectByValue,\n\tFontSizePicker,\n} from '../components/font-sizes';\nimport { TYPOGRAPHY_SUPPORT_KEY } from './typography';\nimport {\n\tcleanEmptyObject,\n\ttransformStyles,\n\tshouldSkipSerialization,\n} from './utils';\nimport { useSettings } from '../components/use-settings';\n\nexport const FONT_SIZE_SUPPORT_KEY = 'typography.fontSize';\n\n/**\n * Filters registered block settings, extending attributes to include\n * `fontSize` and `fontWeight` attributes.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nfunction addAttributes( settings ) {\n\tif ( ! hasBlockSupport( settings, FONT_SIZE_SUPPORT_KEY ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify a default value if needed.\n\tif ( ! settings.attributes.fontSize ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tfontSize: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\n\treturn settings;\n}\n\n/**\n * Override props assigned to save component to inject font size.\n *\n * @param {Object} props           Additional props applied to save element.\n * @param {Object} blockNameOrType Block type.\n * @param {Object} attributes      Block attributes.\n *\n * @return {Object} Filtered props applied to save element.\n */\nfunction addSaveProps( props, blockNameOrType, attributes ) {\n\tif ( ! hasBlockSupport( blockNameOrType, FONT_SIZE_SUPPORT_KEY ) ) {\n\t\treturn props;\n\t}\n\n\tif (\n\t\tshouldSkipSerialization(\n\t\t\tblockNameOrType,\n\t\t\tTYPOGRAPHY_SUPPORT_KEY,\n\t\t\t'fontSize'\n\t\t)\n\t) {\n\t\treturn props;\n\t}\n\n\t// Use TokenList to dedupe classes.\n\tconst classes = new TokenList( props.className );\n\tclasses.add( getFontSizeClass( attributes.fontSize ) );\n\tconst newClassName = classes.value;\n\tprops.className = newClassName ? newClassName : undefined;\n\n\treturn props;\n}\n\n/**\n * Inspector control panel containing the font size related configuration\n *\n * @param {Object} props\n *\n * @return {Element} Font size edit element.\n */\nexport function FontSizeEdit( props ) {\n\tconst {\n\t\tattributes: { fontSize, style },\n\t\tsetAttributes,\n\t} = props;\n\tconst [ fontSizes ] = useSettings( 'typography.fontSizes' );\n\n\tconst onChange = ( value ) => {\n\t\tconst fontSizeSlug = getFontSizeObjectByValue( fontSizes, value ).slug;\n\n\t\tsetAttributes( {\n\t\t\tstyle: cleanEmptyObject( {\n\t\t\t\t...style,\n\t\t\t\ttypography: {\n\t\t\t\t\t...style?.typography,\n\t\t\t\t\tfontSize: fontSizeSlug ? undefined : value,\n\t\t\t\t},\n\t\t\t} ),\n\t\t\tfontSize: fontSizeSlug,\n\t\t} );\n\t};\n\n\tconst fontSizeObject = getFontSize(\n\t\tfontSizes,\n\t\tfontSize,\n\t\tstyle?.typography?.fontSize\n\t);\n\n\tconst fontSizeValue =\n\t\tfontSizeObject?.size || style?.typography?.fontSize || fontSize;\n\n\treturn (\n\t\t<FontSizePicker\n\t\t\tonChange={ onChange }\n\t\t\tvalue={ fontSizeValue }\n\t\t\twithReset={ false }\n\t\t\twithSlider\n\t\t\tsize=\"__unstable-large\"\n\t\t/>\n\t);\n}\n\n/**\n * Custom hook that checks if font-size settings have been disabled.\n *\n * @param {string} name The name of the block.\n * @return {boolean} Whether setting is disabled.\n */\nexport function useIsFontSizeDisabled( { name: blockName } = {} ) {\n\tconst [ fontSizes ] = useSettings( 'typography.fontSizes' );\n\tconst hasFontSizes = !! fontSizes?.length;\n\n\treturn (\n\t\t! hasBlockSupport( blockName, FONT_SIZE_SUPPORT_KEY ) || ! hasFontSizes\n\t);\n}\n\nfunction useBlockProps( { name, fontSize, style } ) {\n\tconst [ fontSizes, fluidTypographySettings, layoutSettings ] = useSettings(\n\t\t'typography.fontSizes',\n\t\t'typography.fluid',\n\t\t'layout'\n\t);\n\n\t/*\n\t * Only add inline styles if the block supports font sizes,\n\t * doesn't skip serialization of font sizes,\n\t * and has either a custom font size or a preset font size.\n\t */\n\tif (\n\t\t! hasBlockSupport( name, FONT_SIZE_SUPPORT_KEY ) ||\n\t\tshouldSkipSerialization( name, TYPOGRAPHY_SUPPORT_KEY, 'fontSize' ) ||\n\t\t( ! fontSize && ! style?.typography?.fontSize )\n\t) {\n\t\treturn;\n\t}\n\n\tlet props;\n\n\tif ( style?.typography?.fontSize ) {\n\t\tprops = {\n\t\t\tstyle: {\n\t\t\t\tfontSize: getTypographyFontSizeValue(\n\t\t\t\t\t{ size: style.typography.fontSize },\n\t\t\t\t\t{\n\t\t\t\t\t\ttypography: {\n\t\t\t\t\t\t\tfluid: fluidTypographySettings,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tlayout: layoutSettings,\n\t\t\t\t\t}\n\t\t\t\t),\n\t\t\t},\n\t\t};\n\t}\n\n\tif ( fontSize ) {\n\t\tprops = {\n\t\t\tstyle: {\n\t\t\t\tfontSize: getFontSize(\n\t\t\t\t\tfontSizes,\n\t\t\t\t\tfontSize,\n\t\t\t\t\tstyle?.typography?.fontSize\n\t\t\t\t).size,\n\t\t\t},\n\t\t};\n\t}\n\n\tif ( ! props ) {\n\t\treturn;\n\t}\n\n\treturn addSaveProps( props, name, { fontSize } );\n}\n\nexport default {\n\tuseBlockProps,\n\taddSaveProps,\n\tattributeKeys: [ 'fontSize', 'style' ],\n\thasSupport( name ) {\n\t\treturn hasBlockSupport( name, FONT_SIZE_SUPPORT_KEY );\n\t},\n};\n\nconst MIGRATION_PATHS = {\n\tfontSize: [ [ 'fontSize' ], [ 'style', 'typography', 'fontSize' ] ],\n};\n\nfunction addTransforms( result, source, index, results ) {\n\tconst destinationBlockType = result.name;\n\tconst activeSupports = {\n\t\tfontSize: hasBlockSupport(\n\t\t\tdestinationBlockType,\n\t\t\tFONT_SIZE_SUPPORT_KEY\n\t\t),\n\t};\n\treturn transformStyles(\n\t\tactiveSupports,\n\t\tMIGRATION_PATHS,\n\t\tresult,\n\t\tsource,\n\t\tindex,\n\t\tresults\n\t);\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/font/addAttribute',\n\taddAttributes\n);\n\naddFilter(\n\t'blocks.switchToBlockType.transformedBlock',\n\t'core/font-size/addTransforms',\n\taddTransforms\n);\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/hooks/use-typography-props.js

@@ -1,8 +1,8 @@
 import clsx from "clsx";
 import { privateApis as componentsPrivateApis } from "@wordpress/components";
+import { getTypographyFontSizeValue } from "@wordpress/global-styles-engine";
 import { getInlineStyles } from "./style";
 import { getFontSizeClass } from "../components/font-sizes";
-import { getTypographyFontSizeValue } from "../components/global-styles/typography-utils";
 import { unlock } from "../lock-unlock";
 const { kebabCase } = unlock(componentsPrivateApis);
 function getTypographyClassesAndStyles(attributes, settings) {

package/build-module/hooks/use-typography-props.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/hooks/use-typography-props.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { privateApis as componentsPrivateApis } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { getInlineStyles } from './style';\nimport { getFontSizeClass } from '../components/font-sizes';\nimport { getTypographyFontSizeValue } from '../components/global-styles/typography-utils';\nimport { unlock } from '../lock-unlock';\n\nconst { kebabCase } = unlock( componentsPrivateApis );\n\n/*\n * This utility is intended to assist where the serialization of the typography\n * block support is being skipped for a block but the typography related CSS\n * styles still need to be generated so they can be applied to inner elements.\n */\n/**\n * Provides the CSS class names and inline styles for a block's typography support\n * attributes.\n *\n * @param {Object}         attributes Block attributes.\n * @param {Object|boolean} settings   Merged theme.json settings\n *\n * @return {Object} Typography block support derived CSS classes & styles.\n */\nexport function getTypographyClassesAndStyles( attributes, settings ) {\n\tlet typographyStyles = attributes?.style?.typography || {};\n\ttypographyStyles = {\n\t\t...typographyStyles,\n\t\tfontSize: getTypographyFontSizeValue(\n\t\t\t{ size: attributes?.style?.typography?.fontSize },\n\t\t\tsettings\n\t\t),\n\t};\n\n\tconst style = getInlineStyles( { typography: typographyStyles } );\n\tconst fontFamilyClassName = !! attributes?.fontFamily\n\t\t? `has-${ kebabCase( attributes.fontFamily ) }-font-family`\n\t\t: '';\n\tconst textAlignClassName = !! attributes?.style?.typography?.textAlign\n\t\t? `has-text-align-${ attributes?.style?.typography?.textAlign }`\n\t\t: '';\n\tconst className = clsx(\n\t\tfontFamilyClassName,\n\t\ttextAlignClassName,\n\t\tgetFontSizeClass( attributes?.fontSize )\n\t);\n\n\treturn {\n\t\tclassName,\n\t\tstyle,\n\t};\n}\n"],
-  "mappings": "AAGA,OAAO,UAAU;AAKjB,SAAS,eAAe,6BAA6B;AAKrD,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AACjC,SAAS,kCAAkC;AAC3C,SAAS,cAAc;AAEvB,MAAM,EAAE,UAAU,IAAI,OAAQ,qBAAsB;AAgB7C,SAAS,8BAA+B,YAAY,UAAW;AACrE,MAAI,mBAAmB,YAAY,OAAO,cAAc,CAAC;AACzD,qBAAmB;AAAA,IAClB,GAAG;AAAA,IACH,UAAU;AAAA,MACT,EAAE,MAAM,YAAY,OAAO,YAAY,SAAS;AAAA,MAChD;AAAA,IACD;AAAA,EACD;AAEA,QAAM,QAAQ,gBAAiB,EAAE,YAAY,iBAAiB,CAAE;AAChE,QAAM,sBAAsB,CAAC,CAAE,YAAY,aACxC,OAAQ,UAAW,WAAW,UAAW,CAAE,iBAC3C;AACH,QAAM,qBAAqB,CAAC,CAAE,YAAY,OAAO,YAAY,YAC1D,kBAAmB,YAAY,OAAO,YAAY,SAAU,KAC5D;AACH,QAAM,YAAY;AAAA,IACjB;AAAA,IACA;AAAA,IACA,iBAAkB,YAAY,QAAS;AAAA,EACxC;AAEA,SAAO;AAAA,IACN;AAAA,IACA;AAAA,EACD;AACD;",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { privateApis as componentsPrivateApis } from '@wordpress/components';\nimport { getTypographyFontSizeValue } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport { getInlineStyles } from './style';\nimport { getFontSizeClass } from '../components/font-sizes';\nimport { unlock } from '../lock-unlock';\n\nconst { kebabCase } = unlock( componentsPrivateApis );\n\n/*\n * This utility is intended to assist where the serialization of the typography\n * block support is being skipped for a block but the typography related CSS\n * styles still need to be generated so they can be applied to inner elements.\n */\n/**\n * Provides the CSS class names and inline styles for a block's typography support\n * attributes.\n *\n * @param {Object}         attributes Block attributes.\n * @param {Object|boolean} settings   Merged theme.json settings\n *\n * @return {Object} Typography block support derived CSS classes & styles.\n */\nexport function getTypographyClassesAndStyles( attributes, settings ) {\n\tlet typographyStyles = attributes?.style?.typography || {};\n\ttypographyStyles = {\n\t\t...typographyStyles,\n\t\tfontSize: getTypographyFontSizeValue(\n\t\t\t{ size: attributes?.style?.typography?.fontSize },\n\t\t\tsettings\n\t\t),\n\t};\n\n\tconst style = getInlineStyles( { typography: typographyStyles } );\n\tconst fontFamilyClassName = !! attributes?.fontFamily\n\t\t? `has-${ kebabCase( attributes.fontFamily ) }-font-family`\n\t\t: '';\n\tconst textAlignClassName = !! attributes?.style?.typography?.textAlign\n\t\t? `has-text-align-${ attributes?.style?.typography?.textAlign }`\n\t\t: '';\n\tconst className = clsx(\n\t\tfontFamilyClassName,\n\t\ttextAlignClassName,\n\t\tgetFontSizeClass( attributes?.fontSize )\n\t);\n\n\treturn {\n\t\tclassName,\n\t\tstyle,\n\t};\n}\n"],
+  "mappings": "AAGA,OAAO,UAAU;AAKjB,SAAS,eAAe,6BAA6B;AACrD,SAAS,kCAAkC;AAK3C,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AACjC,SAAS,cAAc;AAEvB,MAAM,EAAE,UAAU,IAAI,OAAQ,qBAAsB;AAgB7C,SAAS,8BAA+B,YAAY,UAAW;AACrE,MAAI,mBAAmB,YAAY,OAAO,cAAc,CAAC;AACzD,qBAAmB;AAAA,IAClB,GAAG;AAAA,IACH,UAAU;AAAA,MACT,EAAE,MAAM,YAAY,OAAO,YAAY,SAAS;AAAA,MAChD;AAAA,IACD;AAAA,EACD;AAEA,QAAM,QAAQ,gBAAiB,EAAE,YAAY,iBAAiB,CAAE;AAChE,QAAM,sBAAsB,CAAC,CAAE,YAAY,aACxC,OAAQ,UAAW,WAAW,UAAW,CAAE,iBAC3C;AACH,QAAM,qBAAqB,CAAC,CAAE,YAAY,OAAO,YAAY,YAC1D,kBAAmB,YAAY,OAAO,YAAY,SAAU,KAC5D;AACH,QAAM,YAAY;AAAA,IACjB;AAAA,IACA;AAAA,IACA,iBAAkB,YAAY,QAAS;AAAA,EACxC;AAEA,SAAO;AAAA,IACN;AAAA,IACA;AAAA,EACD;AACD;",
   "names": []
 }

package/build-module/utils/fit-text-utils.js

@@ -1,10 +1,9 @@
 function generateCSSRule(elementSelector, fontSize) {
   return `${elementSelector} { font-size: ${fontSize}px !important; }`;
 }
-function findOptimalFontSize(textElement, elementSelector, applyStylesFn) {
+function findOptimalFontSize(textElement, elementSelector, applyStylesFn, maxSize = 600) {
   const alreadyHasScrollableHeight = textElement.scrollHeight > textElement.clientHeight;
   let minSize = 5;
-  let maxSize = 600;
   let bestSize = minSize;
   while (minSize <= maxSize) {
     const midSize = Math.floor((minSize + maxSize) / 2);
@@ -20,7 +19,7 @@ function findOptimalFontSize(textElement, elementSelector, applyStylesFn) {
   }
   return bestSize;
 }
-function optimizeFitText(textElement, elementSelector, applyStylesFn) {
+function optimizeFitText(textElement, elementSelector, applyStylesFn, maxSize) {
   if (!textElement) {
     return;
   }
@@ -28,7 +27,8 @@ function optimizeFitText(textElement, elementSelector, applyStylesFn) {
   const optimalSize = findOptimalFontSize(
     textElement,
     elementSelector,
-    applyStylesFn
+    applyStylesFn,
+    maxSize
   );
   const cssRule = generateCSSRule(elementSelector, optimalSize);
   applyStylesFn(cssRule);

package/build-module/utils/fit-text-utils.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/utils/fit-text-utils.js"],
-  "sourcesContent": ["/**\n * Shared utility functions for fit text functionality.\n * Uses callback-based approach for maximum code reuse between editor and frontend.\n */\n\n/**\n * Generate CSS rule for single text element.\n *\n * @param {string} elementSelector CSS selector for the text element\n * @param {number} fontSize        Font size in pixels\n * @return {string} CSS rule string\n */\nfunction generateCSSRule( elementSelector, fontSize ) {\n\treturn `${ elementSelector } { font-size: ${ fontSize }px !important; }`;\n}\n\n/**\n * Find optimal font size using simple binary search between 5-600px.\n *\n * @param {HTMLElement} textElement     The text element\n * @param {string}      elementSelector CSS selector for the text element\n * @param {Function}    applyStylesFn   Function to apply test styles\n * @return {number} Optimal font size\n */\nfunction findOptimalFontSize( textElement, elementSelector, applyStylesFn ) {\n\tconst alreadyHasScrollableHeight =\n\t\ttextElement.scrollHeight > textElement.clientHeight;\n\tlet minSize = 5;\n\tlet maxSize = 600;\n\tlet bestSize = minSize;\n\n\twhile ( minSize <= maxSize ) {\n\t\tconst midSize = Math.floor( ( minSize + maxSize ) / 2 );\n\t\tapplyStylesFn( generateCSSRule( elementSelector, midSize ) );\n\n\t\tconst fitsWidth = textElement.scrollWidth <= textElement.clientWidth;\n\t\tconst fitsHeight =\n\t\t\talreadyHasScrollableHeight ||\n\t\t\ttextElement.scrollHeight <= textElement.clientHeight;\n\n\t\tif ( fitsWidth && fitsHeight ) {\n\t\t\tbestSize = midSize;\n\t\t\tminSize = midSize + 1;\n\t\t} else {\n\t\t\tmaxSize = midSize - 1;\n\t\t}\n\t}\n\n\treturn bestSize;\n}\n\n/**\n * Complete fit text optimization for a single text element.\n * Handles the full flow using callbacks for style management.\n *\n * @param {HTMLElement} textElement     The text element (paragraph, heading, etc.)\n * @param {string}      elementSelector CSS selector for the text element\n * @param {Function}    applyStylesFn   Function to apply CSS styles (pass empty string to clear)\n */\nexport function optimizeFitText( textElement, elementSelector, applyStylesFn ) {\n\tif ( ! textElement ) {\n\t\treturn;\n\t}\n\n\tapplyStylesFn( '' );\n\n\tconst optimalSize = findOptimalFontSize(\n\t\ttextElement,\n\t\telementSelector,\n\t\tapplyStylesFn\n\t);\n\n\tconst cssRule = generateCSSRule( elementSelector, optimalSize );\n\tapplyStylesFn( cssRule );\n}\n"],
-  "mappings": "AAYA,SAAS,gBAAiB,iBAAiB,UAAW;AACrD,SAAO,GAAI,eAAgB,iBAAkB,QAAS;AACvD;AAUA,SAAS,oBAAqB,aAAa,iBAAiB,eAAgB;AAC3E,QAAM,6BACL,YAAY,eAAe,YAAY;AACxC,MAAI,UAAU;AACd,MAAI,UAAU;AACd,MAAI,WAAW;AAEf,SAAQ,WAAW,SAAU;AAC5B,UAAM,UAAU,KAAK,OAAS,UAAU,WAAY,CAAE;AACtD,kBAAe,gBAAiB,iBAAiB,OAAQ,CAAE;AAE3D,UAAM,YAAY,YAAY,eAAe,YAAY;AACzD,UAAM,aACL,8BACA,YAAY,gBAAgB,YAAY;AAEzC,QAAK,aAAa,YAAa;AAC9B,iBAAW;AACX,gBAAU,UAAU;AAAA,IACrB,OAAO;AACN,gBAAU,UAAU;AAAA,IACrB;AAAA,EACD;AAEA,SAAO;AACR;AAUO,SAAS,gBAAiB,aAAa,iBAAiB,eAAgB;AAC9E,MAAK,CAAE,aAAc;AACpB;AAAA,EACD;AAEA,gBAAe,EAAG;AAElB,QAAM,cAAc;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAEA,QAAM,UAAU,gBAAiB,iBAAiB,WAAY;AAC9D,gBAAe,OAAQ;AACxB;",
+  "sourcesContent": ["/**\n * Shared utility functions for fit text functionality.\n * Uses callback-based approach for maximum code reuse between editor and frontend.\n */\n\n/**\n * Generate CSS rule for single text element.\n *\n * @param {string} elementSelector CSS selector for the text element\n * @param {number} fontSize        Font size in pixels\n * @return {string} CSS rule string\n */\nfunction generateCSSRule( elementSelector, fontSize ) {\n\treturn `${ elementSelector } { font-size: ${ fontSize }px !important; }`;\n}\n\n/**\n * Find optimal font size using simple binary search between 5-600px.\n *\n * @param {HTMLElement} textElement     The text element\n * @param {string}      elementSelector CSS selector for the text element\n * @param {Function}    applyStylesFn   Function to apply test styles\n * @param {number}      maxSize         Maximum font size in pixels (default: 600)\n * @return {number} Optimal font size\n */\nfunction findOptimalFontSize(\n\ttextElement,\n\telementSelector,\n\tapplyStylesFn,\n\tmaxSize = 600\n) {\n\tconst alreadyHasScrollableHeight =\n\t\ttextElement.scrollHeight > textElement.clientHeight;\n\tlet minSize = 5;\n\tlet bestSize = minSize;\n\n\twhile ( minSize <= maxSize ) {\n\t\tconst midSize = Math.floor( ( minSize + maxSize ) / 2 );\n\t\tapplyStylesFn( generateCSSRule( elementSelector, midSize ) );\n\n\t\tconst fitsWidth = textElement.scrollWidth <= textElement.clientWidth;\n\t\tconst fitsHeight =\n\t\t\talreadyHasScrollableHeight ||\n\t\t\ttextElement.scrollHeight <= textElement.clientHeight;\n\n\t\tif ( fitsWidth && fitsHeight ) {\n\t\t\tbestSize = midSize;\n\t\t\tminSize = midSize + 1;\n\t\t} else {\n\t\t\tmaxSize = midSize - 1;\n\t\t}\n\t}\n\n\treturn bestSize;\n}\n\n/**\n * Complete fit text optimization for a single text element.\n * Handles the full flow using callbacks for style management.\n *\n * @param {HTMLElement} textElement     The text element (paragraph, heading, etc.)\n * @param {string}      elementSelector CSS selector for the text element\n * @param {Function}    applyStylesFn   Function to apply CSS styles (pass empty string to clear)\n * @param {number}      maxSize         Maximum font size in pixels.\n */\nexport function optimizeFitText(\n\ttextElement,\n\telementSelector,\n\tapplyStylesFn,\n\tmaxSize\n) {\n\tif ( ! textElement ) {\n\t\treturn;\n\t}\n\n\tapplyStylesFn( '' );\n\n\tconst optimalSize = findOptimalFontSize(\n\t\ttextElement,\n\t\telementSelector,\n\t\tapplyStylesFn,\n\t\tmaxSize\n\t);\n\n\tconst cssRule = generateCSSRule( elementSelector, optimalSize );\n\tapplyStylesFn( cssRule );\n}\n"],
+  "mappings": "AAYA,SAAS,gBAAiB,iBAAiB,UAAW;AACrD,SAAO,GAAI,eAAgB,iBAAkB,QAAS;AACvD;AAWA,SAAS,oBACR,aACA,iBACA,eACA,UAAU,KACT;AACD,QAAM,6BACL,YAAY,eAAe,YAAY;AACxC,MAAI,UAAU;AACd,MAAI,WAAW;AAEf,SAAQ,WAAW,SAAU;AAC5B,UAAM,UAAU,KAAK,OAAS,UAAU,WAAY,CAAE;AACtD,kBAAe,gBAAiB,iBAAiB,OAAQ,CAAE;AAE3D,UAAM,YAAY,YAAY,eAAe,YAAY;AACzD,UAAM,aACL,8BACA,YAAY,gBAAgB,YAAY;AAEzC,QAAK,aAAa,YAAa;AAC9B,iBAAW;AACX,gBAAU,UAAU;AAAA,IACrB,OAAO;AACN,gBAAU,UAAU;AAAA,IACrB;AAAA,EACD;AAEA,SAAO;AACR;AAWO,SAAS,gBACf,aACA,iBACA,eACA,SACC;AACD,MAAK,CAAE,aAAc;AACpB;AAAA,EACD;AAEA,gBAAe,EAAG;AAElB,QAAM,cAAc;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAEA,QAAM,UAAU,gBAAiB,iBAAiB,WAAY;AAC9D,gBAAe,OAAQ;AACxB;",
   "names": []
 }

package/build-style/content-rtl.css

@@ -887,6 +887,10 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   padding: 0 2px;
 }
 
+.rich-text [contenteditable=false]::selection {
+  background-color: transparent;
+}
+
 .block-editor-warning {
   align-items: center;
   display: flex;

package/build-style/content.css

@@ -887,6 +887,10 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   padding: 0 2px;
 }
 
+.rich-text [contenteditable=false]::selection {
+  background-color: transparent;
+}
+
 .block-editor-warning {
   align-items: center;
   display: flex;

package/build-style/style-rtl.css

@@ -661,7 +661,7 @@ iframe[name=editor-canvas] {
 }
 
 .block-editor-block-card__title {
-  font-weight: 500;
+  font-weight: 499;
   display: flex;
   align-items: center;
   flex-wrap: wrap;
@@ -979,7 +979,7 @@ iframe[name=editor-canvas] {
   color: #757575;
   text-transform: uppercase;
   font-size: 11px;
-  font-weight: 500;
+  font-weight: 499;
 }
 
 .block-editor-block-patterns-list__list-item {
@@ -1132,6 +1132,10 @@ iframe[name=editor-canvas] {
   z-index: 1;
 }
 
+.block-editor-block-quick-navigation__item {
+  font-weight: 400;
+}
+
 .block-editor-block-rename-modal {
   z-index: 1000001;
 }
@@ -1267,7 +1271,7 @@ iframe[name=editor-canvas] {
   color: #757575;
   text-transform: uppercase;
   font-size: 11px;
-  font-weight: 500;
+  font-weight: 499;
 }
 
 .block-editor-block-contextual-toolbar .components-button.block-editor-block-switcher__no-switcher-icon {
@@ -3110,7 +3114,7 @@ iframe[name=editor-canvas] {
 }
 
 .block-editor-multi-selection-inspector__card-title {
-  font-weight: 500;
+  font-weight: 499;
 }
 
 .block-editor-multi-selection-inspector__card .block-editor-block-icon {
@@ -3917,7 +3921,7 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
   color: #757575;
   text-transform: uppercase;
   font-size: 11px;
-  font-weight: 500;
+  font-weight: 499;
 }
 
 .block-editor-inserter__panel-dropdown select.components-select-control__input.components-select-control__input.components-select-control__input {
@@ -4188,7 +4192,7 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
 }
 
 .components-heading.block-editor-inserter__patterns-category-panel-title {
-  font-weight: 500;
+  font-weight: 499;
 }
 
 .block-editor-inserter__patterns-explore-button.components-button,

package/build-style/style.css

@@ -661,7 +661,7 @@ iframe[name=editor-canvas] {
 }
 
 .block-editor-block-card__title {
-  font-weight: 500;
+  font-weight: 499;
   display: flex;
   align-items: center;
   flex-wrap: wrap;
@@ -979,7 +979,7 @@ iframe[name=editor-canvas] {
   color: #757575;
   text-transform: uppercase;
   font-size: 11px;
-  font-weight: 500;
+  font-weight: 499;
 }
 
 .block-editor-block-patterns-list__list-item {
@@ -1132,6 +1132,10 @@ iframe[name=editor-canvas] {
   z-index: 1;
 }
 
+.block-editor-block-quick-navigation__item {
+  font-weight: 400;
+}
+
 .block-editor-block-rename-modal {
   z-index: 1000001;
 }
@@ -1267,7 +1271,7 @@ iframe[name=editor-canvas] {
   color: #757575;
   text-transform: uppercase;
   font-size: 11px;
-  font-weight: 500;
+  font-weight: 499;
 }
 
 .block-editor-block-contextual-toolbar .components-button.block-editor-block-switcher__no-switcher-icon {
@@ -3112,7 +3116,7 @@ iframe[name=editor-canvas] {
 }
 
 .block-editor-multi-selection-inspector__card-title {
-  font-weight: 500;
+  font-weight: 499;
 }
 
 .block-editor-multi-selection-inspector__card .block-editor-block-icon {
@@ -3919,7 +3923,7 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
   color: #757575;
   text-transform: uppercase;
   font-size: 11px;
-  font-weight: 500;
+  font-weight: 499;
 }
 
 .block-editor-inserter__panel-dropdown select.components-select-control__input.components-select-control__input.components-select-control__input {
@@ -4190,7 +4194,7 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
 }
 
 .components-heading.block-editor-inserter__patterns-category-panel-title {
-  font-weight: 500;
+  font-weight: 499;
 }
 
 .block-editor-inserter__patterns-explore-button.components-button,