npm - @wordpress/block-editor - Versions diffs - 15.19.1-next.v.202605131006.0 → 15.20.0 - Mend

@wordpress/block-editor 15.19.1-next.v.202605131006.0 → 15.20.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 (352) hide show

package/build-module/components/block-lock/modal.mjs CHANGED Viewed

@@ -6,7 +6,7 @@ import {
   CheckboxControl,
   Flex,
   FlexItem,
-  Icon,
+  Icon as WCIcon,
   Modal,
   ToggleControl
 } from "@wordpress/components";
@@ -125,7 +125,7 @@ function BlockLockModal({ clientId, onClose }) {
                               }
                             ),
                             /* @__PURE__ */ jsx(
-                              Icon,
+                              WCIcon,
                               {
                                 className: "block-editor-block-lock-modal__lock-icon",
                                 icon: lock.edit ? lockIcon : unlockIcon
@@ -145,7 +145,7 @@ function BlockLockModal({ clientId, onClose }) {
                               }
                             ),
                             /* @__PURE__ */ jsx(
-                              Icon,
+                              WCIcon,
                               {
                                 className: "block-editor-block-lock-modal__lock-icon",
                                 icon: lock.move ? lockIcon : unlockIcon
@@ -165,7 +165,7 @@ function BlockLockModal({ clientId, onClose }) {
                               }
                             ),
                             /* @__PURE__ */ jsx(
-                              Icon,
+                              WCIcon,
                               {
                                 className: "block-editor-block-lock-modal__lock-icon",
                                 icon: lock.remove ? lockIcon : unlockIcon

package/build-module/components/block-lock/modal.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/block-lock/modal.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useEffect, useState } from '@wordpress/element';\nimport {\n\tButton,\n\tCheckboxControl,\n\tFlex,\n\tFlexItem,\n\tIcon,\n\tModal,\n\tToggleControl,\n} from '@wordpress/components';\nimport { lock as lockIcon, unlock as unlockIcon } from '@wordpress/icons';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { getBlockType } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport useBlockLock from './use-block-lock';\nimport useBlockDisplayInformation from '../use-block-display-information';\nimport { store as blockEditorStore } from '../../store';\n\n// Entity based blocks which allow edit locking\nconst ALLOWS_EDIT_LOCKING = [ 'core/navigation' ];\n\nfunction getTemplateLockValue( lock ) {\n\t// Prevents all operations.\n\tif ( lock.remove && lock.move ) {\n\t\treturn 'all';\n\t}\n\n\t// Prevents inserting or removing blocks, but allows moving existing blocks.\n\tif ( lock.remove && ! lock.move ) {\n\t\treturn 'insert';\n\t}\n\n\treturn false;\n}\n\nexport default function BlockLockModal( { clientId, onClose } ) {\n\tconst [ lock, setLock ] = useState( { move: false, remove: false } );\n\tconst { isEditLocked, isMoveLocked, isRemoveLocked } =\n\t\tuseBlockLock( clientId );\n\tconst { allowsEditLocking, templateLock, hasTemplateLock } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockName, getBlockAttributes } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\tconst blockName = getBlockName( clientId );\n\t\t\tconst blockType = getBlockType( blockName );\n\n\t\t\treturn {\n\t\t\t\tallowsEditLocking: ALLOWS_EDIT_LOCKING.includes( blockName ),\n\t\t\t\ttemplateLock: getBlockAttributes( clientId )?.templateLock,\n\t\t\t\thasTemplateLock: !! blockType?.attributes?.templateLock,\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\tconst [ applyTemplateLock, setApplyTemplateLock ] = useState(\n\t\t!! templateLock\n\t);\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\tconst blockInformation = useBlockDisplayInformation( clientId );\n\n\tuseEffect( () => {\n\t\tsetLock( {\n\t\t\tmove: isMoveLocked,\n\t\t\tremove: isRemoveLocked,\n\t\t\t...( allowsEditLocking ? { edit: isEditLocked } : {} ),\n\t\t} );\n\t}, [ isEditLocked, isMoveLocked, isRemoveLocked, allowsEditLocking ] );\n\n\tconst isAllChecked = Object.values( lock ).every( Boolean );\n\tconst isMixed = Object.values( lock ).some( Boolean ) && ! isAllChecked;\n\n\tconst isDirty =\n\t\tlock.move !== isMoveLocked ||\n\t\tlock.remove !== isRemoveLocked ||\n\t\t( allowsEditLocking && lock.edit !== isEditLocked ) ||\n\t\t( hasTemplateLock && applyTemplateLock !== !! templateLock );\n\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ sprintf(\n\t\t\t\t/* translators: %s: Name of the block. */\n\t\t\t\t__( 'Lock %s' ),\n\t\t\t\tblockInformation.title\n\t\t\t) }\n\t\t\toverlayClassName=\"block-editor-block-lock-modal\"\n\t\t\tonRequestClose={ onClose }\n\t\t\tsize=\"small\"\n\t\t>\n\t\t\t<form\n\t\t\t\tonSubmit={ ( event ) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif ( ! isDirty ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tupdateBlockAttributes( [ clientId ], {\n\t\t\t\t\t\tlock,\n\t\t\t\t\t\ttemplateLock: applyTemplateLock\n\t\t\t\t\t\t\t? getTemplateLockValue( lock )\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t} );\n\t\t\t\t\tonClose();\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<fieldset className=\"block-editor-block-lock-modal__options\">\n\t\t\t\t\t<legend>\n\t\t\t\t\t\t{ __( 'Select the features you want to lock' ) }\n\t\t\t\t\t</legend>\n\t\t\t\t\t{ /*\n\t\t\t\t\t * Disable reason: The `list` ARIA role is redundant but\n\t\t\t\t\t * Safari+VoiceOver won't announce the list otherwise.\n\t\t\t\t\t */\n\t\t\t\t\t/* eslint-disable jsx-a11y/no-redundant-roles */ }\n\t\t\t\t\t<ul\n\t\t\t\t\t\trole=\"list\"\n\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__checklist\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__options-all\"\n\t\t\t\t\t\t\t\tlabel={ __( 'Lock all' ) }\n\t\t\t\t\t\t\t\tchecked={ isAllChecked }\n\t\t\t\t\t\t\t\tindeterminate={ isMixed }\n\t\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\t\tsetLock( {\n\t\t\t\t\t\t\t\t\t\tmove: newValue,\n\t\t\t\t\t\t\t\t\t\tremove: newValue,\n\t\t\t\t\t\t\t\t\t\t...( allowsEditLocking\n\t\t\t\t\t\t\t\t\t\t\t? { edit: newValue }\n\t\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}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<ul\n\t\t\t\t\t\t\t\trole=\"list\"\n\t\t\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__checklist\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ allowsEditLocking && (\n\t\t\t\t\t\t\t\t\t<li className=\"block-editor-block-lock-modal__checklist-item\">\n\t\t\t\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Lock editing' ) }\n\t\t\t\t\t\t\t\t\t\t\tchecked={ !! lock.edit }\n\t\t\t\t\t\t\t\t\t\t\tonChange={ ( edit ) =>\n\t\t\t\t\t\t\t\t\t\t\t\tsetLock( ( prevLock ) => ( {\n\t\t\t\t\t\t\t\t\t\t\t\t\t...prevLock,\n\t\t\t\t\t\t\t\t\t\t\t\t\tedit,\n\t\t\t\t\t\t\t\t\t\t\t\t} ) )\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__lock-icon\"\n\t\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\t\tlock.edit\n\t\t\t\t\t\t\t\t\t\t\t\t\t? lockIcon\n\t\t\t\t\t\t\t\t\t\t\t\t\t: unlockIcon\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t<li className=\"block-editor-block-lock-modal__checklist-item\">\n\t\t\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Lock movement' ) }\n\t\t\t\t\t\t\t\t\t\tchecked={ lock.move }\n\t\t\t\t\t\t\t\t\t\tonChange={ ( move ) =>\n\t\t\t\t\t\t\t\t\t\t\tsetLock( ( prevLock ) => ( {\n\t\t\t\t\t\t\t\t\t\t\t\t...prevLock,\n\t\t\t\t\t\t\t\t\t\t\t\tmove,\n\t\t\t\t\t\t\t\t\t\t\t} ) )\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<Icon\n\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__lock-icon\"\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tlock.move ? lockIcon : unlockIcon\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</li>\n\t\t\t\t\t\t\t\t<li className=\"block-editor-block-lock-modal__checklist-item\">\n\t\t\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Lock removal' ) }\n\t\t\t\t\t\t\t\t\t\tchecked={ lock.remove }\n\t\t\t\t\t\t\t\t\t\tonChange={ ( remove ) =>\n\t\t\t\t\t\t\t\t\t\t\tsetLock( ( prevLock ) => ( {\n\t\t\t\t\t\t\t\t\t\t\t\t...prevLock,\n\t\t\t\t\t\t\t\t\t\t\t\tremove,\n\t\t\t\t\t\t\t\t\t\t\t} ) )\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<Icon\n\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__lock-icon\"\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tlock.remove ? lockIcon : unlockIcon\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</li>\n\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t\t{ /* eslint-enable jsx-a11y/no-redundant-roles */ }\n\t\t\t\t\t{ hasTemplateLock && (\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__template-lock\"\n\t\t\t\t\t\t\tlabel={ __( 'Apply to all blocks inside' ) }\n\t\t\t\t\t\t\tchecked={ applyTemplateLock }\n\t\t\t\t\t\t\tdisabled={ lock.move && ! lock.remove }\n\t\t\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\t\t\tsetApplyTemplateLock( ! applyTemplateLock )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</fieldset>\n\t\t\t\t<Flex\n\t\t\t\t\tclassName=\"block-editor-block-lock-modal__actions\"\n\t\t\t\t\tjustify=\"flex-end\"\n\t\t\t\t\texpanded={ false }\n\t\t\t\t>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Apply' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t</form>\n\t\t</Modal>\n\t);\n}\n"],
-  "mappings": ";AAGA,SAAS,IAAI,eAAe;AAC5B,SAAS,WAAW,gBAAgB;AACpC;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,QAAQ,UAAU,UAAU,kBAAkB;AACvD,SAAS,aAAa,iBAAiB;AACvC,SAAS,oBAAoB;AAK7B,OAAO,kBAAkB;AACzB,OAAO,gCAAgC;AACvC,SAAS,SAAS,wBAAwB;AAwFrC,cAiCI,YAjCJ;AArFL,IAAM,sBAAsB,CAAE,iBAAkB;AAEhD,SAAS,qBAAsB,MAAO;AAErC,MAAK,KAAK,UAAU,KAAK,MAAO;AAC/B,WAAO;AAAA,EACR;AAGA,MAAK,KAAK,UAAU,CAAE,KAAK,MAAO;AACjC,WAAO;AAAA,EACR;AAEA,SAAO;AACR;AAEe,SAAR,eAAiC,EAAE,UAAU,QAAQ,GAAI;AAC/D,QAAM,CAAE,MAAM,OAAQ,IAAI,SAAU,EAAE,MAAM,OAAO,QAAQ,MAAM,CAAE;AACnE,QAAM,EAAE,cAAc,cAAc,eAAe,IAClD,aAAc,QAAS;AACxB,QAAM,EAAE,mBAAmB,cAAc,gBAAgB,IAAI;AAAA,IAC5D,CAAE,WAAY;AACb,YAAM,EAAE,cAAc,mBAAmB,IACxC,OAAQ,gBAAiB;AAC1B,YAAM,YAAY,aAAc,QAAS;AACzC,YAAM,YAAY,aAAc,SAAU;AAE1C,aAAO;AAAA,QACN,mBAAmB,oBAAoB,SAAU,SAAU;AAAA,QAC3D,cAAc,mBAAoB,QAAS,GAAG;AAAA,QAC9C,iBAAiB,CAAC,CAAE,WAAW,YAAY;AAAA,MAC5C;AAAA,IACD;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AACA,QAAM,CAAE,mBAAmB,oBAAqB,IAAI;AAAA,IACnD,CAAC,CAAE;AAAA,EACJ;AACA,QAAM,EAAE,sBAAsB,IAAI,YAAa,gBAAiB;AAChE,QAAM,mBAAmB,2BAA4B,QAAS;AAE9D,YAAW,MAAM;AAChB,YAAS;AAAA,MACR,MAAM;AAAA,MACN,QAAQ;AAAA,MACR,GAAK,oBAAoB,EAAE,MAAM,aAAa,IAAI,CAAC;AAAA,IACpD,CAAE;AAAA,EACH,GAAG,CAAE,cAAc,cAAc,gBAAgB,iBAAkB,CAAE;AAErE,QAAM,eAAe,OAAO,OAAQ,IAAK,EAAE,MAAO,OAAQ;AAC1D,QAAM,UAAU,OAAO,OAAQ,IAAK,EAAE,KAAM,OAAQ,KAAK,CAAE;AAE3D,QAAM,UACL,KAAK,SAAS,gBACd,KAAK,WAAW,kBACd,qBAAqB,KAAK,SAAS,gBACnC,mBAAmB,sBAAsB,CAAC,CAAE;AAE/C,SACC;AAAA,IAAC;AAAA;AAAA,MACA,OAAQ;AAAA;AAAA,QAEP,GAAI,SAAU;AAAA,QACd,iBAAiB;AAAA,MAClB;AAAA,MACA,kBAAiB;AAAA,MACjB,gBAAiB;AAAA,MACjB,MAAK;AAAA,MAEL;AAAA,QAAC;AAAA;AAAA,UACA,UAAW,CAAE,UAAW;AACvB,kBAAM,eAAe;AACrB,gBAAK,CAAE,SAAU;AAChB;AAAA,YACD;AACA,kCAAuB,CAAE,QAAS,GAAG;AAAA,cACpC;AAAA,cACA,cAAc,oBACX,qBAAsB,IAAK,IAC3B;AAAA,YACJ,CAAE;AACF,oBAAQ;AAAA,UACT;AAAA,UAEA;AAAA,iCAAC,cAAS,WAAU,0CACnB;AAAA,kCAAC,YACE,aAAI,sCAAuC,GAC9C;AAAA,cAMA;AAAA,gBAAC;AAAA;AAAA,kBACA,MAAK;AAAA,kBACL,WAAU;AAAA,kBAEV,+BAAC,QACA;AAAA;AAAA,sBAAC;AAAA;AAAA,wBACA,WAAU;AAAA,wBACV,OAAQ,GAAI,UAAW;AAAA,wBACvB,SAAU;AAAA,wBACV,eAAgB;AAAA,wBAChB,UAAW,CAAE,aACZ,QAAS;AAAA,0BACR,MAAM;AAAA,0BACN,QAAQ;AAAA,0BACR,GAAK,oBACF,EAAE,MAAM,SAAS,IACjB,CAAC;AAAA,wBACL,CAAE;AAAA;AAAA,oBAEJ;AAAA,oBACA;AAAA,sBAAC;AAAA;AAAA,wBACA,MAAK;AAAA,wBACL,WAAU;AAAA,wBAER;AAAA,+CACD,qBAAC,QAAG,WAAU,iDACb;AAAA;AAAA,8BAAC;AAAA;AAAA,gCACA,OAAQ,GAAI,cAAe;AAAA,gCAC3B,SAAU,CAAC,CAAE,KAAK;AAAA,gCAClB,UAAW,CAAE,SACZ,QAAS,CAAE,cAAgB;AAAA,kCAC1B,GAAG;AAAA,kCACH;AAAA,gCACD,EAAI;AAAA;AAAA,4BAEN;AAAA,4BACA;AAAA,8BAAC;AAAA;AAAA,gCACA,WAAU;AAAA,gCACV,MACC,KAAK,OACF,WACA;AAAA;AAAA,4BAEL;AAAA,6BACD;AAAA,0BAED,qBAAC,QAAG,WAAU,iDACb;AAAA;AAAA,8BAAC;AAAA;AAAA,gCACA,OAAQ,GAAI,eAAgB;AAAA,gCAC5B,SAAU,KAAK;AAAA,gCACf,UAAW,CAAE,SACZ,QAAS,CAAE,cAAgB;AAAA,kCAC1B,GAAG;AAAA,kCACH;AAAA,gCACD,EAAI;AAAA;AAAA,4BAEN;AAAA,4BACA;AAAA,8BAAC;AAAA;AAAA,gCACA,WAAU;AAAA,gCACV,MACC,KAAK,OAAO,WAAW;AAAA;AAAA,4BAEzB;AAAA,6BACD;AAAA,0BACA,qBAAC,QAAG,WAAU,iDACb;AAAA;AAAA,8BAAC;AAAA;AAAA,gCACA,OAAQ,GAAI,cAAe;AAAA,gCAC3B,SAAU,KAAK;AAAA,gCACf,UAAW,CAAE,WACZ,QAAS,CAAE,cAAgB;AAAA,kCAC1B,GAAG;AAAA,kCACH;AAAA,gCACD,EAAI;AAAA;AAAA,4BAEN;AAAA,4BACA;AAAA,8BAAC;AAAA;AAAA,gCACA,WAAU;AAAA,gCACV,MACC,KAAK,SAAS,WAAW;AAAA;AAAA,4BAE3B;AAAA,6BACD;AAAA;AAAA;AAAA,oBACD;AAAA,qBACD;AAAA;AAAA,cACD;AAAA,cAEE,mBACD;AAAA,gBAAC;AAAA;AAAA,kBACA,WAAU;AAAA,kBACV,OAAQ,GAAI,4BAA6B;AAAA,kBACzC,SAAU;AAAA,kBACV,UAAW,KAAK,QAAQ,CAAE,KAAK;AAAA,kBAC/B,UAAW,MACV,qBAAsB,CAAE,iBAAkB;AAAA;AAAA,cAE5C;AAAA,eAEF;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACA,WAAU;AAAA,gBACV,SAAQ;AAAA,gBACR,UAAW;AAAA,gBAEX;AAAA,sCAAC,YACA;AAAA,oBAAC;AAAA;AAAA,sBACA,SAAQ;AAAA,sBACR,SAAU;AAAA,sBACV,uBAAqB;AAAA,sBAEnB,aAAI,QAAS;AAAA;AAAA,kBAChB,GACD;AAAA,kBACA,oBAAC,YACA;AAAA,oBAAC;AAAA;AAAA,sBACA,SAAQ;AAAA,sBACR,MAAK;AAAA,sBACL,UAAW,CAAE;AAAA,sBACb,wBAAsB;AAAA,sBACtB,uBAAqB;AAAA,sBAEnB,aAAI,OAAQ;AAAA;AAAA,kBACf,GACD;AAAA;AAAA;AAAA,YACD;AAAA;AAAA;AAAA,MACD;AAAA;AAAA,EACD;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useEffect, useState } from '@wordpress/element';\nimport {\n\tButton,\n\tCheckboxControl,\n\tFlex,\n\tFlexItem,\n\tIcon as WCIcon,\n\tModal,\n\tToggleControl,\n} from '@wordpress/components';\nimport { lock as lockIcon, unlock as unlockIcon } from '@wordpress/icons';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { getBlockType } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport useBlockLock from './use-block-lock';\nimport useBlockDisplayInformation from '../use-block-display-information';\nimport { store as blockEditorStore } from '../../store';\n\n// Entity based blocks which allow edit locking\nconst ALLOWS_EDIT_LOCKING = [ 'core/navigation' ];\n\nfunction getTemplateLockValue( lock ) {\n\t// Prevents all operations.\n\tif ( lock.remove && lock.move ) {\n\t\treturn 'all';\n\t}\n\n\t// Prevents inserting or removing blocks, but allows moving existing blocks.\n\tif ( lock.remove && ! lock.move ) {\n\t\treturn 'insert';\n\t}\n\n\treturn false;\n}\n\nexport default function BlockLockModal( { clientId, onClose } ) {\n\tconst [ lock, setLock ] = useState( { move: false, remove: false } );\n\tconst { isEditLocked, isMoveLocked, isRemoveLocked } =\n\t\tuseBlockLock( clientId );\n\tconst { allowsEditLocking, templateLock, hasTemplateLock } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockName, getBlockAttributes } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\tconst blockName = getBlockName( clientId );\n\t\t\tconst blockType = getBlockType( blockName );\n\n\t\t\treturn {\n\t\t\t\tallowsEditLocking: ALLOWS_EDIT_LOCKING.includes( blockName ),\n\t\t\t\ttemplateLock: getBlockAttributes( clientId )?.templateLock,\n\t\t\t\thasTemplateLock: !! blockType?.attributes?.templateLock,\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\tconst [ applyTemplateLock, setApplyTemplateLock ] = useState(\n\t\t!! templateLock\n\t);\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\tconst blockInformation = useBlockDisplayInformation( clientId );\n\n\tuseEffect( () => {\n\t\tsetLock( {\n\t\t\tmove: isMoveLocked,\n\t\t\tremove: isRemoveLocked,\n\t\t\t...( allowsEditLocking ? { edit: isEditLocked } : {} ),\n\t\t} );\n\t}, [ isEditLocked, isMoveLocked, isRemoveLocked, allowsEditLocking ] );\n\n\tconst isAllChecked = Object.values( lock ).every( Boolean );\n\tconst isMixed = Object.values( lock ).some( Boolean ) && ! isAllChecked;\n\n\tconst isDirty =\n\t\tlock.move !== isMoveLocked ||\n\t\tlock.remove !== isRemoveLocked ||\n\t\t( allowsEditLocking && lock.edit !== isEditLocked ) ||\n\t\t( hasTemplateLock && applyTemplateLock !== !! templateLock );\n\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ sprintf(\n\t\t\t\t/* translators: %s: Name of the block. */\n\t\t\t\t__( 'Lock %s' ),\n\t\t\t\tblockInformation.title\n\t\t\t) }\n\t\t\toverlayClassName=\"block-editor-block-lock-modal\"\n\t\t\tonRequestClose={ onClose }\n\t\t\tsize=\"small\"\n\t\t>\n\t\t\t<form\n\t\t\t\tonSubmit={ ( event ) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif ( ! isDirty ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tupdateBlockAttributes( [ clientId ], {\n\t\t\t\t\t\tlock,\n\t\t\t\t\t\ttemplateLock: applyTemplateLock\n\t\t\t\t\t\t\t? getTemplateLockValue( lock )\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t} );\n\t\t\t\t\tonClose();\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<fieldset className=\"block-editor-block-lock-modal__options\">\n\t\t\t\t\t<legend>\n\t\t\t\t\t\t{ __( 'Select the features you want to lock' ) }\n\t\t\t\t\t</legend>\n\t\t\t\t\t{ /*\n\t\t\t\t\t * Disable reason: The `list` ARIA role is redundant but\n\t\t\t\t\t * Safari+VoiceOver won't announce the list otherwise.\n\t\t\t\t\t */\n\t\t\t\t\t/* eslint-disable jsx-a11y/no-redundant-roles */ }\n\t\t\t\t\t<ul\n\t\t\t\t\t\trole=\"list\"\n\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__checklist\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__options-all\"\n\t\t\t\t\t\t\t\tlabel={ __( 'Lock all' ) }\n\t\t\t\t\t\t\t\tchecked={ isAllChecked }\n\t\t\t\t\t\t\t\tindeterminate={ isMixed }\n\t\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\t\tsetLock( {\n\t\t\t\t\t\t\t\t\t\tmove: newValue,\n\t\t\t\t\t\t\t\t\t\tremove: newValue,\n\t\t\t\t\t\t\t\t\t\t...( allowsEditLocking\n\t\t\t\t\t\t\t\t\t\t\t? { edit: newValue }\n\t\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}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<ul\n\t\t\t\t\t\t\t\trole=\"list\"\n\t\t\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__checklist\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ allowsEditLocking && (\n\t\t\t\t\t\t\t\t\t<li className=\"block-editor-block-lock-modal__checklist-item\">\n\t\t\t\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Lock editing' ) }\n\t\t\t\t\t\t\t\t\t\t\tchecked={ !! lock.edit }\n\t\t\t\t\t\t\t\t\t\t\tonChange={ ( edit ) =>\n\t\t\t\t\t\t\t\t\t\t\t\tsetLock( ( prevLock ) => ( {\n\t\t\t\t\t\t\t\t\t\t\t\t\t...prevLock,\n\t\t\t\t\t\t\t\t\t\t\t\t\tedit,\n\t\t\t\t\t\t\t\t\t\t\t\t} ) )\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<WCIcon\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__lock-icon\"\n\t\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\t\tlock.edit\n\t\t\t\t\t\t\t\t\t\t\t\t\t? lockIcon\n\t\t\t\t\t\t\t\t\t\t\t\t\t: unlockIcon\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t<li className=\"block-editor-block-lock-modal__checklist-item\">\n\t\t\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Lock movement' ) }\n\t\t\t\t\t\t\t\t\t\tchecked={ lock.move }\n\t\t\t\t\t\t\t\t\t\tonChange={ ( move ) =>\n\t\t\t\t\t\t\t\t\t\t\tsetLock( ( prevLock ) => ( {\n\t\t\t\t\t\t\t\t\t\t\t\t...prevLock,\n\t\t\t\t\t\t\t\t\t\t\t\tmove,\n\t\t\t\t\t\t\t\t\t\t\t} ) )\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<WCIcon\n\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__lock-icon\"\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tlock.move ? lockIcon : unlockIcon\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</li>\n\t\t\t\t\t\t\t\t<li className=\"block-editor-block-lock-modal__checklist-item\">\n\t\t\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Lock removal' ) }\n\t\t\t\t\t\t\t\t\t\tchecked={ lock.remove }\n\t\t\t\t\t\t\t\t\t\tonChange={ ( remove ) =>\n\t\t\t\t\t\t\t\t\t\t\tsetLock( ( prevLock ) => ( {\n\t\t\t\t\t\t\t\t\t\t\t\t...prevLock,\n\t\t\t\t\t\t\t\t\t\t\t\tremove,\n\t\t\t\t\t\t\t\t\t\t\t} ) )\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<WCIcon\n\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__lock-icon\"\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tlock.remove ? lockIcon : unlockIcon\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</li>\n\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t\t{ /* eslint-enable jsx-a11y/no-redundant-roles */ }\n\t\t\t\t\t{ hasTemplateLock && (\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tclassName=\"block-editor-block-lock-modal__template-lock\"\n\t\t\t\t\t\t\tlabel={ __( 'Apply to all blocks inside' ) }\n\t\t\t\t\t\t\tchecked={ applyTemplateLock }\n\t\t\t\t\t\t\tdisabled={ lock.move && ! lock.remove }\n\t\t\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\t\t\tsetApplyTemplateLock( ! applyTemplateLock )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</fieldset>\n\t\t\t\t<Flex\n\t\t\t\t\tclassName=\"block-editor-block-lock-modal__actions\"\n\t\t\t\t\tjustify=\"flex-end\"\n\t\t\t\t\texpanded={ false }\n\t\t\t\t>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Apply' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t</form>\n\t\t</Modal>\n\t);\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/components/block-patterns-list/index.mjs CHANGED Viewed

@@ -4,10 +4,9 @@ import { cloneBlock } from "@wordpress/blocks";
 import { useEffect, useState, forwardRef, useMemo } from "@wordpress/element";
 import {
   Composite,
-  Tooltip,
   __experimentalHStack as HStack
 } from "@wordpress/components";
-import { VisuallyHidden } from "@wordpress/ui";
+import { VisuallyHidden, Text, Tooltip } from "@wordpress/ui";
 import { useInstanceId } from "@wordpress/compose";
 import { __ } from "@wordpress/i18n";
 import { Icon, symbol } from "@wordpress/icons";
@@ -18,7 +17,10 @@ import { INSERTER_PATTERN_TYPES } from "../inserter/block-patterns-tab/utils.mjs
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var WithToolTip = ({ showTooltip, title, children }) => {
   if (showTooltip) {
-    return /* @__PURE__ */ jsx(Tooltip, { text: title, children });
+    return /* @__PURE__ */ jsxs(Tooltip.Root, { children: [
+      /* @__PURE__ */ jsx(Tooltip.Trigger, { render: children }),
+      /* @__PURE__ */ jsx(Tooltip.Popup, { children: title })
+    ] });
   }
   return /* @__PURE__ */ jsx(Fragment, { children });
 };
@@ -137,7 +139,15 @@ function BlockPattern({
                               icon: symbol
                             }
                           ) }),
-                          /* @__PURE__ */ jsx("div", { className: "block-editor-block-patterns-list__item-title", children: pattern.title })
+                          /* @__PURE__ */ jsx(
+                            Text,
+                            {
+                              render: /* @__PURE__ */ jsx("div", {}),
+                              className: "block-editor-block-patterns-list__item-title",
+                              variant: "body-sm",
+                              children: pattern.title
+                            }
+                          )
                         ]
                       }
                     ),

package/build-module/components/block-patterns-list/index.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/block-patterns-list/index.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { cloneBlock } from '@wordpress/blocks';\nimport { useEffect, useState, forwardRef, useMemo } from '@wordpress/element';\nimport {\n\tComposite,\n\tTooltip,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { VisuallyHidden } from '@wordpress/ui';\nimport { useInstanceId } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { Icon, symbol } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BlockPreview from '../block-preview';\nimport InserterDraggableBlocks from '../inserter-draggable-blocks';\nimport BlockPatternsPaging from '../block-patterns-paging';\nimport { INSERTER_PATTERN_TYPES } from '../inserter/block-patterns-tab/utils';\n\nconst WithToolTip = ( { showTooltip, title, children } ) => {\n\tif ( showTooltip ) {\n\t\treturn <Tooltip text={ title }>{ children }</Tooltip>;\n\t}\n\treturn <>{ children }</>;\n};\n\nfunction BlockPattern( {\n\tid,\n\tisDraggable,\n\tpattern,\n\tonClick,\n\tonHover,\n\tshowTitlesAsTooltip,\n\tcategory,\n\tisSelected,\n} ) {\n\tconst [ isDragging, setIsDragging ] = useState( false );\n\tconst { blocks, viewportWidth } = pattern;\n\tconst instanceId = useInstanceId( BlockPattern );\n\tconst descriptionId = `block-editor-block-patterns-list__item-description-${ instanceId }`;\n\tconst isUserPattern = pattern.type === INSERTER_PATTERN_TYPES.user;\n\n\t// When we have a selected category and the pattern is draggable, we need to update the\n\t// pattern's categories in metadata to only contain the selected category, and pass this to\n\t// InserterDraggableBlocks component. We do that because we use this information for pattern\n\t// shuffling and it makes more sense to show only the ones from the initially selected category during insertion.\n\tconst patternBlocks = useMemo( () => {\n\t\tif ( ! category || ! isDraggable ) {\n\t\t\treturn blocks;\n\t\t}\n\t\treturn ( blocks ?? [] ).map( ( block ) => {\n\t\t\tconst clonedBlock = cloneBlock( block );\n\t\t\tif (\n\t\t\t\tclonedBlock.attributes.metadata?.categories?.includes(\n\t\t\t\t\tcategory\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tclonedBlock.attributes.metadata.categories = [ category ];\n\t\t\t}\n\t\t\treturn clonedBlock;\n\t\t} );\n\t}, [ blocks, isDraggable, category ] );\n\n\treturn (\n\t\t<InserterDraggableBlocks\n\t\t\tisEnabled={ isDraggable }\n\t\t\tblocks={ patternBlocks }\n\t\t\tpattern={ pattern }\n\t\t>\n\t\t\t{ ( { draggable, onDragStart, onDragEnd } ) => (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"block-editor-block-patterns-list__list-item\"\n\t\t\t\t\tdraggable={ draggable }\n\t\t\t\t\tonDragStart={ ( event ) => {\n\t\t\t\t\t\tsetIsDragging( true );\n\t\t\t\t\t\tif ( onDragStart ) {\n\t\t\t\t\t\t\tonHover?.( null );\n\t\t\t\t\t\t\tonDragStart( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t\tonDragEnd={ ( event ) => {\n\t\t\t\t\t\tsetIsDragging( false );\n\t\t\t\t\t\tif ( onDragEnd ) {\n\t\t\t\t\t\t\tonDragEnd( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<WithToolTip\n\t\t\t\t\t\tshowTooltip={ showTitlesAsTooltip && ! isUserPattern }\n\t\t\t\t\t\ttitle={ pattern.title }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Composite.Item\n\t\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\t\t\taria-label={ pattern.title }\n\t\t\t\t\t\t\t\t\taria-describedby={\n\t\t\t\t\t\t\t\t\t\tpattern.description\n\t\t\t\t\t\t\t\t\t\t\t? descriptionId\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'block-editor-block-patterns-list__item',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'block-editor-block-patterns-list__list-item-synced':\n\t\t\t\t\t\t\t\t\t\t\t\tpattern.type ===\n\t\t\t\t\t\t\t\t\t\t\t\t\tINSERTER_PATTERN_TYPES.user &&\n\t\t\t\t\t\t\t\t\t\t\t\t! pattern.syncStatus,\n\t\t\t\t\t\t\t\t\t\t\t'is-selected': isSelected,\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/>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonClick( pattern, blocks );\n\t\t\t\t\t\t\t\tonHover?.( null );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonMouseEnter={ () => {\n\t\t\t\t\t\t\t\tif ( isDragging ) {\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonHover?.( pattern );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonMouseLeave={ () => onHover?.( null ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<BlockPreview.Async\n\t\t\t\t\t\t\t\tplaceholder={ <BlockPatternPlaceholder /> }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<BlockPreview\n\t\t\t\t\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\t\t\t\t\tviewportWidth={ viewportWidth }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</BlockPreview.Async>\n\t\t\t\t\t\t\t{ ( ! showTitlesAsTooltip || isUserPattern ) && (\n\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-patterns__pattern-details\"\n\t\t\t\t\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ isUserPattern && ! pattern.syncStatus && (\n\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-patterns__pattern-icon-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-patterns__pattern-icon\"\n\t\t\t\t\t\t\t\t\t\t\t\ticon={ symbol }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t<div className=\"block-editor-block-patterns-list__item-title\">\n\t\t\t\t\t\t\t\t\t\t{ pattern.title }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t\t{ !! pattern.description && (\n\t\t\t\t\t\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t\t\t\t\t\t{ pattern.description }\n\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Composite.Item>\n\t\t\t\t\t</WithToolTip>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</InserterDraggableBlocks>\n\t);\n}\n\nfunction BlockPatternPlaceholder() {\n\treturn (\n\t\t<div className=\"block-editor-block-patterns-list__item is-placeholder\" />\n\t);\n}\n\nfunction BlockPatternsList(\n\t{\n\t\tisDraggable,\n\t\tblockPatterns,\n\t\tonHover,\n\t\tonClickPattern,\n\t\torientation,\n\t\tlabel = __( 'Block patterns' ),\n\t\tcategory,\n\t\tshowTitlesAsTooltip,\n\t\tpagingProps,\n\t},\n\tref\n) {\n\tconst [ activeCompositeId, setActiveCompositeId ] = useState( undefined );\n\tconst [ activePattern, setActivePattern ] = useState( null ); // State to track active pattern\n\n\tuseEffect( () => {\n\t\t// Reset the active composite item whenever the available patterns change,\n\t\t// to make sure that Composite widget can receive focus correctly when its\n\t\t// composite items change. The first composite item will receive focus.\n\t\tconst firstCompositeItemId = blockPatterns[ 0 ]?.name;\n\t\tsetActiveCompositeId( firstCompositeItemId );\n\t}, [ blockPatterns ] );\n\n\tconst handleClickPattern = ( pattern, blocks ) => {\n\t\tsetActivePattern( pattern.name );\n\t\tonClickPattern( pattern, blocks );\n\t};\n\n\treturn (\n\t\t<Composite\n\t\t\torientation={ orientation }\n\t\t\tactiveId={ activeCompositeId }\n\t\t\tsetActiveId={ setActiveCompositeId }\n\t\t\trole=\"listbox\"\n\t\t\tclassName=\"block-editor-block-patterns-list\"\n\t\t\taria-label={ label }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ blockPatterns.map( ( pattern ) => (\n\t\t\t\t<BlockPattern\n\t\t\t\t\tkey={ pattern.name }\n\t\t\t\t\tid={ pattern.name }\n\t\t\t\t\tpattern={ pattern }\n\t\t\t\t\tonClick={ handleClickPattern }\n\t\t\t\t\tonHover={ onHover }\n\t\t\t\t\tisDraggable={ isDraggable }\n\t\t\t\t\tshowTitlesAsTooltip={ showTitlesAsTooltip }\n\t\t\t\t\tcategory={ category }\n\t\t\t\t\tisSelected={\n\t\t\t\t\t\t!! activePattern && activePattern === pattern.name\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t\t{ pagingProps && <BlockPatternsPaging { ...pagingProps } /> }\n\t\t</Composite>\n\t);\n}\n\nexport default forwardRef( BlockPatternsList );\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { cloneBlock } from '@wordpress/blocks';\nimport { useEffect, useState, forwardRef, useMemo } from '@wordpress/element';\nimport {\n\tComposite,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\n// eslint-disable-next-line @wordpress/use-recommended-components -- `Tooltip` is not yet on the recommended `@wordpress/ui` allow-list; landing as a migration step ahead of the wider rollout.\nimport { VisuallyHidden, Text, Tooltip } from '@wordpress/ui';\nimport { useInstanceId } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { Icon, symbol } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BlockPreview from '../block-preview';\nimport InserterDraggableBlocks from '../inserter-draggable-blocks';\nimport BlockPatternsPaging from '../block-patterns-paging';\nimport { INSERTER_PATTERN_TYPES } from '../inserter/block-patterns-tab/utils';\n\nconst WithToolTip = ( { showTooltip, title, children } ) => {\n\tif ( showTooltip ) {\n\t\treturn (\n\t\t\t<Tooltip.Root>\n\t\t\t\t<Tooltip.Trigger render={ children } />\n\t\t\t\t<Tooltip.Popup>{ title }</Tooltip.Popup>\n\t\t\t</Tooltip.Root>\n\t\t);\n\t}\n\treturn <>{ children }</>;\n};\n\nfunction BlockPattern( {\n\tid,\n\tisDraggable,\n\tpattern,\n\tonClick,\n\tonHover,\n\tshowTitlesAsTooltip,\n\tcategory,\n\tisSelected,\n} ) {\n\tconst [ isDragging, setIsDragging ] = useState( false );\n\tconst { blocks, viewportWidth } = pattern;\n\tconst instanceId = useInstanceId( BlockPattern );\n\tconst descriptionId = `block-editor-block-patterns-list__item-description-${ instanceId }`;\n\tconst isUserPattern = pattern.type === INSERTER_PATTERN_TYPES.user;\n\n\t// When we have a selected category and the pattern is draggable, we need to update the\n\t// pattern's categories in metadata to only contain the selected category, and pass this to\n\t// InserterDraggableBlocks component. We do that because we use this information for pattern\n\t// shuffling and it makes more sense to show only the ones from the initially selected category during insertion.\n\tconst patternBlocks = useMemo( () => {\n\t\tif ( ! category || ! isDraggable ) {\n\t\t\treturn blocks;\n\t\t}\n\t\treturn ( blocks ?? [] ).map( ( block ) => {\n\t\t\tconst clonedBlock = cloneBlock( block );\n\t\t\tif (\n\t\t\t\tclonedBlock.attributes.metadata?.categories?.includes(\n\t\t\t\t\tcategory\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tclonedBlock.attributes.metadata.categories = [ category ];\n\t\t\t}\n\t\t\treturn clonedBlock;\n\t\t} );\n\t}, [ blocks, isDraggable, category ] );\n\n\treturn (\n\t\t<InserterDraggableBlocks\n\t\t\tisEnabled={ isDraggable }\n\t\t\tblocks={ patternBlocks }\n\t\t\tpattern={ pattern }\n\t\t>\n\t\t\t{ ( { draggable, onDragStart, onDragEnd } ) => (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"block-editor-block-patterns-list__list-item\"\n\t\t\t\t\tdraggable={ draggable }\n\t\t\t\t\tonDragStart={ ( event ) => {\n\t\t\t\t\t\tsetIsDragging( true );\n\t\t\t\t\t\tif ( onDragStart ) {\n\t\t\t\t\t\t\tonHover?.( null );\n\t\t\t\t\t\t\tonDragStart( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t\tonDragEnd={ ( event ) => {\n\t\t\t\t\t\tsetIsDragging( false );\n\t\t\t\t\t\tif ( onDragEnd ) {\n\t\t\t\t\t\t\tonDragEnd( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<WithToolTip\n\t\t\t\t\t\tshowTooltip={ showTitlesAsTooltip && ! isUserPattern }\n\t\t\t\t\t\ttitle={ pattern.title }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Composite.Item\n\t\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\t\t\taria-label={ pattern.title }\n\t\t\t\t\t\t\t\t\taria-describedby={\n\t\t\t\t\t\t\t\t\t\tpattern.description\n\t\t\t\t\t\t\t\t\t\t\t? descriptionId\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'block-editor-block-patterns-list__item',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'block-editor-block-patterns-list__list-item-synced':\n\t\t\t\t\t\t\t\t\t\t\t\tpattern.type ===\n\t\t\t\t\t\t\t\t\t\t\t\t\tINSERTER_PATTERN_TYPES.user &&\n\t\t\t\t\t\t\t\t\t\t\t\t! pattern.syncStatus,\n\t\t\t\t\t\t\t\t\t\t\t'is-selected': isSelected,\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/>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonClick( pattern, blocks );\n\t\t\t\t\t\t\t\tonHover?.( null );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonMouseEnter={ () => {\n\t\t\t\t\t\t\t\tif ( isDragging ) {\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonHover?.( pattern );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonMouseLeave={ () => onHover?.( null ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<BlockPreview.Async\n\t\t\t\t\t\t\t\tplaceholder={ <BlockPatternPlaceholder /> }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<BlockPreview\n\t\t\t\t\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\t\t\t\t\tviewportWidth={ viewportWidth }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</BlockPreview.Async>\n\t\t\t\t\t\t\t{ ( ! showTitlesAsTooltip || isUserPattern ) && (\n\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-patterns__pattern-details\"\n\t\t\t\t\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ isUserPattern && ! pattern.syncStatus && (\n\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-patterns__pattern-icon-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-patterns__pattern-icon\"\n\t\t\t\t\t\t\t\t\t\t\t\ticon={ symbol }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\t\t\t\trender={ <div /> }\n\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-block-patterns-list__item-title\"\n\t\t\t\t\t\t\t\t\t\tvariant=\"body-sm\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ pattern.title }\n\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t\t{ !! pattern.description && (\n\t\t\t\t\t\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t\t\t\t\t\t{ pattern.description }\n\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Composite.Item>\n\t\t\t\t\t</WithToolTip>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</InserterDraggableBlocks>\n\t);\n}\n\nfunction BlockPatternPlaceholder() {\n\treturn (\n\t\t<div className=\"block-editor-block-patterns-list__item is-placeholder\" />\n\t);\n}\n\nfunction BlockPatternsList(\n\t{\n\t\tisDraggable,\n\t\tblockPatterns,\n\t\tonHover,\n\t\tonClickPattern,\n\t\torientation,\n\t\tlabel = __( 'Block patterns' ),\n\t\tcategory,\n\t\tshowTitlesAsTooltip,\n\t\tpagingProps,\n\t},\n\tref\n) {\n\tconst [ activeCompositeId, setActiveCompositeId ] = useState( undefined );\n\tconst [ activePattern, setActivePattern ] = useState( null ); // State to track active pattern\n\n\tuseEffect( () => {\n\t\t// Reset the active composite item whenever the available patterns change,\n\t\t// to make sure that Composite widget can receive focus correctly when its\n\t\t// composite items change. The first composite item will receive focus.\n\t\tconst firstCompositeItemId = blockPatterns[ 0 ]?.name;\n\t\tsetActiveCompositeId( firstCompositeItemId );\n\t}, [ blockPatterns ] );\n\n\tconst handleClickPattern = ( pattern, blocks ) => {\n\t\tsetActivePattern( pattern.name );\n\t\tonClickPattern( pattern, blocks );\n\t};\n\n\treturn (\n\t\t<Composite\n\t\t\torientation={ orientation }\n\t\t\tactiveId={ activeCompositeId }\n\t\t\tsetActiveId={ setActiveCompositeId }\n\t\t\trole=\"listbox\"\n\t\t\tclassName=\"block-editor-block-patterns-list\"\n\t\t\taria-label={ label }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ blockPatterns.map( ( pattern ) => (\n\t\t\t\t<BlockPattern\n\t\t\t\t\tkey={ pattern.name }\n\t\t\t\t\tid={ pattern.name }\n\t\t\t\t\tpattern={ pattern }\n\t\t\t\t\tonClick={ handleClickPattern }\n\t\t\t\t\tonHover={ onHover }\n\t\t\t\t\tisDraggable={ isDraggable }\n\t\t\t\t\tshowTitlesAsTooltip={ showTitlesAsTooltip }\n\t\t\t\t\tcategory={ category }\n\t\t\t\t\tisSelected={\n\t\t\t\t\t\t!! activePattern && activePattern === pattern.name\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t\t{ pagingProps && <BlockPatternsPaging { ...pagingProps } /> }\n\t\t</Composite>\n\t);\n}\n\nexport default forwardRef( BlockPatternsList );\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/components/block-popover/index.mjs CHANGED Viewed

@@ -40,12 +40,22 @@ function BlockPopover({
     if (!selectedElement) {
       return;
     }
-    const observer = new window.MutationObserver(
-      forceRecomputePopoverDimensions
-    );
+    let rafId;
+    const observer = new window.MutationObserver(() => {
+      if (rafId) {
+        return;
+      }
+      rafId = window.requestAnimationFrame(() => {
+        rafId = null;
+        forceRecomputePopoverDimensions();
+      });
+    });
     observer.observe(selectedElement, { attributes: true });
     return () => {
       observer.disconnect();
+      if (rafId) {
+        window.cancelAnimationFrame(rafId);
+      }
     };
   }, [selectedElement]);
   const popoverAnchor = useMemo(() => {

package/build-module/components/block-popover/index.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/block-popover/index.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useMergeRefs } from '@wordpress/compose';\nimport { Popover } from '@wordpress/components';\nimport {\n\tforwardRef,\n\tuseMemo,\n\tuseReducer,\n\tuseLayoutEffect,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport usePopoverScroll from './use-popover-scroll';\nimport { rectUnion, getElementBounds } from '../../utils/dom';\n\nconst MAX_POPOVER_RECOMPUTE_COUNTER = Number.MAX_SAFE_INTEGER;\n\nfunction BlockPopover(\n\t{\n\t\tclientId,\n\t\tbottomClientId,\n\t\tchildren,\n\t\t__unstablePopoverSlot,\n\t\t__unstableContentRef,\n\t\tshift = true,\n\t\t...props\n\t},\n\tref\n) {\n\tconst selectedElement = useBlockElement( clientId );\n\tconst lastSelectedElement = useBlockElement( bottomClientId ?? clientId );\n\tconst mergedRefs = useMergeRefs( [\n\t\tref,\n\t\tusePopoverScroll( __unstableContentRef ),\n\t] );\n\n\tconst [\n\t\tpopoverDimensionsRecomputeCounter,\n\t\tforceRecomputePopoverDimensions,\n\t] = useReducer(\n\t\t// Module is there to make sure that the counter doesn't overflow.\n\t\t( s ) => ( s + 1 ) % MAX_POPOVER_RECOMPUTE_COUNTER,\n\t\t0\n\t);\n\n\t// When blocks are moved up/down, they are animated to their new position by\n\t// updating the `transform` property manually (i.e. without using CSS\n\t// transitions or animations). The animation, which can also scroll the block\n\t// editor, can sometimes cause the position of the Popover to get out of sync.\n\t// A MutationObserver is therefore used to make sure that changes to the\n\t// selectedElement's attribute (i.e. `transform`) can be tracked and used to\n\t// trigger the Popover to rerender.\n\tuseLayoutEffect( () => {\n\t\tif ( ! selectedElement ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst observer = new window.MutationObserver(\n\t\t\tforceRecomputePopoverDimensions\n\t\t);\n\t\tobserver.observe( selectedElement, { attributes: true } );\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t};\n\t}, [ selectedElement ] );\n\n\tconst popoverAnchor = useMemo( () => {\n\t\tif (\n\t\t\t// popoverDimensionsRecomputeCounter is by definition always equal or greater\n\t\t\t// than 0. This check is only there to satisfy the correctness of the\n\t\t\t// exhaustive-deps rule for the `useMemo` hook.\n\t\t\tpopoverDimensionsRecomputeCounter < 0 ||\n\t\t\t! selectedElement ||\n\t\t\t( bottomClientId && ! lastSelectedElement )\n\t\t) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\treturn {\n\t\t\tgetBoundingClientRect() {\n\t\t\t\treturn lastSelectedElement\n\t\t\t\t\t? rectUnion(\n\t\t\t\t\t\t\tgetElementBounds( selectedElement ),\n\t\t\t\t\t\t\tgetElementBounds( lastSelectedElement )\n\t\t\t\t\t  )\n\t\t\t\t\t: getElementBounds( selectedElement );\n\t\t\t},\n\t\t\tcontextElement: selectedElement,\n\t\t};\n\t}, [\n\t\tpopoverDimensionsRecomputeCounter,\n\t\tselectedElement,\n\t\tbottomClientId,\n\t\tlastSelectedElement,\n\t] );\n\n\tif ( ! selectedElement || ( bottomClientId && ! lastSelectedElement ) ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Popover\n\t\t\tref={ mergedRefs }\n\t\t\tanimate={ false }\n\t\t\tfocusOnMount={ false }\n\t\t\tanchor={ popoverAnchor }\n\t\t\t// Render in the old slot if needed for backward compatibility,\n\t\t\t// otherwise render in place (not in the default popover slot).\n\t\t\t__unstableSlotName={ __unstablePopoverSlot }\n\t\t\tinline={ ! __unstablePopoverSlot }\n\t\t\tplacement=\"top-start\"\n\t\t\tresize={ false }\n\t\t\tflip={ false }\n\t\t\tshift={ shift }\n\t\t\t{ ...props }\n\t\t\tclassName={ clsx( 'block-editor-block-popover', props.className ) }\n\t\t\tvariant=\"unstyled\"\n\t\t>\n\t\t\t{ children }\n\t\t</Popover>\n\t);\n}\n\nexport const PrivateBlockPopover = forwardRef( BlockPopover );\n\nconst PublicBlockPopover = (\n\t{ clientId, bottomClientId, children, ...props },\n\tref\n) => (\n\t<PrivateBlockPopover\n\t\t{ ...props }\n\t\tbottomClientId={ bottomClientId }\n\t\tclientId={ clientId }\n\t\t__unstableContentRef={ undefined }\n\t\t__unstablePopoverSlot={ undefined }\n\t\tref={ ref }\n\t>\n\t\t{ children }\n\t</PrivateBlockPopover>\n);\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-popover/README.md\n */\nexport default forwardRef( PublicBlockPopover );\n"],
-  "mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,oBAAoB;AAC7B,SAAS,eAAe;AACxB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AAKP,SAAS,uBAAuB;AAChC,OAAO,sBAAsB;AAC7B,SAAS,WAAW,wBAAwB;AAyF1C;AAvFF,IAAM,gCAAgC,OAAO;AAE7C,SAAS,aACR;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,GAAG;AACJ,GACA,KACC;AACD,QAAM,kBAAkB,gBAAiB,QAAS;AAClD,QAAM,sBAAsB,gBAAiB,kBAAkB,QAAS;AACxE,QAAM,aAAa,aAAc;AAAA,IAChC;AAAA,IACA,iBAAkB,oBAAqB;AAAA,EACxC,CAAE;AAEF,QAAM;AAAA,IACL;AAAA,IACA;AAAA,EACD,IAAI;AAAA;AAAA,IAEH,CAAE,OAAS,IAAI,KAAM;AAAA,IACrB;AAAA,EACD;AASA,kBAAiB,MAAM;AACtB,QAAK,CAAE,iBAAkB;AACxB;AAAA,IACD;AAEA,UAAM,WAAW,IAAI,OAAO;AAAA,MAC3B;AAAA,IACD;AACA,aAAS,QAAS,iBAAiB,EAAE,YAAY,KAAK,CAAE;AAExD,WAAO,MAAM;AACZ,eAAS,WAAW;AAAA,IACrB;AAAA,EACD,GAAG,CAAE,eAAgB,CAAE;AAEvB,QAAM,gBAAgB,QAAS,MAAM;AACpC;AAAA;AAAA;AAAA;AAAA,MAIC,oCAAoC,KACpC,CAAE,mBACA,kBAAkB,CAAE;AAAA,MACrB;AACD,aAAO;AAAA,IACR;AAEA,WAAO;AAAA,MACN,wBAAwB;AACvB,eAAO,sBACJ;AAAA,UACA,iBAAkB,eAAgB;AAAA,UAClC,iBAAkB,mBAAoB;AAAA,QACtC,IACA,iBAAkB,eAAgB;AAAA,MACtC;AAAA,MACA,gBAAgB;AAAA,IACjB;AAAA,EACD,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAEF,MAAK,CAAE,mBAAqB,kBAAkB,CAAE,qBAAwB;AACvE,WAAO;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,KAAM;AAAA,MACN,SAAU;AAAA,MACV,cAAe;AAAA,MACf,QAAS;AAAA,MAGT,oBAAqB;AAAA,MACrB,QAAS,CAAE;AAAA,MACX,WAAU;AAAA,MACV,QAAS;AAAA,MACT,MAAO;AAAA,MACP;AAAA,MACE,GAAG;AAAA,MACL,WAAY,KAAM,8BAA8B,MAAM,SAAU;AAAA,MAChE,SAAQ;AAAA,MAEN;AAAA;AAAA,EACH;AAEF;AAEO,IAAM,sBAAsB,WAAY,YAAa;AAE5D,IAAM,qBAAqB,CAC1B,EAAE,UAAU,gBAAgB,UAAU,GAAG,MAAM,GAC/C,QAEA;AAAA,EAAC;AAAA;AAAA,IACE,GAAG;AAAA,IACL;AAAA,IACA;AAAA,IACA,sBAAuB;AAAA,IACvB,uBAAwB;AAAA,IACxB;AAAA,IAEE;AAAA;AACH;AAMD,IAAO,wBAAQ,WAAY,kBAAmB;",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useMergeRefs } from '@wordpress/compose';\nimport { Popover } from '@wordpress/components';\nimport {\n\tforwardRef,\n\tuseMemo,\n\tuseReducer,\n\tuseLayoutEffect,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport usePopoverScroll from './use-popover-scroll';\nimport { rectUnion, getElementBounds } from '../../utils/dom';\n\nconst MAX_POPOVER_RECOMPUTE_COUNTER = Number.MAX_SAFE_INTEGER;\n\nfunction BlockPopover(\n\t{\n\t\tclientId,\n\t\tbottomClientId,\n\t\tchildren,\n\t\t__unstablePopoverSlot,\n\t\t__unstableContentRef,\n\t\tshift = true,\n\t\t...props\n\t},\n\tref\n) {\n\tconst selectedElement = useBlockElement( clientId );\n\tconst lastSelectedElement = useBlockElement( bottomClientId ?? clientId );\n\tconst mergedRefs = useMergeRefs( [\n\t\tref,\n\t\tusePopoverScroll( __unstableContentRef ),\n\t] );\n\n\tconst [\n\t\tpopoverDimensionsRecomputeCounter,\n\t\tforceRecomputePopoverDimensions,\n\t] = useReducer(\n\t\t// Module is there to make sure that the counter doesn't overflow.\n\t\t( s ) => ( s + 1 ) % MAX_POPOVER_RECOMPUTE_COUNTER,\n\t\t0\n\t);\n\n\t// `useMovingAnimation` writes the block's `transform` on every spring tick.\n\t// Reacting synchronously to each mutation would race with Floating UI's own\n\t// autoUpdate frame loop and cause the toolbar to visibly jump. Coalescing\n\t// to one recompute per animation frame avoids that. The observer can't\n\t// simply be removed: with autoUpdate's animationFrame mode alone, the\n\t// toolbar trails the block by ~1 frame because the spring's rAF and\n\t// autoUpdate's rAF are independently scheduled.\n\tuseLayoutEffect( () => {\n\t\tif ( ! selectedElement ) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet rafId;\n\t\tconst observer = new window.MutationObserver( () => {\n\t\t\tif ( rafId ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\trafId = window.requestAnimationFrame( () => {\n\t\t\t\trafId = null;\n\t\t\t\tforceRecomputePopoverDimensions();\n\t\t\t} );\n\t\t} );\n\t\tobserver.observe( selectedElement, { attributes: true } );\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t\tif ( rafId ) {\n\t\t\t\twindow.cancelAnimationFrame( rafId );\n\t\t\t}\n\t\t};\n\t}, [ selectedElement ] );\n\n\tconst popoverAnchor = useMemo( () => {\n\t\tif (\n\t\t\t// popoverDimensionsRecomputeCounter is by definition always equal or greater\n\t\t\t// than 0. This check is only there to satisfy the correctness of the\n\t\t\t// exhaustive-deps rule for the `useMemo` hook.\n\t\t\tpopoverDimensionsRecomputeCounter < 0 ||\n\t\t\t! selectedElement ||\n\t\t\t( bottomClientId && ! lastSelectedElement )\n\t\t) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\treturn {\n\t\t\tgetBoundingClientRect() {\n\t\t\t\treturn lastSelectedElement\n\t\t\t\t\t? rectUnion(\n\t\t\t\t\t\t\tgetElementBounds( selectedElement ),\n\t\t\t\t\t\t\tgetElementBounds( lastSelectedElement )\n\t\t\t\t\t  )\n\t\t\t\t\t: getElementBounds( selectedElement );\n\t\t\t},\n\t\t\tcontextElement: selectedElement,\n\t\t};\n\t}, [\n\t\tpopoverDimensionsRecomputeCounter,\n\t\tselectedElement,\n\t\tbottomClientId,\n\t\tlastSelectedElement,\n\t] );\n\n\tif ( ! selectedElement || ( bottomClientId && ! lastSelectedElement ) ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Popover\n\t\t\tref={ mergedRefs }\n\t\t\tanimate={ false }\n\t\t\tfocusOnMount={ false }\n\t\t\tanchor={ popoverAnchor }\n\t\t\t// Render in the old slot if needed for backward compatibility,\n\t\t\t// otherwise render in place (not in the default popover slot).\n\t\t\t__unstableSlotName={ __unstablePopoverSlot }\n\t\t\tinline={ ! __unstablePopoverSlot }\n\t\t\tplacement=\"top-start\"\n\t\t\tresize={ false }\n\t\t\tflip={ false }\n\t\t\tshift={ shift }\n\t\t\t{ ...props }\n\t\t\tclassName={ clsx( 'block-editor-block-popover', props.className ) }\n\t\t\tvariant=\"unstyled\"\n\t\t>\n\t\t\t{ children }\n\t\t</Popover>\n\t);\n}\n\nexport const PrivateBlockPopover = forwardRef( BlockPopover );\n\nconst PublicBlockPopover = (\n\t{ clientId, bottomClientId, children, ...props },\n\tref\n) => (\n\t<PrivateBlockPopover\n\t\t{ ...props }\n\t\tbottomClientId={ bottomClientId }\n\t\tclientId={ clientId }\n\t\t__unstableContentRef={ undefined }\n\t\t__unstablePopoverSlot={ undefined }\n\t\tref={ ref }\n\t>\n\t\t{ children }\n\t</PrivateBlockPopover>\n);\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-popover/README.md\n */\nexport default forwardRef( PublicBlockPopover );\n"],
+  "mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,oBAAoB;AAC7B,SAAS,eAAe;AACxB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AAKP,SAAS,uBAAuB;AAChC,OAAO,sBAAsB;AAC7B,SAAS,WAAW,wBAAwB;AAmG1C;AAjGF,IAAM,gCAAgC,OAAO;AAE7C,SAAS,aACR;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,GAAG;AACJ,GACA,KACC;AACD,QAAM,kBAAkB,gBAAiB,QAAS;AAClD,QAAM,sBAAsB,gBAAiB,kBAAkB,QAAS;AACxE,QAAM,aAAa,aAAc;AAAA,IAChC;AAAA,IACA,iBAAkB,oBAAqB;AAAA,EACxC,CAAE;AAEF,QAAM;AAAA,IACL;AAAA,IACA;AAAA,EACD,IAAI;AAAA;AAAA,IAEH,CAAE,OAAS,IAAI,KAAM;AAAA,IACrB;AAAA,EACD;AASA,kBAAiB,MAAM;AACtB,QAAK,CAAE,iBAAkB;AACxB;AAAA,IACD;AAEA,QAAI;AACJ,UAAM,WAAW,IAAI,OAAO,iBAAkB,MAAM;AACnD,UAAK,OAAQ;AACZ;AAAA,MACD;AACA,cAAQ,OAAO,sBAAuB,MAAM;AAC3C,gBAAQ;AACR,wCAAgC;AAAA,MACjC,CAAE;AAAA,IACH,CAAE;AACF,aAAS,QAAS,iBAAiB,EAAE,YAAY,KAAK,CAAE;AAExD,WAAO,MAAM;AACZ,eAAS,WAAW;AACpB,UAAK,OAAQ;AACZ,eAAO,qBAAsB,KAAM;AAAA,MACpC;AAAA,IACD;AAAA,EACD,GAAG,CAAE,eAAgB,CAAE;AAEvB,QAAM,gBAAgB,QAAS,MAAM;AACpC;AAAA;AAAA;AAAA;AAAA,MAIC,oCAAoC,KACpC,CAAE,mBACA,kBAAkB,CAAE;AAAA,MACrB;AACD,aAAO;AAAA,IACR;AAEA,WAAO;AAAA,MACN,wBAAwB;AACvB,eAAO,sBACJ;AAAA,UACA,iBAAkB,eAAgB;AAAA,UAClC,iBAAkB,mBAAoB;AAAA,QACtC,IACA,iBAAkB,eAAgB;AAAA,MACtC;AAAA,MACA,gBAAgB;AAAA,IACjB;AAAA,EACD,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAEF,MAAK,CAAE,mBAAqB,kBAAkB,CAAE,qBAAwB;AACvE,WAAO;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,KAAM;AAAA,MACN,SAAU;AAAA,MACV,cAAe;AAAA,MACf,QAAS;AAAA,MAGT,oBAAqB;AAAA,MACrB,QAAS,CAAE;AAAA,MACX,WAAU;AAAA,MACV,QAAS;AAAA,MACT,MAAO;AAAA,MACP;AAAA,MACE,GAAG;AAAA,MACL,WAAY,KAAM,8BAA8B,MAAM,SAAU;AAAA,MAChE,SAAQ;AAAA,MAEN;AAAA;AAAA,EACH;AAEF;AAEO,IAAM,sBAAsB,WAAY,YAAa;AAE5D,IAAM,qBAAqB,CAC1B,EAAE,UAAU,gBAAgB,UAAU,GAAG,MAAM,GAC/C,QAEA;AAAA,EAAC;AAAA;AAAA,IACE,GAAG;AAAA,IACL;AAAA,IACA;AAAA,IACA,sBAAuB;AAAA,IACvB,uBAAwB;AAAA,IACxB;AAAA,IAEE;AAAA;AACH;AAMD,IAAO,wBAAQ,WAAY,kBAAmB;",
   "names": []
 }

package/build-module/components/block-toolbar/switch-section-style.mjs CHANGED Viewed

@@ -2,7 +2,7 @@
 import {
   ToolbarButton,
   ToolbarGroup,
-  Icon,
+  Icon as WCIcon,
   Path,
   SVG
 } from "@wordpress/components";
@@ -84,7 +84,7 @@ function SwitchSectionStyle({ clientId }) {
       onClick: handleStyleSwitch,
       label: __("Shuffle styles"),
       children: /* @__PURE__ */ jsx(
-        Icon,
+        WCIcon,
         {
           icon: styleIcon,
           style: {

package/build-module/components/block-toolbar/switch-section-style.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/block-toolbar/switch-section-style.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tToolbarButton,\n\tToolbarGroup,\n\tIcon,\n\tPath,\n\tSVG,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useDispatch, useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport useStylesForBlocks from '../block-styles/use-styles-for-block';\nimport { replaceActiveStyle } from '../block-styles/utils';\nimport { store as blockEditorStore } from '../../store';\nimport { globalStylesDataKey } from '../../store/private-keys';\nimport { getVariationStylesWithRefValues } from '../../hooks/block-style-variation';\n\nconst styleIcon = (\n\t<SVG\n\t\tviewBox=\"0 0 24 24\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\twidth=\"24\"\n\t\theight=\"24\"\n\t\taria-hidden=\"true\"\n\t\tfocusable=\"false\"\n\t>\n\t\t<Path d=\"M17.2 10.9c-.5-1-1.2-2.1-2.1-3.2-.6-.9-1.3-1.7-2.1-2.6L12 4l-1 1.1c-.6.9-1.3 1.7-2 2.6-.8 1.2-1.5 2.3-2 3.2-.6 1.2-1 2.2-1 3 0 3.4 2.7 6.1 6.1 6.1s6.1-2.7 6.1-6.1c0-.8-.3-1.8-1-3z\" />\n\t\t<Path\n\t\t\tstroke=\"currentColor\"\n\t\t\tstrokeWidth=\"1.5\"\n\t\t\td=\"M17.2 10.9c-.5-1-1.2-2.1-2.1-3.2-.6-.9-1.3-1.7-2.1-2.6L12 4l-1 1.1c-.6.9-1.3 1.7-2 2.6-.8 1.2-1.5 2.3-2 3.2-.6 1.2-1 2.2-1 3 0 3.4 2.7 6.1 6.1 6.1s6.1-2.7 6.1-6.1c0-.8-.3-1.8-1-3z\"\n\t\t/>\n\t</SVG>\n);\n\nfunction SwitchSectionStyle( { clientId } ) {\n\tconst { stylesToRender, activeStyle, className } = useStylesForBlocks( {\n\t\tclientId,\n\t} );\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\t// Get global styles data\n\tconst { globalSettings, globalStyles, blockName } = useSelect(\n\t\t( select ) => {\n\t\t\tconst settings = select( blockEditorStore ).getSettings();\n\t\t\treturn {\n\t\t\t\tglobalSettings: settings.__experimentalFeatures,\n\t\t\t\tglobalStyles: settings[ globalStylesDataKey ],\n\t\t\t\tblockName: select( blockEditorStore ).getBlockName( clientId ),\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\t// Get the background color for the active style\n\tconst activeStyleBackground = activeStyle?.name\n\t\t? getVariationStylesWithRefValues(\n\t\t\t\t{\n\t\t\t\t\tsettings: globalSettings,\n\t\t\t\t\tstyles: globalStyles,\n\t\t\t\t},\n\t\t\t\tblockName,\n\t\t\t\tactiveStyle.name\n\t\t  )?.color?.background\n\t\t: undefined;\n\n\tif ( ! stylesToRender || stylesToRender.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tconst handleStyleSwitch = () => {\n\t\tconst currentIndex = stylesToRender.findIndex(\n\t\t\t( style ) => style.name === activeStyle.name\n\t\t);\n\n\t\tconst nextIndex = ( currentIndex + 1 ) % stylesToRender.length;\n\t\tconst nextStyle = stylesToRender[ nextIndex ];\n\n\t\tconst styleClassName = replaceActiveStyle(\n\t\t\tclassName,\n\t\t\tactiveStyle,\n\t\t\tnextStyle\n\t\t);\n\n\t\tupdateBlockAttributes( clientId, {\n\t\t\tclassName: styleClassName,\n\t\t} );\n\t};\n\n\treturn (\n\t\t<ToolbarGroup>\n\t\t\t<ToolbarButton\n\t\t\t\tonClick={ handleStyleSwitch }\n\t\t\t\tlabel={ __( 'Shuffle styles' ) }\n\t\t\t>\n\t\t\t\t<Icon\n\t\t\t\t\ticon={ styleIcon }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\tfill: activeStyleBackground || 'transparent',\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</ToolbarButton>\n\t\t</ToolbarGroup>\n\t);\n}\n\nexport default SwitchSectionStyle;\n"],
-  "mappings": ";AAGA;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,UAAU;AACnB,SAAS,aAAa,iBAAiB;AAKvC,OAAO,wBAAwB;AAC/B,SAAS,0BAA0B;AACnC,SAAS,SAAS,wBAAwB;AAC1C,SAAS,2BAA2B;AACpC,SAAS,uCAAuC;AAG/C,SAQC,KARD;AADD,IAAM,YACL;AAAA,EAAC;AAAA;AAAA,IACA,SAAQ;AAAA,IACR,OAAM;AAAA,IACN,OAAM;AAAA,IACN,QAAO;AAAA,IACP,eAAY;AAAA,IACZ,WAAU;AAAA,IAEV;AAAA,0BAAC,QAAK,GAAE,uLAAsL;AAAA,MAC9L;AAAA,QAAC;AAAA;AAAA,UACA,QAAO;AAAA,UACP,aAAY;AAAA,UACZ,GAAE;AAAA;AAAA,MACH;AAAA;AAAA;AACD;AAGD,SAAS,mBAAoB,EAAE,SAAS,GAAI;AAC3C,QAAM,EAAE,gBAAgB,aAAa,UAAU,IAAI,mBAAoB;AAAA,IACtE;AAAA,EACD,CAAE;AACF,QAAM,EAAE,sBAAsB,IAAI,YAAa,gBAAiB;AAGhE,QAAM,EAAE,gBAAgB,cAAc,UAAU,IAAI;AAAA,IACnD,CAAE,WAAY;AACb,YAAM,WAAW,OAAQ,gBAAiB,EAAE,YAAY;AACxD,aAAO;AAAA,QACN,gBAAgB,SAAS;AAAA,QACzB,cAAc,SAAU,mBAAoB;AAAA,QAC5C,WAAW,OAAQ,gBAAiB,EAAE,aAAc,QAAS;AAAA,MAC9D;AAAA,IACD;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AAGA,QAAM,wBAAwB,aAAa,OACxC;AAAA,IACA;AAAA,MACC,UAAU;AAAA,MACV,QAAQ;AAAA,IACT;AAAA,IACA;AAAA,IACA,YAAY;AAAA,EACZ,GAAG,OAAO,aACV;AAEH,MAAK,CAAE,kBAAkB,eAAe,WAAW,GAAI;AACtD,WAAO;AAAA,EACR;AAEA,QAAM,oBAAoB,MAAM;AAC/B,UAAM,eAAe,eAAe;AAAA,MACnC,CAAE,UAAW,MAAM,SAAS,YAAY;AAAA,IACzC;AAEA,UAAM,aAAc,eAAe,KAAM,eAAe;AACxD,UAAM,YAAY,eAAgB,SAAU;AAE5C,UAAM,iBAAiB;AAAA,MACtB;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAEA,0BAAuB,UAAU;AAAA,MAChC,WAAW;AAAA,IACZ,CAAE;AAAA,EACH;AAEA,SACC,oBAAC,gBACA;AAAA,IAAC;AAAA;AAAA,MACA,SAAU;AAAA,MACV,OAAQ,GAAI,gBAAiB;AAAA,MAE7B;AAAA,QAAC;AAAA;AAAA,UACA,MAAO;AAAA,UACP,OAAQ;AAAA,YACP,MAAM,yBAAyB;AAAA,UAChC;AAAA;AAAA,MACD;AAAA;AAAA,EACD,GACD;AAEF;AAEA,IAAO,+BAAQ;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tToolbarButton,\n\tToolbarGroup,\n\tIcon as WCIcon,\n\tPath,\n\tSVG,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useDispatch, useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport useStylesForBlocks from '../block-styles/use-styles-for-block';\nimport { replaceActiveStyle } from '../block-styles/utils';\nimport { store as blockEditorStore } from '../../store';\nimport { globalStylesDataKey } from '../../store/private-keys';\nimport { getVariationStylesWithRefValues } from '../../hooks/block-style-variation';\n\nconst styleIcon = (\n\t<SVG\n\t\tviewBox=\"0 0 24 24\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\twidth=\"24\"\n\t\theight=\"24\"\n\t\taria-hidden=\"true\"\n\t\tfocusable=\"false\"\n\t>\n\t\t<Path d=\"M17.2 10.9c-.5-1-1.2-2.1-2.1-3.2-.6-.9-1.3-1.7-2.1-2.6L12 4l-1 1.1c-.6.9-1.3 1.7-2 2.6-.8 1.2-1.5 2.3-2 3.2-.6 1.2-1 2.2-1 3 0 3.4 2.7 6.1 6.1 6.1s6.1-2.7 6.1-6.1c0-.8-.3-1.8-1-3z\" />\n\t\t<Path\n\t\t\tstroke=\"currentColor\"\n\t\t\tstrokeWidth=\"1.5\"\n\t\t\td=\"M17.2 10.9c-.5-1-1.2-2.1-2.1-3.2-.6-.9-1.3-1.7-2.1-2.6L12 4l-1 1.1c-.6.9-1.3 1.7-2 2.6-.8 1.2-1.5 2.3-2 3.2-.6 1.2-1 2.2-1 3 0 3.4 2.7 6.1 6.1 6.1s6.1-2.7 6.1-6.1c0-.8-.3-1.8-1-3z\"\n\t\t/>\n\t</SVG>\n);\n\nfunction SwitchSectionStyle( { clientId } ) {\n\tconst { stylesToRender, activeStyle, className } = useStylesForBlocks( {\n\t\tclientId,\n\t} );\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\t// Get global styles data\n\tconst { globalSettings, globalStyles, blockName } = useSelect(\n\t\t( select ) => {\n\t\t\tconst settings = select( blockEditorStore ).getSettings();\n\t\t\treturn {\n\t\t\t\tglobalSettings: settings.__experimentalFeatures,\n\t\t\t\tglobalStyles: settings[ globalStylesDataKey ],\n\t\t\t\tblockName: select( blockEditorStore ).getBlockName( clientId ),\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\t// Get the background color for the active style\n\tconst activeStyleBackground = activeStyle?.name\n\t\t? getVariationStylesWithRefValues(\n\t\t\t\t{\n\t\t\t\t\tsettings: globalSettings,\n\t\t\t\t\tstyles: globalStyles,\n\t\t\t\t},\n\t\t\t\tblockName,\n\t\t\t\tactiveStyle.name\n\t\t  )?.color?.background\n\t\t: undefined;\n\n\tif ( ! stylesToRender || stylesToRender.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tconst handleStyleSwitch = () => {\n\t\tconst currentIndex = stylesToRender.findIndex(\n\t\t\t( style ) => style.name === activeStyle.name\n\t\t);\n\n\t\tconst nextIndex = ( currentIndex + 1 ) % stylesToRender.length;\n\t\tconst nextStyle = stylesToRender[ nextIndex ];\n\n\t\tconst styleClassName = replaceActiveStyle(\n\t\t\tclassName,\n\t\t\tactiveStyle,\n\t\t\tnextStyle\n\t\t);\n\n\t\tupdateBlockAttributes( clientId, {\n\t\t\tclassName: styleClassName,\n\t\t} );\n\t};\n\n\treturn (\n\t\t<ToolbarGroup>\n\t\t\t<ToolbarButton\n\t\t\t\tonClick={ handleStyleSwitch }\n\t\t\t\tlabel={ __( 'Shuffle styles' ) }\n\t\t\t>\n\t\t\t\t<WCIcon\n\t\t\t\t\ticon={ styleIcon }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\tfill: activeStyleBackground || 'transparent',\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</ToolbarButton>\n\t\t</ToolbarGroup>\n\t);\n}\n\nexport default SwitchSectionStyle;\n"],
+  "mappings": ";AAGA;AAAA,EACC;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,OACM;AACP,SAAS,UAAU;AACnB,SAAS,aAAa,iBAAiB;AAKvC,OAAO,wBAAwB;AAC/B,SAAS,0BAA0B;AACnC,SAAS,SAAS,wBAAwB;AAC1C,SAAS,2BAA2B;AACpC,SAAS,uCAAuC;AAG/C,SAQC,KARD;AADD,IAAM,YACL;AAAA,EAAC;AAAA;AAAA,IACA,SAAQ;AAAA,IACR,OAAM;AAAA,IACN,OAAM;AAAA,IACN,QAAO;AAAA,IACP,eAAY;AAAA,IACZ,WAAU;AAAA,IAEV;AAAA,0BAAC,QAAK,GAAE,uLAAsL;AAAA,MAC9L;AAAA,QAAC;AAAA;AAAA,UACA,QAAO;AAAA,UACP,aAAY;AAAA,UACZ,GAAE;AAAA;AAAA,MACH;AAAA;AAAA;AACD;AAGD,SAAS,mBAAoB,EAAE,SAAS,GAAI;AAC3C,QAAM,EAAE,gBAAgB,aAAa,UAAU,IAAI,mBAAoB;AAAA,IACtE;AAAA,EACD,CAAE;AACF,QAAM,EAAE,sBAAsB,IAAI,YAAa,gBAAiB;AAGhE,QAAM,EAAE,gBAAgB,cAAc,UAAU,IAAI;AAAA,IACnD,CAAE,WAAY;AACb,YAAM,WAAW,OAAQ,gBAAiB,EAAE,YAAY;AACxD,aAAO;AAAA,QACN,gBAAgB,SAAS;AAAA,QACzB,cAAc,SAAU,mBAAoB;AAAA,QAC5C,WAAW,OAAQ,gBAAiB,EAAE,aAAc,QAAS;AAAA,MAC9D;AAAA,IACD;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AAGA,QAAM,wBAAwB,aAAa,OACxC;AAAA,IACA;AAAA,MACC,UAAU;AAAA,MACV,QAAQ;AAAA,IACT;AAAA,IACA;AAAA,IACA,YAAY;AAAA,EACZ,GAAG,OAAO,aACV;AAEH,MAAK,CAAE,kBAAkB,eAAe,WAAW,GAAI;AACtD,WAAO;AAAA,EACR;AAEA,QAAM,oBAAoB,MAAM;AAC/B,UAAM,eAAe,eAAe;AAAA,MACnC,CAAE,UAAW,MAAM,SAAS,YAAY;AAAA,IACzC;AAEA,UAAM,aAAc,eAAe,KAAM,eAAe;AACxD,UAAM,YAAY,eAAgB,SAAU;AAE5C,UAAM,iBAAiB;AAAA,MACtB;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAEA,0BAAuB,UAAU;AAAA,MAChC,WAAW;AAAA,IACZ,CAAE;AAAA,EACH;AAEA,SACC,oBAAC,gBACA;AAAA,IAAC;AAAA;AAAA,MACA,SAAU;AAAA,MACV,OAAQ,GAAI,gBAAiB;AAAA,MAE7B;AAAA,QAAC;AAAA;AAAA,UACA,MAAO;AAAA,UACP,OAAQ;AAAA,YACP,MAAM,yBAAyB;AAAA,UAChC;AAAA;AAAA,MACD;AAAA;AAAA,EACD,GACD;AAEF;AAEA,IAAO,+BAAQ;",
   "names": []
 }

package/build-module/components/block-visibility/modal.mjs CHANGED Viewed

@@ -12,7 +12,7 @@ import {
   CheckboxControl,
   Flex,
   FlexItem,
-  Icon,
+  Icon as WCIcon,
   Modal
 } from "@wordpress/components";
 import { useDispatch, useSelect } from "@wordpress/data";
@@ -222,7 +222,7 @@ function BlockVisibilityModal({ clientIds, onClose }) {
                       }
                     ),
                     /* @__PURE__ */ jsx(
-                      Icon,
+                      WCIcon,
                       {
                         icon,
                         className: clsx({

package/build-module/components/block-visibility/modal.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/block-visibility/modal.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tuseState,\n\tuseMemo,\n\tuseCallback,\n\tcreateInterpolateElement,\n} from '@wordpress/element';\nimport {\n\tButton,\n\tCheckboxControl,\n\tFlex,\n\tFlexItem,\n\tIcon,\n\tModal,\n} from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';\nimport { store as noticesStore } from '@wordpress/notices';\n\n/**\n * Internal dependencies\n */\nimport {\n\tBLOCK_VISIBILITY_VIEWPORT_ENTRIES,\n\tBLOCK_VISIBILITY_VIEWPORTS,\n} from './constants';\nimport { store as blockEditorStore } from '../../store';\nimport { cleanEmptyObject } from '../../hooks/utils';\nimport {\n\tgetViewportCheckboxState,\n\tgetHideEverywhereCheckboxState,\n} from './utils';\n\nconst DEFAULT_VIEWPORT_CHECKBOX_VALUES = {\n\t[ BLOCK_VISIBILITY_VIEWPORTS.mobile.key ]: false,\n\t[ BLOCK_VISIBILITY_VIEWPORTS.tablet.key ]: false,\n\t[ BLOCK_VISIBILITY_VIEWPORTS.desktop.key ]: false,\n};\n\nconst EMPTY_BLOCKS = [];\n\n/**\n * Modal component for configuring block visibility across viewports.\n *\n * Allows users to hide blocks on specific viewport sizes (mobile, tablet, desktop)\n * or hide them everywhere. When editing multiple blocks, checkboxes only show as\n * checked if ALL selected blocks share the same setting to avoid ambiguity.\n *\n * @param {Object}   props           Component props.\n * @param {Array}    props.clientIds The client IDs of the blocks to hide.\n * @param {Function} props.onClose   Callback function invoked when the modal is closed.\n * @return {React.JSX.Element} The modal component.\n */\nexport default function BlockVisibilityModal( { clientIds, onClose } ) {\n\tconst { createSuccessNotice } = useDispatch( noticesStore );\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\tconst blocks = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getBlocksByClientId( clientIds ) ??\n\t\t\tEMPTY_BLOCKS,\n\t\t[ clientIds ]\n\t);\n\tconst listViewShortcut = useSelect( ( select ) => {\n\t\treturn select( keyboardShortcutsStore ).getShortcutRepresentation(\n\t\t\t'core/editor/toggle-list-view'\n\t\t);\n\t}, [] );\n\n\tconst initialViewportValues = useMemo( () => {\n\t\tif ( blocks?.length === 0 ) {\n\t\t\treturn {\n\t\t\t\thideEverywhere: false,\n\t\t\t\tviewportChecked: {},\n\t\t\t};\n\t\t}\n\n\t\tconst viewportValues = {};\n\n\t\tBLOCK_VISIBILITY_VIEWPORT_ENTRIES.forEach( ( [ , { key } ] ) => {\n\t\t\tviewportValues[ key ] = getViewportCheckboxState( blocks, key );\n\t\t} );\n\n\t\treturn {\n\t\t\thideEverywhere: getHideEverywhereCheckboxState( blocks ),\n\t\t\tviewportChecked: viewportValues,\n\t\t};\n\t}, [ blocks ] );\n\n\tconst [ viewportChecked, setViewportChecked ] = useState(\n\t\tinitialViewportValues?.viewportChecked ?? {}\n\t);\n\tconst [ hideEverywhere, setHideEverywhere ] = useState(\n\t\tinitialViewportValues?.hideEverywhere ?? false\n\t);\n\n\tconst handleViewportCheckboxChange = useCallback(\n\t\t( viewport, isChecked ) => {\n\t\t\tsetViewportChecked( {\n\t\t\t\t...viewportChecked,\n\t\t\t\t[ viewport ]: isChecked,\n\t\t\t} );\n\t\t},\n\t\t[ viewportChecked ]\n\t);\n\n\tconst noticeMessage = useMemo( () => {\n\t\tif ( ! hideEverywhere ) {\n\t\t\treturn sprintf(\n\t\t\t\t// translators: %s: The shortcut key to access the List View.\n\t\t\t\t__(\n\t\t\t\t\t'Block visibility settings updated. You can access them via the List View (%s).'\n\t\t\t\t),\n\t\t\t\tlistViewShortcut\n\t\t\t);\n\t\t}\n\n\t\tconst message =\n\t\t\tblocks?.length > 1\n\t\t\t\t? // translators: %s: The shortcut key to access the List View.\n\t\t\t\t  __(\n\t\t\t\t\t\t'Blocks hidden. You can access them via the List View (%s).'\n\t\t\t\t  )\n\t\t\t\t: // translators: %s: The shortcut key to access the List View.\n\t\t\t\t  __(\n\t\t\t\t\t\t'Block hidden. You can access it via the List View (%s).'\n\t\t\t\t  );\n\n\t\treturn sprintf( message, listViewShortcut );\n\t}, [ hideEverywhere, blocks?.length, listViewShortcut ] );\n\n\tconst isAnyViewportChecked = useMemo(\n\t\t() =>\n\t\t\tObject.values( viewportChecked ).some(\n\t\t\t\t( checked ) => checked === true || checked === null\n\t\t\t),\n\t\t[ viewportChecked ]\n\t);\n\n\tconst isDirty = useMemo( () => {\n\t\tif ( hideEverywhere !== initialViewportValues.hideEverywhere ) {\n\t\t\treturn true;\n\t\t}\n\t\treturn BLOCK_VISIBILITY_VIEWPORT_ENTRIES.some(\n\t\t\t( [ , { key } ] ) =>\n\t\t\t\tviewportChecked[ key ] !==\n\t\t\t\tinitialViewportValues.viewportChecked[ key ]\n\t\t);\n\t}, [ hideEverywhere, viewportChecked, initialViewportValues ] );\n\n\tconst hasIndeterminateValues = useMemo( () => {\n\t\tif ( hideEverywhere === null ) {\n\t\t\treturn true;\n\t\t}\n\t\treturn Object.values( viewportChecked ).some(\n\t\t\t( checked ) => checked === null\n\t\t);\n\t}, [ hideEverywhere, viewportChecked ] );\n\n\tconst handleSubmit = useCallback(\n\t\t( event ) => {\n\t\t\tevent.preventDefault();\n\t\t\tconst newVisibility = hideEverywhere\n\t\t\t\t? false\n\t\t\t\t: {\n\t\t\t\t\t\tviewport: BLOCK_VISIBILITY_VIEWPORT_ENTRIES.reduce(\n\t\t\t\t\t\t\t( acc, [ , { key } ] ) => {\n\t\t\t\t\t\t\t\tif ( viewportChecked[ key ] ) {\n\t\t\t\t\t\t\t\t\t// Values are inverted to hide the block on the selected viewport.\n\t\t\t\t\t\t\t\t\t// In the UI, the checkbox is checked (true) when the block is hidden on the selected viewport,\n\t\t\t\t\t\t\t\t\t// so 'false' means hide the block on the selected viewport.\n\t\t\t\t\t\t\t\t\tacc[ key ] = false;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\treturn acc;\n\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  };\n\t\t\tconst attributesByClientId = Object.fromEntries(\n\t\t\t\tblocks.map( ( { clientId, attributes } ) => [\n\t\t\t\t\tclientId,\n\t\t\t\t\t{\n\t\t\t\t\t\tmetadata: cleanEmptyObject( {\n\t\t\t\t\t\t\t...attributes?.metadata,\n\t\t\t\t\t\t\tblockVisibility: newVisibility,\n\t\t\t\t\t\t} ),\n\t\t\t\t\t},\n\t\t\t\t] )\n\t\t\t);\n\t\t\tupdateBlockAttributes( clientIds, attributesByClientId, {\n\t\t\t\tuniqueByBlock: true,\n\t\t\t} );\n\n\t\t\tcreateSuccessNotice( noticeMessage, {\n\t\t\t\tid: hideEverywhere\n\t\t\t\t\t? 'block-visibility-hidden'\n\t\t\t\t\t: 'block-visibility-viewports-updated',\n\t\t\t\ttype: 'snackbar',\n\t\t\t} );\n\t\t\tonClose();\n\t\t},\n\t\t[\n\t\t\tblocks,\n\t\t\tclientIds,\n\t\t\tcreateSuccessNotice,\n\t\t\thideEverywhere,\n\t\t\tnoticeMessage,\n\t\t\tonClose,\n\t\t\tupdateBlockAttributes,\n\t\t\tviewportChecked,\n\t\t]\n\t);\n\n\tconst hasMultipleBlocks = blocks?.length > 1;\n\n\treturn (\n\t\t<Modal\n\t\t\ttitle={\n\t\t\t\tclientIds?.length > 1 ? __( 'Hide blocks' ) : __( 'Hide block' )\n\t\t\t}\n\t\t\tonRequestClose={ onClose }\n\t\t\toverlayClassName=\"block-editor-block-visibility-modal\"\n\t\t\tsize=\"small\"\n\t\t>\n\t\t\t<form onSubmit={ handleSubmit }>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<legend>\n\t\t\t\t\t\t{ hasMultipleBlocks\n\t\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t\t'Select the viewport sizes for which you want to hide the blocks. Changes will apply to all selected blocks.'\n\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t'Select the viewport size for which you want to hide the block.'\n\t\t\t\t\t\t\t  ) }\n\t\t\t\t\t</legend>\n\t\t\t\t\t<ul className=\"block-editor-block-visibility-modal__options\">\n\t\t\t\t\t\t<li className=\"block-editor-block-visibility-modal__options-item block-editor-block-visibility-modal__options-item--everywhere\">\n\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\tclassName=\"block-editor-block-visibility-modal__options-checkbox--everywhere\"\n\t\t\t\t\t\t\t\tlabel={ __( 'Omit from published content' ) }\n\t\t\t\t\t\t\t\tchecked={ hideEverywhere === true }\n\t\t\t\t\t\t\t\tindeterminate={ hideEverywhere === null }\n\t\t\t\t\t\t\t\tonChange={ ( checked ) => {\n\t\t\t\t\t\t\t\t\tsetHideEverywhere( checked );\n\t\t\t\t\t\t\t\t\t// Reset viewport checkboxes when hide everywhere is checked.\n\t\t\t\t\t\t\t\t\tsetViewportChecked(\n\t\t\t\t\t\t\t\t\t\tDEFAULT_VIEWPORT_CHECKBOX_VALUES\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ hideEverywhere !== true && (\n\t\t\t\t\t\t\t\t<ul className=\"block-editor-block-visibility-modal__sub-options\">\n\t\t\t\t\t\t\t\t\t{ BLOCK_VISIBILITY_VIEWPORT_ENTRIES.map(\n\t\t\t\t\t\t\t\t\t\t( [ , { label, icon, key } ] ) => (\n\t\t\t\t\t\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t\t\t\t\t\tkey={ key }\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-block-visibility-modal__options-item\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\t\t\t\t\t\tlabel={ sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t// translators: %s: The viewport name.\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t__( 'Hide on %s' ),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\t\tchecked={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tviewportChecked[\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t] ?? false\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tindeterminate={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tviewportChecked[\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t] === null\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonChange={ ( checked ) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\thandleViewportCheckboxChange(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tchecked\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={ clsx( {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'block-editor-block-visibility-modal__options-icon--checked':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tviewportChecked[\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</li>\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</ul>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t\t{ hasMultipleBlocks && hasIndeterminateValues && (\n\t\t\t\t\t\t<p className=\"block-editor-block-visibility-modal__description\">\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Selected blocks have different visibility settings. The checkboxes show an indeterminate state when settings differ.'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</p>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! hasMultipleBlocks && hideEverywhere === true && (\n\t\t\t\t\t\t<p className=\"block-editor-block-visibility-modal__description\">\n\t\t\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t\t\t// translators: %s: The shortcut key to access the List View.\n\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t'Block will be hidden in the editor, and omitted from the published markup on the frontend. You can configure it again by selecting it in the List View (%s).'\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\tlistViewShortcut\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</p>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! hasMultipleBlocks &&\n\t\t\t\t\t\t! hideEverywhere &&\n\t\t\t\t\t\tisAnyViewportChecked && (\n\t\t\t\t\t\t\t<p className=\"block-editor-block-visibility-modal__description\">\n\t\t\t\t\t\t\t\t{ createInterpolateElement(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t\t\t// translators: %s: The shortcut key to access the List View\n\t\t\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t\t\t'Block will be hidden according to the selected viewports. It will be <strong>included in the published markup on the frontend</strong>. You can configure it again by selecting it in the List View (%s).'\n\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\tlistViewShortcut\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tstrong: <strong />,\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t) }\n\t\t\t\t</fieldset>\n\t\t\t\t<Flex\n\t\t\t\t\tclassName=\"block-editor-block-visibility-modal__actions\"\n\t\t\t\t\tjustify=\"flex-end\"\n\t\t\t\t\texpanded={ false }\n\t\t\t\t>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Apply' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t</form>\n\t\t</Modal>\n\t);\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tuseState,\n\tuseMemo,\n\tuseCallback,\n\tcreateInterpolateElement,\n} from '@wordpress/element';\nimport {\n\tButton,\n\tCheckboxControl,\n\tFlex,\n\tFlexItem,\n\tIcon as WCIcon,\n\tModal,\n} from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';\nimport { store as noticesStore } from '@wordpress/notices';\n\n/**\n * Internal dependencies\n */\nimport {\n\tBLOCK_VISIBILITY_VIEWPORT_ENTRIES,\n\tBLOCK_VISIBILITY_VIEWPORTS,\n} from './constants';\nimport { store as blockEditorStore } from '../../store';\nimport { cleanEmptyObject } from '../../hooks/utils';\nimport {\n\tgetViewportCheckboxState,\n\tgetHideEverywhereCheckboxState,\n} from './utils';\n\nconst DEFAULT_VIEWPORT_CHECKBOX_VALUES = {\n\t[ BLOCK_VISIBILITY_VIEWPORTS.mobile.key ]: false,\n\t[ BLOCK_VISIBILITY_VIEWPORTS.tablet.key ]: false,\n\t[ BLOCK_VISIBILITY_VIEWPORTS.desktop.key ]: false,\n};\n\nconst EMPTY_BLOCKS = [];\n\n/**\n * Modal component for configuring block visibility across viewports.\n *\n * Allows users to hide blocks on specific viewport sizes (mobile, tablet, desktop)\n * or hide them everywhere. When editing multiple blocks, checkboxes only show as\n * checked if ALL selected blocks share the same setting to avoid ambiguity.\n *\n * @param {Object}   props           Component props.\n * @param {Array}    props.clientIds The client IDs of the blocks to hide.\n * @param {Function} props.onClose   Callback function invoked when the modal is closed.\n * @return {React.JSX.Element} The modal component.\n */\nexport default function BlockVisibilityModal( { clientIds, onClose } ) {\n\tconst { createSuccessNotice } = useDispatch( noticesStore );\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\tconst blocks = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getBlocksByClientId( clientIds ) ??\n\t\t\tEMPTY_BLOCKS,\n\t\t[ clientIds ]\n\t);\n\tconst listViewShortcut = useSelect( ( select ) => {\n\t\treturn select( keyboardShortcutsStore ).getShortcutRepresentation(\n\t\t\t'core/editor/toggle-list-view'\n\t\t);\n\t}, [] );\n\n\tconst initialViewportValues = useMemo( () => {\n\t\tif ( blocks?.length === 0 ) {\n\t\t\treturn {\n\t\t\t\thideEverywhere: false,\n\t\t\t\tviewportChecked: {},\n\t\t\t};\n\t\t}\n\n\t\tconst viewportValues = {};\n\n\t\tBLOCK_VISIBILITY_VIEWPORT_ENTRIES.forEach( ( [ , { key } ] ) => {\n\t\t\tviewportValues[ key ] = getViewportCheckboxState( blocks, key );\n\t\t} );\n\n\t\treturn {\n\t\t\thideEverywhere: getHideEverywhereCheckboxState( blocks ),\n\t\t\tviewportChecked: viewportValues,\n\t\t};\n\t}, [ blocks ] );\n\n\tconst [ viewportChecked, setViewportChecked ] = useState(\n\t\tinitialViewportValues?.viewportChecked ?? {}\n\t);\n\tconst [ hideEverywhere, setHideEverywhere ] = useState(\n\t\tinitialViewportValues?.hideEverywhere ?? false\n\t);\n\n\tconst handleViewportCheckboxChange = useCallback(\n\t\t( viewport, isChecked ) => {\n\t\t\tsetViewportChecked( {\n\t\t\t\t...viewportChecked,\n\t\t\t\t[ viewport ]: isChecked,\n\t\t\t} );\n\t\t},\n\t\t[ viewportChecked ]\n\t);\n\n\tconst noticeMessage = useMemo( () => {\n\t\tif ( ! hideEverywhere ) {\n\t\t\treturn sprintf(\n\t\t\t\t// translators: %s: The shortcut key to access the List View.\n\t\t\t\t__(\n\t\t\t\t\t'Block visibility settings updated. You can access them via the List View (%s).'\n\t\t\t\t),\n\t\t\t\tlistViewShortcut\n\t\t\t);\n\t\t}\n\n\t\tconst message =\n\t\t\tblocks?.length > 1\n\t\t\t\t? // translators: %s: The shortcut key to access the List View.\n\t\t\t\t  __(\n\t\t\t\t\t\t'Blocks hidden. You can access them via the List View (%s).'\n\t\t\t\t  )\n\t\t\t\t: // translators: %s: The shortcut key to access the List View.\n\t\t\t\t  __(\n\t\t\t\t\t\t'Block hidden. You can access it via the List View (%s).'\n\t\t\t\t  );\n\n\t\treturn sprintf( message, listViewShortcut );\n\t}, [ hideEverywhere, blocks?.length, listViewShortcut ] );\n\n\tconst isAnyViewportChecked = useMemo(\n\t\t() =>\n\t\t\tObject.values( viewportChecked ).some(\n\t\t\t\t( checked ) => checked === true || checked === null\n\t\t\t),\n\t\t[ viewportChecked ]\n\t);\n\n\tconst isDirty = useMemo( () => {\n\t\tif ( hideEverywhere !== initialViewportValues.hideEverywhere ) {\n\t\t\treturn true;\n\t\t}\n\t\treturn BLOCK_VISIBILITY_VIEWPORT_ENTRIES.some(\n\t\t\t( [ , { key } ] ) =>\n\t\t\t\tviewportChecked[ key ] !==\n\t\t\t\tinitialViewportValues.viewportChecked[ key ]\n\t\t);\n\t}, [ hideEverywhere, viewportChecked, initialViewportValues ] );\n\n\tconst hasIndeterminateValues = useMemo( () => {\n\t\tif ( hideEverywhere === null ) {\n\t\t\treturn true;\n\t\t}\n\t\treturn Object.values( viewportChecked ).some(\n\t\t\t( checked ) => checked === null\n\t\t);\n\t}, [ hideEverywhere, viewportChecked ] );\n\n\tconst handleSubmit = useCallback(\n\t\t( event ) => {\n\t\t\tevent.preventDefault();\n\t\t\tconst newVisibility = hideEverywhere\n\t\t\t\t? false\n\t\t\t\t: {\n\t\t\t\t\t\tviewport: BLOCK_VISIBILITY_VIEWPORT_ENTRIES.reduce(\n\t\t\t\t\t\t\t( acc, [ , { key } ] ) => {\n\t\t\t\t\t\t\t\tif ( viewportChecked[ key ] ) {\n\t\t\t\t\t\t\t\t\t// Values are inverted to hide the block on the selected viewport.\n\t\t\t\t\t\t\t\t\t// In the UI, the checkbox is checked (true) when the block is hidden on the selected viewport,\n\t\t\t\t\t\t\t\t\t// so 'false' means hide the block on the selected viewport.\n\t\t\t\t\t\t\t\t\tacc[ key ] = false;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\treturn acc;\n\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  };\n\t\t\tconst attributesByClientId = Object.fromEntries(\n\t\t\t\tblocks.map( ( { clientId, attributes } ) => [\n\t\t\t\t\tclientId,\n\t\t\t\t\t{\n\t\t\t\t\t\tmetadata: cleanEmptyObject( {\n\t\t\t\t\t\t\t...attributes?.metadata,\n\t\t\t\t\t\t\tblockVisibility: newVisibility,\n\t\t\t\t\t\t} ),\n\t\t\t\t\t},\n\t\t\t\t] )\n\t\t\t);\n\t\t\tupdateBlockAttributes( clientIds, attributesByClientId, {\n\t\t\t\tuniqueByBlock: true,\n\t\t\t} );\n\n\t\t\tcreateSuccessNotice( noticeMessage, {\n\t\t\t\tid: hideEverywhere\n\t\t\t\t\t? 'block-visibility-hidden'\n\t\t\t\t\t: 'block-visibility-viewports-updated',\n\t\t\t\ttype: 'snackbar',\n\t\t\t} );\n\t\t\tonClose();\n\t\t},\n\t\t[\n\t\t\tblocks,\n\t\t\tclientIds,\n\t\t\tcreateSuccessNotice,\n\t\t\thideEverywhere,\n\t\t\tnoticeMessage,\n\t\t\tonClose,\n\t\t\tupdateBlockAttributes,\n\t\t\tviewportChecked,\n\t\t]\n\t);\n\n\tconst hasMultipleBlocks = blocks?.length > 1;\n\n\treturn (\n\t\t<Modal\n\t\t\ttitle={\n\t\t\t\tclientIds?.length > 1 ? __( 'Hide blocks' ) : __( 'Hide block' )\n\t\t\t}\n\t\t\tonRequestClose={ onClose }\n\t\t\toverlayClassName=\"block-editor-block-visibility-modal\"\n\t\t\tsize=\"small\"\n\t\t>\n\t\t\t<form onSubmit={ handleSubmit }>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<legend>\n\t\t\t\t\t\t{ hasMultipleBlocks\n\t\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t\t'Select the viewport sizes for which you want to hide the blocks. Changes will apply to all selected blocks.'\n\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t'Select the viewport size for which you want to hide the block.'\n\t\t\t\t\t\t\t  ) }\n\t\t\t\t\t</legend>\n\t\t\t\t\t<ul className=\"block-editor-block-visibility-modal__options\">\n\t\t\t\t\t\t<li className=\"block-editor-block-visibility-modal__options-item block-editor-block-visibility-modal__options-item--everywhere\">\n\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\tclassName=\"block-editor-block-visibility-modal__options-checkbox--everywhere\"\n\t\t\t\t\t\t\t\tlabel={ __( 'Omit from published content' ) }\n\t\t\t\t\t\t\t\tchecked={ hideEverywhere === true }\n\t\t\t\t\t\t\t\tindeterminate={ hideEverywhere === null }\n\t\t\t\t\t\t\t\tonChange={ ( checked ) => {\n\t\t\t\t\t\t\t\t\tsetHideEverywhere( checked );\n\t\t\t\t\t\t\t\t\t// Reset viewport checkboxes when hide everywhere is checked.\n\t\t\t\t\t\t\t\t\tsetViewportChecked(\n\t\t\t\t\t\t\t\t\t\tDEFAULT_VIEWPORT_CHECKBOX_VALUES\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ hideEverywhere !== true && (\n\t\t\t\t\t\t\t\t<ul className=\"block-editor-block-visibility-modal__sub-options\">\n\t\t\t\t\t\t\t\t\t{ BLOCK_VISIBILITY_VIEWPORT_ENTRIES.map(\n\t\t\t\t\t\t\t\t\t\t( [ , { label, icon, key } ] ) => (\n\t\t\t\t\t\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t\t\t\t\t\tkey={ key }\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-block-visibility-modal__options-item\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\t\t\t\t\t\t\t\tlabel={ sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t// translators: %s: The viewport name.\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t__( 'Hide on %s' ),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\t\tchecked={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tviewportChecked[\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t] ?? false\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tindeterminate={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tviewportChecked[\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t] === null\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonChange={ ( checked ) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\thandleViewportCheckboxChange(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tchecked\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t<WCIcon\n\t\t\t\t\t\t\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName={ clsx( {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'block-editor-block-visibility-modal__options-icon--checked':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tviewportChecked[\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</li>\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</ul>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t\t{ hasMultipleBlocks && hasIndeterminateValues && (\n\t\t\t\t\t\t<p className=\"block-editor-block-visibility-modal__description\">\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Selected blocks have different visibility settings. The checkboxes show an indeterminate state when settings differ.'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</p>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! hasMultipleBlocks && hideEverywhere === true && (\n\t\t\t\t\t\t<p className=\"block-editor-block-visibility-modal__description\">\n\t\t\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t\t\t// translators: %s: The shortcut key to access the List View.\n\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t'Block will be hidden in the editor, and omitted from the published markup on the frontend. You can configure it again by selecting it in the List View (%s).'\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\tlistViewShortcut\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</p>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! hasMultipleBlocks &&\n\t\t\t\t\t\t! hideEverywhere &&\n\t\t\t\t\t\tisAnyViewportChecked && (\n\t\t\t\t\t\t\t<p className=\"block-editor-block-visibility-modal__description\">\n\t\t\t\t\t\t\t\t{ createInterpolateElement(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t\t\t// translators: %s: The shortcut key to access the List View\n\t\t\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t\t\t'Block will be hidden according to the selected viewports. It will be <strong>included in the published markup on the frontend</strong>. You can configure it again by selecting it in the List View (%s).'\n\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\tlistViewShortcut\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tstrong: <strong />,\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t) }\n\t\t\t\t</fieldset>\n\t\t\t\t<Flex\n\t\t\t\t\tclassName=\"block-editor-block-visibility-modal__actions\"\n\t\t\t\t\tjustify=\"flex-end\"\n\t\t\t\t\texpanded={ false }\n\t\t\t\t>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Apply' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t</form>\n\t\t</Modal>\n\t);\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/components/block-visibility/viewport-visibility-info.mjs CHANGED Viewed

@@ -1,6 +1,6 @@
 // packages/block-editor/src/components/block-visibility/viewport-visibility-info.js
 import {
-  Icon,
+  Icon as WCIcon,
   __experimentalText as WCText,
   __experimentalHStack as HStack,
   privateApis as componentsPrivateApis
@@ -90,7 +90,7 @@ function ViewportVisibilityInfo({ clientId }) {
     );
   }
   return /* @__PURE__ */ jsx(WCBadge, { className: "block-editor-block-visibility-info", children: /* @__PURE__ */ jsxs(HStack, { spacing: 2, justify: "start", children: [
-    /* @__PURE__ */ jsx(Icon, { icon: unseen }),
+    /* @__PURE__ */ jsx(WCIcon, { icon: unseen }),
     /* @__PURE__ */ jsx(WCText, { children: label })
   ] }) });
 }

package/build-module/components/block-visibility/viewport-visibility-info.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/block-visibility/viewport-visibility-info.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tIcon,\n\t__experimentalText as WCText,\n\t__experimentalHStack as HStack,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { unseen } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { store as blockEditorStore } from '../../store';\nimport useBlockVisibility from './use-block-visibility';\nimport { useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport { deviceTypeKey } from '../../store/private-keys';\nimport { BLOCK_VISIBILITY_VIEWPORTS } from './constants';\n\nconst { Badge: WCBadge } = unlock( componentsPrivateApis );\nconst DEFAULT_VISIBILITY_STATE = {\n\tcurrentBlockVisibility: undefined,\n\thasParentHiddenEverywhere: false,\n\tselectedDeviceType: BLOCK_VISIBILITY_VIEWPORTS.desktop.key,\n};\n\nexport default function ViewportVisibilityInfo( { clientId } ) {\n\tconst {\n\t\tcurrentBlockVisibility,\n\t\tselectedDeviceType,\n\t\thasParentHiddenEverywhere,\n\t} = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! clientId ) {\n\t\t\t\treturn DEFAULT_VISIBILITY_STATE;\n\t\t\t}\n\t\t\tconst {\n\t\t\t\tgetBlockAttributes,\n\t\t\t\tisBlockParentHiddenEverywhere,\n\t\t\t\tgetSettings,\n\t\t\t} = unlock( select( blockEditorStore ) );\n\n\t\t\treturn {\n\t\t\t\tcurrentBlockVisibility:\n\t\t\t\t\tgetBlockAttributes( clientId )?.metadata?.blockVisibility,\n\t\t\t\tselectedDeviceType:\n\t\t\t\t\tgetSettings()?.[ deviceTypeKey ]?.toLowerCase() ||\n\t\t\t\t\tBLOCK_VISIBILITY_VIEWPORTS.desktop.key,\n\t\t\t\thasParentHiddenEverywhere:\n\t\t\t\t\tisBlockParentHiddenEverywhere( clientId ),\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\t// Get the block's DOM element to derive the canvas iframe window,\n\t// so viewport detection matches the actual block rendering context.\n\tconst blockElement = useBlockElement( clientId );\n\tconst rawCanvasView = blockElement?.ownerDocument?.defaultView;\n\tconst canvasView = rawCanvasView === null ? undefined : rawCanvasView;\n\n\tconst { isBlockCurrentlyHidden, currentViewport } = useBlockVisibility( {\n\t\tblockVisibility: currentBlockVisibility,\n\t\tdeviceType: selectedDeviceType,\n\t\tview: canvasView,\n\t} );\n\n\t/*\n\t * Selector to check if any parent (immediate or further up the chain) is hidden at current viewport.\n\t * Separated because it depends on currentViewport from the hook above.\n\t */\n\tconst isBlockParentHiddenAtViewport = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! clientId || ! currentViewport ) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t\treturn unlock(\n\t\t\t\tselect( blockEditorStore )\n\t\t\t).isBlockParentHiddenAtViewport( clientId, currentViewport );\n\t\t},\n\t\t[ clientId, currentViewport ]\n\t);\n\n\tif (\n\t\t! (\n\t\t\tisBlockCurrentlyHidden ||\n\t\t\thasParentHiddenEverywhere ||\n\t\t\tisBlockParentHiddenAtViewport\n\t\t)\n\t) {\n\t\treturn null;\n\t}\n\n\t// Determine label based on whether block or parent is hidden\n\tlet label;\n\tif ( isBlockCurrentlyHidden ) {\n\t\t// Block is currently hidden - check if hidden everywhere or at specific viewport\n\t\tif ( currentBlockVisibility === false ) {\n\t\t\tlabel = __( 'Block is hidden' );\n\t\t} else {\n\t\t\tconst viewportLabel =\n\t\t\t\tBLOCK_VISIBILITY_VIEWPORTS[ currentViewport ]?.label ||\n\t\t\t\tcurrentViewport;\n\t\t\tlabel = sprintf(\n\t\t\t\t/* translators: %s: viewport name (Desktop, Tablet, Mobile) */\n\t\t\t\t__( 'Block is hidden on %s' ),\n\t\t\t\tviewportLabel\n\t\t\t);\n\t\t}\n\t}\n\n\t// Parent is hidden - check if hidden everywhere or at specific viewport\n\tif ( hasParentHiddenEverywhere ) {\n\t\tlabel = __( 'Parent block is hidden' );\n\t} else if ( isBlockParentHiddenAtViewport ) {\n\t\tconst viewportLabel =\n\t\t\tBLOCK_VISIBILITY_VIEWPORTS[ currentViewport ]?.label ||\n\t\t\tcurrentViewport;\n\t\tlabel = sprintf(\n\t\t\t/* translators: %s: viewport name (Desktop, Tablet, Mobile) */\n\t\t\t__( 'Parent block is hidden on %s' ),\n\t\t\tviewportLabel\n\t\t);\n\t}\n\n\treturn (\n\t\t<WCBadge className=\"block-editor-block-visibility-info\">\n\t\t\t<HStack spacing={ 2 } justify=\"start\">\n\t\t\t\t<Icon icon={ unseen } />\n\t\t\t\t<WCText>{ label }</WCText>\n\t\t\t</HStack>\n\t\t</WCBadge>\n\t);\n}\n"],
-  "mappings": ";AAGA;AAAA,EACC;AAAA,EACA,sBAAsB;AAAA,EACtB,wBAAwB;AAAA,EACxB,eAAe;AAAA,OACT;AACP,SAAS,iBAAiB;AAC1B,SAAS,IAAI,eAAe;AAC5B,SAAS,cAAc;AAKvB,SAAS,cAAc;AACvB,SAAS,SAAS,wBAAwB;AAC1C,OAAO,wBAAwB;AAC/B,SAAS,uBAAuB;AAChC,SAAS,qBAAqB;AAC9B,SAAS,kCAAkC;AA8GxC,SACC,KADD;AA5GH,IAAM,EAAE,OAAO,QAAQ,IAAI,OAAQ,qBAAsB;AACzD,IAAM,2BAA2B;AAAA,EAChC,wBAAwB;AAAA,EACxB,2BAA2B;AAAA,EAC3B,oBAAoB,2BAA2B,QAAQ;AACxD;AAEe,SAAR,uBAAyC,EAAE,SAAS,GAAI;AAC9D,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI;AAAA,IACH,CAAE,WAAY;AACb,UAAK,CAAE,UAAW;AACjB,eAAO;AAAA,MACR;AACA,YAAM;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,MACD,IAAI,OAAQ,OAAQ,gBAAiB,CAAE;AAEvC,aAAO;AAAA,QACN,wBACC,mBAAoB,QAAS,GAAG,UAAU;AAAA,QAC3C,oBACC,YAAY,IAAK,aAAc,GAAG,YAAY,KAC9C,2BAA2B,QAAQ;AAAA,QACpC,2BACC,8BAA+B,QAAS;AAAA,MAC1C;AAAA,IACD;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AAIA,QAAM,eAAe,gBAAiB,QAAS;AAC/C,QAAM,gBAAgB,cAAc,eAAe;AACnD,QAAM,aAAa,kBAAkB,OAAO,SAAY;AAExD,QAAM,EAAE,wBAAwB,gBAAgB,IAAI,mBAAoB;AAAA,IACvE,iBAAiB;AAAA,IACjB,YAAY;AAAA,IACZ,MAAM;AAAA,EACP,CAAE;AAMF,QAAM,gCAAgC;AAAA,IACrC,CAAE,WAAY;AACb,UAAK,CAAE,YAAY,CAAE,iBAAkB;AACtC,eAAO;AAAA,MACR;AACA,aAAO;AAAA,QACN,OAAQ,gBAAiB;AAAA,MAC1B,EAAE,8BAA+B,UAAU,eAAgB;AAAA,IAC5D;AAAA,IACA,CAAE,UAAU,eAAgB;AAAA,EAC7B;AAEA,MACC,EACC,0BACA,6BACA,gCAEA;AACD,WAAO;AAAA,EACR;AAGA,MAAI;AACJ,MAAK,wBAAyB;AAE7B,QAAK,2BAA2B,OAAQ;AACvC,cAAQ,GAAI,iBAAkB;AAAA,IAC/B,OAAO;AACN,YAAM,gBACL,2BAA4B,eAAgB,GAAG,SAC/C;AACD,cAAQ;AAAA;AAAA,QAEP,GAAI,uBAAwB;AAAA,QAC5B;AAAA,MACD;AAAA,IACD;AAAA,EACD;AAGA,MAAK,2BAA4B;AAChC,YAAQ,GAAI,wBAAyB;AAAA,EACtC,WAAY,+BAAgC;AAC3C,UAAM,gBACL,2BAA4B,eAAgB,GAAG,SAC/C;AACD,YAAQ;AAAA;AAAA,MAEP,GAAI,8BAA+B;AAAA,MACnC;AAAA,IACD;AAAA,EACD;AAEA,SACC,oBAAC,WAAQ,WAAU,sCAClB,+BAAC,UAAO,SAAU,GAAI,SAAQ,SAC7B;AAAA,wBAAC,QAAK,MAAO,QAAS;AAAA,IACtB,oBAAC,UAAS,iBAAO;AAAA,KAClB,GACD;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tIcon as WCIcon,\n\t__experimentalText as WCText,\n\t__experimentalHStack as HStack,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { unseen } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { store as blockEditorStore } from '../../store';\nimport useBlockVisibility from './use-block-visibility';\nimport { useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport { deviceTypeKey } from '../../store/private-keys';\nimport { BLOCK_VISIBILITY_VIEWPORTS } from './constants';\n\nconst { Badge: WCBadge } = unlock( componentsPrivateApis );\nconst DEFAULT_VISIBILITY_STATE = {\n\tcurrentBlockVisibility: undefined,\n\thasParentHiddenEverywhere: false,\n\tselectedDeviceType: BLOCK_VISIBILITY_VIEWPORTS.desktop.key,\n};\n\nexport default function ViewportVisibilityInfo( { clientId } ) {\n\tconst {\n\t\tcurrentBlockVisibility,\n\t\tselectedDeviceType,\n\t\thasParentHiddenEverywhere,\n\t} = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! clientId ) {\n\t\t\t\treturn DEFAULT_VISIBILITY_STATE;\n\t\t\t}\n\t\t\tconst {\n\t\t\t\tgetBlockAttributes,\n\t\t\t\tisBlockParentHiddenEverywhere,\n\t\t\t\tgetSettings,\n\t\t\t} = unlock( select( blockEditorStore ) );\n\n\t\t\treturn {\n\t\t\t\tcurrentBlockVisibility:\n\t\t\t\t\tgetBlockAttributes( clientId )?.metadata?.blockVisibility,\n\t\t\t\tselectedDeviceType:\n\t\t\t\t\tgetSettings()?.[ deviceTypeKey ]?.toLowerCase() ||\n\t\t\t\t\tBLOCK_VISIBILITY_VIEWPORTS.desktop.key,\n\t\t\t\thasParentHiddenEverywhere:\n\t\t\t\t\tisBlockParentHiddenEverywhere( clientId ),\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\t// Get the block's DOM element to derive the canvas iframe window,\n\t// so viewport detection matches the actual block rendering context.\n\tconst blockElement = useBlockElement( clientId );\n\tconst rawCanvasView = blockElement?.ownerDocument?.defaultView;\n\tconst canvasView = rawCanvasView === null ? undefined : rawCanvasView;\n\n\tconst { isBlockCurrentlyHidden, currentViewport } = useBlockVisibility( {\n\t\tblockVisibility: currentBlockVisibility,\n\t\tdeviceType: selectedDeviceType,\n\t\tview: canvasView,\n\t} );\n\n\t/*\n\t * Selector to check if any parent (immediate or further up the chain) is hidden at current viewport.\n\t * Separated because it depends on currentViewport from the hook above.\n\t */\n\tconst isBlockParentHiddenAtViewport = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! clientId || ! currentViewport ) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t\treturn unlock(\n\t\t\t\tselect( blockEditorStore )\n\t\t\t).isBlockParentHiddenAtViewport( clientId, currentViewport );\n\t\t},\n\t\t[ clientId, currentViewport ]\n\t);\n\n\tif (\n\t\t! (\n\t\t\tisBlockCurrentlyHidden ||\n\t\t\thasParentHiddenEverywhere ||\n\t\t\tisBlockParentHiddenAtViewport\n\t\t)\n\t) {\n\t\treturn null;\n\t}\n\n\t// Determine label based on whether block or parent is hidden\n\tlet label;\n\tif ( isBlockCurrentlyHidden ) {\n\t\t// Block is currently hidden - check if hidden everywhere or at specific viewport\n\t\tif ( currentBlockVisibility === false ) {\n\t\t\tlabel = __( 'Block is hidden' );\n\t\t} else {\n\t\t\tconst viewportLabel =\n\t\t\t\tBLOCK_VISIBILITY_VIEWPORTS[ currentViewport ]?.label ||\n\t\t\t\tcurrentViewport;\n\t\t\tlabel = sprintf(\n\t\t\t\t/* translators: %s: viewport name (Desktop, Tablet, Mobile) */\n\t\t\t\t__( 'Block is hidden on %s' ),\n\t\t\t\tviewportLabel\n\t\t\t);\n\t\t}\n\t}\n\n\t// Parent is hidden - check if hidden everywhere or at specific viewport\n\tif ( hasParentHiddenEverywhere ) {\n\t\tlabel = __( 'Parent block is hidden' );\n\t} else if ( isBlockParentHiddenAtViewport ) {\n\t\tconst viewportLabel =\n\t\t\tBLOCK_VISIBILITY_VIEWPORTS[ currentViewport ]?.label ||\n\t\t\tcurrentViewport;\n\t\tlabel = sprintf(\n\t\t\t/* translators: %s: viewport name (Desktop, Tablet, Mobile) */\n\t\t\t__( 'Parent block is hidden on %s' ),\n\t\t\tviewportLabel\n\t\t);\n\t}\n\n\treturn (\n\t\t<WCBadge className=\"block-editor-block-visibility-info\">\n\t\t\t<HStack spacing={ 2 } justify=\"start\">\n\t\t\t\t<WCIcon icon={ unseen } />\n\t\t\t\t<WCText>{ label }</WCText>\n\t\t\t</HStack>\n\t\t</WCBadge>\n\t);\n}\n"],
+  "mappings": ";AAGA;AAAA,EACC,QAAQ;AAAA,EACR,sBAAsB;AAAA,EACtB,wBAAwB;AAAA,EACxB,eAAe;AAAA,OACT;AACP,SAAS,iBAAiB;AAC1B,SAAS,IAAI,eAAe;AAC5B,SAAS,cAAc;AAKvB,SAAS,cAAc;AACvB,SAAS,SAAS,wBAAwB;AAC1C,OAAO,wBAAwB;AAC/B,SAAS,uBAAuB;AAChC,SAAS,qBAAqB;AAC9B,SAAS,kCAAkC;AA8GxC,SACC,KADD;AA5GH,IAAM,EAAE,OAAO,QAAQ,IAAI,OAAQ,qBAAsB;AACzD,IAAM,2BAA2B;AAAA,EAChC,wBAAwB;AAAA,EACxB,2BAA2B;AAAA,EAC3B,oBAAoB,2BAA2B,QAAQ;AACxD;AAEe,SAAR,uBAAyC,EAAE,SAAS,GAAI;AAC9D,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI;AAAA,IACH,CAAE,WAAY;AACb,UAAK,CAAE,UAAW;AACjB,eAAO;AAAA,MACR;AACA,YAAM;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,MACD,IAAI,OAAQ,OAAQ,gBAAiB,CAAE;AAEvC,aAAO;AAAA,QACN,wBACC,mBAAoB,QAAS,GAAG,UAAU;AAAA,QAC3C,oBACC,YAAY,IAAK,aAAc,GAAG,YAAY,KAC9C,2BAA2B,QAAQ;AAAA,QACpC,2BACC,8BAA+B,QAAS;AAAA,MAC1C;AAAA,IACD;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AAIA,QAAM,eAAe,gBAAiB,QAAS;AAC/C,QAAM,gBAAgB,cAAc,eAAe;AACnD,QAAM,aAAa,kBAAkB,OAAO,SAAY;AAExD,QAAM,EAAE,wBAAwB,gBAAgB,IAAI,mBAAoB;AAAA,IACvE,iBAAiB;AAAA,IACjB,YAAY;AAAA,IACZ,MAAM;AAAA,EACP,CAAE;AAMF,QAAM,gCAAgC;AAAA,IACrC,CAAE,WAAY;AACb,UAAK,CAAE,YAAY,CAAE,iBAAkB;AACtC,eAAO;AAAA,MACR;AACA,aAAO;AAAA,QACN,OAAQ,gBAAiB;AAAA,MAC1B,EAAE,8BAA+B,UAAU,eAAgB;AAAA,IAC5D;AAAA,IACA,CAAE,UAAU,eAAgB;AAAA,EAC7B;AAEA,MACC,EACC,0BACA,6BACA,gCAEA;AACD,WAAO;AAAA,EACR;AAGA,MAAI;AACJ,MAAK,wBAAyB;AAE7B,QAAK,2BAA2B,OAAQ;AACvC,cAAQ,GAAI,iBAAkB;AAAA,IAC/B,OAAO;AACN,YAAM,gBACL,2BAA4B,eAAgB,GAAG,SAC/C;AACD,cAAQ;AAAA;AAAA,QAEP,GAAI,uBAAwB;AAAA,QAC5B;AAAA,MACD;AAAA,IACD;AAAA,EACD;AAGA,MAAK,2BAA4B;AAChC,YAAQ,GAAI,wBAAyB;AAAA,EACtC,WAAY,+BAAgC;AAC3C,UAAM,gBACL,2BAA4B,eAAgB,GAAG,SAC/C;AACD,YAAQ;AAAA;AAAA,MAEP,GAAI,8BAA+B;AAAA,MACnC;AAAA,IACD;AAAA,EACD;AAEA,SACC,oBAAC,WAAQ,WAAU,sCAClB,+BAAC,UAAO,SAAU,GAAI,SAAQ,SAC7B;AAAA,wBAAC,UAAO,MAAO,QAAS;AAAA,IACxB,oBAAC,UAAS,iBAAO;AAAA,KAClB,GACD;AAEF;",
   "names": []
 }

package/build-module/components/colors-gradients/control.mjs CHANGED Viewed

@@ -30,6 +30,7 @@ function ColorGradientControlInner({
   onColorChange,
   onGradientChange,
   colorValue,
+  colorSlug,
   gradientValue,
   clearable,
   showTitle = true,
@@ -41,15 +42,17 @@ function ColorGradientControlInner({
   if (!canChooseAColor && !canChooseAGradient) {
     return null;
   }
+  const colorPaletteOnChange = canChooseAGradient ? (newColor, _index, newSlug) => {
+    onColorChange(newColor, newSlug);
+    onGradientChange();
+  } : (newColor, _index, newSlug) => onColorChange(newColor, newSlug);
   const tabPanels = {
     [TAB_IDS.color]: /* @__PURE__ */ jsx(
       ColorPalette,
       {
         value: colorValue,
-        onChange: canChooseAGradient ? (newColor) => {
-          onColorChange(newColor);
-          onGradientChange();
-        } : onColorChange,
+        selectedSlug: colorSlug,
+        onChange: colorPaletteOnChange,
         ...{ colors, disableCustomColors },
         __experimentalIsRenderedInSidebar,
         clearable,

package/build-module/components/colors-gradients/control.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/colors-gradients/control.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tBaseControl,\n\t__experimentalVStack as VStack,\n\tColorPalette,\n\tGradientPicker,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useSettings } from '../use-settings';\nimport { unlock } from '../../lock-unlock';\n\nconst { Tabs } = unlock( componentsPrivateApis );\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nconst TAB_IDS = { color: 'color', gradient: 'gradient' };\n\nfunction ColorGradientControlInner( {\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\t__experimentalIsRenderedInSidebar,\n\tclassName,\n\tlabel,\n\tonColorChange,\n\tonGradientChange,\n\tcolorValue,\n\tgradientValue,\n\tclearable,\n\tshowTitle = true,\n\tenableAlpha,\n\theadingLevel,\n} ) {\n\tconst canChooseAColor =\n\t\tonColorChange &&\n\t\t( ( colors && colors.length > 0 ) || ! disableCustomColors );\n\tconst canChooseAGradient =\n\t\tonGradientChange &&\n\t\t( ( gradients && gradients.length > 0 ) || ! disableCustomGradients );\n\n\tif ( ! canChooseAColor && ! canChooseAGradient ) {\n\t\treturn null;\n\t}\n\n\tconst tabPanels = {\n\t\t[ TAB_IDS.color ]: (\n\t\t\t<ColorPalette\n\t\t\t\tvalue={ colorValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAGradient\n\t\t\t\t\t\t? ( newColor ) => {\n\t\t\t\t\t\t\t\tonColorChange( newColor );\n\t\t\t\t\t\t\t\tonGradientChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onColorChange\n\t\t\t\t}\n\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\theadingLevel={ headingLevel }\n\t\t\t/>\n\t\t),\n\t\t[ TAB_IDS.gradient ]: (\n\t\t\t<GradientPicker\n\t\t\t\tvalue={ gradientValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAColor\n\t\t\t\t\t\t? ( newGradient ) => {\n\t\t\t\t\t\t\t\tonGradientChange( newGradient );\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onGradientChange\n\t\t\t\t}\n\t\t\t\t{ ...{ gradients, disableCustomGradients } }\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\theadingLevel={ headingLevel }\n\t\t\t/>\n\t\t),\n\t};\n\n\tconst renderPanelType = ( type ) => (\n\t\t<div className=\"block-editor-color-gradient-control__panel\">\n\t\t\t{ tabPanels[ type ] }\n\t\t</div>\n\t);\n\n\treturn (\n\t\t<BaseControl\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-color-gradient-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t<fieldset className=\"block-editor-color-gradient-control__fieldset\">\n\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t{ showTitle && (\n\t\t\t\t\t\t<legend>\n\t\t\t\t\t\t\t<div className=\"block-editor-color-gradient-control__color-indicator\">\n\t\t\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</legend>\n\t\t\t\t\t) }\n\t\t\t\t\t{ canChooseAColor && canChooseAGradient && (\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<Tabs\n\t\t\t\t\t\t\t\tdefaultTabId={\n\t\t\t\t\t\t\t\t\tgradientValue\n\t\t\t\t\t\t\t\t\t\t? TAB_IDS.gradient\n\t\t\t\t\t\t\t\t\t\t: !! canChooseAColor && TAB_IDS.color\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Tabs.TabList>\n\t\t\t\t\t\t\t\t\t<Tabs.Tab tabId={ TAB_IDS.color }>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Color' ) }\n\t\t\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t\t\t\t<Tabs.Tab tabId={ TAB_IDS.gradient }>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Gradient' ) }\n\t\t\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t\t\t</Tabs.TabList>\n\t\t\t\t\t\t\t\t<Tabs.TabPanel\n\t\t\t\t\t\t\t\t\ttabId={ TAB_IDS.color }\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-color-gradient-control__panel\"\n\t\t\t\t\t\t\t\t\tfocusable={ false }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ tabPanels.color }\n\t\t\t\t\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t\t\t\t\t<Tabs.TabPanel\n\t\t\t\t\t\t\t\t\ttabId={ TAB_IDS.gradient }\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-color-gradient-control__panel\"\n\t\t\t\t\t\t\t\t\tfocusable={ false }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ tabPanels.gradient }\n\t\t\t\t\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t\t\t\t</Tabs>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! canChooseAGradient && renderPanelType( TAB_IDS.color ) }\n\t\t\t\t\t{ ! canChooseAColor && renderPanelType( TAB_IDS.gradient ) }\n\t\t\t\t</VStack>\n\t\t\t</fieldset>\n\t\t</BaseControl>\n\t);\n}\n\nfunction ColorGradientControlSelect( props ) {\n\tconst [ colors, gradients, customColors, customGradients ] = useSettings(\n\t\t'color.palette',\n\t\t'color.gradients',\n\t\t'color.custom',\n\t\t'color.customGradient'\n\t);\n\n\treturn (\n\t\t<ColorGradientControlInner\n\t\t\tcolors={ colors }\n\t\t\tgradients={ gradients }\n\t\t\tdisableCustomColors={ ! customColors }\n\t\t\tdisableCustomGradients={ ! customGradients }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction ColorGradientControl( props ) {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <ColorGradientControlInner { ...props } />;\n\t}\n\treturn <ColorGradientControlSelect { ...props } />;\n}\n\nexport default ColorGradientControl;\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tBaseControl,\n\t__experimentalVStack as VStack,\n\tColorPalette,\n\tGradientPicker,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useSettings } from '../use-settings';\nimport { unlock } from '../../lock-unlock';\n\nconst { Tabs } = unlock( componentsPrivateApis );\nconst colorsAndGradientKeys = [\n\t'colors',\n\t'disableCustomColors',\n\t'gradients',\n\t'disableCustomGradients',\n];\n\nconst TAB_IDS = { color: 'color', gradient: 'gradient' };\n\nfunction ColorGradientControlInner( {\n\tcolors,\n\tgradients,\n\tdisableCustomColors,\n\tdisableCustomGradients,\n\t__experimentalIsRenderedInSidebar,\n\tclassName,\n\tlabel,\n\tonColorChange,\n\tonGradientChange,\n\tcolorValue,\n\tcolorSlug,\n\tgradientValue,\n\tclearable,\n\tshowTitle = true,\n\tenableAlpha,\n\theadingLevel,\n} ) {\n\tconst canChooseAColor =\n\t\tonColorChange &&\n\t\t( ( colors && colors.length > 0 ) || ! disableCustomColors );\n\tconst canChooseAGradient =\n\t\tonGradientChange &&\n\t\t( ( gradients && gradients.length > 0 ) || ! disableCustomGradients );\n\n\tif ( ! canChooseAColor && ! canChooseAGradient ) {\n\t\treturn null;\n\t}\n\n\tconst colorPaletteOnChange = canChooseAGradient\n\t\t? ( newColor, _index, newSlug ) => {\n\t\t\t\tonColorChange( newColor, newSlug );\n\t\t\t\tonGradientChange();\n\t\t  }\n\t\t: ( newColor, _index, newSlug ) => onColorChange( newColor, newSlug );\n\n\tconst tabPanels = {\n\t\t[ TAB_IDS.color ]: (\n\t\t\t<ColorPalette\n\t\t\t\tvalue={ colorValue }\n\t\t\t\tselectedSlug={ colorSlug }\n\t\t\t\tonChange={ colorPaletteOnChange }\n\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\theadingLevel={ headingLevel }\n\t\t\t/>\n\t\t),\n\t\t[ TAB_IDS.gradient ]: (\n\t\t\t<GradientPicker\n\t\t\t\tvalue={ gradientValue }\n\t\t\t\tonChange={\n\t\t\t\t\tcanChooseAColor\n\t\t\t\t\t\t? ( newGradient ) => {\n\t\t\t\t\t\t\t\tonGradientChange( newGradient );\n\t\t\t\t\t\t\t\tonColorChange();\n\t\t\t\t\t\t  }\n\t\t\t\t\t\t: onGradientChange\n\t\t\t\t}\n\t\t\t\t{ ...{ gradients, disableCustomGradients } }\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tclearable={ clearable }\n\t\t\t\theadingLevel={ headingLevel }\n\t\t\t/>\n\t\t),\n\t};\n\n\tconst renderPanelType = ( type ) => (\n\t\t<div className=\"block-editor-color-gradient-control__panel\">\n\t\t\t{ tabPanels[ type ] }\n\t\t</div>\n\t);\n\n\treturn (\n\t\t<BaseControl\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-color-gradient-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t<fieldset className=\"block-editor-color-gradient-control__fieldset\">\n\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t{ showTitle && (\n\t\t\t\t\t\t<legend>\n\t\t\t\t\t\t\t<div className=\"block-editor-color-gradient-control__color-indicator\">\n\t\t\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</legend>\n\t\t\t\t\t) }\n\t\t\t\t\t{ canChooseAColor && canChooseAGradient && (\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<Tabs\n\t\t\t\t\t\t\t\tdefaultTabId={\n\t\t\t\t\t\t\t\t\tgradientValue\n\t\t\t\t\t\t\t\t\t\t? TAB_IDS.gradient\n\t\t\t\t\t\t\t\t\t\t: !! canChooseAColor && TAB_IDS.color\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Tabs.TabList>\n\t\t\t\t\t\t\t\t\t<Tabs.Tab tabId={ TAB_IDS.color }>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Color' ) }\n\t\t\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t\t\t\t<Tabs.Tab tabId={ TAB_IDS.gradient }>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Gradient' ) }\n\t\t\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t\t\t</Tabs.TabList>\n\t\t\t\t\t\t\t\t<Tabs.TabPanel\n\t\t\t\t\t\t\t\t\ttabId={ TAB_IDS.color }\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-color-gradient-control__panel\"\n\t\t\t\t\t\t\t\t\tfocusable={ false }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ tabPanels.color }\n\t\t\t\t\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t\t\t\t\t<Tabs.TabPanel\n\t\t\t\t\t\t\t\t\ttabId={ TAB_IDS.gradient }\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-color-gradient-control__panel\"\n\t\t\t\t\t\t\t\t\tfocusable={ false }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ tabPanels.gradient }\n\t\t\t\t\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t\t\t\t</Tabs>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! canChooseAGradient && renderPanelType( TAB_IDS.color ) }\n\t\t\t\t\t{ ! canChooseAColor && renderPanelType( TAB_IDS.gradient ) }\n\t\t\t\t</VStack>\n\t\t\t</fieldset>\n\t\t</BaseControl>\n\t);\n}\n\nfunction ColorGradientControlSelect( props ) {\n\tconst [ colors, gradients, customColors, customGradients ] = useSettings(\n\t\t'color.palette',\n\t\t'color.gradients',\n\t\t'color.custom',\n\t\t'color.customGradient'\n\t);\n\n\treturn (\n\t\t<ColorGradientControlInner\n\t\t\tcolors={ colors }\n\t\t\tgradients={ gradients }\n\t\t\tdisableCustomColors={ ! customColors }\n\t\t\tdisableCustomGradients={ ! customGradients }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction ColorGradientControl( props ) {\n\tif (\n\t\tcolorsAndGradientKeys.every( ( key ) => props.hasOwnProperty( key ) )\n\t) {\n\t\treturn <ColorGradientControlInner { ...props } />;\n\t}\n\treturn <ColorGradientControlSelect { ...props } />;\n}\n\nexport default ColorGradientControl;\n"],
+  "mappings": "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",
   "names": []
 }