npm - @wordpress/block-editor - Versions diffs - 14.1.0 → 14.2.0 - Mend

@wordpress/block-editor 14.1.0 → 14.2.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 (630) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -2,6 +2,8 @@
 ## Unreleased
+## 14.2.0 (2024-09-05)
 ## 14.1.0 (2024-08-21)
 ## 14.0.0 (2024-08-07)

package/README.md CHANGED Viewed

@@ -811,21 +811,12 @@ _Parameters_
 -   _styles_ `EditorStyle[]`: CSS rules.
 -   _wrapperSelector_ `string`: Wrapper selector.
+-   _transformOptions_ `TransformOptions`: Additional options for style transformation.
 _Returns_
 -   `Array`: converted rules.
-_Type Definition_
--   _EditorStyle_ `Object`
-_Properties_
--   _css_ `string`: the CSS block(s), as a single string.
--   _baseURL_ `?string`: the base URL to be used as the reference when rewritting urls.
--   _ignoredSelectors_ `?string[]`: the selectors not to wrap.
 ### Typewriter
 Ensures that the text selection keeps the same vertical distance from the viewport during keyboard events within this component. The vertical distance can vary. It is the last clicked or scrolled to position.

package/build/components/block-alignment-matrix-control/index.js CHANGED Viewed

@@ -20,7 +20,7 @@ function BlockAlignmentMatrixControl(props) {
     value = 'center',
     isDisabled
   } = props;
-  const icon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalAlignmentMatrixControl.Icon, {
+  const icon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.AlignmentMatrixControl.Icon, {
     value: value
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Dropdown, {
@@ -48,7 +48,7 @@ function BlockAlignmentMatrixControl(props) {
         disabled: isDisabled
       });
     },
-    renderContent: () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalAlignmentMatrixControl, {
+    renderContent: () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.AlignmentMatrixControl, {
       hasFocusBorder: false,
       onChange: onChange,
       value: value

package/build/components/block-alignment-matrix-control/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_i18n","require","_keycodes","_components","_jsxRuntime","noop","BlockAlignmentMatrixControl","props","label","__","onChange","value","isDisabled","icon","jsx","~~__experimentalAlignmentMatrixControl~~","Icon","Dropdown","popoverProps","placement","renderToggle","onToggle","isOpen","openOnArrowDown","event","keyCode","DOWN","preventDefault","ToolbarButton","onClick","onKeyDown","showTooltip","disabled","renderContent","hasFocusBorder","_default","exports","default"],"sources":["@wordpress/block-editor/src/components/block-alignment-matrix-control/index.js"],"sourcesContent":["/*\n WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { DOWN } from '@wordpress/keycodes';\nimport {\n\tToolbarButton,\n\tDropdown,\n\~~t__experimentalAlignmentMatrixControl as AlignmentMatrixControl~~,\n} from '@wordpress/components';\n\nconst noop = () => {};\n\nfunction BlockAlignmentMatrixControl( props ) {\n\tconst {\n\t\tlabel = __( 'Change matrix alignment' ),\n\t\tonChange = noop,\n\t\tvalue = 'center',\n\t\tisDisabled,\n\t} = props;\n\n\tconst icon = <AlignmentMatrixControl.Icon value={ value } />;\n\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ { placement: 'bottom-start' } }\n\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\tconst openOnArrowDown = ( event ) => {\n\t\t\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\n\t\t\t\treturn (\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tonKeyDown={ openOnArrowDown }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<AlignmentMatrixControl\n\t\t\t\t\thasFocusBorder={ false }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t/>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default BlockAlignmentMatrixControl;\n"],"mappings":";;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,SAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAI+B,IAAAG,WAAA,GAAAH,OAAA;AAT/B;AACA;AACA;;AASA,MAAMI,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AAErB,SAASC,2BAA2BA,CAAEC,KAAK,EAAG;EAC7C,MAAM;IACLC,KAAK,GAAG,IAAAC,QAAE,EAAE,yBAA0B,CAAC;IACvCC,QAAQ,GAAGL,IAAI;IACfM,KAAK,GAAG,QAAQ;IAChBC;EACD,CAAC,GAAGL,KAAK;EAET,MAAMM,IAAI,gBAAG,IAAAT,WAAA,CAAAU,GAAA,EAACX,WAAA,CAAAY,~~oCAAsB~~,CAACC,IAAI;IAACL,KAAK,EAAGA;EAAO,CAAE,CAAC;EAE5D,oBACC,IAAAP,WAAA,CAAAU,GAAA,EAACX,WAAA,CAAAc,QAAQ;IACRC,YAAY,EAAG;MAAEC,SAAS,EAAE;IAAe,CAAG;IAC9CC,YAAY,EAAGA,CAAE;MAAEC,QAAQ;MAAEC;IAAO,CAAC,KAAM;MAC1C,MAAMC,eAAe,GAAKC,KAAK,IAAM;QACpC,IAAK,CAAEF,MAAM,IAAIE,KAAK,CAACC,OAAO,KAAKC,cAAI,EAAG;UACzCF,KAAK,CAACG,cAAc,CAAC,CAAC;UACtBN,QAAQ,CAAC,CAAC;QACX;MACD,CAAC;MAED,oBACC,IAAAjB,WAAA,CAAAU,GAAA,EAACX,WAAA,CAAAyB,aAAa;QACbC,OAAO,EAAGR,QAAU;QACpB,iBAAc,MAAM;QACpB,iBAAgBC,MAAQ;QACxBQ,SAAS,EAAGP,eAAiB;QAC7Bf,KAAK,EAAGA,KAAO;QACfK,IAAI,EAAGA,IAAM;QACbkB,WAAW;QACXC,QAAQ,EAAGpB;MAAY,CACvB,CAAC;IAEJ,CAAG;IACHqB,aAAa,EAAGA,CAAA,kBACf,IAAA7B,WAAA,CAAAU,GAAA,EAACX,WAAA,CAAAY,~~oCAAsB~~;MACtBmB,cAAc,EAAG,KAAO;MACxBxB,QAAQ,EAAGA,QAAU;MACrBC,KAAK,EAAGA;IAAO,CACf;EACC,CACH,CAAC;AAEJ;AAAC,IAAAwB,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEc/B,2BAA2B","ignoreList":[]}
1	+ {"version":3,"names":["_i18n","require","_keycodes","_components","_jsxRuntime","noop","BlockAlignmentMatrixControl","props","label","__","onChange","value","isDisabled","icon","jsx","AlignmentMatrixControl","Icon","Dropdown","popoverProps","placement","renderToggle","onToggle","isOpen","openOnArrowDown","event","keyCode","DOWN","preventDefault","ToolbarButton","onClick","onKeyDown","showTooltip","disabled","renderContent","hasFocusBorder","_default","exports","default"],"sources":["@wordpress/block-editor/src/components/block-alignment-matrix-control/index.js"],"sourcesContent":["/*\n WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { DOWN } from '@wordpress/keycodes';\nimport {\n\tToolbarButton,\n\tDropdown,\n\tAlignmentMatrixControl,\n} from '@wordpress/components';\n\nconst noop = () => {};\n\nfunction BlockAlignmentMatrixControl( props ) {\n\tconst {\n\t\tlabel = __( 'Change matrix alignment' ),\n\t\tonChange = noop,\n\t\tvalue = 'center',\n\t\tisDisabled,\n\t} = props;\n\n\tconst icon = <AlignmentMatrixControl.Icon value={ value } />;\n\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ { placement: 'bottom-start' } }\n\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\tconst openOnArrowDown = ( event ) => {\n\t\t\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\n\t\t\t\treturn (\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tonKeyDown={ openOnArrowDown }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<AlignmentMatrixControl\n\t\t\t\t\thasFocusBorder={ false }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t/>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default BlockAlignmentMatrixControl;\n"],"mappings":";;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,SAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAI+B,IAAAG,WAAA,GAAAH,OAAA;AAT/B;AACA;AACA;;AASA,MAAMI,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AAErB,SAASC,2BAA2BA,CAAEC,KAAK,EAAG;EAC7C,MAAM;IACLC,KAAK,GAAG,IAAAC,QAAE,EAAE,yBAA0B,CAAC;IACvCC,QAAQ,GAAGL,IAAI;IACfM,KAAK,GAAG,QAAQ;IAChBC;EACD,CAAC,GAAGL,KAAK;EAET,MAAMM,IAAI,gBAAG,IAAAT,WAAA,CAAAU,GAAA,EAACX,WAAA,CAAAY,sBAAsB,CAACC,IAAI;IAACL,KAAK,EAAGA;EAAO,CAAE,CAAC;EAE5D,oBACC,IAAAP,WAAA,CAAAU,GAAA,EAACX,WAAA,CAAAc,QAAQ;IACRC,YAAY,EAAG;MAAEC,SAAS,EAAE;IAAe,CAAG;IAC9CC,YAAY,EAAGA,CAAE;MAAEC,QAAQ;MAAEC;IAAO,CAAC,KAAM;MAC1C,MAAMC,eAAe,GAAKC,KAAK,IAAM;QACpC,IAAK,CAAEF,MAAM,IAAIE,KAAK,CAACC,OAAO,KAAKC,cAAI,EAAG;UACzCF,KAAK,CAACG,cAAc,CAAC,CAAC;UACtBN,QAAQ,CAAC,CAAC;QACX;MACD,CAAC;MAED,oBACC,IAAAjB,WAAA,CAAAU,GAAA,EAACX,WAAA,CAAAyB,aAAa;QACbC,OAAO,EAAGR,QAAU;QACpB,iBAAc,MAAM;QACpB,iBAAgBC,MAAQ;QACxBQ,SAAS,EAAGP,eAAiB;QAC7Bf,KAAK,EAAGA,KAAO;QACfK,IAAI,EAAGA,IAAM;QACbkB,WAAW;QACXC,QAAQ,EAAGpB;MAAY,CACvB,CAAC;IAEJ,CAAG;IACHqB,aAAa,EAAGA,CAAA,kBACf,IAAA7B,WAAA,CAAAU,GAAA,EAACX,WAAA,CAAAY,sBAAsB;MACtBmB,cAAc,EAAG,KAAO;MACxBxB,QAAQ,EAAGA,QAAU;MACrBC,KAAK,EAAGA;IAAO,CACf;EACC,CACH,CAAC;AAEJ;AAAC,IAAAwB,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEc/B,2BAA2B","ignoreList":[]}

package/build/components/block-breadcrumb/index.js CHANGED Viewed

@@ -73,7 +73,10 @@ var _jsxRuntime = require("react/jsx-runtime");
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("li", {
       className: !hasSelection ? 'block-editor-block-breadcrumb__current' : undefined,
       "aria-current": !hasSelection ? 'true' : undefined,
-      children: [hasSelection && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
+      children: [hasSelection && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button
+      // TODO: Switch to `true` (40px size) if possible
+      , {
+        __next40pxDefaultSize: false,
         className: "block-editor-block-breadcrumb__button",
         variant: "tertiary",
         onClick: () => {
@@ -88,7 +91,10 @@ var _jsxRuntime = require("react/jsx-runtime");
         className: "block-editor-block-breadcrumb__separator"
       })]
     }), parents.map(parentClientId => /*#__PURE__*/(0, _jsxRuntime.jsxs)("li", {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button
+      // TODO: Switch to `true` (40px size) if possible
+      , {
+        __next40pxDefaultSize: false,
         className: "block-editor-block-breadcrumb__button",
         variant: "tertiary",
         onClick: () => selectBlock(parentClientId),

package/build/components/block-breadcrumb/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_components","require","_data","_i18n","_icons","_element","_blockTitle","_interopRequireDefault","_store","_lockUnlock","_useBlockRefs","_getEditorRegion","_jsxRuntime","BlockBreadcrumb","rootLabelText","selectBlock","clearSelectedBlock","useDispatch","blockEditorStore","clientId","parents","hasSelection","useSelect","select","getSelectionStart","getSelectedBlockClientId","getEnabledBlockParents","unlock","selectedBlockClientId","rootLabel","__","blockRef","useRef","useBlockElementRef","jsxs","className","role","children","undefined","jsx","Button","variant","onClick","blockEditor","current","closest","getEditorRegion","focus","Icon","icon","chevronRightSmall","map","parentClientId","default","maximumLength","_default","exports"],"sources":["@wordpress/block-editor/src/components/block-breadcrumb/index.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { Button } from '@wordpress/components';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { chevronRightSmall, Icon } from '@wordpress/icons';\nimport { useRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport BlockTitle from '../block-title';\nimport { store as blockEditorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\nimport { useBlockElementRef } from '../block-list/use-block-props/use-block-refs';\nimport getEditorRegion from '../../utils/get-editor-region';\n\n/\n Block breadcrumb component, displaying the hierarchy of the current block selection as a breadcrumb.\n \n @param {Object} props Component props.\n * @param {string} props.rootLabelText Translated label for the root element of the breadcrumb trail.\n * @return {Element} Block Breadcrumb.\n /\nfunction BlockBreadcrumb( { rootLabelText } ) {\n\tconst { selectBlock, clearSelectedBlock } = useDispatch( blockEditorStore );\n\tconst { clientId, parents, hasSelection } = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetSelectionStart,\n\t\t\tgetSelectedBlockClientId,\n\t\t\tgetEnabledBlockParents,\n\t\t} = unlock( select( blockEditorStore ) );\n\t\tconst selectedBlockClientId = getSelectedBlockClientId();\n\t\treturn {\n\t\t\tparents: getEnabledBlockParents( selectedBlockClientId ),\n\t\t\tclientId: selectedBlockClientId,\n\t\t\thasSelection: !! getSelectionStart().clientId,\n\t\t};\n\t}, [] );\n\tconst rootLabel = rootLabelText \|\| __( 'Document' );\n\n\t// We don't care about this specific ref, but this is a way\n\t// to get a ref within the editor canvas so we can focus it later.\n\tconst blockRef = useRef();\n\tuseBlockElementRef( clientId, blockRef );\n\n\t/\n\t * Disable reason: The `list` ARIA role is redundant but\n\t * Safari+VoiceOver won't announce the list otherwise.\n\t /\n\t/ eslint-disable jsx-a11y/no-redundant-roles /\n\treturn (\n\t\t<ul\n\t\t\tclassName=\"block-editor-block-breadcrumb\"\n\t\t\trole=\"list\"\n\t\t\taria-label={ __( 'Block breadcrumb' ) }\n\t\t>\n\t\t\t<li\n\t\t\t\tclassName={\n\t\t\t\t\t! hasSelection\n\t\t\t\t\t\t? 'block-editor-block-breadcrumb__current'\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\taria-current={ ! hasSelection ? 'true' : undefined }\n\t\t\t>\n\t\t\t\t{ hasSelection && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"block-editor-block-breadcrumb__button\"\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t// Find the block editor wrapper for the selected block\n\t\t\t\t\t\t\tconst blockEditor = blockRef.current?.closest(\n\t\t\t\t\t\t\t\t'.editor-styles-wrapper'\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\tclearSelectedBlock();\n\n\t\t\t\t\t\t\tgetEditorRegion( blockEditor )?.focus();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ rootLabel }\n\t\t\t\t\t</Button>\n\t\t\t\t) }\n\t\t\t\t{ ! hasSelection && rootLabel }\n\t\t\t\t{ !! clientId && (\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ chevronRightSmall }\n\t\t\t\t\t\tclassName=\"block-editor-block-breadcrumb__separator\"\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</li>\n\n\t\t\t{ parents.map( ( parentClientId ) => (\n\t\t\t\t<li key={ parentClientId }>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"block-editor-block-breadcrumb__button\"\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => selectBlock( parentClientId ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<BlockTitle\n\t\t\t\t\t\t\tclientId={ parentClientId }\n\t\t\t\t\t\t\tmaximumLength={ 35 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ chevronRightSmall }\n\t\t\t\t\t\tclassName=\"block-editor-block-breadcrumb__separator\"\n\t\t\t\t\t/>\n\t\t\t\t</li>\n\t\t\t) ) }\n\t\t\t{ !! clientId && (\n\t\t\t\t<li\n\t\t\t\t\tclassName=\"block-editor-block-breadcrumb__current\"\n\t\t\t\t\taria-current=\"true\"\n\t\t\t\t>\n\t\t\t\t\t<BlockTitle clientId={ clientId } maximumLength={ 35 } />\n\t\t\t\t</li>\n\t\t\t) }\n\t\t</ul>\n\t\t/ eslint-enable jsx-a11y/no-redundant-roles */\n\t);\n}\n\nexport default BlockBreadcrumb;\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AAKA,IAAAK,WAAA,GAAAC,sBAAA,CAAAN,OAAA;AACA,IAAAO,MAAA,GAAAP,OAAA;AACA,IAAAQ,WAAA,GAAAR,OAAA;AACA,IAAAS,aAAA,GAAAT,OAAA;AACA,IAAAU,gBAAA,GAAAJ,sBAAA,CAAAN,OAAA;AAA4D,IAAAW,WAAA,GAAAX,OAAA;AAhB5D;AACA;AACA;;AAOA;AACA;AACA;;AAOA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,SAASY,eAAeA,CAAE;EAAEC;AAAc,CAAC,EAAG;EAC7C,MAAM;IAAEC,WAAW;IAAEC;EAAmB,CAAC,GAAG,IAAAC,iBAAW,EAAEC,YAAiB,CAAC;EAC3E,MAAM;IAAEC,QAAQ;IAAEC,OAAO;IAAEC;EAAa,CAAC,GAAG,IAAAC,eAAS,EAAIC,MAAM,IAAM;IACpE,MAAM;MACLC,iBAAiB;MACjBC,wBAAwB;MACxBC;IACD,CAAC,GAAG,IAAAC,kBAAM,EAAEJ,MAAM,CAAEL,YAAiB,CAAE,CAAC;IACxC,MAAMU,qBAAqB,GAAGH,wBAAwB,CAAC,CAAC;IACxD,OAAO;MACNL,OAAO,EAAEM,sBAAsB,CAAEE,qBAAsB,CAAC;MACxDT,QAAQ,EAAES,qBAAqB;MAC/BP,YAAY,EAAE,CAAC,CAAEG,iBAAiB,CAAC,CAAC,CAACL;IACtC,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EACP,MAAMU,SAAS,GAAGf,aAAa,IAAI,IAAAgB,QAAE,EAAE,UAAW,CAAC;;EAEnD;EACA;EACA,MAAMC,QAAQ,GAAG,IAAAC,eAAM,EAAC,CAAC;EACzB,IAAAC,gCAAkB,EAAEd,QAAQ,EAAEY,QAAS,CAAC;;EAExC;AACD;AACA;AACA;EACC;EACA,oBACC,IAAAnB,WAAA,CAAAsB,IAAA;IACCC,SAAS,EAAC,+BAA+B;IACzCC,IAAI,EAAC,MAAM;IACX,cAAa,IAAAN,QAAE,EAAE,kBAAmB,CAAG;IAAAO,QAAA,gBAEvC,IAAAzB,WAAA,CAAAsB,IAAA;MACCC,SAAS,EACR,CAAEd,YAAY,GACX,wCAAwC,GACxCiB,SACH;MACD,gBAAe,CAAEjB,YAAY,GAAG,MAAM,GAAGiB,SAAW;MAAAD,QAAA,GAElDhB,YAAY,iBACb,IAAAT,WAAA,CAAA2B,GAAA,EAACvC,WAAA,CAAAwC,~~MAAM~~;~~QACNL~~,SAAS,EAAC,uCAAuC;~~QACjDM~~,OAAO,EAAC,UAAU;QAClBC,OAAO,EAAGA,CAAA,KAAM;UACf;UACA,MAAMC,WAAW,~~GAAGZ~~,QAAQ,~~CAACa~~,OAAO,EAAEC,OAAO,CAC5C,wBACD,CAAC;~~UAED7B~~,kBAAkB,CAAC,CAAC;UAEpB,~~IAAA8B~~,wBAAe,EAAEH,WAAY,CAAC,EAAEI,KAAK,CAAC,CAAC;QACxC,CAAG;~~QAAAV~~,QAAA,EAEDR;MAAS,CACJ,CACR,EACC,CAAER,YAAY,IAAIQ,SAAS,EAC3B,CAAC,CAAEV,QAAQ,iBACZ,IAAAP,WAAA,CAAA2B,GAAA,EAACnC,MAAA,~~CAAA4C~~,IAAI;QACJC,IAAI,EAAGC,wBAAmB;~~QAC1Bf~~,SAAS,EAAC;MAA0C,CACpD,CACD;IAAA,CACE,CAAC,EAEHf,OAAO,~~CAAC+B~~,GAAG,CAAIC,cAAc,iBAC9B,~~IAAAxC~~,WAAA,CAAAsB,IAAA;MAAAG,QAAA,gBACC,IAAAzB,WAAA,CAAA2B,GAAA,EAACvC,WAAA,CAAAwC,~~MAAM~~;~~QACNL~~,SAAS,EAAC,uCAAuC;~~QACjDM~~,OAAO,EAAC,UAAU;QAClBC,OAAO,EAAGA,CAAA,~~KAAM3B~~,WAAW,~~CAAEqC~~,cAAe,CAAG;~~QAAAf~~,QAAA,eAE/C,IAAAzB,WAAA,CAAA2B,GAAA,EAACjC,WAAA,~~CAAA+C~~,OAAU;~~UACVlC~~,QAAQ,~~EAAGiC~~,cAAgB;UAC3BE,aAAa,EAAG;QAAI,CACpB;MAAC,CACK,CAAC,eACT,~~IAAA1C~~,WAAA,CAAA2B,GAAA,EAACnC,MAAA,~~CAAA4C~~,IAAI;QACJC,IAAI,EAAGC,wBAAmB;~~QAC1Bf~~,SAAS,EAAC;MAA0C,CACpD,CAAC;IAAA,~~GAdOiB~~,~~cAeN~~,CACH,CAAC,EACD,CAAC,~~CAAEjC~~,QAAQ,iBACZ,IAAAP,WAAA,CAAA2B,GAAA;MACCJ,SAAS,EAAC,wCAAwC;MAClD,gBAAa,MAAM;MAAAE,QAAA,eAEnB,IAAAzB,WAAA,CAAA2B,GAAA,EAACjC,WAAA,~~CAAA+C~~,OAAU;~~QAAClC~~,QAAQ,EAAGA,QAAU;~~QAACmC~~,aAAa,EAAG;MAAI,CAAE;IAAC,CACtD,CACJ;EAAA,CACE;EACJ;AAEF;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAH,OAAA,~~GAEcxC~~,eAAe","ignoreList":[]}
1	+ {"version":3,"names":["_components","require","_data","_i18n","_icons","_element","_blockTitle","_interopRequireDefault","_store","_lockUnlock","_useBlockRefs","_getEditorRegion","_jsxRuntime","BlockBreadcrumb","rootLabelText","selectBlock","clearSelectedBlock","useDispatch","blockEditorStore","clientId","parents","hasSelection","useSelect","select","getSelectionStart","getSelectedBlockClientId","getEnabledBlockParents","unlock","selectedBlockClientId","rootLabel","__","blockRef","useRef","useBlockElementRef","jsxs","className","role","children","undefined","jsx","Button","__next40pxDefaultSize","variant","onClick","blockEditor","current","closest","getEditorRegion","focus","Icon","icon","chevronRightSmall","map","parentClientId","default","maximumLength","_default","exports"],"sources":["@wordpress/block-editor/src/components/block-breadcrumb/index.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { Button } from '@wordpress/components';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { chevronRightSmall, Icon } from '@wordpress/icons';\nimport { useRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport BlockTitle from '../block-title';\nimport { store as blockEditorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\nimport { useBlockElementRef } from '../block-list/use-block-props/use-block-refs';\nimport getEditorRegion from '../../utils/get-editor-region';\n\n/\n Block breadcrumb component, displaying the hierarchy of the current block selection as a breadcrumb.\n \n @param {Object} props Component props.\n * @param {string} props.rootLabelText Translated label for the root element of the breadcrumb trail.\n * @return {Element} Block Breadcrumb.\n /\nfunction BlockBreadcrumb( { rootLabelText } ) {\n\tconst { selectBlock, clearSelectedBlock } = useDispatch( blockEditorStore );\n\tconst { clientId, parents, hasSelection } = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetSelectionStart,\n\t\t\tgetSelectedBlockClientId,\n\t\t\tgetEnabledBlockParents,\n\t\t} = unlock( select( blockEditorStore ) );\n\t\tconst selectedBlockClientId = getSelectedBlockClientId();\n\t\treturn {\n\t\t\tparents: getEnabledBlockParents( selectedBlockClientId ),\n\t\t\tclientId: selectedBlockClientId,\n\t\t\thasSelection: !! getSelectionStart().clientId,\n\t\t};\n\t}, [] );\n\tconst rootLabel = rootLabelText \|\| __( 'Document' );\n\n\t// We don't care about this specific ref, but this is a way\n\t// to get a ref within the editor canvas so we can focus it later.\n\tconst blockRef = useRef();\n\tuseBlockElementRef( clientId, blockRef );\n\n\t/\n\t * Disable reason: The `list` ARIA role is redundant but\n\t * Safari+VoiceOver won't announce the list otherwise.\n\t /\n\t/ eslint-disable jsx-a11y/no-redundant-roles /\n\treturn (\n\t\t<ul\n\t\t\tclassName=\"block-editor-block-breadcrumb\"\n\t\t\trole=\"list\"\n\t\t\taria-label={ __( 'Block breadcrumb' ) }\n\t\t>\n\t\t\t<li\n\t\t\t\tclassName={\n\t\t\t\t\t! hasSelection\n\t\t\t\t\t\t? 'block-editor-block-breadcrumb__current'\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\taria-current={ ! hasSelection ? 'true' : undefined }\n\t\t\t>\n\t\t\t\t{ hasSelection && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\t// TODO: Switch to `true` (40px size) if possible\n\t\t\t\t\t\t__next40pxDefaultSize={ false }\n\t\t\t\t\t\tclassName=\"block-editor-block-breadcrumb__button\"\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t// Find the block editor wrapper for the selected block\n\t\t\t\t\t\t\tconst blockEditor = blockRef.current?.closest(\n\t\t\t\t\t\t\t\t'.editor-styles-wrapper'\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\tclearSelectedBlock();\n\n\t\t\t\t\t\t\tgetEditorRegion( blockEditor )?.focus();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ rootLabel }\n\t\t\t\t\t</Button>\n\t\t\t\t) }\n\t\t\t\t{ ! hasSelection && rootLabel }\n\t\t\t\t{ !! clientId && (\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ chevronRightSmall }\n\t\t\t\t\t\tclassName=\"block-editor-block-breadcrumb__separator\"\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</li>\n\n\t\t\t{ parents.map( ( parentClientId ) => (\n\t\t\t\t<li key={ parentClientId }>\n\t\t\t\t\t<Button\n\t\t\t\t\t\t// TODO: Switch to `true` (40px size) if possible\n\t\t\t\t\t\t__next40pxDefaultSize={ false }\n\t\t\t\t\t\tclassName=\"block-editor-block-breadcrumb__button\"\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => selectBlock( parentClientId ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<BlockTitle\n\t\t\t\t\t\t\tclientId={ parentClientId }\n\t\t\t\t\t\t\tmaximumLength={ 35 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ chevronRightSmall }\n\t\t\t\t\t\tclassName=\"block-editor-block-breadcrumb__separator\"\n\t\t\t\t\t/>\n\t\t\t\t</li>\n\t\t\t) ) }\n\t\t\t{ !! clientId && (\n\t\t\t\t<li\n\t\t\t\t\tclassName=\"block-editor-block-breadcrumb__current\"\n\t\t\t\t\taria-current=\"true\"\n\t\t\t\t>\n\t\t\t\t\t<BlockTitle clientId={ clientId } maximumLength={ 35 } />\n\t\t\t\t</li>\n\t\t\t) }\n\t\t</ul>\n\t\t/ eslint-enable jsx-a11y/no-redundant-roles */\n\t);\n}\n\nexport default BlockBreadcrumb;\n"],"mappings":"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","ignoreList":[]}

package/build/components/block-canvas/index.js CHANGED Viewed

@@ -25,6 +25,12 @@ var _jsxRuntime = require("react/jsx-runtime");
  * Internal dependencies
  */
+// EditorStyles is a memoized component, so avoid passing a new
+// object reference on each render.
+const EDITOR_STYLE_TRANSFORM_OPTIONS = {
+  // Don't transform selectors that already specify `.editor-styles-wrapper`.
+  ignoredSelectors: [/\.editor-styles-wrapper/gi]
+};
 function ExperimentalBlockCanvas({
   shouldIframe = true,
   height = '300px',
@@ -47,7 +53,8 @@ function ExperimentalBlockCanvas({
       },
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_editorStyles.default, {
         styles: styles,
-        scope: ".editor-styles-wrapper"
+        scope: ":where(.editor-styles-wrapper)",
+        transformOptions: EDITOR_STYLE_TRANSFORM_OPTIONS
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_writingFlow.default, {
         ref: contentRef,
         className: "editor-styles-wrapper",

package/build/components/block-canvas/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_compose","require","_element","_blockList","_interopRequireDefault","_blockTools","_editorStyles","_iframe","_writingFlow","_observeTyping","_blockSelectionClearer","_useBlockCommands","_jsxRuntime","ExperimentalBlockCanvas","shouldIframe","height","children","jsx","default","styles","contentRef","contentRefProp","iframeProps","useBlockCommands","resetTypingRef","useMouseMoveTypingReset","clearerRef","useBlockSelectionClearer","localRef","useRef","useMergeRefs","jsxs","__unstableContentRef","style","display","scope","ref","className","tabIndex","width","name","BlockCanvas","_default","exports"],"sources":["@wordpress/block-editor/src/components/block-canvas/index.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { useMergeRefs } from '@wordpress/compose';\nimport { useRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport BlockList from '../block-list';\nimport BlockTools from '../block-tools';\nimport EditorStyles from '../editor-styles';\nimport Iframe from '../iframe';\nimport WritingFlow from '../writing-flow';\nimport { useMouseMoveTypingReset } from '../observe-typing';\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\nimport { useBlockCommands } from '../use-block-commands';\n\nexport function ExperimentalBlockCanvas( {\n\tshouldIframe = true,\n\theight = '300px',\n\tchildren = <BlockList />,\n\tstyles,\n\tcontentRef: contentRefProp,\n\tiframeProps,\n} ) {\n\tuseBlockCommands();\n\tconst resetTypingRef = useMouseMoveTypingReset();\n\tconst clearerRef = useBlockSelectionClearer();\n\tconst localRef = useRef();\n\tconst contentRef = useMergeRefs( [ contentRefProp, clearerRef, localRef ] );\n\n\tif ( ! shouldIframe ) {\n\t\treturn (\n\t\t\t<BlockTools\n\t\t\t\t__unstableContentRef={ localRef }\n\t\t\t\tstyle={ { height, display: 'flex' } }\n\t\t\t>\n\t\t\t\t<EditorStyles\n\t\t\t\t\tstyles={ styles }\n\t\t\t\t\tscope=\".editor-styles-wrapper\"\n\t\t\t\t/>\n\t\t\t\t<WritingFlow\n\t\t\t\t\tref={ contentRef }\n\t\t\t\t\tclassName=\"editor-styles-wrapper\"\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</WritingFlow>\n\t\t\t</BlockTools>\n\t\t);\n\t}\n\n\treturn (\n\t\t<BlockTools\n\t\t\t__unstableContentRef={ localRef }\n\t\t\tstyle={ { height, display: 'flex' } }\n\t\t>\n\t\t\t<Iframe\n\t\t\t\t{ ...iframeProps }\n\t\t\t\tref={ resetTypingRef }\n\t\t\t\tcontentRef={ contentRef }\n\t\t\t\tstyle={ {\n\t\t\t\t\t...iframeProps?.style,\n\t\t\t\t} }\n\t\t\t\tname=\"editor-canvas\"\n\t\t\t>\n\t\t\t\t<EditorStyles styles={ styles } />\n\t\t\t\t{ children }\n\t\t\t</Iframe>\n\t\t</BlockTools>\n\t);\n}\n\n/\n BlockCanvas component is a component used to display the canvas of the block editor.\n * What we call the canvas is an iframe containing the block list that you can manipulate.\n * The component is also responsible of wiring up all the necessary hooks to enable\n * the keyboard navigation across blocks in the editor and inject content styles into the iframe.\n \n @example\n \n ```jsx\n * function MyBlockEditor() {\n * const [ blocks, updateBlocks ] = useState([]);\n * return (\n * <BlockEditorProvider\n * value={ blocks }\n * onInput={ updateBlocks }\n * onChange={ persistBlocks }\n * >\n * <BlockCanvas height=\"400px\" />\n * </BlockEditorProvider>\n * );\n * }\n * ```\n \n @param {Object} props Component props.\n * @param {string} props.height Canvas height, defaults to 300px.\n * @param {Array} props.styles Content styles to inject into the iframe.\n * @param {Element} props.children Content of the canvas, defaults to the BlockList component.\n * @return {Element} Block Breadcrumb.\n */\nfunction BlockCanvas( { children, height, styles } ) {\n\treturn (\n\t\t<ExperimentalBlockCanvas height={ height } styles={ styles }>\n\t\t\t{ children }\n\t\t</ExperimentalBlockCanvas>\n\t);\n}\n\nexport default BlockCanvas;\n"],"mappings":";;;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,UAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,WAAA,GAAAD,sBAAA,CAAAH,OAAA;AACA,IAAAK,aAAA,GAAAF,sBAAA,CAAAH,OAAA;AACA,IAAAM,OAAA,GAAAH,sBAAA,CAAAH,OAAA;AACA,IAAAO,YAAA,GAAAJ,sBAAA,CAAAH,OAAA;AACA,IAAAQ,cAAA,GAAAR,OAAA;AACA,IAAAS,sBAAA,GAAAT,OAAA;AACA,IAAAU,iBAAA,GAAAV,OAAA;AAAyD,IAAAW,WAAA,GAAAX,OAAA;AAhBzD;AACA;AACA;;AAIA;AACA;AACA;;~~AAUO~~,~~SAASY~~,uBAAuBA,CAAE;EACxCC,YAAY,GAAG,IAAI;EACnBC,MAAM,GAAG,OAAO;EAChBC,QAAQ,gBAAG,~~IAAAJ~~,WAAA,~~CAAAK~~,GAAA,~~EAACd~~,UAAA,~~CAAAe~~,OAAS,IAAE,CAAC;EACxBC,MAAM;EACNC,UAAU,EAAEC,cAAc;EAC1BC;AACD,CAAC,EAAG;EACH,IAAAC,kCAAgB,EAAC,CAAC;EAClB,MAAMC,cAAc,GAAG,IAAAC,sCAAuB,EAAC,CAAC;EAChD,MAAMC,UAAU,GAAG,IAAAC,+CAAwB,EAAC,CAAC;EAC7C,MAAMC,QAAQ,GAAG,IAAAC,eAAM,EAAC,CAAC;EACzB,MAAMT,UAAU,GAAG,IAAAU,qBAAY,EAAE,CAAET,cAAc,EAAEK,UAAU,EAAEE,QAAQ,CAAG,CAAC;EAE3E,IAAK,CAAEd,YAAY,EAAG;IACrB,oBACC,~~IAAAF~~,WAAA,~~CAAAmB~~,IAAA,~~EAAC1B~~,WAAA,~~CAAAa~~,OAAU;MACVc,oBAAoB,EAAGJ,QAAU;MACjCK,KAAK,EAAG;QAAElB,MAAM;QAAEmB,OAAO,EAAE;MAAO,CAAG;MAAAlB,QAAA,gBAErC,~~IAAAJ~~,WAAA,~~CAAAK~~,GAAA,~~EAACX~~,aAAA,~~CAAAY~~,OAAY;QACZC,MAAM,EAAGA,MAAQ;QACjBgB,KAAK,EAAC;~~MAAwB~~,~~CAC9B~~,CAAC,eACF,~~IAAAvB~~,WAAA,~~CAAAK~~,GAAA,~~EAACT~~,YAAA,~~CAAAU~~,OAAW;~~QACXkB~~,GAAG,~~EAAGhB~~,UAAY;~~QAClBiB~~,SAAS,EAAC,uBAAuB;QACjCC,QAAQ,EAAG,CAAC,CAAG;~~QACfL~~,KAAK,EAAG;UACPlB,MAAM,EAAE,MAAM;~~UACdwB~~,KAAK,EAAE;QACR,CAAG;~~QAAAvB~~,QAAA,EAEDA;MAAQ,CACE,CAAC;IAAA,CACH,CAAC;EAEf;EAEA,oBACC,~~IAAAJ~~,WAAA,~~CAAAK~~,GAAA,~~EAACZ~~,WAAA,~~CAAAa~~,OAAU;IACVc,oBAAoB,EAAGJ,QAAU;IACjCK,KAAK,EAAG;MAAElB,MAAM;MAAEmB,OAAO,EAAE;IAAO,CAAG;IAAAlB,QAAA,eAErC,~~IAAAJ~~,WAAA,~~CAAAmB~~,IAAA,~~EAACxB~~,OAAA,~~CAAAW~~,OAAM;MAAA,GACDI,WAAW;~~MAChBc~~,GAAG,~~EAAGZ~~,cAAgB;MACtBJ,UAAU,EAAGA,UAAY;MACzBa,KAAK,EAAG;QACP,GAAGX,WAAW,EAAEW;MACjB,CAAG;~~MACHO~~,IAAI,EAAC,eAAe;~~MAAAxB~~,QAAA,gBAEpB,~~IAAAJ~~,WAAA,~~CAAAK~~,GAAA,~~EAACX~~,aAAA,~~CAAAY~~,OAAY;QAACC,MAAM,EAAGA;MAAQ,CAAE,CAAC,EAChCH,QAAQ;IAAA,CACH;EAAC,CACE,CAAC;AAEf;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,~~SAASyB~~,WAAWA,CAAE;~~EAAEzB~~,QAAQ;EAAED,MAAM;EAAEI;AAAO,CAAC,EAAG;EACpD,oBACC,~~IAAAP~~,WAAA,~~CAAAK~~,GAAA,EAACJ,uBAAuB;IAACE,MAAM,EAAGA,MAAQ;IAACI,MAAM,EAAGA,MAAQ;IAAAH,QAAA,EACzDA;EAAQ,CACc,CAAC;AAE5B;AAAC,~~IAAA0B~~,QAAA,GAAAC,OAAA,~~CAAAzB~~,OAAA,~~GAEcuB~~,WAAW","ignoreList":[]}
1	+ {"version":3,"names":["_compose","require","_element","_blockList","_interopRequireDefault","_blockTools","_editorStyles","_iframe","_writingFlow","_observeTyping","_blockSelectionClearer","_useBlockCommands","_jsxRuntime","EDITOR_STYLE_TRANSFORM_OPTIONS","ignoredSelectors","ExperimentalBlockCanvas","shouldIframe","height","children","jsx","default","styles","contentRef","contentRefProp","iframeProps","useBlockCommands","resetTypingRef","useMouseMoveTypingReset","clearerRef","useBlockSelectionClearer","localRef","useRef","useMergeRefs","jsxs","__unstableContentRef","style","display","scope","transformOptions","ref","className","tabIndex","width","name","BlockCanvas","_default","exports"],"sources":["@wordpress/block-editor/src/components/block-canvas/index.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { useMergeRefs } from '@wordpress/compose';\nimport { useRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport BlockList from '../block-list';\nimport BlockTools from '../block-tools';\nimport EditorStyles from '../editor-styles';\nimport Iframe from '../iframe';\nimport WritingFlow from '../writing-flow';\nimport { useMouseMoveTypingReset } from '../observe-typing';\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\nimport { useBlockCommands } from '../use-block-commands';\n\n// EditorStyles is a memoized component, so avoid passing a new\n// object reference on each render.\nconst EDITOR_STYLE_TRANSFORM_OPTIONS = {\n\t// Don't transform selectors that already specify `.editor-styles-wrapper`.\n\tignoredSelectors: [ /\\.editor-styles-wrapper/gi ],\n};\n\nexport function ExperimentalBlockCanvas( {\n\tshouldIframe = true,\n\theight = '300px',\n\tchildren = <BlockList />,\n\tstyles,\n\tcontentRef: contentRefProp,\n\tiframeProps,\n} ) {\n\tuseBlockCommands();\n\tconst resetTypingRef = useMouseMoveTypingReset();\n\tconst clearerRef = useBlockSelectionClearer();\n\tconst localRef = useRef();\n\tconst contentRef = useMergeRefs( [ contentRefProp, clearerRef, localRef ] );\n\n\tif ( ! shouldIframe ) {\n\t\treturn (\n\t\t\t<BlockTools\n\t\t\t\t__unstableContentRef={ localRef }\n\t\t\t\tstyle={ { height, display: 'flex' } }\n\t\t\t>\n\t\t\t\t<EditorStyles\n\t\t\t\t\tstyles={ styles }\n\t\t\t\t\tscope=\":where(.editor-styles-wrapper)\"\n\t\t\t\t\ttransformOptions={ EDITOR_STYLE_TRANSFORM_OPTIONS }\n\t\t\t\t/>\n\t\t\t\t<WritingFlow\n\t\t\t\t\tref={ contentRef }\n\t\t\t\t\tclassName=\"editor-styles-wrapper\"\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</WritingFlow>\n\t\t\t</BlockTools>\n\t\t);\n\t}\n\n\treturn (\n\t\t<BlockTools\n\t\t\t__unstableContentRef={ localRef }\n\t\t\tstyle={ { height, display: 'flex' } }\n\t\t>\n\t\t\t<Iframe\n\t\t\t\t{ ...iframeProps }\n\t\t\t\tref={ resetTypingRef }\n\t\t\t\tcontentRef={ contentRef }\n\t\t\t\tstyle={ {\n\t\t\t\t\t...iframeProps?.style,\n\t\t\t\t} }\n\t\t\t\tname=\"editor-canvas\"\n\t\t\t>\n\t\t\t\t<EditorStyles styles={ styles } />\n\t\t\t\t{ children }\n\t\t\t</Iframe>\n\t\t</BlockTools>\n\t);\n}\n\n/\n BlockCanvas component is a component used to display the canvas of the block editor.\n * What we call the canvas is an iframe containing the block list that you can manipulate.\n * The component is also responsible of wiring up all the necessary hooks to enable\n * the keyboard navigation across blocks in the editor and inject content styles into the iframe.\n \n @example\n \n ```jsx\n * function MyBlockEditor() {\n * const [ blocks, updateBlocks ] = useState([]);\n * return (\n * <BlockEditorProvider\n * value={ blocks }\n * onInput={ updateBlocks }\n * onChange={ persistBlocks }\n * >\n * <BlockCanvas height=\"400px\" />\n * </BlockEditorProvider>\n * );\n * }\n * ```\n \n @param {Object} props Component props.\n * @param {string} props.height Canvas height, defaults to 300px.\n * @param {Array} props.styles Content styles to inject into the iframe.\n * @param {Element} props.children Content of the canvas, defaults to the BlockList component.\n * @return {Element} Block Breadcrumb.\n */\nfunction BlockCanvas( { children, height, styles } ) {\n\treturn (\n\t\t<ExperimentalBlockCanvas height={ height } styles={ styles }>\n\t\t\t{ children }\n\t\t</ExperimentalBlockCanvas>\n\t);\n}\n\nexport default BlockCanvas;\n"],"mappings":";;;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,UAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,WAAA,GAAAD,sBAAA,CAAAH,OAAA;AACA,IAAAK,aAAA,GAAAF,sBAAA,CAAAH,OAAA;AACA,IAAAM,OAAA,GAAAH,sBAAA,CAAAH,OAAA;AACA,IAAAO,YAAA,GAAAJ,sBAAA,CAAAH,OAAA;AACA,IAAAQ,cAAA,GAAAR,OAAA;AACA,IAAAS,sBAAA,GAAAT,OAAA;AACA,IAAAU,iBAAA,GAAAV,OAAA;AAAyD,IAAAW,WAAA,GAAAX,OAAA;AAhBzD;AACA;AACA;;AAIA;AACA;AACA;;AAUA;AACA;AACA,MAAMY,8BAA8B,GAAG;EACtC;EACAC,gBAAgB,EAAE,CAAE,2BAA2B;AAChD,CAAC;AAEM,SAASC,uBAAuBA,CAAE;EACxCC,YAAY,GAAG,IAAI;EACnBC,MAAM,GAAG,OAAO;EAChBC,QAAQ,gBAAG,IAAAN,WAAA,CAAAO,GAAA,EAAChB,UAAA,CAAAiB,OAAS,IAAE,CAAC;EACxBC,MAAM;EACNC,UAAU,EAAEC,cAAc;EAC1BC;AACD,CAAC,EAAG;EACH,IAAAC,kCAAgB,EAAC,CAAC;EAClB,MAAMC,cAAc,GAAG,IAAAC,sCAAuB,EAAC,CAAC;EAChD,MAAMC,UAAU,GAAG,IAAAC,+CAAwB,EAAC,CAAC;EAC7C,MAAMC,QAAQ,GAAG,IAAAC,eAAM,EAAC,CAAC;EACzB,MAAMT,UAAU,GAAG,IAAAU,qBAAY,EAAE,CAAET,cAAc,EAAEK,UAAU,EAAEE,QAAQ,CAAG,CAAC;EAE3E,IAAK,CAAEd,YAAY,EAAG;IACrB,oBACC,IAAAJ,WAAA,CAAAqB,IAAA,EAAC5B,WAAA,CAAAe,OAAU;MACVc,oBAAoB,EAAGJ,QAAU;MACjCK,KAAK,EAAG;QAAElB,MAAM;QAAEmB,OAAO,EAAE;MAAO,CAAG;MAAAlB,QAAA,gBAErC,IAAAN,WAAA,CAAAO,GAAA,EAACb,aAAA,CAAAc,OAAY;QACZC,MAAM,EAAGA,MAAQ;QACjBgB,KAAK,EAAC,gCAAgC;QACtCC,gBAAgB,EAAGzB;MAAgC,CACnD,CAAC,eACF,IAAAD,WAAA,CAAAO,GAAA,EAACX,YAAA,CAAAY,OAAW;QACXmB,GAAG,EAAGjB,UAAY;QAClBkB,SAAS,EAAC,uBAAuB;QACjCC,QAAQ,EAAG,CAAC,CAAG;QACfN,KAAK,EAAG;UACPlB,MAAM,EAAE,MAAM;UACdyB,KAAK,EAAE;QACR,CAAG;QAAAxB,QAAA,EAEDA;MAAQ,CACE,CAAC;IAAA,CACH,CAAC;EAEf;EAEA,oBACC,IAAAN,WAAA,CAAAO,GAAA,EAACd,WAAA,CAAAe,OAAU;IACVc,oBAAoB,EAAGJ,QAAU;IACjCK,KAAK,EAAG;MAAElB,MAAM;MAAEmB,OAAO,EAAE;IAAO,CAAG;IAAAlB,QAAA,eAErC,IAAAN,WAAA,CAAAqB,IAAA,EAAC1B,OAAA,CAAAa,OAAM;MAAA,GACDI,WAAW;MAChBe,GAAG,EAAGb,cAAgB;MACtBJ,UAAU,EAAGA,UAAY;MACzBa,KAAK,EAAG;QACP,GAAGX,WAAW,EAAEW;MACjB,CAAG;MACHQ,IAAI,EAAC,eAAe;MAAAzB,QAAA,gBAEpB,IAAAN,WAAA,CAAAO,GAAA,EAACb,aAAA,CAAAc,OAAY;QAACC,MAAM,EAAGA;MAAQ,CAAE,CAAC,EAChCH,QAAQ;IAAA,CACH;EAAC,CACE,CAAC;AAEf;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS0B,WAAWA,CAAE;EAAE1B,QAAQ;EAAED,MAAM;EAAEI;AAAO,CAAC,EAAG;EACpD,oBACC,IAAAT,WAAA,CAAAO,GAAA,EAACJ,uBAAuB;IAACE,MAAM,EAAGA,MAAQ;IAACI,MAAM,EAAGA,MAAQ;IAAAH,QAAA,EACzDA;EAAQ,CACc,CAAC;AAE5B;AAAC,IAAA2B,QAAA,GAAAC,OAAA,CAAA1B,OAAA,GAEcwB,WAAW","ignoreList":[]}

package/build/components/block-compare/block-view.js CHANGED Viewed

@@ -38,7 +38,10 @@ function BlockView({
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "block-editor-block-compare__action",
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button
+      // TODO: Switch to `true` (40px size) if possible
+      , {
+        __next40pxDefaultSize: false,
         variant: "secondary",
         tabIndex: "0",
         onClick: action,

package/build/components/block-compare/block-view.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_components","require","_element","_dom","_jsxRuntime","BlockView","title","rawContent","renderedContent","action","actionText","className","jsxs","children","jsx","RawHTML","safeHTML","Button","variant","tabIndex","onClick"],"sources":["@wordpress/block-editor/src/components/block-compare/block-view.js"],"sourcesContent":["/*\n WordPress dependencies\n */\nimport { Button } from '@wordpress/components';\nimport { RawHTML } from '@wordpress/element';\nimport { safeHTML } from '@wordpress/dom';\n\nexport default function BlockView( {\n\ttitle,\n\trawContent,\n\trenderedContent,\n\taction,\n\tactionText,\n\tclassName,\n} ) {\n\treturn (\n\t\t<div className={ className }>\n\t\t\t<div className=\"block-editor-block-compare__content\">\n\t\t\t\t<h2 className=\"block-editor-block-compare__heading\">\n\t\t\t\t\t{ title }\n\t\t\t\t</h2>\n\n\t\t\t\t<div className=\"block-editor-block-compare__html\">\n\t\t\t\t\t{ rawContent }\n\t\t\t\t</div>\n\n\t\t\t\t<div className=\"block-editor-block-compare__preview edit-post-visual-editor\">\n\t\t\t\t\t<RawHTML>{ safeHTML( renderedContent ) }</RawHTML>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<div className=\"block-editor-block-compare__action\">\n\t\t\t\t<Button ~~variant~~=\"secondary\" ~~tabIndex~~=\"0\" ~~onClick~~={ action }>\n\t\t\t\t\t{ actionText }\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,IAAA,GAAAF,OAAA;AAA0C,IAAAG,WAAA,GAAAH,OAAA;AAL1C;AACA;AACA;;AAKe,SAASI,SAASA,CAAE;EAClCC,KAAK;EACLC,UAAU;EACVC,eAAe;EACfC,MAAM;EACNC,UAAU;EACVC;AACD,CAAC,EAAG;EACH,oBACC,IAAAP,WAAA,CAAAQ,IAAA;IAAKD,SAAS,EAAGA,SAAW;IAAAE,QAAA,gBAC3B,IAAAT,WAAA,CAAAQ,IAAA;MAAKD,SAAS,EAAC,qCAAqC;MAAAE,QAAA,gBACnD,IAAAT,WAAA,CAAAU,GAAA;QAAIH,SAAS,EAAC,qCAAqC;QAAAE,QAAA,EAChDP;MAAK,CACJ,CAAC,eAEL,IAAAF,WAAA,CAAAU,GAAA;QAAKH,SAAS,EAAC,kCAAkC;QAAAE,QAAA,EAC9CN;MAAU,CACR,CAAC,eAEN,IAAAH,WAAA,CAAAU,GAAA;QAAKH,SAAS,EAAC,6DAA6D;QAAAE,QAAA,eAC3E,IAAAT,WAAA,CAAAU,GAAA,EAACZ,QAAA,CAAAa,OAAO;UAAAF,QAAA,EAAG,IAAAG,aAAQ,EAAER,eAAgB;QAAC,CAAW;MAAC,CAC9C,CAAC;IAAA,CACF,CAAC,eAEN,IAAAJ,WAAA,CAAAU,GAAA;MAAKH,SAAS,EAAC,oCAAoC;MAAAE,QAAA,eAClD,IAAAT,WAAA,CAAAU,GAAA,EAACd,WAAA,CAAAiB,~~MAAM~~;~~QAACC~~,OAAO,EAAC,WAAW;~~QAACC~~,QAAQ,EAAC,GAAG;~~QAACC~~,OAAO,~~EAAGX~~,MAAQ;QAAAI,QAAA,~~EACxDH~~;MAAU,CACL;IAAC,CACL,CAAC;EAAA,CACF,CAAC;AAER","ignoreList":[]}
1	+ {"version":3,"names":["_components","require","_element","_dom","_jsxRuntime","BlockView","title","rawContent","renderedContent","action","actionText","className","jsxs","children","jsx","RawHTML","safeHTML","Button","__next40pxDefaultSize","variant","tabIndex","onClick"],"sources":["@wordpress/block-editor/src/components/block-compare/block-view.js"],"sourcesContent":["/*\n WordPress dependencies\n */\nimport { Button } from '@wordpress/components';\nimport { RawHTML } from '@wordpress/element';\nimport { safeHTML } from '@wordpress/dom';\n\nexport default function BlockView( {\n\ttitle,\n\trawContent,\n\trenderedContent,\n\taction,\n\tactionText,\n\tclassName,\n} ) {\n\treturn (\n\t\t<div className={ className }>\n\t\t\t<div className=\"block-editor-block-compare__content\">\n\t\t\t\t<h2 className=\"block-editor-block-compare__heading\">\n\t\t\t\t\t{ title }\n\t\t\t\t</h2>\n\n\t\t\t\t<div className=\"block-editor-block-compare__html\">\n\t\t\t\t\t{ rawContent }\n\t\t\t\t</div>\n\n\t\t\t\t<div className=\"block-editor-block-compare__preview edit-post-visual-editor\">\n\t\t\t\t\t<RawHTML>{ safeHTML( renderedContent ) }</RawHTML>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<div className=\"block-editor-block-compare__action\">\n\t\t\t\t<Button\n\t\t\t\t\t// TODO: Switch to `true` (40px size) if possible\n\t\t\t\t\t__next40pxDefaultSize={ false }\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\ttabIndex=\"0\"\n\t\t\t\t\tonClick={ action }\n\t\t\t\t>\n\t\t\t\t\t{ actionText }\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,IAAA,GAAAF,OAAA;AAA0C,IAAAG,WAAA,GAAAH,OAAA;AAL1C;AACA;AACA;;AAKe,SAASI,SAASA,CAAE;EAClCC,KAAK;EACLC,UAAU;EACVC,eAAe;EACfC,MAAM;EACNC,UAAU;EACVC;AACD,CAAC,EAAG;EACH,oBACC,IAAAP,WAAA,CAAAQ,IAAA;IAAKD,SAAS,EAAGA,SAAW;IAAAE,QAAA,gBAC3B,IAAAT,WAAA,CAAAQ,IAAA;MAAKD,SAAS,EAAC,qCAAqC;MAAAE,QAAA,gBACnD,IAAAT,WAAA,CAAAU,GAAA;QAAIH,SAAS,EAAC,qCAAqC;QAAAE,QAAA,EAChDP;MAAK,CACJ,CAAC,eAEL,IAAAF,WAAA,CAAAU,GAAA;QAAKH,SAAS,EAAC,kCAAkC;QAAAE,QAAA,EAC9CN;MAAU,CACR,CAAC,eAEN,IAAAH,WAAA,CAAAU,GAAA;QAAKH,SAAS,EAAC,6DAA6D;QAAAE,QAAA,eAC3E,IAAAT,WAAA,CAAAU,GAAA,EAACZ,QAAA,CAAAa,OAAO;UAAAF,QAAA,EAAG,IAAAG,aAAQ,EAAER,eAAgB;QAAC,CAAW;MAAC,CAC9C,CAAC;IAAA,CACF,CAAC,eAEN,IAAAJ,WAAA,CAAAU,GAAA;MAAKH,SAAS,EAAC,oCAAoC;MAAAE,QAAA,eAClD,IAAAT,WAAA,CAAAU,GAAA,EAACd,WAAA,CAAAiB;MACA;MAAA;QACAC,qBAAqB,EAAG,KAAO;QAC/BC,OAAO,EAAC,WAAW;QACnBC,QAAQ,EAAC,GAAG;QACZC,OAAO,EAAGZ,MAAQ;QAAAI,QAAA,EAEhBH;MAAU,CACL;IAAC,CACL,CAAC;EAAA,CACF,CAAC;AAER","ignoreList":[]}

package/build/components/block-draggable/index.js CHANGED Viewed

@@ -64,7 +64,7 @@ const BlockDraggable = ({
       getBlockType: _getBlockType
     };
   }, [clientIds]);
-  const isDragging = (0, _element.useRef)(false);
+  const isDraggingRef = (0, _element.useRef)(false);
   const [startScrolling, scrollOnDragOver, stopScrolling] = (0, _useScrollWhenDragging.default)();
   const {
     getAllowedBlocks,
@@ -79,7 +79,7 @@ const BlockDraggable = ({
   // Stop dragging blocks if the block draggable is unmounted.
   (0, _element.useEffect)(() => {
     return () => {
-      if (isDragging.current) {
+      if (isDraggingRef.current) {
         stopDraggingBlocks();
       }
     };
@@ -159,7 +159,7 @@ const BlockDraggable = ({
       // frame to enable dragging.
       window.requestAnimationFrame(() => {
         startDraggingBlocks(clientIds);
-        isDragging.current = true;
+        isDraggingRef.current = true;
         startScrolling(event);
         if (onDragStart) {
           onDragStart();
@@ -169,7 +169,7 @@ const BlockDraggable = ({
     onDragOver: scrollOnDragOver,
     onDragEnd: () => {
       stopDraggingBlocks();
-      isDragging.current = false;
+      isDraggingRef.current = false;
       stopScrolling();
       if (onDragEnd) {
         onDragEnd();

package/build/components/block-draggable/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_blocks","require","_components","_data","_element","_compose","_draggableChip","_interopRequireDefault","_useScrollWhenDragging","_store","_useBlockRefs","_useBlockDropZone","_jsxRuntime","BlockDraggable","appendToOwnerDocument","children","clientIds","cloneClassname","elementId","onDragStart","onDragEnd","fadeWhenDisabled","dragComponent","srcRootClientId","isDraggable","icon","visibleInserter","getBlockType","useSelect","select","canMoveBlocks","getBlockRootClientId","getBlockName","getBlockAttributes","isBlockInsertionPointVisible","blockEditorStore","_getBlockType","getActiveBlockVariation","blocksStore","rootClientId","blockName","variation","isDragging","useRef","startScrolling","scrollOnDragOver","stopScrolling","useScrollWhenDragging","getAllowedBlocks","getBlockNamesByClientId","startDraggingBlocks","stopDraggingBlocks","useDispatch","useEffect","current","blockEl","useBlockElement","editorRoot","closest","onDragOver","event","target","draggedBlockNames","targetClientId","getAttribute","allowedBlocks","targetBlockName","dropTargetValid","length","targetRootClientId","targetRootBlockName","rootAllowedBlocks","isDropTargetValid","window","document","body","classList","add","remove","throttledOnDragOver","throttle","addEventListener","removeEventListener","draggable","transferData","type","srcClientIds","jsx","Draggable","__experimentalTransferDataType","requestAnimationFrame","__experimentalDragComponent","undefined","default","count","onDraggableStart","onDraggableEnd","_default","exports"],"sources":["@wordpress/block-editor/src/components/block-draggable/index.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { Draggable } from '@wordpress/components';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect, useRef } from '@wordpress/element';\nimport { throttle } from '@wordpress/compose';\n\n/\n Internal dependencies\n /\nimport BlockDraggableChip from './draggable-chip';\nimport useScrollWhenDragging from './use-scroll-when-dragging';\nimport { store as blockEditorStore } from '../../store';\nimport { useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport { isDropTargetValid } from '../use-block-drop-zone';\n\nconst BlockDraggable = ( {\n\tappendToOwnerDocument,\n\tchildren,\n\tclientIds,\n\tcloneClassname,\n\telementId,\n\tonDragStart,\n\tonDragEnd,\n\tfadeWhenDisabled = false,\n\tdragComponent,\n} ) => {\n\tconst {\n\t\tsrcRootClientId,\n\t\tisDraggable,\n\t\ticon,\n\t\tvisibleInserter,\n\t\tgetBlockType,\n\t} = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tcanMoveBlocks,\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tgetBlockName,\n\t\t\t\tgetBlockAttributes,\n\t\t\t\tisBlockInsertionPointVisible,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst { getBlockType: _getBlockType, getActiveBlockVariation } =\n\t\t\t\tselect( blocksStore );\n\t\t\tconst rootClientId = getBlockRootClientId( clientIds[ 0 ] );\n\t\t\tconst blockName = getBlockName( clientIds[ 0 ] );\n\t\t\tconst variation = getActiveBlockVariation(\n\t\t\t\tblockName,\n\t\t\t\tgetBlockAttributes( clientIds[ 0 ] )\n\t\t\t);\n\n\t\t\treturn {\n\t\t\t\tsrcRootClientId: rootClientId,\n\t\t\t\tisDraggable: canMoveBlocks( clientIds ),\n\t\t\t\ticon: variation?.icon \|\| _getBlockType( blockName )?.icon,\n\t\t\t\tvisibleInserter: isBlockInsertionPointVisible(),\n\t\t\t\tgetBlockType: _getBlockType,\n\t\t\t};\n\t\t},\n\t\t[ clientIds ]\n\t);\n\n\tconst isDragging = useRef( false );\n\tconst [ startScrolling, scrollOnDragOver, stopScrolling ] =\n\t\tuseScrollWhenDragging();\n\n\tconst { getAllowedBlocks, getBlockNamesByClientId, getBlockRootClientId } =\n\t\tuseSelect( blockEditorStore );\n\n\tconst { startDraggingBlocks, stopDraggingBlocks } =\n\t\tuseDispatch( blockEditorStore );\n\n\t// Stop dragging blocks if the block draggable is unmounted.\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tif ( isDragging.current ) {\n\t\t\t\tstopDraggingBlocks();\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\t// Find the root of the editor iframe.\n\tconst blockEl = useBlockElement( clientIds[ 0 ] );\n\tconst editorRoot = blockEl?.closest( 'body' );\n\n\t/\n\t * Add a dragover event listener to the editor root to track the blocks being dragged over.\n\t * The listener has to be inside the editor iframe otherwise the target isn't accessible.\n\t /\n\tuseEffect( () => {\n\t\tif ( ! editorRoot \|\| ! fadeWhenDisabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst onDragOver = ( event ) => {\n\t\t\tif ( ! event.target.closest( '[data-block]' ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst draggedBlockNames = getBlockNamesByClientId( clientIds );\n\t\t\tconst targetClientId = event.target\n\t\t\t\t.closest( '[data-block]' )\n\t\t\t\t.getAttribute( 'data-block' );\n\n\t\t\tconst allowedBlocks = getAllowedBlocks( targetClientId );\n\t\t\tconst targetBlockName = getBlockNamesByClientId( [\n\t\t\t\ttargetClientId,\n\t\t\t] )[ 0 ];\n\n\t\t\t/\n\t\t\t * Check if the target is valid to drop in.\n\t\t\t * If the target's allowedBlocks is an empty array,\n\t\t\t * it isn't a container block, in which case we check\n\t\t\t * its parent's validity instead.\n\t\t\t /\n\t\t\tlet dropTargetValid;\n\t\t\tif ( allowedBlocks?.length === 0 ) {\n\t\t\t\tconst targetRootClientId =\n\t\t\t\t\tgetBlockRootClientId( targetClientId );\n\t\t\t\tconst targetRootBlockName = getBlockNamesByClientId( [\n\t\t\t\t\ttargetRootClientId,\n\t\t\t\t] )[ 0 ];\n\t\t\t\tconst rootAllowedBlocks =\n\t\t\t\t\tgetAllowedBlocks( targetRootClientId );\n\t\t\t\tdropTargetValid = isDropTargetValid(\n\t\t\t\t\tgetBlockType,\n\t\t\t\t\trootAllowedBlocks,\n\t\t\t\t\tdraggedBlockNames,\n\t\t\t\t\ttargetRootBlockName\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tdropTargetValid = isDropTargetValid(\n\t\t\t\t\tgetBlockType,\n\t\t\t\t\tallowedBlocks,\n\t\t\t\t\tdraggedBlockNames,\n\t\t\t\t\ttargetBlockName\n\t\t\t\t);\n\t\t\t}\n\n\t\t\t/\n\t\t\t * Update the body class to reflect if drop target is valid.\n\t\t\t * This has to be done on the document body because the draggable\n\t\t\t * chip is rendered outside of the editor iframe.\n\t\t\t */\n\t\t\tif ( ! dropTargetValid && ! visibleInserter ) {\n\t\t\t\twindow?.document?.body?.classList?.add(\n\t\t\t\t\t'block-draggable-invalid-drag-token'\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\twindow?.document?.body?.classList?.remove(\n\t\t\t\t\t'block-draggable-invalid-drag-token'\n\t\t\t\t);\n\t\t\t}\n\t\t};\n\n\t\tconst throttledOnDragOver = throttle( onDragOver, 200 );\n\n\t\teditorRoot.addEventListener( 'dragover', throttledOnDragOver );\n\n\t\treturn () => {\n\t\t\teditorRoot.removeEventListener( 'dragover', throttledOnDragOver );\n\t\t};\n\t}, [\n\t\tclientIds,\n\t\teditorRoot,\n\t\tfadeWhenDisabled,\n\t\tgetAllowedBlocks,\n\t\tgetBlockNamesByClientId,\n\t\tgetBlockRootClientId,\n\t\tgetBlockType,\n\t\tvisibleInserter,\n\t] );\n\n\tif ( ! isDraggable ) {\n\t\treturn children( { draggable: false } );\n\t}\n\n\tconst transferData = {\n\t\ttype: 'block',\n\t\tsrcClientIds: clientIds,\n\t\tsrcRootClientId,\n\t};\n\n\treturn (\n\t\t<Draggable\n\t\t\tappendToOwnerDocument={ appendToOwnerDocument }\n\t\t\tcloneClassname={ cloneClassname }\n\t\t\t__experimentalTransferDataType=\"wp-blocks\"\n\t\t\ttransferData={ transferData }\n\t\t\tonDragStart={ ( event ) => {\n\t\t\t\t// Defer hiding the dragged source element to the next\n\t\t\t\t// frame to enable dragging.\n\t\t\t\twindow.requestAnimationFrame( () => {\n\t\t\t\t\tstartDraggingBlocks( clientIds );\n\t\t\t\t\tisDragging.current = true;\n\n\t\t\t\t\tstartScrolling( event );\n\n\t\t\t\t\tif ( onDragStart ) {\n\t\t\t\t\t\tonDragStart();\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t} }\n\t\t\tonDragOver={ scrollOnDragOver }\n\t\t\tonDragEnd={ () => {\n\t\t\t\tstopDraggingBlocks();\n\t\t\t\tisDragging.current = false;\n\n\t\t\t\tstopScrolling();\n\n\t\t\t\tif ( onDragEnd ) {\n\t\t\t\t\tonDragEnd();\n\t\t\t\t}\n\t\t\t} }\n\t\t\t__experimentalDragComponent={\n\t\t\t\t// Check against `undefined` so that `null` can be used to disable\n\t\t\t\t// the default drag component.\n\t\t\t\tdragComponent !== undefined ? (\n\t\t\t\t\tdragComponent\n\t\t\t\t) : (\n\t\t\t\t\t<BlockDraggableChip\n\t\t\t\t\t\tcount={ clientIds.length }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tfadeWhenDisabled\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t}\n\t\t\telementId={ elementId }\n\t\t>\n\t\t\t{ ( { onDraggableStart, onDraggableEnd } ) => {\n\t\t\t\treturn children( {\n\t\t\t\t\tdraggable: true,\n\t\t\t\t\tonDragStart: onDraggableStart,\n\t\t\t\t\tonDragEnd: onDraggableEnd,\n\t\t\t\t} );\n\t\t\t} }\n\t\t</Draggable>\n\t);\n};\n\nexport default BlockDraggable;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["_blocks","require","_components","_data","_element","_compose","_draggableChip","_interopRequireDefault","_useScrollWhenDragging","_store","_useBlockRefs","_useBlockDropZone","_jsxRuntime","BlockDraggable","appendToOwnerDocument","children","clientIds","cloneClassname","elementId","onDragStart","onDragEnd","fadeWhenDisabled","dragComponent","srcRootClientId","isDraggable","icon","visibleInserter","getBlockType","useSelect","select","canMoveBlocks","getBlockRootClientId","getBlockName","getBlockAttributes","isBlockInsertionPointVisible","blockEditorStore","_getBlockType","getActiveBlockVariation","blocksStore","rootClientId","blockName","variation","isDraggingRef","useRef","startScrolling","scrollOnDragOver","stopScrolling","useScrollWhenDragging","getAllowedBlocks","getBlockNamesByClientId","startDraggingBlocks","stopDraggingBlocks","useDispatch","useEffect","current","blockEl","useBlockElement","editorRoot","closest","onDragOver","event","target","draggedBlockNames","targetClientId","getAttribute","allowedBlocks","targetBlockName","dropTargetValid","length","targetRootClientId","targetRootBlockName","rootAllowedBlocks","isDropTargetValid","window","document","body","classList","add","remove","throttledOnDragOver","throttle","addEventListener","removeEventListener","draggable","transferData","type","srcClientIds","jsx","Draggable","__experimentalTransferDataType","requestAnimationFrame","__experimentalDragComponent","undefined","default","count","onDraggableStart","onDraggableEnd","_default","exports"],"sources":["@wordpress/block-editor/src/components/block-draggable/index.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { Draggable } from '@wordpress/components';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect, useRef } from '@wordpress/element';\nimport { throttle } from '@wordpress/compose';\n\n/\n Internal dependencies\n /\nimport BlockDraggableChip from './draggable-chip';\nimport useScrollWhenDragging from './use-scroll-when-dragging';\nimport { store as blockEditorStore } from '../../store';\nimport { useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport { isDropTargetValid } from '../use-block-drop-zone';\n\nconst BlockDraggable = ( {\n\tappendToOwnerDocument,\n\tchildren,\n\tclientIds,\n\tcloneClassname,\n\telementId,\n\tonDragStart,\n\tonDragEnd,\n\tfadeWhenDisabled = false,\n\tdragComponent,\n} ) => {\n\tconst {\n\t\tsrcRootClientId,\n\t\tisDraggable,\n\t\ticon,\n\t\tvisibleInserter,\n\t\tgetBlockType,\n\t} = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tcanMoveBlocks,\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tgetBlockName,\n\t\t\t\tgetBlockAttributes,\n\t\t\t\tisBlockInsertionPointVisible,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst { getBlockType: _getBlockType, getActiveBlockVariation } =\n\t\t\t\tselect( blocksStore );\n\t\t\tconst rootClientId = getBlockRootClientId( clientIds[ 0 ] );\n\t\t\tconst blockName = getBlockName( clientIds[ 0 ] );\n\t\t\tconst variation = getActiveBlockVariation(\n\t\t\t\tblockName,\n\t\t\t\tgetBlockAttributes( clientIds[ 0 ] )\n\t\t\t);\n\n\t\t\treturn {\n\t\t\t\tsrcRootClientId: rootClientId,\n\t\t\t\tisDraggable: canMoveBlocks( clientIds ),\n\t\t\t\ticon: variation?.icon \|\| _getBlockType( blockName )?.icon,\n\t\t\t\tvisibleInserter: isBlockInsertionPointVisible(),\n\t\t\t\tgetBlockType: _getBlockType,\n\t\t\t};\n\t\t},\n\t\t[ clientIds ]\n\t);\n\n\tconst isDraggingRef = useRef( false );\n\tconst [ startScrolling, scrollOnDragOver, stopScrolling ] =\n\t\tuseScrollWhenDragging();\n\n\tconst { getAllowedBlocks, getBlockNamesByClientId, getBlockRootClientId } =\n\t\tuseSelect( blockEditorStore );\n\n\tconst { startDraggingBlocks, stopDraggingBlocks } =\n\t\tuseDispatch( blockEditorStore );\n\n\t// Stop dragging blocks if the block draggable is unmounted.\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tif ( isDraggingRef.current ) {\n\t\t\t\tstopDraggingBlocks();\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\t// Find the root of the editor iframe.\n\tconst blockEl = useBlockElement( clientIds[ 0 ] );\n\tconst editorRoot = blockEl?.closest( 'body' );\n\n\t/\n\t * Add a dragover event listener to the editor root to track the blocks being dragged over.\n\t * The listener has to be inside the editor iframe otherwise the target isn't accessible.\n\t /\n\tuseEffect( () => {\n\t\tif ( ! editorRoot \|\| ! fadeWhenDisabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst onDragOver = ( event ) => {\n\t\t\tif ( ! event.target.closest( '[data-block]' ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst draggedBlockNames = getBlockNamesByClientId( clientIds );\n\t\t\tconst targetClientId = event.target\n\t\t\t\t.closest( '[data-block]' )\n\t\t\t\t.getAttribute( 'data-block' );\n\n\t\t\tconst allowedBlocks = getAllowedBlocks( targetClientId );\n\t\t\tconst targetBlockName = getBlockNamesByClientId( [\n\t\t\t\ttargetClientId,\n\t\t\t] )[ 0 ];\n\n\t\t\t/\n\t\t\t * Check if the target is valid to drop in.\n\t\t\t * If the target's allowedBlocks is an empty array,\n\t\t\t * it isn't a container block, in which case we check\n\t\t\t * its parent's validity instead.\n\t\t\t /\n\t\t\tlet dropTargetValid;\n\t\t\tif ( allowedBlocks?.length === 0 ) {\n\t\t\t\tconst targetRootClientId =\n\t\t\t\t\tgetBlockRootClientId( targetClientId );\n\t\t\t\tconst targetRootBlockName = getBlockNamesByClientId( [\n\t\t\t\t\ttargetRootClientId,\n\t\t\t\t] )[ 0 ];\n\t\t\t\tconst rootAllowedBlocks =\n\t\t\t\t\tgetAllowedBlocks( targetRootClientId );\n\t\t\t\tdropTargetValid = isDropTargetValid(\n\t\t\t\t\tgetBlockType,\n\t\t\t\t\trootAllowedBlocks,\n\t\t\t\t\tdraggedBlockNames,\n\t\t\t\t\ttargetRootBlockName\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tdropTargetValid = isDropTargetValid(\n\t\t\t\t\tgetBlockType,\n\t\t\t\t\tallowedBlocks,\n\t\t\t\t\tdraggedBlockNames,\n\t\t\t\t\ttargetBlockName\n\t\t\t\t);\n\t\t\t}\n\n\t\t\t/\n\t\t\t * Update the body class to reflect if drop target is valid.\n\t\t\t * This has to be done on the document body because the draggable\n\t\t\t * chip is rendered outside of the editor iframe.\n\t\t\t */\n\t\t\tif ( ! dropTargetValid && ! visibleInserter ) {\n\t\t\t\twindow?.document?.body?.classList?.add(\n\t\t\t\t\t'block-draggable-invalid-drag-token'\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\twindow?.document?.body?.classList?.remove(\n\t\t\t\t\t'block-draggable-invalid-drag-token'\n\t\t\t\t);\n\t\t\t}\n\t\t};\n\n\t\tconst throttledOnDragOver = throttle( onDragOver, 200 );\n\n\t\teditorRoot.addEventListener( 'dragover', throttledOnDragOver );\n\n\t\treturn () => {\n\t\t\teditorRoot.removeEventListener( 'dragover', throttledOnDragOver );\n\t\t};\n\t}, [\n\t\tclientIds,\n\t\teditorRoot,\n\t\tfadeWhenDisabled,\n\t\tgetAllowedBlocks,\n\t\tgetBlockNamesByClientId,\n\t\tgetBlockRootClientId,\n\t\tgetBlockType,\n\t\tvisibleInserter,\n\t] );\n\n\tif ( ! isDraggable ) {\n\t\treturn children( { draggable: false } );\n\t}\n\n\tconst transferData = {\n\t\ttype: 'block',\n\t\tsrcClientIds: clientIds,\n\t\tsrcRootClientId,\n\t};\n\n\treturn (\n\t\t<Draggable\n\t\t\tappendToOwnerDocument={ appendToOwnerDocument }\n\t\t\tcloneClassname={ cloneClassname }\n\t\t\t__experimentalTransferDataType=\"wp-blocks\"\n\t\t\ttransferData={ transferData }\n\t\t\tonDragStart={ ( event ) => {\n\t\t\t\t// Defer hiding the dragged source element to the next\n\t\t\t\t// frame to enable dragging.\n\t\t\t\twindow.requestAnimationFrame( () => {\n\t\t\t\t\tstartDraggingBlocks( clientIds );\n\t\t\t\t\tisDraggingRef.current = true;\n\n\t\t\t\t\tstartScrolling( event );\n\n\t\t\t\t\tif ( onDragStart ) {\n\t\t\t\t\t\tonDragStart();\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t} }\n\t\t\tonDragOver={ scrollOnDragOver }\n\t\t\tonDragEnd={ () => {\n\t\t\t\tstopDraggingBlocks();\n\t\t\t\tisDraggingRef.current = false;\n\n\t\t\t\tstopScrolling();\n\n\t\t\t\tif ( onDragEnd ) {\n\t\t\t\t\tonDragEnd();\n\t\t\t\t}\n\t\t\t} }\n\t\t\t__experimentalDragComponent={\n\t\t\t\t// Check against `undefined` so that `null` can be used to disable\n\t\t\t\t// the default drag component.\n\t\t\t\tdragComponent !== undefined ? (\n\t\t\t\t\tdragComponent\n\t\t\t\t) : (\n\t\t\t\t\t<BlockDraggableChip\n\t\t\t\t\t\tcount={ clientIds.length }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tfadeWhenDisabled\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t}\n\t\t\telementId={ elementId }\n\t\t>\n\t\t\t{ ( { onDraggableStart, onDraggableEnd } ) => {\n\t\t\t\treturn children( {\n\t\t\t\t\tdraggable: true,\n\t\t\t\t\tonDragStart: onDraggableStart,\n\t\t\t\t\tonDragEnd: onDraggableEnd,\n\t\t\t\t} );\n\t\t\t} }\n\t\t</Draggable>\n\t);\n};\n\nexport default BlockDraggable;\n"],"mappings":"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","ignoreList":[]}

package/build/components/block-draggable/use-scroll-when-dragging.js CHANGED Viewed

@@ -23,64 +23,64 @@ const VELOCITY_MULTIPLIER = PIXELS_PER_SECOND_PER_PERCENTAGE * (SCROLL_INTERVAL_
  *                      and `onDragEnd` events respectively.
  */
 function useScrollWhenDragging() {
-  const dragStartY = (0, _element.useRef)(null);
-  const velocityY = (0, _element.useRef)(null);
-  const scrollParentY = (0, _element.useRef)(null);
-  const scrollEditorInterval = (0, _element.useRef)(null);
+  const dragStartYRef = (0, _element.useRef)(null);
+  const velocityYRef = (0, _element.useRef)(null);
+  const scrollParentYRef = (0, _element.useRef)(null);
+  const scrollEditorIntervalRef = (0, _element.useRef)(null);
   // Clear interval when unmounting.
   (0, _element.useEffect)(() => () => {
-    if (scrollEditorInterval.current) {
-      clearInterval(scrollEditorInterval.current);
-      scrollEditorInterval.current = null;
+    if (scrollEditorIntervalRef.current) {
+      clearInterval(scrollEditorIntervalRef.current);
+      scrollEditorIntervalRef.current = null;
     }
   }, []);
   const startScrolling = (0, _element.useCallback)(event => {
-    dragStartY.current = event.clientY;
+    dragStartYRef.current = event.clientY;
     // Find nearest parent(s) to scroll.
-    scrollParentY.current = (0, _dom.getScrollContainer)(event.target);
-    scrollEditorInterval.current = setInterval(() => {
-      if (scrollParentY.current && velocityY.current) {
-        const newTop = scrollParentY.current.scrollTop + velocityY.current;
+    scrollParentYRef.current = (0, _dom.getScrollContainer)(event.target);
+    scrollEditorIntervalRef.current = setInterval(() => {
+      if (scrollParentYRef.current && velocityYRef.current) {
+        const newTop = scrollParentYRef.current.scrollTop + velocityYRef.current;
         // Setting `behavior: 'smooth'` as a scroll property seems to hurt performance.
         // Better to use a small scroll interval.
-        scrollParentY.current.scroll({
+        scrollParentYRef.current.scroll({
           top: newTop
         });
       }
     }, SCROLL_INTERVAL_MS);
   }, []);
   const scrollOnDragOver = (0, _element.useCallback)(event => {
-    if (!scrollParentY.current) {
+    if (!scrollParentYRef.current) {
       return;
     }
-    const scrollParentHeight = scrollParentY.current.offsetHeight;
-    const offsetDragStartPosition = dragStartY.current - scrollParentY.current.offsetTop;
-    const offsetDragPosition = event.clientY - scrollParentY.current.offsetTop;
+    const scrollParentHeight = scrollParentYRef.current.offsetHeight;
+    const offsetDragStartPosition = dragStartYRef.current - scrollParentYRef.current.offsetTop;
+    const offsetDragPosition = event.clientY - scrollParentYRef.current.offsetTop;
     if (event.clientY > offsetDragStartPosition) {
       // User is dragging downwards.
       const moveableDistance = Math.max(scrollParentHeight - offsetDragStartPosition - SCROLL_INACTIVE_DISTANCE_PX, 0);
       const dragDistance = Math.max(offsetDragPosition - offsetDragStartPosition - SCROLL_INACTIVE_DISTANCE_PX, 0);
       const distancePercentage = moveableDistance === 0 || dragDistance === 0 ? 0 : dragDistance / moveableDistance;
-      velocityY.current = VELOCITY_MULTIPLIER * distancePercentage;
+      velocityYRef.current = VELOCITY_MULTIPLIER * distancePercentage;
     } else if (event.clientY < offsetDragStartPosition) {
       // User is dragging upwards.
       const moveableDistance = Math.max(offsetDragStartPosition - SCROLL_INACTIVE_DISTANCE_PX, 0);
       const dragDistance = Math.max(offsetDragStartPosition - offsetDragPosition - SCROLL_INACTIVE_DISTANCE_PX, 0);
       const distancePercentage = moveableDistance === 0 || dragDistance === 0 ? 0 : dragDistance / moveableDistance;
-      velocityY.current = -VELOCITY_MULTIPLIER * distancePercentage;
+      velocityYRef.current = -VELOCITY_MULTIPLIER * distancePercentage;
     } else {
-      velocityY.current = 0;
+      velocityYRef.current = 0;
     }
   }, []);
   const stopScrolling = () => {
-    dragStartY.current = null;
-    scrollParentY.current = null;
-    if (scrollEditorInterval.current) {
-      clearInterval(scrollEditorInterval.current);
-      scrollEditorInterval.current = null;
+    dragStartYRef.current = null;
+    scrollParentYRef.current = null;
+    if (scrollEditorIntervalRef.current) {
+      clearInterval(scrollEditorIntervalRef.current);
+      scrollEditorIntervalRef.current = null;
     }
   };
   return [startScrolling, scrollOnDragOver, stopScrolling];

package/build/components/block-draggable/use-scroll-when-dragging.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_dom","require","_element","SCROLL_INACTIVE_DISTANCE_PX","SCROLL_INTERVAL_MS","PIXELS_PER_SECOND_PER_PERCENTAGE","VELOCITY_MULTIPLIER","useScrollWhenDragging","~~dragStartY~~","useRef","~~velocityY~~","~~scrollParentY~~","~~scrollEditorInterval~~","useEffect","current","clearInterval","startScrolling","useCallback","event","clientY","getScrollContainer","target","setInterval","newTop","scrollTop","scroll","top","scrollOnDragOver","scrollParentHeight","offsetHeight","offsetDragStartPosition","offsetTop","offsetDragPosition","moveableDistance","Math","max","dragDistance","distancePercentage","stopScrolling"],"sources":["@wordpress/block-editor/src/components/block-draggable/use-scroll-when-dragging.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { getScrollContainer } from '@wordpress/dom';\nimport { useCallback, useEffect, useRef } from '@wordpress/element';\n\nconst SCROLL_INACTIVE_DISTANCE_PX = 50;\nconst SCROLL_INTERVAL_MS = 25;\nconst PIXELS_PER_SECOND_PER_PERCENTAGE = 1000;\nconst VELOCITY_MULTIPLIER =\n\tPIXELS_PER_SECOND_PER_PERCENTAGE ( SCROLL_INTERVAL_MS / 1000 );\n\n/*\n React hook that scrolls the scroll container when a block is being dragged.\n \n @return {Function[]} `startScrolling`, `scrollOnDragOver`, `stopScrolling`\n * functions to be called in `onDragStart`, `onDragOver`\n * and `onDragEnd` events respectively.\n /\nexport default function useScrollWhenDragging() {\n\tconst ~~dragStartY~~ = useRef( null );\n\tconst ~~velocityY~~ = useRef( null );\n\tconst ~~scrollParentY~~ = useRef( null );\n\tconst ~~scrollEditorInterval~~ = useRef( null );\n\n\t// Clear interval when unmounting.\n\tuseEffect(\n\t\t() => () => {\n\t\t\tif ( ~~scrollEditorInterval~~.current ) {\n\t\t\t\tclearInterval( ~~scrollEditorInterval~~.current );\n\t\t\t\~~tscrollEditorInterval~~.current = null;\n\t\t\t}\n\t\t},\n\t\t[]\n\t);\n\n\tconst startScrolling = useCallback( ( event ) => {\n\t\~~tdragStartY~~.current = event.clientY;\n\n\t\t// Find nearest parent(s) to scroll.\n\t\~~tscrollParentY~~.current = getScrollContainer( event.target );\n\n\t\~~tscrollEditorInterval~~.current = setInterval( () => {\n\t\t\tif ( ~~scrollParentY~~.current && ~~velocityY~~.current ) {\n\t\t\t\tconst newTop =\n\t\t\t\t\~~tscrollParentY~~.current.scrollTop + ~~velocityY~~.current;\n\n\t\t\t\t// Setting `behavior: 'smooth'` as a scroll property seems to hurt performance.\n\t\t\t\t// Better to use a small scroll interval.\n\t\t\t\~~tscrollParentY~~.current.scroll( {\n\t\t\t\t\ttop: newTop,\n\t\t\t\t} );\n\t\t\t}\n\t\t}, SCROLL_INTERVAL_MS );\n\t}, [] );\n\n\tconst scrollOnDragOver = useCallback( ( event ) => {\n\t\tif ( ! ~~scrollParentY~~.current ) {\n\t\t\treturn;\n\t\t}\n\t\tconst scrollParentHeight = ~~scrollParentY~~.current.offsetHeight;\n\t\tconst offsetDragStartPosition =\n\t\t\~~tdragStartY~~.current - ~~scrollParentY~~.current.offsetTop;\n\t\tconst offsetDragPosition =\n\t\t\tevent.clientY - ~~scrollParentY~~.current.offsetTop;\n\n\t\tif ( event.clientY > offsetDragStartPosition ) {\n\t\t\t// User is dragging downwards.\n\t\t\tconst moveableDistance = Math.max(\n\t\t\t\tscrollParentHeight -\n\t\t\t\t\toffsetDragStartPosition -\n\t\t\t\t\tSCROLL_INACTIVE_DISTANCE_PX,\n\t\t\t\t0\n\t\t\t);\n\t\t\tconst dragDistance = Math.max(\n\t\t\t\toffsetDragPosition -\n\t\t\t\t\toffsetDragStartPosition -\n\t\t\t\t\tSCROLL_INACTIVE_DISTANCE_PX,\n\t\t\t\t0\n\t\t\t);\n\t\t\tconst distancePercentage =\n\t\t\t\tmoveableDistance === 0 \|\| dragDistance === 0\n\t\t\t\t\t? 0\n\t\t\t\t\t: dragDistance / moveableDistance;\n\t\t\~~tvelocityY~~.current = VELOCITY_MULTIPLIER distancePercentage;\n\t\t} else if ( event.clientY < offsetDragStartPosition ) {\n\t\t\t// User is dragging upwards.\n\t\t\tconst moveableDistance = Math.max(\n\t\t\t\toffsetDragStartPosition - SCROLL_INACTIVE_DISTANCE_PX,\n\t\t\t\t0\n\t\t\t);\n\t\t\tconst dragDistance = Math.max(\n\t\t\t\toffsetDragStartPosition -\n\t\t\t\t\toffsetDragPosition -\n\t\t\t\t\tSCROLL_INACTIVE_DISTANCE_PX,\n\t\t\t\t0\n\t\t\t);\n\t\t\tconst distancePercentage =\n\t\t\t\tmoveableDistance === 0 \|\| dragDistance === 0\n\t\t\t\t\t? 0\n\t\t\t\t\t: dragDistance / moveableDistance;\n\t\t\~~tvelocityY~~.current = -VELOCITY_MULTIPLIER * distancePercentage;\n\t\t} else {\n\t\t\~~tvelocityY~~.current = 0;\n\t\t}\n\t}, [] );\n\n\tconst stopScrolling = () => {\n\t\~~tdragStartY~~.current = null;\n\t\~~tscrollParentY~~.current = null;\n\n\t\tif ( ~~scrollEditorInterval~~.current ) {\n\t\t\tclearInterval( ~~scrollEditorInterval~~.current );\n\t\t\~~tscrollEditorInterval~~.current = null;\n\t\t}\n\t};\n\n\treturn [ startScrolling, scrollOnDragOver, stopScrolling ];\n}\n"],"mappings":";;;;;;AAGA,IAAAA,IAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAJA;AACA;AACA;;AAIA,MAAME,2BAA2B,GAAG,EAAE;AACtC,MAAMC,kBAAkB,GAAG,EAAE;AAC7B,MAAMC,gCAAgC,GAAG,IAAI;AAC7C,MAAMC,mBAAmB,GACxBD,gCAAgC,IAAKD,kBAAkB,GAAG,IAAI,CAAE;;AAEjE;AACA;AACA;AACA;AACA;AACA;AACA;AACe,SAASG,qBAAqBA,CAAA,EAAG;EAC/C,MAAMC,~~UAAU~~,GAAG,IAAAC,eAAM,EAAE,IAAK,CAAC;~~EACjC~~,MAAMC,~~SAAS~~,GAAG,IAAAD,eAAM,EAAE,IAAK,CAAC;~~EAChC~~,MAAME,~~aAAa~~,GAAG,IAAAF,eAAM,EAAE,IAAK,CAAC;~~EACpC~~,MAAMG,~~oBAAoB~~,GAAG,IAAAH,eAAM,EAAE,IAAK,CAAC;;~~EAE3C~~;EACA,IAAAI,kBAAS,EACR,MAAM,MAAM;IACX,IAAKD,~~oBAAoB~~,CAACE,OAAO,EAAG;~~MACnCC~~,aAAa,CAAEH,~~oBAAoB~~,CAACE,OAAQ,CAAC;~~MAC7CF~~,~~oBAAoB~~,CAACE,OAAO,GAAG,IAAI;~~IACpC~~;EACD,CAAC,EACD,EACD,CAAC;EAED,MAAME,cAAc,GAAG,IAAAC,oBAAW,EAAIC,KAAK,IAAM;IAChDV,~~UAAU~~,CAACM,OAAO,GAAGI,KAAK,CAACC,OAAO;;~~IAElC~~;IACAR,~~aAAa~~,CAACG,OAAO,GAAG,IAAAM,uBAAkB,EAAEF,KAAK,CAACG,MAAO,CAAC;~~IAE1DT~~,~~oBAAoB~~,CAACE,OAAO,GAAGQ,WAAW,CAAE,MAAM;~~MACjD~~,IAAKX,~~aAAa~~,CAACG,OAAO,IAAIJ,~~SAAS~~,CAACI,OAAO,EAAG;~~QACjD~~,MAAMS,MAAM,GACXZ,~~aAAa~~,CAACG,OAAO,CAACU,SAAS,GAAGd,~~SAAS~~,CAACI,OAAO;;~~QAEpD~~;QACA;QACAH,~~aAAa~~,CAACG,OAAO,CAACW,MAAM,CAAE;~~UAC7BC~~,GAAG,EAAEH;QACN,CAAE,CAAC;MACJ;IACD,CAAC,EAAEnB,kBAAmB,CAAC;EACxB,CAAC,EAAE,EAAG,CAAC;EAEP,MAAMuB,gBAAgB,GAAG,IAAAV,oBAAW,EAAIC,KAAK,IAAM;IAClD,IAAK,CAAEP,~~aAAa~~,CAACG,OAAO,EAAG;~~MAC9B~~;IACD;IACA,MAAMc,kBAAkB,GAAGjB,~~aAAa~~,CAACG,OAAO,CAACe,YAAY;~~IAC7D~~,MAAMC,uBAAuB,GAC5BtB,~~UAAU~~,CAACM,OAAO,GAAGH,~~aAAa~~,CAACG,OAAO,CAACiB,SAAS;~~IACrD~~,MAAMC,kBAAkB,GACvBd,KAAK,CAACC,OAAO,GAAGR,~~aAAa~~,CAACG,OAAO,CAACiB,SAAS;~~IAEhD~~,IAAKb,KAAK,CAACC,OAAO,GAAGW,uBAAuB,EAAG;MAC9C;MACA,MAAMG,gBAAgB,GAAGC,IAAI,CAACC,GAAG,CAChCP,kBAAkB,GACjBE,uBAAuB,GACvB3B,2BAA2B,EAC5B,CACD,CAAC;MACD,MAAMiC,YAAY,GAAGF,IAAI,CAACC,GAAG,CAC5BH,kBAAkB,GACjBF,uBAAuB,GACvB3B,2BAA2B,EAC5B,CACD,CAAC;MACD,MAAMkC,kBAAkB,GACvBJ,gBAAgB,KAAK,CAAC,IAAIG,YAAY,KAAK,CAAC,GACzC,CAAC,GACDA,YAAY,GAAGH,gBAAgB;MACnCvB,~~SAAS~~,CAACI,OAAO,GAAGR,mBAAmB,GAAG+B,kBAAkB;~~IAC7D~~,CAAC,MAAM,IAAKnB,KAAK,CAACC,OAAO,GAAGW,uBAAuB,EAAG;MACrD;MACA,MAAMG,gBAAgB,GAAGC,IAAI,CAACC,GAAG,CAChCL,uBAAuB,GAAG3B,2BAA2B,EACrD,CACD,CAAC;MACD,MAAMiC,YAAY,GAAGF,IAAI,CAACC,GAAG,CAC5BL,uBAAuB,GACtBE,kBAAkB,GAClB7B,2BAA2B,EAC5B,CACD,CAAC;MACD,MAAMkC,kBAAkB,GACvBJ,gBAAgB,KAAK,CAAC,IAAIG,YAAY,KAAK,CAAC,GACzC,CAAC,GACDA,YAAY,GAAGH,gBAAgB;MACnCvB,~~SAAS~~,CAACI,OAAO,GAAG,CAACR,mBAAmB,GAAG+B,kBAAkB;~~IAC9D~~,CAAC,MAAM;MACN3B,~~SAAS~~,CAACI,OAAO,GAAG,CAAC;~~IACtB~~;EACD,CAAC,EAAE,EAAG,CAAC;EAEP,MAAMwB,aAAa,GAAGA,CAAA,KAAM;IAC3B9B,~~UAAU~~,CAACM,OAAO,GAAG,IAAI;~~IACzBH~~,~~aAAa~~,CAACG,OAAO,GAAG,IAAI;~~IAE5B~~,IAAKF,~~oBAAoB~~,CAACE,OAAO,EAAG;~~MACnCC~~,aAAa,CAAEH,~~oBAAoB~~,CAACE,OAAQ,CAAC;~~MAC7CF~~,~~oBAAoB~~,CAACE,OAAO,GAAG,IAAI;~~IACpC~~;EACD,CAAC;EAED,OAAO,CAAEE,cAAc,EAAEW,gBAAgB,EAAEW,aAAa,CAAE;AAC3D","ignoreList":[]}
1	+ {"version":3,"names":["_dom","require","_element","SCROLL_INACTIVE_DISTANCE_PX","SCROLL_INTERVAL_MS","PIXELS_PER_SECOND_PER_PERCENTAGE","VELOCITY_MULTIPLIER","useScrollWhenDragging","dragStartYRef","useRef","velocityYRef","scrollParentYRef","scrollEditorIntervalRef","useEffect","current","clearInterval","startScrolling","useCallback","event","clientY","getScrollContainer","target","setInterval","newTop","scrollTop","scroll","top","scrollOnDragOver","scrollParentHeight","offsetHeight","offsetDragStartPosition","offsetTop","offsetDragPosition","moveableDistance","Math","max","dragDistance","distancePercentage","stopScrolling"],"sources":["@wordpress/block-editor/src/components/block-draggable/use-scroll-when-dragging.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { getScrollContainer } from '@wordpress/dom';\nimport { useCallback, useEffect, useRef } from '@wordpress/element';\n\nconst SCROLL_INACTIVE_DISTANCE_PX = 50;\nconst SCROLL_INTERVAL_MS = 25;\nconst PIXELS_PER_SECOND_PER_PERCENTAGE = 1000;\nconst VELOCITY_MULTIPLIER =\n\tPIXELS_PER_SECOND_PER_PERCENTAGE ( SCROLL_INTERVAL_MS / 1000 );\n\n/*\n React hook that scrolls the scroll container when a block is being dragged.\n \n @return {Function[]} `startScrolling`, `scrollOnDragOver`, `stopScrolling`\n * functions to be called in `onDragStart`, `onDragOver`\n * and `onDragEnd` events respectively.\n /\nexport default function useScrollWhenDragging() {\n\tconst dragStartYRef = useRef( null );\n\tconst velocityYRef = useRef( null );\n\tconst scrollParentYRef = useRef( null );\n\tconst scrollEditorIntervalRef = useRef( null );\n\n\t// Clear interval when unmounting.\n\tuseEffect(\n\t\t() => () => {\n\t\t\tif ( scrollEditorIntervalRef.current ) {\n\t\t\t\tclearInterval( scrollEditorIntervalRef.current );\n\t\t\t\tscrollEditorIntervalRef.current = null;\n\t\t\t}\n\t\t},\n\t\t[]\n\t);\n\n\tconst startScrolling = useCallback( ( event ) => {\n\t\tdragStartYRef.current = event.clientY;\n\n\t\t// Find nearest parent(s) to scroll.\n\t\tscrollParentYRef.current = getScrollContainer( event.target );\n\n\t\tscrollEditorIntervalRef.current = setInterval( () => {\n\t\t\tif ( scrollParentYRef.current && velocityYRef.current ) {\n\t\t\t\tconst newTop =\n\t\t\t\t\tscrollParentYRef.current.scrollTop + velocityYRef.current;\n\n\t\t\t\t// Setting `behavior: 'smooth'` as a scroll property seems to hurt performance.\n\t\t\t\t// Better to use a small scroll interval.\n\t\t\t\tscrollParentYRef.current.scroll( {\n\t\t\t\t\ttop: newTop,\n\t\t\t\t} );\n\t\t\t}\n\t\t}, SCROLL_INTERVAL_MS );\n\t}, [] );\n\n\tconst scrollOnDragOver = useCallback( ( event ) => {\n\t\tif ( ! scrollParentYRef.current ) {\n\t\t\treturn;\n\t\t}\n\t\tconst scrollParentHeight = scrollParentYRef.current.offsetHeight;\n\t\tconst offsetDragStartPosition =\n\t\t\tdragStartYRef.current - scrollParentYRef.current.offsetTop;\n\t\tconst offsetDragPosition =\n\t\t\tevent.clientY - scrollParentYRef.current.offsetTop;\n\n\t\tif ( event.clientY > offsetDragStartPosition ) {\n\t\t\t// User is dragging downwards.\n\t\t\tconst moveableDistance = Math.max(\n\t\t\t\tscrollParentHeight -\n\t\t\t\t\toffsetDragStartPosition -\n\t\t\t\t\tSCROLL_INACTIVE_DISTANCE_PX,\n\t\t\t\t0\n\t\t\t);\n\t\t\tconst dragDistance = Math.max(\n\t\t\t\toffsetDragPosition -\n\t\t\t\t\toffsetDragStartPosition -\n\t\t\t\t\tSCROLL_INACTIVE_DISTANCE_PX,\n\t\t\t\t0\n\t\t\t);\n\t\t\tconst distancePercentage =\n\t\t\t\tmoveableDistance === 0 \|\| dragDistance === 0\n\t\t\t\t\t? 0\n\t\t\t\t\t: dragDistance / moveableDistance;\n\t\t\tvelocityYRef.current = VELOCITY_MULTIPLIER distancePercentage;\n\t\t} else if ( event.clientY < offsetDragStartPosition ) {\n\t\t\t// User is dragging upwards.\n\t\t\tconst moveableDistance = Math.max(\n\t\t\t\toffsetDragStartPosition - SCROLL_INACTIVE_DISTANCE_PX,\n\t\t\t\t0\n\t\t\t);\n\t\t\tconst dragDistance = Math.max(\n\t\t\t\toffsetDragStartPosition -\n\t\t\t\t\toffsetDragPosition -\n\t\t\t\t\tSCROLL_INACTIVE_DISTANCE_PX,\n\t\t\t\t0\n\t\t\t);\n\t\t\tconst distancePercentage =\n\t\t\t\tmoveableDistance === 0 \|\| dragDistance === 0\n\t\t\t\t\t? 0\n\t\t\t\t\t: dragDistance / moveableDistance;\n\t\t\tvelocityYRef.current = -VELOCITY_MULTIPLIER * distancePercentage;\n\t\t} else {\n\t\t\tvelocityYRef.current = 0;\n\t\t}\n\t}, [] );\n\n\tconst stopScrolling = () => {\n\t\tdragStartYRef.current = null;\n\t\tscrollParentYRef.current = null;\n\n\t\tif ( scrollEditorIntervalRef.current ) {\n\t\t\tclearInterval( scrollEditorIntervalRef.current );\n\t\t\tscrollEditorIntervalRef.current = null;\n\t\t}\n\t};\n\n\treturn [ startScrolling, scrollOnDragOver, stopScrolling ];\n}\n"],"mappings":"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","ignoreList":[]}

package/build/components/block-edit/multiple-usage-warning.js CHANGED Viewed

@@ -30,11 +30,17 @@ function MultipleUsageWarning({
   } = (0, _data.useDispatch)(_store.store);
   const blockType = (0, _blocks.getBlockType)(name);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_warning.default, {
-    actions: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
+    actions: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button
+    // TODO: Switch to `true` (40px size) if possible
+    , {
+      __next40pxDefaultSize: false,
       variant: "secondary",
       onClick: () => selectBlock(originalBlockClientId),
       children: (0, _i18n.__)('Find original')
-    }, "find-original"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
+    }, "find-original"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button
+    // TODO: Switch to `true` (40px size) if possible
+    , {
+      __next40pxDefaultSize: false,
       variant: "secondary",
       onClick: () => onReplace([]),
       children: (0, _i18n.__)('Remove')

package/build/components/block-edit/multiple-usage-warning.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_blocks","require","_components","_data","_i18n","_store","_warning","_interopRequireDefault","_jsxRuntime","MultipleUsageWarning","originalBlockClientId","name","onReplace","selectBlock","useDispatch","blockEditorStore","blockType","getBlockType","jsxs","default","actions","jsx","Button","variant","onClick","children","__","title"],"sources":["@wordpress/block-editor/src/components/block-edit/multiple-usage-warning.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { getBlockType } from '@wordpress/blocks';\nimport { Button } from '@wordpress/components';\nimport { useDispatch } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport Warning from '../warning';\n\nexport function MultipleUsageWarning( {\n\toriginalBlockClientId,\n\tname,\n\tonReplace,\n} ) {\n\tconst { selectBlock } = useDispatch( blockEditorStore );\n\tconst blockType = getBlockType( name );\n\n\treturn (\n\t\t<Warning\n\t\t\tactions={ [\n\t\t\t\t<Button\n\t\t\t\t\tkey=\"find-original\"\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\tonClick={ () => selectBlock( originalBlockClientId ) }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Find original' ) }\n\t\t\t\t</Button>,\n\t\t\t\t<Button\n\t\t\t\t\tkey=\"remove\"\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\tonClick={ () => onReplace( [] ) }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Remove' ) }\n\t\t\t\t</Button>,\n\t\t\t] }\n\t\t>\n\t\t\t<strong>{ blockType?.title }: </strong>\n\t\t\t{ __( 'This block can only be used once.' ) }\n\t\t</Warning>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AAKA,IAAAI,MAAA,GAAAJ,OAAA;AACA,IAAAK,QAAA,GAAAC,sBAAA,CAAAN,OAAA;AAAiC,IAAAO,WAAA,GAAAP,OAAA;AAZjC;AACA;AACA;;AAMA;AACA;AACA;;AAIO,SAASQ,oBAAoBA,CAAE;EACrCC,qBAAqB;EACrBC,IAAI;EACJC;AACD,CAAC,EAAG;EACH,MAAM;IAAEC;EAAY,CAAC,GAAG,IAAAC,iBAAW,EAAEC,YAAiB,CAAC;EACvD,MAAMC,SAAS,GAAG,IAAAC,oBAAY,EAAEN,IAAK,CAAC;EAEtC,oBACC,IAAAH,WAAA,CAAAU,IAAA,EAACZ,QAAA,CAAAa,OAAO;IACPC,OAAO,EAAG,cACT,IAAAZ,WAAA,CAAAa,GAAA,EAACnB,WAAA,CAAAoB,~~MAAM~~;~~MAENC~~,OAAO,EAAC,WAAW;MACnBC,OAAO,EAAGA,CAAA,~~KAAMX~~,WAAW,CAAEH,qBAAsB,CAAG;~~MAAAe~~,QAAA,EAEpD,IAAAC,QAAE,EAAE,eAAgB;IAAC,GAJnB,eAKG,CAAC,eACT,~~IAAAlB~~,WAAA,CAAAa,GAAA,EAACnB,WAAA,CAAAoB,~~MAAM~~;~~MAENC~~,OAAO,EAAC,WAAW;MACnBC,OAAO,EAAGA,CAAA,~~KAAMZ~~,SAAS,CAAE,EAAG,CAAG;~~MAAAa~~,QAAA,EAE/B,IAAAC,QAAE,EAAE,QAAS;IAAC,GAJZ,QAKG,CAAC,CACP;IAAAD,QAAA,gBAEH,~~IAAAjB~~,WAAA,CAAAU,IAAA;~~MAAAO~~,QAAA,~~GAAUT~~,SAAS,~~EAAEW~~,KAAK,EAAE,IAAE;IAAA,CAAQ,CAAC,EACrC,IAAAD,QAAE,EAAE,mCAAoC,CAAC;EAAA,CACnC,CAAC;AAEZ","ignoreList":[]}
1	+ {"version":3,"names":["_blocks","require","_components","_data","_i18n","_store","_warning","_interopRequireDefault","_jsxRuntime","MultipleUsageWarning","originalBlockClientId","name","onReplace","selectBlock","useDispatch","blockEditorStore","blockType","getBlockType","jsxs","default","actions","jsx","Button","__next40pxDefaultSize","variant","onClick","children","__","title"],"sources":["@wordpress/block-editor/src/components/block-edit/multiple-usage-warning.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { getBlockType } from '@wordpress/blocks';\nimport { Button } from '@wordpress/components';\nimport { useDispatch } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport Warning from '../warning';\n\nexport function MultipleUsageWarning( {\n\toriginalBlockClientId,\n\tname,\n\tonReplace,\n} ) {\n\tconst { selectBlock } = useDispatch( blockEditorStore );\n\tconst blockType = getBlockType( name );\n\n\treturn (\n\t\t<Warning\n\t\t\tactions={ [\n\t\t\t\t<Button\n\t\t\t\t\t// TODO: Switch to `true` (40px size) if possible\n\t\t\t\t\t__next40pxDefaultSize={ false }\n\t\t\t\t\tkey=\"find-original\"\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\tonClick={ () => selectBlock( originalBlockClientId ) }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Find original' ) }\n\t\t\t\t</Button>,\n\t\t\t\t<Button\n\t\t\t\t\t// TODO: Switch to `true` (40px size) if possible\n\t\t\t\t\t__next40pxDefaultSize={ false }\n\t\t\t\t\tkey=\"remove\"\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\tonClick={ () => onReplace( [] ) }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Remove' ) }\n\t\t\t\t</Button>,\n\t\t\t] }\n\t\t>\n\t\t\t<strong>{ blockType?.title }: </strong>\n\t\t\t{ __( 'This block can only be used once.' ) }\n\t\t</Warning>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AAKA,IAAAI,MAAA,GAAAJ,OAAA;AACA,IAAAK,QAAA,GAAAC,sBAAA,CAAAN,OAAA;AAAiC,IAAAO,WAAA,GAAAP,OAAA;AAZjC;AACA;AACA;;AAMA;AACA;AACA;;AAIO,SAASQ,oBAAoBA,CAAE;EACrCC,qBAAqB;EACrBC,IAAI;EACJC;AACD,CAAC,EAAG;EACH,MAAM;IAAEC;EAAY,CAAC,GAAG,IAAAC,iBAAW,EAAEC,YAAiB,CAAC;EACvD,MAAMC,SAAS,GAAG,IAAAC,oBAAY,EAAEN,IAAK,CAAC;EAEtC,oBACC,IAAAH,WAAA,CAAAU,IAAA,EAACZ,QAAA,CAAAa,OAAO;IACPC,OAAO,EAAG,cACT,IAAAZ,WAAA,CAAAa,GAAA,EAACnB,WAAA,CAAAoB;IACA;IAAA;MACAC,qBAAqB,EAAG,KAAO;MAE/BC,OAAO,EAAC,WAAW;MACnBC,OAAO,EAAGA,CAAA,KAAMZ,WAAW,CAAEH,qBAAsB,CAAG;MAAAgB,QAAA,EAEpD,IAAAC,QAAE,EAAE,eAAgB;IAAC,GAJnB,eAKG,CAAC,eACT,IAAAnB,WAAA,CAAAa,GAAA,EAACnB,WAAA,CAAAoB;IACA;IAAA;MACAC,qBAAqB,EAAG,KAAO;MAE/BC,OAAO,EAAC,WAAW;MACnBC,OAAO,EAAGA,CAAA,KAAMb,SAAS,CAAE,EAAG,CAAG;MAAAc,QAAA,EAE/B,IAAAC,QAAE,EAAE,QAAS;IAAC,GAJZ,QAKG,CAAC,CACP;IAAAD,QAAA,gBAEH,IAAAlB,WAAA,CAAAU,IAAA;MAAAQ,QAAA,GAAUV,SAAS,EAAEY,KAAK,EAAE,IAAE;IAAA,CAAQ,CAAC,EACrC,IAAAD,QAAE,EAAE,mCAAoC,CAAC;EAAA,CACnC,CAAC;AAEZ","ignoreList":[]}

package/build/components/block-inspector/index.js CHANGED Viewed

@@ -35,6 +35,16 @@ var _jsxRuntime = require("react/jsx-runtime");
  * Internal dependencies
  */
+function BlockStylesPanel({
+  clientId
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.PanelBody, {
+    title: (0, _i18n.__)('Styles'),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockStyles.default, {
+      clientId: clientId
+    })
+  });
+}
 function BlockInspectorLockedBlocks({
   topLevelLockedBlock
 }) {
@@ -46,6 +56,15 @@ function BlockInspectorLockedBlocks({
     } = select(_store.store);
     return getClientIdsOfDescendants(topLevelLockedBlock).filter(clientId => getBlockName(clientId) !== 'core/list-item' && getBlockEditingMode(clientId) === 'contentOnly');
   }, [topLevelLockedBlock]);
+  const hasBlockStyles = (0, _data.useSelect)(select => {
+    const {
+      getBlockName
+    } = select(_store.store);
+    const {
+      getBlockStyles
+    } = select(_blocks.store);
+    return !!getBlockStyles(getBlockName(topLevelLockedBlock))?.length;
+  }, [topLevelLockedBlock]);
   const blockInformation = (0, _useBlockDisplayInformation.default)(topLevelLockedBlock);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "block-editor-block-inspector",
@@ -54,7 +73,9 @@ function BlockInspectorLockedBlocks({
       className: blockInformation.isSynced && 'is-synced'
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockVariationTransforms.default, {
       blockClientId: topLevelLockedBlock
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockInfoSlotFill.default.Slot, {}), contentClientIds.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.PanelBody, {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockInfoSlotFill.default.Slot, {}), hasBlockStyles && /*#__PURE__*/(0, _jsxRuntime.jsx)(BlockStylesPanel, {
+      clientId: topLevelLockedBlock
+    }), contentClientIds.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.PanelBody, {
       title: (0, _i18n.__)('Content'),
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockQuickNavigation.default, {
         clientIds: contentClientIds
@@ -223,13 +244,8 @@ const BlockInspectorSingleBlock = ({
       blockName: blockName,
       tabs: availableTabs
     }), !showTabs && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [hasBlockStyles && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.PanelBody, {
-          title: (0, _i18n.__)('Styles'),
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockStyles.default, {
-            clientId: clientId
-          })
-        })
+      children: [hasBlockStyles && /*#__PURE__*/(0, _jsxRuntime.jsx)(BlockStylesPanel, {
+        clientId: clientId
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
         group: "list"
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
@@ -250,7 +266,9 @@ const BlockInspectorSingleBlock = ({
         label: borderPanelLabel
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
         group: "styles"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_positionControlsPanel.default, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_positionControlsPanel.default, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
+        group: "bindings"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_advancedControlsPanel.default, {})
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_skipToSelectedBlock.default, {}, "back")]