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/build/utils/transform-styles/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_postcss","_interopRequireWildcard","require","_postcssPrefixwrap","_interopRequireDefault","_postcssUrlrebase","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","cacheByWrapperSelector","Map","transformStyle","css","ignoredSelectors","baseURL","wrapperSelector","postcssFriendlyCSS","replace","postcss","wrap","rebaseUrl","rootUrl","filter","Boolean","process","error","CssSyntaxError","console","warn","message","showSourceCode","transformStyles","styles","cache","map","style","_default","exports"],"sources":["@wordpress/block-editor/src/utils/transform-styles/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport postcss, { CssSyntaxError } from 'postcss';\nimport wrap from 'postcss-prefixwrap';\nimport rebaseUrl from 'postcss-urlrebase';\n\nconst cacheByWrapperSelector = new Map();\n\nfunction transformStyle(\n\t{ css, ignoredSelectors = [], baseURL },\n\twrapperSelector = ''\n) {\n\t// When there is no wrapper selector or base URL, there is no need\n\t// to transform the CSS. This is most cases because in the default\n\t// iframed editor, no wrapping is needed, and not many styles\n\t// provide a base URL.\n\tif ( ! wrapperSelector && ! baseURL ) {\n\t\treturn css;\n\t}\n\tconst postcssFriendlyCSS = css\n\t\t.replace( /:root :where\$body\$/g, 'body' )\n\t\t.replace( /:where\$body\$/g, 'body' );\n\ttry {\n\t\treturn postcss(\n\t\t\t[\n\t\t\t\twrapperSelector &&\n\t\t\t\t\twrap( wrapperSelector, {\n\t\t\t\t\t\tignoredSelectors: [\n\t\t\t\t\t\t\t...ignoredSelectors,\n\t\t\t\t\t\t\twrapperSelector,\n\t\t\t\t\t\t],\n\t\t\t\t\t} ),\n\t\t\t\tbaseURL && rebaseUrl( { rootUrl: baseURL } ),\n\t\t\t].filter( Boolean )\n\t\t).process( postcssFriendlyCSS, {} ).css; // use sync PostCSS API\n\t} catch ( error ) {\n\t\tif ( error instanceof CssSyntaxError ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t'wp.blockEditor.transformStyles Failed to transform CSS.',\n\t\t\t\terror.message + '\\n' + error.showSourceCode( false )\n\t\t\t);\n\t\t} else {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t'wp.blockEditor.transformStyles Failed to transform CSS.',\n\t\t\t\terror\n\t\t\t);\n\t\t}\n\n\t\treturn null;\n\t}\n}\n\n/\n Applies a series of CSS rule transforms to wrap selectors inside a given class and/or rewrite URLs depending on the parameters passed.\n \n @typedef {Object} EditorStyle\n * @property {string} css the CSS block(s), as a single string.\n * @property {?string} baseURL the base URL to be used as the reference when rewritting urls.\n * @property {?string[]} ignoredSelectors the selectors not to wrap.\n \n @param {EditorStyle[]} styles CSS rules.\n * @param {string} wrapperSelector Wrapper selector.\n * @return {Array} converted rules.\n */\nconst transformStyles = ( styles, wrapperSelector = '' ) => {\n\tlet cache = cacheByWrapperSelector.get( wrapperSelector );\n\tif ( ! cache ) {\n\t\tcache = new WeakMap();\n\t\tcacheByWrapperSelector.set( wrapperSelector, cache );\n\t}\n\treturn styles.map( ( style ) => {\n\t\tlet css = cache.get( style );\n\t\tif ( ! css ) {\n\t\t\tcss = transformStyle( style, wrapperSelector );\n\t\t\tcache.set( style, css );\n\t\t}\n\t\treturn css;\n\t} );\n};\n\nexport default transformStyles;\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,kBAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,iBAAA,GAAAD,sBAAA,CAAAF,OAAA;AAA0C,SAAAI,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAN,wBAAAM,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAL1C;AACA;AACA;;AAKA,MAAMW,sBAAsB,GAAG,IAAIC,GAAG,CAAC,CAAC;AAExC,SAASC,cAAcA,CACtB;EAAEC,GAAG;EAAEC,gBAAgB,GAAG,EAAE;EAAEC;AAAQ,CAAC,EACvCC,eAAe,GAAG,EAAE,EACnB;EACD;EACA;EACA;EACA;EACA,IAAK,CAAEA,eAAe,IAAI,CAAED,OAAO,EAAG;IACrC,OAAOF,GAAG;EACX;EACA,MAAMI,kBAAkB,GAAGJ,GAAG,CAC5BK,OAAO,CAAE,uBAAuB,EAAE,MAAO,CAAC,CAC1CA,OAAO,CAAE,iBAAiB,EAAE,MAAO,CAAC;EACtC,IAAI;IACH,OAAO,IAAAC,gBAAO,EACb,CACCH,eAAe,IACd,IAAAI,0BAAI,EAAEJ,eAAe,EAAE;MACtBF,gBAAgB,EAAE,CACjB,GAAGA,gBAAgB,EACnBE,eAAe;IAEjB,CAAE,CAAC,EACJD,OAAO,IAAI,IAAAM,yBAAS,EAAE;MAAEC,OAAO,EAAEP;IAAQ,CAAE,CAAC,CAC5C,CAACQ,MAAM,CAAEC,OAAQ,CACnB,CAAC,CAACC,OAAO,CAAER,kBAAkB,EAAE,CAAC,CAAE,CAAC,CAACJ,GAAG,CAAC,CAAC;EAC1C,CAAC,CAAC,OAAQa,KAAK,EAAG;IACjB,IAAKA,KAAK,YAAYC,uBAAc,EAAG;MACtC;MACAC,OAAO,CAACC,IAAI,CACX,yDAAyD,EACzDH,KAAK,CAACI,OAAO,GAAG,IAAI,GAAGJ,KAAK,CAACK,cAAc,CAAE,KAAM,CACpD,CAAC;IACF,CAAC,MAAM;MACN;MACAH,OAAO,CAACC,IAAI,CACX,yDAAyD,EACzDH,KACD,CAAC;IACF;IAEA,OAAO,IAAI;EACZ;AACD;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMM,eAAe,GAAGA,CAAEC,MAAM,EAAEjB,eAAe,GAAG,EAAE,KAAM;EAC3D,IAAIkB,KAAK,GAAGxB,sBAAsB,CAACZ,GAAG,CAAEkB,eAAgB,CAAC;EACzD,IAAK,CAAEkB,KAAK,EAAG;IACdA,KAAK,GAAG,IAAI1C,OAAO,CAAC,CAAC;IACrBkB,sBAAsB,CAACD,GAAG,CAAEO,eAAe,EAAEkB,KAAM,CAAC;EACrD;EACA,OAAOD,MAAM,CAACE,GAAG,CAAIC,KAAK,IAAM;IAC/B,IAAIvB,GAAG,GAAGqB,KAAK,CAACpC,GAAG,CAAEsC,KAAM,CAAC;IAC5B,IAAK,CAAEvB,GAAG,EAAG;MACZA,GAAG,GAAGD,cAAc,CAAEwB,KAAK,EAAEpB,eAAgB,CAAC;MAC9CkB,KAAK,CAACzB,GAAG,CAAE2B,KAAK,EAAEvB,GAAI,CAAC;IACxB;IACA,OAAOA,GAAG;EACX,CAAE,CAAC;AACJ,CAAC;AAAC,IAAAwB,QAAA,GAAAC,OAAA,CAAA1C,OAAA,GAEaoC,eAAe","ignoreList":[]}
1	+ {"version":3,"names":["parsel","_interopRequireWildcard","require","_postcss","_postcssPrefixSelector","_interopRequireDefault","_postcssUrlrebase","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","cacheByWrapperSelector","Map","ROOT_SELECTOR_TOKENS","type","content","prefixRootSelector","prefix","selector","tokenized","tokenize","lastRootIndex","findLastIndex","some","rootSelector","insertionPoint","length","tokenizedPrefix","splice","stringify","transformStyle","css","ignoredSelectors","baseURL","wrapperSelector","transformOptions","_transformOptions$ign","excludedSelectors","postcss","prefixSelector","transform","prefixedSelector","excludedSelector","RegExp","match","includes","hasRootSelector","startsWith","rebaseUrl","rootUrl","filter","Boolean","process","error","CssSyntaxError","console","warn","message","showSourceCode","transformStyles","styles","cache","map","style","_default","exports"],"sources":["@wordpress/block-editor/src/utils/transform-styles/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport as parsel from 'parsel-js';\nimport postcss, { CssSyntaxError } from 'postcss';\nimport prefixSelector from 'postcss-prefix-selector';\nimport rebaseUrl from 'postcss-urlrebase';\n\nconst cacheByWrapperSelector = new Map();\n\nconst ROOT_SELECTOR_TOKENS = [\n\t{ type: 'type', content: 'body' },\n\t{ type: 'type', content: 'html' },\n\t{ type: 'pseudo-class', content: ':root' },\n\t{ type: 'pseudo-class', content: ':where(body)' },\n\t{ type: 'pseudo-class', content: ':where(:root)' },\n\t{ type: 'pseudo-class', content: ':where(html)' },\n];\n\n/*\n Prefixes root selectors in a way that ensures consistent specificity.\n * This requires special handling, since prefixing a classname before\n * html, body, or :root will generally result in an invalid selector.\n \n Some libraries will simply replace the root selector with the prefix\n * instead, but this results in inconsistent specificity.\n \n This function instead inserts the prefix after the root tags but before\n * any other part of the selector. This results in consistent specificity:\n * - If a `:where()` selector is used for the prefix, all selectors output\n * by `transformStyles` will have no specificity increase.\n * - If a classname, id, or something else is used as the prefix, all selectors\n * will have the same specificity bump when transformed.\n \n @param {string} prefix The prefix.\n * @param {string} selector The selector.\n \n @return {string} The prefixed root selector.\n /\nfunction prefixRootSelector( prefix, selector ) {\n\t// Use a tokenizer, since regular expressions are unreliable.\n\tconst tokenized = parsel.tokenize( selector );\n\n\t// Find the last token that contains a root selector by walking back\n\t// through the tokens.\n\tconst lastRootIndex = tokenized.findLastIndex( ( { content, type } ) => {\n\t\treturn ROOT_SELECTOR_TOKENS.some(\n\t\t\t( rootSelector ) =>\n\t\t\t\tcontent === rootSelector.content && type === rootSelector.type\n\t\t);\n\t} );\n\n\t// Walk forwards to find the combinator after the last root.\n\t// This is where the root ends and the rest of the selector begins,\n\t// and the index to insert before.\n\t// Doing it this way takes into account that a root selector like\n\t// 'body' may have additional id/class/pseudo-class/attribute-selector\n\t// parts chained to it, which is difficult to quantify using a regex.\n\tlet insertionPoint = -1;\n\tfor ( let i = lastRootIndex + 1; i < tokenized.length; i++ ) {\n\t\tif ( tokenized[ i ].type === 'combinator' ) {\n\t\t\tinsertionPoint = i;\n\t\t\tbreak;\n\t\t}\n\t}\n\n\t// Tokenize and insert the prefix with a ' ' combinator before it.\n\tconst tokenizedPrefix = parsel.tokenize( prefix );\n\ttokenized.splice(\n\t\t// Insert at the insertion point, or the end.\n\t\tinsertionPoint === -1 ? tokenized.length : insertionPoint,\n\t\t0,\n\t\t{\n\t\t\ttype: 'combinator',\n\t\t\tcontent: ' ',\n\t\t},\n\t\t...tokenizedPrefix\n\t);\n\n\treturn parsel.stringify( tokenized );\n}\n\nfunction transformStyle(\n\t{ css, ignoredSelectors = [], baseURL },\n\twrapperSelector = '',\n\ttransformOptions\n) {\n\t// When there is no wrapper selector and no base URL, there is no need\n\t// to transform the CSS. This is most cases because in the default\n\t// iframed editor, no wrapping is needed, and not many styles\n\t// provide a base URL.\n\tif ( ! wrapperSelector && ! baseURL ) {\n\t\treturn css;\n\t}\n\n\ttry {\n\t\tconst excludedSelectors = [\n\t\t\t...ignoredSelectors,\n\t\t\t...( transformOptions?.ignoredSelectors ?? [] ),\n\t\t\twrapperSelector,\n\t\t];\n\n\t\treturn postcss(\n\t\t\t[\n\t\t\t\twrapperSelector &&\n\t\t\t\t\tprefixSelector( {\n\t\t\t\t\t\tprefix: wrapperSelector,\n\t\t\t\t\t\ttransform( prefix, selector, prefixedSelector ) {\n\t\t\t\t\t\t\t// For backwards compatibility, don't use the `exclude` option\n\t\t\t\t\t\t\t// of postcss-prefix-selector, instead handle it here to match\n\t\t\t\t\t\t\t// the behavior of the old library (postcss-prefix-wrap) that\n\t\t\t\t\t\t\t// `transformStyle` previously used.\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\texcludedSelectors.some( ( excludedSelector ) =>\n\t\t\t\t\t\t\t\t\texcludedSelector instanceof RegExp\n\t\t\t\t\t\t\t\t\t\t? selector.match( excludedSelector )\n\t\t\t\t\t\t\t\t\t\t: selector.includes( excludedSelector )\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\treturn selector;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tconst hasRootSelector = ROOT_SELECTOR_TOKENS.some(\n\t\t\t\t\t\t\t\t( rootSelector ) =>\n\t\t\t\t\t\t\t\t\tselector.startsWith( rootSelector.content )\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t// Reorganize root selectors such that the root part comes before the prefix,\n\t\t\t\t\t\t\t// but the prefix still comes before the remaining part of the selector.\n\t\t\t\t\t\t\tif ( hasRootSelector ) {\n\t\t\t\t\t\t\t\treturn prefixRootSelector( prefix, selector );\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn prefixedSelector;\n\t\t\t\t\t\t},\n\t\t\t\t\t} ),\n\t\t\t\tbaseURL && rebaseUrl( { rootUrl: baseURL } ),\n\t\t\t].filter( Boolean )\n\t\t).process( css, {} ).css; // use sync PostCSS API\n\t} catch ( error ) {\n\t\tif ( error instanceof CssSyntaxError ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t'wp.blockEditor.transformStyles Failed to transform CSS.',\n\t\t\t\terror.message + '\\n' + error.showSourceCode( false )\n\t\t\t);\n\t\t} else {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t'wp.blockEditor.transformStyles Failed to transform CSS.',\n\t\t\t\terror\n\t\t\t);\n\t\t}\n\n\t\treturn null;\n\t}\n}\n\n/\n @typedef {Object} EditorStyle\n * @property {string} css the CSS block(s), as a single string.\n * @property {?string} baseURL the base URL to be used as the reference when rewritting urls.\n * @property {?string[]} ignoredSelectors the selectors not to wrap.\n /\n\n/\n @typedef {Object} TransformOptions\n * @property {?string[]} ignoredSelectors the selectors not to wrap.\n /\n\n/\n Applies a series of CSS rule transforms to wrap selectors inside a given class and/or rewrite URLs depending on the parameters passed.\n \n @param {EditorStyle[]} styles CSS rules.\n * @param {string} wrapperSelector Wrapper selector.\n * @param {TransformOptions} transformOptions Additional options for style transformation.\n * @return {Array} converted rules.\n */\nconst transformStyles = ( styles, wrapperSelector = '', transformOptions ) => {\n\tlet cache = cacheByWrapperSelector.get( wrapperSelector );\n\tif ( ! cache ) {\n\t\tcache = new WeakMap();\n\t\tcacheByWrapperSelector.set( wrapperSelector, cache );\n\t}\n\treturn styles.map( ( style ) => {\n\t\tlet css = cache.get( style );\n\t\tif ( ! css ) {\n\t\t\tcss = transformStyle( style, wrapperSelector, transformOptions );\n\t\t\tcache.set( style, css );\n\t\t}\n\t\treturn css;\n\t} );\n};\n\nexport default transformStyles;\n"],"mappings":"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","ignoreList":[]}

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

@@ -3,7 +3,7 @@
  */
 import { __ } from '@wordpress/i18n';
 import { DOWN } from '@wordpress/keycodes';
-import { ToolbarButton, Dropdown, __experimentalAlignmentMatrixControl as AlignmentMatrixControl } from '@wordpress/components';
+import { ToolbarButton, Dropdown, AlignmentMatrixControl } from '@wordpress/components';
 import { jsx as _jsx } from "react/jsx-runtime";
 const noop = () => {};
 function BlockAlignmentMatrixControl(props) {

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

	@@ -1 +1 @@
1	- {"version":3,"names":["__","DOWN","ToolbarButton","Dropdown","~~__experimentalAlignmentMatrixControl","~~AlignmentMatrixControl","jsx","_jsx","noop","BlockAlignmentMatrixControl","props","label","onChange","value","isDisabled","icon","Icon","popoverProps","placement","renderToggle","onToggle","isOpen","openOnArrowDown","event","keyCode","preventDefault","onClick","onKeyDown","showTooltip","disabled","renderContent","hasFocusBorder"],"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":"AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,IAAI,QAAQ,qBAAqB;AAC1C,SACCC,aAAa,EACbC,QAAQ,EACRC,~~oCAAoC,IAAIC,~~sBAAsB,~~QACxD~~,uBAAuB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE/B,MAAMC,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AAErB,SAASC,2BAA2BA,CAAEC,KAAK,EAAG;EAC7C,MAAM;IACLC,KAAK,~~GAAGX~~,EAAE,CAAE,yBAA0B,CAAC;~~IACvCY~~,QAAQ,GAAGJ,IAAI;IACfK,KAAK,GAAG,QAAQ;IAChBC;EACD,CAAC,GAAGJ,KAAK;EAET,MAAMK,IAAI,gBAAGR,IAAA,CAACF,sBAAsB,CAACW,IAAI;IAACH,KAAK,EAAGA;EAAO,CAAE,CAAC;EAE5D,oBACCN,IAAA,~~CAACJ~~,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,~~KAAKvB~~,IAAI,EAAG;~~UACzCsB~~,KAAK,CAACE,cAAc,CAAC,CAAC;UACtBL,QAAQ,CAAC,CAAC;QACX;MACD,CAAC;MAED,oBACCb,IAAA,~~CAACL~~,aAAa;~~QACbwB~~,OAAO,EAAGN,QAAU;QACpB,iBAAc,MAAM;QACpB,iBAAgBC,MAAQ;QACxBM,SAAS,EAAGL,eAAiB;QAC7BX,KAAK,EAAGA,KAAO;QACfI,IAAI,EAAGA,IAAM;QACba,WAAW;QACXC,QAAQ,EAAGf;MAAY,CACvB,CAAC;IAEJ,CAAG;IACHgB,aAAa,EAAGA,CAAA,kBACfvB,IAAA,CAACF,sBAAsB;MACtB0B,cAAc,EAAG,KAAO;MACxBnB,QAAQ,EAAGA,QAAU;MACrBC,KAAK,EAAGA;IAAO,CACf;EACC,CACH,CAAC;AAEJ;AAEA,eAAeJ,2BAA2B","ignoreList":[]}
1	+ {"version":3,"names":["__","DOWN","ToolbarButton","Dropdown","AlignmentMatrixControl","jsx","_jsx","noop","BlockAlignmentMatrixControl","props","label","onChange","value","isDisabled","icon","Icon","popoverProps","placement","renderToggle","onToggle","isOpen","openOnArrowDown","event","keyCode","preventDefault","onClick","onKeyDown","showTooltip","disabled","renderContent","hasFocusBorder"],"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":"AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,IAAI,QAAQ,qBAAqB;AAC1C,SACCC,aAAa,EACbC,QAAQ,EACRC,sBAAsB,QAChB,uBAAuB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE/B,MAAMC,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AAErB,SAASC,2BAA2BA,CAAEC,KAAK,EAAG;EAC7C,MAAM;IACLC,KAAK,GAAGV,EAAE,CAAE,yBAA0B,CAAC;IACvCW,QAAQ,GAAGJ,IAAI;IACfK,KAAK,GAAG,QAAQ;IAChBC;EACD,CAAC,GAAGJ,KAAK;EAET,MAAMK,IAAI,gBAAGR,IAAA,CAACF,sBAAsB,CAACW,IAAI;IAACH,KAAK,EAAGA;EAAO,CAAE,CAAC;EAE5D,oBACCN,IAAA,CAACH,QAAQ;IACRa,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,KAAKtB,IAAI,EAAG;UACzCqB,KAAK,CAACE,cAAc,CAAC,CAAC;UACtBL,QAAQ,CAAC,CAAC;QACX;MACD,CAAC;MAED,oBACCb,IAAA,CAACJ,aAAa;QACbuB,OAAO,EAAGN,QAAU;QACpB,iBAAc,MAAM;QACpB,iBAAgBC,MAAQ;QACxBM,SAAS,EAAGL,eAAiB;QAC7BX,KAAK,EAAGA,KAAO;QACfI,IAAI,EAAGA,IAAM;QACba,WAAW;QACXC,QAAQ,EAAGf;MAAY,CACvB,CAAC;IAEJ,CAAG;IACHgB,aAAa,EAAGA,CAAA,kBACfvB,IAAA,CAACF,sBAAsB;MACtB0B,cAAc,EAAG,KAAO;MACxBnB,QAAQ,EAAGA,QAAU;MACrBC,KAAK,EAAGA;IAAO,CACf;EACC,CACH,CAAC;AAEJ;AAEA,eAAeJ,2BAA2B","ignoreList":[]}

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

@@ -68,7 +68,10 @@ function BlockBreadcrumb({
     children: [/*#__PURE__*/_jsxs("li", {
       className: !hasSelection ? 'block-editor-block-breadcrumb__current' : undefined,
       "aria-current": !hasSelection ? 'true' : undefined,
-      children: [hasSelection && /*#__PURE__*/_jsx(Button, {
+      children: [hasSelection && /*#__PURE__*/_jsx(Button
+      // TODO: Switch to `true` (40px size) if possible
+      , {
+        __next40pxDefaultSize: false,
         className: "block-editor-block-breadcrumb__button",
         variant: "tertiary",
         onClick: () => {
@@ -83,7 +86,10 @@ function BlockBreadcrumb({
         className: "block-editor-block-breadcrumb__separator"
       })]
     }), parents.map(parentClientId => /*#__PURE__*/_jsxs("li", {
-      children: [/*#__PURE__*/_jsx(Button, {
+      children: [/*#__PURE__*/_jsx(Button
+      // TODO: Switch to `true` (40px size) if possible
+      , {
+        __next40pxDefaultSize: false,
         className: "block-editor-block-breadcrumb__button",
         variant: "tertiary",
         onClick: () => selectBlock(parentClientId),

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

	@@ -1 +1 @@
1	- {"version":3,"names":["Button","useSelect","useDispatch","__","chevronRightSmall","Icon","useRef","BlockTitle","store","blockEditorStore","unlock","useBlockElementRef","getEditorRegion","jsx","_jsx","jsxs","_jsxs","BlockBreadcrumb","rootLabelText","selectBlock","clearSelectedBlock","clientId","parents","hasSelection","select","getSelectionStart","getSelectedBlockClientId","getEnabledBlockParents","selectedBlockClientId","rootLabel","blockRef","className","role","children","undefined","variant","onClick","blockEditor","current","closest","focus","icon","map","parentClientId","maximumLength"],"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":"AAAA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,SAAS,EAAEC,WAAW,QAAQ,iBAAiB;AACxD,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,iBAAiB,EAAEC,IAAI,QAAQ,kBAAkB;AAC1D,SAASC,MAAM,QAAQ,oBAAoB;;AAE3C;AACA;AACA;AACA,OAAOC,UAAU,MAAM,gBAAgB;AACvC,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,aAAa;AACvD,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,kBAAkB,QAAQ,8CAA8C;AACjF,OAAOC,eAAe,MAAM,+BAA+B;;AAE3D;AACA;AACA;AACA;AACA;AACA;AACA;AANA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAOA,SAASC,eAAeA,CAAE;EAAEC;AAAc,CAAC,EAAG;EAC7C,MAAM;IAAEC,WAAW;IAAEC;EAAmB,CAAC,GAAGlB,WAAW,CAAEO,gBAAiB,CAAC;EAC3E,MAAM;IAAEY,QAAQ;IAAEC,OAAO;IAAEC;EAAa,CAAC,GAAGtB,SAAS,CAAIuB,MAAM,IAAM;IACpE,MAAM;MACLC,iBAAiB;MACjBC,wBAAwB;MACxBC;IACD,CAAC,GAAGjB,MAAM,CAAEc,MAAM,CAAEf,gBAAiB,CAAE,CAAC;IACxC,MAAMmB,qBAAqB,GAAGF,wBAAwB,CAAC,CAAC;IACxD,OAAO;MACNJ,OAAO,EAAEK,sBAAsB,CAAEC,qBAAsB,CAAC;MACxDP,QAAQ,EAAEO,qBAAqB;MAC/BL,YAAY,EAAE,CAAC,CAAEE,iBAAiB,CAAC,CAAC,CAACJ;IACtC,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EACP,MAAMQ,SAAS,GAAGX,aAAa,IAAIf,EAAE,CAAE,UAAW,CAAC;;EAEnD;EACA;EACA,MAAM2B,QAAQ,GAAGxB,MAAM,CAAC,CAAC;EACzBK,kBAAkB,CAAEU,QAAQ,EAAES,QAAS,CAAC;;EAExC;AACD;AACA;AACA;EACC;EACA,oBACCd,KAAA;IACCe,SAAS,EAAC,+BAA+B;IACzCC,IAAI,EAAC,MAAM;IACX,cAAa7B,EAAE,CAAE,kBAAmB,CAAG;IAAA8B,QAAA,gBAEvCjB,KAAA;MACCe,SAAS,EACR,CAAER,YAAY,GACX,wCAAwC,GACxCW,SACH;MACD,gBAAe,CAAEX,YAAY,GAAG,MAAM,GAAGW,SAAW;MAAAD,QAAA,GAElDV,YAAY,iBACbT,IAAA,CAACd,~~MAAM~~;~~QACN+B~~,SAAS,EAAC,uCAAuC;~~QACjDI~~,OAAO,EAAC,UAAU;QAClBC,OAAO,EAAGA,CAAA,KAAM;UACf;UACA,MAAMC,WAAW,~~GAAGP~~,QAAQ,~~CAACQ~~,OAAO,EAAEC,OAAO,CAC5C,wBACD,CAAC;~~UAEDnB~~,kBAAkB,CAAC,CAAC;UAEpBR,eAAe,~~CAAEyB~~,WAAY,CAAC,EAAEG,KAAK,CAAC,CAAC;QACxC,CAAG;~~QAAAP~~,QAAA,EAEDJ;MAAS,CACJ,CACR,EACC,CAAEN,YAAY,IAAIM,SAAS,EAC3B,CAAC,CAAER,QAAQ,iBACZP,IAAA,CAACT,IAAI;~~QACJoC~~,IAAI,~~EAAGrC~~,iBAAmB;QAC1B2B,SAAS,EAAC;MAA0C,CACpD,CACD;IAAA,CACE,CAAC,EAEHT,OAAO,~~CAACoB~~,GAAG,CAAIC,cAAc,~~iBAC9B3B~~,KAAA;MAAAiB,QAAA,gBACCnB,IAAA,CAACd,~~MAAM~~;~~QACN+B~~,SAAS,EAAC,uCAAuC;~~QACjDI~~,OAAO,EAAC,UAAU;QAClBC,OAAO,EAAGA,CAAA,~~KAAMjB~~,WAAW,~~CAAEwB~~,cAAe,CAAG;~~QAAAV~~,QAAA,eAE/CnB,IAAA,CAACP,UAAU;UACVc,QAAQ,~~EAAGsB~~,cAAgB;UAC3BC,aAAa,EAAG;QAAI,CACpB;MAAC,CACK,CAAC,~~eACT9B~~,IAAA,CAACT,IAAI;~~QACJoC~~,IAAI,~~EAAGrC~~,iBAAmB;QAC1B2B,SAAS,EAAC;MAA0C,CACpD,CAAC;IAAA,~~GAdOY~~,~~cAeN~~,CACH,CAAC,EACD,CAAC,~~CAAEtB~~,QAAQ,iBACZP,IAAA;MACCiB,SAAS,EAAC,wCAAwC;MAClD,gBAAa,MAAM;MAAAE,QAAA,eAEnBnB,IAAA,CAACP,UAAU;QAACc,QAAQ,EAAGA,QAAU;~~QAACuB~~,aAAa,EAAG;MAAI,CAAE;IAAC,CACtD,CACJ;EAAA,CACE;EACJ;AAEF;AAEA,~~eAAe3B~~,eAAe","ignoreList":[]}
1	+ {"version":3,"names":["Button","useSelect","useDispatch","__","chevronRightSmall","Icon","useRef","BlockTitle","store","blockEditorStore","unlock","useBlockElementRef","getEditorRegion","jsx","_jsx","jsxs","_jsxs","BlockBreadcrumb","rootLabelText","selectBlock","clearSelectedBlock","clientId","parents","hasSelection","select","getSelectionStart","getSelectedBlockClientId","getEnabledBlockParents","selectedBlockClientId","rootLabel","blockRef","className","role","children","undefined","__next40pxDefaultSize","variant","onClick","blockEditor","current","closest","focus","icon","map","parentClientId","maximumLength"],"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-module/components/block-canvas/index.js CHANGED Viewed

@@ -15,8 +15,15 @@ import WritingFlow from '../writing-flow';
 import { useMouseMoveTypingReset } from '../observe-typing';
 import { useBlockSelectionClearer } from '../block-selection-clearer';
 import { useBlockCommands } from '../use-block-commands';
+// EditorStyles is a memoized component, so avoid passing a new
+// object reference on each render.
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
+const EDITOR_STYLE_TRANSFORM_OPTIONS = {
+  // Don't transform selectors that already specify `.editor-styles-wrapper`.
+  ignoredSelectors: [/\.editor-styles-wrapper/gi]
+};
 export function ExperimentalBlockCanvas({
   shouldIframe = true,
   height = '300px',
@@ -39,7 +46,8 @@ export function ExperimentalBlockCanvas({
       },
       children: [/*#__PURE__*/_jsx(EditorStyles, {
         styles: styles,
-        scope: ".editor-styles-wrapper"
+        scope: ":where(.editor-styles-wrapper)",
+        transformOptions: EDITOR_STYLE_TRANSFORM_OPTIONS
       }), /*#__PURE__*/_jsx(WritingFlow, {
         ref: contentRef,
         className: "editor-styles-wrapper",

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

	@@ -1 +1 @@
1	- {"version":3,"names":["useMergeRefs","useRef","BlockList","BlockTools","EditorStyles","Iframe","WritingFlow","useMouseMoveTypingReset","useBlockSelectionClearer","useBlockCommands","jsx","_jsx","jsxs","_jsxs","ExperimentalBlockCanvas","shouldIframe","height","children","styles","contentRef","contentRefProp","iframeProps","resetTypingRef","clearerRef","localRef","__unstableContentRef","style","display","scope","ref","className","tabIndex","width","name","BlockCanvas"],"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":"AAAA;AACA;AACA;AACA,SAASA,YAAY,QAAQ,oBAAoB;AACjD,SAASC,MAAM,QAAQ,oBAAoB;;AAE3C;AACA;AACA;AACA,OAAOC,SAAS,MAAM,eAAe;AACrC,OAAOC,UAAU,MAAM,gBAAgB;AACvC,OAAOC,YAAY,MAAM,kBAAkB;AAC3C,OAAOC,MAAM,MAAM,WAAW;AAC9B,OAAOC,WAAW,MAAM,iBAAiB;AACzC,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,wBAAwB,QAAQ,4BAA4B;AACrE,SAASC,gBAAgB,QAAQ,uBAAuB;~~AAAC~~,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;~~AAEzD~~,OAAO,SAASC,uBAAuBA,CAAE;EACxCC,YAAY,GAAG,IAAI;EACnBC,MAAM,GAAG,OAAO;EAChBC,QAAQ,~~gBAAGN~~,IAAA,CAACT,SAAS,IAAE,CAAC;~~EACxBgB~~,MAAM;EACNC,UAAU,EAAEC,cAAc;EAC1BC;AACD,CAAC,EAAG;~~EACHZ~~,gBAAgB,CAAC,CAAC;EAClB,~~MAAMa~~,cAAc,~~GAAGf~~,uBAAuB,CAAC,CAAC;EAChD,~~MAAMgB~~,UAAU,~~GAAGf~~,wBAAwB,CAAC,CAAC;EAC7C,~~MAAMgB~~,QAAQ,~~GAAGvB~~,MAAM,CAAC,CAAC;EACzB,~~MAAMkB~~,UAAU,~~GAAGnB~~,YAAY,CAAE,~~CAAEoB~~,cAAc,EAAEG,UAAU,EAAEC,QAAQ,CAAG,CAAC;EAE3E,IAAK,CAAET,YAAY,EAAG;IACrB,~~oBACCF~~,KAAA,CAACV,UAAU;~~MACVsB~~,oBAAoB,EAAGD,QAAU;MACjCE,KAAK,EAAG;QAAEV,MAAM;QAAEW,OAAO,EAAE;MAAO,CAAG;MAAAV,QAAA,~~gBAErCN~~,IAAA,CAACP,YAAY;~~QACZc~~,MAAM,EAAGA,MAAQ;QACjBU,KAAK,EAAC;~~MAAwB~~,~~CAC9B~~,CAAC,~~eACFjB~~,IAAA,CAACL,WAAW;~~QACXuB~~,GAAG,~~EAAGV~~,UAAY;~~QAClBW~~,SAAS,EAAC,uBAAuB;QACjCC,QAAQ,EAAG,CAAC,CAAG;~~QACfL~~,KAAK,EAAG;UACPV,MAAM,EAAE,MAAM;~~UACdgB~~,KAAK,EAAE;QACR,CAAG;~~QAAAf~~,QAAA,EAEDA;MAAQ,CACE,CAAC;IAAA,CACH,CAAC;EAEf;EAEA,~~oBACCN~~,IAAA,CAACR,UAAU;~~IACVsB~~,oBAAoB,EAAGD,QAAU;IACjCE,KAAK,EAAG;MAAEV,MAAM;MAAEW,OAAO,EAAE;IAAO,CAAG;IAAAV,QAAA,~~eAErCJ~~,KAAA,CAACR,MAAM;MAAA,~~GACDgB~~,WAAW;~~MAChBQ~~,GAAG,~~EAAGP~~,cAAgB;MACtBH,UAAU,EAAGA,UAAY;MACzBO,KAAK,EAAG;QACP,GAAGL,WAAW,EAAEK;MACjB,CAAG;~~MACHO~~,IAAI,EAAC,eAAe;~~MAAAhB~~,QAAA,~~gBAEpBN~~,IAAA,CAACP,YAAY;~~QAACc~~,MAAM,EAAGA;MAAQ,CAAE,CAAC,EAChCD,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,~~SAASiB~~,WAAWA,CAAE;~~EAAEjB~~,QAAQ;EAAED,MAAM;EAAEE;AAAO,CAAC,EAAG;EACpD,~~oBACCP~~,IAAA,~~CAACG~~,uBAAuB;IAACE,MAAM,EAAGA,MAAQ;IAACE,MAAM,EAAGA,MAAQ;IAAAD,QAAA,EACzDA;EAAQ,CACc,CAAC;AAE5B;AAEA,~~eAAeiB~~,WAAW","ignoreList":[]}
1	+ {"version":3,"names":["useMergeRefs","useRef","BlockList","BlockTools","EditorStyles","Iframe","WritingFlow","useMouseMoveTypingReset","useBlockSelectionClearer","useBlockCommands","jsx","_jsx","jsxs","_jsxs","EDITOR_STYLE_TRANSFORM_OPTIONS","ignoredSelectors","ExperimentalBlockCanvas","shouldIframe","height","children","styles","contentRef","contentRefProp","iframeProps","resetTypingRef","clearerRef","localRef","__unstableContentRef","style","display","scope","transformOptions","ref","className","tabIndex","width","name","BlockCanvas"],"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":"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","ignoreList":[]}

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"names":["Button","RawHTML","safeHTML","jsx","_jsx","jsxs","_jsxs","BlockView","title","rawContent","renderedContent","action","actionText","className","children","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":"AAAA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,OAAO,QAAQ,oBAAoB;AAC5C,SAASC,QAAQ,QAAQ,gBAAgB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAE1C,eAAe,SAASC,SAASA,CAAE;EAClCC,KAAK;EACLC,UAAU;EACVC,eAAe;EACfC,MAAM;EACNC,UAAU;EACVC;AACD,CAAC,EAAG;EACH,oBACCP,KAAA;IAAKO,SAAS,EAAGA,SAAW;IAAAC,QAAA,gBAC3BR,KAAA;MAAKO,SAAS,EAAC,qCAAqC;MAAAC,QAAA,gBACnDV,IAAA;QAAIS,SAAS,EAAC,qCAAqC;QAAAC,QAAA,EAChDN;MAAK,CACJ,CAAC,eAELJ,IAAA;QAAKS,SAAS,EAAC,kCAAkC;QAAAC,QAAA,EAC9CL;MAAU,CACR,CAAC,eAENL,IAAA;QAAKS,SAAS,EAAC,6DAA6D;QAAAC,QAAA,eAC3EV,IAAA,CAACH,OAAO;UAAAa,QAAA,EAAGZ,QAAQ,CAAEQ,eAAgB;QAAC,CAAW;MAAC,CAC9C,CAAC;IAAA,CACF,CAAC,eAENN,IAAA;MAAKS,SAAS,EAAC,oCAAoC;MAAAC,QAAA,eAClDV,IAAA,CAACJ,~~MAAM~~;~~QAACe~~,OAAO,EAAC,WAAW;~~QAACC~~,QAAQ,EAAC,GAAG;~~QAACC~~,OAAO,~~EAAGN~~,MAAQ;QAAAG,QAAA,~~EACxDF~~;MAAU,CACL;IAAC,CACL,CAAC;EAAA,CACF,CAAC;AAER","ignoreList":[]}
1	+ {"version":3,"names":["Button","RawHTML","safeHTML","jsx","_jsx","jsxs","_jsxs","BlockView","title","rawContent","renderedContent","action","actionText","className","children","__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":"AAAA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,OAAO,QAAQ,oBAAoB;AAC5C,SAASC,QAAQ,QAAQ,gBAAgB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAE1C,eAAe,SAASC,SAASA,CAAE;EAClCC,KAAK;EACLC,UAAU;EACVC,eAAe;EACfC,MAAM;EACNC,UAAU;EACVC;AACD,CAAC,EAAG;EACH,oBACCP,KAAA;IAAKO,SAAS,EAAGA,SAAW;IAAAC,QAAA,gBAC3BR,KAAA;MAAKO,SAAS,EAAC,qCAAqC;MAAAC,QAAA,gBACnDV,IAAA;QAAIS,SAAS,EAAC,qCAAqC;QAAAC,QAAA,EAChDN;MAAK,CACJ,CAAC,eAELJ,IAAA;QAAKS,SAAS,EAAC,kCAAkC;QAAAC,QAAA,EAC9CL;MAAU,CACR,CAAC,eAENL,IAAA;QAAKS,SAAS,EAAC,6DAA6D;QAAAC,QAAA,eAC3EV,IAAA,CAACH,OAAO;UAAAa,QAAA,EAAGZ,QAAQ,CAAEQ,eAAgB;QAAC,CAAW;MAAC,CAC9C,CAAC;IAAA,CACF,CAAC,eAENN,IAAA;MAAKS,SAAS,EAAC,oCAAoC;MAAAC,QAAA,eAClDV,IAAA,CAACJ;MACA;MAAA;QACAe,qBAAqB,EAAG,KAAO;QAC/BC,OAAO,EAAC,WAAW;QACnBC,QAAQ,EAAC,GAAG;QACZC,OAAO,EAAGP,MAAQ;QAAAG,QAAA,EAEhBF;MAAU,CACL;IAAC,CACL,CAAC;EAAA,CACF,CAAC;AAER","ignoreList":[]}

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"names":["store","blocksStore","Draggable","useSelect","useDispatch","useEffect","useRef","throttle","BlockDraggableChip","useScrollWhenDragging","blockEditorStore","useBlockElement","isDropTargetValid","jsx","_jsx","BlockDraggable","appendToOwnerDocument","children","clientIds","cloneClassname","elementId","onDragStart","onDragEnd","fadeWhenDisabled","dragComponent","srcRootClientId","isDraggable","icon","visibleInserter","getBlockType","select","canMoveBlocks","getBlockRootClientId","getBlockName","getBlockAttributes","isBlockInsertionPointVisible","_getBlockType","getActiveBlockVariation","rootClientId","blockName","variation","isDragging","startScrolling","scrollOnDragOver","stopScrolling","getAllowedBlocks","getBlockNamesByClientId","startDraggingBlocks","stopDraggingBlocks","current","blockEl","editorRoot","closest","onDragOver","event","target","draggedBlockNames","targetClientId","getAttribute","allowedBlocks","targetBlockName","dropTargetValid","length","targetRootClientId","targetRootBlockName","rootAllowedBlocks","window","document","body","classList","add","remove","throttledOnDragOver","addEventListener","removeEventListener","draggable","transferData","type","srcClientIds","__experimentalTransferDataType","requestAnimationFrame","__experimentalDragComponent","undefined","count","onDraggableStart","onDraggableEnd"],"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":["store","blocksStore","Draggable","useSelect","useDispatch","useEffect","useRef","throttle","BlockDraggableChip","useScrollWhenDragging","blockEditorStore","useBlockElement","isDropTargetValid","jsx","_jsx","BlockDraggable","appendToOwnerDocument","children","clientIds","cloneClassname","elementId","onDragStart","onDragEnd","fadeWhenDisabled","dragComponent","srcRootClientId","isDraggable","icon","visibleInserter","getBlockType","select","canMoveBlocks","getBlockRootClientId","getBlockName","getBlockAttributes","isBlockInsertionPointVisible","_getBlockType","getActiveBlockVariation","rootClientId","blockName","variation","isDraggingRef","startScrolling","scrollOnDragOver","stopScrolling","getAllowedBlocks","getBlockNamesByClientId","startDraggingBlocks","stopDraggingBlocks","current","blockEl","editorRoot","closest","onDragOver","event","target","draggedBlockNames","targetClientId","getAttribute","allowedBlocks","targetBlockName","dropTargetValid","length","targetRootClientId","targetRootBlockName","rootAllowedBlocks","window","document","body","classList","add","remove","throttledOnDragOver","addEventListener","removeEventListener","draggable","transferData","type","srcClientIds","__experimentalTransferDataType","requestAnimationFrame","__experimentalDragComponent","undefined","count","onDraggableStart","onDraggableEnd"],"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-module/components/block-draggable/use-scroll-when-dragging.js CHANGED Viewed

@@ -16,64 +16,64 @@ const VELOCITY_MULTIPLIER = PIXELS_PER_SECOND_PER_PERCENTAGE * (SCROLL_INTERVAL_
  *                      and `onDragEnd` events respectively.
  */
 export default function useScrollWhenDragging() {
-  const dragStartY = useRef(null);
-  const velocityY = useRef(null);
-  const scrollParentY = useRef(null);
-  const scrollEditorInterval = useRef(null);
+  const dragStartYRef = useRef(null);
+  const velocityYRef = useRef(null);
+  const scrollParentYRef = useRef(null);
+  const scrollEditorIntervalRef = useRef(null);
   // Clear interval when unmounting.
   useEffect(() => () => {
-    if (scrollEditorInterval.current) {
-      clearInterval(scrollEditorInterval.current);
-      scrollEditorInterval.current = null;
+    if (scrollEditorIntervalRef.current) {
+      clearInterval(scrollEditorIntervalRef.current);
+      scrollEditorIntervalRef.current = null;
     }
   }, []);
   const startScrolling = useCallback(event => {
-    dragStartY.current = event.clientY;
+    dragStartYRef.current = event.clientY;
     // Find nearest parent(s) to scroll.
-    scrollParentY.current = getScrollContainer(event.target);
-    scrollEditorInterval.current = setInterval(() => {
-      if (scrollParentY.current && velocityY.current) {
-        const newTop = scrollParentY.current.scrollTop + velocityY.current;
+    scrollParentYRef.current = 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 = 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-module/components/block-draggable/use-scroll-when-dragging.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["getScrollContainer","useCallback","useEffect","useRef","SCROLL_INACTIVE_DISTANCE_PX","SCROLL_INTERVAL_MS","PIXELS_PER_SECOND_PER_PERCENTAGE","VELOCITY_MULTIPLIER","useScrollWhenDragging","~~dragStartY~~","~~velocityY~~","~~scrollParentY~~","~~scrollEditorInterval~~","current","clearInterval","startScrolling","event","clientY","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":"AAAA;AACA;AACA;AACA,SAASA,kBAAkB,QAAQ,gBAAgB;AACnD,SAASC,WAAW,EAAEC,SAAS,EAAEC,MAAM,QAAQ,oBAAoB;AAEnE,MAAMC,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;AACA,eAAe,SAASG,qBAAqBA,CAAA,EAAG;EAC/C,MAAMC,~~UAAU~~,GAAGN,MAAM,CAAE,IAAK,CAAC;~~EACjC~~,MAAMO,~~SAAS~~,GAAGP,MAAM,CAAE,IAAK,CAAC;~~EAChC~~,MAAMQ,~~aAAa~~,GAAGR,MAAM,CAAE,IAAK,CAAC;~~EACpC~~,MAAMS,~~oBAAoB~~,GAAGT,MAAM,CAAE,IAAK,CAAC;;~~EAE3C~~;EACAD,SAAS,CACR,MAAM,MAAM;IACX,IAAKU,~~oBAAoB~~,CAACC,OAAO,EAAG;~~MACnCC~~,aAAa,CAAEF,~~oBAAoB~~,CAACC,OAAQ,CAAC;~~MAC7CD~~,~~oBAAoB~~,CAACC,OAAO,GAAG,IAAI;~~IACpC~~;EACD,CAAC,EACD,EACD,CAAC;EAED,MAAME,cAAc,GAAGd,WAAW,CAAIe,KAAK,IAAM;IAChDP,~~UAAU~~,CAACI,OAAO,GAAGG,KAAK,CAACC,OAAO;;~~IAElC~~;IACAN,~~aAAa~~,CAACE,OAAO,GAAGb,kBAAkB,CAAEgB,KAAK,CAACE,MAAO,CAAC;~~IAE1DN~~,~~oBAAoB~~,CAACC,OAAO,GAAGM,WAAW,CAAE,MAAM;~~MACjD~~,IAAKR,~~aAAa~~,CAACE,OAAO,IAAIH,~~SAAS~~,CAACG,OAAO,EAAG;~~QACjD~~,MAAMO,MAAM,GACXT,~~aAAa~~,CAACE,OAAO,CAACQ,SAAS,GAAGX,~~SAAS~~,CAACG,OAAO;;~~QAEpD~~;QACA;QACAF,~~aAAa~~,CAACE,OAAO,CAACS,MAAM,CAAE;~~UAC7BC~~,GAAG,EAAEH;QACN,CAAE,CAAC;MACJ;IACD,CAAC,EAAEf,kBAAmB,CAAC;EACxB,CAAC,EAAE,EAAG,CAAC;EAEP,MAAMmB,gBAAgB,GAAGvB,WAAW,CAAIe,KAAK,IAAM;IAClD,IAAK,CAAEL,~~aAAa~~,CAACE,OAAO,EAAG;~~MAC9B~~;IACD;IACA,MAAMY,kBAAkB,GAAGd,~~aAAa~~,CAACE,OAAO,CAACa,YAAY;~~IAC7D~~,MAAMC,uBAAuB,GAC5BlB,~~UAAU~~,CAACI,OAAO,GAAGF,~~aAAa~~,CAACE,OAAO,CAACe,SAAS;~~IACrD~~,MAAMC,kBAAkB,GACvBb,KAAK,CAACC,OAAO,GAAGN,~~aAAa~~,CAACE,OAAO,CAACe,SAAS;~~IAEhD~~,IAAKZ,KAAK,CAACC,OAAO,GAAGU,uBAAuB,EAAG;MAC9C;MACA,MAAMG,gBAAgB,GAAGC,IAAI,CAACC,GAAG,CAChCP,kBAAkB,GACjBE,uBAAuB,GACvBvB,2BAA2B,EAC5B,CACD,CAAC;MACD,MAAM6B,YAAY,GAAGF,IAAI,CAACC,GAAG,CAC5BH,kBAAkB,GACjBF,uBAAuB,GACvBvB,2BAA2B,EAC5B,CACD,CAAC;MACD,MAAM8B,kBAAkB,GACvBJ,gBAAgB,KAAK,CAAC,IAAIG,YAAY,KAAK,CAAC,GACzC,CAAC,GACDA,YAAY,GAAGH,gBAAgB;MACnCpB,~~SAAS~~,CAACG,OAAO,GAAGN,mBAAmB,GAAG2B,kBAAkB;~~IAC7D~~,CAAC,MAAM,IAAKlB,KAAK,CAACC,OAAO,GAAGU,uBAAuB,EAAG;MACrD;MACA,MAAMG,gBAAgB,GAAGC,IAAI,CAACC,GAAG,CAChCL,uBAAuB,GAAGvB,2BAA2B,EACrD,CACD,CAAC;MACD,MAAM6B,YAAY,GAAGF,IAAI,CAACC,GAAG,CAC5BL,uBAAuB,GACtBE,kBAAkB,GAClBzB,2BAA2B,EAC5B,CACD,CAAC;MACD,MAAM8B,kBAAkB,GACvBJ,gBAAgB,KAAK,CAAC,IAAIG,YAAY,KAAK,CAAC,GACzC,CAAC,GACDA,YAAY,GAAGH,gBAAgB;MACnCpB,~~SAAS~~,CAACG,OAAO,GAAG,CAACN,mBAAmB,GAAG2B,kBAAkB;~~IAC9D~~,CAAC,MAAM;MACNxB,~~SAAS~~,CAACG,OAAO,GAAG,CAAC;~~IACtB~~;EACD,CAAC,EAAE,EAAG,CAAC;EAEP,MAAMsB,aAAa,GAAGA,CAAA,KAAM;IAC3B1B,~~UAAU~~,CAACI,OAAO,GAAG,IAAI;~~IACzBF~~,~~aAAa~~,CAACE,OAAO,GAAG,IAAI;~~IAE5B~~,IAAKD,~~oBAAoB~~,CAACC,OAAO,EAAG;~~MACnCC~~,aAAa,CAAEF,~~oBAAoB~~,CAACC,OAAQ,CAAC;~~MAC7CD~~,~~oBAAoB~~,CAACC,OAAO,GAAG,IAAI;~~IACpC~~;EACD,CAAC;EAED,OAAO,CAAEE,cAAc,EAAES,gBAAgB,EAAEW,aAAa,CAAE;AAC3D","ignoreList":[]}
1	+ {"version":3,"names":["getScrollContainer","useCallback","useEffect","useRef","SCROLL_INACTIVE_DISTANCE_PX","SCROLL_INTERVAL_MS","PIXELS_PER_SECOND_PER_PERCENTAGE","VELOCITY_MULTIPLIER","useScrollWhenDragging","dragStartYRef","velocityYRef","scrollParentYRef","scrollEditorIntervalRef","current","clearInterval","startScrolling","event","clientY","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-module/components/block-edit/multiple-usage-warning.js CHANGED Viewed

@@ -23,11 +23,17 @@ export function MultipleUsageWarning({
   } = useDispatch(blockEditorStore);
   const blockType = getBlockType(name);
   return /*#__PURE__*/_jsxs(Warning, {
-    actions: [/*#__PURE__*/_jsx(Button, {
+    actions: [/*#__PURE__*/_jsx(Button
+    // TODO: Switch to `true` (40px size) if possible
+    , {
+      __next40pxDefaultSize: false,
       variant: "secondary",
       onClick: () => selectBlock(originalBlockClientId),
       children: __('Find original')
-    }, "find-original"), /*#__PURE__*/_jsx(Button, {
+    }, "find-original"), /*#__PURE__*/_jsx(Button
+    // TODO: Switch to `true` (40px size) if possible
+    , {
+      __next40pxDefaultSize: false,
       variant: "secondary",
       onClick: () => onReplace([]),
       children: __('Remove')

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

	@@ -1 +1 @@
1	- {"version":3,"names":["getBlockType","Button","useDispatch","__","store","blockEditorStore","Warning","jsx","_jsx","jsxs","_jsxs","MultipleUsageWarning","originalBlockClientId","name","onReplace","selectBlock","blockType","actions","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":"AAAA;AACA;AACA;AACA,SAASA,YAAY,QAAQ,mBAAmB;AAChD,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,WAAW,QAAQ,iBAAiB;AAC7C,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,aAAa;AACvD,OAAOC,OAAO,MAAM,YAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAEjC,OAAO,SAASC,oBAAoBA,CAAE;EACrCC,qBAAqB;EACrBC,IAAI;EACJC;AACD,CAAC,EAAG;EACH,MAAM;IAAEC;EAAY,CAAC,GAAGb,WAAW,CAAEG,gBAAiB,CAAC;EACvD,MAAMW,SAAS,GAAGhB,YAAY,CAAEa,IAAK,CAAC;EAEtC,oBACCH,KAAA,CAACJ,OAAO;IACPW,OAAO,EAAG,cACTT,IAAA,CAACP,~~MAAM~~;~~MAENiB~~,OAAO,EAAC,WAAW;MACnBC,OAAO,EAAGA,CAAA,~~KAAMJ~~,WAAW,CAAEH,qBAAsB,CAAG;~~MAAAQ~~,QAAA,~~EAEpDjB~~,EAAE,CAAE,eAAgB;IAAC,GAJnB,eAKG,CAAC,eACTK,IAAA,CAACP,~~MAAM~~;~~MAENiB~~,OAAO,EAAC,WAAW;MACnBC,OAAO,EAAGA,CAAA,~~KAAML~~,SAAS,CAAE,EAAG,CAAG;~~MAAAM~~,QAAA,EAE/~~BjB~~,EAAE,CAAE,QAAS;IAAC,GAJZ,QAKG,CAAC,CACP;~~IAAAiB~~,QAAA,~~gBAEHV~~,KAAA;~~MAAAU~~,QAAA,~~GAAUJ~~,SAAS,~~EAAEK~~,KAAK,EAAE,IAAE;IAAA,CAAQ,CAAC,~~EACrClB~~,EAAE,CAAE,mCAAoC,CAAC;EAAA,CACnC,CAAC;AAEZ","ignoreList":[]}
1	+ {"version":3,"names":["getBlockType","Button","useDispatch","__","store","blockEditorStore","Warning","jsx","_jsx","jsxs","_jsxs","MultipleUsageWarning","originalBlockClientId","name","onReplace","selectBlock","blockType","actions","__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":"AAAA;AACA;AACA;AACA,SAASA,YAAY,QAAQ,mBAAmB;AAChD,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,WAAW,QAAQ,iBAAiB;AAC7C,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,aAAa;AACvD,OAAOC,OAAO,MAAM,YAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAEjC,OAAO,SAASC,oBAAoBA,CAAE;EACrCC,qBAAqB;EACrBC,IAAI;EACJC;AACD,CAAC,EAAG;EACH,MAAM;IAAEC;EAAY,CAAC,GAAGb,WAAW,CAAEG,gBAAiB,CAAC;EACvD,MAAMW,SAAS,GAAGhB,YAAY,CAAEa,IAAK,CAAC;EAEtC,oBACCH,KAAA,CAACJ,OAAO;IACPW,OAAO,EAAG,cACTT,IAAA,CAACP;IACA;IAAA;MACAiB,qBAAqB,EAAG,KAAO;MAE/BC,OAAO,EAAC,WAAW;MACnBC,OAAO,EAAGA,CAAA,KAAML,WAAW,CAAEH,qBAAsB,CAAG;MAAAS,QAAA,EAEpDlB,EAAE,CAAE,eAAgB;IAAC,GAJnB,eAKG,CAAC,eACTK,IAAA,CAACP;IACA;IAAA;MACAiB,qBAAqB,EAAG,KAAO;MAE/BC,OAAO,EAAC,WAAW;MACnBC,OAAO,EAAGA,CAAA,KAAMN,SAAS,CAAE,EAAG,CAAG;MAAAO,QAAA,EAE/BlB,EAAE,CAAE,QAAS;IAAC,GAJZ,QAKG,CAAC,CACP;IAAAkB,QAAA,gBAEHX,KAAA;MAAAW,QAAA,GAAUL,SAAS,EAAEM,KAAK,EAAE,IAAE;IAAA,CAAQ,CAAC,EACrCnB,EAAE,CAAE,mCAAoC,CAAC;EAAA,CACnC,CAAC;AAEZ","ignoreList":[]}

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

@@ -29,6 +29,16 @@ import { unlock } from '../../lock-unlock';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
+function BlockStylesPanel({
+  clientId
+}) {
+  return /*#__PURE__*/_jsx(PanelBody, {
+    title: __('Styles'),
+    children: /*#__PURE__*/_jsx(BlockStyles, {
+      clientId: clientId
+    })
+  });
+}
 function BlockInspectorLockedBlocks({
   topLevelLockedBlock
 }) {
@@ -40,6 +50,15 @@ function BlockInspectorLockedBlocks({
     } = select(blockEditorStore);
     return getClientIdsOfDescendants(topLevelLockedBlock).filter(clientId => getBlockName(clientId) !== 'core/list-item' && getBlockEditingMode(clientId) === 'contentOnly');
   }, [topLevelLockedBlock]);
+  const hasBlockStyles = useSelect(select => {
+    const {
+      getBlockName
+    } = select(blockEditorStore);
+    const {
+      getBlockStyles
+    } = select(blocksStore);
+    return !!getBlockStyles(getBlockName(topLevelLockedBlock))?.length;
+  }, [topLevelLockedBlock]);
   const blockInformation = useBlockDisplayInformation(topLevelLockedBlock);
   return /*#__PURE__*/_jsxs("div", {
     className: "block-editor-block-inspector",
@@ -48,7 +67,9 @@ function BlockInspectorLockedBlocks({
       className: blockInformation.isSynced && 'is-synced'
     }), /*#__PURE__*/_jsx(BlockVariationTransforms, {
       blockClientId: topLevelLockedBlock
-    }), /*#__PURE__*/_jsx(BlockInfo.Slot, {}), contentClientIds.length > 0 && /*#__PURE__*/_jsx(PanelBody, {
+    }), /*#__PURE__*/_jsx(BlockInfo.Slot, {}), hasBlockStyles && /*#__PURE__*/_jsx(BlockStylesPanel, {
+      clientId: topLevelLockedBlock
+    }), contentClientIds.length > 0 && /*#__PURE__*/_jsx(PanelBody, {
       title: __('Content'),
       children: /*#__PURE__*/_jsx(BlockQuickNavigation, {
         clientIds: contentClientIds
@@ -217,13 +238,8 @@ const BlockInspectorSingleBlock = ({
       blockName: blockName,
       tabs: availableTabs
     }), !showTabs && /*#__PURE__*/_jsxs(_Fragment, {
-      children: [hasBlockStyles && /*#__PURE__*/_jsx("div", {
-        children: /*#__PURE__*/_jsx(PanelBody, {
-          title: __('Styles'),
-          children: /*#__PURE__*/_jsx(BlockStyles, {
-            clientId: clientId
-          })
-        })
+      children: [hasBlockStyles && /*#__PURE__*/_jsx(BlockStylesPanel, {
+        clientId: clientId
       }), /*#__PURE__*/_jsx(InspectorControls.Slot, {}), /*#__PURE__*/_jsx(InspectorControls.Slot, {
         group: "list"
       }), /*#__PURE__*/_jsx(InspectorControls.Slot, {
@@ -244,7 +260,9 @@ const BlockInspectorSingleBlock = ({
         label: borderPanelLabel
       }), /*#__PURE__*/_jsx(InspectorControls.Slot, {
         group: "styles"
-      }), /*#__PURE__*/_jsx(PositionControls, {}), /*#__PURE__*/_jsx("div", {
+      }), /*#__PURE__*/_jsx(PositionControls, {}), /*#__PURE__*/_jsx(InspectorControls.Slot, {
+        group: "bindings"
+      }), /*#__PURE__*/_jsx("div", {
         children: /*#__PURE__*/_jsx(AdvancedControls, {})
       })]
     }), /*#__PURE__*/_jsx(SkipToSelectedBlock, {}, "back")]