@wordpress/customize-widgets 5.32.0 → 5.32.1-next.ff1cebbba.0

package/build-module/utils.js

@@ -1,17 +1,6 @@
-// @ts-check
-/**
- * WordPress dependencies
- */
-import { serialize, parse, createBlock } from '@wordpress/blocks';
-import { addWidgetIdToBlock } from '@wordpress/widgets';
-
-/**
- * Convert settingId to widgetId.
- *
- * @param {string} settingId The setting id.
- * @return {string} The widget id.
- */
-export function settingIdToWidgetId(settingId) {
+import { serialize, parse, createBlock } from "@wordpress/blocks";
+import { addWidgetIdToBlock } from "@wordpress/widgets";
+function settingIdToWidgetId(settingId) {
   const matches = settingId.match(/^widget_(.+)(?:\[(\d+)\])$/);
   if (matches) {
     const idBase = matches[1];
@@ -20,32 +9,16 @@ export function settingIdToWidgetId(settingId) {
   }
   return settingId;
 }
-
-/**
- * Transform a block to a customizable widget.
- *
- * @param {WPBlock} block          The block to be transformed from.
- * @param {Object}  existingWidget The widget to be extended from.
- * @return {Object} The transformed widget.
- */
-export function blockToWidget(block, existingWidget = null) {
+function blockToWidget(block, existingWidget = null) {
   let widget;
-  const isValidLegacyWidgetBlock = block.name === 'core/legacy-widget' && (block.attributes.id || block.attributes.instance);
+  const isValidLegacyWidgetBlock = block.name === "core/legacy-widget" && (block.attributes.id || block.attributes.instance);
   if (isValidLegacyWidgetBlock) {
     if (block.attributes.id) {
-      // Widget that does not extend WP_Widget.
       widget = {
         id: block.attributes.id
       };
     } else {
-      const {
-        encoded,
-        hash,
-        raw,
-        ...rest
-      } = block.attributes.instance;
-
-      // Widget that extends WP_Widget.
+      const { encoded, hash, raw, ...rest } = block.attributes.instance;
       widget = {
         idBase: block.attributes.idBase,
         instance: {
@@ -64,40 +37,20 @@ export function blockToWidget(block, existingWidget = null) {
       content: serialize(block)
     };
     widget = {
-      idBase: 'block',
-      widgetClass: 'WP_Widget_Block',
+      idBase: "block",
+      widgetClass: "WP_Widget_Block",
       instance: {
         raw_instance: instance
       }
     };
   }
-  const {
-    form,
-    rendered,
-    ...restExistingWidget
-  } = existingWidget || {};
+  const { form, rendered, ...restExistingWidget } = existingWidget || {};
   return {
     ...restExistingWidget,
     ...widget
   };
 }
-
-/**
- * Transform a widget to a block.
- *
- * @param {Object} widget          The widget to be transformed from.
- * @param {string} widget.id       The widget id.
- * @param {string} widget.idBase   The id base of the widget.
- * @param {number} widget.number   The number/index of the widget.
- * @param {Object} widget.instance The instance of the widget.
- * @return {WPBlock} The transformed block.
- */
-export function widgetToBlock({
-  id,
-  idBase,
-  number,
-  instance
-}) {
+function widgetToBlock({ id, idBase, number, instance }) {
   let block;
   const {
     encoded_serialized_instance: encoded,
@@ -105,15 +58,13 @@ export function widgetToBlock({
     raw_instance: raw,
     ...rest
   } = instance;
-  if (idBase === 'block') {
-    var _raw$content;
-    const parsedBlocks = parse((_raw$content = raw.content) !== null && _raw$content !== void 0 ? _raw$content : '', {
+  if (idBase === "block") {
+    const parsedBlocks = parse(raw.content ?? "", {
       __unstableSkipAutop: true
     });
-    block = parsedBlocks.length ? parsedBlocks[0] : createBlock('core/paragraph', {});
+    block = parsedBlocks.length ? parsedBlocks[0] : createBlock("core/paragraph", {});
   } else if (number) {
-    // Widget that extends WP_Widget.
-    block = createBlock('core/legacy-widget', {
+    block = createBlock("core/legacy-widget", {
       idBase,
       instance: {
         encoded,
@@ -123,11 +74,15 @@ export function widgetToBlock({
       }
     });
   } else {
-    // Widget that does not extend WP_Widget.
-    block = createBlock('core/legacy-widget', {
+    block = createBlock("core/legacy-widget", {
       id
     });
   }
   return addWidgetIdToBlock(block, id);
 }
-//# sourceMappingURL=utils.js.map
+export {
+  blockToWidget,
+  settingIdToWidgetId,
+  widgetToBlock
+};
+//# sourceMappingURL=utils.js.map

package/build-module/utils.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["serialize","parse","createBlock","addWidgetIdToBlock","settingIdToWidgetId","settingId","matches","match","idBase","number","parseInt","blockToWidget","block","existingWidget","widget","isValidLegacyWidgetBlock","name","attributes","id","instance","encoded","hash","raw","rest","is_widget_customizer_js_value","encoded_serialized_instance","instance_hash_key","raw_instance","content","widgetClass","form","rendered","restExistingWidget","widgetToBlock","_raw$content","parsedBlocks","__unstableSkipAutop","length"],"sources":["@wordpress/customize-widgets/src/utils.js"],"sourcesContent":["// @ts-check\n/**\n * WordPress dependencies\n */\nimport { serialize, parse, createBlock } from '@wordpress/blocks';\nimport { addWidgetIdToBlock } from '@wordpress/widgets';\n\n/**\n * Convert settingId to widgetId.\n *\n * @param {string} settingId The setting id.\n * @return {string} The widget id.\n */\nexport function settingIdToWidgetId( settingId ) {\n\tconst matches = settingId.match( /^widget_(.+)(?:\\[(\\d+)\\])$/ );\n\n\tif ( matches ) {\n\t\tconst idBase = matches[ 1 ];\n\t\tconst number = parseInt( matches[ 2 ], 10 );\n\n\t\treturn `${ idBase }-${ number }`;\n\t}\n\n\treturn settingId;\n}\n\n/**\n * Transform a block to a customizable widget.\n *\n * @param {WPBlock} block          The block to be transformed from.\n * @param {Object}  existingWidget The widget to be extended from.\n * @return {Object} The transformed widget.\n */\nexport function blockToWidget( block, existingWidget = null ) {\n\tlet widget;\n\n\tconst isValidLegacyWidgetBlock =\n\t\tblock.name === 'core/legacy-widget' &&\n\t\t( block.attributes.id || block.attributes.instance );\n\n\tif ( isValidLegacyWidgetBlock ) {\n\t\tif ( block.attributes.id ) {\n\t\t\t// Widget that does not extend WP_Widget.\n\t\t\twidget = {\n\t\t\t\tid: block.attributes.id,\n\t\t\t};\n\t\t} else {\n\t\t\tconst { encoded, hash, raw, ...rest } = block.attributes.instance;\n\n\t\t\t// Widget that extends WP_Widget.\n\t\t\twidget = {\n\t\t\t\tidBase: block.attributes.idBase,\n\t\t\t\tinstance: {\n\t\t\t\t\t...existingWidget?.instance,\n\t\t\t\t\t// Required only for the customizer.\n\t\t\t\t\tis_widget_customizer_js_value: true,\n\t\t\t\t\tencoded_serialized_instance: encoded,\n\t\t\t\t\tinstance_hash_key: hash,\n\t\t\t\t\traw_instance: raw,\n\t\t\t\t\t...rest,\n\t\t\t\t},\n\t\t\t};\n\t\t}\n\t} else {\n\t\tconst instance = {\n\t\t\tcontent: serialize( block ),\n\t\t};\n\t\twidget = {\n\t\t\tidBase: 'block',\n\t\t\twidgetClass: 'WP_Widget_Block',\n\t\t\tinstance: {\n\t\t\t\traw_instance: instance,\n\t\t\t},\n\t\t};\n\t}\n\n\tconst { form, rendered, ...restExistingWidget } = existingWidget || {};\n\n\treturn {\n\t\t...restExistingWidget,\n\t\t...widget,\n\t};\n}\n\n/**\n * Transform a widget to a block.\n *\n * @param {Object} widget          The widget to be transformed from.\n * @param {string} widget.id       The widget id.\n * @param {string} widget.idBase   The id base of the widget.\n * @param {number} widget.number   The number/index of the widget.\n * @param {Object} widget.instance The instance of the widget.\n * @return {WPBlock} The transformed block.\n */\nexport function widgetToBlock( { id, idBase, number, instance } ) {\n\tlet block;\n\n\tconst {\n\t\tencoded_serialized_instance: encoded,\n\t\tinstance_hash_key: hash,\n\t\traw_instance: raw,\n\t\t...rest\n\t} = instance;\n\n\tif ( idBase === 'block' ) {\n\t\tconst parsedBlocks = parse( raw.content ?? '', {\n\t\t\t__unstableSkipAutop: true,\n\t\t} );\n\t\tblock = parsedBlocks.length\n\t\t\t? parsedBlocks[ 0 ]\n\t\t\t: createBlock( 'core/paragraph', {} );\n\t} else if ( number ) {\n\t\t// Widget that extends WP_Widget.\n\t\tblock = createBlock( 'core/legacy-widget', {\n\t\t\tidBase,\n\t\t\tinstance: {\n\t\t\t\tencoded,\n\t\t\t\thash,\n\t\t\t\traw,\n\t\t\t\t...rest,\n\t\t\t},\n\t\t} );\n\t} else {\n\t\t// Widget that does not extend WP_Widget.\n\t\tblock = createBlock( 'core/legacy-widget', {\n\t\t\tid,\n\t\t} );\n\t}\n\n\treturn addWidgetIdToBlock( block, id );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA,SAASA,SAAS,EAAEC,KAAK,EAAEC,WAAW,QAAQ,mBAAmB;AACjE,SAASC,kBAAkB,QAAQ,oBAAoB;;AAEvD;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,mBAAmBA,CAAEC,SAAS,EAAG;EAChD,MAAMC,OAAO,GAAGD,SAAS,CAACE,KAAK,CAAE,4BAA6B,CAAC;EAE/D,IAAKD,OAAO,EAAG;IACd,MAAME,MAAM,GAAGF,OAAO,CAAE,CAAC,CAAE;IAC3B,MAAMG,MAAM,GAAGC,QAAQ,CAAEJ,OAAO,CAAE,CAAC,CAAE,EAAE,EAAG,CAAC;IAE3C,OAAO,GAAIE,MAAM,IAAMC,MAAM,EAAG;EACjC;EAEA,OAAOJ,SAAS;AACjB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASM,aAAaA,CAAEC,KAAK,EAAEC,cAAc,GAAG,IAAI,EAAG;EAC7D,IAAIC,MAAM;EAEV,MAAMC,wBAAwB,GAC7BH,KAAK,CAACI,IAAI,KAAK,oBAAoB,KACjCJ,KAAK,CAACK,UAAU,CAACC,EAAE,IAAIN,KAAK,CAACK,UAAU,CAACE,QAAQ,CAAE;EAErD,IAAKJ,wBAAwB,EAAG;IAC/B,IAAKH,KAAK,CAACK,UAAU,CAACC,EAAE,EAAG;MAC1B;MACAJ,MAAM,GAAG;QACRI,EAAE,EAAEN,KAAK,CAACK,UAAU,CAACC;MACtB,CAAC;IACF,CAAC,MAAM;MACN,MAAM;QAAEE,OAAO;QAAEC,IAAI;QAAEC,GAAG;QAAE,GAAGC;MAAK,CAAC,GAAGX,KAAK,CAACK,UAAU,CAACE,QAAQ;;MAEjE;MACAL,MAAM,GAAG;QACRN,MAAM,EAAEI,KAAK,CAACK,UAAU,CAACT,MAAM;QAC/BW,QAAQ,EAAE;UACT,GAAGN,cAAc,EAAEM,QAAQ;UAC3B;UACAK,6BAA6B,EAAE,IAAI;UACnCC,2BAA2B,EAAEL,OAAO;UACpCM,iBAAiB,EAAEL,IAAI;UACvBM,YAAY,EAAEL,GAAG;UACjB,GAAGC;QACJ;MACD,CAAC;IACF;EACD,CAAC,MAAM;IACN,MAAMJ,QAAQ,GAAG;MAChBS,OAAO,EAAE5B,SAAS,CAAEY,KAAM;IAC3B,CAAC;IACDE,MAAM,GAAG;MACRN,MAAM,EAAE,OAAO;MACfqB,WAAW,EAAE,iBAAiB;MAC9BV,QAAQ,EAAE;QACTQ,YAAY,EAAER;MACf;IACD,CAAC;EACF;EAEA,MAAM;IAAEW,IAAI;IAAEC,QAAQ;IAAE,GAAGC;EAAmB,CAAC,GAAGnB,cAAc,IAAI,CAAC,CAAC;EAEtE,OAAO;IACN,GAAGmB,kBAAkB;IACrB,GAAGlB;EACJ,CAAC;AACF;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASmB,aAAaA,CAAE;EAAEf,EAAE;EAAEV,MAAM;EAAEC,MAAM;EAAEU;AAAS,CAAC,EAAG;EACjE,IAAIP,KAAK;EAET,MAAM;IACLa,2BAA2B,EAAEL,OAAO;IACpCM,iBAAiB,EAAEL,IAAI;IACvBM,YAAY,EAAEL,GAAG;IACjB,GAAGC;EACJ,CAAC,GAAGJ,QAAQ;EAEZ,IAAKX,MAAM,KAAK,OAAO,EAAG;IAAA,IAAA0B,YAAA;IACzB,MAAMC,YAAY,GAAGlC,KAAK,EAAAiC,YAAA,GAAEZ,GAAG,CAACM,OAAO,cAAAM,YAAA,cAAAA,YAAA,GAAI,EAAE,EAAE;MAC9CE,mBAAmB,EAAE;IACtB,CAAE,CAAC;IACHxB,KAAK,GAAGuB,YAAY,CAACE,MAAM,GACxBF,YAAY,CAAE,CAAC,CAAE,GACjBjC,WAAW,CAAE,gBAAgB,EAAE,CAAC,CAAE,CAAC;EACvC,CAAC,MAAM,IAAKO,MAAM,EAAG;IACpB;IACAG,KAAK,GAAGV,WAAW,CAAE,oBAAoB,EAAE;MAC1CM,MAAM;MACNW,QAAQ,EAAE;QACTC,OAAO;QACPC,IAAI;QACJC,GAAG;QACH,GAAGC;MACJ;IACD,CAAE,CAAC;EACJ,CAAC,MAAM;IACN;IACAX,KAAK,GAAGV,WAAW,CAAE,oBAAoB,EAAE;MAC1CgB;IACD,CAAE,CAAC;EACJ;EAEA,OAAOf,kBAAkB,CAAES,KAAK,EAAEM,EAAG,CAAC;AACvC","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../src/utils.js"],
+  "sourcesContent": ["// @ts-check\n/**\n * WordPress dependencies\n */\nimport { serialize, parse, createBlock } from '@wordpress/blocks';\nimport { addWidgetIdToBlock } from '@wordpress/widgets';\n\n/**\n * Convert settingId to widgetId.\n *\n * @param {string} settingId The setting id.\n * @return {string} The widget id.\n */\nexport function settingIdToWidgetId( settingId ) {\n\tconst matches = settingId.match( /^widget_(.+)(?:\\[(\\d+)\\])$/ );\n\n\tif ( matches ) {\n\t\tconst idBase = matches[ 1 ];\n\t\tconst number = parseInt( matches[ 2 ], 10 );\n\n\t\treturn `${ idBase }-${ number }`;\n\t}\n\n\treturn settingId;\n}\n\n/**\n * Transform a block to a customizable widget.\n *\n * @param {WPBlock} block          The block to be transformed from.\n * @param {Object}  existingWidget The widget to be extended from.\n * @return {Object} The transformed widget.\n */\nexport function blockToWidget( block, existingWidget = null ) {\n\tlet widget;\n\n\tconst isValidLegacyWidgetBlock =\n\t\tblock.name === 'core/legacy-widget' &&\n\t\t( block.attributes.id || block.attributes.instance );\n\n\tif ( isValidLegacyWidgetBlock ) {\n\t\tif ( block.attributes.id ) {\n\t\t\t// Widget that does not extend WP_Widget.\n\t\t\twidget = {\n\t\t\t\tid: block.attributes.id,\n\t\t\t};\n\t\t} else {\n\t\t\tconst { encoded, hash, raw, ...rest } = block.attributes.instance;\n\n\t\t\t// Widget that extends WP_Widget.\n\t\t\twidget = {\n\t\t\t\tidBase: block.attributes.idBase,\n\t\t\t\tinstance: {\n\t\t\t\t\t...existingWidget?.instance,\n\t\t\t\t\t// Required only for the customizer.\n\t\t\t\t\tis_widget_customizer_js_value: true,\n\t\t\t\t\tencoded_serialized_instance: encoded,\n\t\t\t\t\tinstance_hash_key: hash,\n\t\t\t\t\traw_instance: raw,\n\t\t\t\t\t...rest,\n\t\t\t\t},\n\t\t\t};\n\t\t}\n\t} else {\n\t\tconst instance = {\n\t\t\tcontent: serialize( block ),\n\t\t};\n\t\twidget = {\n\t\t\tidBase: 'block',\n\t\t\twidgetClass: 'WP_Widget_Block',\n\t\t\tinstance: {\n\t\t\t\traw_instance: instance,\n\t\t\t},\n\t\t};\n\t}\n\n\tconst { form, rendered, ...restExistingWidget } = existingWidget || {};\n\n\treturn {\n\t\t...restExistingWidget,\n\t\t...widget,\n\t};\n}\n\n/**\n * Transform a widget to a block.\n *\n * @param {Object} widget          The widget to be transformed from.\n * @param {string} widget.id       The widget id.\n * @param {string} widget.idBase   The id base of the widget.\n * @param {number} widget.number   The number/index of the widget.\n * @param {Object} widget.instance The instance of the widget.\n * @return {WPBlock} The transformed block.\n */\nexport function widgetToBlock( { id, idBase, number, instance } ) {\n\tlet block;\n\n\tconst {\n\t\tencoded_serialized_instance: encoded,\n\t\tinstance_hash_key: hash,\n\t\traw_instance: raw,\n\t\t...rest\n\t} = instance;\n\n\tif ( idBase === 'block' ) {\n\t\tconst parsedBlocks = parse( raw.content ?? '', {\n\t\t\t__unstableSkipAutop: true,\n\t\t} );\n\t\tblock = parsedBlocks.length\n\t\t\t? parsedBlocks[ 0 ]\n\t\t\t: createBlock( 'core/paragraph', {} );\n\t} else if ( number ) {\n\t\t// Widget that extends WP_Widget.\n\t\tblock = createBlock( 'core/legacy-widget', {\n\t\t\tidBase,\n\t\t\tinstance: {\n\t\t\t\tencoded,\n\t\t\t\thash,\n\t\t\t\traw,\n\t\t\t\t...rest,\n\t\t\t},\n\t\t} );\n\t} else {\n\t\t// Widget that does not extend WP_Widget.\n\t\tblock = createBlock( 'core/legacy-widget', {\n\t\t\tid,\n\t\t} );\n\t}\n\n\treturn addWidgetIdToBlock( block, id );\n}\n"],
+  "mappings": "AAIA,SAAS,WAAW,OAAO,mBAAmB;AAC9C,SAAS,0BAA0B;AAQ5B,SAAS,oBAAqB,WAAY;AAChD,QAAM,UAAU,UAAU,MAAO,4BAA6B;AAE9D,MAAK,SAAU;AACd,UAAM,SAAS,QAAS,CAAE;AAC1B,UAAM,SAAS,SAAU,QAAS,CAAE,GAAG,EAAG;AAE1C,WAAO,GAAI,MAAO,IAAK,MAAO;AAAA,EAC/B;AAEA,SAAO;AACR;AASO,SAAS,cAAe,OAAO,iBAAiB,MAAO;AAC7D,MAAI;AAEJ,QAAM,2BACL,MAAM,SAAS,yBACb,MAAM,WAAW,MAAM,MAAM,WAAW;AAE3C,MAAK,0BAA2B;AAC/B,QAAK,MAAM,WAAW,IAAK;AAE1B,eAAS;AAAA,QACR,IAAI,MAAM,WAAW;AAAA,MACtB;AAAA,IACD,OAAO;AACN,YAAM,EAAE,SAAS,MAAM,KAAK,GAAG,KAAK,IAAI,MAAM,WAAW;AAGzD,eAAS;AAAA,QACR,QAAQ,MAAM,WAAW;AAAA,QACzB,UAAU;AAAA,UACT,GAAG,gBAAgB;AAAA;AAAA,UAEnB,+BAA+B;AAAA,UAC/B,6BAA6B;AAAA,UAC7B,mBAAmB;AAAA,UACnB,cAAc;AAAA,UACd,GAAG;AAAA,QACJ;AAAA,MACD;AAAA,IACD;AAAA,EACD,OAAO;AACN,UAAM,WAAW;AAAA,MAChB,SAAS,UAAW,KAAM;AAAA,IAC3B;AACA,aAAS;AAAA,MACR,QAAQ;AAAA,MACR,aAAa;AAAA,MACb,UAAU;AAAA,QACT,cAAc;AAAA,MACf;AAAA,IACD;AAAA,EACD;AAEA,QAAM,EAAE,MAAM,UAAU,GAAG,mBAAmB,IAAI,kBAAkB,CAAC;AAErE,SAAO;AAAA,IACN,GAAG;AAAA,IACH,GAAG;AAAA,EACJ;AACD;AAYO,SAAS,cAAe,EAAE,IAAI,QAAQ,QAAQ,SAAS,GAAI;AACjE,MAAI;AAEJ,QAAM;AAAA,IACL,6BAA6B;AAAA,IAC7B,mBAAmB;AAAA,IACnB,cAAc;AAAA,IACd,GAAG;AAAA,EACJ,IAAI;AAEJ,MAAK,WAAW,SAAU;AACzB,UAAM,eAAe,MAAO,IAAI,WAAW,IAAI;AAAA,MAC9C,qBAAqB;AAAA,IACtB,CAAE;AACF,YAAQ,aAAa,SAClB,aAAc,CAAE,IAChB,YAAa,kBAAkB,CAAC,CAAE;AAAA,EACtC,WAAY,QAAS;AAEpB,YAAQ,YAAa,sBAAsB;AAAA,MAC1C;AAAA,MACA,UAAU;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACJ;AAAA,IACD,CAAE;AAAA,EACH,OAAO;AAEN,YAAQ,YAAa,sBAAsB;AAAA,MAC1C;AAAA,IACD,CAAE;AAAA,EACH;AAEA,SAAO,mBAAoB,OAAO,EAAG;AACtC;",
+  "names": []
+}

package/build-style/style-rtl.css

@@ -1,57 +1,6 @@
-/**
- * Colors
- */
-/**
- * Breakpoints & Media Queries
- */
-/**
- * Colors
- */
-/**
- * SCSS Variables.
- *
- * Please use variables from this sheet to ensure consistency across the UI.
- * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
- * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
- */
-/**
- * Fonts & basic variables.
- */
 /**
  * Typography
  */
-/**
- * Grid System.
- * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
- */
-/**
- * Radius scale.
- */
-/**
- * Elevation scale.
- */
-/**
- * Dimensions.
- */
-/**
- * Mobile specific styles
- */
-/**
- * Editor styles.
- */
-/**
- * Block & Editor UI.
- */
-/**
- * Block paddings.
- */
-/**
- * React Native specific.
- * These variables do not appear to be used anywhere else.
- */
-/**
- * Colors
- */
 /**
  * SCSS Variables.
  *
@@ -59,91 +8,9 @@
  * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
  * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
  */
-/**
- * Fonts & basic variables.
- */
-/**
- * Typography
- */
-/**
- * Grid System.
- * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
- */
-/**
- * Radius scale.
- */
-/**
- * Elevation scale.
- */
-/**
- * Dimensions.
- */
-/**
- * Mobile specific styles
- */
-/**
- * Editor styles.
- */
-/**
- * Block & Editor UI.
- */
-/**
- * Block paddings.
- */
-/**
- * React Native specific.
- * These variables do not appear to be used anywhere else.
- */
-/**
- * Breakpoints & Media Queries
- */
-/**
-*  Converts a hex value into the rgb equivalent.
-*
-* @param {string} hex - the hexadecimal value to convert
-* @return {string} comma separated rgb values
-*/
-/**
- * Long content fade mixin
- *
- * Creates a fading overlay to signify that the content is longer
- * than the space allows.
- */
-/**
- * Typography
- */
-/**
- * Breakpoint mixins
- */
-/**
- * Focus styles.
- */
-/**
- * Applies editor left position to the selector passed as argument
- */
-/**
- * Styles that are reused verbatim in a few places
- */
-/**
- * Allows users to opt-out of animations via OS-level preferences.
- */
-/**
- * Reset default styles for JavaScript UI based pages.
- * This is a WP-admin agnostic reset
- */
-/**
- * Reset the WP Admin page styles for Gutenberg-like pages.
- */
 /**
  * Colors
  */
-/**
- * SCSS Variables.
- *
- * Please use variables from this sheet to ensure consistency across the UI.
- * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
- * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
- */
 /**
  * Fonts & basic variables.
  */
@@ -194,9 +61,6 @@
  * Creates a fading overlay to signify that the content is longer
  * than the space allows.
  */
-/**
- * Typography
- */
 /**
  * Breakpoint mixins
  */
@@ -223,10 +87,11 @@
   --wp-block-synced-color: #7a00df;
   --wp-block-synced-color--rgb: 122, 0, 223;
   --wp-bound-block-color: var(--wp-block-synced-color);
+  --wp-editor-canvas-background: #ddd;
   --wp-admin-theme-color: #007cba;
   --wp-admin-theme-color--rgb: 0, 124, 186;
-  --wp-admin-theme-color-darker-10: #006ba1;
-  --wp-admin-theme-color-darker-10--rgb: 0, 107, 161;
+  --wp-admin-theme-color-darker-10: rgb(0, 107, 160.5);
+  --wp-admin-theme-color-darker-10--rgb: 0, 107, 160.5;
   --wp-admin-theme-color-darker-20: #005a87;
   --wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
   --wp-admin-border-width-focus: 2px;
@@ -255,14 +120,6 @@
   transform: translateX(100%);
 }
 
-.customize-widgets-header {
-  display: flex;
-  justify-content: flex-end;
-  margin: -15px -12px 0 -12px;
-  background: #f0f0f1;
-  border-bottom: 1px solid #e0e0e0;
-  z-index: 8;
-}
 @media (min-width: 600px) {
   .customize-widgets-header {
     margin-bottom: 44px;
@@ -271,6 +128,14 @@
 .customize-widgets-header.is-fixed-toolbar-active {
   margin-bottom: 0;
 }
+.customize-widgets-header {
+  display: flex;
+  justify-content: flex-end;
+  margin: -15px -12px 0 -12px;
+  background: #f0f0f1;
+  border-bottom: 1px solid #e0e0e0;
+  z-index: 8;
+}
 
 .customize-widgets-header-toolbar {
   display: flex;
@@ -425,14 +290,14 @@
   line-height: 1.4;
 }
 
+#customize-theme-controls .customize-pane-child.customize-widgets__sidebar-section.open {
+  overflow: unset;
+}
 #customize-theme-controls .customize-pane-child.customize-widgets__sidebar-section {
   min-height: 100%;
   background-color: #fff;
   padding-top: 12px !important;
 }
-#customize-theme-controls .customize-pane-child.customize-widgets__sidebar-section.open {
-  overflow: unset;
-}
 #customize-theme-controls .customize-pane-child.customize-widgets__sidebar-section .customize-section-title {
   position: static !important;
   margin-top: -12px !important;

package/build-style/style.css

@@ -1,57 +1,6 @@
-/**
- * Colors
- */
-/**
- * Breakpoints & Media Queries
- */
-/**
- * Colors
- */
-/**
- * SCSS Variables.
- *
- * Please use variables from this sheet to ensure consistency across the UI.
- * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
- * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
- */
-/**
- * Fonts & basic variables.
- */
 /**
  * Typography
  */
-/**
- * Grid System.
- * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
- */
-/**
- * Radius scale.
- */
-/**
- * Elevation scale.
- */
-/**
- * Dimensions.
- */
-/**
- * Mobile specific styles
- */
-/**
- * Editor styles.
- */
-/**
- * Block & Editor UI.
- */
-/**
- * Block paddings.
- */
-/**
- * React Native specific.
- * These variables do not appear to be used anywhere else.
- */
-/**
- * Colors
- */
 /**
  * SCSS Variables.
  *
@@ -59,91 +8,9 @@
  * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
  * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
  */
-/**
- * Fonts & basic variables.
- */
-/**
- * Typography
- */
-/**
- * Grid System.
- * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
- */
-/**
- * Radius scale.
- */
-/**
- * Elevation scale.
- */
-/**
- * Dimensions.
- */
-/**
- * Mobile specific styles
- */
-/**
- * Editor styles.
- */
-/**
- * Block & Editor UI.
- */
-/**
- * Block paddings.
- */
-/**
- * React Native specific.
- * These variables do not appear to be used anywhere else.
- */
-/**
- * Breakpoints & Media Queries
- */
-/**
-*  Converts a hex value into the rgb equivalent.
-*
-* @param {string} hex - the hexadecimal value to convert
-* @return {string} comma separated rgb values
-*/
-/**
- * Long content fade mixin
- *
- * Creates a fading overlay to signify that the content is longer
- * than the space allows.
- */
-/**
- * Typography
- */
-/**
- * Breakpoint mixins
- */
-/**
- * Focus styles.
- */
-/**
- * Applies editor left position to the selector passed as argument
- */
-/**
- * Styles that are reused verbatim in a few places
- */
-/**
- * Allows users to opt-out of animations via OS-level preferences.
- */
-/**
- * Reset default styles for JavaScript UI based pages.
- * This is a WP-admin agnostic reset
- */
-/**
- * Reset the WP Admin page styles for Gutenberg-like pages.
- */
 /**
  * Colors
  */
-/**
- * SCSS Variables.
- *
- * Please use variables from this sheet to ensure consistency across the UI.
- * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
- * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
- */
 /**
  * Fonts & basic variables.
  */
@@ -194,9 +61,6 @@
  * Creates a fading overlay to signify that the content is longer
  * than the space allows.
  */
-/**
- * Typography
- */
 /**
  * Breakpoint mixins
  */
@@ -223,10 +87,11 @@
   --wp-block-synced-color: #7a00df;
   --wp-block-synced-color--rgb: 122, 0, 223;
   --wp-bound-block-color: var(--wp-block-synced-color);
+  --wp-editor-canvas-background: #ddd;
   --wp-admin-theme-color: #007cba;
   --wp-admin-theme-color--rgb: 0, 124, 186;
-  --wp-admin-theme-color-darker-10: #006ba1;
-  --wp-admin-theme-color-darker-10--rgb: 0, 107, 161;
+  --wp-admin-theme-color-darker-10: rgb(0, 107, 160.5);
+  --wp-admin-theme-color-darker-10--rgb: 0, 107, 160.5;
   --wp-admin-theme-color-darker-20: #005a87;
   --wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
   --wp-admin-border-width-focus: 2px;
@@ -255,14 +120,6 @@
   transform: translateX(-100%);
 }
 
-.customize-widgets-header {
-  display: flex;
-  justify-content: flex-end;
-  margin: -15px -12px 0 -12px;
-  background: #f0f0f1;
-  border-bottom: 1px solid #e0e0e0;
-  z-index: 8;
-}
 @media (min-width: 600px) {
   .customize-widgets-header {
     margin-bottom: 44px;
@@ -271,6 +128,14 @@
 .customize-widgets-header.is-fixed-toolbar-active {
   margin-bottom: 0;
 }
+.customize-widgets-header {
+  display: flex;
+  justify-content: flex-end;
+  margin: -15px -12px 0 -12px;
+  background: #f0f0f1;
+  border-bottom: 1px solid #e0e0e0;
+  z-index: 8;
+}
 
 .customize-widgets-header-toolbar {
   display: flex;
@@ -425,14 +290,14 @@
   line-height: 1.4;
 }
 
+#customize-theme-controls .customize-pane-child.customize-widgets__sidebar-section.open {
+  overflow: unset;
+}
 #customize-theme-controls .customize-pane-child.customize-widgets__sidebar-section {
   min-height: 100%;
   background-color: #fff;
   padding-top: 12px !important;
 }
-#customize-theme-controls .customize-pane-child.customize-widgets__sidebar-section.open {
-  overflow: unset;
-}
 #customize-theme-controls .customize-pane-child.customize-widgets__sidebar-section .customize-section-title {
   position: static !important;
   margin-top: -12px !important;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/customize-widgets",
-	"version": "5.32.0",
+	"version": "5.32.1-next.ff1cebbba.0",
 	"description": "Widgets blocks in Customizer Module for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -22,30 +22,37 @@
 	},
 	"main": "build/index.js",
 	"module": "build-module/index.js",
+	"exports": {
+		".": {
+			"import": "./build-module/index.js",
+			"default": "./build/index.js"
+		},
+		"./package.json": "./package.json"
+	},
 	"react-native": "src/index",
 	"wpScript": true,
 	"dependencies": {
-		"@babel/runtime": "7.25.7",
-		"@wordpress/block-editor": "^15.5.0",
-		"@wordpress/block-library": "^9.32.0",
-		"@wordpress/blocks": "^15.5.0",
-		"@wordpress/components": "^30.5.0",
-		"@wordpress/compose": "^7.32.0",
-		"@wordpress/core-data": "^7.32.0",
-		"@wordpress/data": "^10.32.0",
-		"@wordpress/dom": "^4.32.0",
-		"@wordpress/element": "^6.32.0",
-		"@wordpress/hooks": "^4.32.0",
-		"@wordpress/i18n": "^6.5.0",
-		"@wordpress/icons": "^10.32.0",
-		"@wordpress/interface": "^9.17.0",
-		"@wordpress/is-shallow-equal": "^5.32.0",
-		"@wordpress/keyboard-shortcuts": "^5.32.0",
-		"@wordpress/keycodes": "^4.32.0",
-		"@wordpress/media-utils": "^5.32.0",
-		"@wordpress/preferences": "^4.32.0",
-		"@wordpress/private-apis": "^1.32.0",
-		"@wordpress/widgets": "^4.32.0",
+		"@wordpress/base-styles": "^6.8.1-next.ff1cebbba.0",
+		"@wordpress/block-editor": "^15.5.1-next.ff1cebbba.0",
+		"@wordpress/block-library": "^9.33.1-next.ff1cebbba.0",
+		"@wordpress/blocks": "^15.5.1-next.ff1cebbba.0",
+		"@wordpress/components": "^30.6.1-next.ff1cebbba.0",
+		"@wordpress/compose": "^7.32.1-next.ff1cebbba.0",
+		"@wordpress/core-data": "^7.32.1-next.ff1cebbba.0",
+		"@wordpress/data": "^10.32.1-next.ff1cebbba.0",
+		"@wordpress/dom": "^4.32.1-next.ff1cebbba.0",
+		"@wordpress/element": "^6.32.1-next.ff1cebbba.0",
+		"@wordpress/hooks": "^4.32.1-next.ff1cebbba.0",
+		"@wordpress/i18n": "^6.5.1-next.ff1cebbba.0",
+		"@wordpress/icons": "^11.0.1-next.ff1cebbba.0",
+		"@wordpress/interface": "^9.17.1-next.ff1cebbba.0",
+		"@wordpress/is-shallow-equal": "^5.32.1-next.ff1cebbba.0",
+		"@wordpress/keyboard-shortcuts": "^5.32.1-next.ff1cebbba.0",
+		"@wordpress/keycodes": "^4.32.1-next.ff1cebbba.0",
+		"@wordpress/media-utils": "^5.32.1-next.ff1cebbba.0",
+		"@wordpress/preferences": "^4.32.1-next.ff1cebbba.0",
+		"@wordpress/private-apis": "^1.32.1-next.ff1cebbba.0",
+		"@wordpress/widgets": "^4.32.1-next.ff1cebbba.0",
 		"clsx": "^2.1.1",
 		"fast-deep-equal": "^3.1.3"
 	},
@@ -56,5 +63,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "a030b4c0e0695239b942c7dc18511782b64f10ed"
+	"gitHead": "c5b659710aff01d40d2eb97b211eb2cec9c07d3b"
 }

package/src/components/block-inspector-button/style.scss

@@ -1,3 +1,6 @@
+@use "@wordpress/base-styles/colors" as *;
+@use "@wordpress/base-styles/variables" as *;
+
 #customize-theme-controls .customize-pane-child.accordion-section-content.customize-widgets-layout__inspector {
 	background: $white;
 	box-sizing: border-box;