@wordpress/block-editor 12.7.0 → 12.8.1

package/build-module/hooks/margin.js

@@ -1,21 +1,18 @@
 import { createElement } from "@wordpress/element";
-
 /**
  * WordPress dependencies
  */
 import { useState, useRef, useEffect } from '@wordpress/element';
 import isShallowEqual from '@wordpress/is-shallow-equal';
+
 /**
  * Internal dependencies
  */
-
 import BlockPopover from '../components/block-popover';
 import { __unstableUseBlockElement as useBlockElement } from '../components/block-list/use-block-props/use-block-refs';
-
 function getComputedCSS(element, property) {
   return element.ownerDocument.defaultView.getComputedStyle(element).getPropertyValue(property);
 }
-
 export function MarginVisualizer({
   clientId,
   attributes,
@@ -28,7 +25,6 @@ export function MarginVisualizer({
     if (!blockElement || null === blockElement.ownerDocument.defaultView) {
       return;
     }
-
     const top = getComputedCSS(blockElement, 'margin-top');
     const right = getComputedCSS(blockElement, 'margin-right');
     const bottom = getComputedCSS(blockElement, 'margin-bottom');
@@ -47,13 +43,11 @@ export function MarginVisualizer({
   const [isActive, setIsActive] = useState(false);
   const valueRef = useRef(margin);
   const timeoutRef = useRef();
-
   const clearTimer = () => {
     if (timeoutRef.current) {
       window.clearTimeout(timeoutRef.current);
     }
   };
-
   useEffect(() => {
     if (!isShallowEqual(margin, valueRef.current) && !forceShow) {
       setIsActive(true);
@@ -62,17 +56,14 @@ export function MarginVisualizer({
         setIsActive(false);
       }, 400);
     }
-
     return () => {
       setIsActive(false);
       clearTimer();
     };
   }, [margin, forceShow]);
-
   if (!isActive && !forceShow) {
     return null;
   }
-
   return createElement(BlockPopover, {
     clientId: clientId,
     __unstableCoverTarget: true,

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/hooks/margin.js"],"names":["useState","useRef","useEffect","isShallowEqual","BlockPopover","__unstableUseBlockElement","useBlockElement","getComputedCSS","element","property","ownerDocument","defaultView","getComputedStyle","getPropertyValue","MarginVisualizer","clientId","attributes","forceShow","blockElement","style","setStyle","margin","spacing","top","right","bottom","left","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","isActive","setIsActive","valueRef","timeoutRef","clearTimer","current","window","clearTimeout","setTimeout"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useRef, useEffect } from '@wordpress/element';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport BlockPopover from '../components/block-popover';\nimport { __unstableUseBlockElement as useBlockElement } from '../components/block-list/use-block-props/use-block-refs';\n\nfunction getComputedCSS( element, property ) {\n\treturn element.ownerDocument.defaultView\n\t\t.getComputedStyle( element )\n\t\t.getPropertyValue( property );\n}\n\nexport function MarginVisualizer( { clientId, attributes, forceShow } ) {\n\tconst blockElement = useBlockElement( clientId );\n\tconst [ style, setStyle ] = useState();\n\n\tconst margin = attributes?.style?.spacing?.margin;\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\t! blockElement ||\n\t\t\tnull === blockElement.ownerDocument.defaultView\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst top = getComputedCSS( blockElement, 'margin-top' );\n\t\tconst right = getComputedCSS( blockElement, 'margin-right' );\n\t\tconst bottom = getComputedCSS( blockElement, 'margin-bottom' );\n\t\tconst left = getComputedCSS( blockElement, 'margin-left' );\n\n\t\tsetStyle( {\n\t\t\tborderTopWidth: top,\n\t\t\tborderRightWidth: right,\n\t\t\tborderBottomWidth: bottom,\n\t\t\tborderLeftWidth: left,\n\t\t\ttop: top ? `-${ top }` : 0,\n\t\t\tright: right ? `-${ right }` : 0,\n\t\t\tbottom: bottom ? `-${ bottom }` : 0,\n\t\t\tleft: left ? `-${ left }` : 0,\n\t\t} );\n\t}, [ blockElement, margin ] );\n\n\tconst [ isActive, setIsActive ] = useState( false );\n\tconst valueRef = useRef( margin );\n\tconst timeoutRef = useRef();\n\n\tconst clearTimer = () => {\n\t\tif ( timeoutRef.current ) {\n\t\t\twindow.clearTimeout( timeoutRef.current );\n\t\t}\n\t};\n\n\tuseEffect( () => {\n\t\tif ( ! isShallowEqual( margin, valueRef.current ) && ! forceShow ) {\n\t\t\tsetIsActive( true );\n\t\t\tvalueRef.current = margin;\n\n\t\t\ttimeoutRef.current = setTimeout( () => {\n\t\t\t\tsetIsActive( false );\n\t\t\t}, 400 );\n\t\t}\n\n\t\treturn () => {\n\t\t\tsetIsActive( false );\n\t\t\tclearTimer();\n\t\t};\n\t}, [ margin, forceShow ] );\n\n\tif ( ! isActive && ! forceShow ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<BlockPopover\n\t\t\tclientId={ clientId }\n\t\t\t__unstableCoverTarget\n\t\t\t__unstableRefreshSize={ margin }\n\t\t\t__unstablePopoverSlot=\"block-toolbar\"\n\t\t\tshift={ false }\n\t\t>\n\t\t\t<div className=\"block-editor__padding-visualizer\" style={ style } />\n\t\t</BlockPopover>\n\t);\n}\n"]}
+{"version":3,"names":["useState","useRef","useEffect","isShallowEqual","BlockPopover","__unstableUseBlockElement","useBlockElement","getComputedCSS","element","property","ownerDocument","defaultView","getComputedStyle","getPropertyValue","MarginVisualizer","clientId","attributes","forceShow","blockElement","style","setStyle","margin","spacing","top","right","bottom","left","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","isActive","setIsActive","valueRef","timeoutRef","clearTimer","current","window","clearTimeout","setTimeout","createElement","__unstableCoverTarget","__unstableRefreshSize","__unstablePopoverSlot","shift","className"],"sources":["@wordpress/block-editor/src/hooks/margin.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useRef, useEffect } from '@wordpress/element';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport BlockPopover from '../components/block-popover';\nimport { __unstableUseBlockElement as useBlockElement } from '../components/block-list/use-block-props/use-block-refs';\n\nfunction getComputedCSS( element, property ) {\n\treturn element.ownerDocument.defaultView\n\t\t.getComputedStyle( element )\n\t\t.getPropertyValue( property );\n}\n\nexport function MarginVisualizer( { clientId, attributes, forceShow } ) {\n\tconst blockElement = useBlockElement( clientId );\n\tconst [ style, setStyle ] = useState();\n\n\tconst margin = attributes?.style?.spacing?.margin;\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\t! blockElement ||\n\t\t\tnull === blockElement.ownerDocument.defaultView\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst top = getComputedCSS( blockElement, 'margin-top' );\n\t\tconst right = getComputedCSS( blockElement, 'margin-right' );\n\t\tconst bottom = getComputedCSS( blockElement, 'margin-bottom' );\n\t\tconst left = getComputedCSS( blockElement, 'margin-left' );\n\n\t\tsetStyle( {\n\t\t\tborderTopWidth: top,\n\t\t\tborderRightWidth: right,\n\t\t\tborderBottomWidth: bottom,\n\t\t\tborderLeftWidth: left,\n\t\t\ttop: top ? `-${ top }` : 0,\n\t\t\tright: right ? `-${ right }` : 0,\n\t\t\tbottom: bottom ? `-${ bottom }` : 0,\n\t\t\tleft: left ? `-${ left }` : 0,\n\t\t} );\n\t}, [ blockElement, margin ] );\n\n\tconst [ isActive, setIsActive ] = useState( false );\n\tconst valueRef = useRef( margin );\n\tconst timeoutRef = useRef();\n\n\tconst clearTimer = () => {\n\t\tif ( timeoutRef.current ) {\n\t\t\twindow.clearTimeout( timeoutRef.current );\n\t\t}\n\t};\n\n\tuseEffect( () => {\n\t\tif ( ! isShallowEqual( margin, valueRef.current ) && ! forceShow ) {\n\t\t\tsetIsActive( true );\n\t\t\tvalueRef.current = margin;\n\n\t\t\ttimeoutRef.current = setTimeout( () => {\n\t\t\t\tsetIsActive( false );\n\t\t\t}, 400 );\n\t\t}\n\n\t\treturn () => {\n\t\t\tsetIsActive( false );\n\t\t\tclearTimer();\n\t\t};\n\t}, [ margin, forceShow ] );\n\n\tif ( ! isActive && ! forceShow ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<BlockPopover\n\t\t\tclientId={ clientId }\n\t\t\t__unstableCoverTarget\n\t\t\t__unstableRefreshSize={ margin }\n\t\t\t__unstablePopoverSlot=\"block-toolbar\"\n\t\t\tshift={ false }\n\t\t>\n\t\t\t<div className=\"block-editor__padding-visualizer\" style={ style } />\n\t\t</BlockPopover>\n\t);\n}\n"],"mappings":"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"}

package/build-module/hooks/metadata-name.js

@@ -5,8 +5,8 @@ import { addFilter } from '@wordpress/hooks';
 /**
  * Internal dependencies
  */
-
 import { hasBlockMetadataSupport } from './metadata';
+
 /**
  * Filters registered block settings, adding an `__experimentalLabel` callback if one does not already exist.
  *
@@ -14,30 +14,29 @@ import { hasBlockMetadataSupport } from './metadata';
  *
  * @return {Object} Filtered block settings.
  */
-
 export function addLabelCallback(settings) {
   // If blocks provide their own label callback, do not override it.
   if (settings.__experimentalLabel) {
     return settings;
   }
-
   const supportsBlockNaming = hasBlockMetadataSupport(settings, 'name', false // default value
-  ); // Check whether block metadata is supported before using it.
+  );
 
+  // Check whether block metadata is supported before using it.
   if (supportsBlockNaming) {
     settings.__experimentalLabel = (attributes, {
       context
     }) => {
       const {
         metadata
-      } = attributes; // In the list view, use the block's name attribute as the label.
+      } = attributes;
 
+      // In the list view, use the block's name attribute as the label.
       if (context === 'list-view' && metadata?.name) {
         return metadata.name;
       }
     };
   }
-
   return settings;
 }
 addFilter('blocks.registerBlockType', 'core/metadata/addLabelCallback', addLabelCallback);

package/build-module/hooks/metadata-name.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/hooks/metadata-name.js"],"names":["addFilter","hasBlockMetadataSupport","addLabelCallback","settings","__experimentalLabel","supportsBlockNaming","attributes","context","metadata","name"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,QAA0B,kBAA1B;AACA;AACA;AACA;;AACA,SAASC,uBAAT,QAAwC,YAAxC;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,gBAAT,CAA2BC,QAA3B,EAAsC;AAC5C;AACA,MAAKA,QAAQ,CAACC,mBAAd,EAAoC;AACnC,WAAOD,QAAP;AACA;;AAED,QAAME,mBAAmB,GAAGJ,uBAAuB,CAClDE,QADkD,EAElD,MAFkD,EAGlD,KAHkD,CAG5C;AAH4C,GAAnD,CAN4C,CAY5C;;AACA,MAAKE,mBAAL,EAA2B;AAC1BF,IAAAA,QAAQ,CAACC,mBAAT,GAA+B,CAAEE,UAAF,EAAc;AAAEC,MAAAA;AAAF,KAAd,KAA+B;AAC7D,YAAM;AAAEC,QAAAA;AAAF,UAAeF,UAArB,CAD6D,CAG7D;;AACA,UAAKC,OAAO,KAAK,WAAZ,IAA2BC,QAAQ,EAAEC,IAA1C,EAAiD;AAChD,eAAOD,QAAQ,CAACC,IAAhB;AACA;AACD,KAPD;AAQA;;AAED,SAAON,QAAP;AACA;AAEDH,SAAS,CACR,0BADQ,EAER,gCAFQ,EAGRE,gBAHQ,CAAT","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\n/**\n * Internal dependencies\n */\nimport { hasBlockMetadataSupport } from './metadata';\n\n/**\n * Filters registered block settings, adding an `__experimentalLabel` callback if one does not already exist.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nexport function addLabelCallback( settings ) {\n\t// If blocks provide their own label callback, do not override it.\n\tif ( settings.__experimentalLabel ) {\n\t\treturn settings;\n\t}\n\n\tconst supportsBlockNaming = hasBlockMetadataSupport(\n\t\tsettings,\n\t\t'name',\n\t\tfalse // default value\n\t);\n\n\t// Check whether block metadata is supported before using it.\n\tif ( supportsBlockNaming ) {\n\t\tsettings.__experimentalLabel = ( attributes, { context } ) => {\n\t\t\tconst { metadata } = attributes;\n\n\t\t\t// In the list view, use the block's name attribute as the label.\n\t\t\tif ( context === 'list-view' && metadata?.name ) {\n\t\t\t\treturn metadata.name;\n\t\t\t}\n\t\t};\n\t}\n\n\treturn settings;\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/metadata/addLabelCallback',\n\taddLabelCallback\n);\n"]}
+{"version":3,"names":["addFilter","hasBlockMetadataSupport","addLabelCallback","settings","__experimentalLabel","supportsBlockNaming","attributes","context","metadata","name"],"sources":["@wordpress/block-editor/src/hooks/metadata-name.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\n/**\n * Internal dependencies\n */\nimport { hasBlockMetadataSupport } from './metadata';\n\n/**\n * Filters registered block settings, adding an `__experimentalLabel` callback if one does not already exist.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nexport function addLabelCallback( settings ) {\n\t// If blocks provide their own label callback, do not override it.\n\tif ( settings.__experimentalLabel ) {\n\t\treturn settings;\n\t}\n\n\tconst supportsBlockNaming = hasBlockMetadataSupport(\n\t\tsettings,\n\t\t'name',\n\t\tfalse // default value\n\t);\n\n\t// Check whether block metadata is supported before using it.\n\tif ( supportsBlockNaming ) {\n\t\tsettings.__experimentalLabel = ( attributes, { context } ) => {\n\t\t\tconst { metadata } = attributes;\n\n\t\t\t// In the list view, use the block's name attribute as the label.\n\t\t\tif ( context === 'list-view' && metadata?.name ) {\n\t\t\t\treturn metadata.name;\n\t\t\t}\n\t\t};\n\t}\n\n\treturn settings;\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/metadata/addLabelCallback',\n\taddLabelCallback\n);\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAS,QAAQ,kBAAkB;AAC5C;AACA;AACA;AACA,SAASC,uBAAuB,QAAQ,YAAY;;AAEpD;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,gBAAgBA,CAAEC,QAAQ,EAAG;EAC5C;EACA,IAAKA,QAAQ,CAACC,mBAAmB,EAAG;IACnC,OAAOD,QAAQ;EAChB;EAEA,MAAME,mBAAmB,GAAGJ,uBAAuB,CAClDE,QAAQ,EACR,MAAM,EACN,KAAK,CAAC;EACP,CAAC;;EAED;EACA,IAAKE,mBAAmB,EAAG;IAC1BF,QAAQ,CAACC,mBAAmB,GAAG,CAAEE,UAAU,EAAE;MAAEC;IAAQ,CAAC,KAAM;MAC7D,MAAM;QAAEC;MAAS,CAAC,GAAGF,UAAU;;MAE/B;MACA,IAAKC,OAAO,KAAK,WAAW,IAAIC,QAAQ,EAAEC,IAAI,EAAG;QAChD,OAAOD,QAAQ,CAACC,IAAI;MACrB;IACD,CAAC;EACF;EAEA,OAAON,QAAQ;AAChB;AAEAH,SAAS,CACR,0BAA0B,EAC1B,gCAAgC,EAChCE,gBACD,CAAC"}

package/build-module/hooks/metadata.js

@@ -9,10 +9,10 @@ export function hasBlockMetadataSupport(blockType, feature = '') {
   if (!blockType.name.startsWith('core/')) {
     return false;
   }
-
   const support = getBlockSupport(blockType, '__experimentalMetadata');
   return !!(true === support || support?.[feature]);
 }
+
 /**
  * Filters registered block settings, extending attributes to include `metadata`.
  *
@@ -21,30 +21,26 @@ export function hasBlockMetadataSupport(blockType, feature = '') {
  * @param {Object} blockTypeSettings Original block settings.
  * @return {Object} Filtered block settings.
  */
-
 export function addMetaAttribute(blockTypeSettings) {
   // Allow blocks to specify their own attribute definition with default values if needed.
   if (blockTypeSettings?.attributes?.[META_ATTRIBUTE_NAME]?.type) {
     return blockTypeSettings;
   }
-
   const supportsBlockNaming = hasBlockMetadataSupport(blockTypeSettings, 'name');
-
   if (supportsBlockNaming) {
-    blockTypeSettings.attributes = { ...blockTypeSettings.attributes,
+    blockTypeSettings.attributes = {
+      ...blockTypeSettings.attributes,
       [META_ATTRIBUTE_NAME]: {
         type: 'object'
       }
     };
   }
-
   return blockTypeSettings;
 }
 export function addSaveProps(extraProps, blockType, attributes) {
   if (hasBlockMetadataSupport(blockType)) {
     extraProps[META_ATTRIBUTE_NAME] = attributes[META_ATTRIBUTE_NAME];
   }
-
   return extraProps;
 }
 addFilter('blocks.registerBlockType', 'core/metadata/addMetaAttribute', addMetaAttribute);

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/hooks/metadata.js"],"names":["addFilter","getBlockSupport","META_ATTRIBUTE_NAME","hasBlockMetadataSupport","blockType","feature","name","startsWith","support","addMetaAttribute","blockTypeSettings","attributes","type","supportsBlockNaming","addSaveProps","extraProps"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,QAA0B,kBAA1B;AACA,SAASC,eAAT,QAAgC,mBAAhC;AAEA,MAAMC,mBAAmB,GAAG,UAA5B;AAEA,OAAO,SAASC,uBAAT,CAAkCC,SAAlC,EAA6CC,OAAO,GAAG,EAAvD,EAA4D;AAClE;AACA,MAAK,CAAED,SAAS,CAACE,IAAV,CAAeC,UAAf,CAA2B,OAA3B,CAAP,EAA8C;AAC7C,WAAO,KAAP;AACA;;AACD,QAAMC,OAAO,GAAGP,eAAe,CAAEG,SAAF,EAAa,wBAAb,CAA/B;AACA,SAAO,CAAC,EAAI,SAASI,OAAT,IAAoBA,OAAO,GAAIH,OAAJ,CAA/B,CAAR;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASI,gBAAT,CAA2BC,iBAA3B,EAA+C;AACrD;AACA,MAAKA,iBAAiB,EAAEC,UAAnB,GAAiCT,mBAAjC,GAAwDU,IAA7D,EAAoE;AACnE,WAAOF,iBAAP;AACA;;AAED,QAAMG,mBAAmB,GAAGV,uBAAuB,CAClDO,iBADkD,EAElD,MAFkD,CAAnD;;AAKA,MAAKG,mBAAL,EAA2B;AAC1BH,IAAAA,iBAAiB,CAACC,UAAlB,GAA+B,EAC9B,GAAGD,iBAAiB,CAACC,UADS;AAE9B,OAAET,mBAAF,GAAyB;AACxBU,QAAAA,IAAI,EAAE;AADkB;AAFK,KAA/B;AAMA;;AAED,SAAOF,iBAAP;AACA;AAED,OAAO,SAASI,YAAT,CAAuBC,UAAvB,EAAmCX,SAAnC,EAA8CO,UAA9C,EAA2D;AACjE,MAAKR,uBAAuB,CAAEC,SAAF,CAA5B,EAA4C;AAC3CW,IAAAA,UAAU,CAAEb,mBAAF,CAAV,GAAoCS,UAAU,CAAET,mBAAF,CAA9C;AACA;;AAED,SAAOa,UAAP;AACA;AAEDf,SAAS,CACR,0BADQ,EAER,gCAFQ,EAGRS,gBAHQ,CAAT;AAMAT,SAAS,CACR,kCADQ,EAER,0BAFQ,EAGRc,YAHQ,CAAT","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { getBlockSupport } from '@wordpress/blocks';\n\nconst META_ATTRIBUTE_NAME = 'metadata';\n\nexport function hasBlockMetadataSupport( blockType, feature = '' ) {\n\t// Only core blocks are allowed to use __experimentalMetadata until the fetaure is stablised.\n\tif ( ! blockType.name.startsWith( 'core/' ) ) {\n\t\treturn false;\n\t}\n\tconst support = getBlockSupport( blockType, '__experimentalMetadata' );\n\treturn !! ( true === support || support?.[ feature ] );\n}\n\n/**\n * Filters registered block settings, extending attributes to include `metadata`.\n *\n * see: https://github.com/WordPress/gutenberg/pull/40393/files#r864632012\n *\n * @param {Object} blockTypeSettings Original block settings.\n * @return {Object} Filtered block settings.\n */\nexport function addMetaAttribute( blockTypeSettings ) {\n\t// Allow blocks to specify their own attribute definition with default values if needed.\n\tif ( blockTypeSettings?.attributes?.[ META_ATTRIBUTE_NAME ]?.type ) {\n\t\treturn blockTypeSettings;\n\t}\n\n\tconst supportsBlockNaming = hasBlockMetadataSupport(\n\t\tblockTypeSettings,\n\t\t'name'\n\t);\n\n\tif ( supportsBlockNaming ) {\n\t\tblockTypeSettings.attributes = {\n\t\t\t...blockTypeSettings.attributes,\n\t\t\t[ META_ATTRIBUTE_NAME ]: {\n\t\t\t\ttype: 'object',\n\t\t\t},\n\t\t};\n\t}\n\n\treturn blockTypeSettings;\n}\n\nexport function addSaveProps( extraProps, blockType, attributes ) {\n\tif ( hasBlockMetadataSupport( blockType ) ) {\n\t\textraProps[ META_ATTRIBUTE_NAME ] = attributes[ META_ATTRIBUTE_NAME ];\n\t}\n\n\treturn extraProps;\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/metadata/addMetaAttribute',\n\taddMetaAttribute\n);\n\naddFilter(\n\t'blocks.getSaveContent.extraProps',\n\t'core/metadata/save-props',\n\taddSaveProps\n);\n"]}
+{"version":3,"names":["addFilter","getBlockSupport","META_ATTRIBUTE_NAME","hasBlockMetadataSupport","blockType","feature","name","startsWith","support","addMetaAttribute","blockTypeSettings","attributes","type","supportsBlockNaming","addSaveProps","extraProps"],"sources":["@wordpress/block-editor/src/hooks/metadata.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { getBlockSupport } from '@wordpress/blocks';\n\nconst META_ATTRIBUTE_NAME = 'metadata';\n\nexport function hasBlockMetadataSupport( blockType, feature = '' ) {\n\t// Only core blocks are allowed to use __experimentalMetadata until the fetaure is stablised.\n\tif ( ! blockType.name.startsWith( 'core/' ) ) {\n\t\treturn false;\n\t}\n\tconst support = getBlockSupport( blockType, '__experimentalMetadata' );\n\treturn !! ( true === support || support?.[ feature ] );\n}\n\n/**\n * Filters registered block settings, extending attributes to include `metadata`.\n *\n * see: https://github.com/WordPress/gutenberg/pull/40393/files#r864632012\n *\n * @param {Object} blockTypeSettings Original block settings.\n * @return {Object} Filtered block settings.\n */\nexport function addMetaAttribute( blockTypeSettings ) {\n\t// Allow blocks to specify their own attribute definition with default values if needed.\n\tif ( blockTypeSettings?.attributes?.[ META_ATTRIBUTE_NAME ]?.type ) {\n\t\treturn blockTypeSettings;\n\t}\n\n\tconst supportsBlockNaming = hasBlockMetadataSupport(\n\t\tblockTypeSettings,\n\t\t'name'\n\t);\n\n\tif ( supportsBlockNaming ) {\n\t\tblockTypeSettings.attributes = {\n\t\t\t...blockTypeSettings.attributes,\n\t\t\t[ META_ATTRIBUTE_NAME ]: {\n\t\t\t\ttype: 'object',\n\t\t\t},\n\t\t};\n\t}\n\n\treturn blockTypeSettings;\n}\n\nexport function addSaveProps( extraProps, blockType, attributes ) {\n\tif ( hasBlockMetadataSupport( blockType ) ) {\n\t\textraProps[ META_ATTRIBUTE_NAME ] = attributes[ META_ATTRIBUTE_NAME ];\n\t}\n\n\treturn extraProps;\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/metadata/addMetaAttribute',\n\taddMetaAttribute\n);\n\naddFilter(\n\t'blocks.getSaveContent.extraProps',\n\t'core/metadata/save-props',\n\taddSaveProps\n);\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAS,QAAQ,kBAAkB;AAC5C,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,MAAMC,mBAAmB,GAAG,UAAU;AAEtC,OAAO,SAASC,uBAAuBA,CAAEC,SAAS,EAAEC,OAAO,GAAG,EAAE,EAAG;EAClE;EACA,IAAK,CAAED,SAAS,CAACE,IAAI,CAACC,UAAU,CAAE,OAAQ,CAAC,EAAG;IAC7C,OAAO,KAAK;EACb;EACA,MAAMC,OAAO,GAAGP,eAAe,CAAEG,SAAS,EAAE,wBAAyB,CAAC;EACtE,OAAO,CAAC,EAAI,IAAI,KAAKI,OAAO,IAAIA,OAAO,GAAIH,OAAO,CAAE,CAAE;AACvD;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASI,gBAAgBA,CAAEC,iBAAiB,EAAG;EACrD;EACA,IAAKA,iBAAiB,EAAEC,UAAU,GAAIT,mBAAmB,CAAE,EAAEU,IAAI,EAAG;IACnE,OAAOF,iBAAiB;EACzB;EAEA,MAAMG,mBAAmB,GAAGV,uBAAuB,CAClDO,iBAAiB,EACjB,MACD,CAAC;EAED,IAAKG,mBAAmB,EAAG;IAC1BH,iBAAiB,CAACC,UAAU,GAAG;MAC9B,GAAGD,iBAAiB,CAACC,UAAU;MAC/B,CAAET,mBAAmB,GAAI;QACxBU,IAAI,EAAE;MACP;IACD,CAAC;EACF;EAEA,OAAOF,iBAAiB;AACzB;AAEA,OAAO,SAASI,YAAYA,CAAEC,UAAU,EAAEX,SAAS,EAAEO,UAAU,EAAG;EACjE,IAAKR,uBAAuB,CAAEC,SAAU,CAAC,EAAG;IAC3CW,UAAU,CAAEb,mBAAmB,CAAE,GAAGS,UAAU,CAAET,mBAAmB,CAAE;EACtE;EAEA,OAAOa,UAAU;AAClB;AAEAf,SAAS,CACR,0BAA0B,EAC1B,gCAAgC,EAChCS,gBACD,CAAC;AAEDT,SAAS,CACR,kCAAkC,EAClC,0BAA0B,EAC1Bc,YACD,CAAC"}

package/build-module/hooks/padding.js

@@ -1,21 +1,18 @@
 import { createElement } from "@wordpress/element";
-
 /**
  * WordPress dependencies
  */
 import { useState, useRef, useEffect } from '@wordpress/element';
 import isShallowEqual from '@wordpress/is-shallow-equal';
+
 /**
  * Internal dependencies
  */
-
 import BlockPopover from '../components/block-popover';
 import { __unstableUseBlockElement as useBlockElement } from '../components/block-list/use-block-props/use-block-refs';
-
 function getComputedCSS(element, property) {
   return element.ownerDocument.defaultView.getComputedStyle(element).getPropertyValue(property);
 }
-
 export function PaddingVisualizer({
   clientId,
   attributes,
@@ -28,7 +25,6 @@ export function PaddingVisualizer({
     if (!blockElement || null === blockElement.ownerDocument.defaultView) {
       return;
     }
-
     setStyle({
       borderTopWidth: getComputedCSS(blockElement, 'padding-top'),
       borderRightWidth: getComputedCSS(blockElement, 'padding-right'),
@@ -39,13 +35,11 @@ export function PaddingVisualizer({
   const [isActive, setIsActive] = useState(false);
   const valueRef = useRef(padding);
   const timeoutRef = useRef();
-
   const clearTimer = () => {
     if (timeoutRef.current) {
       window.clearTimeout(timeoutRef.current);
     }
   };
-
   useEffect(() => {
     if (!isShallowEqual(padding, valueRef.current) && !forceShow) {
       setIsActive(true);
@@ -54,17 +48,14 @@ export function PaddingVisualizer({
         setIsActive(false);
       }, 400);
     }
-
     return () => {
       setIsActive(false);
       clearTimer();
     };
   }, [padding, forceShow]);
-
   if (!isActive && !forceShow) {
     return null;
   }
-
   return createElement(BlockPopover, {
     clientId: clientId,
     __unstableCoverTarget: true,

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/hooks/padding.js"],"names":["useState","useRef","useEffect","isShallowEqual","BlockPopover","__unstableUseBlockElement","useBlockElement","getComputedCSS","element","property","ownerDocument","defaultView","getComputedStyle","getPropertyValue","PaddingVisualizer","clientId","attributes","forceShow","blockElement","style","setStyle","padding","spacing","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","isActive","setIsActive","valueRef","timeoutRef","clearTimer","current","window","clearTimeout","setTimeout"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useRef, useEffect } from '@wordpress/element';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport BlockPopover from '../components/block-popover';\nimport { __unstableUseBlockElement as useBlockElement } from '../components/block-list/use-block-props/use-block-refs';\n\nfunction getComputedCSS( element, property ) {\n\treturn element.ownerDocument.defaultView\n\t\t.getComputedStyle( element )\n\t\t.getPropertyValue( property );\n}\n\nexport function PaddingVisualizer( { clientId, attributes, forceShow } ) {\n\tconst blockElement = useBlockElement( clientId );\n\tconst [ style, setStyle ] = useState();\n\n\tconst padding = attributes?.style?.spacing?.padding;\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\t! blockElement ||\n\t\t\tnull === blockElement.ownerDocument.defaultView\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetStyle( {\n\t\t\tborderTopWidth: getComputedCSS( blockElement, 'padding-top' ),\n\t\t\tborderRightWidth: getComputedCSS( blockElement, 'padding-right' ),\n\t\t\tborderBottomWidth: getComputedCSS( blockElement, 'padding-bottom' ),\n\t\t\tborderLeftWidth: getComputedCSS( blockElement, 'padding-left' ),\n\t\t} );\n\t}, [ blockElement, padding ] );\n\n\tconst [ isActive, setIsActive ] = useState( false );\n\tconst valueRef = useRef( padding );\n\tconst timeoutRef = useRef();\n\n\tconst clearTimer = () => {\n\t\tif ( timeoutRef.current ) {\n\t\t\twindow.clearTimeout( timeoutRef.current );\n\t\t}\n\t};\n\n\tuseEffect( () => {\n\t\tif ( ! isShallowEqual( padding, valueRef.current ) && ! forceShow ) {\n\t\t\tsetIsActive( true );\n\t\t\tvalueRef.current = padding;\n\n\t\t\ttimeoutRef.current = setTimeout( () => {\n\t\t\t\tsetIsActive( false );\n\t\t\t}, 400 );\n\t\t}\n\n\t\treturn () => {\n\t\t\tsetIsActive( false );\n\t\t\tclearTimer();\n\t\t};\n\t}, [ padding, forceShow ] );\n\n\tif ( ! isActive && ! forceShow ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<BlockPopover\n\t\t\tclientId={ clientId }\n\t\t\t__unstableCoverTarget\n\t\t\t__unstableRefreshSize={ padding }\n\t\t\t__unstablePopoverSlot=\"block-toolbar\"\n\t\t\tshift={ false }\n\t\t>\n\t\t\t<div className=\"block-editor__padding-visualizer\" style={ style } />\n\t\t</BlockPopover>\n\t);\n}\n"]}
+{"version":3,"names":["useState","useRef","useEffect","isShallowEqual","BlockPopover","__unstableUseBlockElement","useBlockElement","getComputedCSS","element","property","ownerDocument","defaultView","getComputedStyle","getPropertyValue","PaddingVisualizer","clientId","attributes","forceShow","blockElement","style","setStyle","padding","spacing","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","isActive","setIsActive","valueRef","timeoutRef","clearTimer","current","window","clearTimeout","setTimeout","createElement","__unstableCoverTarget","__unstableRefreshSize","__unstablePopoverSlot","shift","className"],"sources":["@wordpress/block-editor/src/hooks/padding.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useRef, useEffect } from '@wordpress/element';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport BlockPopover from '../components/block-popover';\nimport { __unstableUseBlockElement as useBlockElement } from '../components/block-list/use-block-props/use-block-refs';\n\nfunction getComputedCSS( element, property ) {\n\treturn element.ownerDocument.defaultView\n\t\t.getComputedStyle( element )\n\t\t.getPropertyValue( property );\n}\n\nexport function PaddingVisualizer( { clientId, attributes, forceShow } ) {\n\tconst blockElement = useBlockElement( clientId );\n\tconst [ style, setStyle ] = useState();\n\n\tconst padding = attributes?.style?.spacing?.padding;\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\t! blockElement ||\n\t\t\tnull === blockElement.ownerDocument.defaultView\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetStyle( {\n\t\t\tborderTopWidth: getComputedCSS( blockElement, 'padding-top' ),\n\t\t\tborderRightWidth: getComputedCSS( blockElement, 'padding-right' ),\n\t\t\tborderBottomWidth: getComputedCSS( blockElement, 'padding-bottom' ),\n\t\t\tborderLeftWidth: getComputedCSS( blockElement, 'padding-left' ),\n\t\t} );\n\t}, [ blockElement, padding ] );\n\n\tconst [ isActive, setIsActive ] = useState( false );\n\tconst valueRef = useRef( padding );\n\tconst timeoutRef = useRef();\n\n\tconst clearTimer = () => {\n\t\tif ( timeoutRef.current ) {\n\t\t\twindow.clearTimeout( timeoutRef.current );\n\t\t}\n\t};\n\n\tuseEffect( () => {\n\t\tif ( ! isShallowEqual( padding, valueRef.current ) && ! forceShow ) {\n\t\t\tsetIsActive( true );\n\t\t\tvalueRef.current = padding;\n\n\t\t\ttimeoutRef.current = setTimeout( () => {\n\t\t\t\tsetIsActive( false );\n\t\t\t}, 400 );\n\t\t}\n\n\t\treturn () => {\n\t\t\tsetIsActive( false );\n\t\t\tclearTimer();\n\t\t};\n\t}, [ padding, forceShow ] );\n\n\tif ( ! isActive && ! forceShow ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<BlockPopover\n\t\t\tclientId={ clientId }\n\t\t\t__unstableCoverTarget\n\t\t\t__unstableRefreshSize={ padding }\n\t\t\t__unstablePopoverSlot=\"block-toolbar\"\n\t\t\tshift={ false }\n\t\t>\n\t\t\t<div className=\"block-editor__padding-visualizer\" style={ style } />\n\t\t</BlockPopover>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,QAAQ,EAAEC,MAAM,EAAEC,SAAS,QAAQ,oBAAoB;AAChE,OAAOC,cAAc,MAAM,6BAA6B;;AAExD;AACA;AACA;AACA,OAAOC,YAAY,MAAM,6BAA6B;AACtD,SAASC,yBAAyB,IAAIC,eAAe,QAAQ,yDAAyD;AAEtH,SAASC,cAAcA,CAAEC,OAAO,EAAEC,QAAQ,EAAG;EAC5C,OAAOD,OAAO,CAACE,aAAa,CAACC,WAAW,CACtCC,gBAAgB,CAAEJ,OAAQ,CAAC,CAC3BK,gBAAgB,CAAEJ,QAAS,CAAC;AAC/B;AAEA,OAAO,SAASK,iBAAiBA,CAAE;EAAEC,QAAQ;EAAEC,UAAU;EAAEC;AAAU,CAAC,EAAG;EACxE,MAAMC,YAAY,GAAGZ,eAAe,CAAES,QAAS,CAAC;EAChD,MAAM,CAAEI,KAAK,EAAEC,QAAQ,CAAE,GAAGpB,QAAQ,CAAC,CAAC;EAEtC,MAAMqB,OAAO,GAAGL,UAAU,EAAEG,KAAK,EAAEG,OAAO,EAAED,OAAO;EAEnDnB,SAAS,CAAE,MAAM;IAChB,IACC,CAAEgB,YAAY,IACd,IAAI,KAAKA,YAAY,CAACR,aAAa,CAACC,WAAW,EAC9C;MACD;IACD;IAEAS,QAAQ,CAAE;MACTG,cAAc,EAAEhB,cAAc,CAAEW,YAAY,EAAE,aAAc,CAAC;MAC7DM,gBAAgB,EAAEjB,cAAc,CAAEW,YAAY,EAAE,eAAgB,CAAC;MACjEO,iBAAiB,EAAElB,cAAc,CAAEW,YAAY,EAAE,gBAAiB,CAAC;MACnEQ,eAAe,EAAEnB,cAAc,CAAEW,YAAY,EAAE,cAAe;IAC/D,CAAE,CAAC;EACJ,CAAC,EAAE,CAAEA,YAAY,EAAEG,OAAO,CAAG,CAAC;EAE9B,MAAM,CAAEM,QAAQ,EAAEC,WAAW,CAAE,GAAG5B,QAAQ,CAAE,KAAM,CAAC;EACnD,MAAM6B,QAAQ,GAAG5B,MAAM,CAAEoB,OAAQ,CAAC;EAClC,MAAMS,UAAU,GAAG7B,MAAM,CAAC,CAAC;EAE3B,MAAM8B,UAAU,GAAGA,CAAA,KAAM;IACxB,IAAKD,UAAU,CAACE,OAAO,EAAG;MACzBC,MAAM,CAACC,YAAY,CAAEJ,UAAU,CAACE,OAAQ,CAAC;IAC1C;EACD,CAAC;EAED9B,SAAS,CAAE,MAAM;IAChB,IAAK,CAAEC,cAAc,CAAEkB,OAAO,EAAEQ,QAAQ,CAACG,OAAQ,CAAC,IAAI,CAAEf,SAAS,EAAG;MACnEW,WAAW,CAAE,IAAK,CAAC;MACnBC,QAAQ,CAACG,OAAO,GAAGX,OAAO;MAE1BS,UAAU,CAACE,OAAO,GAAGG,UAAU,CAAE,MAAM;QACtCP,WAAW,CAAE,KAAM,CAAC;MACrB,CAAC,EAAE,GAAI,CAAC;IACT;IAEA,OAAO,MAAM;MACZA,WAAW,CAAE,KAAM,CAAC;MACpBG,UAAU,CAAC,CAAC;IACb,CAAC;EACF,CAAC,EAAE,CAAEV,OAAO,EAAEJ,SAAS,CAAG,CAAC;EAE3B,IAAK,CAAEU,QAAQ,IAAI,CAAEV,SAAS,EAAG;IAChC,OAAO,IAAI;EACZ;EAEA,OACCmB,aAAA,CAAChC,YAAY;IACZW,QAAQ,EAAGA,QAAU;IACrBsB,qBAAqB;IACrBC,qBAAqB,EAAGjB,OAAS;IACjCkB,qBAAqB,EAAC,eAAe;IACrCC,KAAK,EAAG;EAAO,GAEfJ,aAAA;IAAKK,SAAS,EAAC,kCAAkC;IAACtB,KAAK,EAAGA;EAAO,CAAE,CACtD,CAAC;AAEjB"}

package/build-module/hooks/position.js

@@ -1,13 +1,12 @@
 import { createElement, Fragment } from "@wordpress/element";
-
 /**
  * External dependencies
  */
 import classnames from 'classnames';
+
 /**
  * WordPress dependencies
  */
-
 import { __, _x, sprintf } from '@wordpress/i18n';
 import { getBlockSupport, hasBlockSupport } from '@wordpress/blocks';
 import { BaseControl, privateApis as componentsPrivateApis } from '@wordpress/components';
@@ -15,10 +14,10 @@ import { createHigherOrderComponent, useInstanceId } from '@wordpress/compose';
 import { useSelect } from '@wordpress/data';
 import { useContext, useMemo, createPortal, Platform } from '@wordpress/element';
 import { addFilter } from '@wordpress/hooks';
+
 /**
  * Internal dependencies
  */
-
 import BlockList from '../components/block-list';
 import useSetting from '../components/use-setting';
 import InspectorControls from '../components/inspector-controls';
@@ -53,6 +52,7 @@ const FIXED_OPTION = {
 };
 const POSITION_SIDES = ['top', 'right', 'bottom', 'left'];
 const VALID_POSITION_TYPES = ['sticky', 'fixed'];
+
 /**
  * Get calculated position CSS.
  *
@@ -61,7 +61,6 @@ const VALID_POSITION_TYPES = ['sticky', 'fixed'];
  * @param {Object} props.style    Style object.
  * @return {string} The generated CSS rules.
  */
-
 export function getPositionCSS({
   selector,
   style
@@ -70,11 +69,9 @@ export function getPositionCSS({
   const {
     type: positionType
   } = style?.position || {};
-
   if (!VALID_POSITION_TYPES.includes(positionType)) {
     return output;
   }
-
   output += `${selector} {`;
   output += `position: ${positionType};`;
   POSITION_SIDES.forEach(side => {
@@ -82,15 +79,14 @@ export function getPositionCSS({
       output += `${side}: ${style.position[side]};`;
     }
   });
-
   if (positionType === 'sticky' || positionType === 'fixed') {
     // TODO: Replace hard-coded z-index value with a z-index preset approach in theme.json.
     output += `z-index: 10`;
   }
-
   output += `}`;
   return output;
 }
+
 /**
  * Determines if there is sticky position support.
  *
@@ -98,11 +94,11 @@ export function getPositionCSS({
  *
  * @return {boolean} Whether there is support.
  */
-
 export function hasStickyPositionSupport(blockType) {
   const support = getBlockSupport(blockType, POSITION_SUPPORT_KEY);
   return !!(true === support || support?.sticky);
 }
+
 /**
  * Determines if there is fixed position support.
  *
@@ -110,11 +106,11 @@ export function hasStickyPositionSupport(blockType) {
  *
  * @return {boolean} Whether there is support.
  */
-
 export function hasFixedPositionSupport(blockType) {
   const support = getBlockSupport(blockType, POSITION_SUPPORT_KEY);
   return !!(true === support || support?.fixed);
 }
+
 /**
  * Determines if there is position support.
  *
@@ -122,21 +118,21 @@ export function hasFixedPositionSupport(blockType) {
  *
  * @return {boolean} Whether there is support.
  */
-
 export function hasPositionSupport(blockType) {
   const support = getBlockSupport(blockType, POSITION_SUPPORT_KEY);
   return !!support;
 }
+
 /**
  * Checks if there is a current value in the position block support attributes.
  *
  * @param {Object} props Block props.
  * @return {boolean} Whether or not the block has a position value set.
  */
-
 export function hasPositionValue(props) {
   return props.attributes.style?.position?.type !== undefined;
 }
+
 /**
  * Checks if the block is currently set to a sticky or fixed position.
  * This check is helpful for determining how to position block toolbars or other elements.
@@ -144,11 +140,11 @@ export function hasPositionValue(props) {
  * @param {Object} attributes Block attributes.
  * @return {boolean} Whether or not the block is set to a sticky or fixed position.
  */
-
 export function hasStickyOrFixedPositionValue(attributes) {
   const positionType = attributes.style?.position?.type;
   return positionType === 'sticky' || positionType === 'fixed';
 }
+
 /**
  * Resets the position block support attributes. This can be used when disabling
  * the position support controls for a block via a `ToolsPanel`.
@@ -157,7 +153,6 @@ export function hasStickyOrFixedPositionValue(attributes) {
  * @param {Object} props.attributes    Block's attributes.
  * @param {Object} props.setAttributes Function to set block's attributes.
  */
-
 export function resetPosition({
   attributes = {},
   setAttributes
@@ -166,8 +161,10 @@ export function resetPosition({
     style = {}
   } = attributes;
   setAttributes({
-    style: cleanEmptyObject({ ...style,
-      position: { ...style?.position,
+    style: cleanEmptyObject({
+      ...style,
+      position: {
+        ...style?.position,
         type: undefined,
         top: undefined,
         right: undefined,
@@ -177,6 +174,7 @@ export function resetPosition({
     })
   });
 }
+
 /**
  * Custom hook that checks if position settings have been disabled.
  *
@@ -184,7 +182,6 @@ export function resetPosition({
  *
  * @return {boolean} Whether padding setting is disabled.
  */
-
 export function useIsPositionDisabled({
   name: blockName
 } = {}) {
@@ -193,6 +190,7 @@ export function useIsPositionDisabled({
   const isDisabled = !allowFixed && !allowSticky;
   return !hasPositionSupport(blockName) || isDisabled;
 }
+
 /*
  * Position controls rendered in an inspector control panel.
  *
@@ -200,7 +198,6 @@ export function useIsPositionDisabled({
  *
  * @return {WPElement} Position panel.
  */
-
 export function PositionPanel(props) {
   const {
     attributes: {
@@ -225,31 +222,29 @@ export function PositionPanel(props) {
     };
   }, [clientId]);
   const blockInformation = useBlockDisplayInformation(firstParentClientId);
-  const stickyHelpText = allowSticky && value === STICKY_OPTION.value && blockInformation ? sprintf(
-  /* translators: %s: the name of the parent block. */
+  const stickyHelpText = allowSticky && value === STICKY_OPTION.value && blockInformation ? sprintf( /* translators: %s: the name of the parent block. */
   __('The block will stick to the scrollable area of the parent %s block.'), blockInformation.title) : null;
   const options = useMemo(() => {
-    const availableOptions = [DEFAULT_OPTION]; // Display options if they are allowed, or if a block already has a valid value set.
+    const availableOptions = [DEFAULT_OPTION];
+    // Display options if they are allowed, or if a block already has a valid value set.
     // This allows for a block to be switched off from a position type that is not allowed.
-
     if (allowSticky || value === STICKY_OPTION.value) {
       availableOptions.push(STICKY_OPTION);
     }
-
     if (allowFixed || value === FIXED_OPTION.value) {
       availableOptions.push(FIXED_OPTION);
     }
-
     return availableOptions;
   }, [allowFixed, allowSticky, value]);
-
   const onChangeType = next => {
     // For now, use a hard-coded `0px` value for the position.
     // `0px` is preferred over `0` as it can be used in `calc()` functions.
     // In the future, it could be useful to allow for an offset value.
     const placementValue = '0px';
-    const newStyle = { ...style,
-      position: { ...style?.position,
+    const newStyle = {
+      ...style,
+      position: {
+        ...style?.position,
         type: next,
         top: next === 'sticky' || next === 'fixed' ? placementValue : undefined
       }
@@ -258,9 +253,9 @@ export function PositionPanel(props) {
       style: cleanEmptyObject(newStyle)
     });
   };
+  const selectedOption = value ? options.find(option => option.value === value) || DEFAULT_OPTION : DEFAULT_OPTION;
 
-  const selectedOption = value ? options.find(option => option.value === value) || DEFAULT_OPTION : DEFAULT_OPTION; // Only display position controls if there is at least one option to choose from.
-
+  // Only display position controls if there is at least one option to choose from.
   return Platform.select({
     web: options.length > 1 ? createElement(InspectorControls, {
       group: "position"
@@ -274,7 +269,8 @@ export function PositionPanel(props) {
       className: "block-editor-hooks__position-selection__select-control",
       label: __('Position'),
       hideLabelFromVision: true,
-      describedBy: sprintf( // translators: %s: Currently selected position.
+      describedBy: sprintf(
+      // translators: %s: Currently selected position.
       __('Currently selected position: %s'), selectedOption.name),
       options: options,
       value: selectedOption,
@@ -289,6 +285,7 @@ export function PositionPanel(props) {
     native: null
   });
 }
+
 /**
  * Override the default edit UI to include position controls.
  *
@@ -296,7 +293,6 @@ export function PositionPanel(props) {
  *
  * @return {Function} Wrapped component.
  */
-
 export const withInspectorControls = createHigherOrderComponent(BlockEdit => props => {
   const {
     name: blockName
@@ -311,6 +307,7 @@ export const withInspectorControls = createHigherOrderComponent(BlockEdit => pro
     ...props
   })];
 }, 'withInspectorControls');
+
 /**
  * Override the default block element to add the position styles.
  *
@@ -318,7 +315,6 @@ export const withInspectorControls = createHigherOrderComponent(BlockEdit => pro
  *
  * @return {Function} Wrapped component.
  */
-
 export const withPositionStyles = createHigherOrderComponent(BlockListBlock => props => {
   const {
     name,
@@ -327,26 +323,28 @@ export const withPositionStyles = createHigherOrderComponent(BlockListBlock => p
   const hasPositionBlockSupport = hasBlockSupport(name, POSITION_SUPPORT_KEY);
   const allowPositionStyles = hasPositionBlockSupport && !useIsPositionDisabled(props);
   const id = useInstanceId(BlockListBlock);
-  const element = useContext(BlockList.__unstableElementContext); // Higher specificity to override defaults in editor UI.
+  const element = useContext(BlockList.__unstableElementContext);
 
-  const positionSelector = `.wp-container-${id}.wp-container-${id}`; // Get CSS string for the current position values.
+  // Higher specificity to override defaults in editor UI.
+  const positionSelector = `.wp-container-${id}.wp-container-${id}`;
 
+  // Get CSS string for the current position values.
   let css;
-
   if (allowPositionStyles) {
     css = getPositionCSS({
       selector: positionSelector,
       style: attributes?.style
     }) || '';
-  } // Attach a `wp-container-` id-based class name.
-
+  }
 
+  // Attach a `wp-container-` id-based class name.
   const className = classnames(props?.className, {
     [`wp-container-${id}`]: allowPositionStyles && !!css,
     // Only attach a container class if there is generated CSS to be attached.
     [`is-position-${attributes?.style?.position?.type}`]: allowPositionStyles && !!css && !!attributes?.style?.position?.type
   });
-  return createElement(Fragment, null, allowPositionStyles && element && !!css && createPortal(createElement("style", null, css), element), createElement(BlockListBlock, { ...props,
+  return createElement(Fragment, null, allowPositionStyles && element && !!css && createPortal(createElement("style", null, css), element), createElement(BlockListBlock, {
+    ...props,
     className: className
   }));
 }, 'withPositionStyles');