@wordpress/block-editor 12.1.0 → 12.3.0

package/build-module/components/gradients/use-gradient.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/gradients/use-gradient.js"],"names":["useCallback","useMemo","useSelect","useDispatch","useBlockEditContext","useSetting","store","blockEditorStore","__experimentalGetGradientClass","gradientSlug","undefined","getGradientValueBySlug","gradients","slug","gradient","find","g","__experimentalGetGradientObjectByGradientValue","value","getGradientSlugByValue","__experimentalUseGradient","gradientAttribute","customGradientAttribute","clientId","userGradientPalette","themeGradientPalette","defaultGradientPalette","allGradients","customGradient","select","getBlockAttributes","attributes","updateBlockAttributes","setGradient","newGradientValue","gradientClass","gradientValue"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { useBlockEditContext } from '../block-edit';\nimport useSetting from '../use-setting';\nimport { store as blockEditorStore } from '../../store';\n\nexport function __experimentalGetGradientClass( gradientSlug ) {\n\tif ( ! gradientSlug ) {\n\t\treturn undefined;\n\t}\n\treturn `has-${ gradientSlug }-gradient-background`;\n}\n\n/**\n * Retrieves the gradient value per slug.\n *\n * @param {Array}  gradients Gradient Palette\n * @param {string} slug      Gradient slug\n *\n * @return {string} Gradient value.\n */\nexport function getGradientValueBySlug( gradients, slug ) {\n\tconst gradient = gradients?.find( ( g ) => g.slug === slug );\n\treturn gradient && gradient.gradient;\n}\n\nexport function __experimentalGetGradientObjectByGradientValue(\n\tgradients,\n\tvalue\n) {\n\tconst gradient = gradients?.find( ( g ) => g.gradient === value );\n\treturn gradient;\n}\n\n/**\n * Retrieves the gradient slug per slug.\n *\n * @param {Array}  gradients Gradient Palette\n * @param {string} value     Gradient value\n * @return {string} Gradient slug.\n */\nexport function getGradientSlugByValue( gradients, value ) {\n\tconst gradient = __experimentalGetGradientObjectByGradientValue(\n\t\tgradients,\n\t\tvalue\n\t);\n\treturn gradient && gradient.slug;\n}\n\nexport function __experimentalUseGradient( {\n\tgradientAttribute = 'gradient',\n\tcustomGradientAttribute = 'customGradient',\n} = {} ) {\n\tconst { clientId } = useBlockEditContext();\n\n\tconst userGradientPalette = useSetting( 'color.gradients.custom' );\n\tconst themeGradientPalette = useSetting( 'color.gradients.theme' );\n\tconst defaultGradientPalette = useSetting( 'color.gradients.default' );\n\tconst allGradients = useMemo(\n\t\t() => [\n\t\t\t...( userGradientPalette || [] ),\n\t\t\t...( themeGradientPalette || [] ),\n\t\t\t...( defaultGradientPalette || [] ),\n\t\t],\n\t\t[ userGradientPalette, themeGradientPalette, defaultGradientPalette ]\n\t);\n\tconst { gradient, customGradient } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockAttributes } = select( blockEditorStore );\n\t\t\tconst attributes = getBlockAttributes( clientId ) || {};\n\t\t\treturn {\n\t\t\t\tcustomGradient: attributes[ customGradientAttribute ],\n\t\t\t\tgradient: attributes[ gradientAttribute ],\n\t\t\t};\n\t\t},\n\t\t[ clientId, gradientAttribute, customGradientAttribute ]\n\t);\n\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\tconst setGradient = useCallback(\n\t\t( newGradientValue ) => {\n\t\t\tconst slug = getGradientSlugByValue(\n\t\t\t\tallGradients,\n\t\t\t\tnewGradientValue\n\t\t\t);\n\t\t\tif ( slug ) {\n\t\t\t\tupdateBlockAttributes( clientId, {\n\t\t\t\t\t[ gradientAttribute ]: slug,\n\t\t\t\t\t[ customGradientAttribute ]: undefined,\n\t\t\t\t} );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tupdateBlockAttributes( clientId, {\n\t\t\t\t[ gradientAttribute ]: undefined,\n\t\t\t\t[ customGradientAttribute ]: newGradientValue,\n\t\t\t} );\n\t\t},\n\t\t[ allGradients, clientId, updateBlockAttributes ]\n\t);\n\n\tconst gradientClass = __experimentalGetGradientClass( gradient );\n\tlet gradientValue;\n\tif ( gradient ) {\n\t\tgradientValue = getGradientValueBySlug( allGradients, gradient );\n\t} else {\n\t\tgradientValue = customGradient;\n\t}\n\treturn { gradientClass, gradientValue, setGradient };\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/gradients/use-gradient.js"],"names":["useCallback","useMemo","useSelect","useDispatch","useBlockEditContext","useSetting","store","blockEditorStore","__experimentalGetGradientClass","gradientSlug","undefined","getGradientValueBySlug","gradients","slug","gradient","find","g","__experimentalGetGradientObjectByGradientValue","value","getGradientSlugByValue","__experimentalUseGradient","gradientAttribute","customGradientAttribute","clientId","userGradientPalette","themeGradientPalette","defaultGradientPalette","allGradients","customGradient","select","getBlockAttributes","attributes","updateBlockAttributes","setGradient","newGradientValue","gradientClass","gradientValue"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { useBlockEditContext } from '../block-edit';\nimport useSetting from '../use-setting';\nimport { store as blockEditorStore } from '../../store';\n\nexport function __experimentalGetGradientClass( gradientSlug ) {\n\tif ( ! gradientSlug ) {\n\t\treturn undefined;\n\t}\n\treturn `has-${ gradientSlug }-gradient-background`;\n}\n\n/**\n * Retrieves the gradient value per slug.\n *\n * @param {Array}  gradients Gradient Palette\n * @param {string} slug      Gradient slug\n *\n * @return {string} Gradient value.\n */\nexport function getGradientValueBySlug( gradients, slug ) {\n\tconst gradient = gradients?.find( ( g ) => g.slug === slug );\n\treturn gradient && gradient.gradient;\n}\n\nexport function __experimentalGetGradientObjectByGradientValue(\n\tgradients,\n\tvalue\n) {\n\tconst gradient = gradients?.find( ( g ) => g.gradient === value );\n\treturn gradient;\n}\n\n/**\n * Retrieves the gradient slug per slug.\n *\n * @param {Array}  gradients Gradient Palette\n * @param {string} value     Gradient value\n * @return {string} Gradient slug.\n */\nexport function getGradientSlugByValue( gradients, value ) {\n\tconst gradient = __experimentalGetGradientObjectByGradientValue(\n\t\tgradients,\n\t\tvalue\n\t);\n\treturn gradient && gradient.slug;\n}\n\nexport function __experimentalUseGradient( {\n\tgradientAttribute = 'gradient',\n\tcustomGradientAttribute = 'customGradient',\n} = {} ) {\n\tconst { clientId } = useBlockEditContext();\n\n\tconst userGradientPalette = useSetting( 'color.gradients.custom' );\n\tconst themeGradientPalette = useSetting( 'color.gradients.theme' );\n\tconst defaultGradientPalette = useSetting( 'color.gradients.default' );\n\tconst allGradients = useMemo(\n\t\t() => [\n\t\t\t...( userGradientPalette || [] ),\n\t\t\t...( themeGradientPalette || [] ),\n\t\t\t...( defaultGradientPalette || [] ),\n\t\t],\n\t\t[ userGradientPalette, themeGradientPalette, defaultGradientPalette ]\n\t);\n\tconst { gradient, customGradient } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockAttributes } = select( blockEditorStore );\n\t\t\tconst attributes = getBlockAttributes( clientId ) || {};\n\t\t\treturn {\n\t\t\t\tcustomGradient: attributes[ customGradientAttribute ],\n\t\t\t\tgradient: attributes[ gradientAttribute ],\n\t\t\t};\n\t\t},\n\t\t[ clientId, gradientAttribute, customGradientAttribute ]\n\t);\n\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\tconst setGradient = useCallback(\n\t\t( newGradientValue ) => {\n\t\t\tconst slug = getGradientSlugByValue(\n\t\t\t\tallGradients,\n\t\t\t\tnewGradientValue\n\t\t\t);\n\t\t\tif ( slug ) {\n\t\t\t\tupdateBlockAttributes( clientId, {\n\t\t\t\t\t[ gradientAttribute ]: slug,\n\t\t\t\t\t[ customGradientAttribute ]: undefined,\n\t\t\t\t} );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tupdateBlockAttributes( clientId, {\n\t\t\t\t[ gradientAttribute ]: undefined,\n\t\t\t\t[ customGradientAttribute ]: newGradientValue,\n\t\t\t} );\n\t\t},\n\t\t[ allGradients, clientId, updateBlockAttributes ]\n\t);\n\n\tconst gradientClass = __experimentalGetGradientClass( gradient );\n\tlet gradientValue;\n\tif ( gradient ) {\n\t\tgradientValue = getGradientValueBySlug( allGradients, gradient );\n\t} else {\n\t\tgradientValue = customGradient;\n\t}\n\treturn { gradientClass, gradientValue, setGradient };\n}\n"]}

package/build-module/components/height-control/index.js

@@ -50,19 +50,18 @@ const RANGE_CONTROL_CUSTOM_SETTINGS = {
  * @return {WPComponent} The component to be rendered.
  */
 
-export default function HeightControl(_ref) {
-  var _units$, _RANGE_CONTROL_CUSTOM, _RANGE_CONTROL_CUSTOM2, _RANGE_CONTROL_CUSTOM3, _RANGE_CONTROL_CUSTOM4;
+export default function HeightControl({
+  label = __('Height'),
+  onChange,
+  value
+}) {
+  var _RANGE_CONTROL_CUSTOM, _RANGE_CONTROL_CUSTOM2;
 
-  let {
-    label = __('Height'),
-    onChange,
-    value
-  } = _ref;
   const customRangeValue = parseFloat(value);
   const units = useCustomUnits({
     availableUnits: useSetting('spacing.units') || ['%', 'px', 'em', 'rem', 'vh', 'vw']
   });
-  const selectedUnit = useMemo(() => parseQuantityAndUnitFromRawValue(value), [value])[1] || ((_units$ = units[0]) === null || _units$ === void 0 ? void 0 : _units$.value) || 'px';
+  const selectedUnit = useMemo(() => parseQuantityAndUnitFromRawValue(value), [value])[1] || units[0]?.value || 'px';
 
   const handleSliderChange = next => {
     onChange([next, selectedUnit].join(''));
@@ -106,8 +105,8 @@ export default function HeightControl(_ref) {
   }, createElement(RangeControl, {
     value: customRangeValue,
     min: 0,
-    max: (_RANGE_CONTROL_CUSTOM = (_RANGE_CONTROL_CUSTOM2 = RANGE_CONTROL_CUSTOM_SETTINGS[selectedUnit]) === null || _RANGE_CONTROL_CUSTOM2 === void 0 ? void 0 : _RANGE_CONTROL_CUSTOM2.max) !== null && _RANGE_CONTROL_CUSTOM !== void 0 ? _RANGE_CONTROL_CUSTOM : 100,
-    step: (_RANGE_CONTROL_CUSTOM3 = (_RANGE_CONTROL_CUSTOM4 = RANGE_CONTROL_CUSTOM_SETTINGS[selectedUnit]) === null || _RANGE_CONTROL_CUSTOM4 === void 0 ? void 0 : _RANGE_CONTROL_CUSTOM4.step) !== null && _RANGE_CONTROL_CUSTOM3 !== void 0 ? _RANGE_CONTROL_CUSTOM3 : 0.1,
+    max: (_RANGE_CONTROL_CUSTOM = RANGE_CONTROL_CUSTOM_SETTINGS[selectedUnit]?.max) !== null && _RANGE_CONTROL_CUSTOM !== void 0 ? _RANGE_CONTROL_CUSTOM : 100,
+    step: (_RANGE_CONTROL_CUSTOM2 = RANGE_CONTROL_CUSTOM_SETTINGS[selectedUnit]?.step) !== null && _RANGE_CONTROL_CUSTOM2 !== void 0 ? _RANGE_CONTROL_CUSTOM2 : 0.1,
     withInputField: false,
     onChange: handleSliderChange,
     __nextHasNoMarginBottom: true

package/build-module/components/height-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/height-control/index.js"],"names":["useMemo","BaseControl","RangeControl","Flex","FlexItem","__experimentalSpacer","Spacer","__experimentalUseCustomUnits","useCustomUnits","__experimentalUnitControl","UnitControl","__experimentalParseQuantityAndUnitFromRawValue","parseQuantityAndUnitFromRawValue","__","useSetting","RANGE_CONTROL_CUSTOM_SETTINGS","px","max","step","vw","vh","em","rem","HeightControl","label","onChange","value","customRangeValue","parseFloat","units","availableUnits","selectedUnit","handleSliderChange","next","join","handleUnitChange","newUnit","currentValue","currentUnit","includes","toFixed","Math","round"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\nimport {\n\tBaseControl,\n\tRangeControl,\n\tFlex,\n\tFlexItem,\n\t__experimentalSpacer as Spacer,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../use-setting';\n\nconst RANGE_CONTROL_CUSTOM_SETTINGS = {\n\tpx: { max: 1000, step: 1 },\n\t'%': { max: 100, step: 1 },\n\tvw: { max: 100, step: 1 },\n\tvh: { max: 100, step: 1 },\n\tem: { max: 50, step: 0.1 },\n\trem: { max: 50, step: 0.1 },\n};\n\n/**\n * HeightControl renders a linked unit control and range control for adjusting the height of a block.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/height-control/README.md\n *\n * @param {Object}                     props\n * @param {?string}                    props.label    A label for the control.\n * @param {( value: string ) => void } props.onChange Called when the height changes.\n * @param {string}                     props.value    The current height value.\n *\n * @return {WPComponent} The component to be rendered.\n */\nexport default function HeightControl( {\n\tlabel = __( 'Height' ),\n\tonChange,\n\tvalue,\n} ) {\n\tconst customRangeValue = parseFloat( value );\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: useSetting( 'spacing.units' ) || [\n\t\t\t'%',\n\t\t\t'px',\n\t\t\t'em',\n\t\t\t'rem',\n\t\t\t'vh',\n\t\t\t'vw',\n\t\t],\n\t} );\n\n\tconst selectedUnit =\n\t\tuseMemo(\n\t\t\t() => parseQuantityAndUnitFromRawValue( value ),\n\t\t\t[ value ]\n\t\t)[ 1 ] ||\n\t\tunits[ 0 ]?.value ||\n\t\t'px';\n\n\tconst handleSliderChange = ( next ) => {\n\t\tonChange( [ next, selectedUnit ].join( '' ) );\n\t};\n\n\tconst handleUnitChange = ( newUnit ) => {\n\t\t// Attempt to smooth over differences between currentUnit and newUnit.\n\t\t// This should slightly improve the experience of switching between unit types.\n\t\tconst [ currentValue, currentUnit ] =\n\t\t\tparseQuantityAndUnitFromRawValue( value );\n\n\t\tif ( [ 'em', 'rem' ].includes( newUnit ) && currentUnit === 'px' ) {\n\t\t\t// Convert pixel value to an approximate of the new unit, assuming a root size of 16px.\n\t\t\tonChange( ( currentValue / 16 ).toFixed( 2 ) + newUnit );\n\t\t} else if (\n\t\t\t[ 'em', 'rem' ].includes( currentUnit ) &&\n\t\t\tnewUnit === 'px'\n\t\t) {\n\t\t\t// Convert to pixel value assuming a root size of 16px.\n\t\t\tonChange( Math.round( currentValue * 16 ) + newUnit );\n\t\t} else if (\n\t\t\t[ 'vh', 'vw', '%' ].includes( newUnit ) &&\n\t\t\tcurrentValue > 100\n\t\t) {\n\t\t\t// When converting to `vh`, `vw`, or `%` units, cap the new value at 100.\n\t\t\tonChange( 100 + newUnit );\n\t\t}\n\t};\n\n\treturn (\n\t\t<fieldset className=\"block-editor-height-control\">\n\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t{ label }\n\t\t\t</BaseControl.VisualLabel>\n\t\t\t<Flex>\n\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t<UnitControl\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\tonUnitChange={ handleUnitChange }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t/>\n\t\t\t\t</FlexItem>\n\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t<Spacer marginX={ 2 } marginBottom={ 0 }>\n\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\tvalue={ customRangeValue }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\tRANGE_CONTROL_CUSTOM_SETTINGS[ selectedUnit ]\n\t\t\t\t\t\t\t\t\t?.max ?? 100\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tstep={\n\t\t\t\t\t\t\t\tRANGE_CONTROL_CUSTOM_SETTINGS[ selectedUnit ]\n\t\t\t\t\t\t\t\t\t?.step ?? 0.1\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t\tonChange={ handleSliderChange }\n\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Spacer>\n\t\t\t\t</FlexItem>\n\t\t\t</Flex>\n\t\t</fieldset>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/height-control/index.js"],"names":["useMemo","BaseControl","RangeControl","Flex","FlexItem","__experimentalSpacer","Spacer","__experimentalUseCustomUnits","useCustomUnits","__experimentalUnitControl","UnitControl","__experimentalParseQuantityAndUnitFromRawValue","parseQuantityAndUnitFromRawValue","__","useSetting","RANGE_CONTROL_CUSTOM_SETTINGS","px","max","step","vw","vh","em","rem","HeightControl","label","onChange","value","customRangeValue","parseFloat","units","availableUnits","selectedUnit","handleSliderChange","next","join","handleUnitChange","newUnit","currentValue","currentUnit","includes","toFixed","Math","round"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,OAAT,QAAwB,oBAAxB;AACA,SACCC,WADD,EAECC,YAFD,EAGCC,IAHD,EAICC,QAJD,EAKCC,oBAAoB,IAAIC,MALzB,EAMCC,4BAA4B,IAAIC,cANjC,EAOCC,yBAAyB,IAAIC,WAP9B,EAQCC,8CAA8C,IAAIC,gCARnD,QASO,uBATP;AAUA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,gBAAvB;AAEA,MAAMC,6BAA6B,GAAG;AACrCC,EAAAA,EAAE,EAAE;AAAEC,IAAAA,GAAG,EAAE,IAAP;AAAaC,IAAAA,IAAI,EAAE;AAAnB,GADiC;AAErC,OAAK;AAAED,IAAAA,GAAG,EAAE,GAAP;AAAYC,IAAAA,IAAI,EAAE;AAAlB,GAFgC;AAGrCC,EAAAA,EAAE,EAAE;AAAEF,IAAAA,GAAG,EAAE,GAAP;AAAYC,IAAAA,IAAI,EAAE;AAAlB,GAHiC;AAIrCE,EAAAA,EAAE,EAAE;AAAEH,IAAAA,GAAG,EAAE,GAAP;AAAYC,IAAAA,IAAI,EAAE;AAAlB,GAJiC;AAKrCG,EAAAA,EAAE,EAAE;AAAEJ,IAAAA,GAAG,EAAE,EAAP;AAAWC,IAAAA,IAAI,EAAE;AAAjB,GALiC;AAMrCI,EAAAA,GAAG,EAAE;AAAEL,IAAAA,GAAG,EAAE,EAAP;AAAWC,IAAAA,IAAI,EAAE;AAAjB;AANgC,CAAtC;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASK,aAAT,CAAwB;AACtCC,EAAAA,KAAK,GAAGX,EAAE,CAAE,QAAF,CAD4B;AAEtCY,EAAAA,QAFsC;AAGtCC,EAAAA;AAHsC,CAAxB,EAIX;AAAA;;AACH,QAAMC,gBAAgB,GAAGC,UAAU,CAAEF,KAAF,CAAnC;AAEA,QAAMG,KAAK,GAAGrB,cAAc,CAAE;AAC7BsB,IAAAA,cAAc,EAAEhB,UAAU,CAAE,eAAF,CAAV,IAAiC,CAChD,GADgD,EAEhD,IAFgD,EAGhD,IAHgD,EAIhD,KAJgD,EAKhD,IALgD,EAMhD,IANgD;AADpB,GAAF,CAA5B;AAWA,QAAMiB,YAAY,GACjB/B,OAAO,CACN,MAAMY,gCAAgC,CAAEc,KAAF,CADhC,EAEN,CAAEA,KAAF,CAFM,CAAP,CAGG,CAHH,KAIAG,KAAK,CAAE,CAAF,CAAL,EAAYH,KAJZ,IAKA,IAND;;AAQA,QAAMM,kBAAkB,GAAKC,IAAF,IAAY;AACtCR,IAAAA,QAAQ,CAAE,CAAEQ,IAAF,EAAQF,YAAR,EAAuBG,IAAvB,CAA6B,EAA7B,CAAF,CAAR;AACA,GAFD;;AAIA,QAAMC,gBAAgB,GAAKC,OAAF,IAAe;AACvC;AACA;AACA,UAAM,CAAEC,YAAF,EAAgBC,WAAhB,IACL1B,gCAAgC,CAAEc,KAAF,CADjC;;AAGA,QAAK,CAAE,IAAF,EAAQ,KAAR,EAAgBa,QAAhB,CAA0BH,OAA1B,KAAuCE,WAAW,KAAK,IAA5D,EAAmE;AAClE;AACAb,MAAAA,QAAQ,CAAE,CAAEY,YAAY,GAAG,EAAjB,EAAsBG,OAAtB,CAA+B,CAA/B,IAAqCJ,OAAvC,CAAR;AACA,KAHD,MAGO,IACN,CAAE,IAAF,EAAQ,KAAR,EAAgBG,QAAhB,CAA0BD,WAA1B,KACAF,OAAO,KAAK,IAFN,EAGL;AACD;AACAX,MAAAA,QAAQ,CAAEgB,IAAI,CAACC,KAAL,CAAYL,YAAY,GAAG,EAA3B,IAAkCD,OAApC,CAAR;AACA,KANM,MAMA,IACN,CAAE,IAAF,EAAQ,IAAR,EAAc,GAAd,EAAoBG,QAApB,CAA8BH,OAA9B,KACAC,YAAY,GAAG,GAFT,EAGL;AACD;AACAZ,MAAAA,QAAQ,CAAE,MAAMW,OAAR,CAAR;AACA;AACD,GAtBD;;AAwBA,SACC;AAAU,IAAA,SAAS,EAAC;AAApB,KACC,cAAC,WAAD,CAAa,WAAb;AAAyB,IAAA,EAAE,EAAC;AAA5B,KACGZ,KADH,CADD,EAIC,cAAC,IAAD,QACC,cAAC,QAAD;AAAU,IAAA,OAAO;AAAjB,KACC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGE,KADT;AAEC,IAAA,KAAK,EAAGG,KAFT;AAGC,IAAA,QAAQ,EAAGJ,QAHZ;AAIC,IAAA,YAAY,EAAGU,gBAJhB;AAKC,IAAA,GAAG,EAAG,CALP;AAMC,IAAA,IAAI,EAAG;AANR,IADD,CADD,EAWC,cAAC,QAAD;AAAU,IAAA,OAAO;AAAjB,KACC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG,CAAlB;AAAsB,IAAA,YAAY,EAAG;AAArC,KACC,cAAC,YAAD;AACC,IAAA,KAAK,EAAGR,gBADT;AAEC,IAAA,GAAG,EAAG,CAFP;AAGC,IAAA,GAAG,2BACFZ,6BAA6B,CAAEgB,YAAF,CAA7B,EACGd,GAFD,yEAEQ,GALZ;AAOC,IAAA,IAAI,4BACHF,6BAA6B,CAAEgB,YAAF,CAA7B,EACGb,IAFA,2EAEQ,GATb;AAWC,IAAA,cAAc,EAAG,KAXlB;AAYC,IAAA,QAAQ,EAAGc,kBAZZ;AAaC,IAAA,uBAAuB;AAbxB,IADD,CADD,CAXD,CAJD,CADD;AAsCA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\nimport {\n\tBaseControl,\n\tRangeControl,\n\tFlex,\n\tFlexItem,\n\t__experimentalSpacer as Spacer,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport useSetting from '../use-setting';\n\nconst RANGE_CONTROL_CUSTOM_SETTINGS = {\n\tpx: { max: 1000, step: 1 },\n\t'%': { max: 100, step: 1 },\n\tvw: { max: 100, step: 1 },\n\tvh: { max: 100, step: 1 },\n\tem: { max: 50, step: 0.1 },\n\trem: { max: 50, step: 0.1 },\n};\n\n/**\n * HeightControl renders a linked unit control and range control for adjusting the height of a block.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/height-control/README.md\n *\n * @param {Object}                     props\n * @param {?string}                    props.label    A label for the control.\n * @param {( value: string ) => void } props.onChange Called when the height changes.\n * @param {string}                     props.value    The current height value.\n *\n * @return {WPComponent} The component to be rendered.\n */\nexport default function HeightControl( {\n\tlabel = __( 'Height' ),\n\tonChange,\n\tvalue,\n} ) {\n\tconst customRangeValue = parseFloat( value );\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: useSetting( 'spacing.units' ) || [\n\t\t\t'%',\n\t\t\t'px',\n\t\t\t'em',\n\t\t\t'rem',\n\t\t\t'vh',\n\t\t\t'vw',\n\t\t],\n\t} );\n\n\tconst selectedUnit =\n\t\tuseMemo(\n\t\t\t() => parseQuantityAndUnitFromRawValue( value ),\n\t\t\t[ value ]\n\t\t)[ 1 ] ||\n\t\tunits[ 0 ]?.value ||\n\t\t'px';\n\n\tconst handleSliderChange = ( next ) => {\n\t\tonChange( [ next, selectedUnit ].join( '' ) );\n\t};\n\n\tconst handleUnitChange = ( newUnit ) => {\n\t\t// Attempt to smooth over differences between currentUnit and newUnit.\n\t\t// This should slightly improve the experience of switching between unit types.\n\t\tconst [ currentValue, currentUnit ] =\n\t\t\tparseQuantityAndUnitFromRawValue( value );\n\n\t\tif ( [ 'em', 'rem' ].includes( newUnit ) && currentUnit === 'px' ) {\n\t\t\t// Convert pixel value to an approximate of the new unit, assuming a root size of 16px.\n\t\t\tonChange( ( currentValue / 16 ).toFixed( 2 ) + newUnit );\n\t\t} else if (\n\t\t\t[ 'em', 'rem' ].includes( currentUnit ) &&\n\t\t\tnewUnit === 'px'\n\t\t) {\n\t\t\t// Convert to pixel value assuming a root size of 16px.\n\t\t\tonChange( Math.round( currentValue * 16 ) + newUnit );\n\t\t} else if (\n\t\t\t[ 'vh', 'vw', '%' ].includes( newUnit ) &&\n\t\t\tcurrentValue > 100\n\t\t) {\n\t\t\t// When converting to `vh`, `vw`, or `%` units, cap the new value at 100.\n\t\t\tonChange( 100 + newUnit );\n\t\t}\n\t};\n\n\treturn (\n\t\t<fieldset className=\"block-editor-height-control\">\n\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t{ label }\n\t\t\t</BaseControl.VisualLabel>\n\t\t\t<Flex>\n\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t<UnitControl\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\tonUnitChange={ handleUnitChange }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t/>\n\t\t\t\t</FlexItem>\n\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t<Spacer marginX={ 2 } marginBottom={ 0 }>\n\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\tvalue={ customRangeValue }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\tRANGE_CONTROL_CUSTOM_SETTINGS[ selectedUnit ]\n\t\t\t\t\t\t\t\t\t?.max ?? 100\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tstep={\n\t\t\t\t\t\t\t\tRANGE_CONTROL_CUSTOM_SETTINGS[ selectedUnit ]\n\t\t\t\t\t\t\t\t\t?.step ?? 0.1\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t\tonChange={ handleSliderChange }\n\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Spacer>\n\t\t\t\t</FlexItem>\n\t\t\t</Flex>\n\t\t</fieldset>\n\t);\n}\n"]}

package/build-module/components/iframe/index.js

@@ -9,7 +9,7 @@ import classnames from 'classnames';
  * WordPress dependencies
  */
 
-import { useState, createPortal, forwardRef, useMemo, useReducer, renderToString } from '@wordpress/element';
+import { useState, createPortal, forwardRef, useMemo, useReducer, useEffect } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 import { useResizeObserver, useMergeRefs, useRefEffect, useDisabled } from '@wordpress/compose';
 import { __experimentalStyleProvider as StyleProvider } from '@wordpress/components';
@@ -80,11 +80,10 @@ function useParsedAssets(html) {
   }, [html]);
 }
 
-async function loadScript(head, _ref) {
-  let {
-    id,
-    src
-  } = _ref;
+async function loadScript(head, {
+  id,
+  src
+}) {
   return new Promise((resolve, reject) => {
     const script = head.ownerDocument.createElement('script');
     script.id = id;
@@ -103,30 +102,25 @@ async function loadScript(head, _ref) {
   });
 }
 
-function Iframe(_ref2) {
-  var _props$style, _props$style2, _props$style3, _props$style4;
-
-  let {
-    contentRef,
-    children,
-    head,
-    tabIndex = 0,
-    scale = 1,
-    frameSize = 0,
-    expand = false,
-    readonly,
-    forwardedRef: ref,
-    ...props
-  } = _ref2;
+function Iframe({
+  contentRef,
+  children,
+  tabIndex = 0,
+  scale = 1,
+  frameSize = 0,
+  expand = false,
+  readonly,
+  forwardedRef: ref,
+  ...props
+}) {
+  var _assets$styles;
+
   const assets = useSelect(select => select(blockEditorStore).getSettings().__unstableResolvedAssets, []);
   const [, forceRender] = useReducer(() => ({}));
   const [iframeDocument, setIframeDocument] = useState();
   const [bodyClasses, setBodyClasses] = useState([]);
-  const styles = useParsedAssets(assets === null || assets === void 0 ? void 0 : assets.styles);
-  const styleIds = styles.map(style => style.id);
   const compatStyles = useCompatibilityStyles();
-  const neededCompatStyles = compatStyles.filter(style => !styleIds.includes(style.id));
-  const scripts = useParsedAssets(assets === null || assets === void 0 ? void 0 : assets.scripts);
+  const scripts = useParsedAssets(assets?.scripts);
   const clearerRef = useBlockSelectionClearer();
   const [before, writingFlowRef, after] = useWritingFlow();
   const [contentResizeListener, {
@@ -139,21 +133,15 @@ function Iframe(_ref2) {
       event.preventDefault();
     }
 
-    function setDocumentIfReady() {
+    function onLoad() {
       const {
         contentDocument,
         ownerDocument
       } = node;
       const {
-        readyState,
         documentElement
       } = contentDocument;
       iFrameDocument = contentDocument;
-
-      if (readyState !== 'interactive' && readyState !== 'complete') {
-        return false;
-      }
-
       bubbleEvents(contentDocument);
       setIframeDocument(contentDocument);
       clearerRef(documentElement); // Ideally ALL classes that are added through get_body_class should
@@ -162,21 +150,27 @@ function Iframe(_ref2) {
 
       setBodyClasses(Array.from(ownerDocument.body.classList).filter(name => name.startsWith('admin-color-') || name.startsWith('post-type-') || name === 'wp-embed-responsive'));
       contentDocument.dir = ownerDocument.dir;
-      documentElement.removeChild(contentDocument.head);
       documentElement.removeChild(contentDocument.body);
+
+      for (const compatStyle of compatStyles) {
+        if (contentDocument.getElementById(compatStyle.id)) {
+          continue;
+        }
+
+        contentDocument.head.appendChild(compatStyle.cloneNode(true)); // eslint-disable-next-line no-console
+
+        console.warn(`${compatStyle.id} was added to the iframe incorrectly. Please use block.json or enqueue_block_assets to add styles to the iframe.`, compatStyle);
+      }
+
       iFrameDocument.addEventListener('dragover', preventFileDropDefault, false);
       iFrameDocument.addEventListener('drop', preventFileDropDefault, false);
-      return true;
-    } // Document set with srcDoc is not immediately ready.
-
+    }
 
-    node.addEventListener('load', setDocumentIfReady);
+    node.addEventListener('load', onLoad);
     return () => {
-      var _iFrameDocument, _iFrameDocument2;
-
-      node.removeEventListener('load', setDocumentIfReady);
-      (_iFrameDocument = iFrameDocument) === null || _iFrameDocument === void 0 ? void 0 : _iFrameDocument.removeEventListener('dragover', preventFileDropDefault);
-      (_iFrameDocument2 = iFrameDocument) === null || _iFrameDocument2 === void 0 ? void 0 : _iFrameDocument2.removeEventListener('drop', preventFileDropDefault);
+      node.removeEventListener('load', onLoad);
+      iFrameDocument?.removeEventListener('dragover', preventFileDropDefault);
+      iFrameDocument?.removeEventListener('drop', preventFileDropDefault);
     };
   }, []);
   const headRef = useRefEffect(element => {
@@ -189,49 +183,29 @@ function Iframe(_ref2) {
   const disabledRef = useDisabled({
     isDisabled: !readonly
   });
-  const bodyRef = useMergeRefs([contentRef, clearerRef, writingFlowRef, disabledRef]);
-  const styleAssets = createElement(Fragment, null, createElement("style", null, 'html{height:auto!important;}body{margin:0}'), [...styles, ...neededCompatStyles].map(_ref3 => {
-    let {
-      tagName,
-      href,
-      id,
-      rel,
-      media,
-      textContent
-    } = _ref3;
-    const TagName = tagName.toLowerCase();
-
-    if (TagName === 'style') {
-      return createElement(TagName, {
-        id,
-        key: id
-      }, textContent);
-    }
-
-    return createElement(TagName, {
-      href,
-      id,
-      rel,
-      media,
-      key: id
-    });
-  })); // Correct doctype is required to enable rendering in standards
+  const bodyRef = useMergeRefs([contentRef, clearerRef, writingFlowRef, disabledRef, headRef]); // Correct doctype is required to enable rendering in standards
   // mode. Also preload the styles to avoid a flash of unstyled
   // content.
 
-  const srcDoc = useMemo(() => {
-    return '<!doctype html>' + renderToString(styleAssets);
-  }, []); // We need to counter the margin created by scaling the iframe. If the scale
+  const html = '<!doctype html>' + '<style>html{height:auto!important;}body{margin:0}</style>' + ((_assets$styles = assets?.styles) !== null && _assets$styles !== void 0 ? _assets$styles : '');
+  const [src, cleanup] = useMemo(() => {
+    const _src = URL.createObjectURL(new window.Blob([html], {
+      type: 'text/html'
+    }));
+
+    return [_src, () => URL.revokeObjectURL(_src)];
+  }, [html]);
+  useEffect(() => cleanup, [cleanup]); // We need to counter the margin created by scaling the iframe. If the scale
   // is e.g. 0.45, then the top + bottom margin is 0.55 (1 - scale). Just the
   // top or bottom margin is 0.55 / 2 ((1 - scale) / 2).
 
   const marginFromScaling = contentHeight * (1 - scale) / 2;
   return createElement(Fragment, null, tabIndex >= 0 && before, createElement("iframe", _extends({}, props, {
     style: { ...props.style,
-      height: expand ? contentHeight : (_props$style = props.style) === null || _props$style === void 0 ? void 0 : _props$style.height,
-      marginTop: scale ? -marginFromScaling + frameSize : (_props$style2 = props.style) === null || _props$style2 === void 0 ? void 0 : _props$style2.marginTop,
-      marginBottom: scale ? -marginFromScaling + frameSize : (_props$style3 = props.style) === null || _props$style3 === void 0 ? void 0 : _props$style3.marginBottom,
-      transform: scale ? `scale( ${scale} )` : (_props$style4 = props.style) === null || _props$style4 === void 0 ? void 0 : _props$style4.transform,
+      height: expand ? contentHeight : props.style?.height,
+      marginTop: scale !== 1 ? -marginFromScaling + frameSize : props.style?.marginTop,
+      marginBottom: scale !== 1 ? -marginFromScaling + frameSize : props.style?.marginBottom,
+      transform: scale !== 1 ? `scale( ${scale} )` : props.style?.transform,
       transition: 'all .3s'
     },
     ref: useMergeRefs([ref, setRef]),
@@ -239,16 +213,14 @@ function Iframe(_ref2) {
     // mode. Also preload the styles to avoid a flash of unstyled
     // content.
     ,
-    srcDoc: srcDoc,
+    src: src,
     title: __('Editor canvas')
-  }), iframeDocument && createPortal(createElement(Fragment, null, createElement("head", {
-    ref: headRef
-  }, styleAssets, head), createElement("body", {
+  }), iframeDocument && createPortal(createElement("body", {
     ref: bodyRef,
     className: classnames('block-editor-iframe__body', 'editor-styles-wrapper', ...bodyClasses)
   }, contentResizeListener, createElement(StyleProvider, {
     document: iframeDocument
-  }, children))), iframeDocument.documentElement)), tabIndex >= 0 && after);
+  }, children)), iframeDocument.documentElement)), tabIndex >= 0 && after);
 }
 
 function IframeIfReady(props, ref) {

package/build-module/components/iframe/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/iframe/index.js"],"names":["classnames","useState","createPortal","forwardRef","useMemo","useReducer","renderToString","__","useResizeObserver","useMergeRefs","useRefEffect","useDisabled","__experimentalStyleProvider","StyleProvider","useSelect","useBlockSelectionClearer","useWritingFlow","useCompatibilityStyles","store","blockEditorStore","bubbleEvents","doc","defaultView","frameElement","bubbleEvent","event","prototype","Object","getPrototypeOf","constructorName","constructor","name","Constructor","window","init","key","MouseEvent","rect","getBoundingClientRect","clientX","left","clientY","top","newEvent","type","cancelled","dispatchEvent","preventDefault","eventTypes","addEventListener","useParsedAssets","html","document","implementation","createHTMLDocument","body","innerHTML","Array","from","children","loadScript","head","id","src","Promise","resolve","reject","script","ownerDocument","createElement","onload","onerror","appendChild","Iframe","contentRef","tabIndex","scale","frameSize","expand","readonly","forwardedRef","ref","props","assets","select","getSettings","__unstableResolvedAssets","forceRender","iframeDocument","setIframeDocument","bodyClasses","setBodyClasses","styles","styleIds","map","style","compatStyles","neededCompatStyles","filter","includes","scripts","clearerRef","before","writingFlowRef","after","contentResizeListener","height","contentHeight","setRef","node","iFrameDocument","preventFileDropDefault","setDocumentIfReady","contentDocument","readyState","documentElement","classList","startsWith","dir","removeChild","removeEventListener","headRef","element","reduce","promise","then","finally","disabledRef","isDisabled","bodyRef","styleAssets","tagName","href","rel","media","textContent","TagName","toLowerCase","srcDoc","marginFromScaling","marginTop","marginBottom","transform","transition","IframeIfReady","isInitialised","__internalIsInitialized"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseState,\n\tcreatePortal,\n\tforwardRef,\n\tuseMemo,\n\tuseReducer,\n\trenderToString,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tuseResizeObserver,\n\tuseMergeRefs,\n\tuseRefEffect,\n\tuseDisabled,\n} from '@wordpress/compose';\nimport { __experimentalStyleProvider as StyleProvider } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\nimport { useWritingFlow } from '../writing-flow';\nimport { useCompatibilityStyles } from './use-compatibility-styles';\nimport { store as blockEditorStore } from '../../store';\n\n/**\n * Bubbles some event types (keydown, keypress, and dragover) to parent document\n * document to ensure that the keyboard shortcuts and drag and drop work.\n *\n * Ideally, we should remove event bubbling in the future. Keyboard shortcuts\n * should be context dependent, e.g. actions on blocks like Cmd+A should not\n * work globally outside the block editor.\n *\n * @param {Document} doc Document to attach listeners to.\n */\nfunction bubbleEvents( doc ) {\n\tconst { defaultView } = doc;\n\tconst { frameElement } = defaultView;\n\n\tfunction bubbleEvent( event ) {\n\t\tconst prototype = Object.getPrototypeOf( event );\n\t\tconst constructorName = prototype.constructor.name;\n\t\tconst Constructor = window[ constructorName ];\n\n\t\tconst init = {};\n\n\t\tfor ( const key in event ) {\n\t\t\tinit[ key ] = event[ key ];\n\t\t}\n\n\t\tif ( event instanceof defaultView.MouseEvent ) {\n\t\t\tconst rect = frameElement.getBoundingClientRect();\n\t\t\tinit.clientX += rect.left;\n\t\t\tinit.clientY += rect.top;\n\t\t}\n\n\t\tconst newEvent = new Constructor( event.type, init );\n\t\tconst cancelled = ! frameElement.dispatchEvent( newEvent );\n\n\t\tif ( cancelled ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tconst eventTypes = [ 'dragover', 'mousemove' ];\n\n\tfor ( const name of eventTypes ) {\n\t\tdoc.addEventListener( name, bubbleEvent );\n\t}\n}\n\nfunction useParsedAssets( html ) {\n\treturn useMemo( () => {\n\t\tconst doc = document.implementation.createHTMLDocument( '' );\n\t\tdoc.body.innerHTML = html;\n\t\treturn Array.from( doc.body.children );\n\t}, [ html ] );\n}\n\nasync function loadScript( head, { id, src } ) {\n\treturn new Promise( ( resolve, reject ) => {\n\t\tconst script = head.ownerDocument.createElement( 'script' );\n\t\tscript.id = id;\n\t\tif ( src ) {\n\t\t\tscript.src = src;\n\t\t\tscript.onload = () => resolve();\n\t\t\tscript.onerror = () => reject();\n\t\t} else {\n\t\t\tresolve();\n\t\t}\n\t\thead.appendChild( script );\n\t} );\n}\n\nfunction Iframe( {\n\tcontentRef,\n\tchildren,\n\thead,\n\ttabIndex = 0,\n\tscale = 1,\n\tframeSize = 0,\n\texpand = false,\n\treadonly,\n\tforwardedRef: ref,\n\t...props\n} ) {\n\tconst assets = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().__unstableResolvedAssets,\n\t\t[]\n\t);\n\tconst [ , forceRender ] = useReducer( () => ( {} ) );\n\tconst [ iframeDocument, setIframeDocument ] = useState();\n\tconst [ bodyClasses, setBodyClasses ] = useState( [] );\n\tconst styles = useParsedAssets( assets?.styles );\n\tconst styleIds = styles.map( ( style ) => style.id );\n\tconst compatStyles = useCompatibilityStyles();\n\tconst neededCompatStyles = compatStyles.filter(\n\t\t( style ) => ! styleIds.includes( style.id )\n\t);\n\tconst scripts = useParsedAssets( assets?.scripts );\n\tconst clearerRef = useBlockSelectionClearer();\n\tconst [ before, writingFlowRef, after ] = useWritingFlow();\n\tconst [ contentResizeListener, { height: contentHeight } ] =\n\t\tuseResizeObserver();\n\tconst setRef = useRefEffect( ( node ) => {\n\t\tlet iFrameDocument;\n\t\t// Prevent the default browser action for files dropped outside of dropzones.\n\t\tfunction preventFileDropDefault( event ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t\tfunction setDocumentIfReady() {\n\t\t\tconst { contentDocument, ownerDocument } = node;\n\t\t\tconst { readyState, documentElement } = contentDocument;\n\t\t\tiFrameDocument = contentDocument;\n\n\t\t\tif ( readyState !== 'interactive' && readyState !== 'complete' ) {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\tbubbleEvents( contentDocument );\n\t\t\tsetIframeDocument( contentDocument );\n\t\t\tclearerRef( documentElement );\n\n\t\t\t// Ideally ALL classes that are added through get_body_class should\n\t\t\t// be added in the editor too, which we'll somehow have to get from\n\t\t\t// the server in the future (which will run the PHP filters).\n\t\t\tsetBodyClasses(\n\t\t\t\tArray.from( ownerDocument.body.classList ).filter(\n\t\t\t\t\t( name ) =>\n\t\t\t\t\t\tname.startsWith( 'admin-color-' ) ||\n\t\t\t\t\t\tname.startsWith( 'post-type-' ) ||\n\t\t\t\t\t\tname === 'wp-embed-responsive'\n\t\t\t\t)\n\t\t\t);\n\n\t\t\tcontentDocument.dir = ownerDocument.dir;\n\t\t\tdocumentElement.removeChild( contentDocument.head );\n\t\t\tdocumentElement.removeChild( contentDocument.body );\n\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\treturn true;\n\t\t}\n\n\t\t// Document set with srcDoc is not immediately ready.\n\t\tnode.addEventListener( 'load', setDocumentIfReady );\n\n\t\treturn () => {\n\t\t\tnode.removeEventListener( 'load', setDocumentIfReady );\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t};\n\t}, [] );\n\n\tconst headRef = useRefEffect( ( element ) => {\n\t\tscripts\n\t\t\t.reduce(\n\t\t\t\t( promise, script ) =>\n\t\t\t\t\tpromise.then( () => loadScript( element, script ) ),\n\t\t\t\tPromise.resolve()\n\t\t\t)\n\t\t\t.finally( () => {\n\t\t\t\t// When script are loaded, re-render blocks to allow them\n\t\t\t\t// to initialise.\n\t\t\t\tforceRender();\n\t\t\t} );\n\t}, [] );\n\tconst disabledRef = useDisabled( { isDisabled: ! readonly } );\n\tconst bodyRef = useMergeRefs( [\n\t\tcontentRef,\n\t\tclearerRef,\n\t\twritingFlowRef,\n\t\tdisabledRef,\n\t] );\n\n\tconst styleAssets = (\n\t\t<>\n\t\t\t<style>{ 'html{height:auto!important;}body{margin:0}' }</style>\n\t\t\t{ [ ...styles, ...neededCompatStyles ].map(\n\t\t\t\t( { tagName, href, id, rel, media, textContent } ) => {\n\t\t\t\t\tconst TagName = tagName.toLowerCase();\n\n\t\t\t\t\tif ( TagName === 'style' ) {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<TagName { ...{ id } } key={ id }>\n\t\t\t\t\t\t\t\t{ textContent }\n\t\t\t\t\t\t\t</TagName>\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<TagName { ...{ href, id, rel, media } } key={ id } />\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t) }\n\t\t</>\n\t);\n\n\t// Correct doctype is required to enable rendering in standards\n\t// mode. Also preload the styles to avoid a flash of unstyled\n\t// content.\n\tconst srcDoc = useMemo( () => {\n\t\treturn '<!doctype html>' + renderToString( styleAssets );\n\t}, [] );\n\n\t// We need to counter the margin created by scaling the iframe. If the scale\n\t// is e.g. 0.45, then the top + bottom margin is 0.55 (1 - scale). Just the\n\t// top or bottom margin is 0.55 / 2 ((1 - scale) / 2).\n\tconst marginFromScaling = ( contentHeight * ( 1 - scale ) ) / 2;\n\n\treturn (\n\t\t<>\n\t\t\t{ tabIndex >= 0 && before }\n\t\t\t<iframe\n\t\t\t\t{ ...props }\n\t\t\t\tstyle={ {\n\t\t\t\t\t...props.style,\n\t\t\t\t\theight: expand ? contentHeight : props.style?.height,\n\t\t\t\t\tmarginTop: scale\n\t\t\t\t\t\t? -marginFromScaling + frameSize\n\t\t\t\t\t\t: props.style?.marginTop,\n\t\t\t\t\tmarginBottom: scale\n\t\t\t\t\t\t? -marginFromScaling + frameSize\n\t\t\t\t\t\t: props.style?.marginBottom,\n\t\t\t\t\ttransform: scale\n\t\t\t\t\t\t? `scale( ${ scale } )`\n\t\t\t\t\t\t: props.style?.transform,\n\t\t\t\t\ttransition: 'all .3s',\n\t\t\t\t} }\n\t\t\t\tref={ useMergeRefs( [ ref, setRef ] ) }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t// Correct doctype is required to enable rendering in standards\n\t\t\t\t// mode. Also preload the styles to avoid a flash of unstyled\n\t\t\t\t// content.\n\t\t\t\tsrcDoc={ srcDoc }\n\t\t\t\ttitle={ __( 'Editor canvas' ) }\n\t\t\t>\n\t\t\t\t{ iframeDocument &&\n\t\t\t\t\tcreatePortal(\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<head ref={ headRef }>\n\t\t\t\t\t\t\t\t{ styleAssets }\n\t\t\t\t\t\t\t\t{ head }\n\t\t\t\t\t\t\t</head>\n\t\t\t\t\t\t\t<body\n\t\t\t\t\t\t\t\tref={ bodyRef }\n\t\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t\t'block-editor-iframe__body',\n\t\t\t\t\t\t\t\t\t'editor-styles-wrapper',\n\t\t\t\t\t\t\t\t\t...bodyClasses\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ contentResizeListener }\n\t\t\t\t\t\t\t\t<StyleProvider document={ iframeDocument }>\n\t\t\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t\t\t</StyleProvider>\n\t\t\t\t\t\t\t</body>\n\t\t\t\t\t\t</>,\n\t\t\t\t\t\tiframeDocument.documentElement\n\t\t\t\t\t) }\n\t\t\t</iframe>\n\t\t\t{ tabIndex >= 0 && after }\n\t\t</>\n\t);\n}\n\nfunction IframeIfReady( props, ref ) {\n\tconst isInitialised = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().__internalIsInitialized,\n\t\t[]\n\t);\n\n\t// We shouldn't render the iframe until the editor settings are initialised.\n\t// The initial settings are needed to get the styles for the srcDoc, which\n\t// cannot be changed after the iframe is mounted. srcDoc is used to to set\n\t// the initial iframe HTML, which is required to avoid a flash of unstyled\n\t// content.\n\tif ( ! isInitialised ) {\n\t\treturn null;\n\t}\n\n\treturn <Iframe { ...props } forwardedRef={ ref } />;\n}\n\nexport default forwardRef( IframeIfReady );\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/iframe/index.js"],"names":["classnames","useState","createPortal","forwardRef","useMemo","useReducer","useEffect","__","useResizeObserver","useMergeRefs","useRefEffect","useDisabled","__experimentalStyleProvider","StyleProvider","useSelect","useBlockSelectionClearer","useWritingFlow","useCompatibilityStyles","store","blockEditorStore","bubbleEvents","doc","defaultView","frameElement","bubbleEvent","event","prototype","Object","getPrototypeOf","constructorName","constructor","name","Constructor","window","init","key","MouseEvent","rect","getBoundingClientRect","clientX","left","clientY","top","newEvent","type","cancelled","dispatchEvent","preventDefault","eventTypes","addEventListener","useParsedAssets","html","document","implementation","createHTMLDocument","body","innerHTML","Array","from","children","loadScript","head","id","src","Promise","resolve","reject","script","ownerDocument","createElement","onload","onerror","appendChild","Iframe","contentRef","tabIndex","scale","frameSize","expand","readonly","forwardedRef","ref","props","assets","select","getSettings","__unstableResolvedAssets","forceRender","iframeDocument","setIframeDocument","bodyClasses","setBodyClasses","compatStyles","scripts","clearerRef","before","writingFlowRef","after","contentResizeListener","height","contentHeight","setRef","node","iFrameDocument","preventFileDropDefault","onLoad","contentDocument","documentElement","classList","filter","startsWith","dir","removeChild","compatStyle","getElementById","cloneNode","console","warn","removeEventListener","headRef","element","reduce","promise","then","finally","disabledRef","isDisabled","bodyRef","styles","cleanup","_src","URL","createObjectURL","Blob","revokeObjectURL","marginFromScaling","style","marginTop","marginBottom","transform","transition","IframeIfReady","isInitialised","__internalIsInitialized"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseState,\n\tcreatePortal,\n\tforwardRef,\n\tuseMemo,\n\tuseReducer,\n\tuseEffect,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tuseResizeObserver,\n\tuseMergeRefs,\n\tuseRefEffect,\n\tuseDisabled,\n} from '@wordpress/compose';\nimport { __experimentalStyleProvider as StyleProvider } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\nimport { useWritingFlow } from '../writing-flow';\nimport { useCompatibilityStyles } from './use-compatibility-styles';\nimport { store as blockEditorStore } from '../../store';\n\n/**\n * Bubbles some event types (keydown, keypress, and dragover) to parent document\n * document to ensure that the keyboard shortcuts and drag and drop work.\n *\n * Ideally, we should remove event bubbling in the future. Keyboard shortcuts\n * should be context dependent, e.g. actions on blocks like Cmd+A should not\n * work globally outside the block editor.\n *\n * @param {Document} doc Document to attach listeners to.\n */\nfunction bubbleEvents( doc ) {\n\tconst { defaultView } = doc;\n\tconst { frameElement } = defaultView;\n\n\tfunction bubbleEvent( event ) {\n\t\tconst prototype = Object.getPrototypeOf( event );\n\t\tconst constructorName = prototype.constructor.name;\n\t\tconst Constructor = window[ constructorName ];\n\n\t\tconst init = {};\n\n\t\tfor ( const key in event ) {\n\t\t\tinit[ key ] = event[ key ];\n\t\t}\n\n\t\tif ( event instanceof defaultView.MouseEvent ) {\n\t\t\tconst rect = frameElement.getBoundingClientRect();\n\t\t\tinit.clientX += rect.left;\n\t\t\tinit.clientY += rect.top;\n\t\t}\n\n\t\tconst newEvent = new Constructor( event.type, init );\n\t\tconst cancelled = ! frameElement.dispatchEvent( newEvent );\n\n\t\tif ( cancelled ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tconst eventTypes = [ 'dragover', 'mousemove' ];\n\n\tfor ( const name of eventTypes ) {\n\t\tdoc.addEventListener( name, bubbleEvent );\n\t}\n}\n\nfunction useParsedAssets( html ) {\n\treturn useMemo( () => {\n\t\tconst doc = document.implementation.createHTMLDocument( '' );\n\t\tdoc.body.innerHTML = html;\n\t\treturn Array.from( doc.body.children );\n\t}, [ html ] );\n}\n\nasync function loadScript( head, { id, src } ) {\n\treturn new Promise( ( resolve, reject ) => {\n\t\tconst script = head.ownerDocument.createElement( 'script' );\n\t\tscript.id = id;\n\t\tif ( src ) {\n\t\t\tscript.src = src;\n\t\t\tscript.onload = () => resolve();\n\t\t\tscript.onerror = () => reject();\n\t\t} else {\n\t\t\tresolve();\n\t\t}\n\t\thead.appendChild( script );\n\t} );\n}\n\nfunction Iframe( {\n\tcontentRef,\n\tchildren,\n\ttabIndex = 0,\n\tscale = 1,\n\tframeSize = 0,\n\texpand = false,\n\treadonly,\n\tforwardedRef: ref,\n\t...props\n} ) {\n\tconst assets = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().__unstableResolvedAssets,\n\t\t[]\n\t);\n\tconst [ , forceRender ] = useReducer( () => ( {} ) );\n\tconst [ iframeDocument, setIframeDocument ] = useState();\n\tconst [ bodyClasses, setBodyClasses ] = useState( [] );\n\tconst compatStyles = useCompatibilityStyles();\n\tconst scripts = useParsedAssets( assets?.scripts );\n\tconst clearerRef = useBlockSelectionClearer();\n\tconst [ before, writingFlowRef, after ] = useWritingFlow();\n\tconst [ contentResizeListener, { height: contentHeight } ] =\n\t\tuseResizeObserver();\n\tconst setRef = useRefEffect( ( node ) => {\n\t\tlet iFrameDocument;\n\t\t// Prevent the default browser action for files dropped outside of dropzones.\n\t\tfunction preventFileDropDefault( event ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t\tfunction onLoad() {\n\t\t\tconst { contentDocument, ownerDocument } = node;\n\t\t\tconst { documentElement } = contentDocument;\n\t\t\tiFrameDocument = contentDocument;\n\n\t\t\tbubbleEvents( contentDocument );\n\t\t\tsetIframeDocument( contentDocument );\n\t\t\tclearerRef( documentElement );\n\n\t\t\t// Ideally ALL classes that are added through get_body_class should\n\t\t\t// be added in the editor too, which we'll somehow have to get from\n\t\t\t// the server in the future (which will run the PHP filters).\n\t\t\tsetBodyClasses(\n\t\t\t\tArray.from( ownerDocument.body.classList ).filter(\n\t\t\t\t\t( name ) =>\n\t\t\t\t\t\tname.startsWith( 'admin-color-' ) ||\n\t\t\t\t\t\tname.startsWith( 'post-type-' ) ||\n\t\t\t\t\t\tname === 'wp-embed-responsive'\n\t\t\t\t)\n\t\t\t);\n\n\t\t\tcontentDocument.dir = ownerDocument.dir;\n\t\t\tdocumentElement.removeChild( contentDocument.body );\n\n\t\t\tfor ( const compatStyle of compatStyles ) {\n\t\t\t\tif ( contentDocument.getElementById( compatStyle.id ) ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tcontentDocument.head.appendChild(\n\t\t\t\t\tcompatStyle.cloneNode( true )\n\t\t\t\t);\n\n\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\tconsole.warn(\n\t\t\t\t\t`${ compatStyle.id } was added to the iframe incorrectly. Please use block.json or enqueue_block_assets to add styles to the iframe.`,\n\t\t\t\t\tcompatStyle\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t}\n\n\t\tnode.addEventListener( 'load', onLoad );\n\n\t\treturn () => {\n\t\t\tnode.removeEventListener( 'load', onLoad );\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t};\n\t}, [] );\n\n\tconst headRef = useRefEffect( ( element ) => {\n\t\tscripts\n\t\t\t.reduce(\n\t\t\t\t( promise, script ) =>\n\t\t\t\t\tpromise.then( () => loadScript( element, script ) ),\n\t\t\t\tPromise.resolve()\n\t\t\t)\n\t\t\t.finally( () => {\n\t\t\t\t// When script are loaded, re-render blocks to allow them\n\t\t\t\t// to initialise.\n\t\t\t\tforceRender();\n\t\t\t} );\n\t}, [] );\n\tconst disabledRef = useDisabled( { isDisabled: ! readonly } );\n\tconst bodyRef = useMergeRefs( [\n\t\tcontentRef,\n\t\tclearerRef,\n\t\twritingFlowRef,\n\t\tdisabledRef,\n\t\theadRef,\n\t] );\n\n\t// Correct doctype is required to enable rendering in standards\n\t// mode. Also preload the styles to avoid a flash of unstyled\n\t// content.\n\tconst html =\n\t\t'<!doctype html>' +\n\t\t'<style>html{height:auto!important;}body{margin:0}</style>' +\n\t\t( assets?.styles ?? '' );\n\n\tconst [ src, cleanup ] = useMemo( () => {\n\t\tconst _src = URL.createObjectURL(\n\t\t\tnew window.Blob( [ html ], { type: 'text/html' } )\n\t\t);\n\t\treturn [ _src, () => URL.revokeObjectURL( _src ) ];\n\t}, [ html ] );\n\n\tuseEffect( () => cleanup, [ cleanup ] );\n\n\t// We need to counter the margin created by scaling the iframe. If the scale\n\t// is e.g. 0.45, then the top + bottom margin is 0.55 (1 - scale). Just the\n\t// top or bottom margin is 0.55 / 2 ((1 - scale) / 2).\n\tconst marginFromScaling = ( contentHeight * ( 1 - scale ) ) / 2;\n\n\treturn (\n\t\t<>\n\t\t\t{ tabIndex >= 0 && before }\n\t\t\t<iframe\n\t\t\t\t{ ...props }\n\t\t\t\tstyle={ {\n\t\t\t\t\t...props.style,\n\t\t\t\t\theight: expand ? contentHeight : props.style?.height,\n\t\t\t\t\tmarginTop:\n\t\t\t\t\t\tscale !== 1\n\t\t\t\t\t\t\t? -marginFromScaling + frameSize\n\t\t\t\t\t\t\t: props.style?.marginTop,\n\t\t\t\t\tmarginBottom:\n\t\t\t\t\t\tscale !== 1\n\t\t\t\t\t\t\t? -marginFromScaling + frameSize\n\t\t\t\t\t\t\t: props.style?.marginBottom,\n\t\t\t\t\ttransform:\n\t\t\t\t\t\tscale !== 1\n\t\t\t\t\t\t\t? `scale( ${ scale } )`\n\t\t\t\t\t\t\t: props.style?.transform,\n\t\t\t\t\ttransition: 'all .3s',\n\t\t\t\t} }\n\t\t\t\tref={ useMergeRefs( [ ref, setRef ] ) }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t// Correct doctype is required to enable rendering in standards\n\t\t\t\t// mode. Also preload the styles to avoid a flash of unstyled\n\t\t\t\t// content.\n\t\t\t\tsrc={ src }\n\t\t\t\ttitle={ __( 'Editor canvas' ) }\n\t\t\t>\n\t\t\t\t{ iframeDocument &&\n\t\t\t\t\tcreatePortal(\n\t\t\t\t\t\t<body\n\t\t\t\t\t\t\tref={ bodyRef }\n\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t'block-editor-iframe__body',\n\t\t\t\t\t\t\t\t'editor-styles-wrapper',\n\t\t\t\t\t\t\t\t...bodyClasses\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ contentResizeListener }\n\t\t\t\t\t\t\t<StyleProvider document={ iframeDocument }>\n\t\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t\t</StyleProvider>\n\t\t\t\t\t\t</body>,\n\t\t\t\t\t\tiframeDocument.documentElement\n\t\t\t\t\t) }\n\t\t\t</iframe>\n\t\t\t{ tabIndex >= 0 && after }\n\t\t</>\n\t);\n}\n\nfunction IframeIfReady( props, ref ) {\n\tconst isInitialised = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().__internalIsInitialized,\n\t\t[]\n\t);\n\n\t// We shouldn't render the iframe until the editor settings are initialised.\n\t// The initial settings are needed to get the styles for the srcDoc, which\n\t// cannot be changed after the iframe is mounted. srcDoc is used to to set\n\t// the initial iframe HTML, which is required to avoid a flash of unstyled\n\t// content.\n\tif ( ! isInitialised ) {\n\t\treturn null;\n\t}\n\n\treturn <Iframe { ...props } forwardedRef={ ref } />;\n}\n\nexport default forwardRef( IframeIfReady );\n"]}

package/build-module/components/iframe/use-compatibility-styles.js

@@ -37,12 +37,6 @@ export function useCompatibilityStyles() {
 
       if (!cssRules) {
         return accumulator;
-      } // Generally, ignore inline styles. We add inline styles belonging to a
-      // stylesheet later, which may or may not match the selectors.
-
-
-      if (ownerNode.tagName !== 'LINK') {
-        return accumulator;
       } // Don't try to add the reset styles, which were removed as a dependency
       // from `edit-blocks` for the iframe since we don't need to reset admin
       // styles.
@@ -53,13 +47,11 @@ export function useCompatibilityStyles() {
       }
 
       function matchFromRules(_cssRules) {
-        return Array.from(_cssRules).find(_ref => {
-          let {
-            selectorText,
-            conditionText,
-            cssRules: __cssRules
-          } = _ref;
-
+        return Array.from(_cssRules).find(({
+          selectorText,
+          conditionText,
+          cssRules: __cssRules
+        }) => {
           // If the rule is conditional then it will not have selector text.
           // Recurse into child CSS ruleset to determine selector eligibility.
           if (conditionText) {
@@ -71,15 +63,32 @@ export function useCompatibilityStyles() {
       }
 
       if (matchFromRules(cssRules)) {
-        // Display warning once we have a way to add style dependencies to the editor.
-        // See: https://github.com/WordPress/gutenberg/pull/37466.
-        accumulator.push(ownerNode.cloneNode(true)); // Add inline styles belonging to the stylesheet.
+        const isInline = ownerNode.tagName === 'STYLE';
+
+        if (isInline) {
+          // If the current target is inline,
+          // it could be a dependency of an existing stylesheet.
+          // Look for that dependency and add it BEFORE the current target.
+          const mainStylesCssId = ownerNode.id.replace('-inline-css', '-css');
+          const mainStylesElement = document.getElementById(mainStylesCssId);
 
-        const inlineCssId = ownerNode.id.replace('-css', '-inline-css');
-        const inlineCssElement = document.getElementById(inlineCssId);
+          if (mainStylesElement) {
+            accumulator.push(mainStylesElement.cloneNode(true));
+          }
+        }
+
+        accumulator.push(ownerNode.cloneNode(true));
 
-        if (inlineCssElement) {
-          accumulator.push(inlineCssElement.cloneNode(true));
+        if (!isInline) {
+          // If the current target is not inline,
+          // we still look for inline styles that could be relevant for the current target.
+          // If they exist, add them AFTER the current target.
+          const inlineStylesCssId = ownerNode.id.replace('-css', '-inline-css');
+          const inlineStylesElement = document.getElementById(inlineStylesCssId);
+
+          if (inlineStylesElement) {
+            accumulator.push(inlineStylesElement.cloneNode(true));
+          }
         }
       }
 

package/build-module/components/iframe/use-compatibility-styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/iframe/use-compatibility-styles.js"],"names":["useMemo","useCompatibilityStyles","Array","from","document","styleSheets","reduce","accumulator","styleSheet","cssRules","e","ownerNode","tagName","id","matchFromRules","_cssRules","find","selectorText","conditionText","__cssRules","includes","push","cloneNode","inlineCssId","replace","inlineCssElement","getElementById"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAT,QAAwB,oBAAxB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,sBAAT,GAAkC;AACxC;AACA;AACA,SAAOD,OAAO,CAAE,MAAM;AACrB;AACA,WAAOE,KAAK,CAACC,IAAN,CAAYC,QAAQ,CAACC,WAArB,EAAmCC,MAAnC,CACN,CAAEC,WAAF,EAAeC,UAAf,KAA+B;AAC9B,UAAI;AACH;AACA;AACAA,QAAAA,UAAU,CAACC,QAAX;AACA,OAJD,CAIE,OAAQC,CAAR,EAAY;AACb,eAAOH,WAAP;AACA;;AAED,YAAM;AAAEI,QAAAA,SAAF;AAAaF,QAAAA;AAAb,UAA0BD,UAAhC,CAT8B,CAW9B;AACA;;AACA,UAAKG,SAAS,KAAK,IAAnB,EAA0B;AACzB,eAAOJ,WAAP;AACA;;AAED,UAAK,CAAEE,QAAP,EAAkB;AACjB,eAAOF,WAAP;AACA,OAnB6B,CAqB9B;AACA;;;AACA,UAAKI,SAAS,CAACC,OAAV,KAAsB,MAA3B,EAAoC;AACnC,eAAOL,WAAP;AACA,OAzB6B,CA2B9B;AACA;AACA;;;AACA,UAAKI,SAAS,CAACE,EAAV,KAAiB,4BAAtB,EAAqD;AACpD,eAAON,WAAP;AACA;;AAED,eAASO,cAAT,CAAyBC,SAAzB,EAAqC;AACpC,eAAOb,KAAK,CAACC,IAAN,CAAYY,SAAZ,EAAwBC,IAAxB,CACN,QAIO;AAAA,cAJL;AACDC,YAAAA,YADC;AAEDC,YAAAA,aAFC;AAGDT,YAAAA,QAAQ,EAAEU;AAHT,WAIK;;AACN;AACA;AACA,cAAKD,aAAL,EAAqB;AACpB,mBAAOJ,cAAc,CAAEK,UAAF,CAArB;AACA;;AAED,iBACCF,YAAY,KACVA,YAAY,CAACG,QAAb,CACD,wBADC,KAGDH,YAAY,CAACG,QAAb,CAAuB,WAAvB,CAJW,CADb;AAOA,SAnBK,CAAP;AAqBA;;AAED,UAAKN,cAAc,CAAEL,QAAF,CAAnB,EAAkC;AACjC;AACA;AACAF,QAAAA,WAAW,CAACc,IAAZ,CAAkBV,SAAS,CAACW,SAAV,CAAqB,IAArB,CAAlB,EAHiC,CAKjC;;AACA,cAAMC,WAAW,GAAGZ,SAAS,CAACE,EAAV,CAAaW,OAAb,CACnB,MADmB,EAEnB,aAFmB,CAApB;AAIA,cAAMC,gBAAgB,GACrBrB,QAAQ,CAACsB,cAAT,CAAyBH,WAAzB,CADD;;AAGA,YAAKE,gBAAL,EAAwB;AACvBlB,UAAAA,WAAW,CAACc,IAAZ,CAAkBI,gBAAgB,CAACH,SAAjB,CAA4B,IAA5B,CAAlB;AACA;AACD;;AAED,aAAOf,WAAP;AACA,KA9EK,EA+EN,EA/EM,CAAP;AAiFA,GAnFa,EAmFX,EAnFW,CAAd;AAoFA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Returns a list of stylesheets that target the editor canvas. A stylesheet is\n * considered targetting the editor a canvas if it contains the\n * `editor-styles-wrapper`, `wp-block`, or `wp-block-*` class selectors.\n *\n * Ideally, this hook should be removed in the future and styles should be added\n * explicitly as editor styles.\n */\nexport function useCompatibilityStyles() {\n\t// Only memoize the result once on load, since these stylesheets should not\n\t// change.\n\treturn useMemo( () => {\n\t\t// Search the document for stylesheets targetting the editor canvas.\n\t\treturn Array.from( document.styleSheets ).reduce(\n\t\t\t( accumulator, styleSheet ) => {\n\t\t\t\ttry {\n\t\t\t\t\t// May fail for external styles.\n\t\t\t\t\t// eslint-disable-next-line no-unused-expressions\n\t\t\t\t\tstyleSheet.cssRules;\n\t\t\t\t} catch ( e ) {\n\t\t\t\t\treturn accumulator;\n\t\t\t\t}\n\n\t\t\t\tconst { ownerNode, cssRules } = styleSheet;\n\n\t\t\t\t// Stylesheet is added by another stylesheet. See\n\t\t\t\t// https://developer.mozilla.org/en-US/docs/Web/API/StyleSheet/ownerNode#notes.\n\t\t\t\tif ( ownerNode === null ) {\n\t\t\t\t\treturn accumulator;\n\t\t\t\t}\n\n\t\t\t\tif ( ! cssRules ) {\n\t\t\t\t\treturn accumulator;\n\t\t\t\t}\n\n\t\t\t\t// Generally, ignore inline styles. We add inline styles belonging to a\n\t\t\t\t// stylesheet later, which may or may not match the selectors.\n\t\t\t\tif ( ownerNode.tagName !== 'LINK' ) {\n\t\t\t\t\treturn accumulator;\n\t\t\t\t}\n\n\t\t\t\t// Don't try to add the reset styles, which were removed as a dependency\n\t\t\t\t// from `edit-blocks` for the iframe since we don't need to reset admin\n\t\t\t\t// styles.\n\t\t\t\tif ( ownerNode.id === 'wp-reset-editor-styles-css' ) {\n\t\t\t\t\treturn accumulator;\n\t\t\t\t}\n\n\t\t\t\tfunction matchFromRules( _cssRules ) {\n\t\t\t\t\treturn Array.from( _cssRules ).find(\n\t\t\t\t\t\t( {\n\t\t\t\t\t\t\tselectorText,\n\t\t\t\t\t\t\tconditionText,\n\t\t\t\t\t\t\tcssRules: __cssRules,\n\t\t\t\t\t\t} ) => {\n\t\t\t\t\t\t\t// If the rule is conditional then it will not have selector text.\n\t\t\t\t\t\t\t// Recurse into child CSS ruleset to determine selector eligibility.\n\t\t\t\t\t\t\tif ( conditionText ) {\n\t\t\t\t\t\t\t\treturn matchFromRules( __cssRules );\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\tselectorText &&\n\t\t\t\t\t\t\t\t( selectorText.includes(\n\t\t\t\t\t\t\t\t\t'.editor-styles-wrapper'\n\t\t\t\t\t\t\t\t) ||\n\t\t\t\t\t\t\t\t\tselectorText.includes( '.wp-block' ) )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\tif ( matchFromRules( cssRules ) ) {\n\t\t\t\t\t// Display warning once we have a way to add style dependencies to the editor.\n\t\t\t\t\t// See: https://github.com/WordPress/gutenberg/pull/37466.\n\t\t\t\t\taccumulator.push( ownerNode.cloneNode( true ) );\n\n\t\t\t\t\t// Add inline styles belonging to the stylesheet.\n\t\t\t\t\tconst inlineCssId = ownerNode.id.replace(\n\t\t\t\t\t\t'-css',\n\t\t\t\t\t\t'-inline-css'\n\t\t\t\t\t);\n\t\t\t\t\tconst inlineCssElement =\n\t\t\t\t\t\tdocument.getElementById( inlineCssId );\n\n\t\t\t\t\tif ( inlineCssElement ) {\n\t\t\t\t\t\taccumulator.push( inlineCssElement.cloneNode( true ) );\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn accumulator;\n\t\t\t},\n\t\t\t[]\n\t\t);\n\t}, [] );\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/iframe/use-compatibility-styles.js"],"names":["useMemo","useCompatibilityStyles","Array","from","document","styleSheets","reduce","accumulator","styleSheet","cssRules","e","ownerNode","id","matchFromRules","_cssRules","find","selectorText","conditionText","__cssRules","includes","isInline","tagName","mainStylesCssId","replace","mainStylesElement","getElementById","push","cloneNode","inlineStylesCssId","inlineStylesElement"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAT,QAAwB,oBAAxB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,sBAAT,GAAkC;AACxC;AACA;AACA,SAAOD,OAAO,CAAE,MAAM;AACrB;AACA,WAAOE,KAAK,CAACC,IAAN,CAAYC,QAAQ,CAACC,WAArB,EAAmCC,MAAnC,CACN,CAAEC,WAAF,EAAeC,UAAf,KAA+B;AAC9B,UAAI;AACH;AACA;AACAA,QAAAA,UAAU,CAACC,QAAX;AACA,OAJD,CAIE,OAAQC,CAAR,EAAY;AACb,eAAOH,WAAP;AACA;;AAED,YAAM;AAAEI,QAAAA,SAAF;AAAaF,QAAAA;AAAb,UAA0BD,UAAhC,CAT8B,CAW9B;AACA;;AACA,UAAKG,SAAS,KAAK,IAAnB,EAA0B;AACzB,eAAOJ,WAAP;AACA;;AAED,UAAK,CAAEE,QAAP,EAAkB;AACjB,eAAOF,WAAP;AACA,OAnB6B,CAqB9B;AACA;AACA;;;AACA,UAAKI,SAAS,CAACC,EAAV,KAAiB,4BAAtB,EAAqD;AACpD,eAAOL,WAAP;AACA;;AAED,eAASM,cAAT,CAAyBC,SAAzB,EAAqC;AACpC,eAAOZ,KAAK,CAACC,IAAN,CAAYW,SAAZ,EAAwBC,IAAxB,CACN,CAAE;AACDC,UAAAA,YADC;AAEDC,UAAAA,aAFC;AAGDR,UAAAA,QAAQ,EAAES;AAHT,SAAF,KAIO;AACN;AACA;AACA,cAAKD,aAAL,EAAqB;AACpB,mBAAOJ,cAAc,CAAEK,UAAF,CAArB;AACA;;AAED,iBACCF,YAAY,KACVA,YAAY,CAACG,QAAb,CACD,wBADC,KAGDH,YAAY,CAACG,QAAb,CAAuB,WAAvB,CAJW,CADb;AAOA,SAnBK,CAAP;AAqBA;;AAED,UAAKN,cAAc,CAAEJ,QAAF,CAAnB,EAAkC;AACjC,cAAMW,QAAQ,GAAGT,SAAS,CAACU,OAAV,KAAsB,OAAvC;;AAEA,YAAKD,QAAL,EAAgB;AACf;AACA;AACA;AACA,gBAAME,eAAe,GAAGX,SAAS,CAACC,EAAV,CAAaW,OAAb,CACvB,aADuB,EAEvB,MAFuB,CAAxB;AAIA,gBAAMC,iBAAiB,GACtBpB,QAAQ,CAACqB,cAAT,CAAyBH,eAAzB,CADD;;AAEA,cAAKE,iBAAL,EAAyB;AACxBjB,YAAAA,WAAW,CAACmB,IAAZ,CACCF,iBAAiB,CAACG,SAAlB,CAA6B,IAA7B,CADD;AAGA;AACD;;AAEDpB,QAAAA,WAAW,CAACmB,IAAZ,CAAkBf,SAAS,CAACgB,SAAV,CAAqB,IAArB,CAAlB;;AAEA,YAAK,CAAEP,QAAP,EAAkB;AACjB;AACA;AACA;AACA,gBAAMQ,iBAAiB,GAAGjB,SAAS,CAACC,EAAV,CAAaW,OAAb,CACzB,MADyB,EAEzB,aAFyB,CAA1B;AAIA,gBAAMM,mBAAmB,GACxBzB,QAAQ,CAACqB,cAAT,CAAyBG,iBAAzB,CADD;;AAEA,cAAKC,mBAAL,EAA2B;AAC1BtB,YAAAA,WAAW,CAACmB,IAAZ,CACCG,mBAAmB,CAACF,SAApB,CAA+B,IAA/B,CADD;AAGA;AACD;AACD;;AAED,aAAOpB,WAAP;AACA,KA9FK,EA+FN,EA/FM,CAAP;AAiGA,GAnGa,EAmGX,EAnGW,CAAd;AAoGA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Returns a list of stylesheets that target the editor canvas. A stylesheet is\n * considered targetting the editor a canvas if it contains the\n * `editor-styles-wrapper`, `wp-block`, or `wp-block-*` class selectors.\n *\n * Ideally, this hook should be removed in the future and styles should be added\n * explicitly as editor styles.\n */\nexport function useCompatibilityStyles() {\n\t// Only memoize the result once on load, since these stylesheets should not\n\t// change.\n\treturn useMemo( () => {\n\t\t// Search the document for stylesheets targetting the editor canvas.\n\t\treturn Array.from( document.styleSheets ).reduce(\n\t\t\t( accumulator, styleSheet ) => {\n\t\t\t\ttry {\n\t\t\t\t\t// May fail for external styles.\n\t\t\t\t\t// eslint-disable-next-line no-unused-expressions\n\t\t\t\t\tstyleSheet.cssRules;\n\t\t\t\t} catch ( e ) {\n\t\t\t\t\treturn accumulator;\n\t\t\t\t}\n\n\t\t\t\tconst { ownerNode, cssRules } = styleSheet;\n\n\t\t\t\t// Stylesheet is added by another stylesheet. See\n\t\t\t\t// https://developer.mozilla.org/en-US/docs/Web/API/StyleSheet/ownerNode#notes.\n\t\t\t\tif ( ownerNode === null ) {\n\t\t\t\t\treturn accumulator;\n\t\t\t\t}\n\n\t\t\t\tif ( ! cssRules ) {\n\t\t\t\t\treturn accumulator;\n\t\t\t\t}\n\n\t\t\t\t// Don't try to add the reset styles, which were removed as a dependency\n\t\t\t\t// from `edit-blocks` for the iframe since we don't need to reset admin\n\t\t\t\t// styles.\n\t\t\t\tif ( ownerNode.id === 'wp-reset-editor-styles-css' ) {\n\t\t\t\t\treturn accumulator;\n\t\t\t\t}\n\n\t\t\t\tfunction matchFromRules( _cssRules ) {\n\t\t\t\t\treturn Array.from( _cssRules ).find(\n\t\t\t\t\t\t( {\n\t\t\t\t\t\t\tselectorText,\n\t\t\t\t\t\t\tconditionText,\n\t\t\t\t\t\t\tcssRules: __cssRules,\n\t\t\t\t\t\t} ) => {\n\t\t\t\t\t\t\t// If the rule is conditional then it will not have selector text.\n\t\t\t\t\t\t\t// Recurse into child CSS ruleset to determine selector eligibility.\n\t\t\t\t\t\t\tif ( conditionText ) {\n\t\t\t\t\t\t\t\treturn matchFromRules( __cssRules );\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\tselectorText &&\n\t\t\t\t\t\t\t\t( selectorText.includes(\n\t\t\t\t\t\t\t\t\t'.editor-styles-wrapper'\n\t\t\t\t\t\t\t\t) ||\n\t\t\t\t\t\t\t\t\tselectorText.includes( '.wp-block' ) )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\tif ( matchFromRules( cssRules ) ) {\n\t\t\t\t\tconst isInline = ownerNode.tagName === 'STYLE';\n\n\t\t\t\t\tif ( isInline ) {\n\t\t\t\t\t\t// If the current target is inline,\n\t\t\t\t\t\t// it could be a dependency of an existing stylesheet.\n\t\t\t\t\t\t// Look for that dependency and add it BEFORE the current target.\n\t\t\t\t\t\tconst mainStylesCssId = ownerNode.id.replace(\n\t\t\t\t\t\t\t'-inline-css',\n\t\t\t\t\t\t\t'-css'\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst mainStylesElement =\n\t\t\t\t\t\t\tdocument.getElementById( mainStylesCssId );\n\t\t\t\t\t\tif ( mainStylesElement ) {\n\t\t\t\t\t\t\taccumulator.push(\n\t\t\t\t\t\t\t\tmainStylesElement.cloneNode( true )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\taccumulator.push( ownerNode.cloneNode( true ) );\n\n\t\t\t\t\tif ( ! isInline ) {\n\t\t\t\t\t\t// If the current target is not inline,\n\t\t\t\t\t\t// we still look for inline styles that could be relevant for the current target.\n\t\t\t\t\t\t// If they exist, add them AFTER the current target.\n\t\t\t\t\t\tconst inlineStylesCssId = ownerNode.id.replace(\n\t\t\t\t\t\t\t'-css',\n\t\t\t\t\t\t\t'-inline-css'\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst inlineStylesElement =\n\t\t\t\t\t\t\tdocument.getElementById( inlineStylesCssId );\n\t\t\t\t\t\tif ( inlineStylesElement ) {\n\t\t\t\t\t\t\taccumulator.push(\n\t\t\t\t\t\t\t\tinlineStylesElement.cloneNode( true )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn accumulator;\n\t\t\t},\n\t\t\t[]\n\t\t);\n\t}, [] );\n}\n"]}