@wordpress/components 17.0.0 → 19.0.2

package/build-module/number-control/index.js

@@ -20,31 +20,34 @@ import { Input } from './styles/number-control-styles';
 import * as inputControlActionTypes from '../input-control/reducer/actions';
 import { composeStateReducers } from '../input-control/reducer/reducer';
 import { add, subtract, roundClamp } from '../utils/math';
-import { useJumpStep } from '../utils/hooks';
 import { isValueEmpty } from '../utils/values';
-export function NumberControl({
-  __unstableStateReducer: stateReducer = state => state,
-  className,
-  dragDirection = 'n',
-  hideHTMLArrows = false,
-  isDragEnabled = true,
-  isShiftStepEnabled = true,
-  label,
-  max = Infinity,
-  min = -Infinity,
-  required = false,
-  shiftStep = 10,
-  step = 1,
-  type: typeProp = 'number',
-  value: valueProp,
-  ...props
-}, ref) {
-  const baseValue = roundClamp(0, min, max, step);
-  const jumpStep = useJumpStep({
-    step,
-    shiftStep,
-    isShiftStepEnabled
-  });
+export function NumberControl(_ref, ref) {
+  let {
+    __unstableStateReducer: stateReducer = state => state,
+    className,
+    dragDirection = 'n',
+    hideHTMLArrows = false,
+    isDragEnabled = true,
+    isShiftStepEnabled = true,
+    label,
+    max = Infinity,
+    min = -Infinity,
+    required = false,
+    shiftStep = 10,
+    step = 1,
+    type: typeProp = 'number',
+    value: valueProp,
+    ...props
+  } = _ref;
+  const isStepAny = step === 'any';
+  const baseStep = isStepAny ? 1 : parseFloat(step);
+  const baseValue = roundClamp(0, min, max, baseStep);
+
+  const constrainValue = (value, stepOverride) => {
+    // When step is "any" clamp the value, otherwise round and clamp it
+    return isStepAny ? Math.min(max, Math.max(min, value)) : roundClamp(value, min, max, stepOverride !== null && stepOverride !== void 0 ? stepOverride : baseStep);
+  };
+
   const autoComplete = typeProp === 'number' ? 'off' : null;
   const classes = classNames('components-number-control', className);
   /**
@@ -70,7 +73,7 @@ export function NumberControl({
 
     if (type === inputControlActionTypes.PRESS_UP || type === inputControlActionTypes.PRESS_DOWN) {
       const enableShift = event.shiftKey && isShiftStepEnabled;
-      const incrementalValue = enableShift ? parseFloat(shiftStep) * parseFloat(step) : parseFloat(step);
+      const incrementalValue = enableShift ? parseFloat(shiftStep) * baseStep : baseStep;
       let nextValue = isValueEmpty(currentValue) ? baseValue : currentValue;
 
       if (event !== null && event !== void 0 && event.preventDefault) {
@@ -85,8 +88,7 @@ export function NumberControl({
         nextValue = subtract(nextValue, incrementalValue);
       }
 
-      nextValue = roundClamp(nextValue, min, max, incrementalValue);
-      state.value = nextValue;
+      state.value = constrainValue(nextValue, enableShift ? incrementalValue : null);
     }
     /**
      * Handles drag to update events
@@ -94,43 +96,38 @@ export function NumberControl({
 
 
     if (type === inputControlActionTypes.DRAG && isDragEnabled) {
-      const {
-        delta,
-        shiftKey
-      } = payload;
-      const [x, y] = delta;
-      const modifier = shiftKey ? parseFloat(shiftStep) * parseFloat(step) : parseFloat(step);
+      const [x, y] = payload.delta;
+      const enableShift = payload.shiftKey && isShiftStepEnabled;
+      const modifier = enableShift ? parseFloat(shiftStep) * baseStep : baseStep;
       let directionModifier;
-      let directionBaseValue;
+      let delta;
 
       switch (dragDirection) {
         case 'n':
-          directionBaseValue = y;
+          delta = y;
           directionModifier = -1;
           break;
 
         case 'e':
-          directionBaseValue = x;
+          delta = x;
           directionModifier = isRTL() ? -1 : 1;
           break;
 
         case 's':
-          directionBaseValue = y;
+          delta = y;
           directionModifier = 1;
           break;
 
         case 'w':
-          directionBaseValue = x;
+          delta = x;
           directionModifier = isRTL() ? 1 : -1;
           break;
       }
 
-      const distance = directionBaseValue * modifier * directionModifier;
-      let nextValue;
-
-      if (distance !== 0) {
-        nextValue = roundClamp(add(currentValue, distance), min, max, modifier);
-        state.value = nextValue;
+      if (delta !== 0) {
+        delta = Math.ceil(Math.abs(delta)) * Math.sign(delta);
+        const distance = delta * modifier * directionModifier;
+        state.value = constrainValue(add(currentValue, distance), enableShift ? modifier : null);
       }
     }
     /**
@@ -140,7 +137,7 @@ export function NumberControl({
 
     if (type === inputControlActionTypes.PRESS_ENTER || type === inputControlActionTypes.COMMIT) {
       const applyEmptyValue = required === false && currentValue === '';
-      state.value = applyEmptyValue ? currentValue : roundClamp(currentValue, min, max, step);
+      state.value = applyEmptyValue ? currentValue : constrainValue(currentValue);
     }
 
     return state;
@@ -159,7 +156,7 @@ export function NumberControl({
     min: min,
     ref: ref,
     required: required,
-    step: jumpStep,
+    step: step,
     type: typeProp,
     value: valueProp,
     __unstableStateReducer: composeStateReducers(numberControlStateReducer, stateReducer)

package/build-module/number-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/number-control/index.js"],"names":["classNames","forwardRef","isRTL","Input","inputControlActionTypes","composeStateReducers","add","subtract","roundClamp","useJumpStep","isValueEmpty","NumberControl","__unstableStateReducer","stateReducer","state","className","dragDirection","hideHTMLArrows","isDragEnabled","isShiftStepEnabled","label","max","Infinity","min","required","shiftStep","step","type","typeProp","value","valueProp","props","ref","baseValue","jumpStep","autoComplete","classes","numberControlStateReducer","action","payload","event","currentValue","PRESS_UP","PRESS_DOWN","enableShift","shiftKey","incrementalValue","parseFloat","nextValue","preventDefault","DRAG","delta","x","y","modifier","directionModifier","directionBaseValue","distance","PRESS_ENTER","COMMIT","applyEmptyValue"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport classNames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { Input } from './styles/number-control-styles';\nimport * as inputControlActionTypes from '../input-control/reducer/actions';\nimport { composeStateReducers } from '../input-control/reducer/reducer';\nimport { add, subtract, roundClamp } from '../utils/math';\nimport { useJumpStep } from '../utils/hooks';\nimport { isValueEmpty } from '../utils/values';\n\nexport function NumberControl(\n\t{\n\t\t__unstableStateReducer: stateReducer = ( state ) => state,\n\t\tclassName,\n\t\tdragDirection = 'n',\n\t\thideHTMLArrows = false,\n\t\tisDragEnabled = true,\n\t\tisShiftStepEnabled = true,\n\t\tlabel,\n\t\tmax = Infinity,\n\t\tmin = -Infinity,\n\t\trequired = false,\n\t\tshiftStep = 10,\n\t\tstep = 1,\n\t\ttype: typeProp = 'number',\n\t\tvalue: valueProp,\n\t\t...props\n\t},\n\tref\n) {\n\tconst baseValue = roundClamp( 0, min, max, step );\n\n\tconst jumpStep = useJumpStep( {\n\t\tstep,\n\t\tshiftStep,\n\t\tisShiftStepEnabled,\n\t} );\n\n\tconst autoComplete = typeProp === 'number' ? 'off' : null;\n\tconst classes = classNames( 'components-number-control', className );\n\n\t/**\n\t * \"Middleware\" function that intercepts updates from InputControl.\n\t * This allows us to tap into actions to transform the (next) state for\n\t * InputControl.\n\t *\n\t * @param {Object} state  State from InputControl\n\t * @param {Object} action Action triggering state change\n\t * @return {Object} The updated state to apply to InputControl\n\t */\n\tconst numberControlStateReducer = ( state, action ) => {\n\t\tconst { type, payload } = action;\n\t\tconst event = payload?.event;\n\t\tconst currentValue = state.value;\n\n\t\t/**\n\t\t * Handles custom UP and DOWN Keyboard events\n\t\t */\n\t\tif (\n\t\t\ttype === inputControlActionTypes.PRESS_UP ||\n\t\t\ttype === inputControlActionTypes.PRESS_DOWN\n\t\t) {\n\t\t\tconst enableShift = event.shiftKey && isShiftStepEnabled;\n\n\t\t\tconst incrementalValue = enableShift\n\t\t\t\t? parseFloat( shiftStep ) * parseFloat( step )\n\t\t\t\t: parseFloat( step );\n\t\t\tlet nextValue = isValueEmpty( currentValue )\n\t\t\t\t? baseValue\n\t\t\t\t: currentValue;\n\n\t\t\tif ( event?.preventDefault ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\n\t\t\tif ( type === inputControlActionTypes.PRESS_UP ) {\n\t\t\t\tnextValue = add( nextValue, incrementalValue );\n\t\t\t}\n\n\t\t\tif ( type === inputControlActionTypes.PRESS_DOWN ) {\n\t\t\t\tnextValue = subtract( nextValue, incrementalValue );\n\t\t\t}\n\n\t\t\tnextValue = roundClamp( nextValue, min, max, incrementalValue );\n\n\t\t\tstate.value = nextValue;\n\t\t}\n\n\t\t/**\n\t\t * Handles drag to update events\n\t\t */\n\t\tif ( type === inputControlActionTypes.DRAG && isDragEnabled ) {\n\t\t\tconst { delta, shiftKey } = payload;\n\t\t\tconst [ x, y ] = delta;\n\t\t\tconst modifier = shiftKey\n\t\t\t\t? parseFloat( shiftStep ) * parseFloat( step )\n\t\t\t\t: parseFloat( step );\n\n\t\t\tlet directionModifier;\n\t\t\tlet directionBaseValue;\n\n\t\t\tswitch ( dragDirection ) {\n\t\t\t\tcase 'n':\n\t\t\t\t\tdirectionBaseValue = y;\n\t\t\t\t\tdirectionModifier = -1;\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 'e':\n\t\t\t\t\tdirectionBaseValue = x;\n\t\t\t\t\tdirectionModifier = isRTL() ? -1 : 1;\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 's':\n\t\t\t\t\tdirectionBaseValue = y;\n\t\t\t\t\tdirectionModifier = 1;\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 'w':\n\t\t\t\t\tdirectionBaseValue = x;\n\t\t\t\t\tdirectionModifier = isRTL() ? 1 : -1;\n\t\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tconst distance = directionBaseValue * modifier * directionModifier;\n\t\t\tlet nextValue;\n\n\t\t\tif ( distance !== 0 ) {\n\t\t\t\tnextValue = roundClamp(\n\t\t\t\t\tadd( currentValue, distance ),\n\t\t\t\t\tmin,\n\t\t\t\t\tmax,\n\t\t\t\t\tmodifier\n\t\t\t\t);\n\n\t\t\t\tstate.value = nextValue;\n\t\t\t}\n\t\t}\n\n\t\t/**\n\t\t * Handles commit (ENTER key press or on blur if isPressEnterToChange)\n\t\t */\n\t\tif (\n\t\t\ttype === inputControlActionTypes.PRESS_ENTER ||\n\t\t\ttype === inputControlActionTypes.COMMIT\n\t\t) {\n\t\t\tconst applyEmptyValue = required === false && currentValue === '';\n\n\t\t\tstate.value = applyEmptyValue\n\t\t\t\t? currentValue\n\t\t\t\t: roundClamp( currentValue, min, max, step );\n\t\t}\n\n\t\treturn state;\n\t};\n\n\treturn (\n\t\t<Input\n\t\t\tautoComplete={ autoComplete }\n\t\t\tinputMode=\"numeric\"\n\t\t\t{ ...props }\n\t\t\tclassName={ classes }\n\t\t\tdragDirection={ dragDirection }\n\t\t\thideHTMLArrows={ hideHTMLArrows }\n\t\t\tisDragEnabled={ isDragEnabled }\n\t\t\tlabel={ label }\n\t\t\tmax={ max }\n\t\t\tmin={ min }\n\t\t\tref={ ref }\n\t\t\trequired={ required }\n\t\t\tstep={ jumpStep }\n\t\t\ttype={ typeProp }\n\t\t\tvalue={ valueProp }\n\t\t\t__unstableStateReducer={ composeStateReducers(\n\t\t\t\tnumberControlStateReducer,\n\t\t\t\tstateReducer\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default forwardRef( NumberControl );\n"]}
+{"version":3,"sources":["@wordpress/components/src/number-control/index.js"],"names":["classNames","forwardRef","isRTL","Input","inputControlActionTypes","composeStateReducers","add","subtract","roundClamp","isValueEmpty","NumberControl","ref","__unstableStateReducer","stateReducer","state","className","dragDirection","hideHTMLArrows","isDragEnabled","isShiftStepEnabled","label","max","Infinity","min","required","shiftStep","step","type","typeProp","value","valueProp","props","isStepAny","baseStep","parseFloat","baseValue","constrainValue","stepOverride","Math","autoComplete","classes","numberControlStateReducer","action","payload","event","currentValue","PRESS_UP","PRESS_DOWN","enableShift","shiftKey","incrementalValue","nextValue","preventDefault","DRAG","x","y","delta","modifier","directionModifier","ceil","abs","sign","distance","PRESS_ENTER","COMMIT","applyEmptyValue"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport classNames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { Input } from './styles/number-control-styles';\nimport * as inputControlActionTypes from '../input-control/reducer/actions';\nimport { composeStateReducers } from '../input-control/reducer/reducer';\nimport { add, subtract, roundClamp } from '../utils/math';\nimport { isValueEmpty } from '../utils/values';\n\nexport function NumberControl(\n\t{\n\t\t__unstableStateReducer: stateReducer = ( state ) => state,\n\t\tclassName,\n\t\tdragDirection = 'n',\n\t\thideHTMLArrows = false,\n\t\tisDragEnabled = true,\n\t\tisShiftStepEnabled = true,\n\t\tlabel,\n\t\tmax = Infinity,\n\t\tmin = -Infinity,\n\t\trequired = false,\n\t\tshiftStep = 10,\n\t\tstep = 1,\n\t\ttype: typeProp = 'number',\n\t\tvalue: valueProp,\n\t\t...props\n\t},\n\tref\n) {\n\tconst isStepAny = step === 'any';\n\tconst baseStep = isStepAny ? 1 : parseFloat( step );\n\tconst baseValue = roundClamp( 0, min, max, baseStep );\n\tconst constrainValue = ( value, stepOverride ) => {\n\t\t// When step is \"any\" clamp the value, otherwise round and clamp it\n\t\treturn isStepAny\n\t\t\t? Math.min( max, Math.max( min, value ) )\n\t\t\t: roundClamp( value, min, max, stepOverride ?? baseStep );\n\t};\n\n\tconst autoComplete = typeProp === 'number' ? 'off' : null;\n\tconst classes = classNames( 'components-number-control', className );\n\n\t/**\n\t * \"Middleware\" function that intercepts updates from InputControl.\n\t * This allows us to tap into actions to transform the (next) state for\n\t * InputControl.\n\t *\n\t * @param {Object} state  State from InputControl\n\t * @param {Object} action Action triggering state change\n\t * @return {Object} The updated state to apply to InputControl\n\t */\n\tconst numberControlStateReducer = ( state, action ) => {\n\t\tconst { type, payload } = action;\n\t\tconst event = payload?.event;\n\t\tconst currentValue = state.value;\n\n\t\t/**\n\t\t * Handles custom UP and DOWN Keyboard events\n\t\t */\n\t\tif (\n\t\t\ttype === inputControlActionTypes.PRESS_UP ||\n\t\t\ttype === inputControlActionTypes.PRESS_DOWN\n\t\t) {\n\t\t\tconst enableShift = event.shiftKey && isShiftStepEnabled;\n\n\t\t\tconst incrementalValue = enableShift\n\t\t\t\t? parseFloat( shiftStep ) * baseStep\n\t\t\t\t: baseStep;\n\t\t\tlet nextValue = isValueEmpty( currentValue )\n\t\t\t\t? baseValue\n\t\t\t\t: currentValue;\n\n\t\t\tif ( event?.preventDefault ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\n\t\t\tif ( type === inputControlActionTypes.PRESS_UP ) {\n\t\t\t\tnextValue = add( nextValue, incrementalValue );\n\t\t\t}\n\n\t\t\tif ( type === inputControlActionTypes.PRESS_DOWN ) {\n\t\t\t\tnextValue = subtract( nextValue, incrementalValue );\n\t\t\t}\n\n\t\t\tstate.value = constrainValue(\n\t\t\t\tnextValue,\n\t\t\t\tenableShift ? incrementalValue : null\n\t\t\t);\n\t\t}\n\n\t\t/**\n\t\t * Handles drag to update events\n\t\t */\n\t\tif ( type === inputControlActionTypes.DRAG && isDragEnabled ) {\n\t\t\tconst [ x, y ] = payload.delta;\n\t\t\tconst enableShift = payload.shiftKey && isShiftStepEnabled;\n\t\t\tconst modifier = enableShift\n\t\t\t\t? parseFloat( shiftStep ) * baseStep\n\t\t\t\t: baseStep;\n\n\t\t\tlet directionModifier;\n\t\t\tlet delta;\n\n\t\t\tswitch ( dragDirection ) {\n\t\t\t\tcase 'n':\n\t\t\t\t\tdelta = y;\n\t\t\t\t\tdirectionModifier = -1;\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 'e':\n\t\t\t\t\tdelta = x;\n\t\t\t\t\tdirectionModifier = isRTL() ? -1 : 1;\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 's':\n\t\t\t\t\tdelta = y;\n\t\t\t\t\tdirectionModifier = 1;\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 'w':\n\t\t\t\t\tdelta = x;\n\t\t\t\t\tdirectionModifier = isRTL() ? 1 : -1;\n\t\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tif ( delta !== 0 ) {\n\t\t\t\tdelta = Math.ceil( Math.abs( delta ) ) * Math.sign( delta );\n\t\t\t\tconst distance = delta * modifier * directionModifier;\n\n\t\t\t\tstate.value = constrainValue(\n\t\t\t\t\tadd( currentValue, distance ),\n\t\t\t\t\tenableShift ? modifier : null\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\n\t\t/**\n\t\t * Handles commit (ENTER key press or on blur if isPressEnterToChange)\n\t\t */\n\t\tif (\n\t\t\ttype === inputControlActionTypes.PRESS_ENTER ||\n\t\t\ttype === inputControlActionTypes.COMMIT\n\t\t) {\n\t\t\tconst applyEmptyValue = required === false && currentValue === '';\n\n\t\t\tstate.value = applyEmptyValue\n\t\t\t\t? currentValue\n\t\t\t\t: constrainValue( currentValue );\n\t\t}\n\n\t\treturn state;\n\t};\n\n\treturn (\n\t\t<Input\n\t\t\tautoComplete={ autoComplete }\n\t\t\tinputMode=\"numeric\"\n\t\t\t{ ...props }\n\t\t\tclassName={ classes }\n\t\t\tdragDirection={ dragDirection }\n\t\t\thideHTMLArrows={ hideHTMLArrows }\n\t\t\tisDragEnabled={ isDragEnabled }\n\t\t\tlabel={ label }\n\t\t\tmax={ max }\n\t\t\tmin={ min }\n\t\t\tref={ ref }\n\t\t\trequired={ required }\n\t\t\tstep={ step }\n\t\t\ttype={ typeProp }\n\t\t\tvalue={ valueProp }\n\t\t\t__unstableStateReducer={ composeStateReducers(\n\t\t\t\tnumberControlStateReducer,\n\t\t\t\tstateReducer\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default forwardRef( NumberControl );\n"]}

package/build-module/number-control/styles/number-control-styles.js

@@ -24,9 +24,10 @@ var _ref = process.env.NODE_ENV === "production" ? {
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
 
-const htmlArrowStyles = ({
-  hideHTMLArrows
-}) => {
+const htmlArrowStyles = _ref2 => {
+  let {
+    hideHTMLArrows
+  } = _ref2;
   if (!hideHTMLArrows) return ``;
   return _ref;
 };

package/build-module/number-control/styles/number-control-styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/number-control/styles/number-control-styles.js"],"names":["css","InputControl","htmlArrowStyles","hideHTMLArrows","Input"],"mappings":";;;;AAAA;;AACA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,gBAApB;;AAEA;AACA;AACA;AACA,OAAOC,YAAP,MAAyB,qBAAzB;;;;;;;;;;;;AAEA,MAAMC,eAAe,GAAG,CAAE;AAAEC,EAAAA;AAAF,CAAF,KAA0B;AACjD,MAAK,CAAEA,cAAP,EAAwB,OAAQ,EAAR;AAExB;AAWA,CAdD;;AAgBA,OAAO,MAAMC,KAAK,GAAG,qBAAQH,YAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,CACdC,eADc,yzCAAX","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n/**\n * Internal dependencies\n */\nimport InputControl from '../../input-control';\n\nconst htmlArrowStyles = ( { hideHTMLArrows } ) => {\n\tif ( ! hideHTMLArrows ) return ``;\n\n\treturn css`\n\t\tinput[type='number']::-webkit-outer-spin-button,\n\t\tinput[type='number']::-webkit-inner-spin-button {\n\t\t\t-webkit-appearance: none !important;\n\t\t\tmargin: 0 !important;\n\t\t}\n\n\t\tinput[type='number'] {\n\t\t\t-moz-appearance: textfield;\n\t\t}\n\t`;\n};\n\nexport const Input = styled( InputControl )`\n\t${ htmlArrowStyles };\n`;\n"]}
+{"version":3,"sources":["@wordpress/components/src/number-control/styles/number-control-styles.js"],"names":["css","InputControl","htmlArrowStyles","hideHTMLArrows","Input"],"mappings":";;;;AAAA;;AACA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,gBAApB;;AAEA;AACA;AACA;AACA,OAAOC,YAAP,MAAyB,qBAAzB;;;;;;;;;;;;AAEA,MAAMC,eAAe,GAAG,SAA0B;AAAA,MAAxB;AAAEC,IAAAA;AAAF,GAAwB;AACjD,MAAK,CAAEA,cAAP,EAAwB,OAAQ,EAAR;AAExB;AAWA,CAdD;;AAgBA,OAAO,MAAMC,KAAK,GAAG,qBAAQH,YAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,CACdC,eADc,yzCAAX","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n/**\n * Internal dependencies\n */\nimport InputControl from '../../input-control';\n\nconst htmlArrowStyles = ( { hideHTMLArrows } ) => {\n\tif ( ! hideHTMLArrows ) return ``;\n\n\treturn css`\n\t\tinput[type='number']::-webkit-outer-spin-button,\n\t\tinput[type='number']::-webkit-inner-spin-button {\n\t\t\t-webkit-appearance: none !important;\n\t\t\tmargin: 0 !important;\n\t\t}\n\n\t\tinput[type='number'] {\n\t\t\t-moz-appearance: textfield;\n\t\t}\n\t`;\n};\n\nexport const Input = styled( InputControl )`\n\t${ htmlArrowStyles };\n`;\n"]}

package/build-module/panel/actions.native.js

@@ -18,15 +18,17 @@ import { useMemo } from '@wordpress/element';
 import styles from './actions.scss';
 import BottomSeparatorCover from './bottom-separator-cover';
 
-function PanelActions({
-  actions,
-  getStylesFromColorScheme
-}) {
+function PanelActions(_ref) {
+  let {
+    actions,
+    getStylesFromColorScheme
+  } = _ref;
   const mappedActions = useMemo(() => {
-    return actions.map(({
-      label,
-      onPress
-    }) => {
+    return actions.map(_ref2 => {
+      let {
+        label,
+        onPress
+      } = _ref2;
       return createElement(TextControl, {
         label: label,
         onPress: onPress,

package/build-module/panel/actions.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/actions.native.js"],"names":["View","TextControl","withPreferredColorScheme","useMemo","styles","BottomSeparatorCover","PanelActions","actions","getStylesFromColorScheme","mappedActions","map","label","onPress","defaultLabelStyle","panelActionsContainer","panelActionsContainerDark"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,cAArB;AAEA;AACA;AACA;;AACA,SAASC,WAAT,QAA4B,uBAA5B;AACA,SAASC,wBAAT,QAAyC,oBAAzC;AACA,SAASC,OAAT,QAAwB,oBAAxB;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,gBAAnB;AACA,OAAOC,oBAAP,MAAiC,0BAAjC;;AAEA,SAASC,YAAT,CAAuB;AAAEC,EAAAA,OAAF;AAAWC,EAAAA;AAAX,CAAvB,EAA+D;AAC9D,QAAMC,aAAa,GAAGN,OAAO,CAAE,MAAM;AACpC,WAAOI,OAAO,CAACG,GAAR,CAAa,CAAE;AAAEC,MAAAA,KAAF;AAASC,MAAAA;AAAT,KAAF,KAA0B;AAC7C,aACC,cAAC,WAAD;AACC,QAAA,KAAK,EAAGD,KADT;AAEC,QAAA,OAAO,EAAGC,OAFX;AAGC,QAAA,UAAU,EAAGR,MAAM,CAACS,iBAHrB;AAIC,QAAA,GAAG,EAAGF;AAJP,QADD;AAQA,KATM,CAAP;AAUA,GAX4B,EAW1B,CAAEJ,OAAF,CAX0B,CAA7B;AAaA,SACC,cAAC,IAAD;AACC,IAAA,KAAK,EAAGC,wBAAwB,CAC/BJ,MAAM,CAACU,qBADwB,EAE/BV,MAAM,CAACW,yBAFwB;AADjC,KAMGN,aANH,EAOC,cAAC,oBAAD,OAPD,CADD;AAWA;;AAED,eAAeP,wBAAwB,CAAEI,YAAF,CAAvC","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { TextControl } from '@wordpress/components';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport styles from './actions.scss';\nimport BottomSeparatorCover from './bottom-separator-cover';\n\nfunction PanelActions( { actions, getStylesFromColorScheme } ) {\n\tconst mappedActions = useMemo( () => {\n\t\treturn actions.map( ( { label, onPress } ) => {\n\t\t\treturn (\n\t\t\t\t<TextControl\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tonPress={ onPress }\n\t\t\t\t\tlabelStyle={ styles.defaultLabelStyle }\n\t\t\t\t\tkey={ label }\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\t}, [ actions ] );\n\n\treturn (\n\t\t<View\n\t\t\tstyle={ getStylesFromColorScheme(\n\t\t\t\tstyles.panelActionsContainer,\n\t\t\t\tstyles.panelActionsContainerDark\n\t\t\t) }\n\t\t>\n\t\t\t{ mappedActions }\n\t\t\t<BottomSeparatorCover />\n\t\t</View>\n\t);\n}\n\nexport default withPreferredColorScheme( PanelActions );\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/actions.native.js"],"names":["View","TextControl","withPreferredColorScheme","useMemo","styles","BottomSeparatorCover","PanelActions","actions","getStylesFromColorScheme","mappedActions","map","label","onPress","defaultLabelStyle","panelActionsContainer","panelActionsContainerDark"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,cAArB;AAEA;AACA;AACA;;AACA,SAASC,WAAT,QAA4B,uBAA5B;AACA,SAASC,wBAAT,QAAyC,oBAAzC;AACA,SAASC,OAAT,QAAwB,oBAAxB;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,gBAAnB;AACA,OAAOC,oBAAP,MAAiC,0BAAjC;;AAEA,SAASC,YAAT,OAA+D;AAAA,MAAxC;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,GAAwC;AAC9D,QAAMC,aAAa,GAAGN,OAAO,CAAE,MAAM;AACpC,WAAOI,OAAO,CAACG,GAAR,CAAa,SAA0B;AAAA,UAAxB;AAAEC,QAAAA,KAAF;AAASC,QAAAA;AAAT,OAAwB;AAC7C,aACC,cAAC,WAAD;AACC,QAAA,KAAK,EAAGD,KADT;AAEC,QAAA,OAAO,EAAGC,OAFX;AAGC,QAAA,UAAU,EAAGR,MAAM,CAACS,iBAHrB;AAIC,QAAA,GAAG,EAAGF;AAJP,QADD;AAQA,KATM,CAAP;AAUA,GAX4B,EAW1B,CAAEJ,OAAF,CAX0B,CAA7B;AAaA,SACC,cAAC,IAAD;AACC,IAAA,KAAK,EAAGC,wBAAwB,CAC/BJ,MAAM,CAACU,qBADwB,EAE/BV,MAAM,CAACW,yBAFwB;AADjC,KAMGN,aANH,EAOC,cAAC,oBAAD,OAPD,CADD;AAWA;;AAED,eAAeP,wBAAwB,CAAEI,YAAF,CAAvC","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { TextControl } from '@wordpress/components';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport styles from './actions.scss';\nimport BottomSeparatorCover from './bottom-separator-cover';\n\nfunction PanelActions( { actions, getStylesFromColorScheme } ) {\n\tconst mappedActions = useMemo( () => {\n\t\treturn actions.map( ( { label, onPress } ) => {\n\t\t\treturn (\n\t\t\t\t<TextControl\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tonPress={ onPress }\n\t\t\t\t\tlabelStyle={ styles.defaultLabelStyle }\n\t\t\t\t\tkey={ label }\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\t}, [ actions ] );\n\n\treturn (\n\t\t<View\n\t\t\tstyle={ getStylesFromColorScheme(\n\t\t\t\tstyles.panelActionsContainer,\n\t\t\t\tstyles.panelActionsContainerDark\n\t\t\t) }\n\t\t>\n\t\t\t{ mappedActions }\n\t\t\t<BottomSeparatorCover />\n\t\t</View>\n\t);\n}\n\nexport default withPreferredColorScheme( PanelActions );\n"]}

package/build-module/panel/body.js

@@ -20,17 +20,18 @@ import { chevronUp, chevronDown } from '@wordpress/icons';
 import Button from '../button';
 import Icon from '../icon';
 import { useControlledState, useUpdateEffect } from '../utils';
-export function PanelBody({
-  buttonProps = {},
-  children,
-  className,
-  icon,
-  initialOpen,
-  onToggle = noop,
-  opened,
-  title,
-  scrollAfterOpen = true
-}, ref) {
+export function PanelBody(_ref, ref) {
+  let {
+    buttonProps = {},
+    children,
+    className,
+    icon,
+    initialOpen,
+    onToggle = noop,
+    opened,
+    title,
+    scrollAfterOpen = true
+  } = _ref;
   const [isOpened, setIsOpened] = useControlledState(opened, {
     initial: initialOpen === undefined ? true : initialOpen
   });
@@ -81,12 +82,13 @@ export function PanelBody({
     opened: isOpened
   }) : isOpened && children);
 }
-const PanelBodyTitle = forwardRef(({
-  isOpened,
-  icon,
-  title,
-  ...props
-}, ref) => {
+const PanelBodyTitle = forwardRef((_ref2, ref) => {
+  let {
+    isOpened,
+    icon,
+    title,
+    ...props
+  } = _ref2;
   if (!title) return null;
   return createElement("h2", {
     className: "components-panel__body-title"

package/build-module/panel/body.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/body.js"],"names":["classnames","noop","useReducedMotion","useMergeRefs","forwardRef","useRef","chevronUp","chevronDown","Button","Icon","useControlledState","useUpdateEffect","PanelBody","buttonProps","children","className","icon","initialOpen","onToggle","opened","title","scrollAfterOpen","ref","isOpened","setIsOpened","initial","undefined","nodeRef","scrollBehavior","handleOnToggle","event","preventDefault","next","scrollAfterOpenRef","current","scrollIntoView","inline","block","behavior","classes","PanelBodyTitle","props","ForwardedComponent","displayName"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { noop } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useReducedMotion, useMergeRefs } from '@wordpress/compose';\nimport { forwardRef, useRef } from '@wordpress/element';\nimport { chevronUp, chevronDown } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Icon from '../icon';\nimport { useControlledState, useUpdateEffect } from '../utils';\n\nexport function PanelBody(\n\t{\n\t\tbuttonProps = {},\n\t\tchildren,\n\t\tclassName,\n\t\ticon,\n\t\tinitialOpen,\n\t\tonToggle = noop,\n\t\topened,\n\t\ttitle,\n\t\tscrollAfterOpen = true,\n\t},\n\tref\n) {\n\tconst [ isOpened, setIsOpened ] = useControlledState( opened, {\n\t\tinitial: initialOpen === undefined ? true : initialOpen,\n\t} );\n\tconst nodeRef = useRef();\n\n\t// Defaults to 'smooth' scrolling\n\t// https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView\n\tconst scrollBehavior = useReducedMotion() ? 'auto' : 'smooth';\n\n\tconst handleOnToggle = ( event ) => {\n\t\tevent.preventDefault();\n\t\tconst next = ! isOpened;\n\t\tsetIsOpened( next );\n\t\tonToggle( next );\n\t};\n\n\t// Ref is used so that the effect does not re-run upon scrollAfterOpen changing value\n\tconst scrollAfterOpenRef = useRef();\n\tscrollAfterOpenRef.current = scrollAfterOpen;\n\t// Runs after initial render\n\tuseUpdateEffect( () => {\n\t\tif (\n\t\t\tisOpened &&\n\t\t\tscrollAfterOpenRef.current &&\n\t\t\tnodeRef.current?.scrollIntoView\n\t\t) {\n\t\t\t/*\n\t\t\t * Scrolls the content into view when visible.\n\t\t\t * This improves the UX when there are multiple stacking <PanelBody />\n\t\t\t * components in a scrollable container.\n\t\t\t */\n\t\t\tnodeRef.current.scrollIntoView( {\n\t\t\t\tinline: 'nearest',\n\t\t\t\tblock: 'nearest',\n\t\t\t\tbehavior: scrollBehavior,\n\t\t\t} );\n\t\t}\n\t}, [ isOpened, scrollBehavior ] );\n\n\tconst classes = classnames( 'components-panel__body', className, {\n\t\t'is-opened': isOpened,\n\t} );\n\n\treturn (\n\t\t<div className={ classes } ref={ useMergeRefs( [ nodeRef, ref ] ) }>\n\t\t\t<PanelBodyTitle\n\t\t\t\ticon={ icon }\n\t\t\t\tisOpened={ isOpened }\n\t\t\t\tonClick={ handleOnToggle }\n\t\t\t\ttitle={ title }\n\t\t\t\t{ ...buttonProps }\n\t\t\t/>\n\t\t\t{ typeof children === 'function'\n\t\t\t\t? children( { opened: isOpened } )\n\t\t\t\t: isOpened && children }\n\t\t</div>\n\t);\n}\n\nconst PanelBodyTitle = forwardRef(\n\t( { isOpened, icon, title, ...props }, ref ) => {\n\t\tif ( ! title ) return null;\n\n\t\treturn (\n\t\t\t<h2 className=\"components-panel__body-title\">\n\t\t\t\t<Button\n\t\t\t\t\tclassName=\"components-panel__body-toggle\"\n\t\t\t\t\taria-expanded={ isOpened }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ /*\n\t\t\t\t\tFirefox + NVDA don't announce aria-expanded because the browser\n\t\t\t\t\trepaints the whole element, so this wrapping span hides that.\n\t\t\t\t*/ }\n\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tclassName=\"components-panel__arrow\"\n\t\t\t\t\t\t\ticon={ isOpened ? chevronUp : chevronDown }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</span>\n\t\t\t\t\t{ title }\n\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\tclassName=\"components-panel__icon\"\n\t\t\t\t\t\t\tsize={ 20 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</Button>\n\t\t\t</h2>\n\t\t);\n\t}\n);\n\nconst ForwardedComponent = forwardRef( PanelBody );\nForwardedComponent.displayName = 'PanelBody';\n\nexport default ForwardedComponent;\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/body.js"],"names":["classnames","noop","useReducedMotion","useMergeRefs","forwardRef","useRef","chevronUp","chevronDown","Button","Icon","useControlledState","useUpdateEffect","PanelBody","ref","buttonProps","children","className","icon","initialOpen","onToggle","opened","title","scrollAfterOpen","isOpened","setIsOpened","initial","undefined","nodeRef","scrollBehavior","handleOnToggle","event","preventDefault","next","scrollAfterOpenRef","current","scrollIntoView","inline","block","behavior","classes","PanelBodyTitle","props","ForwardedComponent","displayName"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { noop } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useReducedMotion, useMergeRefs } from '@wordpress/compose';\nimport { forwardRef, useRef } from '@wordpress/element';\nimport { chevronUp, chevronDown } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Icon from '../icon';\nimport { useControlledState, useUpdateEffect } from '../utils';\n\nexport function PanelBody(\n\t{\n\t\tbuttonProps = {},\n\t\tchildren,\n\t\tclassName,\n\t\ticon,\n\t\tinitialOpen,\n\t\tonToggle = noop,\n\t\topened,\n\t\ttitle,\n\t\tscrollAfterOpen = true,\n\t},\n\tref\n) {\n\tconst [ isOpened, setIsOpened ] = useControlledState( opened, {\n\t\tinitial: initialOpen === undefined ? true : initialOpen,\n\t} );\n\tconst nodeRef = useRef();\n\n\t// Defaults to 'smooth' scrolling\n\t// https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView\n\tconst scrollBehavior = useReducedMotion() ? 'auto' : 'smooth';\n\n\tconst handleOnToggle = ( event ) => {\n\t\tevent.preventDefault();\n\t\tconst next = ! isOpened;\n\t\tsetIsOpened( next );\n\t\tonToggle( next );\n\t};\n\n\t// Ref is used so that the effect does not re-run upon scrollAfterOpen changing value\n\tconst scrollAfterOpenRef = useRef();\n\tscrollAfterOpenRef.current = scrollAfterOpen;\n\t// Runs after initial render\n\tuseUpdateEffect( () => {\n\t\tif (\n\t\t\tisOpened &&\n\t\t\tscrollAfterOpenRef.current &&\n\t\t\tnodeRef.current?.scrollIntoView\n\t\t) {\n\t\t\t/*\n\t\t\t * Scrolls the content into view when visible.\n\t\t\t * This improves the UX when there are multiple stacking <PanelBody />\n\t\t\t * components in a scrollable container.\n\t\t\t */\n\t\t\tnodeRef.current.scrollIntoView( {\n\t\t\t\tinline: 'nearest',\n\t\t\t\tblock: 'nearest',\n\t\t\t\tbehavior: scrollBehavior,\n\t\t\t} );\n\t\t}\n\t}, [ isOpened, scrollBehavior ] );\n\n\tconst classes = classnames( 'components-panel__body', className, {\n\t\t'is-opened': isOpened,\n\t} );\n\n\treturn (\n\t\t<div className={ classes } ref={ useMergeRefs( [ nodeRef, ref ] ) }>\n\t\t\t<PanelBodyTitle\n\t\t\t\ticon={ icon }\n\t\t\t\tisOpened={ isOpened }\n\t\t\t\tonClick={ handleOnToggle }\n\t\t\t\ttitle={ title }\n\t\t\t\t{ ...buttonProps }\n\t\t\t/>\n\t\t\t{ typeof children === 'function'\n\t\t\t\t? children( { opened: isOpened } )\n\t\t\t\t: isOpened && children }\n\t\t</div>\n\t);\n}\n\nconst PanelBodyTitle = forwardRef(\n\t( { isOpened, icon, title, ...props }, ref ) => {\n\t\tif ( ! title ) return null;\n\n\t\treturn (\n\t\t\t<h2 className=\"components-panel__body-title\">\n\t\t\t\t<Button\n\t\t\t\t\tclassName=\"components-panel__body-toggle\"\n\t\t\t\t\taria-expanded={ isOpened }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ /*\n\t\t\t\t\tFirefox + NVDA don't announce aria-expanded because the browser\n\t\t\t\t\trepaints the whole element, so this wrapping span hides that.\n\t\t\t\t*/ }\n\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tclassName=\"components-panel__arrow\"\n\t\t\t\t\t\t\ticon={ isOpened ? chevronUp : chevronDown }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</span>\n\t\t\t\t\t{ title }\n\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\tclassName=\"components-panel__icon\"\n\t\t\t\t\t\t\tsize={ 20 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</Button>\n\t\t\t</h2>\n\t\t);\n\t}\n);\n\nconst ForwardedComponent = forwardRef( PanelBody );\nForwardedComponent.displayName = 'PanelBody';\n\nexport default ForwardedComponent;\n"]}

package/build-module/panel/body.native.js

@@ -10,12 +10,13 @@ import { Text, View } from 'react-native';
 
 import styles from './body.scss';
 import BottomSeparatorCover from './bottom-separator-cover';
-export function PanelBody({
-  children,
-  title,
-  style,
-  titleStyle = {}
-}) {
+export function PanelBody(_ref) {
+  let {
+    children,
+    title,
+    style,
+    titleStyle = {}
+  } = _ref;
   return createElement(View, {
     style: [styles.panelContainer, style]
   }, title && createElement(Text, {

package/build-module/panel/body.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/body.native.js"],"names":["Text","View","styles","BottomSeparatorCover","PanelBody","children","title","style","titleStyle","panelContainer","sectionHeaderText"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,IAAT,EAAeC,IAAf,QAA2B,cAA3B;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,aAAnB;AACA,OAAOC,oBAAP,MAAiC,0BAAjC;AAEA,OAAO,SAASC,SAAT,CAAoB;AAAEC,EAAAA,QAAF;AAAYC,EAAAA,KAAZ;AAAmBC,EAAAA,KAAnB;AAA0BC,EAAAA,UAAU,GAAG;AAAvC,CAApB,EAAkE;AACxE,SACC,cAAC,IAAD;AAAM,IAAA,KAAK,EAAG,CAAEN,MAAM,CAACO,cAAT,EAAyBF,KAAzB;AAAd,KACGD,KAAK,IACN,cAAC,IAAD;AACC,IAAA,iBAAiB,EAAC,QADnB;AAEC,IAAA,KAAK,EAAG,CAAEJ,MAAM,CAACQ,iBAAT,EAA4BF,UAA5B;AAFT,KAIGF,KAJH,CAFF,EASGD,QATH,EAUC,cAAC,oBAAD,OAVD,CADD;AAcA;AAED,eAAeD,SAAf","sourcesContent":["/**\n * External dependencies\n */\nimport { Text, View } from 'react-native';\n\n/**\n * Internal dependencies\n */\nimport styles from './body.scss';\nimport BottomSeparatorCover from './bottom-separator-cover';\n\nexport function PanelBody( { children, title, style, titleStyle = {} } ) {\n\treturn (\n\t\t<View style={ [ styles.panelContainer, style ] }>\n\t\t\t{ title && (\n\t\t\t\t<Text\n\t\t\t\t\taccessibilityRole=\"header\"\n\t\t\t\t\tstyle={ [ styles.sectionHeaderText, titleStyle ] }\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</Text>\n\t\t\t) }\n\t\t\t{ children }\n\t\t\t<BottomSeparatorCover />\n\t\t</View>\n\t);\n}\n\nexport default PanelBody;\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/body.native.js"],"names":["Text","View","styles","BottomSeparatorCover","PanelBody","children","title","style","titleStyle","panelContainer","sectionHeaderText"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,IAAT,EAAeC,IAAf,QAA2B,cAA3B;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,aAAnB;AACA,OAAOC,oBAAP,MAAiC,0BAAjC;AAEA,OAAO,SAASC,SAAT,OAAkE;AAAA,MAA9C;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,KAAZ;AAAmBC,IAAAA,KAAnB;AAA0BC,IAAAA,UAAU,GAAG;AAAvC,GAA8C;AACxE,SACC,cAAC,IAAD;AAAM,IAAA,KAAK,EAAG,CAAEN,MAAM,CAACO,cAAT,EAAyBF,KAAzB;AAAd,KACGD,KAAK,IACN,cAAC,IAAD;AACC,IAAA,iBAAiB,EAAC,QADnB;AAEC,IAAA,KAAK,EAAG,CAAEJ,MAAM,CAACQ,iBAAT,EAA4BF,UAA5B;AAFT,KAIGF,KAJH,CAFF,EASGD,QATH,EAUC,cAAC,oBAAD,OAVD,CADD;AAcA;AAED,eAAeD,SAAf","sourcesContent":["/**\n * External dependencies\n */\nimport { Text, View } from 'react-native';\n\n/**\n * Internal dependencies\n */\nimport styles from './body.scss';\nimport BottomSeparatorCover from './bottom-separator-cover';\n\nexport function PanelBody( { children, title, style, titleStyle = {} } ) {\n\treturn (\n\t\t<View style={ [ styles.panelContainer, style ] }>\n\t\t\t{ title && (\n\t\t\t\t<Text\n\t\t\t\t\taccessibilityRole=\"header\"\n\t\t\t\t\tstyle={ [ styles.sectionHeaderText, titleStyle ] }\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</Text>\n\t\t\t) }\n\t\t\t{ children }\n\t\t\t<BottomSeparatorCover />\n\t\t</View>\n\t);\n}\n\nexport default PanelBody;\n"]}

package/build-module/panel/bottom-separator-cover.native.js

@@ -15,9 +15,10 @@ import { withPreferredColorScheme } from '@wordpress/compose';
 
 import styles from './bottom-separator-cover.scss';
 
-function BottomSeparatorCover({
-  getStylesFromColorScheme
-}) {
+function BottomSeparatorCover(_ref) {
+  let {
+    getStylesFromColorScheme
+  } = _ref;
   return createElement(View, {
     style: getStylesFromColorScheme(styles.coverSeparator, styles.coverSeparatorDark)
   });

package/build-module/panel/bottom-separator-cover.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/bottom-separator-cover.native.js"],"names":["View","withPreferredColorScheme","styles","BottomSeparatorCover","getStylesFromColorScheme","coverSeparator","coverSeparatorDark"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,cAArB;AAEA;AACA;AACA;;AACA,SAASC,wBAAT,QAAyC,oBAAzC;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,+BAAnB;;AAEA,SAASC,oBAAT,CAA+B;AAAEC,EAAAA;AAAF,CAA/B,EAA8D;AAC7D,SACC,cAAC,IAAD;AACC,IAAA,KAAK,EAAGA,wBAAwB,CAC/BF,MAAM,CAACG,cADwB,EAE/BH,MAAM,CAACI,kBAFwB;AADjC,IADD;AAQA;;AAED,eAAeL,wBAAwB,CAAEE,oBAAF,CAAvC","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './bottom-separator-cover.scss';\n\nfunction BottomSeparatorCover( { getStylesFromColorScheme } ) {\n\treturn (\n\t\t<View\n\t\t\tstyle={ getStylesFromColorScheme(\n\t\t\t\tstyles.coverSeparator,\n\t\t\t\tstyles.coverSeparatorDark\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default withPreferredColorScheme( BottomSeparatorCover );\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/bottom-separator-cover.native.js"],"names":["View","withPreferredColorScheme","styles","BottomSeparatorCover","getStylesFromColorScheme","coverSeparator","coverSeparatorDark"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,cAArB;AAEA;AACA;AACA;;AACA,SAASC,wBAAT,QAAyC,oBAAzC;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,+BAAnB;;AAEA,SAASC,oBAAT,OAA8D;AAAA,MAA/B;AAAEC,IAAAA;AAAF,GAA+B;AAC7D,SACC,cAAC,IAAD;AACC,IAAA,KAAK,EAAGA,wBAAwB,CAC/BF,MAAM,CAACG,cADwB,EAE/BH,MAAM,CAACI,kBAFwB;AADjC,IADD;AAQA;;AAED,eAAeL,wBAAwB,CAAEE,oBAAF,CAAvC","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './bottom-separator-cover.scss';\n\nfunction BottomSeparatorCover( { getStylesFromColorScheme } ) {\n\treturn (\n\t\t<View\n\t\t\tstyle={ getStylesFromColorScheme(\n\t\t\t\tstyles.coverSeparator,\n\t\t\t\tstyles.coverSeparatorDark\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default withPreferredColorScheme( BottomSeparatorCover );\n"]}

package/build-module/panel/header.js

@@ -1,9 +1,10 @@
 import { createElement } from "@wordpress/element";
 
-function PanelHeader({
-  label,
-  children
-}) {
+function PanelHeader(_ref) {
+  let {
+    label,
+    children
+  } = _ref;
   return createElement("div", {
     className: "components-panel__header"
   }, label && createElement("h2", null, label), children);

package/build-module/panel/header.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/header.js"],"names":["PanelHeader","label","children"],"mappings":";;AAAA,SAASA,WAAT,CAAsB;AAAEC,EAAAA,KAAF;AAASC,EAAAA;AAAT,CAAtB,EAA4C;AAC3C,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGD,KAAK,IAAI,0BAAMA,KAAN,CADZ,EAEGC,QAFH,CADD;AAMA;;AAED,eAAeF,WAAf","sourcesContent":["function PanelHeader( { label, children } ) {\n\treturn (\n\t\t<div className=\"components-panel__header\">\n\t\t\t{ label && <h2>{ label }</h2> }\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\nexport default PanelHeader;\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/header.js"],"names":["PanelHeader","label","children"],"mappings":";;AAAA,SAASA,WAAT,OAA4C;AAAA,MAAtB;AAAEC,IAAAA,KAAF;AAASC,IAAAA;AAAT,GAAsB;AAC3C,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGD,KAAK,IAAI,0BAAMA,KAAN,CADZ,EAEGC,QAFH,CADD;AAMA;;AAED,eAAeF,WAAf","sourcesContent":["function PanelHeader( { label, children } ) {\n\treturn (\n\t\t<div className=\"components-panel__header\">\n\t\t\t{ label && <h2>{ label }</h2> }\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\nexport default PanelHeader;\n"]}

package/build-module/panel/index.js

@@ -15,11 +15,12 @@ import { forwardRef } from '@wordpress/element';
 
 import PanelHeader from './header';
 
-function Panel({
-  header,
-  className,
-  children
-}, ref) {
+function Panel(_ref, ref) {
+  let {
+    header,
+    className,
+    children
+  } = _ref;
   const classNames = classnames(className, 'components-panel');
   return createElement("div", {
     className: classNames,

package/build-module/panel/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/index.js"],"names":["classnames","forwardRef","PanelHeader","Panel","header","className","children","ref","classNames"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,WAAP,MAAwB,UAAxB;;AAEA,SAASC,KAAT,CAAgB;AAAEC,EAAAA,MAAF;AAAUC,EAAAA,SAAV;AAAqBC,EAAAA;AAArB,CAAhB,EAAiDC,GAAjD,EAAuD;AACtD,QAAMC,UAAU,GAAGR,UAAU,CAAEK,SAAF,EAAa,kBAAb,CAA7B;AACA,SACC;AAAK,IAAA,SAAS,EAAGG,UAAjB;AAA8B,IAAA,GAAG,EAAGD;AAApC,KACGH,MAAM,IAAI,cAAC,WAAD;AAAa,IAAA,KAAK,EAAGA;AAArB,IADb,EAEGE,QAFH,CADD;AAMA;;AAED,eAAeL,UAAU,CAAEE,KAAF,CAAzB","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport PanelHeader from './header';\n\nfunction Panel( { header, className, children }, ref ) {\n\tconst classNames = classnames( className, 'components-panel' );\n\treturn (\n\t\t<div className={ classNames } ref={ ref }>\n\t\t\t{ header && <PanelHeader label={ header } /> }\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\nexport default forwardRef( Panel );\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/index.js"],"names":["classnames","forwardRef","PanelHeader","Panel","ref","header","className","children","classNames"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,WAAP,MAAwB,UAAxB;;AAEA,SAASC,KAAT,OAAiDC,GAAjD,EAAuD;AAAA,MAAvC;AAAEC,IAAAA,MAAF;AAAUC,IAAAA,SAAV;AAAqBC,IAAAA;AAArB,GAAuC;AACtD,QAAMC,UAAU,GAAGR,UAAU,CAAEM,SAAF,EAAa,kBAAb,CAA7B;AACA,SACC;AAAK,IAAA,SAAS,EAAGE,UAAjB;AAA8B,IAAA,GAAG,EAAGJ;AAApC,KACGC,MAAM,IAAI,cAAC,WAAD;AAAa,IAAA,KAAK,EAAGA;AAArB,IADb,EAEGE,QAFH,CADD;AAMA;;AAED,eAAeN,UAAU,CAAEE,KAAF,CAAzB","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport PanelHeader from './header';\n\nfunction Panel( { header, className, children }, ref ) {\n\tconst classNames = classnames( className, 'components-panel' );\n\treturn (\n\t\t<div className={ classNames } ref={ ref }>\n\t\t\t{ header && <PanelHeader label={ header } /> }\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\nexport default forwardRef( Panel );\n"]}

package/build-module/panel/row.js

@@ -9,12 +9,15 @@ import classnames from 'classnames';
  */
 
 import { forwardRef } from '@wordpress/element';
-const PanelRow = forwardRef(({
-  className,
-  children
-}, ref) => createElement("div", {
-  className: classnames('components-panel__row', className),
-  ref: ref
-}, children));
+const PanelRow = forwardRef((_ref, ref) => {
+  let {
+    className,
+    children
+  } = _ref;
+  return createElement("div", {
+    className: classnames('components-panel__row', className),
+    ref: ref
+  }, children);
+});
 export default PanelRow;
 //# sourceMappingURL=row.js.map

package/build-module/panel/row.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/row.js"],"names":["classnames","forwardRef","PanelRow","className","children","ref"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA,MAAMC,QAAQ,GAAGD,UAAU,CAAE,CAAE;AAAEE,EAAAA,SAAF;AAAaC,EAAAA;AAAb,CAAF,EAA2BC,GAA3B,KAC5B;AACC,EAAA,SAAS,EAAGL,UAAU,CAAE,uBAAF,EAA2BG,SAA3B,CADvB;AAEC,EAAA,GAAG,EAAGE;AAFP,GAIGD,QAJH,CAD0B,CAA3B;AASA,eAAeF,QAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\nconst PanelRow = forwardRef( ( { className, children }, ref ) => (\n\t<div\n\t\tclassName={ classnames( 'components-panel__row', className ) }\n\t\tref={ ref }\n\t>\n\t\t{ children }\n\t</div>\n) );\n\nexport default PanelRow;\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/row.js"],"names":["classnames","forwardRef","PanelRow","ref","className","children"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA,MAAMC,QAAQ,GAAGD,UAAU,CAAE,OAA2BE,GAA3B;AAAA,MAAE;AAAEC,IAAAA,SAAF;AAAaC,IAAAA;AAAb,GAAF;AAAA,SAC5B;AACC,IAAA,SAAS,EAAGL,UAAU,CAAE,uBAAF,EAA2BI,SAA3B,CADvB;AAEC,IAAA,GAAG,EAAGD;AAFP,KAIGE,QAJH,CAD4B;AAAA,CAAF,CAA3B;AASA,eAAeH,QAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\nconst PanelRow = forwardRef( ( { className, children }, ref ) => (\n\t<div\n\t\tclassName={ classnames( 'components-panel__row', className ) }\n\t\tref={ ref }\n\t>\n\t\t{ children }\n\t</div>\n) );\n\nexport default PanelRow;\n"]}

package/build-module/placeholder/index.js

@@ -31,17 +31,18 @@ import Icon from '../icon';
  * @return {Object} The rendered placeholder.
  */
 
-function Placeholder({
-  icon,
-  children,
-  label,
-  instructions,
-  className,
-  notices,
-  preview,
-  isColumnLayout,
-  ...additionalProps
-}) {
+function Placeholder(_ref) {
+  let {
+    icon,
+    children,
+    label,
+    instructions,
+    className,
+    notices,
+    preview,
+    isColumnLayout,
+    ...additionalProps
+  } = _ref;
   const [resizeListener, {
     width
   }] = useResizeObserver(); // Since `useResizeObserver` will report a width of `null` until after the

package/build-module/placeholder/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/placeholder/index.js"],"names":["classnames","useResizeObserver","Icon","Placeholder","icon","children","label","instructions","className","notices","preview","isColumnLayout","additionalProps","resizeListener","width","modifierClassNames","classes","fieldsetClasses"],"mappings":";;;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,iBAAT,QAAkC,oBAAlC;AAEA;AACA;AACA;;AACA,OAAOC,IAAP,MAAiB,SAAjB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,WAAT,CAAsB;AACrBC,EAAAA,IADqB;AAErBC,EAAAA,QAFqB;AAGrBC,EAAAA,KAHqB;AAIrBC,EAAAA,YAJqB;AAKrBC,EAAAA,SALqB;AAMrBC,EAAAA,OANqB;AAOrBC,EAAAA,OAPqB;AAQrBC,EAAAA,cARqB;AASrB,KAAGC;AATkB,CAAtB,EAUI;AACH,QAAM,CAAEC,cAAF,EAAkB;AAAEC,IAAAA;AAAF,GAAlB,IAAgCb,iBAAiB,EAAvD,CADG,CAGH;AACA;;AACA,MAAIc,kBAAJ;;AACA,MAAK,OAAOD,KAAP,KAAiB,QAAtB,EAAiC;AAChCC,IAAAA,kBAAkB,GAAG;AACpB,kBAAYD,KAAK,IAAI,GADD;AAEpB,mBAAaA,KAAK,IAAI,GAAT,IAAgBA,KAAK,GAAG,GAFjB;AAGpB,kBAAYA,KAAK,GAAG;AAHA,KAArB;AAKA;;AAED,QAAME,OAAO,GAAGhB,UAAU,CACzB,wBADyB,EAEzBQ,SAFyB,EAGzBO,kBAHyB,CAA1B;AAKA,QAAME,eAAe,GAAGjB,UAAU,CAAE,kCAAF,EAAsC;AACvE,wBAAoBW;AADmD,GAAtC,CAAlC;AAGA,SACC,kCAAUC,eAAV;AAA4B,IAAA,SAAS,EAAGI;AAAxC,MACGH,cADH,EAEGJ,OAFH,EAGGC,OAAO,IACR;AAAK,IAAA,SAAS,EAAC;AAAf,KACGA,OADH,CAJF,EAQC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,cAAC,IAAD;AAAM,IAAA,IAAI,EAAGN;AAAb,IADD,EAEGE,KAFH,CARD,EAYG,CAAC,CAAEC,YAAH,IACD;AAAK,IAAA,SAAS,EAAC;AAAf,KACGA,YADH,CAbF,EAiBC;AAAK,IAAA,SAAS,EAAGU;AAAjB,KAAqCZ,QAArC,CAjBD,CADD;AAqBA;;AAED,eAAeF,WAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useResizeObserver } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Icon from '../icon';\n\n/**\n * Renders a placeholder. Normally used by blocks to render their empty state.\n *\n * @param {Object}    props                The component props.\n * @param {WPIcon}    props.icon           An icon rendered before the label.\n * @param {WPElement} props.children       Children to be rendered.\n * @param {string}    props.label          Title of the placeholder.\n * @param {string}    props.instructions   Instructions of the placeholder.\n * @param {string}    props.className      Class to set on the container div.\n * @param {Object}    props.notices        A rendered notices list.\n * @param {Object}    props.preview        Preview to be rendered in the placeholder.\n * @param {boolean}   props.isColumnLayout Whether a column layout should be used.\n *\n * @return {Object} The rendered placeholder.\n */\nfunction Placeholder( {\n\ticon,\n\tchildren,\n\tlabel,\n\tinstructions,\n\tclassName,\n\tnotices,\n\tpreview,\n\tisColumnLayout,\n\t...additionalProps\n} ) {\n\tconst [ resizeListener, { width } ] = useResizeObserver();\n\n\t// Since `useResizeObserver` will report a width of `null` until after the\n\t// first render, avoid applying any modifier classes until width is known.\n\tlet modifierClassNames;\n\tif ( typeof width === 'number' ) {\n\t\tmodifierClassNames = {\n\t\t\t'is-large': width >= 480,\n\t\t\t'is-medium': width >= 160 && width < 480,\n\t\t\t'is-small': width < 160,\n\t\t};\n\t}\n\n\tconst classes = classnames(\n\t\t'components-placeholder',\n\t\tclassName,\n\t\tmodifierClassNames\n\t);\n\tconst fieldsetClasses = classnames( 'components-placeholder__fieldset', {\n\t\t'is-column-layout': isColumnLayout,\n\t} );\n\treturn (\n\t\t<div { ...additionalProps } className={ classes }>\n\t\t\t{ resizeListener }\n\t\t\t{ notices }\n\t\t\t{ preview && (\n\t\t\t\t<div className=\"components-placeholder__preview\">\n\t\t\t\t\t{ preview }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-placeholder__label\">\n\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t{ label }\n\t\t\t</div>\n\t\t\t{ !! instructions && (\n\t\t\t\t<div className=\"components-placeholder__instructions\">\n\t\t\t\t\t{ instructions }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className={ fieldsetClasses }>{ children }</div>\n\t\t</div>\n\t);\n}\n\nexport default Placeholder;\n"]}
+{"version":3,"sources":["@wordpress/components/src/placeholder/index.js"],"names":["classnames","useResizeObserver","Icon","Placeholder","icon","children","label","instructions","className","notices","preview","isColumnLayout","additionalProps","resizeListener","width","modifierClassNames","classes","fieldsetClasses"],"mappings":";;;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,iBAAT,QAAkC,oBAAlC;AAEA;AACA;AACA;;AACA,OAAOC,IAAP,MAAiB,SAAjB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,WAAT,OAUI;AAAA,MAVkB;AACrBC,IAAAA,IADqB;AAErBC,IAAAA,QAFqB;AAGrBC,IAAAA,KAHqB;AAIrBC,IAAAA,YAJqB;AAKrBC,IAAAA,SALqB;AAMrBC,IAAAA,OANqB;AAOrBC,IAAAA,OAPqB;AAQrBC,IAAAA,cARqB;AASrB,OAAGC;AATkB,GAUlB;AACH,QAAM,CAAEC,cAAF,EAAkB;AAAEC,IAAAA;AAAF,GAAlB,IAAgCb,iBAAiB,EAAvD,CADG,CAGH;AACA;;AACA,MAAIc,kBAAJ;;AACA,MAAK,OAAOD,KAAP,KAAiB,QAAtB,EAAiC;AAChCC,IAAAA,kBAAkB,GAAG;AACpB,kBAAYD,KAAK,IAAI,GADD;AAEpB,mBAAaA,KAAK,IAAI,GAAT,IAAgBA,KAAK,GAAG,GAFjB;AAGpB,kBAAYA,KAAK,GAAG;AAHA,KAArB;AAKA;;AAED,QAAME,OAAO,GAAGhB,UAAU,CACzB,wBADyB,EAEzBQ,SAFyB,EAGzBO,kBAHyB,CAA1B;AAKA,QAAME,eAAe,GAAGjB,UAAU,CAAE,kCAAF,EAAsC;AACvE,wBAAoBW;AADmD,GAAtC,CAAlC;AAGA,SACC,kCAAUC,eAAV;AAA4B,IAAA,SAAS,EAAGI;AAAxC,MACGH,cADH,EAEGJ,OAFH,EAGGC,OAAO,IACR;AAAK,IAAA,SAAS,EAAC;AAAf,KACGA,OADH,CAJF,EAQC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,cAAC,IAAD;AAAM,IAAA,IAAI,EAAGN;AAAb,IADD,EAEGE,KAFH,CARD,EAYG,CAAC,CAAEC,YAAH,IACD;AAAK,IAAA,SAAS,EAAC;AAAf,KACGA,YADH,CAbF,EAiBC;AAAK,IAAA,SAAS,EAAGU;AAAjB,KAAqCZ,QAArC,CAjBD,CADD;AAqBA;;AAED,eAAeF,WAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useResizeObserver } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Icon from '../icon';\n\n/**\n * Renders a placeholder. Normally used by blocks to render their empty state.\n *\n * @param {Object}    props                The component props.\n * @param {WPIcon}    props.icon           An icon rendered before the label.\n * @param {WPElement} props.children       Children to be rendered.\n * @param {string}    props.label          Title of the placeholder.\n * @param {string}    props.instructions   Instructions of the placeholder.\n * @param {string}    props.className      Class to set on the container div.\n * @param {Object}    props.notices        A rendered notices list.\n * @param {Object}    props.preview        Preview to be rendered in the placeholder.\n * @param {boolean}   props.isColumnLayout Whether a column layout should be used.\n *\n * @return {Object} The rendered placeholder.\n */\nfunction Placeholder( {\n\ticon,\n\tchildren,\n\tlabel,\n\tinstructions,\n\tclassName,\n\tnotices,\n\tpreview,\n\tisColumnLayout,\n\t...additionalProps\n} ) {\n\tconst [ resizeListener, { width } ] = useResizeObserver();\n\n\t// Since `useResizeObserver` will report a width of `null` until after the\n\t// first render, avoid applying any modifier classes until width is known.\n\tlet modifierClassNames;\n\tif ( typeof width === 'number' ) {\n\t\tmodifierClassNames = {\n\t\t\t'is-large': width >= 480,\n\t\t\t'is-medium': width >= 160 && width < 480,\n\t\t\t'is-small': width < 160,\n\t\t};\n\t}\n\n\tconst classes = classnames(\n\t\t'components-placeholder',\n\t\tclassName,\n\t\tmodifierClassNames\n\t);\n\tconst fieldsetClasses = classnames( 'components-placeholder__fieldset', {\n\t\t'is-column-layout': isColumnLayout,\n\t} );\n\treturn (\n\t\t<div { ...additionalProps } className={ classes }>\n\t\t\t{ resizeListener }\n\t\t\t{ notices }\n\t\t\t{ preview && (\n\t\t\t\t<div className=\"components-placeholder__preview\">\n\t\t\t\t\t{ preview }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-placeholder__label\">\n\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t{ label }\n\t\t\t</div>\n\t\t\t{ !! instructions && (\n\t\t\t\t<div className=\"components-placeholder__instructions\">\n\t\t\t\t\t{ instructions }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className={ fieldsetClasses }>{ children }</div>\n\t\t</div>\n\t);\n}\n\nexport default Placeholder;\n"]}