@wordpress/block-editor 12.25.0 → 13.0.0

package/build/components/default-block-appender/index.native.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.DefaultBlockAppender = DefaultBlockAppender;
 exports.default = void 0;
-var _react = require("react");
 var _reactNative = require("react-native");
 var _i18n = require("@wordpress/i18n");
 var _blockEditor = require("@wordpress/block-editor");
@@ -17,6 +16,7 @@ var _blocks = require("@wordpress/blocks");
 var _insertionPoint = _interopRequireDefault(require("../block-list/insertion-point"));
 var _style = _interopRequireDefault(require("./style.scss"));
 var _store = require("../../store");
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * External dependencies
  */
@@ -63,18 +63,20 @@ function DefaultBlockAppender({
   } : undefined;
   const value = typeof placeholder === 'string' ? (0, _htmlEntities.decodeEntities)(placeholder) : (0, _i18n.__)('Start writing…');
   const appenderStyles = [_style.default.blockHolder, showSeparator && containerStyle];
-  return (0, _react.createElement)(_reactNative.Pressable, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
     onPress: onAppend,
-    hitSlop: hitSlop
-  }, (0, _react.createElement)(_reactNative.View, {
-    style: appenderStyles,
-    pointerEvents: "box-only"
-  }, showSeparator ? (0, _react.createElement)(_insertionPoint.default, null) : (0, _react.createElement)(_blockEditor.RichText, {
-    placeholder: value,
-    onChange: noop,
-    tagName: "p",
-    style: textStyles
-  })));
+    hitSlop: hitSlop,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: appenderStyles,
+      pointerEvents: "box-only",
+      children: showSeparator ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_insertionPoint.default, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText, {
+        placeholder: value,
+        onChange: noop,
+        tagName: "p",
+        style: textStyles
+      })
+    })
+  });
 }
 var _default = exports.default = (0, _compose.compose)((0, _data.withSelect)((select, ownProps) => {
   const {

package/build/components/default-block-appender/index.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["_reactNative","require","_i18n","_blockEditor","_compose","_htmlEntities","_data","_blocks","_insertionPoint","_interopRequireDefault","_style","_store","hitSlop","top","bottom","left","right","noop","DefaultBlockAppender","baseGlobalStyles","isLocked","isVisible","onAppend","placeholder","containerStyle","showSeparator","blockGlobalStyles","blocks","fontSize","lineHeight","typography","textStyles","undefined","value","decodeEntities","__","appenderStyles","styles","blockHolder","_react","createElement","Pressable","onPress","View","style","pointerEvents","default","RichText","onChange","tagName","_default","exports","compose","withSelect","select","ownProps","getBlockCount","getBlockName","getSettings","isBlockValid","getTemplateLock","blockEditorStore","isEmpty","rootClientId","isLastBlockDefault","lastBlockClientId","getDefaultBlockName","isLastBlockValid","globalStylesBaseStyles","__experimentalGlobalStylesBaseStyles","withDispatch","dispatch","insertDefaultBlock","startTyping"],"sources":["@wordpress/block-editor/src/components/default-block-appender/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { Pressable, View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { RichText } from '@wordpress/block-editor';\nimport { compose } from '@wordpress/compose';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { withSelect, withDispatch } from '@wordpress/data';\nimport { getDefaultBlockName } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport BlockInsertionPoint from '../block-list/insertion-point';\nimport styles from './style.scss';\nimport { store as blockEditorStore } from '../../store';\n\nconst hitSlop = { top: 22, bottom: 22, left: 22, right: 22 };\nconst noop = () => {};\n\nexport function DefaultBlockAppender( {\n\tbaseGlobalStyles,\n\tisLocked,\n\tisVisible,\n\tonAppend,\n\tplaceholder,\n\tcontainerStyle,\n\tshowSeparator,\n} ) {\n\tif ( isLocked || ! isVisible ) {\n\t\treturn null;\n\t}\n\tconst blockGlobalStyles = baseGlobalStyles?.blocks?.[ 'core/paragraph' ];\n\tconst { fontSize, lineHeight } = blockGlobalStyles?.typography || {};\n\n\tconst textStyles = blockGlobalStyles?.typography\n\t\t? {\n\t\t\t\t...( fontSize && { fontSize } ),\n\t\t\t\t...( lineHeight && { lineHeight } ),\n\t\t  }\n\t\t: undefined;\n\n\tconst value =\n\t\ttypeof placeholder === 'string'\n\t\t\t? decodeEntities( placeholder )\n\t\t\t: __( 'Start writing…' );\n\n\tconst appenderStyles = [\n\t\tstyles.blockHolder,\n\t\tshowSeparator && containerStyle,\n\t];\n\n\treturn (\n\t\t<Pressable onPress={ onAppend } hitSlop={ hitSlop }>\n\t\t\t<View style={ appenderStyles } pointerEvents=\"box-only\">\n\t\t\t\t{ showSeparator ? (\n\t\t\t\t\t<BlockInsertionPoint />\n\t\t\t\t) : (\n\t\t\t\t\t<RichText\n\t\t\t\t\t\tplaceholder={ value }\n\t\t\t\t\t\tonChange={ noop }\n\t\t\t\t\t\ttagName=\"p\"\n\t\t\t\t\t\tstyle={ textStyles }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</View>\n\t\t</Pressable>\n\t);\n}\n\nexport default compose(\n\twithSelect( ( select, ownProps ) => {\n\t\tconst {\n\t\t\tgetBlockCount,\n\t\t\tgetBlockName,\n\t\t\tgetSettings,\n\t\t\tisBlockValid,\n\t\t\tgetTemplateLock,\n\t\t} = select( blockEditorStore );\n\n\t\tconst isEmpty = ! getBlockCount( ownProps.rootClientId );\n\t\tconst isLastBlockDefault =\n\t\t\tgetBlockName( ownProps.lastBlockClientId ) ===\n\t\t\tgetDefaultBlockName();\n\t\tconst isLastBlockValid = isBlockValid( ownProps.lastBlockClientId );\n\t\tconst globalStylesBaseStyles =\n\t\t\tgetSettings()?.__experimentalGlobalStylesBaseStyles;\n\n\t\treturn {\n\t\t\tbaseGlobalStyles: globalStylesBaseStyles,\n\t\t\tisVisible: isEmpty || ! isLastBlockDefault || ! isLastBlockValid,\n\t\t\tisLocked: !! getTemplateLock( ownProps.rootClientId ),\n\t\t};\n\t} ),\n\twithDispatch( ( dispatch, ownProps ) => {\n\t\tconst { insertDefaultBlock, startTyping } =\n\t\t\tdispatch( blockEditorStore );\n\n\t\treturn {\n\t\t\tonAppend() {\n\t\t\t\tconst { rootClientId } = ownProps;\n\n\t\t\t\tinsertDefaultBlock( undefined, rootClientId );\n\t\t\t\tstartTyping();\n\t\t\t},\n\t\t};\n\t} )\n)( DefaultBlockAppender );\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_reactNative","require","_i18n","_blockEditor","_compose","_htmlEntities","_data","_blocks","_insertionPoint","_interopRequireDefault","_style","_store","_jsxRuntime","hitSlop","top","bottom","left","right","noop","DefaultBlockAppender","baseGlobalStyles","isLocked","isVisible","onAppend","placeholder","containerStyle","showSeparator","blockGlobalStyles","blocks","fontSize","lineHeight","typography","textStyles","undefined","value","decodeEntities","__","appenderStyles","styles","blockHolder","jsx","Pressable","onPress","children","View","style","pointerEvents","default","RichText","onChange","tagName","_default","exports","compose","withSelect","select","ownProps","getBlockCount","getBlockName","getSettings","isBlockValid","getTemplateLock","blockEditorStore","isEmpty","rootClientId","isLastBlockDefault","lastBlockClientId","getDefaultBlockName","isLastBlockValid","globalStylesBaseStyles","__experimentalGlobalStylesBaseStyles","withDispatch","dispatch","insertDefaultBlock","startTyping"],"sources":["@wordpress/block-editor/src/components/default-block-appender/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { Pressable, View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { RichText } from '@wordpress/block-editor';\nimport { compose } from '@wordpress/compose';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { withSelect, withDispatch } from '@wordpress/data';\nimport { getDefaultBlockName } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport BlockInsertionPoint from '../block-list/insertion-point';\nimport styles from './style.scss';\nimport { store as blockEditorStore } from '../../store';\n\nconst hitSlop = { top: 22, bottom: 22, left: 22, right: 22 };\nconst noop = () => {};\n\nexport function DefaultBlockAppender( {\n\tbaseGlobalStyles,\n\tisLocked,\n\tisVisible,\n\tonAppend,\n\tplaceholder,\n\tcontainerStyle,\n\tshowSeparator,\n} ) {\n\tif ( isLocked || ! isVisible ) {\n\t\treturn null;\n\t}\n\tconst blockGlobalStyles = baseGlobalStyles?.blocks?.[ 'core/paragraph' ];\n\tconst { fontSize, lineHeight } = blockGlobalStyles?.typography || {};\n\n\tconst textStyles = blockGlobalStyles?.typography\n\t\t? {\n\t\t\t\t...( fontSize && { fontSize } ),\n\t\t\t\t...( lineHeight && { lineHeight } ),\n\t\t  }\n\t\t: undefined;\n\n\tconst value =\n\t\ttypeof placeholder === 'string'\n\t\t\t? decodeEntities( placeholder )\n\t\t\t: __( 'Start writing…' );\n\n\tconst appenderStyles = [\n\t\tstyles.blockHolder,\n\t\tshowSeparator && containerStyle,\n\t];\n\n\treturn (\n\t\t<Pressable onPress={ onAppend } hitSlop={ hitSlop }>\n\t\t\t<View style={ appenderStyles } pointerEvents=\"box-only\">\n\t\t\t\t{ showSeparator ? (\n\t\t\t\t\t<BlockInsertionPoint />\n\t\t\t\t) : (\n\t\t\t\t\t<RichText\n\t\t\t\t\t\tplaceholder={ value }\n\t\t\t\t\t\tonChange={ noop }\n\t\t\t\t\t\ttagName=\"p\"\n\t\t\t\t\t\tstyle={ textStyles }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</View>\n\t\t</Pressable>\n\t);\n}\n\nexport default compose(\n\twithSelect( ( select, ownProps ) => {\n\t\tconst {\n\t\t\tgetBlockCount,\n\t\t\tgetBlockName,\n\t\t\tgetSettings,\n\t\t\tisBlockValid,\n\t\t\tgetTemplateLock,\n\t\t} = select( blockEditorStore );\n\n\t\tconst isEmpty = ! getBlockCount( ownProps.rootClientId );\n\t\tconst isLastBlockDefault =\n\t\t\tgetBlockName( ownProps.lastBlockClientId ) ===\n\t\t\tgetDefaultBlockName();\n\t\tconst isLastBlockValid = isBlockValid( ownProps.lastBlockClientId );\n\t\tconst globalStylesBaseStyles =\n\t\t\tgetSettings()?.__experimentalGlobalStylesBaseStyles;\n\n\t\treturn {\n\t\t\tbaseGlobalStyles: globalStylesBaseStyles,\n\t\t\tisVisible: isEmpty || ! isLastBlockDefault || ! isLastBlockValid,\n\t\t\tisLocked: !! getTemplateLock( ownProps.rootClientId ),\n\t\t};\n\t} ),\n\twithDispatch( ( dispatch, ownProps ) => {\n\t\tconst { insertDefaultBlock, startTyping } =\n\t\t\tdispatch( blockEditorStore );\n\n\t\treturn {\n\t\t\tonAppend() {\n\t\t\t\tconst { rootClientId } = ownProps;\n\n\t\t\t\tinsertDefaultBlock( undefined, rootClientId );\n\t\t\t\tstartTyping();\n\t\t\t},\n\t\t};\n\t} )\n)( DefaultBlockAppender );\n"],"mappings":"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","ignoreList":[]}

package/build/components/dimensions-tool/aspect-ratio-tool.js

@@ -3,52 +3,22 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.DEFAULT_ASPECT_RATIO_OPTIONS = void 0;
 exports.default = AspectRatioTool;
-var _react = require("react");
 var _components = require("@wordpress/components");
 var _i18n = require("@wordpress/i18n");
+var _useSettings = require("../use-settings");
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * WordPress dependencies
  */
 
 /**
- * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps
+ * Internal dependencies
  */
 
 /**
- * @type {SelectControlProps[]}
+ * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps
  */
-const DEFAULT_ASPECT_RATIO_OPTIONS = exports.DEFAULT_ASPECT_RATIO_OPTIONS = [{
-  label: (0, _i18n._x)('Original', 'Aspect ratio option for dimensions control'),
-  value: 'auto'
-}, {
-  label: (0, _i18n._x)('Square - 1:1', 'Aspect ratio option for dimensions control'),
-  value: '1'
-}, {
-  label: (0, _i18n._x)('Standard - 4:3', 'Aspect ratio option for dimensions control'),
-  value: '4/3'
-}, {
-  label: (0, _i18n._x)('Portrait - 3:4', 'Aspect ratio option for dimensions control'),
-  value: '3/4'
-}, {
-  label: (0, _i18n._x)('Classic - 3:2', 'Aspect ratio option for dimensions control'),
-  value: '3/2'
-}, {
-  label: (0, _i18n._x)('Classic Portrait - 2:3', 'Aspect ratio option for dimensions control'),
-  value: '2/3'
-}, {
-  label: (0, _i18n._x)('Wide - 16:9', 'Aspect ratio option for dimensions control'),
-  value: '16/9'
-}, {
-  label: (0, _i18n._x)('Tall - 9:16', 'Aspect ratio option for dimensions control'),
-  value: '9/16'
-}, {
-  label: (0, _i18n._x)('Custom', 'Aspect ratio option for dimensions control'),
-  value: 'custom',
-  disabled: true,
-  hidden: true
-}];
 
 /**
  * @callback AspectRatioToolPropsOnChange
@@ -64,32 +34,55 @@ const DEFAULT_ASPECT_RATIO_OPTIONS = exports.DEFAULT_ASPECT_RATIO_OPTIONS = [{
  * @property {SelectControlProps[]}         [options]          Aspect ratio options.
  * @property {string}                       [defaultValue]     Default aspect ratio value.
  * @property {boolean}                      [isShownByDefault] Whether the tool is shown by default.
- */
-
-function AspectRatioTool({
+ */function AspectRatioTool({
   panelId,
   value,
   onChange = () => {},
-  options = DEFAULT_ASPECT_RATIO_OPTIONS,
-  defaultValue = DEFAULT_ASPECT_RATIO_OPTIONS[0].value,
+  options,
+  defaultValue = 'auto',
   hasValue,
   isShownByDefault = true
 }) {
   // Match the CSS default so if the value is used directly in CSS it will look correct in the control.
   const displayValue = value !== null && value !== void 0 ? value : 'auto';
-  return (0, _react.createElement)(_components.__experimentalToolsPanelItem, {
+  const [defaultRatios, themeRatios, showDefaultRatios] = (0, _useSettings.useSettings)('dimensions.aspectRatios.default', 'dimensions.aspectRatios.theme', 'dimensions.defaultAspectRatios');
+  const themeOptions = themeRatios?.map(({
+    name,
+    ratio
+  }) => ({
+    label: name,
+    value: ratio
+  }));
+  const defaultOptions = defaultRatios?.map(({
+    name,
+    ratio
+  }) => ({
+    label: name,
+    value: ratio
+  }));
+  const aspectRatioOptions = [{
+    label: (0, _i18n._x)('Original', 'Aspect ratio option for dimensions control'),
+    value: 'auto'
+  }, ...(showDefaultRatios ? defaultOptions : []), ...(themeOptions ? themeOptions : []), {
+    label: (0, _i18n._x)('Custom', 'Aspect ratio option for dimensions control'),
+    value: 'custom',
+    disabled: true,
+    hidden: true
+  }];
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToolsPanelItem, {
     hasValue: hasValue ? hasValue : () => displayValue !== defaultValue,
     label: (0, _i18n.__)('Aspect ratio'),
     onDeselect: () => onChange(undefined),
     isShownByDefault: isShownByDefault,
-    panelId: panelId
-  }, (0, _react.createElement)(_components.SelectControl, {
-    label: (0, _i18n.__)('Aspect ratio'),
-    value: displayValue,
-    options: options,
-    onChange: onChange,
-    size: '__unstable-large',
-    __nextHasNoMarginBottom: true
-  }));
+    panelId: panelId,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.SelectControl, {
+      label: (0, _i18n.__)('Aspect ratio'),
+      value: displayValue,
+      options: options !== null && options !== void 0 ? options : aspectRatioOptions,
+      onChange: onChange,
+      size: "__unstable-large",
+      __nextHasNoMarginBottom: true
+    })
+  });
 }
 //# sourceMappingURL=aspect-ratio-tool.js.map

package/build/components/dimensions-tool/aspect-ratio-tool.js.map

@@ -1 +1 @@
-{"version":3,"names":["_components","require","_i18n","DEFAULT_ASPECT_RATIO_OPTIONS","exports","label","_x","value","disabled","hidden","AspectRatioTool","panelId","onChange","options","defaultValue","hasValue","isShownByDefault","displayValue","_react","createElement","__experimentalToolsPanelItem","__","onDeselect","undefined","SelectControl","size","__nextHasNoMarginBottom"],"sources":["@wordpress/block-editor/src/components/dimensions-tool/aspect-ratio-tool.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tSelectControl,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\n\n/**\n * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps\n */\n\n/**\n * @type {SelectControlProps[]}\n */\nexport const DEFAULT_ASPECT_RATIO_OPTIONS = [\n\t{\n\t\tlabel: _x( 'Original', 'Aspect ratio option for dimensions control' ),\n\t\tvalue: 'auto',\n\t},\n\t{\n\t\tlabel: _x(\n\t\t\t'Square - 1:1',\n\t\t\t'Aspect ratio option for dimensions control'\n\t\t),\n\t\tvalue: '1',\n\t},\n\t{\n\t\tlabel: _x(\n\t\t\t'Standard - 4:3',\n\t\t\t'Aspect ratio option for dimensions control'\n\t\t),\n\t\tvalue: '4/3',\n\t},\n\t{\n\t\tlabel: _x(\n\t\t\t'Portrait - 3:4',\n\t\t\t'Aspect ratio option for dimensions control'\n\t\t),\n\t\tvalue: '3/4',\n\t},\n\t{\n\t\tlabel: _x(\n\t\t\t'Classic - 3:2',\n\t\t\t'Aspect ratio option for dimensions control'\n\t\t),\n\t\tvalue: '3/2',\n\t},\n\t{\n\t\tlabel: _x(\n\t\t\t'Classic Portrait - 2:3',\n\t\t\t'Aspect ratio option for dimensions control'\n\t\t),\n\t\tvalue: '2/3',\n\t},\n\t{\n\t\tlabel: _x(\n\t\t\t'Wide - 16:9',\n\t\t\t'Aspect ratio option for dimensions control'\n\t\t),\n\t\tvalue: '16/9',\n\t},\n\t{\n\t\tlabel: _x(\n\t\t\t'Tall - 9:16',\n\t\t\t'Aspect ratio option for dimensions control'\n\t\t),\n\t\tvalue: '9/16',\n\t},\n\t{\n\t\tlabel: _x( 'Custom', 'Aspect ratio option for dimensions control' ),\n\t\tvalue: 'custom',\n\t\tdisabled: true,\n\t\thidden: true,\n\t},\n];\n\n/**\n * @callback AspectRatioToolPropsOnChange\n * @param {string} [value] New aspect ratio value.\n * @return {void} No return.\n */\n\n/**\n * @typedef {Object} AspectRatioToolProps\n * @property {string}                       [panelId]          ID of the panel this tool is associated with.\n * @property {string}                       [value]            Current aspect ratio value.\n * @property {AspectRatioToolPropsOnChange} [onChange]         Callback to update the aspect ratio value.\n * @property {SelectControlProps[]}         [options]          Aspect ratio options.\n * @property {string}                       [defaultValue]     Default aspect ratio value.\n * @property {boolean}                      [isShownByDefault] Whether the tool is shown by default.\n */\n\nexport default function AspectRatioTool( {\n\tpanelId,\n\tvalue,\n\tonChange = () => {},\n\toptions = DEFAULT_ASPECT_RATIO_OPTIONS,\n\tdefaultValue = DEFAULT_ASPECT_RATIO_OPTIONS[ 0 ].value,\n\thasValue,\n\tisShownByDefault = true,\n} ) {\n\t// Match the CSS default so if the value is used directly in CSS it will look correct in the control.\n\tconst displayValue = value ?? 'auto';\n\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={\n\t\t\t\thasValue ? hasValue : () => displayValue !== defaultValue\n\t\t\t}\n\t\t\tlabel={ __( 'Aspect ratio' ) }\n\t\t\tonDeselect={ () => onChange( undefined ) }\n\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t<SelectControl\n\t\t\t\tlabel={ __( 'Aspect ratio' ) }\n\t\t\t\tvalue={ displayValue }\n\t\t\t\toptions={ options }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t/>\n\t\t</ToolsPanelItem>\n\t);\n}\n"],"mappings":";;;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAIA,IAAAC,KAAA,GAAAD,OAAA;AAPA;AACA;AACA;;AAOA;AACA;AACA;;AAEA;AACA;AACA;AACO,MAAME,4BAA4B,GAAAC,OAAA,CAAAD,4BAAA,GAAG,CAC3C;EACCE,KAAK,EAAE,IAAAC,QAAE,EAAE,UAAU,EAAE,4CAA6C,CAAC;EACrEC,KAAK,EAAE;AACR,CAAC,EACD;EACCF,KAAK,EAAE,IAAAC,QAAE,EACR,cAAc,EACd,4CACD,CAAC;EACDC,KAAK,EAAE;AACR,CAAC,EACD;EACCF,KAAK,EAAE,IAAAC,QAAE,EACR,gBAAgB,EAChB,4CACD,CAAC;EACDC,KAAK,EAAE;AACR,CAAC,EACD;EACCF,KAAK,EAAE,IAAAC,QAAE,EACR,gBAAgB,EAChB,4CACD,CAAC;EACDC,KAAK,EAAE;AACR,CAAC,EACD;EACCF,KAAK,EAAE,IAAAC,QAAE,EACR,eAAe,EACf,4CACD,CAAC;EACDC,KAAK,EAAE;AACR,CAAC,EACD;EACCF,KAAK,EAAE,IAAAC,QAAE,EACR,wBAAwB,EACxB,4CACD,CAAC;EACDC,KAAK,EAAE;AACR,CAAC,EACD;EACCF,KAAK,EAAE,IAAAC,QAAE,EACR,aAAa,EACb,4CACD,CAAC;EACDC,KAAK,EAAE;AACR,CAAC,EACD;EACCF,KAAK,EAAE,IAAAC,QAAE,EACR,aAAa,EACb,4CACD,CAAC;EACDC,KAAK,EAAE;AACR,CAAC,EACD;EACCF,KAAK,EAAE,IAAAC,QAAE,EAAE,QAAQ,EAAE,4CAA6C,CAAC;EACnEC,KAAK,EAAE,QAAQ;EACfC,QAAQ,EAAE,IAAI;EACdC,MAAM,EAAE;AACT,CAAC,CACD;;AAED;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEe,SAASC,eAAeA,CAAE;EACxCC,OAAO;EACPJ,KAAK;EACLK,QAAQ,GAAGA,CAAA,KAAM,CAAC,CAAC;EACnBC,OAAO,GAAGV,4BAA4B;EACtCW,YAAY,GAAGX,4BAA4B,CAAE,CAAC,CAAE,CAACI,KAAK;EACtDQ,QAAQ;EACRC,gBAAgB,GAAG;AACpB,CAAC,EAAG;EACH;EACA,MAAMC,YAAY,GAAGV,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,MAAM;EAEpC,OACC,IAAAW,MAAA,CAAAC,aAAA,EAACnB,WAAA,CAAAoB,4BAAc;IACdL,QAAQ,EACPA,QAAQ,GAAGA,QAAQ,GAAG,MAAME,YAAY,KAAKH,YAC7C;IACDT,KAAK,EAAG,IAAAgB,QAAE,EAAE,cAAe,CAAG;IAC9BC,UAAU,EAAGA,CAAA,KAAMV,QAAQ,CAAEW,SAAU,CAAG;IAC1CP,gBAAgB,EAAGA,gBAAkB;IACrCL,OAAO,EAAGA;EAAS,GAEnB,IAAAO,MAAA,CAAAC,aAAA,EAACnB,WAAA,CAAAwB,aAAa;IACbnB,KAAK,EAAG,IAAAgB,QAAE,EAAE,cAAe,CAAG;IAC9Bd,KAAK,EAAGU,YAAc;IACtBJ,OAAO,EAAGA,OAAS;IACnBD,QAAQ,EAAGA,QAAU;IACrBa,IAAI,EAAG,kBAAoB;IAC3BC,uBAAuB;EAAA,CACvB,CACc,CAAC;AAEnB","ignoreList":[]}
+{"version":3,"names":["_components","require","_i18n","_useSettings","_jsxRuntime","AspectRatioTool","panelId","value","onChange","options","defaultValue","hasValue","isShownByDefault","displayValue","defaultRatios","themeRatios","showDefaultRatios","useSettings","themeOptions","map","name","ratio","label","defaultOptions","aspectRatioOptions","_x","disabled","hidden","jsx","__experimentalToolsPanelItem","__","onDeselect","undefined","children","SelectControl","size","__nextHasNoMarginBottom"],"sources":["@wordpress/block-editor/src/components/dimensions-tool/aspect-ratio-tool.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tSelectControl,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\n/**\n * Internal dependencies\n */\nimport { useSettings } from '../use-settings';\n\n/**\n * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps\n */\n\n/**\n * @callback AspectRatioToolPropsOnChange\n * @param {string} [value] New aspect ratio value.\n * @return {void} No return.\n */\n\n/**\n * @typedef {Object} AspectRatioToolProps\n * @property {string}                       [panelId]          ID of the panel this tool is associated with.\n * @property {string}                       [value]            Current aspect ratio value.\n * @property {AspectRatioToolPropsOnChange} [onChange]         Callback to update the aspect ratio value.\n * @property {SelectControlProps[]}         [options]          Aspect ratio options.\n * @property {string}                       [defaultValue]     Default aspect ratio value.\n * @property {boolean}                      [isShownByDefault] Whether the tool is shown by default.\n */\n\nexport default function AspectRatioTool( {\n\tpanelId,\n\tvalue,\n\tonChange = () => {},\n\toptions,\n\tdefaultValue = 'auto',\n\thasValue,\n\tisShownByDefault = true,\n} ) {\n\t// Match the CSS default so if the value is used directly in CSS it will look correct in the control.\n\tconst displayValue = value ?? 'auto';\n\n\tconst [ defaultRatios, themeRatios, showDefaultRatios ] = useSettings(\n\t\t'dimensions.aspectRatios.default',\n\t\t'dimensions.aspectRatios.theme',\n\t\t'dimensions.defaultAspectRatios'\n\t);\n\n\tconst themeOptions = themeRatios?.map( ( { name, ratio } ) => ( {\n\t\tlabel: name,\n\t\tvalue: ratio,\n\t} ) );\n\n\tconst defaultOptions = defaultRatios?.map( ( { name, ratio } ) => ( {\n\t\tlabel: name,\n\t\tvalue: ratio,\n\t} ) );\n\n\tconst aspectRatioOptions = [\n\t\t{\n\t\t\tlabel: _x(\n\t\t\t\t'Original',\n\t\t\t\t'Aspect ratio option for dimensions control'\n\t\t\t),\n\t\t\tvalue: 'auto',\n\t\t},\n\t\t...( showDefaultRatios ? defaultOptions : [] ),\n\t\t...( themeOptions ? themeOptions : [] ),\n\t\t{\n\t\t\tlabel: _x( 'Custom', 'Aspect ratio option for dimensions control' ),\n\t\t\tvalue: 'custom',\n\t\t\tdisabled: true,\n\t\t\thidden: true,\n\t\t},\n\t];\n\n\treturn (\n\t\t<ToolsPanelItem\n\t\t\thasValue={\n\t\t\t\thasValue ? hasValue : () => displayValue !== defaultValue\n\t\t\t}\n\t\t\tlabel={ __( 'Aspect ratio' ) }\n\t\t\tonDeselect={ () => onChange( undefined ) }\n\t\t\tisShownByDefault={ isShownByDefault }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t<SelectControl\n\t\t\t\tlabel={ __( 'Aspect ratio' ) }\n\t\t\t\tvalue={ displayValue }\n\t\t\t\toptions={ options ?? aspectRatioOptions }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t/>\n\t\t</ToolsPanelItem>\n\t);\n}\n"],"mappings":";;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAIA,IAAAC,KAAA,GAAAD,OAAA;AAIA,IAAAE,YAAA,GAAAF,OAAA;AAA8C,IAAAG,WAAA,GAAAH,OAAA;AAX9C;AACA;AACA;;AAMA;AACA;AACA;;AAGA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAEe,SAASI,eAAeA,CAAE;EACxCC,OAAO;EACPC,KAAK;EACLC,QAAQ,GAAGA,CAAA,KAAM,CAAC,CAAC;EACnBC,OAAO;EACPC,YAAY,GAAG,MAAM;EACrBC,QAAQ;EACRC,gBAAgB,GAAG;AACpB,CAAC,EAAG;EACH;EACA,MAAMC,YAAY,GAAGN,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,MAAM;EAEpC,MAAM,CAAEO,aAAa,EAAEC,WAAW,EAAEC,iBAAiB,CAAE,GAAG,IAAAC,wBAAW,EACpE,iCAAiC,EACjC,+BAA+B,EAC/B,gCACD,CAAC;EAED,MAAMC,YAAY,GAAGH,WAAW,EAAEI,GAAG,CAAE,CAAE;IAAEC,IAAI;IAAEC;EAAM,CAAC,MAAQ;IAC/DC,KAAK,EAAEF,IAAI;IACXb,KAAK,EAAEc;EACR,CAAC,CAAG,CAAC;EAEL,MAAME,cAAc,GAAGT,aAAa,EAAEK,GAAG,CAAE,CAAE;IAAEC,IAAI;IAAEC;EAAM,CAAC,MAAQ;IACnEC,KAAK,EAAEF,IAAI;IACXb,KAAK,EAAEc;EACR,CAAC,CAAG,CAAC;EAEL,MAAMG,kBAAkB,GAAG,CAC1B;IACCF,KAAK,EAAE,IAAAG,QAAE,EACR,UAAU,EACV,4CACD,CAAC;IACDlB,KAAK,EAAE;EACR,CAAC,EACD,IAAKS,iBAAiB,GAAGO,cAAc,GAAG,EAAE,CAAE,EAC9C,IAAKL,YAAY,GAAGA,YAAY,GAAG,EAAE,CAAE,EACvC;IACCI,KAAK,EAAE,IAAAG,QAAE,EAAE,QAAQ,EAAE,4CAA6C,CAAC;IACnElB,KAAK,EAAE,QAAQ;IACfmB,QAAQ,EAAE,IAAI;IACdC,MAAM,EAAE;EACT,CAAC,CACD;EAED,oBACC,IAAAvB,WAAA,CAAAwB,GAAA,EAAC5B,WAAA,CAAA6B,4BAAc;IACdlB,QAAQ,EACPA,QAAQ,GAAGA,QAAQ,GAAG,MAAME,YAAY,KAAKH,YAC7C;IACDY,KAAK,EAAG,IAAAQ,QAAE,EAAE,cAAe,CAAG;IAC9BC,UAAU,EAAGA,CAAA,KAAMvB,QAAQ,CAAEwB,SAAU,CAAG;IAC1CpB,gBAAgB,EAAGA,gBAAkB;IACrCN,OAAO,EAAGA,OAAS;IAAA2B,QAAA,eAEnB,IAAA7B,WAAA,CAAAwB,GAAA,EAAC5B,WAAA,CAAAkC,aAAa;MACbZ,KAAK,EAAG,IAAAQ,QAAE,EAAE,cAAe,CAAG;MAC9BvB,KAAK,EAAGM,YAAc;MACtBJ,OAAO,EAAGA,OAAO,aAAPA,OAAO,cAAPA,OAAO,GAAIe,kBAAoB;MACzChB,QAAQ,EAAGA,QAAU;MACrB2B,IAAI,EAAC,kBAAkB;MACvBC,uBAAuB;IAAA,CACvB;EAAC,CACa,CAAC;AAEnB","ignoreList":[]}

package/build/components/dimensions-tool/index.js

@@ -5,11 +5,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = require("react");
 var _element = require("@wordpress/element");
 var _aspectRatioTool = _interopRequireDefault(require("./aspect-ratio-tool"));
 var _scaleTool = _interopRequireDefault(require("./scale-tool"));
 var _widthHeightTool = _interopRequireDefault(require("./width-height-tool"));
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * WordPress dependencies
  */
@@ -56,8 +56,7 @@ var _widthHeightTool = _interopRequireDefault(require("./width-height-tool"));
  * @param {DimensionsControlsProps} props The component props.
  *
  * @return {Element} The dimensions controls.
- */
-function DimensionsTool({
+ */function DimensionsTool({
   panelId,
   value = {},
   onChange = () => {},
@@ -88,121 +87,123 @@ function DimensionsTool({
   // as a custom aspect ratio.
   const aspectRatioValue = width && height ? 'custom' : lastAspectRatio;
   const showScaleControl = aspectRatio || width && height;
-  return (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_aspectRatioTool.default, {
-    panelId: panelId,
-    options: aspectRatioOptions,
-    defaultValue: defaultAspectRatio,
-    value: aspectRatioValue,
-    onChange: nextAspectRatio => {
-      const nextValue = {
-        ...value
-      };
-
-      // 'auto' is CSS default, so it gets treated as null.
-      nextAspectRatio = nextAspectRatio === 'auto' ? null : nextAspectRatio;
-      setLastAspectRatio(nextAspectRatio);
-
-      // Update aspectRatio.
-      if (!nextAspectRatio) {
-        delete nextValue.aspectRatio;
-      } else {
-        nextValue.aspectRatio = nextAspectRatio;
-      }
-
-      // Auto-update scale.
-      if (!nextAspectRatio) {
-        delete nextValue.scale;
-      } else if (lastScale) {
-        nextValue.scale = lastScale;
-      } else {
-        nextValue.scale = defaultScale;
-        setLastScale(defaultScale);
-      }
-
-      // Auto-update width and height.
-      if ('custom' !== nextAspectRatio && width && height) {
-        delete nextValue.height;
-      }
-      onChange(nextValue);
-    }
-  }), (0, _react.createElement)(_widthHeightTool.default, {
-    panelId: panelId,
-    units: unitsOptions,
-    value: {
-      width,
-      height
-    },
-    onChange: ({
-      width: nextWidth,
-      height: nextHeight
-    }) => {
-      const nextValue = {
-        ...value
-      };
-
-      // 'auto' is CSS default, so it gets treated as null.
-      nextWidth = nextWidth === 'auto' ? null : nextWidth;
-      nextHeight = nextHeight === 'auto' ? null : nextHeight;
-
-      // Update width.
-      if (!nextWidth) {
-        delete nextValue.width;
-      } else {
-        nextValue.width = nextWidth;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_aspectRatioTool.default, {
+      panelId: panelId,
+      options: aspectRatioOptions,
+      defaultValue: defaultAspectRatio,
+      value: aspectRatioValue,
+      onChange: nextAspectRatio => {
+        const nextValue = {
+          ...value
+        };
+
+        // 'auto' is CSS default, so it gets treated as null.
+        nextAspectRatio = nextAspectRatio === 'auto' ? null : nextAspectRatio;
+        setLastAspectRatio(nextAspectRatio);
+
+        // Update aspectRatio.
+        if (!nextAspectRatio) {
+          delete nextValue.aspectRatio;
+        } else {
+          nextValue.aspectRatio = nextAspectRatio;
+        }
+
+        // Auto-update scale.
+        if (!nextAspectRatio) {
+          delete nextValue.scale;
+        } else if (lastScale) {
+          nextValue.scale = lastScale;
+        } else {
+          nextValue.scale = defaultScale;
+          setLastScale(defaultScale);
+        }
+
+        // Auto-update width and height.
+        if ('custom' !== nextAspectRatio && width && height) {
+          delete nextValue.height;
+        }
+        onChange(nextValue);
       }
-
-      // Update height.
-      if (!nextHeight) {
-        delete nextValue.height;
-      } else {
-        nextValue.height = nextHeight;
-      }
-
-      // Auto-update aspectRatio.
-      if (nextWidth && nextHeight) {
-        delete nextValue.aspectRatio;
-      } else if (lastAspectRatio) {
-        nextValue.aspectRatio = lastAspectRatio;
-      } else {
-        // No setting defaultAspectRatio here, because
-        // aspectRatio is optional in this scenario,
-        // unlike scale.
-      }
-
-      // Auto-update scale.
-      if (!lastAspectRatio && !!nextWidth !== !!nextHeight) {
-        delete nextValue.scale;
-      } else if (lastScale) {
-        nextValue.scale = lastScale;
-      } else {
-        nextValue.scale = defaultScale;
-        setLastScale(defaultScale);
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_widthHeightTool.default, {
+      panelId: panelId,
+      units: unitsOptions,
+      value: {
+        width,
+        height
+      },
+      onChange: ({
+        width: nextWidth,
+        height: nextHeight
+      }) => {
+        const nextValue = {
+          ...value
+        };
+
+        // 'auto' is CSS default, so it gets treated as null.
+        nextWidth = nextWidth === 'auto' ? null : nextWidth;
+        nextHeight = nextHeight === 'auto' ? null : nextHeight;
+
+        // Update width.
+        if (!nextWidth) {
+          delete nextValue.width;
+        } else {
+          nextValue.width = nextWidth;
+        }
+
+        // Update height.
+        if (!nextHeight) {
+          delete nextValue.height;
+        } else {
+          nextValue.height = nextHeight;
+        }
+
+        // Auto-update aspectRatio.
+        if (nextWidth && nextHeight) {
+          delete nextValue.aspectRatio;
+        } else if (lastAspectRatio) {
+          nextValue.aspectRatio = lastAspectRatio;
+        } else {
+          // No setting defaultAspectRatio here, because
+          // aspectRatio is optional in this scenario,
+          // unlike scale.
+        }
+
+        // Auto-update scale.
+        if (!lastAspectRatio && !!nextWidth !== !!nextHeight) {
+          delete nextValue.scale;
+        } else if (lastScale) {
+          nextValue.scale = lastScale;
+        } else {
+          nextValue.scale = defaultScale;
+          setLastScale(defaultScale);
+        }
+        onChange(nextValue);
       }
-      onChange(nextValue);
-    }
-  }), showScaleControl && (0, _react.createElement)(_scaleTool.default, {
-    panelId: panelId,
-    options: scaleOptions,
-    defaultValue: defaultScale,
-    value: lastScale,
-    onChange: nextScale => {
-      const nextValue = {
-        ...value
-      };
-
-      // 'fill' is CSS default, so it gets treated as null.
-      nextScale = nextScale === 'fill' ? null : nextScale;
-      setLastScale(nextScale);
-
-      // Update scale.
-      if (!nextScale) {
-        delete nextValue.scale;
-      } else {
-        nextValue.scale = nextScale;
+    }), showScaleControl && /*#__PURE__*/(0, _jsxRuntime.jsx)(_scaleTool.default, {
+      panelId: panelId,
+      options: scaleOptions,
+      defaultValue: defaultScale,
+      value: lastScale,
+      onChange: nextScale => {
+        const nextValue = {
+          ...value
+        };
+
+        // 'fill' is CSS default, so it gets treated as null.
+        nextScale = nextScale === 'fill' ? null : nextScale;
+        setLastScale(nextScale);
+
+        // Update scale.
+        if (!nextScale) {
+          delete nextValue.scale;
+        } else {
+          nextValue.scale = nextScale;
+        }
+        onChange(nextValue);
       }
-      onChange(nextValue);
-    }
-  }));
+    })]
+  });
 }
 var _default = exports.default = DimensionsTool;
 //# sourceMappingURL=index.js.map

package/build/components/dimensions-tool/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_aspectRatioTool","_interopRequireDefault","_scaleTool","_widthHeightTool","DimensionsTool","panelId","value","onChange","aspectRatioOptions","defaultAspectRatio","scaleOptions","defaultScale","unitsOptions","width","undefined","height","aspectRatio","scale","lastScale","setLastScale","useState","lastAspectRatio","setLastAspectRatio","aspectRatioValue","showScaleControl","_react","createElement","Fragment","default","options","defaultValue","nextAspectRatio","nextValue","units","nextWidth","nextHeight","nextScale","_default","exports"],"sources":["@wordpress/block-editor/src/components/dimensions-tool/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport AspectRatioTool from './aspect-ratio-tool';\nimport ScaleTool from './scale-tool';\nimport WidthHeightTool from './width-height-tool';\n\n/**\n * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps\n */\n\n/**\n * @typedef {import('@wordpress/components/build-types/unit-control/types').WPUnitControlUnit} WPUnitControlUnit\n */\n\n/**\n * @typedef {Object} Dimensions\n * @property {string} [width]       CSS width property.\n * @property {string} [height]      CSS height property.\n * @property {string} [scale]       CSS object-fit property.\n * @property {string} [aspectRatio] CSS aspect-ratio property.\n */\n\n/**\n * @callback DimensionsControlsOnChange\n * @param {Dimensions} nextValue\n * @return {void}\n */\n\n/**\n * @typedef {Object} DimensionsControlsProps\n * @property {string}                     [panelId]            ID of the panel that contains the controls.\n * @property {Dimensions}                 [value]              Current dimensions values.\n * @property {DimensionsControlsOnChange} [onChange]           Callback to update the dimensions values.\n * @property {SelectControlProps[]}       [aspectRatioOptions] Aspect ratio options.\n * @property {SelectControlProps[]}       [scaleOptions]       Scale options.\n * @property {WPUnitControlUnit[]}        [unitsOptions]       Units options.\n */\n\n/**\n * Component that renders controls to edit the dimensions of an image or container.\n *\n * @param {DimensionsControlsProps} props The component props.\n *\n * @return {Element} The dimensions controls.\n */\nfunction DimensionsTool( {\n\tpanelId,\n\tvalue = {},\n\tonChange = () => {},\n\taspectRatioOptions, // Default options handled by AspectRatioTool.\n\tdefaultAspectRatio = 'auto', // Match CSS default value for aspect-ratio.\n\tscaleOptions, // Default options handled by ScaleTool.\n\tdefaultScale = 'fill', // Match CSS default value for object-fit.\n\tunitsOptions, // Default options handled by UnitControl.\n} ) {\n\t// Coerce undefined and CSS default values to be null.\n\tconst width =\n\t\tvalue.width === undefined || value.width === 'auto'\n\t\t\t? null\n\t\t\t: value.width;\n\tconst height =\n\t\tvalue.height === undefined || value.height === 'auto'\n\t\t\t? null\n\t\t\t: value.height;\n\tconst aspectRatio =\n\t\tvalue.aspectRatio === undefined || value.aspectRatio === 'auto'\n\t\t\t? null\n\t\t\t: value.aspectRatio;\n\tconst scale =\n\t\tvalue.scale === undefined || value.scale === 'fill'\n\t\t\t? null\n\t\t\t: value.scale;\n\n\t// Keep track of state internally, so when the value is cleared by means\n\t// other than directly editing that field, it's easier to restore the\n\t// previous value.\n\tconst [ lastScale, setLastScale ] = useState( scale );\n\tconst [ lastAspectRatio, setLastAspectRatio ] = useState( aspectRatio );\n\n\t// 'custom' is not a valid value for CSS aspect-ratio, but it is used in the\n\t// dropdown to indicate that setting both the width and height is the same\n\t// as a custom aspect ratio.\n\tconst aspectRatioValue = width && height ? 'custom' : lastAspectRatio;\n\n\tconst showScaleControl = aspectRatio || ( width && height );\n\n\treturn (\n\t\t<>\n\t\t\t<AspectRatioTool\n\t\t\t\tpanelId={ panelId }\n\t\t\t\toptions={ aspectRatioOptions }\n\t\t\t\tdefaultValue={ defaultAspectRatio }\n\t\t\t\tvalue={ aspectRatioValue }\n\t\t\t\tonChange={ ( nextAspectRatio ) => {\n\t\t\t\t\tconst nextValue = { ...value };\n\n\t\t\t\t\t// 'auto' is CSS default, so it gets treated as null.\n\t\t\t\t\tnextAspectRatio =\n\t\t\t\t\t\tnextAspectRatio === 'auto' ? null : nextAspectRatio;\n\n\t\t\t\t\tsetLastAspectRatio( nextAspectRatio );\n\n\t\t\t\t\t// Update aspectRatio.\n\t\t\t\t\tif ( ! nextAspectRatio ) {\n\t\t\t\t\t\tdelete nextValue.aspectRatio;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tnextValue.aspectRatio = nextAspectRatio;\n\t\t\t\t\t}\n\n\t\t\t\t\t// Auto-update scale.\n\t\t\t\t\tif ( ! nextAspectRatio ) {\n\t\t\t\t\t\tdelete nextValue.scale;\n\t\t\t\t\t} else if ( lastScale ) {\n\t\t\t\t\t\tnextValue.scale = lastScale;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tnextValue.scale = defaultScale;\n\t\t\t\t\t\tsetLastScale( defaultScale );\n\t\t\t\t\t}\n\n\t\t\t\t\t// Auto-update width and height.\n\t\t\t\t\tif ( 'custom' !== nextAspectRatio && width && height ) {\n\t\t\t\t\t\tdelete nextValue.height;\n\t\t\t\t\t}\n\n\t\t\t\t\tonChange( nextValue );\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<WidthHeightTool\n\t\t\t\tpanelId={ panelId }\n\t\t\t\tunits={ unitsOptions }\n\t\t\t\tvalue={ { width, height } }\n\t\t\t\tonChange={ ( { width: nextWidth, height: nextHeight } ) => {\n\t\t\t\t\tconst nextValue = { ...value };\n\n\t\t\t\t\t// 'auto' is CSS default, so it gets treated as null.\n\t\t\t\t\tnextWidth = nextWidth === 'auto' ? null : nextWidth;\n\t\t\t\t\tnextHeight = nextHeight === 'auto' ? null : nextHeight;\n\n\t\t\t\t\t// Update width.\n\t\t\t\t\tif ( ! nextWidth ) {\n\t\t\t\t\t\tdelete nextValue.width;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tnextValue.width = nextWidth;\n\t\t\t\t\t}\n\n\t\t\t\t\t// Update height.\n\t\t\t\t\tif ( ! nextHeight ) {\n\t\t\t\t\t\tdelete nextValue.height;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tnextValue.height = nextHeight;\n\t\t\t\t\t}\n\n\t\t\t\t\t// Auto-update aspectRatio.\n\t\t\t\t\tif ( nextWidth && nextHeight ) {\n\t\t\t\t\t\tdelete nextValue.aspectRatio;\n\t\t\t\t\t} else if ( lastAspectRatio ) {\n\t\t\t\t\t\tnextValue.aspectRatio = lastAspectRatio;\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// No setting defaultAspectRatio here, because\n\t\t\t\t\t\t// aspectRatio is optional in this scenario,\n\t\t\t\t\t\t// unlike scale.\n\t\t\t\t\t}\n\n\t\t\t\t\t// Auto-update scale.\n\t\t\t\t\tif ( ! lastAspectRatio && !! nextWidth !== !! nextHeight ) {\n\t\t\t\t\t\tdelete nextValue.scale;\n\t\t\t\t\t} else if ( lastScale ) {\n\t\t\t\t\t\tnextValue.scale = lastScale;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tnextValue.scale = defaultScale;\n\t\t\t\t\t\tsetLastScale( defaultScale );\n\t\t\t\t\t}\n\n\t\t\t\t\tonChange( nextValue );\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t{ showScaleControl && (\n\t\t\t\t<ScaleTool\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\toptions={ scaleOptions }\n\t\t\t\t\tdefaultValue={ defaultScale }\n\t\t\t\t\tvalue={ lastScale }\n\t\t\t\t\tonChange={ ( nextScale ) => {\n\t\t\t\t\t\tconst nextValue = { ...value };\n\n\t\t\t\t\t\t// 'fill' is CSS default, so it gets treated as null.\n\t\t\t\t\t\tnextScale = nextScale === 'fill' ? null : nextScale;\n\n\t\t\t\t\t\tsetLastScale( nextScale );\n\n\t\t\t\t\t\t// Update scale.\n\t\t\t\t\t\tif ( ! nextScale ) {\n\t\t\t\t\t\t\tdelete nextValue.scale;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.scale = nextScale;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tonChange( nextValue );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default DimensionsTool;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_element","require","_aspectRatioTool","_interopRequireDefault","_scaleTool","_widthHeightTool","_jsxRuntime","DimensionsTool","panelId","value","onChange","aspectRatioOptions","defaultAspectRatio","scaleOptions","defaultScale","unitsOptions","width","undefined","height","aspectRatio","scale","lastScale","setLastScale","useState","lastAspectRatio","setLastAspectRatio","aspectRatioValue","showScaleControl","jsxs","Fragment","children","jsx","default","options","defaultValue","nextAspectRatio","nextValue","units","nextWidth","nextHeight","nextScale","_default","exports"],"sources":["@wordpress/block-editor/src/components/dimensions-tool/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport AspectRatioTool from './aspect-ratio-tool';\nimport ScaleTool from './scale-tool';\nimport WidthHeightTool from './width-height-tool';\n\n/**\n * @typedef {import('@wordpress/components/build-types/select-control/types').SelectControlProps} SelectControlProps\n */\n\n/**\n * @typedef {import('@wordpress/components/build-types/unit-control/types').WPUnitControlUnit} WPUnitControlUnit\n */\n\n/**\n * @typedef {Object} Dimensions\n * @property {string} [width]       CSS width property.\n * @property {string} [height]      CSS height property.\n * @property {string} [scale]       CSS object-fit property.\n * @property {string} [aspectRatio] CSS aspect-ratio property.\n */\n\n/**\n * @callback DimensionsControlsOnChange\n * @param {Dimensions} nextValue\n * @return {void}\n */\n\n/**\n * @typedef {Object} DimensionsControlsProps\n * @property {string}                     [panelId]            ID of the panel that contains the controls.\n * @property {Dimensions}                 [value]              Current dimensions values.\n * @property {DimensionsControlsOnChange} [onChange]           Callback to update the dimensions values.\n * @property {SelectControlProps[]}       [aspectRatioOptions] Aspect ratio options.\n * @property {SelectControlProps[]}       [scaleOptions]       Scale options.\n * @property {WPUnitControlUnit[]}        [unitsOptions]       Units options.\n */\n\n/**\n * Component that renders controls to edit the dimensions of an image or container.\n *\n * @param {DimensionsControlsProps} props The component props.\n *\n * @return {Element} The dimensions controls.\n */\nfunction DimensionsTool( {\n\tpanelId,\n\tvalue = {},\n\tonChange = () => {},\n\taspectRatioOptions, // Default options handled by AspectRatioTool.\n\tdefaultAspectRatio = 'auto', // Match CSS default value for aspect-ratio.\n\tscaleOptions, // Default options handled by ScaleTool.\n\tdefaultScale = 'fill', // Match CSS default value for object-fit.\n\tunitsOptions, // Default options handled by UnitControl.\n} ) {\n\t// Coerce undefined and CSS default values to be null.\n\tconst width =\n\t\tvalue.width === undefined || value.width === 'auto'\n\t\t\t? null\n\t\t\t: value.width;\n\tconst height =\n\t\tvalue.height === undefined || value.height === 'auto'\n\t\t\t? null\n\t\t\t: value.height;\n\tconst aspectRatio =\n\t\tvalue.aspectRatio === undefined || value.aspectRatio === 'auto'\n\t\t\t? null\n\t\t\t: value.aspectRatio;\n\tconst scale =\n\t\tvalue.scale === undefined || value.scale === 'fill'\n\t\t\t? null\n\t\t\t: value.scale;\n\n\t// Keep track of state internally, so when the value is cleared by means\n\t// other than directly editing that field, it's easier to restore the\n\t// previous value.\n\tconst [ lastScale, setLastScale ] = useState( scale );\n\tconst [ lastAspectRatio, setLastAspectRatio ] = useState( aspectRatio );\n\n\t// 'custom' is not a valid value for CSS aspect-ratio, but it is used in the\n\t// dropdown to indicate that setting both the width and height is the same\n\t// as a custom aspect ratio.\n\tconst aspectRatioValue = width && height ? 'custom' : lastAspectRatio;\n\n\tconst showScaleControl = aspectRatio || ( width && height );\n\n\treturn (\n\t\t<>\n\t\t\t<AspectRatioTool\n\t\t\t\tpanelId={ panelId }\n\t\t\t\toptions={ aspectRatioOptions }\n\t\t\t\tdefaultValue={ defaultAspectRatio }\n\t\t\t\tvalue={ aspectRatioValue }\n\t\t\t\tonChange={ ( nextAspectRatio ) => {\n\t\t\t\t\tconst nextValue = { ...value };\n\n\t\t\t\t\t// 'auto' is CSS default, so it gets treated as null.\n\t\t\t\t\tnextAspectRatio =\n\t\t\t\t\t\tnextAspectRatio === 'auto' ? null : nextAspectRatio;\n\n\t\t\t\t\tsetLastAspectRatio( nextAspectRatio );\n\n\t\t\t\t\t// Update aspectRatio.\n\t\t\t\t\tif ( ! nextAspectRatio ) {\n\t\t\t\t\t\tdelete nextValue.aspectRatio;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tnextValue.aspectRatio = nextAspectRatio;\n\t\t\t\t\t}\n\n\t\t\t\t\t// Auto-update scale.\n\t\t\t\t\tif ( ! nextAspectRatio ) {\n\t\t\t\t\t\tdelete nextValue.scale;\n\t\t\t\t\t} else if ( lastScale ) {\n\t\t\t\t\t\tnextValue.scale = lastScale;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tnextValue.scale = defaultScale;\n\t\t\t\t\t\tsetLastScale( defaultScale );\n\t\t\t\t\t}\n\n\t\t\t\t\t// Auto-update width and height.\n\t\t\t\t\tif ( 'custom' !== nextAspectRatio && width && height ) {\n\t\t\t\t\t\tdelete nextValue.height;\n\t\t\t\t\t}\n\n\t\t\t\t\tonChange( nextValue );\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<WidthHeightTool\n\t\t\t\tpanelId={ panelId }\n\t\t\t\tunits={ unitsOptions }\n\t\t\t\tvalue={ { width, height } }\n\t\t\t\tonChange={ ( { width: nextWidth, height: nextHeight } ) => {\n\t\t\t\t\tconst nextValue = { ...value };\n\n\t\t\t\t\t// 'auto' is CSS default, so it gets treated as null.\n\t\t\t\t\tnextWidth = nextWidth === 'auto' ? null : nextWidth;\n\t\t\t\t\tnextHeight = nextHeight === 'auto' ? null : nextHeight;\n\n\t\t\t\t\t// Update width.\n\t\t\t\t\tif ( ! nextWidth ) {\n\t\t\t\t\t\tdelete nextValue.width;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tnextValue.width = nextWidth;\n\t\t\t\t\t}\n\n\t\t\t\t\t// Update height.\n\t\t\t\t\tif ( ! nextHeight ) {\n\t\t\t\t\t\tdelete nextValue.height;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tnextValue.height = nextHeight;\n\t\t\t\t\t}\n\n\t\t\t\t\t// Auto-update aspectRatio.\n\t\t\t\t\tif ( nextWidth && nextHeight ) {\n\t\t\t\t\t\tdelete nextValue.aspectRatio;\n\t\t\t\t\t} else if ( lastAspectRatio ) {\n\t\t\t\t\t\tnextValue.aspectRatio = lastAspectRatio;\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// No setting defaultAspectRatio here, because\n\t\t\t\t\t\t// aspectRatio is optional in this scenario,\n\t\t\t\t\t\t// unlike scale.\n\t\t\t\t\t}\n\n\t\t\t\t\t// Auto-update scale.\n\t\t\t\t\tif ( ! lastAspectRatio && !! nextWidth !== !! nextHeight ) {\n\t\t\t\t\t\tdelete nextValue.scale;\n\t\t\t\t\t} else if ( lastScale ) {\n\t\t\t\t\t\tnextValue.scale = lastScale;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tnextValue.scale = defaultScale;\n\t\t\t\t\t\tsetLastScale( defaultScale );\n\t\t\t\t\t}\n\n\t\t\t\t\tonChange( nextValue );\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t{ showScaleControl && (\n\t\t\t\t<ScaleTool\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\toptions={ scaleOptions }\n\t\t\t\t\tdefaultValue={ defaultScale }\n\t\t\t\t\tvalue={ lastScale }\n\t\t\t\t\tonChange={ ( nextScale ) => {\n\t\t\t\t\t\tconst nextValue = { ...value };\n\n\t\t\t\t\t\t// 'fill' is CSS default, so it gets treated as null.\n\t\t\t\t\t\tnextScale = nextScale === 'fill' ? null : nextScale;\n\n\t\t\t\t\t\tsetLastScale( nextScale );\n\n\t\t\t\t\t\t// Update scale.\n\t\t\t\t\t\tif ( ! nextScale ) {\n\t\t\t\t\t\t\tdelete nextValue.scale;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tnextValue.scale = nextScale;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tonChange( nextValue );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default DimensionsTool;\n"],"mappings":"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","ignoreList":[]}

package/build/components/dimensions-tool/scale-tool.js

@@ -4,10 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = ScaleTool;
-var _react = require("react");
 var _components = require("@wordpress/components");
 var _element = require("@wordpress/element");
 var _i18n = require("@wordpress/i18n");
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * WordPress dependencies
  */
@@ -24,8 +24,7 @@ var _i18n = require("@wordpress/i18n");
  * @see https://developer.mozilla.org/en-US/docs/Web/CSS/Replaced_element
  *
  * @type {SelectControlProps[]}
- */
-const DEFAULT_SCALE_OPTIONS = [{
+ */const DEFAULT_SCALE_OPTIONS = [{
   value: 'fill',
   label: (0, _i18n._x)('Fill', 'Scale option for dimensions control'),
   help: (0, _i18n.__)('Fill the space by stretching the content.')
@@ -87,22 +86,23 @@ function ScaleTool({
       return acc;
     }, {});
   }, [options]);
-  return (0, _react.createElement)(_components.__experimentalToolsPanelItem, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToolsPanelItem, {
     label: (0, _i18n.__)('Scale'),
     isShownByDefault: isShownByDefault,
     hasValue: () => displayValue !== defaultValue,
     onDeselect: () => onChange(defaultValue),
-    panelId: panelId
-  }, (0, _react.createElement)(_components.__experimentalToggleGroupControl, {
-    label: (0, _i18n.__)('Scale'),
-    isBlock: true,
-    help: scaleHelp[displayValue],
-    value: displayValue,
-    onChange: onChange,
-    size: '__unstable-large'
-  }, options.map(option => (0, _react.createElement)(_components.__experimentalToggleGroupControlOption, {
-    key: option.value,
-    ...option
-  }))));
+    panelId: panelId,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToggleGroupControl, {
+      label: (0, _i18n.__)('Scale'),
+      isBlock: true,
+      help: scaleHelp[displayValue],
+      value: displayValue,
+      onChange: onChange,
+      size: "__unstable-large",
+      children: options.map(option => /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToggleGroupControlOption, {
+        ...option
+      }, option.value))
+    })
+  });
 }
 //# sourceMappingURL=scale-tool.js.map