@wordpress/components 18.0.0 → 19.0.3

package/build/box-control/input-controls.js

@@ -26,17 +26,19 @@ var _boxControlStyles = require("./styles/box-control-styles");
 /**
  * Internal dependencies
  */
-function BoxInputControls({
-  onChange = _lodash.noop,
-  onFocus = _lodash.noop,
-  onHoverOn = _lodash.noop,
-  onHoverOff = _lodash.noop,
-  values,
-  selectedUnits,
-  setSelectedUnits,
-  sides,
-  ...props
-}) {
+function BoxInputControls(_ref) {
+  let {
+    onChange = _lodash.noop,
+    onFocus = _lodash.noop,
+    onHoverOn = _lodash.noop,
+    onHoverOff = _lodash.noop,
+    values,
+    selectedUnits,
+    setSelectedUnits,
+    sides,
+    ...props
+  } = _ref;
+
   const createHandleOnFocus = side => event => {
     onFocus(event, {
       side
@@ -59,9 +61,10 @@ function BoxInputControls({
     onChange(nextValues);
   };
 
-  const createHandleOnChange = side => (next, {
-    event
-  }) => {
+  const createHandleOnChange = side => (next, _ref2) => {
+    let {
+      event
+    } = _ref2;
     const {
       altKey
     } = event;

package/build/box-control/input-controls.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/box-control/input-controls.js"],"names":["BoxInputControls","onChange","noop","onFocus","onHoverOn","onHoverOff","values","selectedUnits","setSelectedUnits","sides","props","createHandleOnFocus","side","event","createHandleOnHoverOn","createHandleOnHoverOff","handleOnChange","nextValues","createHandleOnChange","next","altKey","isNumeric","isNaN","parseFloat","nextValue","undefined","bottom","top","right","left","createHandleOnUnitChange","newUnits","filteredSides","length","ALL_SIDES","filter","includes","first","last","only","map","LABELS"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { noop } from 'lodash';\n\n/**\n * Internal dependencies\n */\nimport UnitControl from './unit-control';\nimport { ALL_SIDES, LABELS } from './utils';\nimport { LayoutContainer, Layout } from './styles/box-control-styles';\n\nexport default function BoxInputControls( {\n\tonChange = noop,\n\tonFocus = noop,\n\tonHoverOn = noop,\n\tonHoverOff = noop,\n\tvalues,\n\tselectedUnits,\n\tsetSelectedUnits,\n\tsides,\n\t...props\n} ) {\n\tconst createHandleOnFocus = ( side ) => ( event ) => {\n\t\tonFocus( event, { side } );\n\t};\n\n\tconst createHandleOnHoverOn = ( side ) => () => {\n\t\tonHoverOn( { [ side ]: true } );\n\t};\n\n\tconst createHandleOnHoverOff = ( side ) => () => {\n\t\tonHoverOff( { [ side ]: false } );\n\t};\n\n\tconst handleOnChange = ( nextValues ) => {\n\t\tonChange( nextValues );\n\t};\n\n\tconst createHandleOnChange = ( side ) => ( next, { event } ) => {\n\t\tconst { altKey } = event;\n\t\tconst nextValues = { ...values };\n\t\tconst isNumeric = ! isNaN( parseFloat( next ) );\n\t\tconst nextValue = isNumeric ? next : undefined;\n\n\t\tnextValues[ side ] = nextValue;\n\n\t\t/**\n\t\t * Supports changing pair sides. For example, holding the ALT key\n\t\t * when changing the TOP will also update BOTTOM.\n\t\t */\n\t\tif ( altKey ) {\n\t\t\tswitch ( side ) {\n\t\t\t\tcase 'top':\n\t\t\t\t\tnextValues.bottom = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'bottom':\n\t\t\t\t\tnextValues.top = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'left':\n\t\t\t\t\tnextValues.right = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'right':\n\t\t\t\t\tnextValues.left = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\thandleOnChange( nextValues );\n\t};\n\n\tconst createHandleOnUnitChange = ( side ) => ( next ) => {\n\t\tconst newUnits = { ...selectedUnits };\n\t\tnewUnits[ side ] = next;\n\t\tsetSelectedUnits( newUnits );\n\t};\n\n\t// Filter sides if custom configuration provided, maintaining default order.\n\tconst filteredSides = sides?.length\n\t\t? ALL_SIDES.filter( ( side ) => sides.includes( side ) )\n\t\t: ALL_SIDES;\n\n\tconst first = filteredSides[ 0 ];\n\tconst last = filteredSides[ filteredSides.length - 1 ];\n\tconst only = first === last && first;\n\n\treturn (\n\t\t<LayoutContainer className=\"component-box-control__input-controls-wrapper\">\n\t\t\t<Layout\n\t\t\t\tgap={ 0 }\n\t\t\t\talign=\"top\"\n\t\t\t\tclassName=\"component-box-control__input-controls\"\n\t\t\t>\n\t\t\t\t{ filteredSides.map( ( side ) => (\n\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\tisFirst={ first === side }\n\t\t\t\t\t\tisLast={ last === side }\n\t\t\t\t\t\tisOnly={ only === side }\n\t\t\t\t\t\tvalue={ values[ side ] }\n\t\t\t\t\t\tunit={\n\t\t\t\t\t\t\tvalues[ side ] ? undefined : selectedUnits[ side ]\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonChange={ createHandleOnChange( side ) }\n\t\t\t\t\t\tonUnitChange={ createHandleOnUnitChange( side ) }\n\t\t\t\t\t\tonFocus={ createHandleOnFocus( side ) }\n\t\t\t\t\t\tonHoverOn={ createHandleOnHoverOn( side ) }\n\t\t\t\t\t\tonHoverOff={ createHandleOnHoverOff( side ) }\n\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\tkey={ `box-control-${ side }` }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</Layout>\n\t\t</LayoutContainer>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/box-control/input-controls.js"],"names":["BoxInputControls","onChange","noop","onFocus","onHoverOn","onHoverOff","values","selectedUnits","setSelectedUnits","sides","props","createHandleOnFocus","side","event","createHandleOnHoverOn","createHandleOnHoverOff","handleOnChange","nextValues","createHandleOnChange","next","altKey","isNumeric","isNaN","parseFloat","nextValue","undefined","bottom","top","right","left","createHandleOnUnitChange","newUnits","filteredSides","length","ALL_SIDES","filter","includes","first","last","only","map","LABELS"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { noop } from 'lodash';\n\n/**\n * Internal dependencies\n */\nimport UnitControl from './unit-control';\nimport { ALL_SIDES, LABELS } from './utils';\nimport { LayoutContainer, Layout } from './styles/box-control-styles';\n\nexport default function BoxInputControls( {\n\tonChange = noop,\n\tonFocus = noop,\n\tonHoverOn = noop,\n\tonHoverOff = noop,\n\tvalues,\n\tselectedUnits,\n\tsetSelectedUnits,\n\tsides,\n\t...props\n} ) {\n\tconst createHandleOnFocus = ( side ) => ( event ) => {\n\t\tonFocus( event, { side } );\n\t};\n\n\tconst createHandleOnHoverOn = ( side ) => () => {\n\t\tonHoverOn( { [ side ]: true } );\n\t};\n\n\tconst createHandleOnHoverOff = ( side ) => () => {\n\t\tonHoverOff( { [ side ]: false } );\n\t};\n\n\tconst handleOnChange = ( nextValues ) => {\n\t\tonChange( nextValues );\n\t};\n\n\tconst createHandleOnChange = ( side ) => ( next, { event } ) => {\n\t\tconst { altKey } = event;\n\t\tconst nextValues = { ...values };\n\t\tconst isNumeric = ! isNaN( parseFloat( next ) );\n\t\tconst nextValue = isNumeric ? next : undefined;\n\n\t\tnextValues[ side ] = nextValue;\n\n\t\t/**\n\t\t * Supports changing pair sides. For example, holding the ALT key\n\t\t * when changing the TOP will also update BOTTOM.\n\t\t */\n\t\tif ( altKey ) {\n\t\t\tswitch ( side ) {\n\t\t\t\tcase 'top':\n\t\t\t\t\tnextValues.bottom = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'bottom':\n\t\t\t\t\tnextValues.top = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'left':\n\t\t\t\t\tnextValues.right = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'right':\n\t\t\t\t\tnextValues.left = nextValue;\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\thandleOnChange( nextValues );\n\t};\n\n\tconst createHandleOnUnitChange = ( side ) => ( next ) => {\n\t\tconst newUnits = { ...selectedUnits };\n\t\tnewUnits[ side ] = next;\n\t\tsetSelectedUnits( newUnits );\n\t};\n\n\t// Filter sides if custom configuration provided, maintaining default order.\n\tconst filteredSides = sides?.length\n\t\t? ALL_SIDES.filter( ( side ) => sides.includes( side ) )\n\t\t: ALL_SIDES;\n\n\tconst first = filteredSides[ 0 ];\n\tconst last = filteredSides[ filteredSides.length - 1 ];\n\tconst only = first === last && first;\n\n\treturn (\n\t\t<LayoutContainer className=\"component-box-control__input-controls-wrapper\">\n\t\t\t<Layout\n\t\t\t\tgap={ 0 }\n\t\t\t\talign=\"top\"\n\t\t\t\tclassName=\"component-box-control__input-controls\"\n\t\t\t>\n\t\t\t\t{ filteredSides.map( ( side ) => (\n\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\tisFirst={ first === side }\n\t\t\t\t\t\tisLast={ last === side }\n\t\t\t\t\t\tisOnly={ only === side }\n\t\t\t\t\t\tvalue={ values[ side ] }\n\t\t\t\t\t\tunit={\n\t\t\t\t\t\t\tvalues[ side ] ? undefined : selectedUnits[ side ]\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonChange={ createHandleOnChange( side ) }\n\t\t\t\t\t\tonUnitChange={ createHandleOnUnitChange( side ) }\n\t\t\t\t\t\tonFocus={ createHandleOnFocus( side ) }\n\t\t\t\t\t\tonHoverOn={ createHandleOnHoverOn( side ) }\n\t\t\t\t\t\tonHoverOff={ createHandleOnHoverOff( side ) }\n\t\t\t\t\t\tlabel={ LABELS[ side ] }\n\t\t\t\t\t\tkey={ `box-control-${ side }` }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</Layout>\n\t\t</LayoutContainer>\n\t);\n}\n"]}

package/build/box-control/linked-button.js

@@ -26,10 +26,11 @@ var _tooltip = _interopRequireDefault(require("../tooltip"));
 /**
  * Internal dependencies
  */
-function LinkedButton({
-  isLinked,
-  ...props
-}) {
+function LinkedButton(_ref) {
+  let {
+    isLinked,
+    ...props
+  } = _ref;
   const label = isLinked ? (0, _i18n.__)('Unlink Sides') : (0, _i18n.__)('Link Sides');
   return (0, _element.createElement)(_tooltip.default, {
     text: label

package/build/box-control/linked-button.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/box-control/linked-button.js"],"names":["LinkedButton","isLinked","props","label","link","linkOff"],"mappings":";;;;;;;;;;;;;AAGA;;AACA;;AAKA;;AACA;;AAVA;AACA;AACA;;AAIA;AACA;AACA;AAIe,SAASA,YAAT,CAAuB;AAAEC,EAAAA,QAAF;AAAY,KAAGC;AAAf,CAAvB,EAAgD;AAC9D,QAAMC,KAAK,GAAGF,QAAQ,GAAG,cAAI,cAAJ,CAAH,GAA0B,cAAI,YAAJ,CAAhD;AAEA,SACC,4BAAC,gBAAD;AAAS,IAAA,IAAI,EAAGE;AAAhB,KACC,0CACC,4BAAC,eAAD,6BACMD,KADN;AAEC,IAAA,SAAS,EAAC,sCAFX;AAGC,IAAA,OAAO,EAAGD,QAAQ,GAAG,SAAH,GAAe,WAHlC;AAIC,IAAA,OAAO,MAJR;AAKC,IAAA,IAAI,EAAGA,QAAQ,GAAGG,WAAH,GAAUC,cAL1B;AAMC,IAAA,QAAQ,EAAG,EANZ;AAOC,kBAAaF;AAPd,KADD,CADD,CADD;AAeA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { link, linkOff } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Tooltip from '../tooltip';\n\nexport default function LinkedButton( { isLinked, ...props } ) {\n\tconst label = isLinked ? __( 'Unlink Sides' ) : __( 'Link Sides' );\n\n\treturn (\n\t\t<Tooltip text={ label }>\n\t\t\t<span>\n\t\t\t\t<Button\n\t\t\t\t\t{ ...props }\n\t\t\t\t\tclassName=\"component-box-control__linked-button\"\n\t\t\t\t\tvariant={ isLinked ? 'primary' : 'secondary' }\n\t\t\t\t\tisSmall\n\t\t\t\t\ticon={ isLinked ? link : linkOff }\n\t\t\t\t\ticonSize={ 16 }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t/>\n\t\t\t</span>\n\t\t</Tooltip>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/box-control/linked-button.js"],"names":["LinkedButton","isLinked","props","label","link","linkOff"],"mappings":";;;;;;;;;;;;;AAGA;;AACA;;AAKA;;AACA;;AAVA;AACA;AACA;;AAIA;AACA;AACA;AAIe,SAASA,YAAT,OAAgD;AAAA,MAAzB;AAAEC,IAAAA,QAAF;AAAY,OAAGC;AAAf,GAAyB;AAC9D,QAAMC,KAAK,GAAGF,QAAQ,GAAG,cAAI,cAAJ,CAAH,GAA0B,cAAI,YAAJ,CAAhD;AAEA,SACC,4BAAC,gBAAD;AAAS,IAAA,IAAI,EAAGE;AAAhB,KACC,0CACC,4BAAC,eAAD,6BACMD,KADN;AAEC,IAAA,SAAS,EAAC,sCAFX;AAGC,IAAA,OAAO,EAAGD,QAAQ,GAAG,SAAH,GAAe,WAHlC;AAIC,IAAA,OAAO,MAJR;AAKC,IAAA,IAAI,EAAGA,QAAQ,GAAGG,WAAH,GAAUC,cAL1B;AAMC,IAAA,QAAQ,EAAG,EANZ;AAOC,kBAAaF;AAPd,KADD,CADD,CADD;AAeA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { link, linkOff } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Tooltip from '../tooltip';\n\nexport default function LinkedButton( { isLinked, ...props } ) {\n\tconst label = isLinked ? __( 'Unlink Sides' ) : __( 'Link Sides' );\n\n\treturn (\n\t\t<Tooltip text={ label }>\n\t\t\t<span>\n\t\t\t\t<Button\n\t\t\t\t\t{ ...props }\n\t\t\t\t\tclassName=\"component-box-control__linked-button\"\n\t\t\t\t\tvariant={ isLinked ? 'primary' : 'secondary' }\n\t\t\t\t\tisSmall\n\t\t\t\t\ticon={ isLinked ? link : linkOff }\n\t\t\t\t\ticonSize={ 16 }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t/>\n\t\t\t</span>\n\t\t</Tooltip>\n\t);\n}\n"]}

package/build/box-control/styles/box-control-icon-styles.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.LeftStroke = exports.BottomStroke = exports.RightStroke = exports.TopStroke = exports.Viewbox = exports.Root = void 0;
+exports.Viewbox = exports.TopStroke = exports.Root = exports.RightStroke = exports.LeftStroke = exports.BottomStroke = void 0;
 
 var _base = _interopRequireDefault(require("@emotion/styled/base"));
 
@@ -44,9 +44,10 @@ const Viewbox = (0, _base.default)("span", process.env.NODE_ENV === "production"
 });
 exports.Viewbox = Viewbox;
 
-const strokeFocus = ({
-  isFocused
-}) => {
+const strokeFocus = _ref => {
+  let {
+    isFocused
+  } = _ref;
   return /*#__PURE__*/(0, _react.css)({
     backgroundColor: 'currentColor',
     opacity: isFocused ? 1 : 0.3

package/build/box-control/styles/box-control-icon-styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/box-control/styles/box-control-icon-styles.js"],"names":["Root","Viewbox","strokeFocus","isFocused","backgroundColor","opacity","Stroke","VerticalStroke","HorizontalStroke","TopStroke","RightStroke","BottomStroke","LeftStroke"],"mappings":";;;;;;;;;;;AAGA;;;;AAGO,MAAMA,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAV;;AASA,MAAMC,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAb;;;AAQP,MAAMC,WAAW,GAAG,CAAE;AAAEC,EAAAA;AAAF,CAAF,KAAqB;AACxC,sBAAO,gBAAK;AACXC,IAAAA,eAAe,EAAE,cADN;AAEXC,IAAAA,OAAO,EAAEF,SAAS,GAAG,CAAH,GAAO;AAFd,GAAL,yiEAAP;AAIA,CALD;;AAOA,MAAMG,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,iFAKRJ,WALQ,6+DAAZ;AAQA,MAAMK,cAAc,GAAG,iCAAQD,MAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAApB;AAMA,MAAME,gBAAgB,GAAG,iCAAQF,MAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAtB;AAMO,MAAMG,SAAS,GAAG,iCAAQD,gBAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAf;;AAIA,MAAME,WAAW,GAAG,iCAAQH,cAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAjB;;AAIA,MAAMI,YAAY,GAAG,iCAAQH,gBAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;;AAIA,MAAMI,UAAU,GAAG,iCAAQL,cAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAhB","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\nexport const Root = styled.span`\n\tbox-sizing: border-box;\n\tdisplay: block;\n\twidth: 24px;\n\theight: 24px;\n\tposition: relative;\n\tpadding: 4px;\n`;\n\nexport const Viewbox = styled.span`\n\tbox-sizing: border-box;\n\tdisplay: block;\n\tposition: relative;\n\twidth: 100%;\n\theight: 100%;\n`;\n\nconst strokeFocus = ( { isFocused } ) => {\n\treturn css( {\n\t\tbackgroundColor: 'currentColor',\n\t\topacity: isFocused ? 1 : 0.3,\n\t} );\n};\n\nconst Stroke = styled.span`\n\tbox-sizing: border-box;\n\tdisplay: block;\n\tpointer-events: none;\n\tposition: absolute;\n\t${ strokeFocus };\n`;\n\nconst VerticalStroke = styled( Stroke )`\n\tbottom: 3px;\n\ttop: 3px;\n\twidth: 2px;\n`;\n\nconst HorizontalStroke = styled( Stroke )`\n\theight: 2px;\n\tleft: 3px;\n\tright: 3px;\n`;\n\nexport const TopStroke = styled( HorizontalStroke )`\n\ttop: 0;\n`;\n\nexport const RightStroke = styled( VerticalStroke )`\n\tright: 0;\n`;\n\nexport const BottomStroke = styled( HorizontalStroke )`\n\tbottom: 0;\n`;\n\nexport const LeftStroke = styled( VerticalStroke )`\n\tleft: 0;\n`;\n"]}
+{"version":3,"sources":["@wordpress/components/src/box-control/styles/box-control-icon-styles.js"],"names":["Root","Viewbox","strokeFocus","isFocused","backgroundColor","opacity","Stroke","VerticalStroke","HorizontalStroke","TopStroke","RightStroke","BottomStroke","LeftStroke"],"mappings":";;;;;;;;;;;AAGA;;;;AAGO,MAAMA,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAV;;AASA,MAAMC,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAb;;;AAQP,MAAMC,WAAW,GAAG,QAAqB;AAAA,MAAnB;AAAEC,IAAAA;AAAF,GAAmB;AACxC,sBAAO,gBAAK;AACXC,IAAAA,eAAe,EAAE,cADN;AAEXC,IAAAA,OAAO,EAAEF,SAAS,GAAG,CAAH,GAAO;AAFd,GAAL,yiEAAP;AAIA,CALD;;AAOA,MAAMG,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,iFAKRJ,WALQ,6+DAAZ;AAQA,MAAMK,cAAc,GAAG,iCAAQD,MAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAApB;AAMA,MAAME,gBAAgB,GAAG,iCAAQF,MAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAtB;AAMO,MAAMG,SAAS,GAAG,iCAAQD,gBAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAf;;AAIA,MAAME,WAAW,GAAG,iCAAQH,cAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAjB;;AAIA,MAAMI,YAAY,GAAG,iCAAQH,gBAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;;AAIA,MAAMI,UAAU,GAAG,iCAAQL,cAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAhB","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\nexport const Root = styled.span`\n\tbox-sizing: border-box;\n\tdisplay: block;\n\twidth: 24px;\n\theight: 24px;\n\tposition: relative;\n\tpadding: 4px;\n`;\n\nexport const Viewbox = styled.span`\n\tbox-sizing: border-box;\n\tdisplay: block;\n\tposition: relative;\n\twidth: 100%;\n\theight: 100%;\n`;\n\nconst strokeFocus = ( { isFocused } ) => {\n\treturn css( {\n\t\tbackgroundColor: 'currentColor',\n\t\topacity: isFocused ? 1 : 0.3,\n\t} );\n};\n\nconst Stroke = styled.span`\n\tbox-sizing: border-box;\n\tdisplay: block;\n\tpointer-events: none;\n\tposition: absolute;\n\t${ strokeFocus };\n`;\n\nconst VerticalStroke = styled( Stroke )`\n\tbottom: 3px;\n\ttop: 3px;\n\twidth: 2px;\n`;\n\nconst HorizontalStroke = styled( Stroke )`\n\theight: 2px;\n\tleft: 3px;\n\tright: 3px;\n`;\n\nexport const TopStroke = styled( HorizontalStroke )`\n\ttop: 0;\n`;\n\nexport const RightStroke = styled( VerticalStroke )`\n\tright: 0;\n`;\n\nexport const BottomStroke = styled( HorizontalStroke )`\n\tbottom: 0;\n`;\n\nexport const LeftStroke = styled( VerticalStroke )`\n\tleft: 0;\n`;\n"]}

package/build/box-control/styles/box-control-styles.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.UnitControl = exports.Layout = exports.LayoutContainer = exports.UnitControlWrapper = exports.HeaderControlWrapper = exports.Header = exports.Root = void 0;
+exports.UnitControlWrapper = exports.UnitControl = exports.Root = exports.LayoutContainer = exports.Layout = exports.HeaderControlWrapper = exports.Header = void 0;
 
 var _base = _interopRequireDefault(require("@emotion/styled/base"));
 
@@ -122,11 +122,13 @@ var _ref2 = process.env.NODE_ENV === "production" ? {
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
 
-const unitControlBorderRadiusStyles = ({
-  isFirst,
-  isLast,
-  isOnly
-}) => {
+const unitControlBorderRadiusStyles = _ref3 => {
+  let {
+    isFirst,
+    isLast,
+    isOnly
+  } = _ref3;
+
   if (isFirst) {
     return (0, _utils.rtl)({
       borderTopRightRadius: 0,
@@ -148,10 +150,11 @@ const unitControlBorderRadiusStyles = ({
   return _ref;
 };
 
-const unitControlMarginStyles = ({
-  isFirst,
-  isOnly
-}) => {
+const unitControlMarginStyles = _ref4 => {
+  let {
+    isFirst,
+    isOnly
+  } = _ref4;
   const marginLeft = isFirst || isOnly ? 0 : -1;
   return (0, _utils.rtl)({
     marginLeft

package/build/box-control/styles/box-control-styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/box-control/styles/box-control-styles.js"],"names":["Root","Header","Flex","COLORS","ui","label","HeaderControlWrapper","UnitControlWrapper","LayoutContainer","Layout","unitControlBorderRadiusStyles","isFirst","isLast","isOnly","borderTopRightRadius","borderBottomRightRadius","borderTopLeftRadius","borderBottomLeftRadius","unitControlMarginStyles","marginLeft","UnitControl","BaseUnitControl"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;AAEO,MAAMA,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAV;;AAOA,MAAMC,MAAM,GAAG,iCAAQC,UAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,WACRC,cAAOC,EAAP,CAAUC,KADF,wkFAAZ;;AAKA,MAAMC,oBAAoB,GAAG,iCAAQJ,UAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA1B;;AAKA,MAAMK,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAxB;;AAKA,MAAMC,eAAe,GAAG,iCAAQN,UAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAArB;;AAKA,MAAMO,MAAM,GAAG,iCAAQP,UAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAZ;;;;;;;;;;;;;;;;;;;;;;;AAOP,MAAMQ,6BAA6B,GAAG,CAAE;AAAEC,EAAAA,OAAF;AAAWC,EAAAA,MAAX;AAAmBC,EAAAA;AAAnB,CAAF,KAAmC;AACxE,MAAKF,OAAL,EAAe;AACd,WAAO,gBAAK;AAAEG,MAAAA,oBAAoB,EAAE,CAAxB;AAA2BC,MAAAA,uBAAuB,EAAE;AAApD,KAAL,GAAP;AACA;;AACD,MAAKH,MAAL,EAAc;AACb,WAAO,gBAAK;AAAEI,MAAAA,mBAAmB,EAAE,CAAvB;AAA0BC,MAAAA,sBAAsB,EAAE;AAAlD,KAAL,GAAP;AACA;;AACD,MAAKJ,MAAL,EAAc;AACb;AACA;;AAED;AAGA,CAdD;;AAgBA,MAAMK,uBAAuB,GAAG,CAAE;AAAEP,EAAAA,OAAF;AAAWE,EAAAA;AAAX,CAAF,KAA2B;AAC1D,QAAMM,UAAU,GAAGR,OAAO,IAAIE,MAAX,GAAoB,CAApB,GAAwB,CAAC,CAA5C;AAEA,SAAO,gBAAK;AAAEM,IAAAA;AAAF,GAAL,GAAP;AACA,CAJD;;AAMO,MAAMC,WAAW,GAAG,iCAAQC,oBAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,oBAEpBX,6BAFoB,OAGpBQ,uBAHoB,qjFAAjB","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n/**\n * Internal dependencies\n */\nimport { Flex } from '../../flex';\nimport BaseUnitControl from '../../unit-control';\nimport { COLORS, rtl } from '../../utils';\n\nexport const Root = styled.div`\n\tbox-sizing: border-box;\n\tmax-width: 235px;\n\tpadding-bottom: 12px;\n\twidth: 100%;\n`;\n\nexport const Header = styled( Flex )`\n\tcolor: ${ COLORS.ui.label };\n\tpadding-bottom: 8px;\n`;\n\nexport const HeaderControlWrapper = styled( Flex )`\n\tmin-height: 30px;\n\tgap: 0;\n`;\n\nexport const UnitControlWrapper = styled.div`\n\tbox-sizing: border-box;\n\tmax-width: 80px;\n`;\n\nexport const LayoutContainer = styled( Flex )`\n\tjustify-content: center;\n\tpadding-top: 8px;\n`;\n\nexport const Layout = styled( Flex )`\n\tposition: relative;\n\theight: 100%;\n\twidth: 100%;\n\tjustify-content: flex-start;\n`;\n\nconst unitControlBorderRadiusStyles = ( { isFirst, isLast, isOnly } ) => {\n\tif ( isFirst ) {\n\t\treturn rtl( { borderTopRightRadius: 0, borderBottomRightRadius: 0 } )();\n\t}\n\tif ( isLast ) {\n\t\treturn rtl( { borderTopLeftRadius: 0, borderBottomLeftRadius: 0 } )();\n\t}\n\tif ( isOnly ) {\n\t\treturn css( { borderRadius: 2 } );\n\t}\n\n\treturn css( {\n\t\tborderRadius: 0,\n\t} );\n};\n\nconst unitControlMarginStyles = ( { isFirst, isOnly } ) => {\n\tconst marginLeft = isFirst || isOnly ? 0 : -1;\n\n\treturn rtl( { marginLeft } )();\n};\n\nexport const UnitControl = styled( BaseUnitControl )`\n\tmax-width: 60px;\n\t${ unitControlBorderRadiusStyles };\n\t${ unitControlMarginStyles };\n`;\n"]}
+{"version":3,"sources":["@wordpress/components/src/box-control/styles/box-control-styles.js"],"names":["Root","Header","Flex","COLORS","ui","label","HeaderControlWrapper","UnitControlWrapper","LayoutContainer","Layout","unitControlBorderRadiusStyles","isFirst","isLast","isOnly","borderTopRightRadius","borderBottomRightRadius","borderTopLeftRadius","borderBottomLeftRadius","unitControlMarginStyles","marginLeft","UnitControl","BaseUnitControl"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;AAEO,MAAMA,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAV;;AAOA,MAAMC,MAAM,GAAG,iCAAQC,UAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,WACRC,cAAOC,EAAP,CAAUC,KADF,wkFAAZ;;AAKA,MAAMC,oBAAoB,GAAG,iCAAQJ,UAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA1B;;AAKA,MAAMK,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAxB;;AAKA,MAAMC,eAAe,GAAG,iCAAQN,UAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAArB;;AAKA,MAAMO,MAAM,GAAG,iCAAQP,UAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAZ;;;;;;;;;;;;;;;;;;;;;;;AAOP,MAAMQ,6BAA6B,GAAG,SAAmC;AAAA,MAAjC;AAAEC,IAAAA,OAAF;AAAWC,IAAAA,MAAX;AAAmBC,IAAAA;AAAnB,GAAiC;;AACxE,MAAKF,OAAL,EAAe;AACd,WAAO,gBAAK;AAAEG,MAAAA,oBAAoB,EAAE,CAAxB;AAA2BC,MAAAA,uBAAuB,EAAE;AAApD,KAAL,GAAP;AACA;;AACD,MAAKH,MAAL,EAAc;AACb,WAAO,gBAAK;AAAEI,MAAAA,mBAAmB,EAAE,CAAvB;AAA0BC,MAAAA,sBAAsB,EAAE;AAAlD,KAAL,GAAP;AACA;;AACD,MAAKJ,MAAL,EAAc;AACb;AACA;;AAED;AAGA,CAdD;;AAgBA,MAAMK,uBAAuB,GAAG,SAA2B;AAAA,MAAzB;AAAEP,IAAAA,OAAF;AAAWE,IAAAA;AAAX,GAAyB;AAC1D,QAAMM,UAAU,GAAGR,OAAO,IAAIE,MAAX,GAAoB,CAApB,GAAwB,CAAC,CAA5C;AAEA,SAAO,gBAAK;AAAEM,IAAAA;AAAF,GAAL,GAAP;AACA,CAJD;;AAMO,MAAMC,WAAW,GAAG,iCAAQC,oBAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,oBAEpBX,6BAFoB,OAGpBQ,uBAHoB,qjFAAjB","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n/**\n * Internal dependencies\n */\nimport { Flex } from '../../flex';\nimport BaseUnitControl from '../../unit-control';\nimport { COLORS, rtl } from '../../utils';\n\nexport const Root = styled.div`\n\tbox-sizing: border-box;\n\tmax-width: 235px;\n\tpadding-bottom: 12px;\n\twidth: 100%;\n`;\n\nexport const Header = styled( Flex )`\n\tcolor: ${ COLORS.ui.label };\n\tpadding-bottom: 8px;\n`;\n\nexport const HeaderControlWrapper = styled( Flex )`\n\tmin-height: 30px;\n\tgap: 0;\n`;\n\nexport const UnitControlWrapper = styled.div`\n\tbox-sizing: border-box;\n\tmax-width: 80px;\n`;\n\nexport const LayoutContainer = styled( Flex )`\n\tjustify-content: center;\n\tpadding-top: 8px;\n`;\n\nexport const Layout = styled( Flex )`\n\tposition: relative;\n\theight: 100%;\n\twidth: 100%;\n\tjustify-content: flex-start;\n`;\n\nconst unitControlBorderRadiusStyles = ( { isFirst, isLast, isOnly } ) => {\n\tif ( isFirst ) {\n\t\treturn rtl( { borderTopRightRadius: 0, borderBottomRightRadius: 0 } )();\n\t}\n\tif ( isLast ) {\n\t\treturn rtl( { borderTopLeftRadius: 0, borderBottomLeftRadius: 0 } )();\n\t}\n\tif ( isOnly ) {\n\t\treturn css( { borderRadius: 2 } );\n\t}\n\n\treturn css( {\n\t\tborderRadius: 0,\n\t} );\n};\n\nconst unitControlMarginStyles = ( { isFirst, isOnly } ) => {\n\tconst marginLeft = isFirst || isOnly ? 0 : -1;\n\n\treturn rtl( { marginLeft } )();\n};\n\nexport const UnitControl = styled( BaseUnitControl )`\n\tmax-width: 60px;\n\t${ unitControlBorderRadiusStyles };\n\t${ unitControlMarginStyles };\n`;\n"]}

package/build/box-control/styles/box-control-visualizer-styles.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.LeftView = exports.BottomView = exports.RightView = exports.TopView = exports.Side = exports.Container = void 0;
+exports.TopView = exports.Side = exports.RightView = exports.LeftView = exports.Container = exports.BottomView = void 0;
 
 var _base = _interopRequireDefault(require("@emotion/styled/base"));
 
@@ -25,9 +25,10 @@ var _ref = process.env.NODE_ENV === "production" ? {
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
 
-const containerPositionStyles = ({
-  isPositionAbsolute
-}) => {
+const containerPositionStyles = _ref2 => {
+  let {
+    isPositionAbsolute
+  } = _ref2;
   if (!isPositionAbsolute) return '';
   return _ref;
 };
@@ -44,11 +45,14 @@ const Side = (0, _base.default)("div", process.env.NODE_ENV === "production" ? {
 } : {
   target: "e1df9b4q4",
   label: "Side"
-})("box-sizing:border-box;background:", _utils.COLORS.blue.wordpress[700], ";background:", _utils.COLORS.ui.theme, ";filter:brightness( 1 );opacity:0;position:absolute;pointer-events:none;transition:opacity 120ms linear;z-index:1;", ({
-  isActive
-}) => isActive && `
+})("box-sizing:border-box;background:", _utils.COLORS.blue.wordpress[700], ";background:", _utils.COLORS.ui.theme, ";filter:brightness( 1 );opacity:0;position:absolute;pointer-events:none;transition:opacity 120ms linear;z-index:1;", _ref3 => {
+  let {
+    isActive
+  } = _ref3;
+  return isActive && `
 		opacity: 0.3;
-	`, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYm94LWNvbnRyb2wvc3R5bGVzL2JveC1jb250cm9sLXZpc3VhbGl6ZXItc3R5bGVzLmpzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQStCOEIiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9ib3gtY29udHJvbC9zdHlsZXMvYm94LWNvbnRyb2wtdmlzdWFsaXplci1zdHlsZXMuanMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IENPTE9SUywgcnRsIH0gZnJvbSAnLi4vLi4vdXRpbHMnO1xuXG5jb25zdCBjb250YWluZXJQb3NpdGlvblN0eWxlcyA9ICggeyBpc1Bvc2l0aW9uQWJzb2x1dGUgfSApID0+IHtcblx0aWYgKCAhIGlzUG9zaXRpb25BYnNvbHV0ZSApIHJldHVybiAnJztcblxuXHRyZXR1cm4gY3NzYFxuXHRcdGJvdHRvbTogMDtcblx0XHRsZWZ0OiAwO1xuXHRcdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHRcdHBvc2l0aW9uOiBhYnNvbHV0ZTtcblx0XHRyaWdodDogMDtcblx0XHR0b3A6IDA7XG5cdFx0ei1pbmRleDogMTtcblx0YDtcbn07XG5cbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdCR7IGNvbnRhaW5lclBvc2l0aW9uU3R5bGVzIH07XG5gO1xuXG5leHBvcnQgY29uc3QgU2lkZSA9IHN0eWxlZC5kaXZgXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGJhY2tncm91bmQ6ICR7IENPTE9SUy5ibHVlLndvcmRwcmVzc1sgNzAwIF0gfTtcblx0YmFja2dyb3VuZDogJHsgQ09MT1JTLnVpLnRoZW1lIH07XG5cdGZpbHRlcjogYnJpZ2h0bmVzcyggMSApO1xuXHRvcGFjaXR5OiAwO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHR0cmFuc2l0aW9uOiBvcGFjaXR5IDEyMG1zIGxpbmVhcjtcblx0ei1pbmRleDogMTtcblxuXHQkeyAoIHsgaXNBY3RpdmUgfSApID0+XG5cdFx0aXNBY3RpdmUgJiZcblx0XHRgXG5cdFx0b3BhY2l0eTogMC4zO1xuXHRgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBUb3BWaWV3ID0gc3R5bGVkKCBTaWRlIClgXG5cdHRvcDogMDtcblx0bGVmdDogMDtcblx0cmlnaHQ6IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgUmlnaHRWaWV3ID0gc3R5bGVkKCBTaWRlIClgXG5cdHRvcDogMDtcblx0Ym90dG9tOiAwO1xuXHQkeyBydGwoIHsgcmlnaHQ6IDAgfSApIH07XG5gO1xuXG5leHBvcnQgY29uc3QgQm90dG9tVmlldyA9IHN0eWxlZCggU2lkZSApYFxuXHRib3R0b206IDA7XG5cdGxlZnQ6IDA7XG5cdHJpZ2h0OiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IExlZnRWaWV3ID0gc3R5bGVkKCBTaWRlIClgXG5cdHRvcDogMDtcblx0Ym90dG9tOiAwO1xuXHQkeyBydGwoIHsgbGVmdDogMCB9ICkgfTtcbmA7XG4iXX0= */"));
+	`;
+}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYm94LWNvbnRyb2wvc3R5bGVzL2JveC1jb250cm9sLXZpc3VhbGl6ZXItc3R5bGVzLmpzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQStCOEIiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9ib3gtY29udHJvbC9zdHlsZXMvYm94LWNvbnRyb2wtdmlzdWFsaXplci1zdHlsZXMuanMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IENPTE9SUywgcnRsIH0gZnJvbSAnLi4vLi4vdXRpbHMnO1xuXG5jb25zdCBjb250YWluZXJQb3NpdGlvblN0eWxlcyA9ICggeyBpc1Bvc2l0aW9uQWJzb2x1dGUgfSApID0+IHtcblx0aWYgKCAhIGlzUG9zaXRpb25BYnNvbHV0ZSApIHJldHVybiAnJztcblxuXHRyZXR1cm4gY3NzYFxuXHRcdGJvdHRvbTogMDtcblx0XHRsZWZ0OiAwO1xuXHRcdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHRcdHBvc2l0aW9uOiBhYnNvbHV0ZTtcblx0XHRyaWdodDogMDtcblx0XHR0b3A6IDA7XG5cdFx0ei1pbmRleDogMTtcblx0YDtcbn07XG5cbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdCR7IGNvbnRhaW5lclBvc2l0aW9uU3R5bGVzIH07XG5gO1xuXG5leHBvcnQgY29uc3QgU2lkZSA9IHN0eWxlZC5kaXZgXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGJhY2tncm91bmQ6ICR7IENPTE9SUy5ibHVlLndvcmRwcmVzc1sgNzAwIF0gfTtcblx0YmFja2dyb3VuZDogJHsgQ09MT1JTLnVpLnRoZW1lIH07XG5cdGZpbHRlcjogYnJpZ2h0bmVzcyggMSApO1xuXHRvcGFjaXR5OiAwO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHR0cmFuc2l0aW9uOiBvcGFjaXR5IDEyMG1zIGxpbmVhcjtcblx0ei1pbmRleDogMTtcblxuXHQkeyAoIHsgaXNBY3RpdmUgfSApID0+XG5cdFx0aXNBY3RpdmUgJiZcblx0XHRgXG5cdFx0b3BhY2l0eTogMC4zO1xuXHRgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBUb3BWaWV3ID0gc3R5bGVkKCBTaWRlIClgXG5cdHRvcDogMDtcblx0bGVmdDogMDtcblx0cmlnaHQ6IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgUmlnaHRWaWV3ID0gc3R5bGVkKCBTaWRlIClgXG5cdHRvcDogMDtcblx0Ym90dG9tOiAwO1xuXHQkeyBydGwoIHsgcmlnaHQ6IDAgfSApIH07XG5gO1xuXG5leHBvcnQgY29uc3QgQm90dG9tVmlldyA9IHN0eWxlZCggU2lkZSApYFxuXHRib3R0b206IDA7XG5cdGxlZnQ6IDA7XG5cdHJpZ2h0OiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IExlZnRWaWV3ID0gc3R5bGVkKCBTaWRlIClgXG5cdHRvcDogMDtcblx0Ym90dG9tOiAwO1xuXHQkeyBydGwoIHsgbGVmdDogMCB9ICkgfTtcbmA7XG4iXX0= */"));
 exports.Side = Side;
 const TopView = ( /*#__PURE__*/0, _base.default)(Side, process.env.NODE_ENV === "production" ? {
   target: "e1df9b4q3"

package/build/box-control/styles/box-control-visualizer-styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/box-control/styles/box-control-visualizer-styles.js"],"names":["containerPositionStyles","isPositionAbsolute","Container","Side","COLORS","blue","wordpress","ui","theme","isActive","TopView","RightView","right","BottomView","LeftView","left"],"mappings":";;;;;;;;;;;AAGA;;AAMA;;;;;;;;;;;;;;AAEA,MAAMA,uBAAuB,GAAG,CAAE;AAAEC,EAAAA;AAAF,CAAF,KAA8B;AAC7D,MAAK,CAAEA,kBAAP,EAA4B,OAAO,EAAP;AAE5B;AASA,CAZD;;AAcO,MAAMC,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA,+CAGlBF,uBAHkB,qrEAAf;;AAMA,MAAMG,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA,wCAEDC,cAAOC,IAAP,CAAYC,SAAZ,CAAuB,GAAvB,CAFC,kBAGDF,cAAOG,EAAP,CAAUC,KAHT,wHAWb,CAAE;AAAEC,EAAAA;AAAF,CAAF,KACFA,QAAQ,IACP;AACH;AACA,EAfiB,qrEAAV;;AAkBA,MAAMC,OAAO,GAAG,iCAAQP,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAb;;AAMA,MAAMQ,SAAS,GAAG,iCAAQR,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,oBAGlB,gBAAK;AAAES,EAAAA,KAAK,EAAE;AAAT,CAAL,CAHkB,qrEAAf;;AAMA,MAAMC,UAAU,GAAG,iCAAQV,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAhB;;AAMA,MAAMW,QAAQ,GAAG,iCAAQX,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,oBAGjB,gBAAK;AAAEY,EAAAA,IAAI,EAAE;AAAR,CAAL,CAHiB,qrEAAd","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, rtl } from '../../utils';\n\nconst containerPositionStyles = ( { isPositionAbsolute } ) => {\n\tif ( ! isPositionAbsolute ) return '';\n\n\treturn css`\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\tpointer-events: none;\n\t\tposition: absolute;\n\t\tright: 0;\n\t\ttop: 0;\n\t\tz-index: 1;\n\t`;\n};\n\nexport const Container = styled.div`\n\tbox-sizing: border-box;\n\tposition: relative;\n\t${ containerPositionStyles };\n`;\n\nexport const Side = styled.div`\n\tbox-sizing: border-box;\n\tbackground: ${ COLORS.blue.wordpress[ 700 ] };\n\tbackground: ${ COLORS.ui.theme };\n\tfilter: brightness( 1 );\n\topacity: 0;\n\tposition: absolute;\n\tpointer-events: none;\n\ttransition: opacity 120ms linear;\n\tz-index: 1;\n\n\t${ ( { isActive } ) =>\n\t\tisActive &&\n\t\t`\n\t\topacity: 0.3;\n\t` }\n`;\n\nexport const TopView = styled( Side )`\n\ttop: 0;\n\tleft: 0;\n\tright: 0;\n`;\n\nexport const RightView = styled( Side )`\n\ttop: 0;\n\tbottom: 0;\n\t${ rtl( { right: 0 } ) };\n`;\n\nexport const BottomView = styled( Side )`\n\tbottom: 0;\n\tleft: 0;\n\tright: 0;\n`;\n\nexport const LeftView = styled( Side )`\n\ttop: 0;\n\tbottom: 0;\n\t${ rtl( { left: 0 } ) };\n`;\n"]}
+{"version":3,"sources":["@wordpress/components/src/box-control/styles/box-control-visualizer-styles.js"],"names":["containerPositionStyles","isPositionAbsolute","Container","Side","COLORS","blue","wordpress","ui","theme","isActive","TopView","RightView","right","BottomView","LeftView","left"],"mappings":";;;;;;;;;;;AAGA;;AAMA;;;;;;;;;;;;;;AAEA,MAAMA,uBAAuB,GAAG,SAA8B;AAAA,MAA5B;AAAEC,IAAAA;AAAF,GAA4B;AAC7D,MAAK,CAAEA,kBAAP,EAA4B,OAAO,EAAP;AAE5B;AASA,CAZD;;AAcO,MAAMC,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA,+CAGlBF,uBAHkB,qrEAAf;;AAMA,MAAMG,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA,wCAEDC,cAAOC,IAAP,CAAYC,SAAZ,CAAuB,GAAvB,CAFC,kBAGDF,cAAOG,EAAP,CAAUC,KAHT,wHAWb;AAAA,MAAE;AAAEC,IAAAA;AAAF,GAAF;AAAA,SACFA,QAAQ,IACP;AACH;AACA,EAJI;AAAA,CAXa,qrEAAV;;AAkBA,MAAMC,OAAO,GAAG,iCAAQP,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAb;;AAMA,MAAMQ,SAAS,GAAG,iCAAQR,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,oBAGlB,gBAAK;AAAES,EAAAA,KAAK,EAAE;AAAT,CAAL,CAHkB,qrEAAf;;AAMA,MAAMC,UAAU,GAAG,iCAAQV,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAhB;;AAMA,MAAMW,QAAQ,GAAG,iCAAQX,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,oBAGjB,gBAAK;AAAEY,EAAAA,IAAI,EAAE;AAAR,CAAL,CAHiB,qrEAAd","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, rtl } from '../../utils';\n\nconst containerPositionStyles = ( { isPositionAbsolute } ) => {\n\tif ( ! isPositionAbsolute ) return '';\n\n\treturn css`\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\tpointer-events: none;\n\t\tposition: absolute;\n\t\tright: 0;\n\t\ttop: 0;\n\t\tz-index: 1;\n\t`;\n};\n\nexport const Container = styled.div`\n\tbox-sizing: border-box;\n\tposition: relative;\n\t${ containerPositionStyles };\n`;\n\nexport const Side = styled.div`\n\tbox-sizing: border-box;\n\tbackground: ${ COLORS.blue.wordpress[ 700 ] };\n\tbackground: ${ COLORS.ui.theme };\n\tfilter: brightness( 1 );\n\topacity: 0;\n\tposition: absolute;\n\tpointer-events: none;\n\ttransition: opacity 120ms linear;\n\tz-index: 1;\n\n\t${ ( { isActive } ) =>\n\t\tisActive &&\n\t\t`\n\t\topacity: 0.3;\n\t` }\n`;\n\nexport const TopView = styled( Side )`\n\ttop: 0;\n\tleft: 0;\n\tright: 0;\n`;\n\nexport const RightView = styled( Side )`\n\ttop: 0;\n\tbottom: 0;\n\t${ rtl( { right: 0 } ) };\n`;\n\nexport const BottomView = styled( Side )`\n\tbottom: 0;\n\tleft: 0;\n\tright: 0;\n`;\n\nexport const LeftView = styled( Side )`\n\ttop: 0;\n\tbottom: 0;\n\t${ rtl( { left: 0 } ) };\n`;\n"]}

package/build/box-control/unit-control.js

@@ -26,20 +26,23 @@ var _boxControlStyles = require("./styles/box-control-styles");
 /**
  * Internal dependencies
  */
-function BoxUnitControl({
-  isFirst,
-  isLast,
-  isOnly,
-  onHoverOn = _lodash.noop,
-  onHoverOff = _lodash.noop,
-  label,
-  value,
-  ...props
-}) {
-  const bindHoverGesture = (0, _reactUseGesture.useHover)(({
-    event,
-    ...state
-  }) => {
+function BoxUnitControl(_ref) {
+  let {
+    isFirst,
+    isLast,
+    isOnly,
+    onHoverOn = _lodash.noop,
+    onHoverOff = _lodash.noop,
+    label,
+    value,
+    ...props
+  } = _ref;
+  const bindHoverGesture = (0, _reactUseGesture.useHover)(_ref2 => {
+    let {
+      event,
+      ...state
+    } = _ref2;
+
     if (state.hovering) {
       onHoverOn(event, state);
     } else {
@@ -61,10 +64,11 @@ function BoxUnitControl({
   }, props))));
 }
 
-function Tooltip({
-  children,
-  text
-}) {
+function Tooltip(_ref3) {
+  let {
+    children,
+    text
+  } = _ref3;
   if (!text) return children;
   /**
    * Wrapping the children in a `<div />` as Tooltip as it attempts

package/build/box-control/unit-control.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/box-control/unit-control.js"],"names":["BoxUnitControl","isFirst","isLast","isOnly","onHoverOn","noop","onHoverOff","label","value","props","bindHoverGesture","event","state","hovering","Tooltip","children","text"],"mappings":";;;;;;;;;;;;;AAGA;;AACA;;AAKA;;AACA;;AAVA;AACA;AACA;;AAIA;AACA;AACA;AAIe,SAASA,cAAT,CAAyB;AACvCC,EAAAA,OADuC;AAEvCC,EAAAA,MAFuC;AAGvCC,EAAAA,MAHuC;AAIvCC,EAAAA,SAAS,GAAGC,YAJ2B;AAKvCC,EAAAA,UAAU,GAAGD,YAL0B;AAMvCE,EAAAA,KANuC;AAOvCC,EAAAA,KAPuC;AAQvC,KAAGC;AARoC,CAAzB,EASX;AACH,QAAMC,gBAAgB,GAAG,+BAAU,CAAE;AAAEC,IAAAA,KAAF;AAAS,OAAGC;AAAZ,GAAF,KAA2B;AAC7D,QAAKA,KAAK,CAACC,QAAX,EAAsB;AACrBT,MAAAA,SAAS,CAAEO,KAAF,EAASC,KAAT,CAAT;AACA,KAFD,MAEO;AACNN,MAAAA,UAAU,CAAEK,KAAF,EAASC,KAAT,CAAV;AACA;AACD,GANwB,CAAzB;AAQA,SACC,4BAAC,oCAAD,EAAyBF,gBAAgB,EAAzC,EACC,4BAAC,OAAD;AAAS,IAAA,IAAI,EAAGH;AAAhB,KACC,4BAAC,6BAAD;AACC,kBAAaA,KADd;AAEC,IAAA,SAAS,EAAC,qCAFX;AAGC,IAAA,cAAc,MAHf;AAIC,IAAA,OAAO,EAAGN,OAJX;AAKC,IAAA,MAAM,EAAGC,MALV;AAMC,IAAA,MAAM,EAAGC,MANV;AAOC,IAAA,oBAAoB,MAPrB;AAQC,IAAA,wBAAwB,EAAG,KAR5B;AASC,IAAA,KAAK,EAAGK;AATT,KAUMC,KAVN,EADD,CADD,CADD;AAkBA;;AAED,SAASK,OAAT,CAAkB;AAAEC,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,CAAlB,EAAuC;AACtC,MAAK,CAAEA,IAAP,EAAc,OAAOD,QAAP;AAEd;AACD;AACA;AACA;AACA;AACA;AACA;AACA;;AACC,SACC,4BAAC,gBAAD;AAAa,IAAA,IAAI,EAAGC,IAApB;AAA2B,IAAA,QAAQ,EAAC;AAApC,KACC,yCAAOD,QAAP,CADD,CADD;AAKA","sourcesContent":["/**\n * External dependencies\n */\nimport { noop } from 'lodash';\nimport { useHover } from 'react-use-gesture';\n\n/**\n * Internal dependencies\n */\nimport BaseTooltip from '../tooltip';\nimport { UnitControlWrapper, UnitControl } from './styles/box-control-styles';\n\nexport default function BoxUnitControl( {\n\tisFirst,\n\tisLast,\n\tisOnly,\n\tonHoverOn = noop,\n\tonHoverOff = noop,\n\tlabel,\n\tvalue,\n\t...props\n} ) {\n\tconst bindHoverGesture = useHover( ( { event, ...state } ) => {\n\t\tif ( state.hovering ) {\n\t\t\tonHoverOn( event, state );\n\t\t} else {\n\t\t\tonHoverOff( event, state );\n\t\t}\n\t} );\n\n\treturn (\n\t\t<UnitControlWrapper { ...bindHoverGesture() }>\n\t\t\t<Tooltip text={ label }>\n\t\t\t\t<UnitControl\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tclassName=\"component-box-control__unit-control\"\n\t\t\t\t\thideHTMLArrows\n\t\t\t\t\tisFirst={ isFirst }\n\t\t\t\t\tisLast={ isLast }\n\t\t\t\t\tisOnly={ isOnly }\n\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\tisResetValueOnUnitChange={ false }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\t{ ...props }\n\t\t\t\t/>\n\t\t\t</Tooltip>\n\t\t</UnitControlWrapper>\n\t);\n}\n\nfunction Tooltip( { children, text } ) {\n\tif ( ! text ) return children;\n\n\t/**\n\t * Wrapping the children in a `<div />` as Tooltip as it attempts\n\t * to render the <UnitControl />. Using a plain `<div />` appears to\n\t * resolve this issue.\n\t *\n\t * Originally discovered and referenced here:\n\t * https://github.com/WordPress/gutenberg/pull/24966#issuecomment-685875026\n\t */\n\treturn (\n\t\t<BaseTooltip text={ text } position=\"top\">\n\t\t\t<div>{ children }</div>\n\t\t</BaseTooltip>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/box-control/unit-control.js"],"names":["BoxUnitControl","isFirst","isLast","isOnly","onHoverOn","noop","onHoverOff","label","value","props","bindHoverGesture","event","state","hovering","Tooltip","children","text"],"mappings":";;;;;;;;;;;;;AAGA;;AACA;;AAKA;;AACA;;AAVA;AACA;AACA;;AAIA;AACA;AACA;AAIe,SAASA,cAAT,OASX;AAAA,MAToC;AACvCC,IAAAA,OADuC;AAEvCC,IAAAA,MAFuC;AAGvCC,IAAAA,MAHuC;AAIvCC,IAAAA,SAAS,GAAGC,YAJ2B;AAKvCC,IAAAA,UAAU,GAAGD,YAL0B;AAMvCE,IAAAA,KANuC;AAOvCC,IAAAA,KAPuC;AAQvC,OAAGC;AARoC,GASpC;AACH,QAAMC,gBAAgB,GAAG,+BAAU,SAA2B;AAAA,QAAzB;AAAEC,MAAAA,KAAF;AAAS,SAAGC;AAAZ,KAAyB;;AAC7D,QAAKA,KAAK,CAACC,QAAX,EAAsB;AACrBT,MAAAA,SAAS,CAAEO,KAAF,EAASC,KAAT,CAAT;AACA,KAFD,MAEO;AACNN,MAAAA,UAAU,CAAEK,KAAF,EAASC,KAAT,CAAV;AACA;AACD,GANwB,CAAzB;AAQA,SACC,4BAAC,oCAAD,EAAyBF,gBAAgB,EAAzC,EACC,4BAAC,OAAD;AAAS,IAAA,IAAI,EAAGH;AAAhB,KACC,4BAAC,6BAAD;AACC,kBAAaA,KADd;AAEC,IAAA,SAAS,EAAC,qCAFX;AAGC,IAAA,cAAc,MAHf;AAIC,IAAA,OAAO,EAAGN,OAJX;AAKC,IAAA,MAAM,EAAGC,MALV;AAMC,IAAA,MAAM,EAAGC,MANV;AAOC,IAAA,oBAAoB,MAPrB;AAQC,IAAA,wBAAwB,EAAG,KAR5B;AASC,IAAA,KAAK,EAAGK;AATT,KAUMC,KAVN,EADD,CADD,CADD;AAkBA;;AAED,SAASK,OAAT,QAAuC;AAAA,MAArB;AAAEC,IAAAA,QAAF;AAAYC,IAAAA;AAAZ,GAAqB;AACtC,MAAK,CAAEA,IAAP,EAAc,OAAOD,QAAP;AAEd;AACD;AACA;AACA;AACA;AACA;AACA;AACA;;AACC,SACC,4BAAC,gBAAD;AAAa,IAAA,IAAI,EAAGC,IAApB;AAA2B,IAAA,QAAQ,EAAC;AAApC,KACC,yCAAOD,QAAP,CADD,CADD;AAKA","sourcesContent":["/**\n * External dependencies\n */\nimport { noop } from 'lodash';\nimport { useHover } from 'react-use-gesture';\n\n/**\n * Internal dependencies\n */\nimport BaseTooltip from '../tooltip';\nimport { UnitControlWrapper, UnitControl } from './styles/box-control-styles';\n\nexport default function BoxUnitControl( {\n\tisFirst,\n\tisLast,\n\tisOnly,\n\tonHoverOn = noop,\n\tonHoverOff = noop,\n\tlabel,\n\tvalue,\n\t...props\n} ) {\n\tconst bindHoverGesture = useHover( ( { event, ...state } ) => {\n\t\tif ( state.hovering ) {\n\t\t\tonHoverOn( event, state );\n\t\t} else {\n\t\t\tonHoverOff( event, state );\n\t\t}\n\t} );\n\n\treturn (\n\t\t<UnitControlWrapper { ...bindHoverGesture() }>\n\t\t\t<Tooltip text={ label }>\n\t\t\t\t<UnitControl\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tclassName=\"component-box-control__unit-control\"\n\t\t\t\t\thideHTMLArrows\n\t\t\t\t\tisFirst={ isFirst }\n\t\t\t\t\tisLast={ isLast }\n\t\t\t\t\tisOnly={ isOnly }\n\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\tisResetValueOnUnitChange={ false }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\t{ ...props }\n\t\t\t\t/>\n\t\t\t</Tooltip>\n\t\t</UnitControlWrapper>\n\t);\n}\n\nfunction Tooltip( { children, text } ) {\n\tif ( ! text ) return children;\n\n\t/**\n\t * Wrapping the children in a `<div />` as Tooltip as it attempts\n\t * to render the <UnitControl />. Using a plain `<div />` appears to\n\t * resolve this issue.\n\t *\n\t * Originally discovered and referenced here:\n\t * https://github.com/WordPress/gutenberg/pull/24966#issuecomment-685875026\n\t */\n\treturn (\n\t\t<BaseTooltip text={ text } position=\"top\">\n\t\t\t<div>{ children }</div>\n\t\t</BaseTooltip>\n\t);\n}\n"]}

package/build/box-control/utils.js

@@ -3,13 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getAllValue = getAllValue;
+exports.LABELS = exports.DEFAULT_VISUALIZER_VALUES = exports.DEFAULT_VALUES = exports.ALL_SIDES = void 0;
 exports.getAllUnitFallback = getAllUnitFallback;
-exports.isValuesMixed = isValuesMixed;
-exports.isValuesDefined = isValuesDefined;
+exports.getAllValue = getAllValue;
 exports.getInitialSide = getInitialSide;
+exports.isValuesDefined = isValuesDefined;
+exports.isValuesMixed = isValuesMixed;
 exports.normalizeSides = normalizeSides;
-exports.ALL_SIDES = exports.DEFAULT_VISUALIZER_VALUES = exports.DEFAULT_VALUES = exports.LABELS = void 0;
 
 var _lodash = require("lodash");
 
@@ -77,7 +77,9 @@ function mode(arr) {
  */
 
 
-function getAllValue(values = {}, availableSides = ALL_SIDES) {
+function getAllValue() {
+  let values = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  let availableSides = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : ALL_SIDES;
   const sides = normalizeSides(availableSides);
   const parsedValues = sides.map(side => (0, _utils.parseUnit)(values[side]));
   const allValues = parsedValues.map(value => value[0]);
@@ -123,7 +125,9 @@ function getAllUnitFallback(selectedUnits) {
  */
 
 
-function isValuesMixed(values = {}, sides = ALL_SIDES) {
+function isValuesMixed() {
+  let values = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  let sides = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : ALL_SIDES;
   const allValue = getAllValue(values, sides);
   const isMixed = isNaN(parseFloat(allValue));
   return isMixed;

package/build/box-control/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/box-control/utils.js"],"names":["LABELS","all","top","bottom","left","right","mixed","vertical","horizontal","DEFAULT_VALUES","DEFAULT_VISUALIZER_VALUES","ALL_SIDES","mode","arr","sort","a","b","filter","v","length","pop","getAllValue","values","availableSides","sides","normalizeSides","parsedValues","map","side","allValues","value","allUnits","every","unit","allValue","getAllUnitFallback","selectedUnits","undefined","filteredUnits","Object","Boolean","isValuesMixed","isMixed","isNaN","parseFloat","isValuesDefined","test","getInitialSide","isLinked","splitOnAxis","initialSide","filteredSides","includes","push","newSides"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { isEmpty, isNumber } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { parseUnit } from '../unit-control/utils';\n\nexport const LABELS = {\n\tall: __( 'All' ),\n\ttop: __( 'Top' ),\n\tbottom: __( 'Bottom' ),\n\tleft: __( 'Left' ),\n\tright: __( 'Right' ),\n\tmixed: __( 'Mixed' ),\n\tvertical: __( 'Vertical' ),\n\thorizontal: __( 'Horizontal' ),\n};\n\nexport const DEFAULT_VALUES = {\n\ttop: null,\n\tright: null,\n\tbottom: null,\n\tleft: null,\n};\n\nexport const DEFAULT_VISUALIZER_VALUES = {\n\ttop: false,\n\tright: false,\n\tbottom: false,\n\tleft: false,\n};\n\nexport const ALL_SIDES = [ 'top', 'right', 'bottom', 'left' ];\n\n/**\n * Gets an items with the most occurrence within an array\n * https://stackoverflow.com/a/20762713\n *\n * @param {Array<any>} arr Array of items to check.\n * @return {any} The item with the most occurrences.\n */\nfunction mode( arr ) {\n\treturn arr\n\t\t.sort(\n\t\t\t( a, b ) =>\n\t\t\t\tarr.filter( ( v ) => v === a ).length -\n\t\t\t\tarr.filter( ( v ) => v === b ).length\n\t\t)\n\t\t.pop();\n}\n\n/**\n * Gets the 'all' input value and unit from values data.\n *\n * @param {Object} values         Box values.\n * @param {Array}  availableSides Available box sides to evaluate.\n *\n * @return {string} A value + unit for the 'all' input.\n */\nexport function getAllValue( values = {}, availableSides = ALL_SIDES ) {\n\tconst sides = normalizeSides( availableSides );\n\tconst parsedValues = sides.map( ( side ) => parseUnit( values[ side ] ) );\n\tconst allValues = parsedValues.map( ( value ) => value[ 0 ] );\n\tconst allUnits = parsedValues.map( ( value ) => value[ 1 ] );\n\n\tconst value = allValues.every( ( v ) => v === allValues[ 0 ] )\n\t\t? allValues[ 0 ]\n\t\t: '';\n\tconst unit = mode( allUnits );\n\n\t/**\n\t * The isNumber check is important. On reset actions, the incoming value\n\t * may be null or an empty string.\n\t *\n\t * Also, the value may also be zero (0), which is considered a valid unit value.\n\t *\n\t * isNumber() is more specific for these cases, rather than relying on a\n\t * simple truthy check.\n\t */\n\tconst allValue = isNumber( value ) ? `${ value }${ unit }` : null;\n\n\treturn allValue;\n}\n\n/**\n * Determine the most common unit selection to use as a fallback option.\n *\n * @param {Object} selectedUnits Current unit selections for individual sides.\n * @return {string} Most common unit selection.\n */\nexport function getAllUnitFallback( selectedUnits ) {\n\tif ( ! selectedUnits || typeof selectedUnits !== 'object' ) {\n\t\treturn undefined;\n\t}\n\n\tconst filteredUnits = Object.values( selectedUnits ).filter( Boolean );\n\n\treturn mode( filteredUnits );\n}\n\n/**\n * Checks to determine if values are mixed.\n *\n * @param {Object} values Box values.\n * @param {Array}  sides  Available box sides to evaluate.\n *\n * @return {boolean} Whether values are mixed.\n */\nexport function isValuesMixed( values = {}, sides = ALL_SIDES ) {\n\tconst allValue = getAllValue( values, sides );\n\tconst isMixed = isNaN( parseFloat( allValue ) );\n\n\treturn isMixed;\n}\n\n/**\n * Checks to determine if values are defined.\n *\n * @param {Object} values Box values.\n *\n * @return {boolean} Whether values are mixed.\n */\nexport function isValuesDefined( values ) {\n\treturn (\n\t\tvalues !== undefined &&\n\t\t! isEmpty(\n\t\t\tObject.values( values ).filter(\n\t\t\t\t// Switching units when input is empty causes values only\n\t\t\t\t// containing units. This gives false positive on mixed values\n\t\t\t\t// unless filtered.\n\t\t\t\t( value ) => !! value && /\\d/.test( value )\n\t\t\t)\n\t\t)\n\t);\n}\n\n/**\n * Get initial selected side, factoring in whether the sides are linked,\n * and whether the vertical / horizontal directions are grouped via splitOnAxis.\n *\n * @param {boolean} isLinked    Whether the box control's fields are linked.\n * @param {boolean} splitOnAxis Whether splitting by horizontal or vertical axis.\n * @return {string} The initial side.\n */\nexport function getInitialSide( isLinked, splitOnAxis ) {\n\tlet initialSide = 'all';\n\n\tif ( ! isLinked ) {\n\t\tinitialSide = splitOnAxis ? 'vertical' : 'top';\n\t}\n\n\treturn initialSide;\n}\n\n/**\n * Normalizes provided sides configuration to an array containing only top,\n * right, bottom and left. This essentially just maps `horizontal` or `vertical`\n * to their appropriate sides to facilitate correctly determining value for\n * all input control.\n *\n * @param {Array} sides Available sides for box control.\n * @return {Array} Normalized sides configuration.\n */\nexport function normalizeSides( sides ) {\n\tconst filteredSides = [];\n\n\tif ( ! sides?.length ) {\n\t\treturn ALL_SIDES;\n\t}\n\n\tif ( sides.includes( 'vertical' ) ) {\n\t\tfilteredSides.push( ...[ 'top', 'bottom' ] );\n\t} else if ( sides.includes( 'horizontal' ) ) {\n\t\tfilteredSides.push( ...[ 'left', 'right' ] );\n\t} else {\n\t\tconst newSides = ALL_SIDES.filter( ( side ) => sides.includes( side ) );\n\t\tfilteredSides.push( ...newSides );\n\t}\n\n\treturn filteredSides;\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/box-control/utils.js"],"names":["LABELS","all","top","bottom","left","right","mixed","vertical","horizontal","DEFAULT_VALUES","DEFAULT_VISUALIZER_VALUES","ALL_SIDES","mode","arr","sort","a","b","filter","v","length","pop","getAllValue","values","availableSides","sides","normalizeSides","parsedValues","map","side","allValues","value","allUnits","every","unit","allValue","getAllUnitFallback","selectedUnits","undefined","filteredUnits","Object","Boolean","isValuesMixed","isMixed","isNaN","parseFloat","isValuesDefined","test","getInitialSide","isLinked","splitOnAxis","initialSide","filteredSides","includes","push","newSides"],"mappings":";;;;;;;;;;;;;AAGA;;AAKA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAGO,MAAMA,MAAM,GAAG;AACrBC,EAAAA,GAAG,EAAE,cAAI,KAAJ,CADgB;AAErBC,EAAAA,GAAG,EAAE,cAAI,KAAJ,CAFgB;AAGrBC,EAAAA,MAAM,EAAE,cAAI,QAAJ,CAHa;AAIrBC,EAAAA,IAAI,EAAE,cAAI,MAAJ,CAJe;AAKrBC,EAAAA,KAAK,EAAE,cAAI,OAAJ,CALc;AAMrBC,EAAAA,KAAK,EAAE,cAAI,OAAJ,CANc;AAOrBC,EAAAA,QAAQ,EAAE,cAAI,UAAJ,CAPW;AAQrBC,EAAAA,UAAU,EAAE,cAAI,YAAJ;AARS,CAAf;;AAWA,MAAMC,cAAc,GAAG;AAC7BP,EAAAA,GAAG,EAAE,IADwB;AAE7BG,EAAAA,KAAK,EAAE,IAFsB;AAG7BF,EAAAA,MAAM,EAAE,IAHqB;AAI7BC,EAAAA,IAAI,EAAE;AAJuB,CAAvB;;AAOA,MAAMM,yBAAyB,GAAG;AACxCR,EAAAA,GAAG,EAAE,KADmC;AAExCG,EAAAA,KAAK,EAAE,KAFiC;AAGxCF,EAAAA,MAAM,EAAE,KAHgC;AAIxCC,EAAAA,IAAI,EAAE;AAJkC,CAAlC;;AAOA,MAAMO,SAAS,GAAG,CAAE,KAAF,EAAS,OAAT,EAAkB,QAAlB,EAA4B,MAA5B,CAAlB;AAEP;AACA;AACA;AACA;AACA;AACA;AACA;;;;AACA,SAASC,IAAT,CAAeC,GAAf,EAAqB;AACpB,SAAOA,GAAG,CACRC,IADK,CAEL,CAAEC,CAAF,EAAKC,CAAL,KACCH,GAAG,CAACI,MAAJ,CAAcC,CAAF,IAASA,CAAC,KAAKH,CAA3B,EAA+BI,MAA/B,GACAN,GAAG,CAACI,MAAJ,CAAcC,CAAF,IAASA,CAAC,KAAKF,CAA3B,EAA+BG,MAJ3B,EAMLC,GANK,EAAP;AAOA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,WAAT,GAAgE;AAAA,MAA1CC,MAA0C,uEAAjC,EAAiC;AAAA,MAA7BC,cAA6B,uEAAZZ,SAAY;AACtE,QAAMa,KAAK,GAAGC,cAAc,CAAEF,cAAF,CAA5B;AACA,QAAMG,YAAY,GAAGF,KAAK,CAACG,GAAN,CAAaC,IAAF,IAAY,sBAAWN,MAAM,CAAEM,IAAF,CAAjB,CAAvB,CAArB;AACA,QAAMC,SAAS,GAAGH,YAAY,CAACC,GAAb,CAAoBG,KAAF,IAAaA,KAAK,CAAE,CAAF,CAApC,CAAlB;AACA,QAAMC,QAAQ,GAAGL,YAAY,CAACC,GAAb,CAAoBG,KAAF,IAAaA,KAAK,CAAE,CAAF,CAApC,CAAjB;AAEA,QAAMA,KAAK,GAAGD,SAAS,CAACG,KAAV,CAAmBd,CAAF,IAASA,CAAC,KAAKW,SAAS,CAAE,CAAF,CAAzC,IACXA,SAAS,CAAE,CAAF,CADE,GAEX,EAFH;AAGA,QAAMI,IAAI,GAAGrB,IAAI,CAAEmB,QAAF,CAAjB;AAEA;AACD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACC,QAAMG,QAAQ,GAAG,sBAAUJ,KAAV,IAAqB,GAAGA,KAAO,GAAGG,IAAM,EAAxC,GAA4C,IAA7D;AAEA,SAAOC,QAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,kBAAT,CAA6BC,aAA7B,EAA6C;AACnD,MAAK,CAAEA,aAAF,IAAmB,OAAOA,aAAP,KAAyB,QAAjD,EAA4D;AAC3D,WAAOC,SAAP;AACA;;AAED,QAAMC,aAAa,GAAGC,MAAM,CAACjB,MAAP,CAAec,aAAf,EAA+BnB,MAA/B,CAAuCuB,OAAvC,CAAtB;AAEA,SAAO5B,IAAI,CAAE0B,aAAF,CAAX;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASG,aAAT,GAAyD;AAAA,MAAjCnB,MAAiC,uEAAxB,EAAwB;AAAA,MAApBE,KAAoB,uEAAZb,SAAY;AAC/D,QAAMuB,QAAQ,GAAGb,WAAW,CAAEC,MAAF,EAAUE,KAAV,CAA5B;AACA,QAAMkB,OAAO,GAAGC,KAAK,CAAEC,UAAU,CAAEV,QAAF,CAAZ,CAArB;AAEA,SAAOQ,OAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASG,eAAT,CAA0BvB,MAA1B,EAAmC;AACzC,SACCA,MAAM,KAAKe,SAAX,IACA,CAAE,qBACDE,MAAM,CAACjB,MAAP,CAAeA,MAAf,EAAwBL,MAAxB,EACC;AACA;AACA;AACEa,EAAAA,KAAF,IAAa,CAAC,CAAEA,KAAH,IAAY,KAAKgB,IAAL,CAAWhB,KAAX,CAJ1B,CADC,CAFH;AAWA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASiB,cAAT,CAAyBC,QAAzB,EAAmCC,WAAnC,EAAiD;AACvD,MAAIC,WAAW,GAAG,KAAlB;;AAEA,MAAK,CAAEF,QAAP,EAAkB;AACjBE,IAAAA,WAAW,GAAGD,WAAW,GAAG,UAAH,GAAgB,KAAzC;AACA;;AAED,SAAOC,WAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASzB,cAAT,CAAyBD,KAAzB,EAAiC;AACvC,QAAM2B,aAAa,GAAG,EAAtB;;AAEA,MAAK,EAAE3B,KAAF,aAAEA,KAAF,eAAEA,KAAK,CAAEL,MAAT,CAAL,EAAuB;AACtB,WAAOR,SAAP;AACA;;AAED,MAAKa,KAAK,CAAC4B,QAAN,CAAgB,UAAhB,CAAL,EAAoC;AACnCD,IAAAA,aAAa,CAACE,IAAd,CAAoB,GAAG,CAAE,KAAF,EAAS,QAAT,CAAvB;AACA,GAFD,MAEO,IAAK7B,KAAK,CAAC4B,QAAN,CAAgB,YAAhB,CAAL,EAAsC;AAC5CD,IAAAA,aAAa,CAACE,IAAd,CAAoB,GAAG,CAAE,MAAF,EAAU,OAAV,CAAvB;AACA,GAFM,MAEA;AACN,UAAMC,QAAQ,GAAG3C,SAAS,CAACM,MAAV,CAAoBW,IAAF,IAAYJ,KAAK,CAAC4B,QAAN,CAAgBxB,IAAhB,CAA9B,CAAjB;AACAuB,IAAAA,aAAa,CAACE,IAAd,CAAoB,GAAGC,QAAvB;AACA;;AAED,SAAOH,aAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport { isEmpty, isNumber } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { parseUnit } from '../unit-control/utils';\n\nexport const LABELS = {\n\tall: __( 'All' ),\n\ttop: __( 'Top' ),\n\tbottom: __( 'Bottom' ),\n\tleft: __( 'Left' ),\n\tright: __( 'Right' ),\n\tmixed: __( 'Mixed' ),\n\tvertical: __( 'Vertical' ),\n\thorizontal: __( 'Horizontal' ),\n};\n\nexport const DEFAULT_VALUES = {\n\ttop: null,\n\tright: null,\n\tbottom: null,\n\tleft: null,\n};\n\nexport const DEFAULT_VISUALIZER_VALUES = {\n\ttop: false,\n\tright: false,\n\tbottom: false,\n\tleft: false,\n};\n\nexport const ALL_SIDES = [ 'top', 'right', 'bottom', 'left' ];\n\n/**\n * Gets an items with the most occurrence within an array\n * https://stackoverflow.com/a/20762713\n *\n * @param {Array<any>} arr Array of items to check.\n * @return {any} The item with the most occurrences.\n */\nfunction mode( arr ) {\n\treturn arr\n\t\t.sort(\n\t\t\t( a, b ) =>\n\t\t\t\tarr.filter( ( v ) => v === a ).length -\n\t\t\t\tarr.filter( ( v ) => v === b ).length\n\t\t)\n\t\t.pop();\n}\n\n/**\n * Gets the 'all' input value and unit from values data.\n *\n * @param {Object} values         Box values.\n * @param {Array}  availableSides Available box sides to evaluate.\n *\n * @return {string} A value + unit for the 'all' input.\n */\nexport function getAllValue( values = {}, availableSides = ALL_SIDES ) {\n\tconst sides = normalizeSides( availableSides );\n\tconst parsedValues = sides.map( ( side ) => parseUnit( values[ side ] ) );\n\tconst allValues = parsedValues.map( ( value ) => value[ 0 ] );\n\tconst allUnits = parsedValues.map( ( value ) => value[ 1 ] );\n\n\tconst value = allValues.every( ( v ) => v === allValues[ 0 ] )\n\t\t? allValues[ 0 ]\n\t\t: '';\n\tconst unit = mode( allUnits );\n\n\t/**\n\t * The isNumber check is important. On reset actions, the incoming value\n\t * may be null or an empty string.\n\t *\n\t * Also, the value may also be zero (0), which is considered a valid unit value.\n\t *\n\t * isNumber() is more specific for these cases, rather than relying on a\n\t * simple truthy check.\n\t */\n\tconst allValue = isNumber( value ) ? `${ value }${ unit }` : null;\n\n\treturn allValue;\n}\n\n/**\n * Determine the most common unit selection to use as a fallback option.\n *\n * @param {Object} selectedUnits Current unit selections for individual sides.\n * @return {string} Most common unit selection.\n */\nexport function getAllUnitFallback( selectedUnits ) {\n\tif ( ! selectedUnits || typeof selectedUnits !== 'object' ) {\n\t\treturn undefined;\n\t}\n\n\tconst filteredUnits = Object.values( selectedUnits ).filter( Boolean );\n\n\treturn mode( filteredUnits );\n}\n\n/**\n * Checks to determine if values are mixed.\n *\n * @param {Object} values Box values.\n * @param {Array}  sides  Available box sides to evaluate.\n *\n * @return {boolean} Whether values are mixed.\n */\nexport function isValuesMixed( values = {}, sides = ALL_SIDES ) {\n\tconst allValue = getAllValue( values, sides );\n\tconst isMixed = isNaN( parseFloat( allValue ) );\n\n\treturn isMixed;\n}\n\n/**\n * Checks to determine if values are defined.\n *\n * @param {Object} values Box values.\n *\n * @return {boolean} Whether values are mixed.\n */\nexport function isValuesDefined( values ) {\n\treturn (\n\t\tvalues !== undefined &&\n\t\t! isEmpty(\n\t\t\tObject.values( values ).filter(\n\t\t\t\t// Switching units when input is empty causes values only\n\t\t\t\t// containing units. This gives false positive on mixed values\n\t\t\t\t// unless filtered.\n\t\t\t\t( value ) => !! value && /\\d/.test( value )\n\t\t\t)\n\t\t)\n\t);\n}\n\n/**\n * Get initial selected side, factoring in whether the sides are linked,\n * and whether the vertical / horizontal directions are grouped via splitOnAxis.\n *\n * @param {boolean} isLinked    Whether the box control's fields are linked.\n * @param {boolean} splitOnAxis Whether splitting by horizontal or vertical axis.\n * @return {string} The initial side.\n */\nexport function getInitialSide( isLinked, splitOnAxis ) {\n\tlet initialSide = 'all';\n\n\tif ( ! isLinked ) {\n\t\tinitialSide = splitOnAxis ? 'vertical' : 'top';\n\t}\n\n\treturn initialSide;\n}\n\n/**\n * Normalizes provided sides configuration to an array containing only top,\n * right, bottom and left. This essentially just maps `horizontal` or `vertical`\n * to their appropriate sides to facilitate correctly determining value for\n * all input control.\n *\n * @param {Array} sides Available sides for box control.\n * @return {Array} Normalized sides configuration.\n */\nexport function normalizeSides( sides ) {\n\tconst filteredSides = [];\n\n\tif ( ! sides?.length ) {\n\t\treturn ALL_SIDES;\n\t}\n\n\tif ( sides.includes( 'vertical' ) ) {\n\t\tfilteredSides.push( ...[ 'top', 'bottom' ] );\n\t} else if ( sides.includes( 'horizontal' ) ) {\n\t\tfilteredSides.push( ...[ 'left', 'right' ] );\n\t} else {\n\t\tconst newSides = ALL_SIDES.filter( ( side ) => sides.includes( side ) );\n\t\tfilteredSides.push( ...newSides );\n\t}\n\n\treturn filteredSides;\n}\n"]}

package/build/box-control/visualizer.js

@@ -22,12 +22,13 @@ var _utils = require("./utils");
 /**
  * Internal dependencies
  */
-function BoxControlVisualizer({
-  children,
-  showValues = _utils.DEFAULT_VISUALIZER_VALUES,
-  values: valuesProp = _utils.DEFAULT_VALUES,
-  ...props
-}) {
+function BoxControlVisualizer(_ref) {
+  let {
+    children,
+    showValues = _utils.DEFAULT_VISUALIZER_VALUES,
+    values: valuesProp = _utils.DEFAULT_VALUES,
+    ...props
+  } = _ref;
   const isPositionAbsolute = !children;
   return (0, _element.createElement)(_boxControlVisualizerStyles.Container, (0, _extends2.default)({}, props, {
     isPositionAbsolute: isPositionAbsolute,
@@ -38,10 +39,11 @@ function BoxControlVisualizer({
   }), children);
 }
 
-function Sides({
-  showValues = _utils.DEFAULT_VISUALIZER_VALUES,
-  values
-}) {
+function Sides(_ref2) {
+  let {
+    showValues = _utils.DEFAULT_VISUALIZER_VALUES,
+    values
+  } = _ref2;
   const {
     top,
     right,
@@ -63,10 +65,11 @@ function Sides({
   }));
 }
 
-function Top({
-  isVisible = false,
-  value
-}) {
+function Top(_ref3) {
+  let {
+    isVisible = false,
+    value
+  } = _ref3;
   const height = value;
   const animationProps = useSideAnimation(height);
   const isActive = animationProps.isActive || isVisible;
@@ -78,10 +81,11 @@ function Top({
   });
 }
 
-function Right({
-  isVisible = false,
-  value
-}) {
+function Right(_ref4) {
+  let {
+    isVisible = false,
+    value
+  } = _ref4;
   const width = value;
   const animationProps = useSideAnimation(width);
   const isActive = animationProps.isActive || isVisible;
@@ -93,10 +97,11 @@ function Right({
   });
 }
 
-function Bottom({
-  isVisible = false,
-  value
-}) {
+function Bottom(_ref5) {
+  let {
+    isVisible = false,
+    value
+  } = _ref5;
   const height = value;
   const animationProps = useSideAnimation(height);
   const isActive = animationProps.isActive || isVisible;
@@ -108,10 +113,11 @@ function Bottom({
   });
 }
 
-function Left({
-  isVisible = false,
-  value
-}) {
+function Left(_ref6) {
+  let {
+    isVisible = false,
+    value
+  } = _ref6;
   const width = value;
   const animationProps = useSideAnimation(width);
   const isActive = animationProps.isActive || isVisible;

package/build/box-control/visualizer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/box-control/visualizer.js"],"names":["BoxControlVisualizer","children","showValues","DEFAULT_VISUALIZER_VALUES","values","valuesProp","DEFAULT_VALUES","props","isPositionAbsolute","Sides","top","right","bottom","left","Top","isVisible","value","height","animationProps","useSideAnimation","isActive","Right","width","Bottom","Left","setIsActive","valueRef","timeoutRef","clearTimer","current","window","clearTimeout","setTimeout"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport {\n\tContainer,\n\tTopView,\n\tRightView,\n\tBottomView,\n\tLeftView,\n} from './styles/box-control-visualizer-styles';\nimport { DEFAULT_VALUES, DEFAULT_VISUALIZER_VALUES } from './utils';\n\nexport default function BoxControlVisualizer( {\n\tchildren,\n\tshowValues = DEFAULT_VISUALIZER_VALUES,\n\tvalues: valuesProp = DEFAULT_VALUES,\n\t...props\n} ) {\n\tconst isPositionAbsolute = ! children;\n\treturn (\n\t\t<Container\n\t\t\t{ ...props }\n\t\t\tisPositionAbsolute={ isPositionAbsolute }\n\t\t\taria-hidden=\"true\"\n\t\t>\n\t\t\t<Sides showValues={ showValues } values={ valuesProp } />\n\t\t\t{ children }\n\t\t</Container>\n\t);\n}\n\nfunction Sides( { showValues = DEFAULT_VISUALIZER_VALUES, values } ) {\n\tconst { top, right, bottom, left } = values;\n\n\treturn (\n\t\t<>\n\t\t\t<Top isVisible={ showValues.top } value={ top } />\n\t\t\t<Right isVisible={ showValues.right } value={ right } />\n\t\t\t<Bottom isVisible={ showValues.bottom } value={ bottom } />\n\t\t\t<Left isVisible={ showValues.left } value={ left } />\n\t\t</>\n\t);\n}\n\nfunction Top( { isVisible = false, value } ) {\n\tconst height = value;\n\tconst animationProps = useSideAnimation( height );\n\tconst isActive = animationProps.isActive || isVisible;\n\n\treturn <TopView isActive={ isActive } style={ { height } } />;\n}\n\nfunction Right( { isVisible = false, value } ) {\n\tconst width = value;\n\tconst animationProps = useSideAnimation( width );\n\tconst isActive = animationProps.isActive || isVisible;\n\n\treturn <RightView isActive={ isActive } style={ { width } } />;\n}\n\nfunction Bottom( { isVisible = false, value } ) {\n\tconst height = value;\n\tconst animationProps = useSideAnimation( height );\n\tconst isActive = animationProps.isActive || isVisible;\n\n\treturn <BottomView isActive={ isActive } style={ { height } } />;\n}\n\nfunction Left( { isVisible = false, value } ) {\n\tconst width = value;\n\tconst animationProps = useSideAnimation( width );\n\tconst isActive = animationProps.isActive || isVisible;\n\n\treturn <LeftView isActive={ isActive } style={ { width } } />;\n}\n\n/**\n * Custom hook that renders the \"flash\" animation whenever the value changes.\n *\n * @param {string} value Value of (box) side.\n */\nfunction useSideAnimation( value ) {\n\tconst [ isActive, setIsActive ] = useState( false );\n\tconst valueRef = useRef( value );\n\tconst timeoutRef = useRef();\n\n\tconst clearTimer = () => {\n\t\tif ( timeoutRef.current ) {\n\t\t\twindow.clearTimeout( timeoutRef.current );\n\t\t}\n\t};\n\n\tuseEffect( () => {\n\t\tif ( value !== valueRef.current ) {\n\t\t\tsetIsActive( true );\n\t\t\tvalueRef.current = value;\n\n\t\t\tclearTimer();\n\n\t\t\ttimeoutRef.current = setTimeout( () => {\n\t\t\t\tsetIsActive( false );\n\t\t\t}, 400 );\n\t\t}\n\n\t\treturn () => clearTimer();\n\t}, [ value ] );\n\n\treturn {\n\t\tisActive,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/box-control/visualizer.js"],"names":["BoxControlVisualizer","children","showValues","DEFAULT_VISUALIZER_VALUES","values","valuesProp","DEFAULT_VALUES","props","isPositionAbsolute","Sides","top","right","bottom","left","Top","isVisible","value","height","animationProps","useSideAnimation","isActive","Right","width","Bottom","Left","setIsActive","valueRef","timeoutRef","clearTimer","current","window","clearTimeout","setTimeout"],"mappings":";;;;;;;;;AAGA;;;;AAKA;;AAOA;;AAfA;AACA;AACA;;AAGA;AACA;AACA;AAUe,SAASA,oBAAT,OAKX;AAAA,MAL0C;AAC7CC,IAAAA,QAD6C;AAE7CC,IAAAA,UAAU,GAAGC,gCAFgC;AAG7CC,IAAAA,MAAM,EAAEC,UAAU,GAAGC,qBAHwB;AAI7C,OAAGC;AAJ0C,GAK1C;AACH,QAAMC,kBAAkB,GAAG,CAAEP,QAA7B;AACA,SACC,4BAAC,qCAAD,6BACMM,KADN;AAEC,IAAA,kBAAkB,EAAGC,kBAFtB;AAGC,mBAAY;AAHb,MAKC,4BAAC,KAAD;AAAO,IAAA,UAAU,EAAGN,UAApB;AAAiC,IAAA,MAAM,EAAGG;AAA1C,IALD,EAMGJ,QANH,CADD;AAUA;;AAED,SAASQ,KAAT,QAAqE;AAAA,MAArD;AAAEP,IAAAA,UAAU,GAAGC,gCAAf;AAA0CC,IAAAA;AAA1C,GAAqD;AACpE,QAAM;AAAEM,IAAAA,GAAF;AAAOC,IAAAA,KAAP;AAAcC,IAAAA,MAAd;AAAsBC,IAAAA;AAAtB,MAA+BT,MAArC;AAEA,SACC,qDACC,4BAAC,GAAD;AAAK,IAAA,SAAS,EAAGF,UAAU,CAACQ,GAA5B;AAAkC,IAAA,KAAK,EAAGA;AAA1C,IADD,EAEC,4BAAC,KAAD;AAAO,IAAA,SAAS,EAAGR,UAAU,CAACS,KAA9B;AAAsC,IAAA,KAAK,EAAGA;AAA9C,IAFD,EAGC,4BAAC,MAAD;AAAQ,IAAA,SAAS,EAAGT,UAAU,CAACU,MAA/B;AAAwC,IAAA,KAAK,EAAGA;AAAhD,IAHD,EAIC,4BAAC,IAAD;AAAM,IAAA,SAAS,EAAGV,UAAU,CAACW,IAA7B;AAAoC,IAAA,KAAK,EAAGA;AAA5C,IAJD,CADD;AAQA;;AAED,SAASC,GAAT,QAA6C;AAAA,MAA/B;AAAEC,IAAAA,SAAS,GAAG,KAAd;AAAqBC,IAAAA;AAArB,GAA+B;AAC5C,QAAMC,MAAM,GAAGD,KAAf;AACA,QAAME,cAAc,GAAGC,gBAAgB,CAAEF,MAAF,CAAvC;AACA,QAAMG,QAAQ,GAAGF,cAAc,CAACE,QAAf,IAA2BL,SAA5C;AAEA,SAAO,4BAAC,mCAAD;AAAS,IAAA,QAAQ,EAAGK,QAApB;AAA+B,IAAA,KAAK,EAAG;AAAEH,MAAAA;AAAF;AAAvC,IAAP;AACA;;AAED,SAASI,KAAT,QAA+C;AAAA,MAA/B;AAAEN,IAAAA,SAAS,GAAG,KAAd;AAAqBC,IAAAA;AAArB,GAA+B;AAC9C,QAAMM,KAAK,GAAGN,KAAd;AACA,QAAME,cAAc,GAAGC,gBAAgB,CAAEG,KAAF,CAAvC;AACA,QAAMF,QAAQ,GAAGF,cAAc,CAACE,QAAf,IAA2BL,SAA5C;AAEA,SAAO,4BAAC,qCAAD;AAAW,IAAA,QAAQ,EAAGK,QAAtB;AAAiC,IAAA,KAAK,EAAG;AAAEE,MAAAA;AAAF;AAAzC,IAAP;AACA;;AAED,SAASC,MAAT,QAAgD;AAAA,MAA/B;AAAER,IAAAA,SAAS,GAAG,KAAd;AAAqBC,IAAAA;AAArB,GAA+B;AAC/C,QAAMC,MAAM,GAAGD,KAAf;AACA,QAAME,cAAc,GAAGC,gBAAgB,CAAEF,MAAF,CAAvC;AACA,QAAMG,QAAQ,GAAGF,cAAc,CAACE,QAAf,IAA2BL,SAA5C;AAEA,SAAO,4BAAC,sCAAD;AAAY,IAAA,QAAQ,EAAGK,QAAvB;AAAkC,IAAA,KAAK,EAAG;AAAEH,MAAAA;AAAF;AAA1C,IAAP;AACA;;AAED,SAASO,IAAT,QAA8C;AAAA,MAA/B;AAAET,IAAAA,SAAS,GAAG,KAAd;AAAqBC,IAAAA;AAArB,GAA+B;AAC7C,QAAMM,KAAK,GAAGN,KAAd;AACA,QAAME,cAAc,GAAGC,gBAAgB,CAAEG,KAAF,CAAvC;AACA,QAAMF,QAAQ,GAAGF,cAAc,CAACE,QAAf,IAA2BL,SAA5C;AAEA,SAAO,4BAAC,oCAAD;AAAU,IAAA,QAAQ,EAAGK,QAArB;AAAgC,IAAA,KAAK,EAAG;AAAEE,MAAAA;AAAF;AAAxC,IAAP;AACA;AAED;AACA;AACA;AACA;AACA;;;AACA,SAASH,gBAAT,CAA2BH,KAA3B,EAAmC;AAClC,QAAM,CAAEI,QAAF,EAAYK,WAAZ,IAA4B,uBAAU,KAAV,CAAlC;AACA,QAAMC,QAAQ,GAAG,qBAAQV,KAAR,CAAjB;AACA,QAAMW,UAAU,GAAG,sBAAnB;;AAEA,QAAMC,UAAU,GAAG,MAAM;AACxB,QAAKD,UAAU,CAACE,OAAhB,EAA0B;AACzBC,MAAAA,MAAM,CAACC,YAAP,CAAqBJ,UAAU,CAACE,OAAhC;AACA;AACD,GAJD;;AAMA,0BAAW,MAAM;AAChB,QAAKb,KAAK,KAAKU,QAAQ,CAACG,OAAxB,EAAkC;AACjCJ,MAAAA,WAAW,CAAE,IAAF,CAAX;AACAC,MAAAA,QAAQ,CAACG,OAAT,GAAmBb,KAAnB;AAEAY,MAAAA,UAAU;AAEVD,MAAAA,UAAU,CAACE,OAAX,GAAqBG,UAAU,CAAE,MAAM;AACtCP,QAAAA,WAAW,CAAE,KAAF,CAAX;AACA,OAF8B,EAE5B,GAF4B,CAA/B;AAGA;;AAED,WAAO,MAAMG,UAAU,EAAvB;AACA,GAbD,EAaG,CAAEZ,KAAF,CAbH;AAeA,SAAO;AACNI,IAAAA;AADM,GAAP;AAGA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport {\n\tContainer,\n\tTopView,\n\tRightView,\n\tBottomView,\n\tLeftView,\n} from './styles/box-control-visualizer-styles';\nimport { DEFAULT_VALUES, DEFAULT_VISUALIZER_VALUES } from './utils';\n\nexport default function BoxControlVisualizer( {\n\tchildren,\n\tshowValues = DEFAULT_VISUALIZER_VALUES,\n\tvalues: valuesProp = DEFAULT_VALUES,\n\t...props\n} ) {\n\tconst isPositionAbsolute = ! children;\n\treturn (\n\t\t<Container\n\t\t\t{ ...props }\n\t\t\tisPositionAbsolute={ isPositionAbsolute }\n\t\t\taria-hidden=\"true\"\n\t\t>\n\t\t\t<Sides showValues={ showValues } values={ valuesProp } />\n\t\t\t{ children }\n\t\t</Container>\n\t);\n}\n\nfunction Sides( { showValues = DEFAULT_VISUALIZER_VALUES, values } ) {\n\tconst { top, right, bottom, left } = values;\n\n\treturn (\n\t\t<>\n\t\t\t<Top isVisible={ showValues.top } value={ top } />\n\t\t\t<Right isVisible={ showValues.right } value={ right } />\n\t\t\t<Bottom isVisible={ showValues.bottom } value={ bottom } />\n\t\t\t<Left isVisible={ showValues.left } value={ left } />\n\t\t</>\n\t);\n}\n\nfunction Top( { isVisible = false, value } ) {\n\tconst height = value;\n\tconst animationProps = useSideAnimation( height );\n\tconst isActive = animationProps.isActive || isVisible;\n\n\treturn <TopView isActive={ isActive } style={ { height } } />;\n}\n\nfunction Right( { isVisible = false, value } ) {\n\tconst width = value;\n\tconst animationProps = useSideAnimation( width );\n\tconst isActive = animationProps.isActive || isVisible;\n\n\treturn <RightView isActive={ isActive } style={ { width } } />;\n}\n\nfunction Bottom( { isVisible = false, value } ) {\n\tconst height = value;\n\tconst animationProps = useSideAnimation( height );\n\tconst isActive = animationProps.isActive || isVisible;\n\n\treturn <BottomView isActive={ isActive } style={ { height } } />;\n}\n\nfunction Left( { isVisible = false, value } ) {\n\tconst width = value;\n\tconst animationProps = useSideAnimation( width );\n\tconst isActive = animationProps.isActive || isVisible;\n\n\treturn <LeftView isActive={ isActive } style={ { width } } />;\n}\n\n/**\n * Custom hook that renders the \"flash\" animation whenever the value changes.\n *\n * @param {string} value Value of (box) side.\n */\nfunction useSideAnimation( value ) {\n\tconst [ isActive, setIsActive ] = useState( false );\n\tconst valueRef = useRef( value );\n\tconst timeoutRef = useRef();\n\n\tconst clearTimer = () => {\n\t\tif ( timeoutRef.current ) {\n\t\t\twindow.clearTimeout( timeoutRef.current );\n\t\t}\n\t};\n\n\tuseEffect( () => {\n\t\tif ( value !== valueRef.current ) {\n\t\t\tsetIsActive( true );\n\t\t\tvalueRef.current = value;\n\n\t\t\tclearTimer();\n\n\t\t\ttimeoutRef.current = setTimeout( () => {\n\t\t\t\tsetIsActive( false );\n\t\t\t}, 400 );\n\t\t}\n\n\t\treturn () => clearTimer();\n\t}, [ value ] );\n\n\treturn {\n\t\tisActive,\n\t};\n}\n"]}

package/build/button/deprecated.js

@@ -24,13 +24,14 @@ var _button = _interopRequireDefault(require("../button"));
 /**
  * Internal dependencies
  */
-function IconButton({
-  labelPosition,
-  size,
-  tooltip,
-  label,
-  ...props
-}, ref) {
+function IconButton(_ref, ref) {
+  let {
+    labelPosition,
+    size,
+    tooltip,
+    label,
+    ...props
+  } = _ref;
   (0, _deprecated.default)('wp.components.IconButton', {
     since: '5.4',
     alternative: 'wp.components.Button'

package/build/button/deprecated.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/button/deprecated.js"],"names":["IconButton","labelPosition","size","tooltip","label","props","ref","since","alternative","undefined"],"mappings":";;;;;;;;;AAKA;;;;AADA;;AAMA;;AAVA;;AACA;AACA;AACA;;AAIA;AACA;AACA;AAGA,SAASA,UAAT,CAAqB;AAAEC,EAAAA,aAAF;AAAiBC,EAAAA,IAAjB;AAAuBC,EAAAA,OAAvB;AAAgCC,EAAAA,KAAhC;AAAuC,KAAGC;AAA1C,CAArB,EAAwEC,GAAxE,EAA8E;AAC7E,2BAAY,0BAAZ,EAAwC;AACvCC,IAAAA,KAAK,EAAE,KADgC;AAEvCC,IAAAA,WAAW,EAAE;AAF0B,GAAxC;AAKA,SACC,4BAAC,eAAD,6BACMH,KADN;AAEC,IAAA,GAAG,EAAGC,GAFP;AAGC,IAAA,eAAe,EAAGL,aAHnB;AAIC,IAAA,QAAQ,EAAGC,IAJZ;AAKC,IAAA,WAAW,EAAGC,OAAO,KAAKM,SAAZ,GAAwB,CAAC,CAAEN,OAA3B,GAAqCM,SALpD;AAMC,IAAA,KAAK,EAAGN,OAAO,IAAIC;AANpB,KADD;AAUA;;eAEc,yBAAYJ,UAAZ,C","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\n\nfunction IconButton( { labelPosition, size, tooltip, label, ...props }, ref ) {\n\tdeprecated( 'wp.components.IconButton', {\n\t\tsince: '5.4',\n\t\talternative: 'wp.components.Button',\n\t} );\n\n\treturn (\n\t\t<Button\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t\ttooltipPosition={ labelPosition }\n\t\t\ticonSize={ size }\n\t\t\tshowTooltip={ tooltip !== undefined ? !! tooltip : undefined }\n\t\t\tlabel={ tooltip || label }\n\t\t/>\n\t);\n}\n\nexport default forwardRef( IconButton );\n"]}
+{"version":3,"sources":["@wordpress/components/src/button/deprecated.js"],"names":["IconButton","ref","labelPosition","size","tooltip","label","props","since","alternative","undefined"],"mappings":";;;;;;;;;AAKA;;;;AADA;;AAMA;;AAVA;;AACA;AACA;AACA;;AAIA;AACA;AACA;AAGA,SAASA,UAAT,OAAwEC,GAAxE,EAA8E;AAAA,MAAzD;AAAEC,IAAAA,aAAF;AAAiBC,IAAAA,IAAjB;AAAuBC,IAAAA,OAAvB;AAAgCC,IAAAA,KAAhC;AAAuC,OAAGC;AAA1C,GAAyD;AAC7E,2BAAY,0BAAZ,EAAwC;AACvCC,IAAAA,KAAK,EAAE,KADgC;AAEvCC,IAAAA,WAAW,EAAE;AAF0B,GAAxC;AAKA,SACC,4BAAC,eAAD,6BACMF,KADN;AAEC,IAAA,GAAG,EAAGL,GAFP;AAGC,IAAA,eAAe,EAAGC,aAHnB;AAIC,IAAA,QAAQ,EAAGC,IAJZ;AAKC,IAAA,WAAW,EAAGC,OAAO,KAAKK,SAAZ,GAAwB,CAAC,CAAEL,OAA3B,GAAqCK,SALpD;AAMC,IAAA,KAAK,EAAGL,OAAO,IAAIC;AANpB,KADD;AAUA;;eAEc,yBAAYL,UAAZ,C","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\n\nfunction IconButton( { labelPosition, size, tooltip, label, ...props }, ref ) {\n\tdeprecated( 'wp.components.IconButton', {\n\t\tsince: '5.4',\n\t\talternative: 'wp.components.Button',\n\t} );\n\n\treturn (\n\t\t<Button\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t\ttooltipPosition={ labelPosition }\n\t\t\ticonSize={ size }\n\t\t\tshowTooltip={ tooltip !== undefined ? !! tooltip : undefined }\n\t\t\tlabel={ tooltip || label }\n\t\t/>\n\t);\n}\n\nexport default forwardRef( IconButton );\n"]}