@wordpress/block-editor 9.2.0 → 9.5.0

package/build/components/duotone/components.js

@@ -0,0 +1,145 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DuotoneFilter = DuotoneFilter;
+exports.DuotoneStylesheet = DuotoneStylesheet;
+exports.DuotoneUnsetStylesheet = DuotoneUnsetStylesheet;
+exports.PresetDuotoneFilter = PresetDuotoneFilter;
+
+var _element = require("@wordpress/element");
+
+var _components = require("@wordpress/components");
+
+var _index = require("./index");
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+
+/**
+ * SVG and stylesheet needed for rendering the duotone filter.
+ *
+ * @param {Object}   props          Duotone props.
+ * @param {string}   props.selector Selector to apply the filter to.
+ * @param {string}   props.id       Unique id for this duotone filter.
+ *
+ * @return {WPElement} Duotone element.
+ */
+function DuotoneStylesheet(_ref) {
+  let {
+    selector,
+    id
+  } = _ref;
+  const css = `
+${selector} {
+	filter: url( #${id} );
+}
+`;
+  return (0, _element.createElement)("style", null, css);
+}
+/**
+ * Stylesheet for disabling a global styles duotone filter.
+ *
+ * @param {Object}   props          Duotone props.
+ * @param {string}   props.selector Selector to disable the filter for.
+ *
+ * @return {WPElement} Filter none style element.
+ */
+
+
+function DuotoneUnsetStylesheet(_ref2) {
+  let {
+    selector
+  } = _ref2;
+  const css = `
+${selector} {
+	filter: none;
+}
+`;
+  return (0, _element.createElement)("style", null, css);
+}
+/**
+ * The SVG part of the duotone filter.
+ *
+ * @param {Object}   props        Duotone props.
+ * @param {string}   props.id     Unique id for this duotone filter.
+ * @param {string[]} props.colors Color strings from dark to light.
+ *
+ * @return {WPElement} Duotone SVG.
+ */
+
+
+function DuotoneFilter(_ref3) {
+  let {
+    id,
+    colors
+  } = _ref3;
+  const values = (0, _index.__unstableGetValuesFromColors)(colors);
+  return (0, _element.createElement)(_components.SVG, {
+    xmlnsXlink: "http://www.w3.org/1999/xlink",
+    viewBox: "0 0 0 0",
+    width: "0",
+    height: "0",
+    focusable: "false",
+    role: "none",
+    style: {
+      visibility: 'hidden',
+      position: 'absolute',
+      left: '-9999px',
+      overflow: 'hidden'
+    }
+  }, (0, _element.createElement)("defs", null, (0, _element.createElement)("filter", {
+    id: id
+  }, (0, _element.createElement)("feColorMatrix", {
+    // Use sRGB instead of linearRGB so transparency looks correct.
+    colorInterpolationFilters: "sRGB",
+    type: "matrix" // Use perceptual brightness to convert to grayscale.
+    ,
+    values: " .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 .299 .587 .114 0 0 "
+  }), (0, _element.createElement)("feComponentTransfer", {
+    // Use sRGB instead of linearRGB to be consistent with how CSS gradients work.
+    colorInterpolationFilters: "sRGB"
+  }, (0, _element.createElement)("feFuncR", {
+    type: "table",
+    tableValues: values.r.join(' ')
+  }), (0, _element.createElement)("feFuncG", {
+    type: "table",
+    tableValues: values.g.join(' ')
+  }), (0, _element.createElement)("feFuncB", {
+    type: "table",
+    tableValues: values.b.join(' ')
+  }), (0, _element.createElement)("feFuncA", {
+    type: "table",
+    tableValues: values.a.join(' ')
+  })), (0, _element.createElement)("feComposite", {
+    // Re-mask the image with the original transparency since the feColorMatrix above loses that information.
+    in2: "SourceGraphic",
+    operator: "in"
+  }))));
+}
+/**
+ * SVG from a duotone preset
+ *
+ * @param {Object} props        Duotone props.
+ * @param {Object} props.preset Duotone preset settings.
+ *
+ * @return {WPElement} Duotone element.
+ */
+
+
+function PresetDuotoneFilter(_ref4) {
+  let {
+    preset
+  } = _ref4;
+  return (0, _element.createElement)(DuotoneFilter, {
+    id: `wp-duotone-${preset.slug}`,
+    colors: preset.colors
+  });
+}
+//# sourceMappingURL=components.js.map

package/build/components/duotone/components.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/duotone/components.js"],"names":["DuotoneStylesheet","selector","id","css","DuotoneUnsetStylesheet","DuotoneFilter","colors","values","visibility","position","left","overflow","r","join","g","b","a","PresetDuotoneFilter","preset","slug"],"mappings":";;;;;;;;;;;;AAGA;;AAKA;;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,iBAAT,OAA+C;AAAA,MAAnB;AAAEC,IAAAA,QAAF;AAAYC,IAAAA;AAAZ,GAAmB;AACrD,QAAMC,GAAG,GAAI;AACd,EAAGF,QAAU;AACb,iBAAkBC,EAAI;AACtB;AACA,CAJC;AAKA,SAAO,2CAASC,GAAT,CAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,sBAAT,QAAgD;AAAA,MAAf;AAAEH,IAAAA;AAAF,GAAe;AACtD,QAAME,GAAG,GAAI;AACd,EAAGF,QAAU;AACb;AACA;AACA,CAJC;AAKA,SAAO,2CAASE,GAAT,CAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASE,aAAT,QAAyC;AAAA,MAAjB;AAAEH,IAAAA,EAAF;AAAMI,IAAAA;AAAN,GAAiB;AAC/C,QAAMC,MAAM,GAAG,0CAAqBD,MAArB,CAAf;AACA,SACC,4BAAC,eAAD;AACC,IAAA,UAAU,EAAC,8BADZ;AAEC,IAAA,OAAO,EAAC,SAFT;AAGC,IAAA,KAAK,EAAC,GAHP;AAIC,IAAA,MAAM,EAAC,GAJR;AAKC,IAAA,SAAS,EAAC,OALX;AAMC,IAAA,IAAI,EAAC,MANN;AAOC,IAAA,KAAK,EAAG;AACPE,MAAAA,UAAU,EAAE,QADL;AAEPC,MAAAA,QAAQ,EAAE,UAFH;AAGPC,MAAAA,IAAI,EAAE,SAHC;AAIPC,MAAAA,QAAQ,EAAE;AAJH;AAPT,KAcC,0CACC;AAAQ,IAAA,EAAE,EAAGT;AAAb,KACC;AACC;AACA,IAAA,yBAAyB,EAAC,MAF3B;AAGC,IAAA,IAAI,EAAC,QAHN,CAIC;AAJD;AAKC,IAAA,MAAM,EAAC;AALR,IADD,EAaC;AACC;AACA,IAAA,yBAAyB,EAAC;AAF3B,KAIC;AACC,IAAA,IAAI,EAAC,OADN;AAEC,IAAA,WAAW,EAAGK,MAAM,CAACK,CAAP,CAASC,IAAT,CAAe,GAAf;AAFf,IAJD,EAQC;AACC,IAAA,IAAI,EAAC,OADN;AAEC,IAAA,WAAW,EAAGN,MAAM,CAACO,CAAP,CAASD,IAAT,CAAe,GAAf;AAFf,IARD,EAYC;AACC,IAAA,IAAI,EAAC,OADN;AAEC,IAAA,WAAW,EAAGN,MAAM,CAACQ,CAAP,CAASF,IAAT,CAAe,GAAf;AAFf,IAZD,EAgBC;AACC,IAAA,IAAI,EAAC,OADN;AAEC,IAAA,WAAW,EAAGN,MAAM,CAACS,CAAP,CAASH,IAAT,CAAe,GAAf;AAFf,IAhBD,CAbD,EAkCC;AACC;AACA,IAAA,GAAG,EAAC,eAFL;AAGC,IAAA,QAAQ,EAAC;AAHV,IAlCD,CADD,CAdD,CADD;AA2DA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASI,mBAAT,QAA2C;AAAA,MAAb;AAAEC,IAAAA;AAAF,GAAa;AACjD,SACC,4BAAC,aAAD;AACC,IAAA,EAAE,EAAI,cAAcA,MAAM,CAACC,IAAM,EADlC;AAEC,IAAA,MAAM,EAAGD,MAAM,CAACZ;AAFjB,IADD;AAMA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { SVG } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { __unstableGetValuesFromColors as getValuesFromColors } from './index';\n\n/**\n * SVG and stylesheet needed for rendering the duotone filter.\n *\n * @param {Object}   props          Duotone props.\n * @param {string}   props.selector Selector to apply the filter to.\n * @param {string}   props.id       Unique id for this duotone filter.\n *\n * @return {WPElement} Duotone element.\n */\nexport function DuotoneStylesheet( { selector, id } ) {\n\tconst css = `\n${ selector } {\n\tfilter: url( #${ id } );\n}\n`;\n\treturn <style>{ css }</style>;\n}\n\n/**\n * Stylesheet for disabling a global styles duotone filter.\n *\n * @param {Object}   props          Duotone props.\n * @param {string}   props.selector Selector to disable the filter for.\n *\n * @return {WPElement} Filter none style element.\n */\nexport function DuotoneUnsetStylesheet( { selector } ) {\n\tconst css = `\n${ selector } {\n\tfilter: none;\n}\n`;\n\treturn <style>{ css }</style>;\n}\n\n/**\n * The SVG part of the duotone filter.\n *\n * @param {Object}   props        Duotone props.\n * @param {string}   props.id     Unique id for this duotone filter.\n * @param {string[]} props.colors Color strings from dark to light.\n *\n * @return {WPElement} Duotone SVG.\n */\nexport function DuotoneFilter( { id, colors } ) {\n\tconst values = getValuesFromColors( colors );\n\treturn (\n\t\t<SVG\n\t\t\txmlnsXlink=\"http://www.w3.org/1999/xlink\"\n\t\t\tviewBox=\"0 0 0 0\"\n\t\t\twidth=\"0\"\n\t\t\theight=\"0\"\n\t\t\tfocusable=\"false\"\n\t\t\trole=\"none\"\n\t\t\tstyle={ {\n\t\t\t\tvisibility: 'hidden',\n\t\t\t\tposition: 'absolute',\n\t\t\t\tleft: '-9999px',\n\t\t\t\toverflow: 'hidden',\n\t\t\t} }\n\t\t>\n\t\t\t<defs>\n\t\t\t\t<filter id={ id }>\n\t\t\t\t\t<feColorMatrix\n\t\t\t\t\t\t// Use sRGB instead of linearRGB so transparency looks correct.\n\t\t\t\t\t\tcolorInterpolationFilters=\"sRGB\"\n\t\t\t\t\t\ttype=\"matrix\"\n\t\t\t\t\t\t// Use perceptual brightness to convert to grayscale.\n\t\t\t\t\t\tvalues=\"\n\t\t\t\t\t\t\t.299 .587 .114 0 0\n\t\t\t\t\t\t\t.299 .587 .114 0 0\n\t\t\t\t\t\t\t.299 .587 .114 0 0\n\t\t\t\t\t\t\t.299 .587 .114 0 0\n\t\t\t\t\t\t\"\n\t\t\t\t\t/>\n\t\t\t\t\t<feComponentTransfer\n\t\t\t\t\t\t// Use sRGB instead of linearRGB to be consistent with how CSS gradients work.\n\t\t\t\t\t\tcolorInterpolationFilters=\"sRGB\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<feFuncR\n\t\t\t\t\t\t\ttype=\"table\"\n\t\t\t\t\t\t\ttableValues={ values.r.join( ' ' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<feFuncG\n\t\t\t\t\t\t\ttype=\"table\"\n\t\t\t\t\t\t\ttableValues={ values.g.join( ' ' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<feFuncB\n\t\t\t\t\t\t\ttype=\"table\"\n\t\t\t\t\t\t\ttableValues={ values.b.join( ' ' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<feFuncA\n\t\t\t\t\t\t\ttype=\"table\"\n\t\t\t\t\t\t\ttableValues={ values.a.join( ' ' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</feComponentTransfer>\n\t\t\t\t\t<feComposite\n\t\t\t\t\t\t// Re-mask the image with the original transparency since the feColorMatrix above loses that information.\n\t\t\t\t\t\tin2=\"SourceGraphic\"\n\t\t\t\t\t\toperator=\"in\"\n\t\t\t\t\t/>\n\t\t\t\t</filter>\n\t\t\t</defs>\n\t\t</SVG>\n\t);\n}\n\n/**\n * SVG from a duotone preset\n *\n * @param {Object} props        Duotone props.\n * @param {Object} props.preset Duotone preset settings.\n *\n * @return {WPElement} Duotone element.\n */\nexport function PresetDuotoneFilter( { preset } ) {\n\treturn (\n\t\t<DuotoneFilter\n\t\t\tid={ `wp-duotone-${ preset.slug }` }\n\t\t\tcolors={ preset.colors }\n\t\t/>\n\t);\n}\n"]}

package/build/components/duotone/index.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "__unstableDuotoneFilter", {
+  enumerable: true,
+  get: function () {
+    return _components.DuotoneFilter;
+  }
+});
+Object.defineProperty(exports, "__unstableDuotoneStylesheet", {
+  enumerable: true,
+  get: function () {
+    return _components.DuotoneStylesheet;
+  }
+});
+Object.defineProperty(exports, "__unstableDuotoneUnsetStylesheet", {
+  enumerable: true,
+  get: function () {
+    return _components.DuotoneUnsetStylesheet;
+  }
+});
+Object.defineProperty(exports, "__unstableGetValuesFromColors", {
+  enumerable: true,
+  get: function () {
+    return _utils.getValuesFromColors;
+  }
+});
+Object.defineProperty(exports, "__unstablePresetDuotoneFilter", {
+  enumerable: true,
+  get: function () {
+    return _components.PresetDuotoneFilter;
+  }
+});
+
+var _utils = require("./utils");
+
+var _components = require("./components");
+//# sourceMappingURL=index.js.map

package/build/components/duotone/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/duotone/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA","sourcesContent":["export { getValuesFromColors as __unstableGetValuesFromColors } from './utils';\nexport {\n\tDuotoneFilter as __unstableDuotoneFilter,\n\tPresetDuotoneFilter as __unstablePresetDuotoneFilter,\n\tDuotoneStylesheet as __unstableDuotoneStylesheet,\n\tDuotoneUnsetStylesheet as __unstableDuotoneUnsetStylesheet,\n} from './components';\n"]}

package/build/components/duotone/utils.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getValuesFromColors = getValuesFromColors;
+
+var _colord = require("colord");
+
+/**
+ * External dependencies
+ */
+
+/**
+ * Convert a list of colors to an object of R, G, and B values.
+ *
+ * @param {string[]} colors Array of RBG color strings.
+ *
+ * @return {Object} R, G, and B values.
+ */
+function getValuesFromColors() {
+  let colors = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  const values = {
+    r: [],
+    g: [],
+    b: [],
+    a: []
+  };
+  colors.forEach(color => {
+    const rgbColor = (0, _colord.colord)(color).toRgb();
+    values.r.push(rgbColor.r / 255);
+    values.g.push(rgbColor.g / 255);
+    values.b.push(rgbColor.b / 255);
+    values.a.push(rgbColor.a);
+  });
+  return values;
+}
+//# sourceMappingURL=utils.js.map

package/build/components/duotone/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/duotone/utils.js"],"names":["getValuesFromColors","colors","values","r","g","b","a","forEach","color","rgbColor","toRgb","push"],"mappings":";;;;;;;AAGA;;AAHA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,mBAAT,GAA4C;AAAA,MAAdC,MAAc,uEAAL,EAAK;AAClD,QAAMC,MAAM,GAAG;AAAEC,IAAAA,CAAC,EAAE,EAAL;AAASC,IAAAA,CAAC,EAAE,EAAZ;AAAgBC,IAAAA,CAAC,EAAE,EAAnB;AAAuBC,IAAAA,CAAC,EAAE;AAA1B,GAAf;AAEAL,EAAAA,MAAM,CAACM,OAAP,CAAkBC,KAAF,IAAa;AAC5B,UAAMC,QAAQ,GAAG,oBAAQD,KAAR,EAAgBE,KAAhB,EAAjB;AACAR,IAAAA,MAAM,CAACC,CAAP,CAASQ,IAAT,CAAeF,QAAQ,CAACN,CAAT,GAAa,GAA5B;AACAD,IAAAA,MAAM,CAACE,CAAP,CAASO,IAAT,CAAeF,QAAQ,CAACL,CAAT,GAAa,GAA5B;AACAF,IAAAA,MAAM,CAACG,CAAP,CAASM,IAAT,CAAeF,QAAQ,CAACJ,CAAT,GAAa,GAA5B;AACAH,IAAAA,MAAM,CAACI,CAAP,CAASK,IAAT,CAAeF,QAAQ,CAACH,CAAxB;AACA,GAND;AAQA,SAAOJ,MAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport { colord } from 'colord';\n\n/**\n * Convert a list of colors to an object of R, G, and B values.\n *\n * @param {string[]} colors Array of RBG color strings.\n *\n * @return {Object} R, G, and B values.\n */\nexport function getValuesFromColors( colors = [] ) {\n\tconst values = { r: [], g: [], b: [], a: [] };\n\n\tcolors.forEach( ( color ) => {\n\t\tconst rgbColor = colord( color ).toRgb();\n\t\tvalues.r.push( rgbColor.r / 255 );\n\t\tvalues.g.push( rgbColor.g / 255 );\n\t\tvalues.b.push( rgbColor.b / 255 );\n\t\tvalues.a.push( rgbColor.a );\n\t} );\n\n\treturn values;\n}\n"]}

package/build/components/duotone-control/index.js

@@ -27,6 +27,22 @@ function DuotoneControl(_ref) {
     value,
     onChange
   } = _ref;
+  let toolbarIcon;
+
+  if (value === 'unset') {
+    toolbarIcon = (0, _element.createElement)(_components.ColorIndicator, {
+      className: "block-editor-duotone-control__unset-indicator"
+    });
+  } else if (value) {
+    toolbarIcon = (0, _element.createElement)(_components.DuotoneSwatch, {
+      values: value
+    });
+  } else {
+    toolbarIcon = (0, _element.createElement)(_icons.Icon, {
+      icon: _icons.filter
+    });
+  }
+
   return (0, _element.createElement)(_components.Dropdown, {
     popoverProps: {
       className: 'block-editor-duotone-control__popover',
@@ -53,11 +69,7 @@ function DuotoneControl(_ref) {
         "aria-expanded": isOpen,
         onKeyDown: openOnArrowDown,
         label: (0, _i18n.__)('Apply duotone filter'),
-        icon: value ? (0, _element.createElement)(_components.DuotoneSwatch, {
-          values: value
-        }) : (0, _element.createElement)(_icons.Icon, {
-          icon: _icons.filter
-        })
+        icon: toolbarIcon
       });
     },
     renderContent: () => (0, _element.createElement)(_components.MenuGroup, {

package/build/components/duotone-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/duotone-control/index.js"],"names":["DuotoneControl","colorPalette","duotonePalette","disableCustomColors","disableCustomDuotone","value","onChange","className","headerTitle","isAlternate","isOpen","onToggle","openOnArrowDown","event","keyCode","DOWN","preventDefault","filter"],"mappings":";;;;;;;;;AAGA;;AAOA;;AACA;;AACA;;AAZA;AACA;AACA;AAYA,SAASA,cAAT,OAOI;AAAA,MAPqB;AACxBC,IAAAA,YADwB;AAExBC,IAAAA,cAFwB;AAGxBC,IAAAA,mBAHwB;AAIxBC,IAAAA,oBAJwB;AAKxBC,IAAAA,KALwB;AAMxBC,IAAAA;AANwB,GAOrB;AACH,SACC,4BAAC,oBAAD;AACC,IAAA,YAAY,EAAG;AACdC,MAAAA,SAAS,EAAE,uCADG;AAEdC,MAAAA,WAAW,EAAE,cAAI,SAAJ,CAFC;AAGdC,MAAAA,WAAW,EAAE;AAHC,KADhB;AAMC,IAAA,YAAY,EAAG,SAA4B;AAAA,UAA1B;AAAEC,QAAAA,MAAF;AAAUC,QAAAA;AAAV,OAA0B;;AAC1C,YAAMC,eAAe,GAAKC,KAAF,IAAa;AACpC,YAAK,CAAEH,MAAF,IAAYG,KAAK,CAACC,OAAN,KAAkBC,cAAnC,EAA0C;AACzCF,UAAAA,KAAK,CAACG,cAAN;AACAL,UAAAA,QAAQ;AACR;AACD,OALD;;AAMA,aACC,4BAAC,yBAAD;AACC,QAAA,WAAW,MADZ;AAEC,QAAA,OAAO,EAAGA,QAFX;AAGC,yBAAc,MAHf;AAIC,yBAAgBD,MAJjB;AAKC,QAAA,SAAS,EAAGE,eALb;AAMC,QAAA,KAAK,EAAG,cAAI,sBAAJ,CANT;AAOC,QAAA,IAAI,EACHP,KAAK,GACJ,4BAAC,yBAAD;AAAe,UAAA,MAAM,EAAGA;AAAxB,UADI,GAGJ,4BAAC,WAAD;AAAM,UAAA,IAAI,EAAGY;AAAb;AAXH,QADD;AAiBA,KA9BF;AA+BC,IAAA,aAAa,EAAG,MACf,4BAAC,qBAAD;AAAW,MAAA,KAAK,EAAG,cAAI,SAAJ;AAAnB,OACC;AAAK,MAAA,SAAS,EAAC;AAAf,OACG,cACD,oEADC,CADH,CADD,EAMC,4BAAC,yBAAD;AACC,MAAA,YAAY,EAAGhB,YADhB;AAEC,MAAA,cAAc,EAAGC,cAFlB;AAGC,MAAA,mBAAmB,EAAGC,mBAHvB;AAIC,MAAA,oBAAoB,EAAGC,oBAJxB;AAKC,MAAA,KAAK,EAAGC,KALT;AAMC,MAAA,QAAQ,EAAGC;AANZ,MAND;AAhCF,IADD;AAmDA;;eAEcN,c","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tDropdown,\n\tDuotonePicker,\n\tDuotoneSwatch,\n\tMenuGroup,\n\tToolbarButton,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { DOWN } from '@wordpress/keycodes';\nimport { Icon, filter } from '@wordpress/icons';\n\nfunction DuotoneControl( {\n\tcolorPalette,\n\tduotonePalette,\n\tdisableCustomColors,\n\tdisableCustomDuotone,\n\tvalue,\n\tonChange,\n} ) {\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ {\n\t\t\t\tclassName: 'block-editor-duotone-control__popover',\n\t\t\t\theaderTitle: __( 'Duotone' ),\n\t\t\t\tisAlternate: true,\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\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\t\t\t\treturn (\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\tshowTooltip\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={ __( 'Apply duotone filter' ) }\n\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\tvalue ? (\n\t\t\t\t\t\t\t\t<DuotoneSwatch values={ value } />\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<Icon icon={ filter } />\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\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<MenuGroup label={ __( 'Duotone' ) }>\n\t\t\t\t\t<div className=\"block-editor-duotone-control__description\">\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'Create a two-tone color effect without losing your original image.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t\t<DuotonePicker\n\t\t\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tdisableCustomDuotone={ disableCustomDuotone }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default DuotoneControl;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/duotone-control/index.js"],"names":["DuotoneControl","colorPalette","duotonePalette","disableCustomColors","disableCustomDuotone","value","onChange","toolbarIcon","filter","className","headerTitle","isAlternate","isOpen","onToggle","openOnArrowDown","event","keyCode","DOWN","preventDefault"],"mappings":";;;;;;;;;AAGA;;AAQA;;AACA;;AACA;;AAbA;AACA;AACA;AAaA,SAASA,cAAT,OAOI;AAAA,MAPqB;AACxBC,IAAAA,YADwB;AAExBC,IAAAA,cAFwB;AAGxBC,IAAAA,mBAHwB;AAIxBC,IAAAA,oBAJwB;AAKxBC,IAAAA,KALwB;AAMxBC,IAAAA;AANwB,GAOrB;AACH,MAAIC,WAAJ;;AACA,MAAKF,KAAK,KAAK,OAAf,EAAyB;AACxBE,IAAAA,WAAW,GACV,4BAAC,0BAAD;AAAgB,MAAA,SAAS,EAAC;AAA1B,MADD;AAGA,GAJD,MAIO,IAAKF,KAAL,EAAa;AACnBE,IAAAA,WAAW,GAAG,4BAAC,yBAAD;AAAe,MAAA,MAAM,EAAGF;AAAxB,MAAd;AACA,GAFM,MAEA;AACNE,IAAAA,WAAW,GAAG,4BAAC,WAAD;AAAM,MAAA,IAAI,EAAGC;AAAb,MAAd;AACA;;AACD,SACC,4BAAC,oBAAD;AACC,IAAA,YAAY,EAAG;AACdC,MAAAA,SAAS,EAAE,uCADG;AAEdC,MAAAA,WAAW,EAAE,cAAI,SAAJ,CAFC;AAGdC,MAAAA,WAAW,EAAE;AAHC,KADhB;AAMC,IAAA,YAAY,EAAG,SAA4B;AAAA,UAA1B;AAAEC,QAAAA,MAAF;AAAUC,QAAAA;AAAV,OAA0B;;AAC1C,YAAMC,eAAe,GAAKC,KAAF,IAAa;AACpC,YAAK,CAAEH,MAAF,IAAYG,KAAK,CAACC,OAAN,KAAkBC,cAAnC,EAA0C;AACzCF,UAAAA,KAAK,CAACG,cAAN;AACAL,UAAAA,QAAQ;AACR;AACD,OALD;;AAMA,aACC,4BAAC,yBAAD;AACC,QAAA,WAAW,MADZ;AAEC,QAAA,OAAO,EAAGA,QAFX;AAGC,yBAAc,MAHf;AAIC,yBAAgBD,MAJjB;AAKC,QAAA,SAAS,EAAGE,eALb;AAMC,QAAA,KAAK,EAAG,cAAI,sBAAJ,CANT;AAOC,QAAA,IAAI,EAAGP;AAPR,QADD;AAWA,KAxBF;AAyBC,IAAA,aAAa,EAAG,MACf,4BAAC,qBAAD;AAAW,MAAA,KAAK,EAAG,cAAI,SAAJ;AAAnB,OACC;AAAK,MAAA,SAAS,EAAC;AAAf,OACG,cACD,oEADC,CADH,CADD,EAMC,4BAAC,yBAAD;AACC,MAAA,YAAY,EAAGN,YADhB;AAEC,MAAA,cAAc,EAAGC,cAFlB;AAGC,MAAA,mBAAmB,EAAGC,mBAHvB;AAIC,MAAA,oBAAoB,EAAGC,oBAJxB;AAKC,MAAA,KAAK,EAAGC,KALT;AAMC,MAAA,QAAQ,EAAGC;AANZ,MAND;AA1BF,IADD;AA6CA;;eAEcN,c","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tColorIndicator,\n\tDropdown,\n\tDuotonePicker,\n\tDuotoneSwatch,\n\tMenuGroup,\n\tToolbarButton,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { DOWN } from '@wordpress/keycodes';\nimport { Icon, filter } from '@wordpress/icons';\n\nfunction DuotoneControl( {\n\tcolorPalette,\n\tduotonePalette,\n\tdisableCustomColors,\n\tdisableCustomDuotone,\n\tvalue,\n\tonChange,\n} ) {\n\tlet toolbarIcon;\n\tif ( value === 'unset' ) {\n\t\ttoolbarIcon = (\n\t\t\t<ColorIndicator className=\"block-editor-duotone-control__unset-indicator\" />\n\t\t);\n\t} else if ( value ) {\n\t\ttoolbarIcon = <DuotoneSwatch values={ value } />;\n\t} else {\n\t\ttoolbarIcon = <Icon icon={ filter } />;\n\t}\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ {\n\t\t\t\tclassName: 'block-editor-duotone-control__popover',\n\t\t\t\theaderTitle: __( 'Duotone' ),\n\t\t\t\tisAlternate: true,\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\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\t\t\t\treturn (\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\tshowTooltip\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={ __( 'Apply duotone filter' ) }\n\t\t\t\t\t\ticon={ toolbarIcon }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<MenuGroup label={ __( 'Duotone' ) }>\n\t\t\t\t\t<div className=\"block-editor-duotone-control__description\">\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'Create a two-tone color effect without losing your original image.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t\t<DuotonePicker\n\t\t\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tdisableCustomDuotone={ disableCustomDuotone }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default DuotoneControl;\n"]}

package/build/components/font-sizes/with-font-sizes.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/font-sizes/with-font-sizes.js"],"names":["DEFAULT_FONT_SIZES","fontSizeNames","fontSizeAttributeNames","fontSizeAttributeNamesAccumulator","fontSizeAttributeName","WrappedComponent","props","fontSizes","Component","constructor","setters","createSetters","state","settersAccumulator","customFontSizeAttributeName","upperFirstFontSizeAttributeName","createSetFontSize","fontSizeValue","fontSizeObject","size","Number","setAttributes","slug","undefined","getDerivedStateFromProps","previousState","attributes","didAttributesChange","newState","newStateAccumulator","fontSizeAttributeValue","class","render"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { find, pickBy, reduce, some, upperFirst } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { createHigherOrderComponent, compose } from '@wordpress/compose';\nimport { Component } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { getFontSize, getFontSizeClass } from './utils';\nimport useSetting from '../use-setting';\n\nconst DEFAULT_FONT_SIZES = [];\n\n/**\n * Higher-order component, which handles font size logic for class generation,\n * font size value retrieval, and font size change handling.\n *\n * @param {...(Object|string)} fontSizeNames The arguments should all be strings.\n *                                           Each string contains the font size\n *                                           attribute name e.g: 'fontSize'.\n *\n * @return {Function} Higher-order component.\n */\nexport default ( ...fontSizeNames ) => {\n\t/*\n\t * Computes an object whose key is the font size attribute name as passed in the array,\n\t * and the value is the custom font size attribute name.\n\t * Custom font size is automatically compted by appending custom followed by the font size attribute name in with the first letter capitalized.\n\t */\n\tconst fontSizeAttributeNames = reduce(\n\t\tfontSizeNames,\n\t\t( fontSizeAttributeNamesAccumulator, fontSizeAttributeName ) => {\n\t\t\tfontSizeAttributeNamesAccumulator[\n\t\t\t\tfontSizeAttributeName\n\t\t\t] = `custom${ upperFirst( fontSizeAttributeName ) }`;\n\t\t\treturn fontSizeAttributeNamesAccumulator;\n\t\t},\n\t\t{}\n\t);\n\n\treturn createHigherOrderComponent(\n\t\tcompose( [\n\t\t\tcreateHigherOrderComponent(\n\t\t\t\t( WrappedComponent ) => ( props ) => {\n\t\t\t\t\tconst fontSizes =\n\t\t\t\t\t\tuseSetting( 'typography.fontSizes' ) ||\n\t\t\t\t\t\tDEFAULT_FONT_SIZES;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\tfontSizes={ fontSizes }\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t},\n\t\t\t\t'withFontSizes'\n\t\t\t),\n\t\t\t( WrappedComponent ) => {\n\t\t\t\treturn class extends Component {\n\t\t\t\t\tconstructor( props ) {\n\t\t\t\t\t\tsuper( props );\n\n\t\t\t\t\t\tthis.setters = this.createSetters();\n\n\t\t\t\t\t\tthis.state = {};\n\t\t\t\t\t}\n\n\t\t\t\t\tcreateSetters() {\n\t\t\t\t\t\treturn reduce(\n\t\t\t\t\t\t\tfontSizeAttributeNames,\n\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\tsettersAccumulator,\n\t\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tconst upperFirstFontSizeAttributeName = upperFirst(\n\t\t\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\tsettersAccumulator[\n\t\t\t\t\t\t\t\t\t`set${ upperFirstFontSizeAttributeName }`\n\t\t\t\t\t\t\t\t] = this.createSetFontSize(\n\t\t\t\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\t\t\t\tcustomFontSizeAttributeName\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\treturn settersAccumulator;\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{}\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\n\t\t\t\t\tcreateSetFontSize(\n\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\tcustomFontSizeAttributeName\n\t\t\t\t\t) {\n\t\t\t\t\t\treturn ( fontSizeValue ) => {\n\t\t\t\t\t\t\tconst fontSizeObject = find( this.props.fontSizes, {\n\t\t\t\t\t\t\t\tsize: Number( fontSizeValue ),\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tthis.props.setAttributes( {\n\t\t\t\t\t\t\t\t[ fontSizeAttributeName ]:\n\t\t\t\t\t\t\t\t\tfontSizeObject && fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t? fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t\t[ customFontSizeAttributeName ]:\n\t\t\t\t\t\t\t\t\tfontSizeObject && fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t\t: fontSizeValue,\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\tstatic getDerivedStateFromProps(\n\t\t\t\t\t\t{ attributes, fontSizes },\n\t\t\t\t\t\tpreviousState\n\t\t\t\t\t) {\n\t\t\t\t\t\tconst didAttributesChange = (\n\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\tif ( previousState[ fontSizeAttributeName ] ) {\n\t\t\t\t\t\t\t\t// If new font size is name compare with the previous slug.\n\t\t\t\t\t\t\t\tif ( attributes[ fontSizeAttributeName ] ) {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\tattributes[ fontSizeAttributeName ] !==\n\t\t\t\t\t\t\t\t\t\tpreviousState[ fontSizeAttributeName ]\n\t\t\t\t\t\t\t\t\t\t\t.slug\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t// If font size is not named, update when the font size value changes.\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\tpreviousState[ fontSizeAttributeName ]\n\t\t\t\t\t\t\t\t\t\t.size !==\n\t\t\t\t\t\t\t\t\tattributes[ customFontSizeAttributeName ]\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// In this case we need to build the font size object.\n\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t! some(\n\t\t\t\t\t\t\t\tfontSizeAttributeNames,\n\t\t\t\t\t\t\t\tdidAttributesChange\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tconst newState = reduce(\n\t\t\t\t\t\t\tpickBy(\n\t\t\t\t\t\t\t\tfontSizeAttributeNames,\n\t\t\t\t\t\t\t\tdidAttributesChange\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\tnewStateAccumulator,\n\t\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tconst fontSizeAttributeValue =\n\t\t\t\t\t\t\t\t\tattributes[ fontSizeAttributeName ];\n\t\t\t\t\t\t\t\tconst fontSizeObject = getFontSize(\n\t\t\t\t\t\t\t\t\tfontSizes,\n\t\t\t\t\t\t\t\t\tfontSizeAttributeValue,\n\t\t\t\t\t\t\t\t\tattributes[ customFontSizeAttributeName ]\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\tnewStateAccumulator[ fontSizeAttributeName ] = {\n\t\t\t\t\t\t\t\t\t...fontSizeObject,\n\t\t\t\t\t\t\t\t\tclass: getFontSizeClass(\n\t\t\t\t\t\t\t\t\t\tfontSizeAttributeValue\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\treturn newStateAccumulator;\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{}\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...previousState,\n\t\t\t\t\t\t\t...newState,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\trender() {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t\t{ ...{\n\t\t\t\t\t\t\t\t\t...this.props,\n\t\t\t\t\t\t\t\t\tfontSizes: undefined,\n\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t...this.setters,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t},\n\t\t] ),\n\t\t'withFontSizes'\n\t);\n};\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/font-sizes/with-font-sizes.js"],"names":["DEFAULT_FONT_SIZES","fontSizeNames","fontSizeAttributeNames","fontSizeAttributeNamesAccumulator","fontSizeAttributeName","WrappedComponent","props","fontSizes","Component","constructor","setters","createSetters","state","settersAccumulator","customFontSizeAttributeName","upperFirstFontSizeAttributeName","createSetFontSize","fontSizeValue","fontSizeObject","size","Number","setAttributes","slug","undefined","getDerivedStateFromProps","previousState","attributes","didAttributesChange","newState","newStateAccumulator","fontSizeAttributeValue","class","render"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { find, pickBy, reduce, some, upperFirst } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { createHigherOrderComponent, compose } from '@wordpress/compose';\nimport { Component } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { getFontSize, getFontSizeClass } from './utils';\nimport useSetting from '../use-setting';\n\nconst DEFAULT_FONT_SIZES = [];\n\n/**\n * Higher-order component, which handles font size logic for class generation,\n * font size value retrieval, and font size change handling.\n *\n * @param {...(Object|string)} fontSizeNames The arguments should all be strings.\n *                                           Each string contains the font size\n *                                           attribute name e.g: 'fontSize'.\n *\n * @return {Function} Higher-order component.\n */\nexport default ( ...fontSizeNames ) => {\n\t/*\n\t * Computes an object whose key is the font size attribute name as passed in the array,\n\t * and the value is the custom font size attribute name.\n\t * Custom font size is automatically compted by appending custom followed by the font size attribute name in with the first letter capitalized.\n\t */\n\tconst fontSizeAttributeNames = reduce(\n\t\tfontSizeNames,\n\t\t( fontSizeAttributeNamesAccumulator, fontSizeAttributeName ) => {\n\t\t\tfontSizeAttributeNamesAccumulator[\n\t\t\t\tfontSizeAttributeName\n\t\t\t] = `custom${ upperFirst( fontSizeAttributeName ) }`;\n\t\t\treturn fontSizeAttributeNamesAccumulator;\n\t\t},\n\t\t{}\n\t);\n\n\treturn createHigherOrderComponent(\n\t\tcompose( [\n\t\t\tcreateHigherOrderComponent(\n\t\t\t\t( WrappedComponent ) => ( props ) => {\n\t\t\t\t\tconst fontSizes =\n\t\t\t\t\t\tuseSetting( 'typography.fontSizes' ) ||\n\t\t\t\t\t\tDEFAULT_FONT_SIZES;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\tfontSizes={ fontSizes }\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t},\n\t\t\t\t'withFontSizes'\n\t\t\t),\n\t\t\t( WrappedComponent ) => {\n\t\t\t\treturn class extends Component {\n\t\t\t\t\tconstructor( props ) {\n\t\t\t\t\t\tsuper( props );\n\n\t\t\t\t\t\tthis.setters = this.createSetters();\n\n\t\t\t\t\t\tthis.state = {};\n\t\t\t\t\t}\n\n\t\t\t\t\tcreateSetters() {\n\t\t\t\t\t\treturn reduce(\n\t\t\t\t\t\t\tfontSizeAttributeNames,\n\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\tsettersAccumulator,\n\t\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tconst upperFirstFontSizeAttributeName =\n\t\t\t\t\t\t\t\t\tupperFirst( fontSizeAttributeName );\n\t\t\t\t\t\t\t\tsettersAccumulator[\n\t\t\t\t\t\t\t\t\t`set${ upperFirstFontSizeAttributeName }`\n\t\t\t\t\t\t\t\t] = this.createSetFontSize(\n\t\t\t\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\t\t\t\tcustomFontSizeAttributeName\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\treturn settersAccumulator;\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{}\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\n\t\t\t\t\tcreateSetFontSize(\n\t\t\t\t\t\tfontSizeAttributeName,\n\t\t\t\t\t\tcustomFontSizeAttributeName\n\t\t\t\t\t) {\n\t\t\t\t\t\treturn ( fontSizeValue ) => {\n\t\t\t\t\t\t\tconst fontSizeObject = find( this.props.fontSizes, {\n\t\t\t\t\t\t\t\tsize: Number( fontSizeValue ),\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tthis.props.setAttributes( {\n\t\t\t\t\t\t\t\t[ fontSizeAttributeName ]:\n\t\t\t\t\t\t\t\t\tfontSizeObject && fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t? fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t\t[ customFontSizeAttributeName ]:\n\t\t\t\t\t\t\t\t\tfontSizeObject && fontSizeObject.slug\n\t\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t\t: fontSizeValue,\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\tstatic getDerivedStateFromProps(\n\t\t\t\t\t\t{ attributes, fontSizes },\n\t\t\t\t\t\tpreviousState\n\t\t\t\t\t) {\n\t\t\t\t\t\tconst didAttributesChange = (\n\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\tif ( previousState[ fontSizeAttributeName ] ) {\n\t\t\t\t\t\t\t\t// If new font size is name compare with the previous slug.\n\t\t\t\t\t\t\t\tif ( attributes[ fontSizeAttributeName ] ) {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\tattributes[ fontSizeAttributeName ] !==\n\t\t\t\t\t\t\t\t\t\tpreviousState[ fontSizeAttributeName ]\n\t\t\t\t\t\t\t\t\t\t\t.slug\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t// If font size is not named, update when the font size value changes.\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\tpreviousState[ fontSizeAttributeName ]\n\t\t\t\t\t\t\t\t\t\t.size !==\n\t\t\t\t\t\t\t\t\tattributes[ customFontSizeAttributeName ]\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// In this case we need to build the font size object.\n\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t};\n\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t! some(\n\t\t\t\t\t\t\t\tfontSizeAttributeNames,\n\t\t\t\t\t\t\t\tdidAttributesChange\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tconst newState = reduce(\n\t\t\t\t\t\t\tpickBy(\n\t\t\t\t\t\t\t\tfontSizeAttributeNames,\n\t\t\t\t\t\t\t\tdidAttributesChange\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\tnewStateAccumulator,\n\t\t\t\t\t\t\t\tcustomFontSizeAttributeName,\n\t\t\t\t\t\t\t\tfontSizeAttributeName\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tconst fontSizeAttributeValue =\n\t\t\t\t\t\t\t\t\tattributes[ fontSizeAttributeName ];\n\t\t\t\t\t\t\t\tconst fontSizeObject = getFontSize(\n\t\t\t\t\t\t\t\t\tfontSizes,\n\t\t\t\t\t\t\t\t\tfontSizeAttributeValue,\n\t\t\t\t\t\t\t\t\tattributes[ customFontSizeAttributeName ]\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\tnewStateAccumulator[ fontSizeAttributeName ] = {\n\t\t\t\t\t\t\t\t\t...fontSizeObject,\n\t\t\t\t\t\t\t\t\tclass: getFontSizeClass(\n\t\t\t\t\t\t\t\t\t\tfontSizeAttributeValue\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\treturn newStateAccumulator;\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{}\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...previousState,\n\t\t\t\t\t\t\t...newState,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\trender() {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<WrappedComponent\n\t\t\t\t\t\t\t\t{ ...{\n\t\t\t\t\t\t\t\t\t...this.props,\n\t\t\t\t\t\t\t\t\tfontSizes: undefined,\n\t\t\t\t\t\t\t\t\t...this.state,\n\t\t\t\t\t\t\t\t\t...this.setters,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t},\n\t\t] ),\n\t\t'withFontSizes'\n\t);\n};\n"]}

package/build/components/iframe/index.js

@@ -79,12 +79,25 @@ function useStylesCompatibility() {
         return;
       }
 
-      const isMatch = Array.from(cssRules).find(_ref => {
-        let {
-          selectorText
-        } = _ref;
-        return selectorText && (selectorText.includes(`.${BODY_CLASS_NAME}`) || selectorText.includes(`.${BLOCK_PREFIX}`));
-      });
+      function matchFromRules(_cssRules) {
+        return Array.from(_cssRules).find(_ref => {
+          let {
+            selectorText,
+            conditionText,
+            cssRules: __cssRules
+          } = _ref;
+
+          // If the rule is conditional then it will not have selector text.
+          // Recurse into child CSS ruleset to determine selector eligibility.
+          if (conditionText) {
+            return matchFromRules(__cssRules);
+          }
+
+          return selectorText && (selectorText.includes(`.${BODY_CLASS_NAME}`) || selectorText.includes(`.${BLOCK_PREFIX}`));
+        });
+      }
+
+      const isMatch = matchFromRules(cssRules);
 
       if (isMatch && !node.ownerDocument.getElementById(ownerNode.id)) {
         // Display warning once we have a way to add style dependencies to the editor.

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/iframe/index.js"],"names":["BODY_CLASS_NAME","BLOCK_PREFIX","useStylesCompatibility","node","Array","from","document","styleSheets","forEach","styleSheet","cssRules","e","ownerNode","tagName","id","isMatch","find","selectorText","includes","ownerDocument","getElementById","appendChild","cloneNode","inlineCssId","replace","inlineCssElement","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","implementation","createHTMLDocument","body","innerHTML","children","loadScript","head","src","Promise","resolve","reject","script","createElement","onload","onerror","Iframe","ref","contentRef","tabIndex","assets","props","forceRender","iframeDocument","setIframeDocument","bodyClasses","setBodyClasses","styles","scripts","clearerRef","before","writingFlowRef","after","setRef","setDocumentIfReady","contentDocument","readyState","documentElement","classList","filter","startsWith","dir","removeChild","removeEventListener","headRef","element","reduce","promise","then","finally","bodyRef","styleCompatibilityRef","map","href","rel","media","textContent","TagName","toLowerCase","display"],"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} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { useMergeRefs, useRefEffect } from '@wordpress/compose';\nimport { __experimentalStyleProvider as StyleProvider } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\nimport { useWritingFlow } from '../writing-flow';\n\nconst BODY_CLASS_NAME = 'editor-styles-wrapper';\nconst BLOCK_PREFIX = 'wp-block';\n\n/**\n * Clones stylesheets targetting the editor canvas to the given document. A\n * stylesheet is 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 */\nfunction useStylesCompatibility() {\n\treturn useRefEffect( ( node ) => {\n\t\t// Search the document for stylesheets targetting the editor canvas.\n\t\tArray.from( document.styleSheets ).forEach( ( styleSheet ) => {\n\t\t\ttry {\n\t\t\t\t// May fail for external styles.\n\t\t\t\t// eslint-disable-next-line no-unused-expressions\n\t\t\t\tstyleSheet.cssRules;\n\t\t\t} catch ( e ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst { ownerNode, cssRules } = styleSheet;\n\n\t\t\tif ( ! cssRules ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Generally, ignore inline styles. We add inline styles belonging to a\n\t\t\t// stylesheet later, which may or may not match the selectors.\n\t\t\tif ( ownerNode.tagName !== 'LINK' ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Don't try to add the reset styles, which were removed as a dependency\n\t\t\t// from `edit-blocks` for the iframe since we don't need to reset admin\n\t\t\t// styles.\n\t\t\tif ( ownerNode.id === 'wp-reset-editor-styles-css' ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst isMatch = Array.from( cssRules ).find(\n\t\t\t\t( { selectorText } ) =>\n\t\t\t\t\tselectorText &&\n\t\t\t\t\t( selectorText.includes( `.${ BODY_CLASS_NAME }` ) ||\n\t\t\t\t\t\tselectorText.includes( `.${ BLOCK_PREFIX }` ) )\n\t\t\t);\n\n\t\t\tif (\n\t\t\t\tisMatch &&\n\t\t\t\t! node.ownerDocument.getElementById( ownerNode.id )\n\t\t\t) {\n\t\t\t\t// Display warning once we have a way to add style dependencies to the editor.\n\t\t\t\t// See: https://github.com/WordPress/gutenberg/pull/37466.\n\t\t\t\tnode.appendChild( ownerNode.cloneNode( true ) );\n\n\t\t\t\t// Add inline styles belonging to the stylesheet.\n\t\t\t\tconst inlineCssId = ownerNode.id.replace(\n\t\t\t\t\t'-css',\n\t\t\t\t\t'-inline-css'\n\t\t\t\t);\n\t\t\t\tconst inlineCssElement = document.getElementById( inlineCssId );\n\n\t\t\t\tif ( inlineCssElement ) {\n\t\t\t\t\tnode.appendChild( inlineCssElement.cloneNode( true ) );\n\t\t\t\t}\n\t\t\t}\n\t\t} );\n\t}, [] );\n}\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' ];\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\t{ contentRef, children, head, tabIndex = 0, assets, ...props },\n\tref\n) {\n\tconst [ , forceRender ] = useReducer( () => ( {} ) );\n\tconst [ iframeDocument, setIframeDocument ] = useState();\n\tconst [ bodyClasses, setBodyClasses ] = useState( [] );\n\tconst styles = useParsedAssets( assets?.styles );\n\tconst scripts = useParsedAssets( assets?.scripts );\n\tconst clearerRef = useBlockSelectionClearer();\n\tconst [ before, writingFlowRef, after ] = useWritingFlow();\n\tconst setRef = useRefEffect( ( node ) => {\n\t\tfunction setDocumentIfReady() {\n\t\t\tconst { contentDocument, ownerDocument } = node;\n\t\t\tconst { readyState, documentElement } = 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\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 () => node.removeEventListener( 'load', setDocumentIfReady );\n\t}, [] );\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 bodyRef = useMergeRefs( [ contentRef, clearerRef, writingFlowRef ] );\n\tconst styleCompatibilityRef = useStylesCompatibility();\n\n\thead = (\n\t\t<>\n\t\t\t<style>{ 'body{margin:0}' }</style>\n\t\t\t{ styles.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\t{ head }\n\t\t</>\n\t);\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\tref={ useMergeRefs( [ ref, setRef ] ) }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t// Correct doctype is required to enable rendering in standards mode\n\t\t\t\tsrcDoc=\"<!doctype html>\"\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 }>{ head }</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\tBODY_CLASS_NAME,\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{ /*\n\t\t\t\t\t\t\t\t * This is a wrapper for the extra styles and scripts\n\t\t\t\t\t\t\t\t * rendered imperatively by cloning the parent,\n\t\t\t\t\t\t\t\t * it's important that this div's content remains uncontrolled.\n\t\t\t\t\t\t\t\t */ }\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tstyle={ { display: 'none' } }\n\t\t\t\t\t\t\t\t\tref={ styleCompatibilityRef }\n\t\t\t\t\t\t\t\t/>\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\nexport default forwardRef( Iframe );\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/iframe/index.js"],"names":["BODY_CLASS_NAME","BLOCK_PREFIX","useStylesCompatibility","node","Array","from","document","styleSheets","forEach","styleSheet","cssRules","e","ownerNode","tagName","id","matchFromRules","_cssRules","find","selectorText","conditionText","__cssRules","includes","isMatch","ownerDocument","getElementById","appendChild","cloneNode","inlineCssId","replace","inlineCssElement","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","implementation","createHTMLDocument","body","innerHTML","children","loadScript","head","src","Promise","resolve","reject","script","createElement","onload","onerror","Iframe","ref","contentRef","tabIndex","assets","props","forceRender","iframeDocument","setIframeDocument","bodyClasses","setBodyClasses","styles","scripts","clearerRef","before","writingFlowRef","after","setRef","setDocumentIfReady","contentDocument","readyState","documentElement","classList","filter","startsWith","dir","removeChild","removeEventListener","headRef","element","reduce","promise","then","finally","bodyRef","styleCompatibilityRef","map","href","rel","media","textContent","TagName","toLowerCase","display"],"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} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { useMergeRefs, useRefEffect } from '@wordpress/compose';\nimport { __experimentalStyleProvider as StyleProvider } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\nimport { useWritingFlow } from '../writing-flow';\n\nconst BODY_CLASS_NAME = 'editor-styles-wrapper';\nconst BLOCK_PREFIX = 'wp-block';\n\n/**\n * Clones stylesheets targetting the editor canvas to the given document. A\n * stylesheet is 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 */\nfunction useStylesCompatibility() {\n\treturn useRefEffect( ( node ) => {\n\t\t// Search the document for stylesheets targetting the editor canvas.\n\t\tArray.from( document.styleSheets ).forEach( ( styleSheet ) => {\n\t\t\ttry {\n\t\t\t\t// May fail for external styles.\n\t\t\t\t// eslint-disable-next-line no-unused-expressions\n\t\t\t\tstyleSheet.cssRules;\n\t\t\t} catch ( e ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst { ownerNode, cssRules } = styleSheet;\n\n\t\t\tif ( ! cssRules ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Generally, ignore inline styles. We add inline styles belonging to a\n\t\t\t// stylesheet later, which may or may not match the selectors.\n\t\t\tif ( ownerNode.tagName !== 'LINK' ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Don't try to add the reset styles, which were removed as a dependency\n\t\t\t// from `edit-blocks` for the iframe since we don't need to reset admin\n\t\t\t// styles.\n\t\t\tif ( ownerNode.id === 'wp-reset-editor-styles-css' ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tfunction matchFromRules( _cssRules ) {\n\t\t\t\treturn Array.from( _cssRules ).find(\n\t\t\t\t\t( {\n\t\t\t\t\t\tselectorText,\n\t\t\t\t\t\tconditionText,\n\t\t\t\t\t\tcssRules: __cssRules,\n\t\t\t\t\t} ) => {\n\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// Recurse into child CSS ruleset to determine selector eligibility.\n\t\t\t\t\t\tif ( conditionText ) {\n\t\t\t\t\t\t\treturn matchFromRules( __cssRules );\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\tselectorText &&\n\t\t\t\t\t\t\t( selectorText.includes(\n\t\t\t\t\t\t\t\t`.${ BODY_CLASS_NAME }`\n\t\t\t\t\t\t\t) ||\n\t\t\t\t\t\t\t\tselectorText.includes( `.${ BLOCK_PREFIX }` ) )\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tconst isMatch = matchFromRules( cssRules );\n\n\t\t\tif (\n\t\t\t\tisMatch &&\n\t\t\t\t! node.ownerDocument.getElementById( ownerNode.id )\n\t\t\t) {\n\t\t\t\t// Display warning once we have a way to add style dependencies to the editor.\n\t\t\t\t// See: https://github.com/WordPress/gutenberg/pull/37466.\n\t\t\t\tnode.appendChild( ownerNode.cloneNode( true ) );\n\n\t\t\t\t// Add inline styles belonging to the stylesheet.\n\t\t\t\tconst inlineCssId = ownerNode.id.replace(\n\t\t\t\t\t'-css',\n\t\t\t\t\t'-inline-css'\n\t\t\t\t);\n\t\t\t\tconst inlineCssElement = document.getElementById( inlineCssId );\n\n\t\t\t\tif ( inlineCssElement ) {\n\t\t\t\t\tnode.appendChild( inlineCssElement.cloneNode( true ) );\n\t\t\t\t}\n\t\t\t}\n\t\t} );\n\t}, [] );\n}\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' ];\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\t{ contentRef, children, head, tabIndex = 0, assets, ...props },\n\tref\n) {\n\tconst [ , forceRender ] = useReducer( () => ( {} ) );\n\tconst [ iframeDocument, setIframeDocument ] = useState();\n\tconst [ bodyClasses, setBodyClasses ] = useState( [] );\n\tconst styles = useParsedAssets( assets?.styles );\n\tconst scripts = useParsedAssets( assets?.scripts );\n\tconst clearerRef = useBlockSelectionClearer();\n\tconst [ before, writingFlowRef, after ] = useWritingFlow();\n\tconst setRef = useRefEffect( ( node ) => {\n\t\tfunction setDocumentIfReady() {\n\t\t\tconst { contentDocument, ownerDocument } = node;\n\t\t\tconst { readyState, documentElement } = 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\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 () => node.removeEventListener( 'load', setDocumentIfReady );\n\t}, [] );\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 bodyRef = useMergeRefs( [ contentRef, clearerRef, writingFlowRef ] );\n\tconst styleCompatibilityRef = useStylesCompatibility();\n\n\thead = (\n\t\t<>\n\t\t\t<style>{ 'body{margin:0}' }</style>\n\t\t\t{ styles.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\t{ head }\n\t\t</>\n\t);\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\tref={ useMergeRefs( [ ref, setRef ] ) }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t// Correct doctype is required to enable rendering in standards mode\n\t\t\t\tsrcDoc=\"<!doctype html>\"\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 }>{ head }</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\tBODY_CLASS_NAME,\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{ /*\n\t\t\t\t\t\t\t\t * This is a wrapper for the extra styles and scripts\n\t\t\t\t\t\t\t\t * rendered imperatively by cloning the parent,\n\t\t\t\t\t\t\t\t * it's important that this div's content remains uncontrolled.\n\t\t\t\t\t\t\t\t */ }\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tstyle={ { display: 'none' } }\n\t\t\t\t\t\t\t\t\tref={ styleCompatibilityRef }\n\t\t\t\t\t\t\t\t/>\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\nexport default forwardRef( Iframe );\n"]}

package/build/components/image-editor/aspect-ratio-dropdown.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/image-editor/aspect-ratio-dropdown.js"],"names":["AspectGroup","aspectRatios","isDisabled","label","onClick","value","map","title","aspect","check","undefined","AspectRatioDropdown","toggleProps","isInProgress","setAspect","defaultAspect","aspectRatioIcon","POPOVER_PROPS","onClose","newAspect"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { check, aspectRatio as aspectRatioIcon } from '@wordpress/icons';\nimport { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { POPOVER_PROPS } from './constants';\nimport { useImageEditingContext } from './context';\n\nfunction AspectGroup( { aspectRatios, isDisabled, label, onClick, value } ) {\n\treturn (\n\t\t<MenuGroup label={ label }>\n\t\t\t{ aspectRatios.map( ( { title, aspect } ) => (\n\t\t\t\t<MenuItem\n\t\t\t\t\tkey={ aspect }\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonClick( aspect );\n\t\t\t\t\t} }\n\t\t\t\t\trole=\"menuitemradio\"\n\t\t\t\t\tisSelected={ aspect === value }\n\t\t\t\t\ticon={ aspect === value ? check : undefined }\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</MenuItem>\n\t\t\t) ) }\n\t\t</MenuGroup>\n\t);\n}\n\nexport default function AspectRatioDropdown( { toggleProps } ) {\n\tconst {\n\t\tisInProgress,\n\t\taspect,\n\t\tsetAspect,\n\t\tdefaultAspect,\n\t} = useImageEditingContext();\n\n\treturn (\n\t\t<DropdownMenu\n\t\t\ticon={ aspectRatioIcon }\n\t\t\tlabel={ __( 'Aspect Ratio' ) }\n\t\t\tpopoverProps={ POPOVER_PROPS }\n\t\t\ttoggleProps={ toggleProps }\n\t\t\tclassName=\"wp-block-image__aspect-ratio\"\n\t\t>\n\t\t\t{ ( { onClose } ) => (\n\t\t\t\t<>\n\t\t\t\t\t<AspectGroup\n\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\taspectRatios={ [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( 'Original' ),\n\t\t\t\t\t\t\t\taspect: defaultAspect,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( 'Square' ),\n\t\t\t\t\t\t\t\taspect: 1,\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\t<AspectGroup\n\t\t\t\t\t\tlabel={ __( 'Landscape' ) }\n\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\taspectRatios={ [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '16:10' ),\n\t\t\t\t\t\t\t\taspect: 16 / 10,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '16:9' ),\n\t\t\t\t\t\t\t\taspect: 16 / 9,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '4:3' ),\n\t\t\t\t\t\t\t\taspect: 4 / 3,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '3:2' ),\n\t\t\t\t\t\t\t\taspect: 3 / 2,\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\t<AspectGroup\n\t\t\t\t\t\tlabel={ __( 'Portrait' ) }\n\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\taspectRatios={ [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '10:16' ),\n\t\t\t\t\t\t\t\taspect: 10 / 16,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '9:16' ),\n\t\t\t\t\t\t\t\taspect: 9 / 16,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '3:4' ),\n\t\t\t\t\t\t\t\taspect: 3 / 4,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '2:3' ),\n\t\t\t\t\t\t\t\taspect: 2 / 3,\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\t\t\t) }\n\t\t</DropdownMenu>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/image-editor/aspect-ratio-dropdown.js"],"names":["AspectGroup","aspectRatios","isDisabled","label","onClick","value","map","title","aspect","check","undefined","AspectRatioDropdown","toggleProps","isInProgress","setAspect","defaultAspect","aspectRatioIcon","POPOVER_PROPS","onClose","newAspect"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { check, aspectRatio as aspectRatioIcon } from '@wordpress/icons';\nimport { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { POPOVER_PROPS } from './constants';\nimport { useImageEditingContext } from './context';\n\nfunction AspectGroup( { aspectRatios, isDisabled, label, onClick, value } ) {\n\treturn (\n\t\t<MenuGroup label={ label }>\n\t\t\t{ aspectRatios.map( ( { title, aspect } ) => (\n\t\t\t\t<MenuItem\n\t\t\t\t\tkey={ aspect }\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonClick( aspect );\n\t\t\t\t\t} }\n\t\t\t\t\trole=\"menuitemradio\"\n\t\t\t\t\tisSelected={ aspect === value }\n\t\t\t\t\ticon={ aspect === value ? check : undefined }\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</MenuItem>\n\t\t\t) ) }\n\t\t</MenuGroup>\n\t);\n}\n\nexport default function AspectRatioDropdown( { toggleProps } ) {\n\tconst { isInProgress, aspect, setAspect, defaultAspect } =\n\t\tuseImageEditingContext();\n\n\treturn (\n\t\t<DropdownMenu\n\t\t\ticon={ aspectRatioIcon }\n\t\t\tlabel={ __( 'Aspect Ratio' ) }\n\t\t\tpopoverProps={ POPOVER_PROPS }\n\t\t\ttoggleProps={ toggleProps }\n\t\t\tclassName=\"wp-block-image__aspect-ratio\"\n\t\t>\n\t\t\t{ ( { onClose } ) => (\n\t\t\t\t<>\n\t\t\t\t\t<AspectGroup\n\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\taspectRatios={ [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( 'Original' ),\n\t\t\t\t\t\t\t\taspect: defaultAspect,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( 'Square' ),\n\t\t\t\t\t\t\t\taspect: 1,\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\t<AspectGroup\n\t\t\t\t\t\tlabel={ __( 'Landscape' ) }\n\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\taspectRatios={ [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '16:10' ),\n\t\t\t\t\t\t\t\taspect: 16 / 10,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '16:9' ),\n\t\t\t\t\t\t\t\taspect: 16 / 9,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '4:3' ),\n\t\t\t\t\t\t\t\taspect: 4 / 3,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '3:2' ),\n\t\t\t\t\t\t\t\taspect: 3 / 2,\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\t<AspectGroup\n\t\t\t\t\t\tlabel={ __( 'Portrait' ) }\n\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\taspectRatios={ [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '10:16' ),\n\t\t\t\t\t\t\t\taspect: 10 / 16,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '9:16' ),\n\t\t\t\t\t\t\t\taspect: 9 / 16,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '3:4' ),\n\t\t\t\t\t\t\t\taspect: 3 / 4,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: __( '2:3' ),\n\t\t\t\t\t\t\t\taspect: 2 / 3,\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\t\t\t) }\n\t\t</DropdownMenu>\n\t);\n}\n"]}

package/build/components/image-size-control/index.js

@@ -30,6 +30,8 @@ var _useDimensionHandler = _interopRequireDefault(require("./use-dimension-handl
  */
 const IMAGE_SIZE_PRESETS = [25, 50, 75, 100];
 
+const noop = () => {};
+
 function ImageSizeControl(_ref) {
   let {
     imageWidth,
@@ -40,7 +42,7 @@ function ImageSizeControl(_ref) {
     width,
     height,
     onChange,
-    onChangeImage = _lodash.noop
+    onChangeImage = noop
   } = _ref;
   const {
     currentHeight,

package/build/components/image-size-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/image-size-control/index.js"],"names":["IMAGE_SIZE_PRESETS","ImageSizeControl","imageWidth","imageHeight","imageSizeOptions","isResizable","slug","width","height","onChange","onChangeImage","noop","currentHeight","currentWidth","updateDimension","updateDimensions","value","map","scale","scaledWidth","Math","round","scaledHeight","isCurrent","undefined"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { isEmpty, noop } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tButtonGroup,\n\tSelectControl,\n\tTextControl,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport useDimensionHandler from './use-dimension-handler';\n\nconst IMAGE_SIZE_PRESETS = [ 25, 50, 75, 100 ];\n\nexport default function ImageSizeControl( {\n\timageWidth,\n\timageHeight,\n\timageSizeOptions = [],\n\tisResizable = true,\n\tslug,\n\twidth,\n\theight,\n\tonChange,\n\tonChangeImage = noop,\n} ) {\n\tconst {\n\t\tcurrentHeight,\n\t\tcurrentWidth,\n\t\tupdateDimension,\n\t\tupdateDimensions,\n\t} = useDimensionHandler( height, width, imageHeight, imageWidth, onChange );\n\n\treturn (\n\t\t<>\n\t\t\t{ ! isEmpty( imageSizeOptions ) && (\n\t\t\t\t<SelectControl\n\t\t\t\t\tlabel={ __( 'Image size' ) }\n\t\t\t\t\tvalue={ slug }\n\t\t\t\t\toptions={ imageSizeOptions }\n\t\t\t\t\tonChange={ onChangeImage }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ isResizable && (\n\t\t\t\t<div className=\"block-editor-image-size-control\">\n\t\t\t\t\t<p className=\"block-editor-image-size-control__row\">\n\t\t\t\t\t\t{ __( 'Image dimensions' ) }\n\t\t\t\t\t</p>\n\t\t\t\t\t<div className=\"block-editor-image-size-control__row\">\n\t\t\t\t\t\t<TextControl\n\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\tclassName=\"block-editor-image-size-control__width\"\n\t\t\t\t\t\t\tlabel={ __( 'Width' ) }\n\t\t\t\t\t\t\tvalue={ currentWidth }\n\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\tupdateDimension( 'width', value )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<TextControl\n\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\tclassName=\"block-editor-image-size-control__height\"\n\t\t\t\t\t\t\tlabel={ __( 'Height' ) }\n\t\t\t\t\t\t\tvalue={ currentHeight }\n\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\tupdateDimension( 'height', value )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div className=\"block-editor-image-size-control__row\">\n\t\t\t\t\t\t<ButtonGroup aria-label={ __( 'Image size presets' ) }>\n\t\t\t\t\t\t\t{ IMAGE_SIZE_PRESETS.map( ( scale ) => {\n\t\t\t\t\t\t\t\tconst scaledWidth = Math.round(\n\t\t\t\t\t\t\t\t\timageWidth * ( scale / 100 )\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\tconst scaledHeight = Math.round(\n\t\t\t\t\t\t\t\t\timageHeight * ( scale / 100 )\n\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\tconst isCurrent =\n\t\t\t\t\t\t\t\t\tcurrentWidth === scaledWidth &&\n\t\t\t\t\t\t\t\t\tcurrentHeight === scaledHeight;\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tkey={ scale }\n\t\t\t\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\t\tisCurrent ? 'primary' : undefined\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tisPressed={ isCurrent }\n\t\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t\tupdateDimensions(\n\t\t\t\t\t\t\t\t\t\t\t\tscaledHeight,\n\t\t\t\t\t\t\t\t\t\t\t\tscaledWidth\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ scale }%\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t</ButtonGroup>\n\t\t\t\t\t\t<Button isSmall onClick={ () => updateDimensions() }>\n\t\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/image-size-control/index.js"],"names":["IMAGE_SIZE_PRESETS","noop","ImageSizeControl","imageWidth","imageHeight","imageSizeOptions","isResizable","slug","width","height","onChange","onChangeImage","currentHeight","currentWidth","updateDimension","updateDimensions","value","map","scale","scaledWidth","Math","round","scaledHeight","isCurrent","undefined"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { isEmpty } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tButtonGroup,\n\tSelectControl,\n\tTextControl,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport useDimensionHandler from './use-dimension-handler';\n\nconst IMAGE_SIZE_PRESETS = [ 25, 50, 75, 100 ];\nconst noop = () => {};\n\nexport default function ImageSizeControl( {\n\timageWidth,\n\timageHeight,\n\timageSizeOptions = [],\n\tisResizable = true,\n\tslug,\n\twidth,\n\theight,\n\tonChange,\n\tonChangeImage = noop,\n} ) {\n\tconst { currentHeight, currentWidth, updateDimension, updateDimensions } =\n\t\tuseDimensionHandler( height, width, imageHeight, imageWidth, onChange );\n\n\treturn (\n\t\t<>\n\t\t\t{ ! isEmpty( imageSizeOptions ) && (\n\t\t\t\t<SelectControl\n\t\t\t\t\tlabel={ __( 'Image size' ) }\n\t\t\t\t\tvalue={ slug }\n\t\t\t\t\toptions={ imageSizeOptions }\n\t\t\t\t\tonChange={ onChangeImage }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ isResizable && (\n\t\t\t\t<div className=\"block-editor-image-size-control\">\n\t\t\t\t\t<p className=\"block-editor-image-size-control__row\">\n\t\t\t\t\t\t{ __( 'Image dimensions' ) }\n\t\t\t\t\t</p>\n\t\t\t\t\t<div className=\"block-editor-image-size-control__row\">\n\t\t\t\t\t\t<TextControl\n\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\tclassName=\"block-editor-image-size-control__width\"\n\t\t\t\t\t\t\tlabel={ __( 'Width' ) }\n\t\t\t\t\t\t\tvalue={ currentWidth }\n\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\tupdateDimension( 'width', value )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<TextControl\n\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\tclassName=\"block-editor-image-size-control__height\"\n\t\t\t\t\t\t\tlabel={ __( 'Height' ) }\n\t\t\t\t\t\t\tvalue={ currentHeight }\n\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\tupdateDimension( 'height', value )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div className=\"block-editor-image-size-control__row\">\n\t\t\t\t\t\t<ButtonGroup aria-label={ __( 'Image size presets' ) }>\n\t\t\t\t\t\t\t{ IMAGE_SIZE_PRESETS.map( ( scale ) => {\n\t\t\t\t\t\t\t\tconst scaledWidth = Math.round(\n\t\t\t\t\t\t\t\t\timageWidth * ( scale / 100 )\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\tconst scaledHeight = Math.round(\n\t\t\t\t\t\t\t\t\timageHeight * ( scale / 100 )\n\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\tconst isCurrent =\n\t\t\t\t\t\t\t\t\tcurrentWidth === scaledWidth &&\n\t\t\t\t\t\t\t\t\tcurrentHeight === scaledHeight;\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tkey={ scale }\n\t\t\t\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\t\tisCurrent ? 'primary' : undefined\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tisPressed={ isCurrent }\n\t\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t\tupdateDimensions(\n\t\t\t\t\t\t\t\t\t\t\t\tscaledHeight,\n\t\t\t\t\t\t\t\t\t\t\t\tscaledWidth\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ scale }%\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t</ButtonGroup>\n\t\t\t\t\t\t<Button isSmall onClick={ () => updateDimensions() }>\n\t\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"]}