npm - @wordpress/block-editor - Versions diffs - 11.7.0 → 12.0.0 - Mend

@wordpress/block-editor 11.7.0 → 12.0.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 (357) hide show

package/build/hooks/anchor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/block-editor/src/hooks/anchor.js"],"names":["ANCHOR_REGEX","ANCHOR_SCHEMA","type","source","attribute","selector","addAttribute","settings","attributes","anchor","withInspectorControl","BlockEdit","props","hasAnchor","name","isSelected","isWeb","Platform","OS","textControl","nextValue","replace","setAttributes","addSaveProps","extraProps","blockType","id"],"mappings":";;;;;;;;;AAQA;;AALA;;AACA;;AACA;;AACA;;AACA;;AAMA;;AAbA;AACA;AACA;;AAQA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA,MAAMA,YAAY,GAAG,QAArB;AAEA,MAAMC,aAAa,GAAG;AACrBC,EAAAA,IAAI,EAAE,QADe;AAErBC,EAAAA,MAAM,EAAE,WAFa;AAGrBC,EAAAA,SAAS,EAAE,IAHU;AAIrBC,EAAAA,QAAQ,EAAE;AAJW,CAAtB;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,YAAT,CAAuBC,QAAvB,EAAkC;AAAA;;AACxC;AACA,MAAK,4DAAYA,QAAQ,CAACC,UAArB,yDAAY,qBAAqBC,MAAjC,yEAA2C,EAA3C,CAAL,EAAuD;AACtD,WAAOF,QAAP;AACA;;AACD,MAAK,6BAAiBA,QAAjB,EAA2B,QAA3B,CAAL,EAA6C;AAC5C;AACAA,IAAAA,QAAQ,CAACC,UAAT,GAAsB,EACrB,GAAGD,QAAQ,CAACC,UADS;AAErBC,MAAAA,MAAM,EAAER;AAFa,KAAtB;AAIA;;AAED,SAAOM,QAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMG,oBAAoB,GAAG,yCACjCC,SAAF,IAAiB;AAChB,SAASC,KAAF,IAAa;AACnB,UAAMC,SAAS,GAAG,6BAAiBD,KAAK,CAACE,IAAvB,EAA6B,QAA7B,CAAlB;;AAEA,QAAKD,SAAS,IAAID,KAAK,CAACG,UAAxB,EAAqC;AACpC,YAAMC,KAAK,GAAGC,kBAASC,EAAT,KAAgB,KAA9B;AACA,YAAMC,WAAW,GAChB,4BAAC,uBAAD;AACC,QAAA,uBAAuB,MADxB;AAEC,QAAA,SAAS,EAAC,qBAFX;AAGC,QAAA,KAAK,EAAG,cAAI,aAAJ,CAHT;AAIC,QAAA,IAAI,EACH,qDACG,cACD,kLADC,CADH,EAKGH,KAAK,IACN,4BAAC,wBAAD;AACC,UAAA,IAAI,EAAG,cACN,~~mDADM~~;AADR,WAKG,cAAI,0BAAJ,CALH,CANF,CALF;AAqBC,QAAA,KAAK,EAAGJ,KAAK,CAACJ,UAAN,CAAiBC,MAAjB,IAA2B,EArBpC;AAsBC,QAAA,WAAW,EAAG,CAAEO,KAAF,GAAU,cAAI,eAAJ,CAAV,GAAkC,IAtBjD;AAuBC,QAAA,QAAQ,EAAKI,SAAF,IAAiB;AAC3BA,UAAAA,SAAS,GAAGA,SAAS,CAACC,OAAV,CAAmBrB,YAAnB,EAAiC,GAAjC,CAAZ;AACAY,UAAAA,KAAK,CAACU,aAAN,CAAqB;AACpBb,YAAAA,MAAM,EAAEW;AADY,WAArB;AAGA,SA5BF;AA6BC,QAAA,cAAc,EAAC,MA7BhB;AA8BC,QAAA,YAAY,EAAC;AA9Bd,QADD;AAmCA,aACC,qDACC,4BAAC,SAAD,EAAgBR,KAAhB,CADD,EAEGI,KAAK,IACN,4BAAC,8BAAD;AAAmB,QAAA,KAAK,EAAC;AAAzB,SACGG,WADH,CAHF,EAaG,CAAEH,KAAF,IAAWJ,KAAK,CAACE,IAAN,KAAe,cAA1B,IACD,4BAAC,8BAAD,QACC,4BAAC,qBAAD;AAAW,QAAA,KAAK,EAAG,cAAI,kBAAJ;AAAnB,SACGK,WADH,CADD,CAdF,CADD;AAuBA;;AAED,WAAO,4BAAC,SAAD,EAAgBP,KAAhB,CAAP;AACA,GAlED;AAmEA,CArEkC,EAsEnC,sBAtEmC,CAA7B;AAyEP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AACO,SAASW,YAAT,CAAuBC,UAAvB,EAAmCC,SAAnC,EAA8CjB,UAA9C,EAA2D;AACjE,MAAK,6BAAiBiB,SAAjB,EAA4B,QAA5B,CAAL,EAA8C;AAC7CD,IAAAA,UAAU,CAACE,EAAX,GAAgBlB,UAAU,CAACC,MAAX,KAAsB,EAAtB,GAA2B,IAA3B,GAAkCD,UAAU,CAACC,MAA7D;AACA;;AAED,SAAOe,UAAP;AACA;;AAED,sBAAW,0BAAX,EAAuC,uBAAvC,EAAgElB,YAAhE;AACA,sBACC,kBADD,EAEC,2CAFD,EAGCI,oBAHD;AAKA,sBACC,kCADD,EAEC,wBAFD,EAGCa,YAHD","sourcesContent":["/*\n WordPress dependencies\n /\nimport { addFilter } from '@wordpress/hooks';\nimport { PanelBody, TextControl, ExternalLink } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { hasBlockSupport } from '@wordpress/blocks';\nimport { createHigherOrderComponent } from '@wordpress/compose';\nimport { Platform } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { InspectorControls } from '../components';\n\n/\n Regular expression matching invalid anchor characters for replacement.\n \n @type {RegExp}\n /\nconst ANCHOR_REGEX = /[\\s#]/g;\n\nconst ANCHOR_SCHEMA = {\n\ttype: 'string',\n\tsource: 'attribute',\n\tattribute: 'id',\n\tselector: '',\n};\n\n/*\n Filters registered block settings, extending attributes with anchor using ID\n * of the first node.\n \n @param {Object} settings Original block settings.\n \n @return {Object} Filtered block settings.\n /\nexport function addAttribute( settings ) {\n\t// Allow blocks to specify their own attribute definition with default values if needed.\n\tif ( 'type' in ( settings.attributes?.anchor ?? {} ) ) {\n\t\treturn settings;\n\t}\n\tif ( hasBlockSupport( settings, 'anchor' ) ) {\n\t\t// Gracefully handle if settings.attributes is undefined.\n\t\tsettings.attributes = {\n\t\t\t...settings.attributes,\n\t\t\tanchor: ANCHOR_SCHEMA,\n\t\t};\n\t}\n\n\treturn settings;\n}\n\n/\n Override the default edit UI to include a new block inspector control for\n * assigning the anchor ID, if block supports anchor.\n \n @param {WPComponent} BlockEdit Original component.\n \n @return {WPComponent} Wrapped component.\n /\nexport const withInspectorControl = createHigherOrderComponent(\n\t( BlockEdit ) => {\n\t\treturn ( props ) => {\n\t\t\tconst hasAnchor = hasBlockSupport( props.name, 'anchor' );\n\n\t\t\tif ( hasAnchor && props.isSelected ) {\n\t\t\t\tconst isWeb = Platform.OS === 'web';\n\t\t\t\tconst textControl = (\n\t\t\t\t\t<TextControl\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tclassName=\"html-anchor-control\"\n\t\t\t\t\t\tlabel={ __( 'HTML anchor' ) }\n\t\t\t\t\t\thelp={\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t'Enter a word or two — without spaces — to make a unique web address just for this block, called an “anchor.” Then, you’ll be able to link directly to this section of your page.'\n\t\t\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t\t\t{ isWeb && (\n\t\t\t\t\t\t\t\t\t<ExternalLink\n\t\t\t\t\t\t\t\t\t\thref={ __(\n\t\t\t\t\t\t\t\t\t\t\t'https://wordpress.org/~~support~~/article/page-jumps/'\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Learn more about anchors' ) }\n\t\t\t\t\t\t\t\t\t</ExternalLink>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvalue={ props.attributes.anchor \|\| '' }\n\t\t\t\t\t\tplaceholder={ ! isWeb ? __( 'Add an anchor' ) : null }\n\t\t\t\t\t\tonChange={ ( nextValue ) => {\n\t\t\t\t\t\t\tnextValue = nextValue.replace( ANCHOR_REGEX, '-' );\n\t\t\t\t\t\t\tprops.setAttributes( {\n\t\t\t\t\t\t\t\tanchor: nextValue,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tautoCapitalize=\"none\"\n\t\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\t/>\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<BlockEdit { ...props } />\n\t\t\t\t\t\t{ isWeb && (\n\t\t\t\t\t\t\t<InspectorControls group=\"advanced\">\n\t\t\t\t\t\t\t\t{ textControl }\n\t\t\t\t\t\t\t</InspectorControls>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ /\n\t\t\t\t\t\t * We plan to remove scoping anchors to 'core/heading' to support\n\t\t\t\t\t\t * anchors for all eligble blocks. Additionally we plan to explore\n\t\t\t\t\t\t * leveraging InspectorAdvancedControls instead of a custom\n\t\t\t\t\t\t * PanelBody title. https://github.com/WordPress/gutenberg/issues/28363\n\t\t\t\t\t\t / }\n\t\t\t\t\t\t{ ! isWeb && props.name === 'core/heading' && (\n\t\t\t\t\t\t\t<InspectorControls>\n\t\t\t\t\t\t\t\t<PanelBody title={ __( 'Heading settings' ) }>\n\t\t\t\t\t\t\t\t\t{ textControl }\n\t\t\t\t\t\t\t\t</PanelBody>\n\t\t\t\t\t\t\t</InspectorControls>\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 <BlockEdit { ...props } />;\n\t\t};\n\t},\n\t'withInspectorControl'\n);\n\n/\n Override props assigned to save component to inject anchor ID, if block\n * supports anchor. This is only applied if the block's save result is an\n * element and not a markup string.\n \n @param {Object} extraProps Additional props applied to save element.\n * @param {Object} blockType Block type.\n * @param {Object} attributes Current block attributes.\n \n @return {Object} Filtered props applied to save element.\n */\nexport function addSaveProps( extraProps, blockType, attributes ) {\n\tif ( hasBlockSupport( blockType, 'anchor' ) ) {\n\t\textraProps.id = attributes.anchor === '' ? null : attributes.anchor;\n\t}\n\n\treturn extraProps;\n}\n\naddFilter( 'blocks.registerBlockType', 'core/anchor/attribute', addAttribute );\naddFilter(\n\t'editor.BlockEdit',\n\t'core/editor/anchor/with-inspector-control',\n\twithInspectorControl\n);\naddFilter(\n\t'blocks.getSaveContent.extraProps',\n\t'core/anchor/save-props',\n\taddSaveProps\n);\n"]}
1	+ {"version":3,"sources":["@wordpress/block-editor/src/hooks/anchor.js"],"names":["ANCHOR_REGEX","ANCHOR_SCHEMA","type","source","attribute","selector","addAttribute","settings","attributes","anchor","withInspectorControl","BlockEdit","props","hasAnchor","name","isSelected","isWeb","Platform","OS","textControl","nextValue","replace","setAttributes","addSaveProps","extraProps","blockType","id"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport { addFilter } from '@wordpress/hooks';\nimport { PanelBody, TextControl, ExternalLink } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { hasBlockSupport } from '@wordpress/blocks';\nimport { createHigherOrderComponent } from '@wordpress/compose';\nimport { Platform } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { InspectorControls } from '../components';\n\n/\n Regular expression matching invalid anchor characters for replacement.\n \n @type {RegExp}\n /\nconst ANCHOR_REGEX = /[\\s#]/g;\n\nconst ANCHOR_SCHEMA = {\n\ttype: 'string',\n\tsource: 'attribute',\n\tattribute: 'id',\n\tselector: '',\n};\n\n/*\n Filters registered block settings, extending attributes with anchor using ID\n * of the first node.\n \n @param {Object} settings Original block settings.\n \n @return {Object} Filtered block settings.\n /\nexport function addAttribute( settings ) {\n\t// Allow blocks to specify their own attribute definition with default values if needed.\n\tif ( 'type' in ( settings.attributes?.anchor ?? {} ) ) {\n\t\treturn settings;\n\t}\n\tif ( hasBlockSupport( settings, 'anchor' ) ) {\n\t\t// Gracefully handle if settings.attributes is undefined.\n\t\tsettings.attributes = {\n\t\t\t...settings.attributes,\n\t\t\tanchor: ANCHOR_SCHEMA,\n\t\t};\n\t}\n\n\treturn settings;\n}\n\n/\n Override the default edit UI to include a new block inspector control for\n * assigning the anchor ID, if block supports anchor.\n \n @param {WPComponent} BlockEdit Original component.\n \n @return {WPComponent} Wrapped component.\n /\nexport const withInspectorControl = createHigherOrderComponent(\n\t( BlockEdit ) => {\n\t\treturn ( props ) => {\n\t\t\tconst hasAnchor = hasBlockSupport( props.name, 'anchor' );\n\n\t\t\tif ( hasAnchor && props.isSelected ) {\n\t\t\t\tconst isWeb = Platform.OS === 'web';\n\t\t\t\tconst textControl = (\n\t\t\t\t\t<TextControl\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tclassName=\"html-anchor-control\"\n\t\t\t\t\t\tlabel={ __( 'HTML anchor' ) }\n\t\t\t\t\t\thelp={\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t'Enter a word or two — without spaces — to make a unique web address just for this block, called an “anchor.” Then, you’ll be able to link directly to this section of your page.'\n\t\t\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t\t\t{ isWeb && (\n\t\t\t\t\t\t\t\t\t<ExternalLink\n\t\t\t\t\t\t\t\t\t\thref={ __(\n\t\t\t\t\t\t\t\t\t\t\t'https://wordpress.org/documentation/article/page-jumps/'\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Learn more about anchors' ) }\n\t\t\t\t\t\t\t\t\t</ExternalLink>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvalue={ props.attributes.anchor \|\| '' }\n\t\t\t\t\t\tplaceholder={ ! isWeb ? __( 'Add an anchor' ) : null }\n\t\t\t\t\t\tonChange={ ( nextValue ) => {\n\t\t\t\t\t\t\tnextValue = nextValue.replace( ANCHOR_REGEX, '-' );\n\t\t\t\t\t\t\tprops.setAttributes( {\n\t\t\t\t\t\t\t\tanchor: nextValue,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tautoCapitalize=\"none\"\n\t\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\t/>\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<BlockEdit { ...props } />\n\t\t\t\t\t\t{ isWeb && (\n\t\t\t\t\t\t\t<InspectorControls group=\"advanced\">\n\t\t\t\t\t\t\t\t{ textControl }\n\t\t\t\t\t\t\t</InspectorControls>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ /\n\t\t\t\t\t\t * We plan to remove scoping anchors to 'core/heading' to support\n\t\t\t\t\t\t * anchors for all eligble blocks. Additionally we plan to explore\n\t\t\t\t\t\t * leveraging InspectorAdvancedControls instead of a custom\n\t\t\t\t\t\t * PanelBody title. https://github.com/WordPress/gutenberg/issues/28363\n\t\t\t\t\t\t / }\n\t\t\t\t\t\t{ ! isWeb && props.name === 'core/heading' && (\n\t\t\t\t\t\t\t<InspectorControls>\n\t\t\t\t\t\t\t\t<PanelBody title={ __( 'Heading settings' ) }>\n\t\t\t\t\t\t\t\t\t{ textControl }\n\t\t\t\t\t\t\t\t</PanelBody>\n\t\t\t\t\t\t\t</InspectorControls>\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 <BlockEdit { ...props } />;\n\t\t};\n\t},\n\t'withInspectorControl'\n);\n\n/\n Override props assigned to save component to inject anchor ID, if block\n * supports anchor. This is only applied if the block's save result is an\n * element and not a markup string.\n \n @param {Object} extraProps Additional props applied to save element.\n * @param {Object} blockType Block type.\n * @param {Object} attributes Current block attributes.\n \n @return {Object} Filtered props applied to save element.\n */\nexport function addSaveProps( extraProps, blockType, attributes ) {\n\tif ( hasBlockSupport( blockType, 'anchor' ) ) {\n\t\textraProps.id = attributes.anchor === '' ? null : attributes.anchor;\n\t}\n\n\treturn extraProps;\n}\n\naddFilter( 'blocks.registerBlockType', 'core/anchor/attribute', addAttribute );\naddFilter(\n\t'editor.BlockEdit',\n\t'core/editor/anchor/with-inspector-control',\n\twithInspectorControl\n);\naddFilter(\n\t'blocks.getSaveContent.extraProps',\n\t'core/anchor/save-props',\n\taddSaveProps\n);\n"]}

package/build/hooks/border.js CHANGED Viewed

@@ -117,7 +117,7 @@ function styleToAttributes(style) {
   }
   const borderColorValue = style === null || style === void 0 ? void 0 : (_style$border = style.border) === null || _style$border === void 0 ? void 0 : _style$border.color;
-  const borderColorSlug = borderColorValue !== null && borderColorValue !== void 0 && borderColorValue.startsWith('var:preset|color|') ? borderColorSlug.substring('var:preset|color|'.length) : undefined;
+  const borderColorSlug = borderColorValue !== null && borderColorValue !== void 0 && borderColorValue.startsWith('var:preset|color|') ? borderColorValue.substring('var:preset|color|'.length) : undefined;
   const updatedStyle = { ...style
   };
   updatedStyle.border = { ...updatedStyle.border,

package/build/hooks/border.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/block-editor/src/hooks/border.js"],"names":["BORDER_SUPPORT_KEY","getColorByProperty","colors","property","value","matchedColor","some","origin","color","getMultiOriginColor","namedColor","customColor","colorObject","undefined","getColorSlugFromVariable","exec","styleToAttributes","style","border","borderColor","borderColorValue","borderColorSlug","startsWith","substring","length","updatedStyle","attributesToStyle","attributes","BordersInspectorControl","children","resetAllFilter","attributesResetAllFilter","existingStyle","BorderPanel","props","clientId","name","setAttributes","settings","isEnabled","onChange","newStyle","defaultControls","hasBorderSupport","blockName","feature","Platform","OS","support","radius","width","removeBorderAttribute","attribute","addAttributes","type","addSaveProps","blockType","borderClasses","getBorderClasses","newClassName","className","borderColorClass","addEditProps","existingGetEditWrapperProps","getEditWrapperProps","withBorderColorPaletteStyles","BlockListBlock","borderTopColor","top","borderRightColor","right","borderBottomColor","bottom","borderLeftColor","left","extraStyles","wrapperProps"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { getBlockSupport } from '@wordpress/blocks';\nimport { __experimentalHasSplitBorders as hasSplitBorders } from '@wordpress/components';\nimport { createHigherOrderComponent } from '@wordpress/compose';\nimport { Platform, useCallback, useMemo } from '@wordpress/element';\nimport { addFilter } from '@wordpress/hooks';\n\n/\n Internal dependencies\n /\nimport { getColorClassName } from '../components/colors';\nimport InspectorControls from '../components/inspector-controls';\nimport useMultipleOriginColorsAndGradients from '../components/colors-gradients/use-multiple-origin-colors-and-gradients';\nimport {\n\tcleanEmptyObject,\n\tshouldSkipSerialization,\n\tuseBlockSettings,\n} from './utils';\nimport {\n\tuseHasBorderPanel,\n\tBorderPanel as StylesBorderPanel,\n} from '../components/global-styles';\n\nexport const BORDER_SUPPORT_KEY = '__experimentalBorder';\n\nconst getColorByProperty = ( colors, property, value ) => {\n\tlet matchedColor;\n\n\tcolors.some( ( origin ) =>\n\t\torigin.colors.some( ( color ) => {\n\t\t\tif ( color[ property ] === value ) {\n\t\t\t\tmatchedColor = color;\n\t\t\t\treturn true;\n\t\t\t}\n\n\t\t\treturn false;\n\t\t} )\n\t);\n\n\treturn matchedColor;\n};\n\nexport const getMultiOriginColor = ( { colors, namedColor, customColor } ) => {\n\t// Search each origin (default, theme, or user) for matching color by name.\n\tif ( namedColor ) {\n\t\tconst colorObject = getColorByProperty( colors, 'slug', namedColor );\n\t\tif ( colorObject ) {\n\t\t\treturn colorObject;\n\t\t}\n\t}\n\n\t// Skip if no custom color or matching named color.\n\tif ( ! customColor ) {\n\t\treturn { color: undefined };\n\t}\n\n\t// Attempt to find color via custom color value or build new object.\n\tconst colorObject = getColorByProperty( colors, 'color', customColor );\n\treturn colorObject ? colorObject : { color: customColor };\n};\n\nfunction getColorSlugFromVariable( value ) {\n\tconst namedColor = /var:preset\\\|color\\\|(.+)/.exec( value );\n\tif ( namedColor && namedColor[ 1 ] ) {\n\t\treturn namedColor[ 1 ];\n\t}\n\treturn null;\n}\n\nfunction styleToAttributes( style ) {\n\tif ( hasSplitBorders( style?.border ) ) {\n\t\treturn {\n\t\t\tstyle,\n\t\t\tborderColor: undefined,\n\t\t};\n\t}\n\n\tconst borderColorValue = style?.border?.color;\n\tconst borderColorSlug = borderColorValue?.startsWith( 'var:preset\|color\|' )\n\t\t? borderColorSlug.substring( 'var:preset\|color\|'.length )\n\t\t: undefined;\n\tconst updatedStyle = { ...style };\n\tupdatedStyle.border = {\n\t\t...updatedStyle.border,\n\t\tcolor: borderColorSlug ? undefined : borderColorValue,\n\t};\n\treturn {\n\t\tstyle: cleanEmptyObject( updatedStyle ),\n\t\tborderColor: borderColorSlug,\n\t};\n}\n\nfunction attributesToStyle( attributes ) {\n\tif ( hasSplitBorders( attributes.style?.border ) ) {\n\t\treturn attributes.style;\n\t}\n\treturn {\n\t\t...attributes.style,\n\t\tborder: {\n\t\t\t...attributes.style?.border,\n\t\t\tcolor: attributes.borderColor\n\t\t\t\t? 'var:preset\|color\|' + attributes.borderColor\n\t\t\t\t: attributes.style?.border?.color,\n\t\t},\n\t};\n}\n\nfunction BordersInspectorControl( { children, resetAllFilter } ) {\n\tconst attributesResetAllFilter = useCallback(\n\t\t( attributes ) => {\n\t\t\tconst existingStyle = attributesToStyle( attributes );\n\t\t\tconst updatedStyle = resetAllFilter( existingStyle );\n\t\t\treturn {\n\t\t\t\t...attributes,\n\t\t\t\t...styleToAttributes( updatedStyle ),\n\t\t\t};\n\t\t},\n\t\t[ resetAllFilter ]\n\t);\n\n\treturn (\n\t\t<InspectorControls\n\t\t\tgroup=\"border\"\n\t\t\tresetAllFilter={ attributesResetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</InspectorControls>\n\t);\n}\n\nexport function BorderPanel( props ) {\n\tconst { clientId, name, attributes, setAttributes } = props;\n\tconst settings = useBlockSettings( name );\n\tconst isEnabled = useHasBorderPanel( settings );\n\tconst value = useMemo( () => {\n\t\treturn attributesToStyle( {\n\t\t\tstyle: attributes.style,\n\t\t\tborderColor: attributes.borderColor,\n\t\t} );\n\t}, [ attributes.style, attributes.borderColor ] );\n\n\tconst onChange = ( newStyle ) => {\n\t\tsetAttributes( styleToAttributes( newStyle ) );\n\t};\n\n\tif ( ! isEnabled ) {\n\t\treturn null;\n\t}\n\n\tconst defaultControls = getBlockSupport( props.name, [\n\t\tBORDER_SUPPORT_KEY,\n\t\t'__experimentalDefaultControls',\n\t] );\n\n\treturn (\n\t\t<StylesBorderPanel\n\t\t\tas={ BordersInspectorControl }\n\t\t\tpanelId={ clientId }\n\t\t\tsettings={ settings }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tdefaultControls={ defaultControls }\n\t\t/>\n\t);\n}\n\n/\n Determine whether there is block support for border properties.\n \n @param {string} blockName Block name.\n * @param {string} feature Border feature to check support for.\n \n @return {boolean} Whether there is support.\n /\nexport function hasBorderSupport( blockName, feature = 'any' ) {\n\tif ( Platform.OS !== 'web' ) {\n\t\treturn false;\n\t}\n\n\tconst support = getBlockSupport( blockName, BORDER_SUPPORT_KEY );\n\n\tif ( support === true ) {\n\t\treturn true;\n\t}\n\n\tif ( feature === 'any' ) {\n\t\treturn !! (\n\t\t\tsupport?.color \|\|\n\t\t\tsupport?.radius \|\|\n\t\t\tsupport?.width \|\|\n\t\t\tsupport?.style\n\t\t);\n\t}\n\n\treturn !! support?.[ feature ];\n}\n\n/\n Returns a new style object where the specified border attribute has been\n * removed.\n \n @param {Object} style Styles from block attributes.\n * @param {string} attribute The border style attribute to clear.\n \n @return {Object} Style object with the specified attribute removed.\n /\nexport function removeBorderAttribute( style, attribute ) {\n\treturn cleanEmptyObject( {\n\t\t...style,\n\t\tborder: {\n\t\t\t...style?.border,\n\t\t\t[ attribute ]: undefined,\n\t\t},\n\t} );\n}\n\n/\n Filters registered block settings, extending attributes to include\n * `borderColor` if needed.\n \n @param {Object} settings Original block settings.\n \n @return {Object} Updated block settings.\n /\nfunction addAttributes( settings ) {\n\tif ( ! hasBorderSupport( settings, 'color' ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify default value if needed.\n\tif ( settings.attributes.borderColor ) {\n\t\treturn settings;\n\t}\n\n\t// Add new borderColor attribute to block settings.\n\treturn {\n\t\t...settings,\n\t\tattributes: {\n\t\t\t...settings.attributes,\n\t\t\tborderColor: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t},\n\t};\n}\n\n/\n Override props assigned to save component to inject border color.\n \n @param {Object} props Additional props applied to save element.\n * @param {Object} blockType Block type definition.\n * @param {Object} attributes Block's attributes.\n \n @return {Object} Filtered props to apply to save element.\n /\nfunction addSaveProps( props, blockType, attributes ) {\n\tif (\n\t\t! hasBorderSupport( blockType, 'color' ) \|\|\n\t\tshouldSkipSerialization( blockType, BORDER_SUPPORT_KEY, 'color' )\n\t) {\n\t\treturn props;\n\t}\n\n\tconst borderClasses = getBorderClasses( attributes );\n\tconst newClassName = classnames( props.className, borderClasses );\n\n\t// If we are clearing the last of the previous classes in `className`\n\t// set it to `undefined` to avoid rendering empty DOM attributes.\n\tprops.className = newClassName ? newClassName : undefined;\n\n\treturn props;\n}\n\n/\n Generates a CSS class name consisting of all the applicable border color\n * classes given the current block attributes.\n \n @param {Object} attributes Block's attributes.\n \n @return {string} CSS class name.\n /\nexport function getBorderClasses( attributes ) {\n\tconst { borderColor, style } = attributes;\n\tconst borderColorClass = getColorClassName( 'border-color', borderColor );\n\n\treturn classnames( {\n\t\t'has-border-color': borderColor \|\| style?.border?.color,\n\t\t[ borderColorClass ]: !! borderColorClass,\n\t} );\n}\n\n/\n Filters the registered block settings to apply border color styles and\n * classnames to the block edit wrapper.\n \n @param {Object} settings Original block settings.\n \n @return {Object} Filtered block settings.\n /\nfunction addEditProps( settings ) {\n\tif (\n\t\t! hasBorderSupport( settings, 'color' ) \|\|\n\t\tshouldSkipSerialization( settings, BORDER_SUPPORT_KEY, 'color' )\n\t) {\n\t\treturn settings;\n\t}\n\n\tconst existingGetEditWrapperProps = settings.getEditWrapperProps;\n\tsettings.getEditWrapperProps = ( attributes ) => {\n\t\tlet props = {};\n\n\t\tif ( existingGetEditWrapperProps ) {\n\t\t\tprops = existingGetEditWrapperProps( attributes );\n\t\t}\n\n\t\treturn addSaveProps( props, settings, attributes );\n\t};\n\n\treturn settings;\n}\n\n/\n This adds inline styles for color palette colors.\n * Ideally, this is not needed and themes should load their palettes on the editor.\n \n @param {Function} BlockListBlock Original component.\n \n @return {Function} Wrapped component.\n */\nexport const withBorderColorPaletteStyles = createHigherOrderComponent(\n\t( BlockListBlock ) => ( props ) => {\n\t\tconst { name, attributes } = props;\n\t\tconst { borderColor, style } = attributes;\n\t\tconst { colors } = useMultipleOriginColorsAndGradients();\n\n\t\tif (\n\t\t\t! hasBorderSupport( name, 'color' ) \|\|\n\t\t\tshouldSkipSerialization( name, BORDER_SUPPORT_KEY, 'color' )\n\t\t) {\n\t\t\treturn <BlockListBlock { ...props } />;\n\t\t}\n\n\t\tconst { color: borderColorValue } = getMultiOriginColor( {\n\t\t\tcolors,\n\t\t\tnamedColor: borderColor,\n\t\t} );\n\t\tconst { color: borderTopColor } = getMultiOriginColor( {\n\t\t\tcolors,\n\t\t\tnamedColor: getColorSlugFromVariable( style?.border?.top?.color ),\n\t\t} );\n\t\tconst { color: borderRightColor } = getMultiOriginColor( {\n\t\t\tcolors,\n\t\t\tnamedColor: getColorSlugFromVariable( style?.border?.right?.color ),\n\t\t} );\n\n\t\tconst { color: borderBottomColor } = getMultiOriginColor( {\n\t\t\tcolors,\n\t\t\tnamedColor: getColorSlugFromVariable(\n\t\t\t\tstyle?.border?.bottom?.color\n\t\t\t),\n\t\t} );\n\t\tconst { color: borderLeftColor } = getMultiOriginColor( {\n\t\t\tcolors,\n\t\t\tnamedColor: getColorSlugFromVariable( style?.border?.left?.color ),\n\t\t} );\n\n\t\tconst extraStyles = {\n\t\t\tborderTopColor: borderTopColor \|\| borderColorValue,\n\t\t\tborderRightColor: borderRightColor \|\| borderColorValue,\n\t\t\tborderBottomColor: borderBottomColor \|\| borderColorValue,\n\t\t\tborderLeftColor: borderLeftColor \|\| borderColorValue,\n\t\t};\n\n\t\tlet wrapperProps = props.wrapperProps;\n\t\twrapperProps = {\n\t\t\t...props.wrapperProps,\n\t\t\tstyle: {\n\t\t\t\t...props.wrapperProps?.style,\n\t\t\t\t...extraStyles,\n\t\t\t},\n\t\t};\n\n\t\treturn <BlockListBlock { ...props } wrapperProps={ wrapperProps } />;\n\t}\n);\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/border/addAttributes',\n\taddAttributes\n);\n\naddFilter(\n\t'blocks.getSaveContent.extraProps',\n\t'core/border/addSaveProps',\n\taddSaveProps\n);\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/border/addEditProps',\n\taddEditProps\n);\n\naddFilter(\n\t'editor.BlockListBlock',\n\t'core/border/with-border-color-palette-styles',\n\twithBorderColorPaletteStyles\n);\n"]}
1	+ {"version":3,"sources":["@wordpress/block-editor/src/hooks/border.js"],"names":["BORDER_SUPPORT_KEY","getColorByProperty","colors","property","value","matchedColor","some","origin","color","getMultiOriginColor","namedColor","customColor","colorObject","undefined","getColorSlugFromVariable","exec","styleToAttributes","style","border","borderColor","borderColorValue","borderColorSlug","startsWith","substring","length","updatedStyle","attributesToStyle","attributes","BordersInspectorControl","children","resetAllFilter","attributesResetAllFilter","existingStyle","BorderPanel","props","clientId","name","setAttributes","settings","isEnabled","onChange","newStyle","defaultControls","hasBorderSupport","blockName","feature","Platform","OS","support","radius","width","removeBorderAttribute","attribute","addAttributes","type","addSaveProps","blockType","borderClasses","getBorderClasses","newClassName","className","borderColorClass","addEditProps","existingGetEditWrapperProps","getEditWrapperProps","withBorderColorPaletteStyles","BlockListBlock","borderTopColor","top","borderRightColor","right","borderBottomColor","bottom","borderLeftColor","left","extraStyles","wrapperProps"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { getBlockSupport } from '@wordpress/blocks';\nimport { __experimentalHasSplitBorders as hasSplitBorders } from '@wordpress/components';\nimport { createHigherOrderComponent } from '@wordpress/compose';\nimport { Platform, useCallback, useMemo } from '@wordpress/element';\nimport { addFilter } from '@wordpress/hooks';\n\n/\n Internal dependencies\n /\nimport { getColorClassName } from '../components/colors';\nimport InspectorControls from '../components/inspector-controls';\nimport useMultipleOriginColorsAndGradients from '../components/colors-gradients/use-multiple-origin-colors-and-gradients';\nimport {\n\tcleanEmptyObject,\n\tshouldSkipSerialization,\n\tuseBlockSettings,\n} from './utils';\nimport {\n\tuseHasBorderPanel,\n\tBorderPanel as StylesBorderPanel,\n} from '../components/global-styles';\n\nexport const BORDER_SUPPORT_KEY = '__experimentalBorder';\n\nconst getColorByProperty = ( colors, property, value ) => {\n\tlet matchedColor;\n\n\tcolors.some( ( origin ) =>\n\t\torigin.colors.some( ( color ) => {\n\t\t\tif ( color[ property ] === value ) {\n\t\t\t\tmatchedColor = color;\n\t\t\t\treturn true;\n\t\t\t}\n\n\t\t\treturn false;\n\t\t} )\n\t);\n\n\treturn matchedColor;\n};\n\nexport const getMultiOriginColor = ( { colors, namedColor, customColor } ) => {\n\t// Search each origin (default, theme, or user) for matching color by name.\n\tif ( namedColor ) {\n\t\tconst colorObject = getColorByProperty( colors, 'slug', namedColor );\n\t\tif ( colorObject ) {\n\t\t\treturn colorObject;\n\t\t}\n\t}\n\n\t// Skip if no custom color or matching named color.\n\tif ( ! customColor ) {\n\t\treturn { color: undefined };\n\t}\n\n\t// Attempt to find color via custom color value or build new object.\n\tconst colorObject = getColorByProperty( colors, 'color', customColor );\n\treturn colorObject ? colorObject : { color: customColor };\n};\n\nfunction getColorSlugFromVariable( value ) {\n\tconst namedColor = /var:preset\\\|color\\\|(.+)/.exec( value );\n\tif ( namedColor && namedColor[ 1 ] ) {\n\t\treturn namedColor[ 1 ];\n\t}\n\treturn null;\n}\n\nfunction styleToAttributes( style ) {\n\tif ( hasSplitBorders( style?.border ) ) {\n\t\treturn {\n\t\t\tstyle,\n\t\t\tborderColor: undefined,\n\t\t};\n\t}\n\n\tconst borderColorValue = style?.border?.color;\n\tconst borderColorSlug = borderColorValue?.startsWith( 'var:preset\|color\|' )\n\t\t? borderColorValue.substring( 'var:preset\|color\|'.length )\n\t\t: undefined;\n\tconst updatedStyle = { ...style };\n\tupdatedStyle.border = {\n\t\t...updatedStyle.border,\n\t\tcolor: borderColorSlug ? undefined : borderColorValue,\n\t};\n\treturn {\n\t\tstyle: cleanEmptyObject( updatedStyle ),\n\t\tborderColor: borderColorSlug,\n\t};\n}\n\nfunction attributesToStyle( attributes ) {\n\tif ( hasSplitBorders( attributes.style?.border ) ) {\n\t\treturn attributes.style;\n\t}\n\treturn {\n\t\t...attributes.style,\n\t\tborder: {\n\t\t\t...attributes.style?.border,\n\t\t\tcolor: attributes.borderColor\n\t\t\t\t? 'var:preset\|color\|' + attributes.borderColor\n\t\t\t\t: attributes.style?.border?.color,\n\t\t},\n\t};\n}\n\nfunction BordersInspectorControl( { children, resetAllFilter } ) {\n\tconst attributesResetAllFilter = useCallback(\n\t\t( attributes ) => {\n\t\t\tconst existingStyle = attributesToStyle( attributes );\n\t\t\tconst updatedStyle = resetAllFilter( existingStyle );\n\t\t\treturn {\n\t\t\t\t...attributes,\n\t\t\t\t...styleToAttributes( updatedStyle ),\n\t\t\t};\n\t\t},\n\t\t[ resetAllFilter ]\n\t);\n\n\treturn (\n\t\t<InspectorControls\n\t\t\tgroup=\"border\"\n\t\t\tresetAllFilter={ attributesResetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</InspectorControls>\n\t);\n}\n\nexport function BorderPanel( props ) {\n\tconst { clientId, name, attributes, setAttributes } = props;\n\tconst settings = useBlockSettings( name );\n\tconst isEnabled = useHasBorderPanel( settings );\n\tconst value = useMemo( () => {\n\t\treturn attributesToStyle( {\n\t\t\tstyle: attributes.style,\n\t\t\tborderColor: attributes.borderColor,\n\t\t} );\n\t}, [ attributes.style, attributes.borderColor ] );\n\n\tconst onChange = ( newStyle ) => {\n\t\tsetAttributes( styleToAttributes( newStyle ) );\n\t};\n\n\tif ( ! isEnabled ) {\n\t\treturn null;\n\t}\n\n\tconst defaultControls = getBlockSupport( props.name, [\n\t\tBORDER_SUPPORT_KEY,\n\t\t'__experimentalDefaultControls',\n\t] );\n\n\treturn (\n\t\t<StylesBorderPanel\n\t\t\tas={ BordersInspectorControl }\n\t\t\tpanelId={ clientId }\n\t\t\tsettings={ settings }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tdefaultControls={ defaultControls }\n\t\t/>\n\t);\n}\n\n/\n Determine whether there is block support for border properties.\n \n @param {string} blockName Block name.\n * @param {string} feature Border feature to check support for.\n \n @return {boolean} Whether there is support.\n /\nexport function hasBorderSupport( blockName, feature = 'any' ) {\n\tif ( Platform.OS !== 'web' ) {\n\t\treturn false;\n\t}\n\n\tconst support = getBlockSupport( blockName, BORDER_SUPPORT_KEY );\n\n\tif ( support === true ) {\n\t\treturn true;\n\t}\n\n\tif ( feature === 'any' ) {\n\t\treturn !! (\n\t\t\tsupport?.color \|\|\n\t\t\tsupport?.radius \|\|\n\t\t\tsupport?.width \|\|\n\t\t\tsupport?.style\n\t\t);\n\t}\n\n\treturn !! support?.[ feature ];\n}\n\n/\n Returns a new style object where the specified border attribute has been\n * removed.\n \n @param {Object} style Styles from block attributes.\n * @param {string} attribute The border style attribute to clear.\n \n @return {Object} Style object with the specified attribute removed.\n /\nexport function removeBorderAttribute( style, attribute ) {\n\treturn cleanEmptyObject( {\n\t\t...style,\n\t\tborder: {\n\t\t\t...style?.border,\n\t\t\t[ attribute ]: undefined,\n\t\t},\n\t} );\n}\n\n/\n Filters registered block settings, extending attributes to include\n * `borderColor` if needed.\n \n @param {Object} settings Original block settings.\n \n @return {Object} Updated block settings.\n /\nfunction addAttributes( settings ) {\n\tif ( ! hasBorderSupport( settings, 'color' ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify default value if needed.\n\tif ( settings.attributes.borderColor ) {\n\t\treturn settings;\n\t}\n\n\t// Add new borderColor attribute to block settings.\n\treturn {\n\t\t...settings,\n\t\tattributes: {\n\t\t\t...settings.attributes,\n\t\t\tborderColor: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t},\n\t};\n}\n\n/\n Override props assigned to save component to inject border color.\n \n @param {Object} props Additional props applied to save element.\n * @param {Object} blockType Block type definition.\n * @param {Object} attributes Block's attributes.\n \n @return {Object} Filtered props to apply to save element.\n /\nfunction addSaveProps( props, blockType, attributes ) {\n\tif (\n\t\t! hasBorderSupport( blockType, 'color' ) \|\|\n\t\tshouldSkipSerialization( blockType, BORDER_SUPPORT_KEY, 'color' )\n\t) {\n\t\treturn props;\n\t}\n\n\tconst borderClasses = getBorderClasses( attributes );\n\tconst newClassName = classnames( props.className, borderClasses );\n\n\t// If we are clearing the last of the previous classes in `className`\n\t// set it to `undefined` to avoid rendering empty DOM attributes.\n\tprops.className = newClassName ? newClassName : undefined;\n\n\treturn props;\n}\n\n/\n Generates a CSS class name consisting of all the applicable border color\n * classes given the current block attributes.\n \n @param {Object} attributes Block's attributes.\n \n @return {string} CSS class name.\n /\nexport function getBorderClasses( attributes ) {\n\tconst { borderColor, style } = attributes;\n\tconst borderColorClass = getColorClassName( 'border-color', borderColor );\n\n\treturn classnames( {\n\t\t'has-border-color': borderColor \|\| style?.border?.color,\n\t\t[ borderColorClass ]: !! borderColorClass,\n\t} );\n}\n\n/\n Filters the registered block settings to apply border color styles and\n * classnames to the block edit wrapper.\n \n @param {Object} settings Original block settings.\n \n @return {Object} Filtered block settings.\n /\nfunction addEditProps( settings ) {\n\tif (\n\t\t! hasBorderSupport( settings, 'color' ) \|\|\n\t\tshouldSkipSerialization( settings, BORDER_SUPPORT_KEY, 'color' )\n\t) {\n\t\treturn settings;\n\t}\n\n\tconst existingGetEditWrapperProps = settings.getEditWrapperProps;\n\tsettings.getEditWrapperProps = ( attributes ) => {\n\t\tlet props = {};\n\n\t\tif ( existingGetEditWrapperProps ) {\n\t\t\tprops = existingGetEditWrapperProps( attributes );\n\t\t}\n\n\t\treturn addSaveProps( props, settings, attributes );\n\t};\n\n\treturn settings;\n}\n\n/\n This adds inline styles for color palette colors.\n * Ideally, this is not needed and themes should load their palettes on the editor.\n \n @param {Function} BlockListBlock Original component.\n \n @return {Function} Wrapped component.\n */\nexport const withBorderColorPaletteStyles = createHigherOrderComponent(\n\t( BlockListBlock ) => ( props ) => {\n\t\tconst { name, attributes } = props;\n\t\tconst { borderColor, style } = attributes;\n\t\tconst { colors } = useMultipleOriginColorsAndGradients();\n\n\t\tif (\n\t\t\t! hasBorderSupport( name, 'color' ) \|\|\n\t\t\tshouldSkipSerialization( name, BORDER_SUPPORT_KEY, 'color' )\n\t\t) {\n\t\t\treturn <BlockListBlock { ...props } />;\n\t\t}\n\n\t\tconst { color: borderColorValue } = getMultiOriginColor( {\n\t\t\tcolors,\n\t\t\tnamedColor: borderColor,\n\t\t} );\n\t\tconst { color: borderTopColor } = getMultiOriginColor( {\n\t\t\tcolors,\n\t\t\tnamedColor: getColorSlugFromVariable( style?.border?.top?.color ),\n\t\t} );\n\t\tconst { color: borderRightColor } = getMultiOriginColor( {\n\t\t\tcolors,\n\t\t\tnamedColor: getColorSlugFromVariable( style?.border?.right?.color ),\n\t\t} );\n\n\t\tconst { color: borderBottomColor } = getMultiOriginColor( {\n\t\t\tcolors,\n\t\t\tnamedColor: getColorSlugFromVariable(\n\t\t\t\tstyle?.border?.bottom?.color\n\t\t\t),\n\t\t} );\n\t\tconst { color: borderLeftColor } = getMultiOriginColor( {\n\t\t\tcolors,\n\t\t\tnamedColor: getColorSlugFromVariable( style?.border?.left?.color ),\n\t\t} );\n\n\t\tconst extraStyles = {\n\t\t\tborderTopColor: borderTopColor \|\| borderColorValue,\n\t\t\tborderRightColor: borderRightColor \|\| borderColorValue,\n\t\t\tborderBottomColor: borderBottomColor \|\| borderColorValue,\n\t\t\tborderLeftColor: borderLeftColor \|\| borderColorValue,\n\t\t};\n\n\t\tlet wrapperProps = props.wrapperProps;\n\t\twrapperProps = {\n\t\t\t...props.wrapperProps,\n\t\t\tstyle: {\n\t\t\t\t...props.wrapperProps?.style,\n\t\t\t\t...extraStyles,\n\t\t\t},\n\t\t};\n\n\t\treturn <BlockListBlock { ...props } wrapperProps={ wrapperProps } />;\n\t}\n);\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/border/addAttributes',\n\taddAttributes\n);\n\naddFilter(\n\t'blocks.getSaveContent.extraProps',\n\t'core/border/addSaveProps',\n\taddSaveProps\n);\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/border/addEditProps',\n\taddEditProps\n);\n\naddFilter(\n\t'editor.BlockListBlock',\n\t'core/border/with-border-color-palette-styles',\n\twithBorderColorPaletteStyles\n);\n"]}

package/build/hooks/duotone.js CHANGED Viewed

@@ -32,8 +32,16 @@ var _blockList = _interopRequireDefault(require("../components/block-list"));
 var _duotone = require("../components/duotone");
+var _getBlockCssSelector = require("../components/global-styles/get-block-css-selector");
+var _utils = require("../components/global-styles/utils");
+var _utils2 = require("./utils");
 var _store = require("../store");
+var _filtersPanel = _interopRequireDefault(require("../components/global-styles/filters-panel"));
 /**
  * External dependencies
  */
@@ -124,10 +132,12 @@ function DuotonePanel(_ref4) {
   let {
     attributes,
-    setAttributes
+    setAttributes,
+    name
   } = _ref4;
   const style = attributes === null || attributes === void 0 ? void 0 : attributes.style;
   const duotoneStyle = style === null || style === void 0 ? void 0 : (_style$color = style.color) === null || _style$color === void 0 ? void 0 : _style$color.duotone;
+  const settings = (0, _utils2.useBlockSettings)(name);
   const duotonePalette = useMultiOriginPresets({
     presetSetting: 'color.duotone',
     defaultSetting: 'color.defaultDuotone'
@@ -144,7 +154,25 @@ function DuotonePanel(_ref4) {
   }
   const duotonePresetOrColors = !Array.isArray(duotoneStyle) ? getColorsFromDuotonePreset(duotoneStyle, duotonePalette) : duotoneStyle;
-  return (0, _element.createElement)(_components.BlockControls, {
+  return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.InspectorControls, {
+    group: "filter"
+  }, (0, _element.createElement)(_filtersPanel.default, {
+    value: {
+      filter: {
+        duotone: duotonePresetOrColors
+      }
+    },
+    onChange: newDuotone => {
+      const newStyle = {
+        color: { ...(newDuotone === null || newDuotone === void 0 ? void 0 : newDuotone.filter)
+        }
+      };
+      setAttributes({
+        style: newStyle
+      });
+    },
+    settings: settings
+  })), (0, _element.createElement)(_components.BlockControls, {
     group: "block",
     __experimentalShareWithChildBlocks: true
   }, (0, _element.createElement)(_components.__experimentalDuotoneControl, {
@@ -164,8 +192,9 @@ function DuotonePanel(_ref4) {
       setAttributes({
         style: newStyle
       });
-    }
-  }));
+    },
+    settings: settings
+  })));
 }
 /**
  * Filters registered block settings, extending attributes to include
@@ -178,7 +207,9 @@ function DuotonePanel(_ref4) {
 function addDuotoneAttributes(settings) {
-  if (!(0, _blocks.hasBlockSupport)(settings, 'color.__experimentalDuotone')) {
+  // Previous `color.__experimentalDuotone` support flag is migrated via
+  // block_type_metadata_settings filter in `lib/block-supports/duotone.php`.
+  if (!(0, _blocks.hasBlockSupport)(settings, 'filter.duotone')) {
     return settings;
   } // Allow blocks to specify their own attribute definition with default
   // values if needed.
@@ -205,7 +236,9 @@ function addDuotoneAttributes(settings) {
 const withDuotoneControls = (0, _compose.createHigherOrderComponent)(BlockEdit => props => {
-  const hasDuotoneSupport = (0, _blocks.hasBlockSupport)(props.name, 'color.__experimentalDuotone');
+  // Previous `color.__experimentalDuotone` support flag is migrated via
+  // block_type_metadata_settings filter in `lib/block-supports/duotone.php`.
+  const hasDuotoneSupport = (0, _blocks.hasBlockSupport)(props.name, 'filter.duotone');
   const isContentLocked = (0, _data.useSelect)(select => {
     return select(_store.store).__unstableGetContentLockingParent(props.clientId);
   }, [props.clientId]); // CAUTION: code added before this line will be executed
@@ -215,69 +248,56 @@ const withDuotoneControls = (0, _compose.createHigherOrderComponent)(BlockEdit =
   return (0, _element.createElement)(_element.Fragment, null, hasDuotoneSupport && !isContentLocked && (0, _element.createElement)(DuotonePanel, props), (0, _element.createElement)(BlockEdit, props));
 }, 'withDuotoneControls');
-/**
- * Function that scopes a selector with another one. This works a bit like
- * SCSS nesting except the `&` operator isn't supported.
- *
- * @example
- * ```js
- * const scope = '.a, .b .c';
- * const selector = '> .x, .y';
- * const merged = scopeSelector( scope, selector );
- * // merged is '.a > .x, .a .y, .b .c > .x, .b .c .y'
- * ```
- *
- * @param {string} scope    Selector to scope to.
- * @param {string} selector Original selector.
- *
- * @return {string} Scoped selector.
- */
-function scopeSelector(scope, selector) {
-  const scopes = scope.split(',');
-  const selectors = selector.split(',');
-  const selectorsScoped = [];
-  scopes.forEach(outer => {
-    selectors.forEach(inner => {
-      selectorsScoped.push(`${outer.trim()} ${inner.trim()}`);
-    });
-  });
-  return selectorsScoped.join(', ');
-}
-function BlockDuotoneStyles(_ref5) {
-  var _getBlockType$selecto, _getBlockType$selecto2;
+function DuotoneStyles(_ref5) {
   let {
-    name,
-    duotoneStyle,
-    id
+    id: filterId,
+    selector: duotoneSelector,
+    attribute: duotoneAttr
   } = _ref5;
+  const element = (0, _element.useContext)(_blockList.default.__unstableElementContext);
   const duotonePalette = useMultiOriginPresets({
     presetSetting: 'color.duotone',
     defaultSetting: 'color.defaultDuotone'
+  }); // Possible values for duotone attribute:
+  // 1. Array of colors - e.g. ['#000000', '#ffffff'].
+  // 2. Variable for an existing Duotone preset - e.g. 'var:preset|duotone|green-blue' or 'var(--wp--preset--duotone--green-blue)''
+  // 3. A CSS string - e.g. 'unset' to remove globally applied duotone.
+  const isCustom = Array.isArray(duotoneAttr);
+  const duotonePreset = isCustom ? undefined : getColorsFromDuotonePreset(duotoneAttr, duotonePalette);
+  const isPreset = typeof duotoneAttr === 'string' && duotonePreset;
+  const isCSS = typeof duotoneAttr === 'string' && !isPreset; // Match the structure of WP_Duotone_Gutenberg::render_duotone_support() in PHP.
+  let colors = null;
+  if (isPreset) {
+    // Array of colors.
+    colors = duotonePreset;
+  } else if (isCSS) {
+    // CSS filter property string (e.g. 'unset').
+    colors = duotoneAttr;
+  } else if (isCustom) {
+    // Array of colors.
+    colors = duotoneAttr;
+  } // Build the CSS selectors to which the filter will be applied.
+  const selectors = duotoneSelector.split(',');
+  const selectorsScoped = selectors.map(selectorPart => {
+    // Extra .editor-styles-wrapper specificity is needed in the editor
+    // since we're not using inline styles to apply the filter. We need to
+    // override duotone applied by global styles and theme.json.
+    // Assuming the selector part is a subclass selector (not a tag name)
+    // so we can prepend the filter id class. If we want to support elements
+    // such as `img` or namespaces, we'll need to add a case for that here.
+    return `.editor-styles-wrapper .${filterId}${selectorPart.trim()}`;
   });
-  const element = (0, _element.useContext)(_blockList.default.__unstableElementContext); // Portals cannot exist without a container.
-  // Guard against empty Duotone styles.
-  if (!element || !duotoneStyle) {
-    return null;
-  }
-  let colors = duotoneStyle;
-  if (!Array.isArray(colors) && colors !== 'unset') {
-    colors = getColorsFromDuotonePreset(colors, duotonePalette);
-  }
-  const duotoneSupportSelectors = ((_getBlockType$selecto = (0, _blocks.getBlockType)(name).selectors) === null || _getBlockType$selecto === void 0 ? void 0 : (_getBlockType$selecto2 = _getBlockType$selecto.filter) === null || _getBlockType$selecto2 === void 0 ? void 0 : _getBlockType$selecto2.duotone) || (0, _blocks.getBlockSupport)(name, 'color.__experimentalDuotone'); // Extra .editor-styles-wrapper specificity is needed in the editor
-  // since we're not using inline styles to apply the filter. We need to
-  // override duotone applied by global styles and theme.json.
-  const selectorsGroup = scopeSelector(`.editor-styles-wrapper .${id}`, duotoneSupportSelectors);
-  return (0, _element.createPortal)((0, _element.createElement)(InlineDuotone, {
-    selector: selectorsGroup,
-    id: id,
+  const selector = selectorsScoped.join(', ');
+  const isValidFilter = Array.isArray(colors) || colors === 'unset';
+  return element && isValidFilter && (0, _element.createPortal)((0, _element.createElement)(InlineDuotone, {
+    selector: selector,
+    id: filterId,
     colors: colors
   }), element);
 }
@@ -293,18 +313,49 @@ function BlockDuotoneStyles(_ref5) {
 const withDuotoneStyles = (0, _compose.createHigherOrderComponent)(BlockListBlock => props => {
   var _props$attributes, _props$attributes$sty, _props$attributes$sty2;
-  const duotoneSupport = (0, _blocks.getBlockSupport)(props.name, 'color.__experimentalDuotone');
-  const id = `wp-duotone-${(0, _compose.useInstanceId)(BlockListBlock)}`;
-  const className = duotoneSupport ? (0, _classnames.default)(props === null || props === void 0 ? void 0 : props.className, id) : props === null || props === void 0 ? void 0 : props.className;
-  const duotoneStyle = props === null || props === void 0 ? void 0 : (_props$attributes = props.attributes) === null || _props$attributes === void 0 ? void 0 : (_props$attributes$sty = _props$attributes.style) === null || _props$attributes$sty === void 0 ? void 0 : (_props$attributes$sty2 = _props$attributes$sty.color) === null || _props$attributes$sty2 === void 0 ? void 0 : _props$attributes$sty2.duotone; // CAUTION: code added before this line will be executed
+  const id = (0, _compose.useInstanceId)(BlockListBlock);
+  const selector = (0, _element.useMemo)(() => {
+    const blockType = (0, _blocks.getBlockType)(props.name);
+    if (blockType) {
+      // Backwards compatibility for `supports.color.__experimentalDuotone`
+      // is provided via the `block_type_metadata_settings` filter. If
+      // `supports.filter.duotone` has not been set and the
+      // experimental property has been, the experimental property
+      // value is copied into `supports.filter.duotone`.
+      const duotoneSupport = (0, _blocks.getBlockSupport)(blockType, 'filter.duotone', false);
+      if (!duotoneSupport) {
+        return null;
+      } // If the experimental duotone support was set, that value is
+      // to be treated as a selector and requires scoping.
+      const experimentalDuotone = (0, _blocks.getBlockSupport)(blockType, 'color.__experimentalDuotone', false);
+      if (experimentalDuotone) {
+        const rootSelector = (0, _getBlockCssSelector.getBlockCSSSelector)(blockType);
+        return typeof experimentalDuotone === 'string' ? (0, _utils.scopeSelector)(rootSelector, experimentalDuotone) : rootSelector;
+      } // Regular filter.duotone support uses filter.duotone selectors with fallbacks.
+      return (0, _getBlockCssSelector.getBlockCSSSelector)(blockType, 'filter.duotone', {
+        fallback: true
+      });
+    }
+  }, [props.name]);
+  const attribute = props === null || props === void 0 ? void 0 : (_props$attributes = props.attributes) === null || _props$attributes === void 0 ? void 0 : (_props$attributes$sty = _props$attributes.style) === null || _props$attributes$sty === void 0 ? void 0 : (_props$attributes$sty2 = _props$attributes$sty.color) === null || _props$attributes$sty2 === void 0 ? void 0 : _props$attributes$sty2.duotone;
+  const filterClass = `wp-duotone-${id}`;
+  const shouldRender = selector && attribute;
+  const className = shouldRender ? (0, _classnames.default)(props === null || props === void 0 ? void 0 : props.className, filterClass) : props === null || props === void 0 ? void 0 : props.className; // CAUTION: code added before this line will be executed
   // for all blocks, not just those that support duotone. Code added
   // above this line should be carefully evaluated for its impact on
   // performance.
-  return (0, _element.createElement)(_element.Fragment, null, duotoneSupport && duotoneStyle && (0, _element.createElement)(BlockDuotoneStyles, {
-    name: props === null || props === void 0 ? void 0 : props.name,
-    duotoneStyle: duotoneStyle,
-    id: id
+  return (0, _element.createElement)(_element.Fragment, null, shouldRender && (0, _element.createElement)(DuotoneStyles, {
+    id: filterClass,
+    selector: selector,
+    attribute: attribute
   }), (0, _element.createElement)(BlockListBlock, (0, _extends2.default)({}, props, {
     className: className
   })));

package/build/hooks/duotone.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/block-editor/src/hooks/duotone.js"],"names":["EMPTY_ARRAY","namesPlugin","InlineDuotone","selector","id","colors","useMultiOriginPresets","presetSetting","defaultSetting","disableDefault","userPresets","themePresets","defaultPresets","getColorsFromDuotonePreset","duotone","duotonePalette","preset","find","slug","undefined","getDuotonePresetFromColors","Array","isArray","duotonePreset","every","val","index","DuotonePanel","attributes","setAttributes","style","duotoneStyle","color","colorPalette","disableCustomColors","disableCustomDuotone","length","duotonePresetOrColors","newDuotone","maybePreset","newStyle","addDuotoneAttributes","settings","Object","assign","type","withDuotoneControls","BlockEdit","props","hasDuotoneSupport","name","isContentLocked","select","blockEditorStore","__unstableGetContentLockingParent","clientId","scopeSelector","scope","scopes","split","selectors","selectorsScoped","forEach","outer","inner","push","trim","join","BlockDuotoneStyles","element","BlockList","__unstableElementContext","duotoneSupportSelectors","filter","selectorsGroup","withDuotoneStyles","BlockListBlock","duotoneSupport","className"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\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 { createHigherOrderComponent, useInstanceId } from '@wordpress/compose';\nimport { addFilter } from '@wordpress/hooks';\nimport { useMemo, useContext, createPortal } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\n\n/\n Internal dependencies\n /\nimport {\n\tBlockControls,\n\t__experimentalDuotoneControl as DuotoneControl,\n\tuseSetting,\n} from '../components';\nimport BlockList from '../components/block-list';\nimport {\n\t__unstableDuotoneFilter as DuotoneFilter,\n\t__unstableDuotoneStylesheet as DuotoneStylesheet,\n\t__unstableDuotoneUnsetStylesheet as DuotoneUnsetStylesheet,\n} from '../components/duotone';\nimport { store as blockEditorStore } from '../store';\n\nconst EMPTY_ARRAY = [];\n\nextend( [ namesPlugin ] );\n\n/\n SVG and stylesheet needed for rendering the duotone filter.\n \n @param {Object} props Duotone props.\n * @param {string} props.selector Selector to apply the filter to.\n * @param {string} props.id Unique id for this duotone filter.\n * @param {string[]\|\"unset\"} props.colors Array of RGB color strings ordered from dark to light.\n \n @return {WPElement} Duotone element.\n /\nfunction InlineDuotone( { selector, id, colors } ) {\n\tif ( colors === 'unset' ) {\n\t\treturn <DuotoneUnsetStylesheet selector={ selector } />;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<DuotoneFilter id={ id } colors={ colors } />\n\t\t\t<DuotoneStylesheet id={ id } selector={ selector } />\n\t\t</>\n\t);\n}\n\nfunction useMultiOriginPresets( { presetSetting, defaultSetting } ) {\n\tconst disableDefault = ! useSetting( defaultSetting );\n\tconst userPresets =\n\t\tuseSetting( `${ presetSetting }.custom` ) \|\| EMPTY_ARRAY;\n\tconst themePresets =\n\t\tuseSetting( `${ presetSetting }.theme` ) \|\| EMPTY_ARRAY;\n\tconst defaultPresets =\n\t\tuseSetting( `${ presetSetting }.default` ) \|\| EMPTY_ARRAY;\n\treturn useMemo(\n\t\t() => [\n\t\t\t...userPresets,\n\t\t\t...themePresets,\n\t\t\t...( disableDefault ? EMPTY_ARRAY : defaultPresets ),\n\t\t],\n\t\t[ disableDefault, 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 DuotonePanel( { attributes, setAttributes } ) {\n\tconst style = attributes?.style;\n\tconst duotoneStyle = style?.color?.duotone;\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 disableCustomColors = ! useSetting( 'color.custom' );\n\tconst disableCustomDuotone =\n\t\t! useSetting( 'color.customDuotone' ) \|\|\n\t\t( colorPalette?.length === 0 && disableCustomColors );\n\n\tif ( duotonePalette?.length === 0 && disableCustomDuotone ) {\n\t\treturn null;\n\t}\n\n\tconst duotonePresetOrColors = ! Array.isArray( duotoneStyle )\n\t\t? getColorsFromDuotonePreset( duotoneStyle, duotonePalette )\n\t\t: duotoneStyle;\n\n\treturn (\n\t\t<BlockControls group=\"block\" __experimentalShareWithChildBlocks>\n\t\t\t<DuotoneControl\n\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\tdisableCustomDuotone={ disableCustomDuotone }\n\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\tvalue={ duotonePresetOrColors }\n\t\t\t\tonChange={ ( newDuotone ) => {\n\t\t\t\t\tconst maybePreset = getDuotonePresetFromColors(\n\t\t\t\t\t\tnewDuotone,\n\t\t\t\t\t\tduotonePalette\n\t\t\t\t\t);\n\n\t\t\t\t\tconst newStyle = {\n\t\t\t\t\t\t...style,\n\t\t\t\t\t\tcolor: {\n\t\t\t\t\t\t\t...style?.color,\n\t\t\t\t\t\t\tduotone: maybePreset ?? newDuotone, // use preset or fallback to custom colors.\n\t\t\t\t\t\t},\n\t\t\t\t\t};\n\t\t\t\t\tsetAttributes( { style: newStyle } );\n\t\t\t\t} }\n\t\t\t/>\n\t\t</BlockControls>\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\tif ( ! hasBlockSupport( settings, 'color.__experimentalDuotone' ) ) {\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\n/\n Override the default edit UI to include toolbar controls for duotone if the\n * block supports duotone.\n \n @param {Function} BlockEdit Original component.\n \n @return {Function} Wrapped component.\n /\nconst withDuotoneControls = createHigherOrderComponent(\n\t( BlockEdit ) => ( props ) => {\n\t\tconst hasDuotoneSupport = hasBlockSupport(\n\t\t\tprops.name,\n\t\t\t'color.__experimentalDuotone'\n\t\t);\n\t\tconst isContentLocked = useSelect(\n\t\t\t( select ) => {\n\t\t\t\treturn select(\n\t\t\t\t\tblockEditorStore\n\t\t\t\t).__unstableGetContentLockingParent( props.clientId );\n\t\t\t},\n\t\t\t[ props.clientId ]\n\t\t);\n\n\t\t// CAUTION: code added before this line will be executed\n\t\t// for all blocks, not just those that support duotone. Code added\n\t\t// above this line should be carefully evaluated for its impact on\n\t\t// performance.\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ hasDuotoneSupport && ! isContentLocked && (\n\t\t\t\t\t<DuotonePanel { ...props } />\n\t\t\t\t) }\n\t\t\t\t<BlockEdit { ...props } />\n\t\t\t</>\n\t\t);\n\t},\n\t'withDuotoneControls'\n);\n\n/\n Function that scopes a selector with another one. This works a bit like\n * SCSS nesting except the `&` operator isn't supported.\n \n @example\n * ```js\n * const scope = '.a, .b .c';\n * const selector = '> .x, .y';\n * const merged = scopeSelector( scope, selector );\n * // merged is '.a > .x, .a .y, .b .c > .x, .b .c .y'\n * ```\n \n @param {string} scope Selector to scope to.\n * @param {string} selector Original selector.\n \n @return {string} Scoped selector.\n /\nfunction scopeSelector( scope, selector ) {\n\tconst scopes = scope.split( ',' );\n\tconst selectors = selector.split( ',' );\n\n\tconst selectorsScoped = [];\n\tscopes.forEach( ( outer ) => {\n\t\tselectors.forEach( ( inner ) => {\n\t\t\tselectorsScoped.push( `${ outer.trim() } ${ inner.trim() }` );\n\t\t} );\n\t} );\n\n\treturn selectorsScoped.join( ', ' );\n}\n\nfunction BlockDuotoneStyles( { name, duotoneStyle, id } ) {\n\tconst duotonePalette = useMultiOriginPresets( {\n\t\tpresetSetting: 'color.duotone',\n\t\tdefaultSetting: 'color.defaultDuotone',\n\t} );\n\n\tconst element = useContext( BlockList.__unstableElementContext );\n\n\t// Portals cannot exist without a container.\n\t// Guard against empty Duotone styles.\n\tif ( ! element \|\| ! duotoneStyle ) {\n\t\treturn null;\n\t}\n\n\tlet colors = duotoneStyle;\n\n\tif ( ! Array.isArray( colors ) && colors !== 'unset' ) {\n\t\tcolors = getColorsFromDuotonePreset( colors, duotonePalette );\n\t}\n\n\tconst duotoneSupportSelectors =\n\t\tgetBlockType( name ).selectors?.filter?.duotone \|\|\n\t\tgetBlockSupport( name, 'color.__experimentalDuotone' );\n\n\t// Extra .editor-styles-wrapper specificity is needed in the editor\n\t// since we're not using inline styles to apply the filter. We need to\n\t// override duotone applied by global styles and theme.json.\n\tconst selectorsGroup = scopeSelector(\n\t\t`.editor-styles-wrapper .${ id }`,\n\t\tduotoneSupportSelectors\n\t);\n\n\treturn createPortal(\n\t\t<InlineDuotone\n\t\t\tselector={ selectorsGroup }\n\t\t\tid={ id }\n\t\t\tcolors={ colors }\n\t\t/>,\n\t\telement\n\t);\n}\n\n/\n Override the default block element to include duotone styles.\n \n @param {Function} BlockListBlock Original component.\n \n @return {Function} Wrapped component.\n */\nconst withDuotoneStyles = createHigherOrderComponent(\n\t( BlockListBlock ) => ( props ) => {\n\t\tconst duotoneSupport = getBlockSupport(\n\t\t\tprops.name,\n\t\t\t'color.__experimentalDuotone'\n\t\t);\n\n\t\tconst id = `wp-duotone-${ useInstanceId( BlockListBlock ) }`;\n\t\tconst className = duotoneSupport\n\t\t\t? classnames( props?.className, id )\n\t\t\t: props?.className;\n\t\tconst duotoneStyle = props?.attributes?.style?.color?.duotone;\n\n\t\t// CAUTION: code added before this line will be executed\n\t\t// for all blocks, not just those that support duotone. Code added\n\t\t// above this line should be carefully evaluated for its impact on\n\t\t// performance.\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ duotoneSupport && duotoneStyle && (\n\t\t\t\t\t<BlockDuotoneStyles\n\t\t\t\t\t\tname={ props?.name }\n\t\t\t\t\t\tduotoneStyle={ duotoneStyle }\n\t\t\t\t\t\tid={ id }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<BlockListBlock { ...props } className={ className } />\n\t\t\t</>\n\t\t);\n\t},\n\t'withDuotoneStyles'\n);\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/editor/duotone/add-attributes',\n\taddDuotoneAttributes\n);\naddFilter(\n\t'editor.BlockEdit',\n\t'core/editor/duotone/with-editor-controls',\n\twithDuotoneControls\n);\naddFilter(\n\t'editor.BlockListBlock',\n\t'core/editor/duotone/with-styles',\n\twithDuotoneStyles\n);\n"]}
1	+ {"version":3,"sources":["@wordpress/block-editor/src/hooks/duotone.js"],"names":["EMPTY_ARRAY","namesPlugin","InlineDuotone","selector","id","colors","useMultiOriginPresets","presetSetting","defaultSetting","disableDefault","userPresets","themePresets","defaultPresets","getColorsFromDuotonePreset","duotone","duotonePalette","preset","find","slug","undefined","getDuotonePresetFromColors","Array","isArray","duotonePreset","every","val","index","DuotonePanel","attributes","setAttributes","name","style","duotoneStyle","color","settings","colorPalette","disableCustomColors","disableCustomDuotone","length","duotonePresetOrColors","filter","newDuotone","newStyle","maybePreset","addDuotoneAttributes","Object","assign","type","withDuotoneControls","BlockEdit","props","hasDuotoneSupport","isContentLocked","select","blockEditorStore","__unstableGetContentLockingParent","clientId","DuotoneStyles","filterId","duotoneSelector","attribute","duotoneAttr","element","BlockList","__unstableElementContext","isCustom","isPreset","isCSS","selectors","split","selectorsScoped","map","selectorPart","trim","join","isValidFilter","withDuotoneStyles","BlockListBlock","blockType","duotoneSupport","experimentalDuotone","rootSelector","fallback","filterClass","shouldRender","className"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\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 { createHigherOrderComponent, useInstanceId } from '@wordpress/compose';\nimport { addFilter } from '@wordpress/hooks';\nimport { useMemo, useContext, createPortal } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\n\n/\n Internal dependencies\n /\nimport {\n\tBlockControls,\n\tInspectorControls,\n\t__experimentalDuotoneControl as DuotoneControl,\n\tuseSetting,\n} from '../components';\nimport BlockList from '../components/block-list';\nimport {\n\t__unstableDuotoneFilter as DuotoneFilter,\n\t__unstableDuotoneStylesheet as DuotoneStylesheet,\n\t__unstableDuotoneUnsetStylesheet as DuotoneUnsetStylesheet,\n} from '../components/duotone';\nimport { getBlockCSSSelector } from '../components/global-styles/get-block-css-selector';\nimport { scopeSelector } from '../components/global-styles/utils';\nimport { useBlockSettings } from './utils';\nimport { store as blockEditorStore } from '../store';\nimport { default as StylesFiltersPanel } from '../components/global-styles/filters-panel';\n\nconst EMPTY_ARRAY = [];\n\nextend( [ namesPlugin ] );\n\n/\n SVG and stylesheet needed for rendering the duotone filter.\n \n @param {Object} props Duotone props.\n * @param {string} props.selector Selector to apply the filter to.\n * @param {string} props.id Unique id for this duotone filter.\n * @param {string[]\|\"unset\"} props.colors Array of RGB color strings ordered from dark to light.\n \n @return {WPElement} Duotone element.\n /\nfunction InlineDuotone( { selector, id, colors } ) {\n\tif ( colors === 'unset' ) {\n\t\treturn <DuotoneUnsetStylesheet selector={ selector } />;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<DuotoneFilter id={ id } colors={ colors } />\n\t\t\t<DuotoneStylesheet id={ id } selector={ selector } />\n\t\t</>\n\t);\n}\n\nfunction useMultiOriginPresets( { presetSetting, defaultSetting } ) {\n\tconst disableDefault = ! useSetting( defaultSetting );\n\tconst userPresets =\n\t\tuseSetting( `${ presetSetting }.custom` ) \|\| EMPTY_ARRAY;\n\tconst themePresets =\n\t\tuseSetting( `${ presetSetting }.theme` ) \|\| EMPTY_ARRAY;\n\tconst defaultPresets =\n\t\tuseSetting( `${ presetSetting }.default` ) \|\| EMPTY_ARRAY;\n\treturn useMemo(\n\t\t() => [\n\t\t\t...userPresets,\n\t\t\t...themePresets,\n\t\t\t...( disableDefault ? EMPTY_ARRAY : defaultPresets ),\n\t\t],\n\t\t[ disableDefault, 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 DuotonePanel( { attributes, setAttributes, name } ) {\n\tconst style = attributes?.style;\n\tconst duotoneStyle = style?.color?.duotone;\n\tconst settings = useBlockSettings( name );\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 disableCustomColors = ! useSetting( 'color.custom' );\n\tconst disableCustomDuotone =\n\t\t! useSetting( 'color.customDuotone' ) \|\|\n\t\t( colorPalette?.length === 0 && disableCustomColors );\n\n\tif ( duotonePalette?.length === 0 && disableCustomDuotone ) {\n\t\treturn null;\n\t}\n\n\tconst duotonePresetOrColors = ! Array.isArray( duotoneStyle )\n\t\t? getColorsFromDuotonePreset( duotoneStyle, duotonePalette )\n\t\t: duotoneStyle;\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\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( { style: newStyle } );\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( { style: newStyle } );\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\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\n/\n Override the default edit UI to include toolbar controls for duotone if the\n * block supports duotone.\n \n @param {Function} BlockEdit Original component.\n \n @return {Function} Wrapped component.\n /\nconst withDuotoneControls = createHigherOrderComponent(\n\t( BlockEdit ) => ( props ) => {\n\t\t// Previous `color.__experimentalDuotone` support flag is migrated via\n\t\t// block_type_metadata_settings filter in `lib/block-supports/duotone.php`.\n\t\tconst hasDuotoneSupport = hasBlockSupport(\n\t\t\tprops.name,\n\t\t\t'filter.duotone'\n\t\t);\n\n\t\tconst isContentLocked = useSelect(\n\t\t\t( select ) => {\n\t\t\t\treturn select(\n\t\t\t\t\tblockEditorStore\n\t\t\t\t).__unstableGetContentLockingParent( props.clientId );\n\t\t\t},\n\t\t\t[ props.clientId ]\n\t\t);\n\n\t\t// CAUTION: code added before this line will be executed\n\t\t// for all blocks, not just those that support duotone. Code added\n\t\t// above this line should be carefully evaluated for its impact on\n\t\t// performance.\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ hasDuotoneSupport && ! isContentLocked && (\n\t\t\t\t\t<DuotonePanel { ...props } />\n\t\t\t\t) }\n\t\t\t\t<BlockEdit { ...props } />\n\t\t\t</>\n\t\t);\n\t},\n\t'withDuotoneControls'\n);\n\nfunction DuotoneStyles( {\n\tid: filterId,\n\tselector: duotoneSelector,\n\tattribute: duotoneAttr,\n} ) {\n\tconst element = useContext( BlockList.__unstableElementContext );\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// Extra .editor-styles-wrapper specificity is needed in the editor\n\t\t// since we're not using inline styles to apply the filter. We need to\n\t\t// override duotone applied by global styles and theme.json.\n\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 `.editor-styles-wrapper .${ filterId }${ selectorPart.trim() }`;\n\t} );\n\n\tconst selector = selectorsScoped.join( ', ' );\n\n\tconst isValidFilter = Array.isArray( colors ) \|\| colors === 'unset';\n\n\treturn (\n\t\telement &&\n\t\tisValidFilter &&\n\t\tcreatePortal(\n\t\t\t<InlineDuotone\n\t\t\t\tselector={ selector }\n\t\t\t\tid={ filterId }\n\t\t\t\tcolors={ colors }\n\t\t\t/>,\n\t\t\telement\n\t\t)\n\t);\n}\n\n/\n Override the default block element to include duotone styles.\n \n @param {Function} BlockListBlock Original component.\n \n @return {Function} Wrapped component.\n */\nconst withDuotoneStyles = createHigherOrderComponent(\n\t( BlockListBlock ) => ( props ) => {\n\t\tconst id = useInstanceId( BlockListBlock );\n\n\t\tconst selector = useMemo( () => {\n\t\t\tconst blockType = getBlockType( props.name );\n\n\t\t\tif ( blockType ) {\n\t\t\t\t// Backwards compatibility for `supports.color.__experimentalDuotone`\n\t\t\t\t// is provided via the `block_type_metadata_settings` filter. If\n\t\t\t\t// `supports.filter.duotone` has not been set and the\n\t\t\t\t// experimental property has been, the experimental property\n\t\t\t\t// value is copied into `supports.filter.duotone`.\n\t\t\t\tconst duotoneSupport = getBlockSupport(\n\t\t\t\t\tblockType,\n\t\t\t\t\t'filter.duotone',\n\t\t\t\t\tfalse\n\t\t\t\t);\n\t\t\t\tif ( ! duotoneSupport ) {\n\t\t\t\t\treturn null;\n\t\t\t\t}\n\n\t\t\t\t// If the experimental duotone support was set, that value is\n\t\t\t\t// to be treated as a selector and requires scoping.\n\t\t\t\tconst experimentalDuotone = getBlockSupport(\n\t\t\t\t\tblockType,\n\t\t\t\t\t'color.__experimentalDuotone',\n\t\t\t\t\tfalse\n\t\t\t\t);\n\t\t\t\tif ( experimentalDuotone ) {\n\t\t\t\t\tconst rootSelector = getBlockCSSSelector( blockType );\n\t\t\t\t\treturn typeof experimentalDuotone === 'string'\n\t\t\t\t\t\t? scopeSelector( rootSelector, experimentalDuotone )\n\t\t\t\t\t\t: rootSelector;\n\t\t\t\t}\n\n\t\t\t\t// Regular filter.duotone support uses filter.duotone selectors with fallbacks.\n\t\t\t\treturn getBlockCSSSelector( blockType, 'filter.duotone', {\n\t\t\t\t\tfallback: true,\n\t\t\t\t} );\n\t\t\t}\n\t\t}, [ props.name ] );\n\n\t\tconst attribute = props?.attributes?.style?.color?.duotone;\n\n\t\tconst filterClass = `wp-duotone-${ id }`;\n\n\t\tconst shouldRender = selector && attribute;\n\n\t\tconst className = shouldRender\n\t\t\t? classnames( props?.className, filterClass )\n\t\t\t: props?.className;\n\n\t\t// CAUTION: code added before this line will be executed\n\t\t// for all blocks, not just those that support duotone. Code added\n\t\t// above this line should be carefully evaluated for its impact on\n\t\t// performance.\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ shouldRender && (\n\t\t\t\t\t<DuotoneStyles\n\t\t\t\t\t\tid={ filterClass }\n\t\t\t\t\t\tselector={ selector }\n\t\t\t\t\t\tattribute={ attribute }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<BlockListBlock { ...props } className={ className } />\n\t\t\t</>\n\t\t);\n\t},\n\t'withDuotoneStyles'\n);\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/editor/duotone/add-attributes',\n\taddDuotoneAttributes\n);\naddFilter(\n\t'editor.BlockEdit',\n\t'core/editor/duotone/with-editor-controls',\n\twithDuotoneControls\n);\naddFilter(\n\t'editor.BlockListBlock',\n\t'core/editor/duotone/with-styles',\n\twithDuotoneStyles\n);\n"]}

package/build/hooks/margin.js CHANGED Viewed

@@ -13,7 +13,7 @@ var _isShallowEqual = _interopRequireDefault(require("@wordpress/is-shallow-equa
 var _blockPopover = _interopRequireDefault(require("../components/block-popover"));
-var _utils = require("../components/spacing-sizes-control/utils");
+var _useBlockRefs = require("../components/block-list/use-block-props/use-block-refs");
 /**
  * WordPress dependencies
@@ -22,6 +22,10 @@ var _utils = require("../components/spacing-sizes-control/utils");
 /**
  * Internal dependencies
  */
+function getComputedCSS(element, property) {
+  return element.ownerDocument.defaultView.getComputedStyle(element).getPropertyValue(property);
+}
 function MarginVisualizer(_ref) {
   var _attributes$style, _attributes$style$spa;
@@ -30,23 +34,29 @@ function MarginVisualizer(_ref) {
     attributes,
     forceShow
   } = _ref;
+  const blockElement = (0, _useBlockRefs.__unstableUseBlockElement)(clientId);
+  const [style, setStyle] = (0, _element.useState)();
   const margin = attributes === null || attributes === void 0 ? void 0 : (_attributes$style = attributes.style) === null || _attributes$style === void 0 ? void 0 : (_attributes$style$spa = _attributes$style.spacing) === null || _attributes$style$spa === void 0 ? void 0 : _attributes$style$spa.margin;
-  const style = (0, _element.useMemo)(() => {
-    const marginTop = margin !== null && margin !== void 0 && margin.top ? (0, _utils.getSpacingPresetCssVar)(margin === null || margin === void 0 ? void 0 : margin.top) : 0;
-    const marginRight = margin !== null && margin !== void 0 && margin.right ? (0, _utils.getSpacingPresetCssVar)(margin === null || margin === void 0 ? void 0 : margin.right) : 0;
-    const marginBottom = margin !== null && margin !== void 0 && margin.bottom ? (0, _utils.getSpacingPresetCssVar)(margin === null || margin === void 0 ? void 0 : margin.bottom) : 0;
-    const marginLeft = margin !== null && margin !== void 0 && margin.left ? (0, _utils.getSpacingPresetCssVar)(margin === null || margin === void 0 ? void 0 : margin.left) : 0;
-    return {
-      borderTopWidth: marginTop,
-      borderRightWidth: marginRight,
-      borderBottomWidth: marginBottom,
-      borderLeftWidth: marginLeft,
-      top: marginTop ? `calc(${marginTop} * -1)` : 0,
-      right: marginRight ? `calc(${marginRight} * -1)` : 0,
-      bottom: marginBottom ? `calc(${marginBottom} * -1)` : 0,
-      left: marginLeft ? `calc(${marginLeft} * -1)` : 0
-    };
-  }, [margin]);
+  (0, _element.useEffect)(() => {
+    if (!blockElement) {
+      return;
+    }
+    const top = getComputedCSS(blockElement, 'margin-top');
+    const right = getComputedCSS(blockElement, 'margin-right');
+    const bottom = getComputedCSS(blockElement, 'margin-bottom');
+    const left = getComputedCSS(blockElement, 'margin-left');
+    setStyle({
+      borderTopWidth: top,
+      borderRightWidth: right,
+      borderBottomWidth: bottom,
+      borderLeftWidth: left,
+      top: top ? `-${top}` : 0,
+      right: right ? `-${right}` : 0,
+      bottom: bottom ? `-${bottom}` : 0,
+      left: left ? `-${left}` : 0
+    });
+  }, [blockElement, margin]);
   const [isActive, setIsActive] = (0, _element.useState)(false);
   const valueRef = (0, _element.useRef)(margin);
   const timeoutRef = (0, _element.useRef)();