npm - @wordpress/components - Versions diffs - 25.1.0 → 25.1.1 - Mend

@wordpress/components 25.1.0 → 25.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (993) hide show

package/build/unit-control/index.native.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/unit-control/index.native.js"],"names":["UnitControl","currentInput","label","value","onChange","onUnitChange","initialPosition","min","max","separatorType","units","CSS_UNITS","unit","getStylesFromColorScheme","props","pickerRef","anchorNodeRef","onPickerPresent","current","presentPicker","currentInputValue","initialControlValue","isFinite","unitButtonTextStyle","styles","unitButtonText","unitButtonTextDark","accessibilityLabel","accessibilityHint","Platform","OS","renderUnitButton","unitButton","length","getAnchor","undefined","getDecimal","step","stepToString","splitStep","toString","split","renderUnitPicker","unitMenu","activeUnit","find","option","decimalNum"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport {\n\tText,\n\tView,\n\tTouchableWithoutFeedback,\n\tPlatform,\n\tfindNodeHandle,\n} from 'react-native';\n\n/\n Internal dependencies\n /\nimport RangeCell from '../mobile/bottom-sheet/range-cell';\nimport StepperCell from '../mobile/bottom-sheet/stepper-cell';\nimport Picker from '../mobile/picker';\nimport styles from './style.scss';\nimport { CSS_UNITS, hasUnits, getAccessibleLabelForUnit } from './utils';\n\n/\n WordPress dependencies\n /\nimport { useRef, useCallback, useMemo, memo } from '@wordpress/element';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { __, sprintf } from '@wordpress/i18n';\n\nfunction UnitControl( {\n\tcurrentInput,\n\tlabel,\n\tvalue,\n\tonChange,\n\tonUnitChange,\n\tinitialPosition,\n\tmin,\n\tmax,\n\tseparatorType,\n\tunits = CSS_UNITS,\n\tunit,\n\tgetStylesFromColorScheme,\n\t...props\n} ) {\n\tconst pickerRef = useRef();\n\tconst anchorNodeRef = useRef();\n\n\tconst onPickerPresent = useCallback( () => {\n\t\tif ( pickerRef?.current ) {\n\t\t\tpickerRef.current.presentPicker();\n\t\t}\n\t\t// Disable reason: this should be fixed by the native team.\n\t\t// It would be great if this could be done in the context of\n\t\t// https://github.com/WordPress/gutenberg/pull/39218\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ pickerRef?.current ] );\n\n\tconst currentInputValue = currentInput === null ? value : currentInput;\n\tconst initialControlValue = isFinite( currentInputValue )\n\t\t? currentInputValue\n\t\t: initialPosition;\n\n\tconst unitButtonTextStyle = getStylesFromColorScheme(\n\t\tstyles.unitButtonText,\n\t\tstyles.unitButtonTextDark\n\t);\n\n\t/ translators: accessibility text. Inform about current unit value. %s: Current unit value. /\n\tconst accessibilityLabel = sprintf( __( 'Current unit is %s' ), unit );\n\n\tconst accessibilityHint =\n\t\tPlatform.OS === 'ios'\n\t\t\t? __( 'Double tap to open Action Sheet with available options' )\n\t\t\t: __( 'Double tap to open Bottom Sheet with available options' );\n\n\tconst renderUnitButton = useMemo( () => {\n\t\tconst unitButton = (\n\t\t\t<View style={ styles.unitButton }>\n\t\t\t\t<Text style={ unitButtonTextStyle }>{ unit }</Text>\n\t\t\t</View>\n\t\t);\n\n\t\tif ( hasUnits( units ) && units?.length > 1 ) {\n\t\t\treturn (\n\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\tonPress={ onPickerPresent }\n\t\t\t\t\taccessibilityLabel={ accessibilityLabel }\n\t\t\t\t\taccessibilityRole=\"button\"\n\t\t\t\t\taccessibilityHint={ accessibilityHint }\n\t\t\t\t>\n\t\t\t\t\t{ unitButton }\n\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t);\n\t\t}\n\n\t\treturn unitButton;\n\t}, [\n\t\tonPickerPresent,\n\t\taccessibilityLabel,\n\t\taccessibilityHint,\n\t\tunitButtonTextStyle,\n\t\tunit,\n\t\tunits,\n\t] );\n\n\tconst getAnchor = useCallback(\n\t\t() =>\n\t\t\tanchorNodeRef?.current\n\t\t\t\t? findNodeHandle( anchorNodeRef?.current )\n\t\t\t\t: undefined,\n\t\t// Disable reason: this should be fixed by the native team.\n\t\t// It would be great if this could be done in the context of\n\t\t// https://github.com/WordPress/gutenberg/pull/39218\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t[ anchorNodeRef?.current ]\n\t);\n\n\tconst getDecimal = ( step ) => {\n\t\t// Return the decimal offset based on the step size.\n\t\t// if step size is 0.1 we expect the offset to be 1.\n\t\t// for example 12 + 0.1 we would expect the see 12.1 (not 12.10 or 12 );\n\t\t// steps are defined in the CSS_UNITS and they vary from unit to unit.\n\t\tconst stepToString = step;\n\t\tconst splitStep = stepToString.toString().split( '.' );\n\t\treturn splitStep[ 1 ] ? splitStep[ 1 ].length : 0;\n\t};\n\n\tconst renderUnitPicker = useCallback( () => {\n\t\t// Keeping for legacy reasons, although `false` should not be a valid\n\t\t// value for the `units` prop anymore.\n\t\tif ( units === false ) {\n\t\t\treturn null;\n\t\t}\n\t\treturn (\n\t\t\t<View style={ styles.unitMenu } ref={ anchorNodeRef }>\n\t\t\t\t{ renderUnitButton }\n\t\t\t\t{ hasUnits( units ) && units?.length > 1 ? (\n\t\t\t\t\t<Picker\n\t\t\t\t\t\tref={ pickerRef }\n\t\t\t\t\t\toptions={ units }\n\t\t\t\t\t\tonChange={ onUnitChange }\n\t\t\t\t\t\thideCancelButton\n\t\t\t\t\t\tleftAlign\n\t\t\t\t\t\tgetAnchor={ getAnchor }\n\t\t\t\t\t/>\n\t\t\t\t) : null }\n\t\t\t</View>\n\t\t);\n\t}, [ pickerRef, units, onUnitChange, getAnchor, renderUnitButton ] );\n\n\tlet step = props.step;\n\n\t/\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\tconst decimalNum = getDecimal( step );\n\n\treturn (\n\t\t<>\n\t\t\t{ unit !== '%' ? (\n\t\t\t\t<StepperCell\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tmax={ max }\n\t\t\t\t\tmin={ min }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tseparatorType={ separatorType }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tstep={ step }\n\t\t\t\t\tdefaultValue={ initialControlValue }\n\t\t\t\t\tshouldDisplayTextInput\n\t\t\t\t\tdecimalNum={ decimalNum }\n\t\t\t\t\topenUnitPicker={ onPickerPresent }\n\t\t\t\t\tunitLabel={ getAccessibleLabelForUnit( unit ) }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ renderUnitPicker() }\n\t\t\t\t</StepperCell>\n\t\t\t) : (\n\t\t\t\t<RangeCell\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tminimumValue={ min }\n\t\t\t\t\tmaximumValue={ max }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tstep={ step }\n\t\t\t\t\tunit={ unit }\n\t\t\t\t\tdefaultValue={ initialControlValue }\n\t\t\t\t\tseparatorType={ separatorType }\n\t\t\t\t\tdecimalNum={ decimalNum }\n\t\t\t\t\topenUnitPicker={ onPickerPresent }\n\t\t\t\t\tunitLabel={ getAccessibleLabelForUnit( unit ) }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ renderUnitPicker() }\n\t\t\t\t</RangeCell>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport { useCustomUnits } from './utils';\nexport default memo( withPreferredColorScheme( UnitControl ) );\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/unit-control/index.native.js"],"names":["UnitControl","currentInput","label","value","onChange","onUnitChange","initialPosition","min","max","separatorType","units","CSS_UNITS","unit","getStylesFromColorScheme","props","pickerRef","anchorNodeRef","onPickerPresent","current","presentPicker","currentInputValue","initialControlValue","isFinite","unitButtonTextStyle","styles","unitButtonText","unitButtonTextDark","accessibilityLabel","accessibilityHint","Platform","OS","renderUnitButton","unitButton","length","getAnchor","undefined","getDecimal","step","stepToString","splitStep","toString","split","renderUnitPicker","unitMenu","activeUnit","find","option","decimalNum"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport {\n\tText,\n\tView,\n\tTouchableWithoutFeedback,\n\tPlatform,\n\tfindNodeHandle,\n} from 'react-native';\n\n/\n Internal dependencies\n /\nimport RangeCell from '../mobile/bottom-sheet/range-cell';\nimport StepperCell from '../mobile/bottom-sheet/stepper-cell';\nimport Picker from '../mobile/picker';\nimport styles from './style.scss';\nimport { CSS_UNITS, hasUnits, getAccessibleLabelForUnit } from './utils';\n\n/\n WordPress dependencies\n /\nimport { useRef, useCallback, useMemo, memo } from '@wordpress/element';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { __, sprintf } from '@wordpress/i18n';\n\nfunction UnitControl( {\n\tcurrentInput,\n\tlabel,\n\tvalue,\n\tonChange,\n\tonUnitChange,\n\tinitialPosition,\n\tmin,\n\tmax,\n\tseparatorType,\n\tunits = CSS_UNITS,\n\tunit,\n\tgetStylesFromColorScheme,\n\t...props\n} ) {\n\tconst pickerRef = useRef();\n\tconst anchorNodeRef = useRef();\n\n\tconst onPickerPresent = useCallback( () => {\n\t\tif ( pickerRef?.current ) {\n\t\t\tpickerRef.current.presentPicker();\n\t\t}\n\t\t// Disable reason: this should be fixed by the native team.\n\t\t// It would be great if this could be done in the context of\n\t\t// https://github.com/WordPress/gutenberg/pull/39218\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ pickerRef?.current ] );\n\n\tconst currentInputValue = currentInput === null ? value : currentInput;\n\tconst initialControlValue = isFinite( currentInputValue )\n\t\t? currentInputValue\n\t\t: initialPosition;\n\n\tconst unitButtonTextStyle = getStylesFromColorScheme(\n\t\tstyles.unitButtonText,\n\t\tstyles.unitButtonTextDark\n\t);\n\n\t/ translators: accessibility text. Inform about current unit value. %s: Current unit value. /\n\tconst accessibilityLabel = sprintf( __( 'Current unit is %s' ), unit );\n\n\tconst accessibilityHint =\n\t\tPlatform.OS === 'ios'\n\t\t\t? __( 'Double tap to open Action Sheet with available options' )\n\t\t\t: __( 'Double tap to open Bottom Sheet with available options' );\n\n\tconst renderUnitButton = useMemo( () => {\n\t\tconst unitButton = (\n\t\t\t<View style={ styles.unitButton }>\n\t\t\t\t<Text style={ unitButtonTextStyle }>{ unit }</Text>\n\t\t\t</View>\n\t\t);\n\n\t\tif ( hasUnits( units ) && units?.length > 1 ) {\n\t\t\treturn (\n\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\tonPress={ onPickerPresent }\n\t\t\t\t\taccessibilityLabel={ accessibilityLabel }\n\t\t\t\t\taccessibilityRole=\"button\"\n\t\t\t\t\taccessibilityHint={ accessibilityHint }\n\t\t\t\t>\n\t\t\t\t\t{ unitButton }\n\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t);\n\t\t}\n\n\t\treturn unitButton;\n\t}, [\n\t\tonPickerPresent,\n\t\taccessibilityLabel,\n\t\taccessibilityHint,\n\t\tunitButtonTextStyle,\n\t\tunit,\n\t\tunits,\n\t] );\n\n\tconst getAnchor = useCallback(\n\t\t() =>\n\t\t\tanchorNodeRef?.current\n\t\t\t\t? findNodeHandle( anchorNodeRef?.current )\n\t\t\t\t: undefined,\n\t\t// Disable reason: this should be fixed by the native team.\n\t\t// It would be great if this could be done in the context of\n\t\t// https://github.com/WordPress/gutenberg/pull/39218\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t[ anchorNodeRef?.current ]\n\t);\n\n\tconst getDecimal = ( step ) => {\n\t\t// Return the decimal offset based on the step size.\n\t\t// if step size is 0.1 we expect the offset to be 1.\n\t\t// for example 12 + 0.1 we would expect the see 12.1 (not 12.10 or 12 );\n\t\t// steps are defined in the CSS_UNITS and they vary from unit to unit.\n\t\tconst stepToString = step;\n\t\tconst splitStep = stepToString.toString().split( '.' );\n\t\treturn splitStep[ 1 ] ? splitStep[ 1 ].length : 0;\n\t};\n\n\tconst renderUnitPicker = useCallback( () => {\n\t\t// Keeping for legacy reasons, although `false` should not be a valid\n\t\t// value for the `units` prop anymore.\n\t\tif ( units === false ) {\n\t\t\treturn null;\n\t\t}\n\t\treturn (\n\t\t\t<View style={ styles.unitMenu } ref={ anchorNodeRef }>\n\t\t\t\t{ renderUnitButton }\n\t\t\t\t{ hasUnits( units ) && units?.length > 1 ? (\n\t\t\t\t\t<Picker\n\t\t\t\t\t\tref={ pickerRef }\n\t\t\t\t\t\toptions={ units }\n\t\t\t\t\t\tonChange={ onUnitChange }\n\t\t\t\t\t\thideCancelButton\n\t\t\t\t\t\tleftAlign\n\t\t\t\t\t\tgetAnchor={ getAnchor }\n\t\t\t\t\t/>\n\t\t\t\t) : null }\n\t\t\t</View>\n\t\t);\n\t}, [ pickerRef, units, onUnitChange, getAnchor, renderUnitButton ] );\n\n\tlet step = props.step;\n\n\t/\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\tconst decimalNum = getDecimal( step );\n\n\treturn (\n\t\t<>\n\t\t\t{ unit !== '%' ? (\n\t\t\t\t<StepperCell\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tmax={ max }\n\t\t\t\t\tmin={ min }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tseparatorType={ separatorType }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tstep={ step }\n\t\t\t\t\tdefaultValue={ initialControlValue }\n\t\t\t\t\tshouldDisplayTextInput\n\t\t\t\t\tdecimalNum={ decimalNum }\n\t\t\t\t\topenUnitPicker={ onPickerPresent }\n\t\t\t\t\tunitLabel={ getAccessibleLabelForUnit( unit ) }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ renderUnitPicker() }\n\t\t\t\t</StepperCell>\n\t\t\t) : (\n\t\t\t\t<RangeCell\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tminimumValue={ min }\n\t\t\t\t\tmaximumValue={ max }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tstep={ step }\n\t\t\t\t\tunit={ unit }\n\t\t\t\t\tdefaultValue={ initialControlValue }\n\t\t\t\t\tseparatorType={ separatorType }\n\t\t\t\t\tdecimalNum={ decimalNum }\n\t\t\t\t\topenUnitPicker={ onPickerPresent }\n\t\t\t\t\tunitLabel={ getAccessibleLabelForUnit( unit ) }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ renderUnitPicker() }\n\t\t\t\t</RangeCell>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport { useCustomUnits } from './utils';\nexport default memo( withPreferredColorScheme( UnitControl ) );\n"]}

package/build/unit-control/unit-select-control.js CHANGED Viewed

@@ -5,12 +5,10 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = UnitSelectControl;
+exports.default = void 0;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _unitControlStyles = require("./styles/unit-control-styles");
@@ -20,6 +18,10 @@ var _utils = require("./utils");
 /**
  * External dependencies
  */
+/**
+ * WordPress dependencies
+ */
 function UnitSelectControl({
   className,
   isUnitSelectTabbable: isTabbable = true,
@@ -28,7 +30,7 @@ function UnitSelectControl({
   unit = 'px',
   units = _utils.CSS_UNITS,
   ...props
-}) {
+}, ref) {
   if (!(0, _utils.hasUnits)(units) || units?.length === 1) {
     return (0, _element.createElement)(_unitControlStyles.UnitLabel, {
       className: "components-unit-control__unit-label",
@@ -48,15 +50,21 @@ function UnitSelectControl({
   };
   const classes = (0, _classnames.default)('components-unit-control__select', className);
-  return (0, _element.createElement)(_unitControlStyles.UnitSelect, (0, _extends2.default)({
+  return (0, _element.createElement)(_unitControlStyles.UnitSelect, {
+    ref: ref,
     className: classes,
     onChange: handleOnChange,
     selectSize: size,
     tabIndex: isTabbable ? undefined : -1,
-    value: unit
-  }, props), units.map(option => (0, _element.createElement)("option", {
+    value: unit,
+    ...props
+  }, units.map(option => (0, _element.createElement)("option", {
     value: option.value,
     key: option.value
   }, option.label)));
 }
+var _default = (0, _element.forwardRef)(UnitSelectControl);
+exports.default = _default;
 //# sourceMappingURL=unit-select-control.js.map

package/build/unit-control/unit-select-control.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/unit-control/unit-select-control.tsx"],"names":["UnitSelectControl","className","isUnitSelectTabbable","isTabbable","onChange","size","unit","units","CSS_UNITS","props","length","handleOnChange","event","value","unitValue","target","data","find","option","classes","undefined","map","label"],"mappings":"~~;;;;;;;;;;;;;AAGA~~;;~~AAOA~~;;AACA;;~~AAXA~~;AACA;AACA;~~AAYe~~,SAASA,iBAAT,~~CAA4B~~;~~AAC1CC~~,EAAAA,~~SAD0C~~;~~AAE1CC~~,EAAAA,oBAAoB,EAAEC,UAAU,GAAG,~~IAFO~~;~~AAG1CC~~,EAAAA,~~QAH0C~~;~~AAI1CC~~,EAAAA,IAAI,GAAG,~~SAJmC~~;~~AAK1CC~~,EAAAA,IAAI,GAAG,~~IALmC~~;~~AAM1CC~~,EAAAA,KAAK,GAAGC,~~gBANkC~~;~~AAO1C~~,KAAGC;~~AAPuC~~,~~CAA5B~~,~~EAQyD~~;~~AACvE~~,MAAK,CAAE,~~qBAAUF~~,KAAV,CAAF,IAAuBA,KAAK,~~EAAEG~~,MAAP,KAAkB,CAA9C,EAAkD;AACjD,WACC,4BAAC,4BAAD;AACC,MAAA,SAAS,EAAC,qCADX;AAEC,MAAA,UAAU,~~EAAGL~~;AAFd,OAIGC,IAJH,CADD;AAQA;;AAED,~~QAAMK~~,cAAc,GAAKC,KAAF,IAA+C;AACrE,UAAM;AAAEC,MAAAA,KAAK,EAAEC;AAAT,QAAuBF,KAAK,CAACG,MAAnC;AACA,UAAMC,IAAI,~~GAAGT~~,KAAK,~~CAACU~~,IAAN,CAAcC,MAAF,IAAcA,MAAM,CAACL,KAAP,KAAiBC,SAA3C,CAAb;~~AAEAV~~,IAAAA,QAAQ,~~GAAIU~~,SAAJ,EAAe;AAAEF,MAAAA,KAAF;AAASI,MAAAA;AAAT,KAAf,CAAR;AACA,GALD;;AAOA,QAAMG,OAAO,GAAG,yBAAY,iCAAZ,EAA+~~ClB~~,SAA/C,CAAhB;AAEA,SACC,4BAAC,6BAAD;AACC,IAAA,~~SAAS~~,~~EAAGkB~~,~~OADb~~;AAEC,IAAA,QAAQ,EAAGR,~~cAFZ~~;~~AAGC~~,IAAA,UAAU,~~EAAGN~~,~~IAHd~~;~~AAIC~~,IAAA,QAAQ,EAAGF,UAAU,~~GAAGiB~~,SAAH,GAAe,CAAC,~~CAJtC~~;~~AAKC~~,IAAA,KAAK,~~EAAGd~~;~~AALT~~,~~KAMMG~~,~~KANN~~,~~GAQGF,~~KAAK,~~CAACc~~,GAAN,CAAaH,MAAF,IACZ;AAAQ,IAAA,KAAK,EAAGA,MAAM,CAACL,KAAvB;AAA+B,IAAA,GAAG,EAAGK,MAAM,CAACL;AAA5C,KACGK,MAAM,CAACI,KADV,CADC,~~CARH~~,CADD;~~AAgBA~~","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\nimport type { ChangeEvent } from 'react';\n\n/\n Internal dependencies\n */\nimport type { WordPressComponentProps } from '../ui/context';\nimport { UnitSelect, UnitLabel } from './styles/unit-control-styles';\nimport { CSS_UNITS, hasUnits } from './utils';\nimport type { UnitSelectControlProps } from './types';\n\~~nexport~~ ~~default function~~ UnitSelectControl( {\n\tclassName,\n\tisUnitSelectTabbable: isTabbable = true,\n\tonChange,\n\tsize = 'default',\n\tunit = 'px',\n\tunits = CSS_UNITS,\n\t...props\n}: WordPressComponentProps< UnitSelectControlProps, 'select', false > ) {\n\tif ( ! hasUnits( units ) \|\| units?.length === 1 ) {\n\t\treturn (\n\t\t\t<UnitLabel\n\t\t\t\tclassName=\"components-unit-control__unit-label\"\n\t\t\t\tselectSize={ size }\n\t\t\t>\n\t\t\t\t{ unit }\n\t\t\t</UnitLabel>\n\t\t);\n\t}\n\n\tconst handleOnChange = ( event: ChangeEvent< HTMLSelectElement > ) => {\n\t\tconst { value: unitValue } = event.target;\n\t\tconst data = units.find( ( option ) => option.value === unitValue );\n\n\t\tonChange?.( unitValue, { event, data } );\n\t};\n\n\tconst classes = classnames( 'components-unit-control__select', className );\n\n\treturn (\n\t\t<UnitSelect\n\t\t\tclassName={ classes }\n\t\t\tonChange={ handleOnChange }\n\t\t\tselectSize={ size }\n\t\t\ttabIndex={ isTabbable ? undefined : -1 }\n\t\t\tvalue={ unit }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ units.map( ( option ) => (\n\t\t\t\t<option value={ option.value } key={ option.value }>\n\t\t\t\t\t{ option.label }\n\t\t\t\t</option>\n\t\t\t) ) }\n\t\t</UnitSelect>\n\t);\n}\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/unit-control/unit-select-control.tsx"],"names":["UnitSelectControl","className","isUnitSelectTabbable","isTabbable","onChange","size","unit","units","CSS_UNITS","props","ref","length","handleOnChange","event","value","unitValue","target","data","find","option","classes","undefined","map","label"],"mappings":";;;;;;;;;AASA;;AANA;;AAYA;;AACA;;AAhBA;AACA;AACA;;AAIA;AACA;AACA;AAWA,SAASA,iBAAT,CACC;AACCC,EAAAA,SADD;AAECC,EAAAA,oBAAoB,EAAEC,UAAU,GAAG,IAFpC;AAGCC,EAAAA,QAHD;AAICC,EAAAA,IAAI,GAAG,SAJR;AAKCC,EAAAA,IAAI,GAAG,IALR;AAMCC,EAAAA,KAAK,GAAGC,gBANT;AAOC,KAAGC;AAPJ,CADD,EAUCC,GAVD,EAWE;AACD,MAAK,CAAE,qBAAUH,KAAV,CAAF,IAAuBA,KAAK,EAAEI,MAAP,KAAkB,CAA9C,EAAkD;AACjD,WACC,4BAAC,4BAAD;AACC,MAAA,SAAS,EAAC,qCADX;AAEC,MAAA,UAAU,EAAGN;AAFd,OAIGC,IAJH,CADD;AAQA;;AAED,QAAMM,cAAc,GAAKC,KAAF,IAA+C;AACrE,UAAM;AAAEC,MAAAA,KAAK,EAAEC;AAAT,QAAuBF,KAAK,CAACG,MAAnC;AACA,UAAMC,IAAI,GAAGV,KAAK,CAACW,IAAN,CAAcC,MAAF,IAAcA,MAAM,CAACL,KAAP,KAAiBC,SAA3C,CAAb;AAEAX,IAAAA,QAAQ,GAAIW,SAAJ,EAAe;AAAEF,MAAAA,KAAF;AAASI,MAAAA;AAAT,KAAf,CAAR;AACA,GALD;;AAOA,QAAMG,OAAO,GAAG,yBAAY,iCAAZ,EAA+CnB,SAA/C,CAAhB;AAEA,SACC,4BAAC,6BAAD;AACC,IAAA,GAAG,EAAGS,GADP;AAEC,IAAA,SAAS,EAAGU,OAFb;AAGC,IAAA,QAAQ,EAAGR,cAHZ;AAIC,IAAA,UAAU,EAAGP,IAJd;AAKC,IAAA,QAAQ,EAAGF,UAAU,GAAGkB,SAAH,GAAe,CAAC,CALtC;AAMC,IAAA,KAAK,EAAGf,IANT;AAAA,OAOMG;AAPN,KASGF,KAAK,CAACe,GAAN,CAAaH,MAAF,IACZ;AAAQ,IAAA,KAAK,EAAGA,MAAM,CAACL,KAAvB;AAA+B,IAAA,GAAG,EAAGK,MAAM,CAACL;AAA5C,KACGK,MAAM,CAACI,KADV,CADC,CATH,CADD;AAiBA;;eACc,yBAAYvB,iBAAZ,C","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\nimport type { ChangeEvent, ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport type { WordPressComponentProps } from '../ui/context';\nimport { UnitSelect, UnitLabel } from './styles/unit-control-styles';\nimport { CSS_UNITS, hasUnits } from './utils';\nimport type { UnitSelectControlProps } from './types';\n\nfunction UnitSelectControl(\n\t{\n\t\tclassName,\n\t\tisUnitSelectTabbable: isTabbable = true,\n\t\tonChange,\n\t\tsize = 'default',\n\t\tunit = 'px',\n\t\tunits = CSS_UNITS,\n\t\t...props\n\t}: WordPressComponentProps< UnitSelectControlProps, 'select', false >,\n\tref: ForwardedRef< any >\n) {\n\tif ( ! hasUnits( units ) \|\| units?.length === 1 ) {\n\t\treturn (\n\t\t\t<UnitLabel\n\t\t\t\tclassName=\"components-unit-control__unit-label\"\n\t\t\t\tselectSize={ size }\n\t\t\t>\n\t\t\t\t{ unit }\n\t\t\t</UnitLabel>\n\t\t);\n\t}\n\n\tconst handleOnChange = ( event: ChangeEvent< HTMLSelectElement > ) => {\n\t\tconst { value: unitValue } = event.target;\n\t\tconst data = units.find( ( option ) => option.value === unitValue );\n\n\t\tonChange?.( unitValue, { event, data } );\n\t};\n\n\tconst classes = classnames( 'components-unit-control__select', className );\n\n\treturn (\n\t\t<UnitSelect\n\t\t\tref={ ref }\n\t\t\tclassName={ classes }\n\t\t\tonChange={ handleOnChange }\n\t\t\tselectSize={ size }\n\t\t\ttabIndex={ isTabbable ? undefined : -1 }\n\t\t\tvalue={ unit }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ units.map( ( option ) => (\n\t\t\t\t<option value={ option.value } key={ option.value }>\n\t\t\t\t\t{ option.label }\n\t\t\t\t</option>\n\t\t\t) ) }\n\t\t</UnitSelect>\n\t);\n}\nexport default forwardRef( UnitSelectControl );\n"]}

package/build/v-stack/component.js CHANGED Viewed

@@ -1,7 +1,5 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,8 +7,6 @@ exports.default = exports.VStack = void 0;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _context = require("../ui/context");
 var _view = require("../view");
@@ -26,9 +22,9 @@ var _hook = require("./hook");
  */
 function UnconnectedVStack(props, forwardedRef) {
   const vStackProps = (0, _hook.useVStack)(props);
-  return (0, _element.createElement)(_view.View, (0, _extends2.default)({}, vStackProps, {
+  return (0, _element.createElement)(_view.View, { ...vStackProps,
     ref: forwardedRef
-  }));
+  });
 }
 /**
  * `VStack` (or Vertical Stack) is a layout component that arranges child

package/build/v-stack/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/v-stack/component.tsx"],"names":["UnconnectedVStack","props","forwardedRef","vStackProps","VStack"],"mappings":"~~;;;;;;;;;;;;;~~AAQA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAMA,SAASA,iBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,WAAW,GAAG,qBAAWF,KAAX,CAApB;AAEA,SAAO,4BAAC,UAAD,~~6BAAWE~~,WAAX;AAAyB,IAAA,GAAG,EAAGD;AAA/B,~~KAAP~~;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAME,MAAM,GAAG,6BAAgBJ,iBAAhB,EAAmC,QAAnC,CAAf;;eAEQI,M","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport { contextConnect, WordPressComponentProps } from '../ui/context';\nimport { View } from '../view';\nimport { useVStack } from './hook';\nimport type { VStackProps } from './types';\n\nfunction UnconnectedVStack(\n\tprops: WordPressComponentProps< VStackProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst vStackProps = useVStack( props );\n\n\treturn <View { ...vStackProps } ref={ forwardedRef } />;\n}\n\n/\n `VStack` (or Vertical Stack) is a layout component that arranges child\n * elements in a vertical line.\n \n `VStack` can render anything inside.\n \n ```jsx\n * import {\n * \t__experimentalText as Text,\n * \t__experimentalVStack as VStack,\n * } from `@wordpress/components`;\n \n function Example() {\n * \treturn (\n * \t\t<VStack>\n * \t\t\t<Text>Code</Text>\n * \t\t\t<Text>is</Text>\n * \t\t\t<Text>Poetry</Text>\n * \t\t</VStack>\n * \t);\n * }\n * ```\n */\nexport const VStack = contextConnect( UnconnectedVStack, 'VStack' );\n\nexport default VStack;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/v-stack/component.tsx"],"names":["UnconnectedVStack","props","forwardedRef","vStackProps","VStack"],"mappings":";;;;;;;;;AAQA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAMA,SAASA,iBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,WAAW,GAAG,qBAAWF,KAAX,CAApB;AAEA,SAAO,4BAAC,UAAD,OAAWE,WAAX;AAAyB,IAAA,GAAG,EAAGD;AAA/B,IAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAME,MAAM,GAAG,6BAAgBJ,iBAAhB,EAAmC,QAAnC,CAAf;;eAEQI,M","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport { contextConnect, WordPressComponentProps } from '../ui/context';\nimport { View } from '../view';\nimport { useVStack } from './hook';\nimport type { VStackProps } from './types';\n\nfunction UnconnectedVStack(\n\tprops: WordPressComponentProps< VStackProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst vStackProps = useVStack( props );\n\n\treturn <View { ...vStackProps } ref={ forwardedRef } />;\n}\n\n/\n `VStack` (or Vertical Stack) is a layout component that arranges child\n * elements in a vertical line.\n \n `VStack` can render anything inside.\n \n ```jsx\n * import {\n * \t__experimentalText as Text,\n * \t__experimentalVStack as VStack,\n * } from `@wordpress/components`;\n \n function Example() {\n * \treturn (\n * \t\t<VStack>\n * \t\t\t<Text>Code</Text>\n * \t\t\t<Text>is</Text>\n * \t\t\t<Text>Poetry</Text>\n * \t\t</VStack>\n * \t);\n * }\n * ```\n */\nexport const VStack = contextConnect( UnconnectedVStack, 'VStack' );\n\nexport default VStack;\n"]}

package/build/visually-hidden/component.js CHANGED Viewed

@@ -1,7 +1,5 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,8 +7,6 @@ exports.default = exports.VisuallyHidden = void 0;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _context = require("../ui/context");
 var _styles = require("./styles");
@@ -29,13 +25,13 @@ function UnconnectedVisuallyHidden(props, forwardedRef) {
     style: styleProp,
     ...contextProps
   } = (0, _context.useContextSystem)(props, 'VisuallyHidden');
-  return (0, _element.createElement)(_view.View, (0, _extends2.default)({
-    ref: forwardedRef
-  }, contextProps, {
+  return (0, _element.createElement)(_view.View, {
+    ref: forwardedRef,
+    ...contextProps,
     style: { ..._styles.visuallyHidden,
       ...(styleProp || {})
     }
-  }));
+  });
 }
 /**
  * `VisuallyHidden` is a component used to render text intended to be visually

package/build/visually-hidden/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/visually-hidden/component.tsx"],"names":["UnconnectedVisuallyHidden","props","forwardedRef","style","styleProp","contextProps","visuallyHidden","VisuallyHidden"],"mappings":"~~;;;;;;;;;;;;;~~AAQA;;AAKA;;AACA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;AAUA,SAASA,yBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAM;AAAEC,IAAAA,KAAK,EAAEC,SAAT;AAAoB,OAAGC;AAAvB,MAAwC,+BAC7CJ,KAD6C,EAE7C,gBAF6C,CAA9C;AAIA,SACC,4BAAC,UAAD;AACC,IAAA,GAAG,EAAGC;~~AADP~~,~~KAEMG~~,YAFN;AAGC,IAAA,KAAK,EAAG,EAAE,GAAGC,sBAAL;AAAqB,UAAKF,SAAS,IAAI,EAAlB;AAArB;AAHT,~~KADD~~;AAOA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMG,cAAc,GAAG,6BAC7BP,yBAD6B,EAE7B,gBAF6B,CAAvB;;eAKQO,c","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport {\n\tuseContextSystem,\n\tcontextConnect,\n\tWordPressComponentProps,\n} from '../ui/context';\nimport { visuallyHidden } from './styles';\nimport { View } from '../view';\nimport type { VisuallyHiddenProps } from './types';\n\nfunction UnconnectedVisuallyHidden(\n\tprops: WordPressComponentProps< VisuallyHiddenProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst { style: styleProp, ...contextProps } = useContextSystem(\n\t\tprops,\n\t\t'VisuallyHidden'\n\t);\n\treturn (\n\t\t<View\n\t\t\tref={ forwardedRef }\n\t\t\t{ ...contextProps }\n\t\t\tstyle={ { ...visuallyHidden, ...( styleProp \|\| {} ) } }\n\t\t/>\n\t);\n}\n\n/\n `VisuallyHidden` is a component used to render text intended to be visually\n * hidden, but will show for alternate devices, for example a screen reader.\n \n ```jsx\n * import { VisuallyHidden } from `@wordpress/components`;\n \n function Example() {\n * return (\n * <VisuallyHidden>\n * <label>Code is Poetry</label>\n * </VisuallyHidden>\n * );\n * }\n * ```\n */\nexport const VisuallyHidden = contextConnect(\n\tUnconnectedVisuallyHidden,\n\t'VisuallyHidden'\n);\n\nexport default VisuallyHidden;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/visually-hidden/component.tsx"],"names":["UnconnectedVisuallyHidden","props","forwardedRef","style","styleProp","contextProps","visuallyHidden","VisuallyHidden"],"mappings":";;;;;;;;;AAQA;;AAKA;;AACA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;AAUA,SAASA,yBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAM;AAAEC,IAAAA,KAAK,EAAEC,SAAT;AAAoB,OAAGC;AAAvB,MAAwC,+BAC7CJ,KAD6C,EAE7C,gBAF6C,CAA9C;AAIA,SACC,4BAAC,UAAD;AACC,IAAA,GAAG,EAAGC,YADP;AAAA,OAEMG,YAFN;AAGC,IAAA,KAAK,EAAG,EAAE,GAAGC,sBAAL;AAAqB,UAAKF,SAAS,IAAI,EAAlB;AAArB;AAHT,IADD;AAOA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMG,cAAc,GAAG,6BAC7BP,yBAD6B,EAE7B,gBAF6B,CAAvB;;eAKQO,c","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport {\n\tuseContextSystem,\n\tcontextConnect,\n\tWordPressComponentProps,\n} from '../ui/context';\nimport { visuallyHidden } from './styles';\nimport { View } from '../view';\nimport type { VisuallyHiddenProps } from './types';\n\nfunction UnconnectedVisuallyHidden(\n\tprops: WordPressComponentProps< VisuallyHiddenProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst { style: styleProp, ...contextProps } = useContextSystem(\n\t\tprops,\n\t\t'VisuallyHidden'\n\t);\n\treturn (\n\t\t<View\n\t\t\tref={ forwardedRef }\n\t\t\t{ ...contextProps }\n\t\t\tstyle={ { ...visuallyHidden, ...( styleProp \|\| {} ) } }\n\t\t/>\n\t);\n}\n\n/\n `VisuallyHidden` is a component used to render text intended to be visually\n * hidden, but will show for alternate devices, for example a screen reader.\n \n ```jsx\n * import { VisuallyHidden } from `@wordpress/components`;\n \n function Example() {\n * return (\n * <VisuallyHidden>\n * <label>Code is Poetry</label>\n * </VisuallyHidden>\n * );\n * }\n * ```\n */\nexport const VisuallyHidden = contextConnect(\n\tUnconnectedVisuallyHidden,\n\t'VisuallyHidden'\n);\n\nexport default VisuallyHidden;\n"]}

package/build/z-stack/component.js CHANGED Viewed

@@ -1,7 +1,5 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,8 +7,6 @@ exports.default = exports.ZStack = void 0;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _getValidChildren = require("../ui/utils/get-valid-children");
 var _context = require("../ui/context");
@@ -50,10 +46,10 @@ function UnconnectedZStack(props, forwardedRef) {
       key: key
     }, child);
   });
-  return (0, _element.createElement)(_styles.ZStackView, (0, _extends2.default)({}, otherProps, {
+  return (0, _element.createElement)(_styles.ZStackView, { ...otherProps,
     className: className,
     ref: forwardedRef
-  }), clonedChildren);
+  }, clonedChildren);
 }
 /**
  * `ZStack` allows you to stack things along the Z-axis.

package/build/z-stack/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/z-stack/component.tsx"],"names":["UnconnectedZStack","props","forwardedRef","children","className","isLayered","isReversed","offset","otherProps","validChildren","childrenLastIndex","length","clonedChildren","map","child","index","zIndex","offsetAmount","key","ZStack"],"mappings":"~~;;;;;;;;;~~AAQA~~;;;;~~AAKA;;AACA;;AACA;;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAOA,SAASA,iBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAM;AACLC,IAAAA,QADK;AAELC,IAAAA,SAFK;AAGLC,IAAAA,SAAS,GAAG,IAHP;AAILC,IAAAA,UAAU,GAAG,KAJR;AAKLC,IAAAA,MAAM,GAAG,CALJ;AAML,OAAGC;AANE,MAOF,+BAAkBP,KAAlB,EAAyB,QAAzB,CAPJ;AASA,QAAMQ,aAAa,GAAG,wCAAkBN,QAAlB,CAAtB;AACA,QAAMO,iBAAiB,GAAGD,aAAa,CAACE,MAAd,GAAuB,CAAjD;AAEA,QAAMC,cAAc,GAAGH,aAAa,CAACI,GAAd,CAAmB,CAAEC,KAAF,EAASC,KAAT,KAAoB;AAC7D,UAAMC,MAAM,GAAGV,UAAU,GAAGI,iBAAiB,GAAGK,KAAvB,GAA+BA,KAAxD;AACA,UAAME,YAAY,GAAGV,MAAM,GAAGQ,KAA9B;AAEA,UAAMG,GAAG,GAAG,6BAAgBJ,KAAhB,IAA0BA,KAAK,CAACI,GAAhC,GAAsCH,KAAlD;AAEA,WACC,4BAAC,uBAAD;AACC,MAAA,SAAS,EAAGV,SADb;AAEC,MAAA,YAAY,EAAGY,YAFhB;AAGC,MAAA,MAAM,EAAGD,MAHV;AAIC,MAAA,GAAG,EAAGE;AAJP,OAMGJ,KANH,CADD;AAUA,GAhBsB,CAAvB;AAkBA,SACC,4BAAC,kBAAD,~~6BACMN~~,UADN;AAEC,IAAA,SAAS,EAAGJ,SAFb;AAGC,IAAA,GAAG,EAAGF;AAHP,~~MAKGU~~,cALH,CADD;AASA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMO,MAAM,GAAG,6BAAgBnB,iBAAhB,EAAmC,QAAnC,CAAf;;eAEQmB,M","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { isValidElement } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { getValidChildren } from '../ui/utils/get-valid-children';\nimport { contextConnect, useContextSystem } from '../ui/context';\nimport { ZStackView, ZStackChildView } from './styles';\nimport type { ZStackProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nfunction UnconnectedZStack(\n\tprops: WordPressComponentProps< ZStackProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\tchildren,\n\t\tclassName,\n\t\tisLayered = true,\n\t\tisReversed = false,\n\t\toffset = 0,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ZStack' );\n\n\tconst validChildren = getValidChildren( children );\n\tconst childrenLastIndex = validChildren.length - 1;\n\n\tconst clonedChildren = validChildren.map( ( child, index ) => {\n\t\tconst zIndex = isReversed ? childrenLastIndex - index : index;\n\t\tconst offsetAmount = offset index;\n\n\t\tconst key = isValidElement( child ) ? child.key : index;\n\n\t\treturn (\n\t\t\t<ZStackChildView\n\t\t\t\tisLayered={ isLayered }\n\t\t\t\toffsetAmount={ offsetAmount }\n\t\t\t\tzIndex={ zIndex }\n\t\t\t\tkey={ key }\n\t\t\t>\n\t\t\t\t{ child }\n\t\t\t</ZStackChildView>\n\t\t);\n\t} );\n\n\treturn (\n\t\t<ZStackView\n\t\t\t{ ...otherProps }\n\t\t\tclassName={ className }\n\t\t\tref={ forwardedRef }\n\t\t>\n\t\t\t{ clonedChildren }\n\t\t</ZStackView>\n\t);\n}\n\n/*\n `ZStack` allows you to stack things along the Z-axis.\n \n ```jsx\n * import { __experimentalZStack as ZStack } from '@wordpress/components';\n \n function Example() {\n * return (\n * <ZStack offset={ 20 } isLayered>\n * <ExampleImage />\n * <ExampleImage />\n * <ExampleImage />\n * </ZStack>\n * );\n * }\n * ```\n */\nexport const ZStack = contextConnect( UnconnectedZStack, 'ZStack' );\n\nexport default ZStack;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/z-stack/component.tsx"],"names":["UnconnectedZStack","props","forwardedRef","children","className","isLayered","isReversed","offset","otherProps","validChildren","childrenLastIndex","length","clonedChildren","map","child","index","zIndex","offsetAmount","key","ZStack"],"mappings":";;;;;;;AAQA;;AAKA;;AACA;;AACA;;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAOA,SAASA,iBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAM;AACLC,IAAAA,QADK;AAELC,IAAAA,SAFK;AAGLC,IAAAA,SAAS,GAAG,IAHP;AAILC,IAAAA,UAAU,GAAG,KAJR;AAKLC,IAAAA,MAAM,GAAG,CALJ;AAML,OAAGC;AANE,MAOF,+BAAkBP,KAAlB,EAAyB,QAAzB,CAPJ;AASA,QAAMQ,aAAa,GAAG,wCAAkBN,QAAlB,CAAtB;AACA,QAAMO,iBAAiB,GAAGD,aAAa,CAACE,MAAd,GAAuB,CAAjD;AAEA,QAAMC,cAAc,GAAGH,aAAa,CAACI,GAAd,CAAmB,CAAEC,KAAF,EAASC,KAAT,KAAoB;AAC7D,UAAMC,MAAM,GAAGV,UAAU,GAAGI,iBAAiB,GAAGK,KAAvB,GAA+BA,KAAxD;AACA,UAAME,YAAY,GAAGV,MAAM,GAAGQ,KAA9B;AAEA,UAAMG,GAAG,GAAG,6BAAgBJ,KAAhB,IAA0BA,KAAK,CAACI,GAAhC,GAAsCH,KAAlD;AAEA,WACC,4BAAC,uBAAD;AACC,MAAA,SAAS,EAAGV,SADb;AAEC,MAAA,YAAY,EAAGY,YAFhB;AAGC,MAAA,MAAM,EAAGD,MAHV;AAIC,MAAA,GAAG,EAAGE;AAJP,OAMGJ,KANH,CADD;AAUA,GAhBsB,CAAvB;AAkBA,SACC,4BAAC,kBAAD,OACMN,UADN;AAEC,IAAA,SAAS,EAAGJ,SAFb;AAGC,IAAA,GAAG,EAAGF;AAHP,KAKGU,cALH,CADD;AASA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMO,MAAM,GAAG,6BAAgBnB,iBAAhB,EAAmC,QAAnC,CAAf;;eAEQmB,M","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { isValidElement } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { getValidChildren } from '../ui/utils/get-valid-children';\nimport { contextConnect, useContextSystem } from '../ui/context';\nimport { ZStackView, ZStackChildView } from './styles';\nimport type { ZStackProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nfunction UnconnectedZStack(\n\tprops: WordPressComponentProps< ZStackProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\tchildren,\n\t\tclassName,\n\t\tisLayered = true,\n\t\tisReversed = false,\n\t\toffset = 0,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ZStack' );\n\n\tconst validChildren = getValidChildren( children );\n\tconst childrenLastIndex = validChildren.length - 1;\n\n\tconst clonedChildren = validChildren.map( ( child, index ) => {\n\t\tconst zIndex = isReversed ? childrenLastIndex - index : index;\n\t\tconst offsetAmount = offset index;\n\n\t\tconst key = isValidElement( child ) ? child.key : index;\n\n\t\treturn (\n\t\t\t<ZStackChildView\n\t\t\t\tisLayered={ isLayered }\n\t\t\t\toffsetAmount={ offsetAmount }\n\t\t\t\tzIndex={ zIndex }\n\t\t\t\tkey={ key }\n\t\t\t>\n\t\t\t\t{ child }\n\t\t\t</ZStackChildView>\n\t\t);\n\t} );\n\n\treturn (\n\t\t<ZStackView\n\t\t\t{ ...otherProps }\n\t\t\tclassName={ className }\n\t\t\tref={ forwardedRef }\n\t\t>\n\t\t\t{ clonedChildren }\n\t\t</ZStackView>\n\t);\n}\n\n/*\n `ZStack` allows you to stack things along the Z-axis.\n \n ```jsx\n * import { __experimentalZStack as ZStack } from '@wordpress/components';\n \n function Example() {\n * return (\n * <ZStack offset={ 20 } isLayered>\n * <ExampleImage />\n * <ExampleImage />\n * <ExampleImage />\n * </ZStack>\n * );\n * }\n * ```\n */\nexport const ZStack = contextConnect( UnconnectedZStack, 'ZStack' );\n\nexport default ZStack;\n"]}

package/build-module/alignment-matrix-control/cell.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 /**
@@ -21,10 +20,11 @@ export default function Cell({
   const tooltipText = ALIGNMENT_LABEL[value];
   return createElement(Tooltip, {
     text: tooltipText
-  }, createElement(CompositeItem, _extends({
+  }, createElement(CompositeItem, {
     as: CellView,
-    role: "gridcell"
-  }, props), createElement(VisuallyHidden, null, value), createElement(Point, {
+    role: "gridcell",
+    ...props
+  }, createElement(VisuallyHidden, null, value), createElement(Point, {
     isActive: isActive,
     role: "presentation"
   })));

package/build-module/alignment-matrix-control/cell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/alignment-matrix-control/cell.tsx"],"names":["CompositeItem","Tooltip","VisuallyHidden","ALIGNMENT_LABEL","Cell","CellView","Point","isActive","value","props","tooltipText"],"mappings":"~~;;;~~AAAA;AACA;AACA;AACA,SAASA,aAAT,QAA8B,cAA9B;AACA,OAAOC,OAAP,MAAoB,YAApB;AACA,SAASC,cAAT,QAA+B,oBAA/B;AAEA;AACA;AACA;;AACA,SAASC,eAAT,QAAgC,SAAhC;AACA,SACCC,IAAI,IAAIC,QADT,EAECC,KAFD,QAGO,0CAHP;AAOA,eAAe,SAASF,IAAT,CAAe;AAC7BG,EAAAA,QAAQ,GAAG,KADkB;AAE7BC,EAAAA,KAF6B;AAG7B,KAAGC;AAH0B,CAAf,EAIgE;AAC9E,QAAMC,WAAW,GAAGP,eAAe,CAAEK,KAAF,CAAnC;AAEA,SACC,cAAC,OAAD;AAAS,IAAA,IAAI,EAAGE;AAAhB,KACC,cAAC,aAAD;AAAe,IAAA,EAAE,EAAGL,QAApB;AAA+B,IAAA,IAAI,EAAC;~~AAApC~~,~~KAAoDI~~,~~KAApD~~,~~GAIC,~~cAAC,cAAD,QAAkBD,KAAlB,CAJD,EAKC,cAAC,KAAD;AAAO,IAAA,QAAQ,EAAGD,QAAlB;AAA6B,IAAA,IAAI,EAAC;AAAlC,IALD,CADD,CADD;AAWA","sourcesContent":["/*\n Internal dependencies\n /\nimport { CompositeItem } from '../composite';\nimport Tooltip from '../tooltip';\nimport { VisuallyHidden } from '../visually-hidden';\n\n/\n Internal dependencies\n /\nimport { ALIGNMENT_LABEL } from './utils';\nimport {\n\tCell as CellView,\n\tPoint,\n} from './styles/alignment-matrix-control-styles';\nimport type { AlignmentMatrixControlCellProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nexport default function Cell( {\n\tisActive = false,\n\tvalue,\n\t...props\n}: WordPressComponentProps< AlignmentMatrixControlCellProps, 'span', false > ) {\n\tconst tooltipText = ALIGNMENT_LABEL[ value ];\n\n\treturn (\n\t\t<Tooltip text={ tooltipText }>\n\t\t\t<CompositeItem as={ CellView } role=\"gridcell\" { ...props }>\n\t\t\t\t{ / VoiceOver needs a text content to be rendered within grid cell,\n\t\t\totherwise it'll announce the content as \"blank\". So we use a visually\n\t\t\thidden element instead of aria-label. */ }\n\t\t\t\t<VisuallyHidden>{ value }</VisuallyHidden>\n\t\t\t\t<Point isActive={ isActive } role=\"presentation\" />\n\t\t\t</CompositeItem>\n\t\t</Tooltip>\n\t);\n}\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/alignment-matrix-control/cell.tsx"],"names":["CompositeItem","Tooltip","VisuallyHidden","ALIGNMENT_LABEL","Cell","CellView","Point","isActive","value","props","tooltipText"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,aAAT,QAA8B,cAA9B;AACA,OAAOC,OAAP,MAAoB,YAApB;AACA,SAASC,cAAT,QAA+B,oBAA/B;AAEA;AACA;AACA;;AACA,SAASC,eAAT,QAAgC,SAAhC;AACA,SACCC,IAAI,IAAIC,QADT,EAECC,KAFD,QAGO,0CAHP;AAOA,eAAe,SAASF,IAAT,CAAe;AAC7BG,EAAAA,QAAQ,GAAG,KADkB;AAE7BC,EAAAA,KAF6B;AAG7B,KAAGC;AAH0B,CAAf,EAIgE;AAC9E,QAAMC,WAAW,GAAGP,eAAe,CAAEK,KAAF,CAAnC;AAEA,SACC,cAAC,OAAD;AAAS,IAAA,IAAI,EAAGE;AAAhB,KACC,cAAC,aAAD;AAAe,IAAA,EAAE,EAAGL,QAApB;AAA+B,IAAA,IAAI,EAAC,UAApC;AAAA,OAAoDI;AAApD,KAIC,cAAC,cAAD,QAAkBD,KAAlB,CAJD,EAKC,cAAC,KAAD;AAAO,IAAA,QAAQ,EAAGD,QAAlB;AAA6B,IAAA,IAAI,EAAC;AAAlC,IALD,CADD,CADD;AAWA","sourcesContent":["/*\n Internal dependencies\n /\nimport { CompositeItem } from '../composite';\nimport Tooltip from '../tooltip';\nimport { VisuallyHidden } from '../visually-hidden';\n\n/\n Internal dependencies\n /\nimport { ALIGNMENT_LABEL } from './utils';\nimport {\n\tCell as CellView,\n\tPoint,\n} from './styles/alignment-matrix-control-styles';\nimport type { AlignmentMatrixControlCellProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nexport default function Cell( {\n\tisActive = false,\n\tvalue,\n\t...props\n}: WordPressComponentProps< AlignmentMatrixControlCellProps, 'span', false > ) {\n\tconst tooltipText = ALIGNMENT_LABEL[ value ];\n\n\treturn (\n\t\t<Tooltip text={ tooltipText }>\n\t\t\t<CompositeItem as={ CellView } role=\"gridcell\" { ...props }>\n\t\t\t\t{ / VoiceOver needs a text content to be rendered within grid cell,\n\t\t\totherwise it'll announce the content as \"blank\". So we use a visually\n\t\t\thidden element instead of aria-label. */ }\n\t\t\t\t<VisuallyHidden>{ value }</VisuallyHidden>\n\t\t\t\t<Point isActive={ isActive } role=\"presentation\" />\n\t\t\t</CompositeItem>\n\t\t</Tooltip>\n\t);\n}\n"]}

package/build-module/alignment-matrix-control/icon.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 /**
@@ -27,12 +26,12 @@ function AlignmentMatrixControlIcon({
   const styles = { ...style,
     transform: `scale(${scale})`
   };
-  return createElement(Root, _extends({}, props, {
+  return createElement(Root, { ...props,
     className: classes,
     disablePointerEvents: disablePointerEvents,
     role: "presentation",
     style: styles
-  }), ALIGNMENTS.map((align, index) => {
+  }, ALIGNMENTS.map((align, index) => {
     const isActive = alignIndex === index;
     return createElement(Cell, {
       key: align

package/build-module/alignment-matrix-control/icon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/alignment-matrix-control/icon.tsx"],"names":["classnames","ALIGNMENTS","getAlignmentIndex","Root","Cell","Point","BASE_SIZE","AlignmentMatrixControlIcon","className","disablePointerEvents","size","style","value","props","alignIndex","scale","toFixed","classes","styles","transform","map","align","index","isActive"],"mappings":"~~;;;~~AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,UAAT,EAAqBC,iBAArB,QAA8C,SAA9C;AACA,SACCC,IADD,EAECC,IAFD,EAGCC,KAHD,QAIO,+CAJP;AAQA,MAAMC,SAAS,GAAG,EAAlB;;AAEA,SAASC,0BAAT,CAAqC;AACpCC,EAAAA,SADoC;AAEpCC,EAAAA,oBAAoB,GAAG,IAFa;AAGpCC,EAAAA,IAAI,GAAGJ,SAH6B;AAIpCK,EAAAA,KAAK,GAAG,EAJ4B;AAKpCC,EAAAA,KAAK,GAAG,QAL4B;AAMpC,KAAGC;AANiC,CAArC,EAO8E;AAC7E,QAAMC,UAAU,GAAGZ,iBAAiB,CAAEU,KAAF,CAApC;AACA,QAAMG,KAAK,GAAG,CAAEL,IAAI,GAAGJ,SAAT,EAAqBU,OAArB,CAA8B,CAA9B,CAAd;AAEA,QAAMC,OAAO,GAAGjB,UAAU,CACzB,yCADyB,EAEzBQ,SAFyB,CAA1B;AAKA,QAAMU,MAAM,GAAG,EACd,GAAGP,KADW;AAEdQ,IAAAA,SAAS,EAAG,SAASJ,KAAO;AAFd,GAAf;AAKA,SACC,cAAC,IAAD,~~eACMF~~,KADN;AAEC,IAAA,SAAS,EAAGI,OAFb;AAGC,IAAA,oBAAoB,EAAGR,oBAHxB;AAIC,IAAA,IAAI,EAAC,cAJN;AAKC,IAAA,KAAK,EAAGS;AALT,~~MAOGjB~~,UAAU,CAACmB,GAAX,CAAgB,CAAEC,KAAF,EAASC,KAAT,KAAoB;AACrC,UAAMC,QAAQ,GAAGT,UAAU,KAAKQ,KAAhC;AAEA,WACC,cAAC,IAAD;AAAM,MAAA,GAAG,EAAGD;AAAZ,OACC,cAAC,KAAD;AAAO,MAAA,QAAQ,EAAGE;AAAlB,MADD,CADD;AAKA,GARC,CAPH,CADD;AAmBA;;AAED,eAAehB,0BAAf","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n Internal dependencies\n */\nimport { ALIGNMENTS, getAlignmentIndex } from './utils';\nimport {\n\tRoot,\n\tCell,\n\tPoint,\n} from './styles/alignment-matrix-control-icon-styles';\nimport type { AlignmentMatrixControlIconProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst BASE_SIZE = 24;\n\nfunction AlignmentMatrixControlIcon( {\n\tclassName,\n\tdisablePointerEvents = true,\n\tsize = BASE_SIZE,\n\tstyle = {},\n\tvalue = 'center',\n\t...props\n}: WordPressComponentProps< AlignmentMatrixControlIconProps, 'div', false > ) {\n\tconst alignIndex = getAlignmentIndex( value );\n\tconst scale = ( size / BASE_SIZE ).toFixed( 2 );\n\n\tconst classes = classnames(\n\t\t'component-alignment-matrix-control-icon',\n\t\tclassName\n\t);\n\n\tconst styles = {\n\t\t...style,\n\t\ttransform: `scale(${ scale })`,\n\t};\n\n\treturn (\n\t\t<Root\n\t\t\t{ ...props }\n\t\t\tclassName={ classes }\n\t\t\tdisablePointerEvents={ disablePointerEvents }\n\t\t\trole=\"presentation\"\n\t\t\tstyle={ styles }\n\t\t>\n\t\t\t{ ALIGNMENTS.map( ( align, index ) => {\n\t\t\t\tconst isActive = alignIndex === index;\n\n\t\t\t\treturn (\n\t\t\t\t\t<Cell key={ align }>\n\t\t\t\t\t\t<Point isActive={ isActive } />\n\t\t\t\t\t</Cell>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</Root>\n\t);\n}\n\nexport default AlignmentMatrixControlIcon;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/alignment-matrix-control/icon.tsx"],"names":["classnames","ALIGNMENTS","getAlignmentIndex","Root","Cell","Point","BASE_SIZE","AlignmentMatrixControlIcon","className","disablePointerEvents","size","style","value","props","alignIndex","scale","toFixed","classes","styles","transform","map","align","index","isActive"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,UAAT,EAAqBC,iBAArB,QAA8C,SAA9C;AACA,SACCC,IADD,EAECC,IAFD,EAGCC,KAHD,QAIO,+CAJP;AAQA,MAAMC,SAAS,GAAG,EAAlB;;AAEA,SAASC,0BAAT,CAAqC;AACpCC,EAAAA,SADoC;AAEpCC,EAAAA,oBAAoB,GAAG,IAFa;AAGpCC,EAAAA,IAAI,GAAGJ,SAH6B;AAIpCK,EAAAA,KAAK,GAAG,EAJ4B;AAKpCC,EAAAA,KAAK,GAAG,QAL4B;AAMpC,KAAGC;AANiC,CAArC,EAO8E;AAC7E,QAAMC,UAAU,GAAGZ,iBAAiB,CAAEU,KAAF,CAApC;AACA,QAAMG,KAAK,GAAG,CAAEL,IAAI,GAAGJ,SAAT,EAAqBU,OAArB,CAA8B,CAA9B,CAAd;AAEA,QAAMC,OAAO,GAAGjB,UAAU,CACzB,yCADyB,EAEzBQ,SAFyB,CAA1B;AAKA,QAAMU,MAAM,GAAG,EACd,GAAGP,KADW;AAEdQ,IAAAA,SAAS,EAAG,SAASJ,KAAO;AAFd,GAAf;AAKA,SACC,cAAC,IAAD,OACMF,KADN;AAEC,IAAA,SAAS,EAAGI,OAFb;AAGC,IAAA,oBAAoB,EAAGR,oBAHxB;AAIC,IAAA,IAAI,EAAC,cAJN;AAKC,IAAA,KAAK,EAAGS;AALT,KAOGjB,UAAU,CAACmB,GAAX,CAAgB,CAAEC,KAAF,EAASC,KAAT,KAAoB;AACrC,UAAMC,QAAQ,GAAGT,UAAU,KAAKQ,KAAhC;AAEA,WACC,cAAC,IAAD;AAAM,MAAA,GAAG,EAAGD;AAAZ,OACC,cAAC,KAAD;AAAO,MAAA,QAAQ,EAAGE;AAAlB,MADD,CADD;AAKA,GARC,CAPH,CADD;AAmBA;;AAED,eAAehB,0BAAf","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n Internal dependencies\n */\nimport { ALIGNMENTS, getAlignmentIndex } from './utils';\nimport {\n\tRoot,\n\tCell,\n\tPoint,\n} from './styles/alignment-matrix-control-icon-styles';\nimport type { AlignmentMatrixControlIconProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst BASE_SIZE = 24;\n\nfunction AlignmentMatrixControlIcon( {\n\tclassName,\n\tdisablePointerEvents = true,\n\tsize = BASE_SIZE,\n\tstyle = {},\n\tvalue = 'center',\n\t...props\n}: WordPressComponentProps< AlignmentMatrixControlIconProps, 'div', false > ) {\n\tconst alignIndex = getAlignmentIndex( value );\n\tconst scale = ( size / BASE_SIZE ).toFixed( 2 );\n\n\tconst classes = classnames(\n\t\t'component-alignment-matrix-control-icon',\n\t\tclassName\n\t);\n\n\tconst styles = {\n\t\t...style,\n\t\ttransform: `scale(${ scale })`,\n\t};\n\n\treturn (\n\t\t<Root\n\t\t\t{ ...props }\n\t\t\tclassName={ classes }\n\t\t\tdisablePointerEvents={ disablePointerEvents }\n\t\t\trole=\"presentation\"\n\t\t\tstyle={ styles }\n\t\t>\n\t\t\t{ ALIGNMENTS.map( ( align, index ) => {\n\t\t\t\tconst isActive = alignIndex === index;\n\n\t\t\t\treturn (\n\t\t\t\t\t<Cell key={ align }>\n\t\t\t\t\t\t<Point isActive={ isActive } />\n\t\t\t\t\t</Cell>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</Root>\n\t);\n}\n\nexport default AlignmentMatrixControlIcon;\n"]}

package/build-module/alignment-matrix-control/index.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 /**
@@ -82,27 +81,28 @@ export function AlignmentMatrixControl({
     }
   }, [value, setCurrentId, baseId]);
   const classes = classnames('component-alignment-matrix-control', className);
-  return createElement(Composite, _extends({}, props, composite, {
+  return createElement(Composite, { ...props,
+    ...composite,
     "aria-label": label,
     as: Root,
     className: classes,
     role: "grid",
     size: width
-  }), GRID.map((cells, index) => createElement(CompositeGroup, _extends({}, composite, {
+  }, GRID.map((cells, index) => createElement(CompositeGroup, { ...composite,
     as: Row,
     role: "row",
     key: index
-  }), cells.map(cell => {
+  }, cells.map(cell => {
     const cellId = getItemId(baseId, cell);
     const isActive = composite.currentId === cellId;
-    return createElement(Cell, _extends({}, composite, {
+    return createElement(Cell, { ...composite,
       id: cellId,
       isActive: isActive,
       key: cell,
       value: cell,
       onFocus: () => handleOnChange(cell),
       tabIndex: isActive ? 0 : -1
-    }));
+    });
   }))));
 }
 AlignmentMatrixControl.Icon = AlignmentMatrixControlIcon;

package/build-module/alignment-matrix-control/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/alignment-matrix-control/index.tsx"],"names":["classnames","__","isRTL","useInstanceId","useState","useEffect","Cell","Composite","CompositeGroup","useCompositeState","Root","Row","AlignmentMatrixControlIcon","GRID","getItemId","noop","useBaseId","id","instanceId","AlignmentMatrixControl","className","label","defaultValue","value","onChange","width","props","immutableDefaultValue","baseId","initialCurrentId","composite","currentId","rtl","handleOnChange","nextValue","setCurrentId","classes","map","cells","index","cell","cellId","isActive","Icon"],"mappings":"~~;;;~~AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,EAAT,EAAaC,KAAb,QAA0B,iBAA1B;AACA,SAASC,aAAT,QAA8B,oBAA9B;AACA,SAASC,QAAT,EAAmBC,SAAnB,QAAoC,oBAApC;AAEA;AACA;AACA;;AACA,OAAOC,IAAP,MAAiB,QAAjB;AACA,SAASC,SAAT,EAAoBC,cAApB,EAAoCC,iBAApC,QAA6D,cAA7D;AACA,SAASC,IAAT,EAAeC,GAAf,QAA0B,0CAA1B;AACA,OAAOC,0BAAP,MAAuC,QAAvC;AACA,SAASC,IAAT,EAAeC,SAAf,QAAgC,SAAhC;;AAOA,MAAMC,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEA,SAASC,SAAT,CAAoBC,EAApB,EAAkC;AACjC,QAAMC,UAAU,GAAGf,aAAa,CAC/BgB,sBAD+B,EAE/B,0BAF+B,CAAhC;AAKA,SAAOF,EAAE,IAAIC,UAAb;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,SAASC,sBAAT,CAAiC;AACvCC,EAAAA,SADuC;AAEvCH,EAAAA,EAFuC;AAGvCI,EAAAA,KAAK,GAAGpB,EAAE,CAAE,0BAAF,CAH6B;AAIvCqB,EAAAA,YAAY,GAAG,eAJwB;AAKvCC,EAAAA,KALuC;AAMvCC,EAAAA,QAAQ,GAAGT,IAN4B;AAOvCU,EAAAA,KAAK,GAAG,EAP+B;AAQvC,KAAGC;AARoC,CAAjC,EASmE;AACzE,QAAM,CAAEC,qBAAF,IAA4BvB,QAAQ,CAAEmB,KAAF,aAAEA,KAAF,cAAEA,KAAF,GAAWD,YAAX,CAA1C;AACA,QAAMM,MAAM,GAAGZ,SAAS,CAAEC,EAAF,CAAxB;AACA,QAAMY,gBAAgB,GAAGf,SAAS,CAAEc,MAAF,EAAUD,qBAAV,CAAlC;AAEA,QAAMG,SAAS,GAAGrB,iBAAiB,CAAE;AACpCmB,IAAAA,MADoC;AAEpCG,IAAAA,SAAS,EAAEF,gBAFyB;AAGpCG,IAAAA,GAAG,EAAE9B,KAAK;AAH0B,GAAF,CAAnC;;AAMA,QAAM+B,cAAc,GAAKC,SAAF,IAA8C;AACpEV,IAAAA,QAAQ,CAAEU,SAAF,CAAR;AACA,GAFD;;AAIA,QAAM;AAAEC,IAAAA;AAAF,MAAmBL,SAAzB;AAEAzB,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAK,OAAOkB,KAAP,KAAiB,WAAtB,EAAoC;AACnCY,MAAAA,YAAY,CAAErB,SAAS,CAAEc,MAAF,EAAUL,KAAV,CAAX,CAAZ;AACA;AACD,GAJQ,EAIN,CAAEA,KAAF,EAASY,YAAT,EAAuBP,MAAvB,CAJM,CAAT;AAMA,QAAMQ,OAAO,GAAGpC,UAAU,CACzB,oCADyB,EAEzBoB,SAFyB,CAA1B;AAKA,SACC,cAAC,SAAD,~~eACMM~~,KADN,~~EAEMI~~,SAFN;AAGC,kBAAaT,KAHd;AAIC,IAAA,EAAE,EAAGX,IAJN;AAKC,IAAA,SAAS,EAAG0B,OALb;AAMC,IAAA,IAAI,EAAC,MANN;AAOC,IAAA,IAAI,EAAGX;AAPR,~~MASGZ~~,IAAI,CAACwB,GAAL,CAAU,CAAEC,KAAF,EAASC,KAAT,KACX,cAAC,cAAD,~~eACMT~~,SADN;AAEC,IAAA,EAAE,EAAGnB,GAFN;AAGC,IAAA,IAAI,EAAC,KAHN;AAIC,IAAA,GAAG,EAAG4B;AAJP,~~MAMGD~~,KAAK,CAACD,GAAN,CAAaG,IAAF,IAAY;AACxB,UAAMC,MAAM,GAAG3B,SAAS,CAAEc,MAAF,EAAUY,IAAV,CAAxB;AACA,UAAME,QAAQ,GAAGZ,SAAS,CAACC,SAAV,KAAwBU,MAAzC;AAEA,WACC,cAAC,IAAD,~~eACMX~~,SADN;AAEC,MAAA,EAAE,EAAGW,MAFN;AAGC,MAAA,QAAQ,EAAGC,QAHZ;AAIC,MAAA,GAAG,EAAGF,IAJP;AAKC,MAAA,KAAK,EAAGA,IALT;AAMC,MAAA,OAAO,EAAG,MAAMP,cAAc,CAAEO,IAAF,CAN/B;AAOC,MAAA,QAAQ,EAAGE,QAAQ,GAAG,CAAH,GAAO,CAAC;AAP5B,~~OADD~~;AAWA,GAfC,CANH,CADC,CATH,CADD;AAqCA;AAEDvB,sBAAsB,CAACwB,IAAvB,GAA8B/B,0BAA9B;AAEA,eAAeO,sBAAf","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { __, isRTL } from '@wordpress/i18n';\nimport { useInstanceId } from '@wordpress/compose';\nimport { useState, useEffect } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport Cell from './cell';\nimport { Composite, CompositeGroup, useCompositeState } from '../composite';\nimport { Root, Row } from './styles/alignment-matrix-control-styles';\nimport AlignmentMatrixControlIcon from './icon';\nimport { GRID, getItemId } from './utils';\nimport type { WordPressComponentProps } from '../ui/context';\nimport type {\n\tAlignmentMatrixControlProps,\n\tAlignmentMatrixControlValue,\n} from './types';\n\nconst noop = () => {};\n\nfunction useBaseId( id?: string ) {\n\tconst instanceId = useInstanceId(\n\t\tAlignmentMatrixControl,\n\t\t'alignment-matrix-control'\n\t);\n\n\treturn id \|\| instanceId;\n}\n\n/\n \n * AlignmentMatrixControl components enable adjustments to horizontal and vertical alignments for UI.\n \n ```jsx\n * import { __experimentalAlignmentMatrixControl as AlignmentMatrixControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const Example = () => {\n * \tconst [ alignment, setAlignment ] = useState( 'center center' );\n \n \treturn (\n * \t\t<AlignmentMatrixControl\n * \t\t\tvalue={ alignment }\n * \t\t\tonChange={ setAlignment }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nexport function AlignmentMatrixControl( {\n\tclassName,\n\tid,\n\tlabel = __( 'Alignment Matrix Control' ),\n\tdefaultValue = 'center center',\n\tvalue,\n\tonChange = noop,\n\twidth = 92,\n\t...props\n}: WordPressComponentProps< AlignmentMatrixControlProps, 'div', false > ) {\n\tconst [ immutableDefaultValue ] = useState( value ?? defaultValue );\n\tconst baseId = useBaseId( id );\n\tconst initialCurrentId = getItemId( baseId, immutableDefaultValue );\n\n\tconst composite = useCompositeState( {\n\t\tbaseId,\n\t\tcurrentId: initialCurrentId,\n\t\trtl: isRTL(),\n\t} );\n\n\tconst handleOnChange = ( nextValue: AlignmentMatrixControlValue ) => {\n\t\tonChange( nextValue );\n\t};\n\n\tconst { setCurrentId } = composite;\n\n\tuseEffect( () => {\n\t\tif ( typeof value !== 'undefined' ) {\n\t\t\tsetCurrentId( getItemId( baseId, value ) );\n\t\t}\n\t}, [ value, setCurrentId, baseId ] );\n\n\tconst classes = classnames(\n\t\t'component-alignment-matrix-control',\n\t\tclassName\n\t);\n\n\treturn (\n\t\t<Composite\n\t\t\t{ ...props }\n\t\t\t{ ...composite }\n\t\t\taria-label={ label }\n\t\t\tas={ Root }\n\t\t\tclassName={ classes }\n\t\t\trole=\"grid\"\n\t\t\tsize={ width }\n\t\t>\n\t\t\t{ GRID.map( ( cells, index ) => (\n\t\t\t\t<CompositeGroup\n\t\t\t\t\t{ ...composite }\n\t\t\t\t\tas={ Row }\n\t\t\t\t\trole=\"row\"\n\t\t\t\t\tkey={ index }\n\t\t\t\t>\n\t\t\t\t\t{ cells.map( ( cell ) => {\n\t\t\t\t\t\tconst cellId = getItemId( baseId, cell );\n\t\t\t\t\t\tconst isActive = composite.currentId === cellId;\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<Cell\n\t\t\t\t\t\t\t\t{ ...composite }\n\t\t\t\t\t\t\t\tid={ cellId }\n\t\t\t\t\t\t\t\tisActive={ isActive }\n\t\t\t\t\t\t\t\tkey={ cell }\n\t\t\t\t\t\t\t\tvalue={ cell }\n\t\t\t\t\t\t\t\tonFocus={ () => handleOnChange( cell ) }\n\t\t\t\t\t\t\t\ttabIndex={ isActive ? 0 : -1 }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</CompositeGroup>\n\t\t\t) ) }\n\t\t</Composite>\n\t);\n}\n\nAlignmentMatrixControl.Icon = AlignmentMatrixControlIcon;\n\nexport default AlignmentMatrixControl;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/alignment-matrix-control/index.tsx"],"names":["classnames","__","isRTL","useInstanceId","useState","useEffect","Cell","Composite","CompositeGroup","useCompositeState","Root","Row","AlignmentMatrixControlIcon","GRID","getItemId","noop","useBaseId","id","instanceId","AlignmentMatrixControl","className","label","defaultValue","value","onChange","width","props","immutableDefaultValue","baseId","initialCurrentId","composite","currentId","rtl","handleOnChange","nextValue","setCurrentId","classes","map","cells","index","cell","cellId","isActive","Icon"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,EAAT,EAAaC,KAAb,QAA0B,iBAA1B;AACA,SAASC,aAAT,QAA8B,oBAA9B;AACA,SAASC,QAAT,EAAmBC,SAAnB,QAAoC,oBAApC;AAEA;AACA;AACA;;AACA,OAAOC,IAAP,MAAiB,QAAjB;AACA,SAASC,SAAT,EAAoBC,cAApB,EAAoCC,iBAApC,QAA6D,cAA7D;AACA,SAASC,IAAT,EAAeC,GAAf,QAA0B,0CAA1B;AACA,OAAOC,0BAAP,MAAuC,QAAvC;AACA,SAASC,IAAT,EAAeC,SAAf,QAAgC,SAAhC;;AAOA,MAAMC,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEA,SAASC,SAAT,CAAoBC,EAApB,EAAkC;AACjC,QAAMC,UAAU,GAAGf,aAAa,CAC/BgB,sBAD+B,EAE/B,0BAF+B,CAAhC;AAKA,SAAOF,EAAE,IAAIC,UAAb;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,SAASC,sBAAT,CAAiC;AACvCC,EAAAA,SADuC;AAEvCH,EAAAA,EAFuC;AAGvCI,EAAAA,KAAK,GAAGpB,EAAE,CAAE,0BAAF,CAH6B;AAIvCqB,EAAAA,YAAY,GAAG,eAJwB;AAKvCC,EAAAA,KALuC;AAMvCC,EAAAA,QAAQ,GAAGT,IAN4B;AAOvCU,EAAAA,KAAK,GAAG,EAP+B;AAQvC,KAAGC;AARoC,CAAjC,EASmE;AACzE,QAAM,CAAEC,qBAAF,IAA4BvB,QAAQ,CAAEmB,KAAF,aAAEA,KAAF,cAAEA,KAAF,GAAWD,YAAX,CAA1C;AACA,QAAMM,MAAM,GAAGZ,SAAS,CAAEC,EAAF,CAAxB;AACA,QAAMY,gBAAgB,GAAGf,SAAS,CAAEc,MAAF,EAAUD,qBAAV,CAAlC;AAEA,QAAMG,SAAS,GAAGrB,iBAAiB,CAAE;AACpCmB,IAAAA,MADoC;AAEpCG,IAAAA,SAAS,EAAEF,gBAFyB;AAGpCG,IAAAA,GAAG,EAAE9B,KAAK;AAH0B,GAAF,CAAnC;;AAMA,QAAM+B,cAAc,GAAKC,SAAF,IAA8C;AACpEV,IAAAA,QAAQ,CAAEU,SAAF,CAAR;AACA,GAFD;;AAIA,QAAM;AAAEC,IAAAA;AAAF,MAAmBL,SAAzB;AAEAzB,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAK,OAAOkB,KAAP,KAAiB,WAAtB,EAAoC;AACnCY,MAAAA,YAAY,CAAErB,SAAS,CAAEc,MAAF,EAAUL,KAAV,CAAX,CAAZ;AACA;AACD,GAJQ,EAIN,CAAEA,KAAF,EAASY,YAAT,EAAuBP,MAAvB,CAJM,CAAT;AAMA,QAAMQ,OAAO,GAAGpC,UAAU,CACzB,oCADyB,EAEzBoB,SAFyB,CAA1B;AAKA,SACC,cAAC,SAAD,OACMM,KADN;AAAA,OAEMI,SAFN;AAGC,kBAAaT,KAHd;AAIC,IAAA,EAAE,EAAGX,IAJN;AAKC,IAAA,SAAS,EAAG0B,OALb;AAMC,IAAA,IAAI,EAAC,MANN;AAOC,IAAA,IAAI,EAAGX;AAPR,KASGZ,IAAI,CAACwB,GAAL,CAAU,CAAEC,KAAF,EAASC,KAAT,KACX,cAAC,cAAD,OACMT,SADN;AAEC,IAAA,EAAE,EAAGnB,GAFN;AAGC,IAAA,IAAI,EAAC,KAHN;AAIC,IAAA,GAAG,EAAG4B;AAJP,KAMGD,KAAK,CAACD,GAAN,CAAaG,IAAF,IAAY;AACxB,UAAMC,MAAM,GAAG3B,SAAS,CAAEc,MAAF,EAAUY,IAAV,CAAxB;AACA,UAAME,QAAQ,GAAGZ,SAAS,CAACC,SAAV,KAAwBU,MAAzC;AAEA,WACC,cAAC,IAAD,OACMX,SADN;AAEC,MAAA,EAAE,EAAGW,MAFN;AAGC,MAAA,QAAQ,EAAGC,QAHZ;AAIC,MAAA,GAAG,EAAGF,IAJP;AAKC,MAAA,KAAK,EAAGA,IALT;AAMC,MAAA,OAAO,EAAG,MAAMP,cAAc,CAAEO,IAAF,CAN/B;AAOC,MAAA,QAAQ,EAAGE,QAAQ,GAAG,CAAH,GAAO,CAAC;AAP5B,MADD;AAWA,GAfC,CANH,CADC,CATH,CADD;AAqCA;AAEDvB,sBAAsB,CAACwB,IAAvB,GAA8B/B,0BAA9B;AAEA,eAAeO,sBAAf","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { __, isRTL } from '@wordpress/i18n';\nimport { useInstanceId } from '@wordpress/compose';\nimport { useState, useEffect } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport Cell from './cell';\nimport { Composite, CompositeGroup, useCompositeState } from '../composite';\nimport { Root, Row } from './styles/alignment-matrix-control-styles';\nimport AlignmentMatrixControlIcon from './icon';\nimport { GRID, getItemId } from './utils';\nimport type { WordPressComponentProps } from '../ui/context';\nimport type {\n\tAlignmentMatrixControlProps,\n\tAlignmentMatrixControlValue,\n} from './types';\n\nconst noop = () => {};\n\nfunction useBaseId( id?: string ) {\n\tconst instanceId = useInstanceId(\n\t\tAlignmentMatrixControl,\n\t\t'alignment-matrix-control'\n\t);\n\n\treturn id \|\| instanceId;\n}\n\n/\n \n * AlignmentMatrixControl components enable adjustments to horizontal and vertical alignments for UI.\n \n ```jsx\n * import { __experimentalAlignmentMatrixControl as AlignmentMatrixControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const Example = () => {\n * \tconst [ alignment, setAlignment ] = useState( 'center center' );\n \n \treturn (\n * \t\t<AlignmentMatrixControl\n * \t\t\tvalue={ alignment }\n * \t\t\tonChange={ setAlignment }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nexport function AlignmentMatrixControl( {\n\tclassName,\n\tid,\n\tlabel = __( 'Alignment Matrix Control' ),\n\tdefaultValue = 'center center',\n\tvalue,\n\tonChange = noop,\n\twidth = 92,\n\t...props\n}: WordPressComponentProps< AlignmentMatrixControlProps, 'div', false > ) {\n\tconst [ immutableDefaultValue ] = useState( value ?? defaultValue );\n\tconst baseId = useBaseId( id );\n\tconst initialCurrentId = getItemId( baseId, immutableDefaultValue );\n\n\tconst composite = useCompositeState( {\n\t\tbaseId,\n\t\tcurrentId: initialCurrentId,\n\t\trtl: isRTL(),\n\t} );\n\n\tconst handleOnChange = ( nextValue: AlignmentMatrixControlValue ) => {\n\t\tonChange( nextValue );\n\t};\n\n\tconst { setCurrentId } = composite;\n\n\tuseEffect( () => {\n\t\tif ( typeof value !== 'undefined' ) {\n\t\t\tsetCurrentId( getItemId( baseId, value ) );\n\t\t}\n\t}, [ value, setCurrentId, baseId ] );\n\n\tconst classes = classnames(\n\t\t'component-alignment-matrix-control',\n\t\tclassName\n\t);\n\n\treturn (\n\t\t<Composite\n\t\t\t{ ...props }\n\t\t\t{ ...composite }\n\t\t\taria-label={ label }\n\t\t\tas={ Root }\n\t\t\tclassName={ classes }\n\t\t\trole=\"grid\"\n\t\t\tsize={ width }\n\t\t>\n\t\t\t{ GRID.map( ( cells, index ) => (\n\t\t\t\t<CompositeGroup\n\t\t\t\t\t{ ...composite }\n\t\t\t\t\tas={ Row }\n\t\t\t\t\trole=\"row\"\n\t\t\t\t\tkey={ index }\n\t\t\t\t>\n\t\t\t\t\t{ cells.map( ( cell ) => {\n\t\t\t\t\t\tconst cellId = getItemId( baseId, cell );\n\t\t\t\t\t\tconst isActive = composite.currentId === cellId;\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<Cell\n\t\t\t\t\t\t\t\t{ ...composite }\n\t\t\t\t\t\t\t\tid={ cellId }\n\t\t\t\t\t\t\t\tisActive={ isActive }\n\t\t\t\t\t\t\t\tkey={ cell }\n\t\t\t\t\t\t\t\tvalue={ cell }\n\t\t\t\t\t\t\t\tonFocus={ () => handleOnChange( cell ) }\n\t\t\t\t\t\t\t\ttabIndex={ isActive ? 0 : -1 }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</CompositeGroup>\n\t\t\t) ) }\n\t\t</Composite>\n\t);\n}\n\nAlignmentMatrixControl.Icon = AlignmentMatrixControlIcon;\n\nexport default AlignmentMatrixControl;\n"]}

package/build-module/angle-picker-control/angle-circle.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 /**
@@ -76,11 +75,12 @@ function AngleCircle({
       previousCursorValue.current = undefined;
     }
   }, [isDragging]);
-  return createElement(CircleRoot, _extends({
+  return createElement(CircleRoot, {
     ref: angleCircleRef,
     onMouseDown: startDrag,
-    className: "components-angle-picker-control__angle-circle"
-  }, props), createElement(CircleIndicatorWrapper, {
+    className: "components-angle-picker-control__angle-circle",
+    ...props
+  }, createElement(CircleIndicatorWrapper, {
     style: value ? {
       transform: `rotate(${value}deg)`
     } : undefined,

package/build-module/angle-picker-control/angle-circle.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/angle-picker-control/angle-circle.tsx"],"names":["useEffect","useRef","__experimentalUseDragging","useDragging","CircleRoot","CircleIndicatorWrapper","CircleIndicator","AngleCircle","value","onChange","props","angleCircleRef","angleCircleCenter","previousCursorValue","setAngleCircleCenter","current","rect","getBoundingClientRect","x","width","y","height","changeAngleToPosition","event","undefined","preventDefault","target","focus","centerX","centerY","getAngle","clientX","clientY","startDrag","isDragging","onDragStart","onDragMove","onDragEnd","document","body","style","cursor","transform","pointX","pointY","angleInRadians","Math","atan2","angleInDeg","round","PI"],"mappings":"~~;;;~~AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,MAApB,QAAkC,oBAAlC;AACA,SAASC,yBAAyB,IAAIC,WAAtC,QAAyD,oBAAzD;AAEA;AACA;AACA;;AACA,SACCC,UADD,EAECC,sBAFD,EAGCC,eAHD,QAIO,sCAJP;;AAeA,SAASC,WAAT,CAAsB;AACrBC,EAAAA,KADqB;AAErBC,EAAAA,QAFqB;AAGrB,KAAGC;AAHkB,CAAtB,EAIwD;AACvD,QAAMC,cAAc,GAAGV,MAAM,CAA2B,IAA3B,CAA7B;AACA,QAAMW,iBAAiB,GAAGX,MAAM,EAAhC;AACA,QAAMY,mBAAmB,GAAGZ,MAAM,EAAlC;;AAEA,QAAMa,oBAAoB,GAAG,MAAM;AAClC,QAAKH,cAAc,CAACI,OAAf,KAA2B,IAAhC,EAAuC;AACtC;AACA;;AAED,UAAMC,IAAI,GAAGL,cAAc,CAACI,OAAf,CAAuBE,qBAAvB,EAAb;AACAL,IAAAA,iBAAiB,CAACG,OAAlB,GAA4B;AAC3BG,MAAAA,CAAC,EAAEF,IAAI,CAACE,CAAL,GAASF,IAAI,CAACG,KAAL,GAAa,CADE;AAE3BC,MAAAA,CAAC,EAAEJ,IAAI,CAACI,CAAL,GAASJ,IAAI,CAACK,MAAL,GAAc;AAFC,KAA5B;AAIA,GAVD;;AAYA,QAAMC,qBAAqB,GAAKC,KAAF,IAAuC;AACpE,QAAKA,KAAK,KAAKC,SAAf,EAA2B;AAC1B;AACA,KAHmE,CAKpE;AACA;;;AACAD,IAAAA,KAAK,CAACE,cAAN,GAPoE,CAQpE;;AACEF,IAAAA,KAAK,CAACG,MAAR,EAA2CC,KAA3C;;AAEA,QACCf,iBAAiB,CAACG,OAAlB,KAA8BS,SAA9B,IACAf,QAAQ,KAAKe,SAFd,EAGE;AACD,YAAM;AAAEN,QAAAA,CAAC,EAAEU,OAAL;AAAcR,QAAAA,CAAC,EAAES;AAAjB,UAA6BjB,iBAAiB,CAACG,OAArD;AACAN,MAAAA,QAAQ,CACPqB,QAAQ,CAAEF,OAAF,EAAWC,OAAX,EAAoBN,KAAK,CAACQ,OAA1B,EAAmCR,KAAK,CAACS,OAAzC,CADD,CAAR;AAGA;AACD,GApBD;;AAsBA,QAAM;AAAEC,IAAAA,SAAF;AAAaC,IAAAA;AAAb,MAA4B/B,WAAW,CAAE;AAC9CgC,IAAAA,WAAW,EAAIZ,KAAF,IAAa;AACzBT,MAAAA,oBAAoB;AACpBQ,MAAAA,qBAAqB,CAAEC,KAAF,CAArB;AACA,KAJ6C;AAK9Ca,IAAAA,UAAU,EAAEd,qBALkC;AAM9Ce,IAAAA,SAAS,EAAEf;AANmC,GAAF,CAA7C;AASAtB,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKkC,UAAL,EAAkB;AACjB,UAAKrB,mBAAmB,CAACE,OAApB,KAAgCS,SAArC,EAAiD;AAChDX,QAAAA,mBAAmB,CAACE,OAApB,GAA8BuB,QAAQ,CAACC,IAAT,CAAcC,KAAd,CAAoBC,MAAlD;AACA;;AACDH,MAAAA,QAAQ,CAACC,IAAT,CAAcC,KAAd,CAAoBC,MAApB,GAA6B,UAA7B;AACA,KALD,MAKO;AACNH,MAAAA,QAAQ,CAACC,IAAT,CAAcC,KAAd,CAAoBC,MAApB,GAA6B5B,mBAAmB,CAACE,OAApB,IAA+B,EAA5D;AACAF,MAAAA,mBAAmB,CAACE,OAApB,GAA8BS,SAA9B;AACA;AACD,GAVQ,EAUN,CAAEU,UAAF,CAVM,CAAT;AAYA,SACC,cAAC,UAAD;AACC,IAAA,GAAG,EAAGvB,cADP;AAEC,IAAA,WAAW,EAAGsB,SAFf;AAGC,IAAA,SAAS,EAAC;~~AAHX~~,~~KAIMvB~~,~~KAJN~~,~~GAMC,~~cAAC,sBAAD;AACC,IAAA,KAAK,EACJF,KAAK,GAAG;AAAEkC,MAAAA,SAAS,EAAG,UAAUlC,KAAO;AAA/B,KAAH,GAA4CgB,SAFnD;AAIC,IAAA,SAAS,EAAC,iEAJX;AAKC,IAAA,QAAQ,EAAG,CAAC;AALb,KAOC,cAAC,eAAD;AAAiB,IAAA,SAAS,EAAC;AAA3B,IAPD,CAND,CADD;AAkBA;;AAED,SAASM,QAAT,CACCF,OADD,EAECC,OAFD,EAGCc,MAHD,EAICC,MAJD,EAKE;AACD,QAAMxB,CAAC,GAAGwB,MAAM,GAAGf,OAAnB;AACA,QAAMX,CAAC,GAAGyB,MAAM,GAAGf,OAAnB;AAEA,QAAMiB,cAAc,GAAGC,IAAI,CAACC,KAAL,CAAY3B,CAAZ,EAAeF,CAAf,CAAvB;AACA,QAAM8B,UAAU,GAAGF,IAAI,CAACG,KAAL,CAAYJ,cAAc,IAAK,MAAMC,IAAI,CAACI,EAAhB,CAA1B,IAAmD,EAAtE;;AACA,MAAKF,UAAU,GAAG,CAAlB,EAAsB;AACrB,WAAO,MAAMA,UAAb;AACA;;AACD,SAAOA,UAAP;AACA;;AAED,eAAezC,WAAf","sourcesContent":["/*\n WordPress dependencies\n /\nimport { useEffect, useRef } from '@wordpress/element';\nimport { __experimentalUseDragging as useDragging } from '@wordpress/compose';\n\n/\n Internal dependencies\n /\nimport {\n\tCircleRoot,\n\tCircleIndicatorWrapper,\n\tCircleIndicator,\n} from './styles/angle-picker-control-styles';\n\nimport type { WordPressComponentProps } from '../ui/context';\nimport type { AngleCircleProps } from './types';\n\ntype UseDraggingArgumentType = Parameters< typeof useDragging >[ 0 ];\ntype UseDraggingCallbackEvent =\n\t\| Parameters< UseDraggingArgumentType[ 'onDragStart' ] >[ 0 ]\n\t\| Parameters< UseDraggingArgumentType[ 'onDragMove' ] >[ 0 ]\n\t\| Parameters< UseDraggingArgumentType[ 'onDragEnd' ] >[ 0 ];\n\nfunction AngleCircle( {\n\tvalue,\n\tonChange,\n\t...props\n}: WordPressComponentProps< AngleCircleProps, 'div' > ) {\n\tconst angleCircleRef = useRef< HTMLDivElement \| null >( null );\n\tconst angleCircleCenter = useRef< { x: number; y: number } \| undefined >();\n\tconst previousCursorValue = useRef< CSSStyleDeclaration[ 'cursor' ] >();\n\n\tconst setAngleCircleCenter = () => {\n\t\tif ( angleCircleRef.current === null ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst rect = angleCircleRef.current.getBoundingClientRect();\n\t\tangleCircleCenter.current = {\n\t\t\tx: rect.x + rect.width / 2,\n\t\t\ty: rect.y + rect.height / 2,\n\t\t};\n\t};\n\n\tconst changeAngleToPosition = ( event: UseDraggingCallbackEvent ) => {\n\t\tif ( event === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Prevent (drag) mouse events from selecting and accidentally\n\t\t// triggering actions from other elements.\n\t\tevent.preventDefault();\n\t\t// Input control needs to lose focus and by preventDefault above, it doesn't.\n\t\t( event.target as HTMLDivElement \| null )?.focus();\n\n\t\tif (\n\t\t\tangleCircleCenter.current !== undefined &&\n\t\t\tonChange !== undefined\n\t\t) {\n\t\t\tconst { x: centerX, y: centerY } = angleCircleCenter.current;\n\t\t\tonChange(\n\t\t\t\tgetAngle( centerX, centerY, event.clientX, event.clientY )\n\t\t\t);\n\t\t}\n\t};\n\n\tconst { startDrag, isDragging } = useDragging( {\n\t\tonDragStart: ( event ) => {\n\t\t\tsetAngleCircleCenter();\n\t\t\tchangeAngleToPosition( event );\n\t\t},\n\t\tonDragMove: changeAngleToPosition,\n\t\tonDragEnd: changeAngleToPosition,\n\t} );\n\n\tuseEffect( () => {\n\t\tif ( isDragging ) {\n\t\t\tif ( previousCursorValue.current === undefined ) {\n\t\t\t\tpreviousCursorValue.current = document.body.style.cursor;\n\t\t\t}\n\t\t\tdocument.body.style.cursor = 'grabbing';\n\t\t} else {\n\t\t\tdocument.body.style.cursor = previousCursorValue.current \|\| '';\n\t\t\tpreviousCursorValue.current = undefined;\n\t\t}\n\t}, [ isDragging ] );\n\n\treturn (\n\t\t<CircleRoot\n\t\t\tref={ angleCircleRef }\n\t\t\tonMouseDown={ startDrag }\n\t\t\tclassName=\"components-angle-picker-control__angle-circle\"\n\t\t\t{ ...props }\n\t\t>\n\t\t\t<CircleIndicatorWrapper\n\t\t\t\tstyle={\n\t\t\t\t\tvalue ? { transform: `rotate(${ value }deg)` } : undefined\n\t\t\t\t}\n\t\t\t\tclassName=\"components-angle-picker-control__angle-circle-indicator-wrapper\"\n\t\t\t\ttabIndex={ -1 }\n\t\t\t>\n\t\t\t\t<CircleIndicator className=\"components-angle-picker-control__angle-circle-indicator\" />\n\t\t\t</CircleIndicatorWrapper>\n\t\t</CircleRoot>\n\t);\n}\n\nfunction getAngle(\n\tcenterX: number,\n\tcenterY: number,\n\tpointX: number,\n\tpointY: number\n) {\n\tconst y = pointY - centerY;\n\tconst x = pointX - centerX;\n\n\tconst angleInRadians = Math.atan2( y, x );\n\tconst angleInDeg = Math.round( angleInRadians ( 180 / Math.PI ) ) + 90;\n\tif ( angleInDeg < 0 ) {\n\t\treturn 360 + angleInDeg;\n\t}\n\treturn angleInDeg;\n}\n\nexport default AngleCircle;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/angle-picker-control/angle-circle.tsx"],"names":["useEffect","useRef","__experimentalUseDragging","useDragging","CircleRoot","CircleIndicatorWrapper","CircleIndicator","AngleCircle","value","onChange","props","angleCircleRef","angleCircleCenter","previousCursorValue","setAngleCircleCenter","current","rect","getBoundingClientRect","x","width","y","height","changeAngleToPosition","event","undefined","preventDefault","target","focus","centerX","centerY","getAngle","clientX","clientY","startDrag","isDragging","onDragStart","onDragMove","onDragEnd","document","body","style","cursor","transform","pointX","pointY","angleInRadians","Math","atan2","angleInDeg","round","PI"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport { useEffect, useRef } from '@wordpress/element';\nimport { __experimentalUseDragging as useDragging } from '@wordpress/compose';\n\n/\n Internal dependencies\n /\nimport {\n\tCircleRoot,\n\tCircleIndicatorWrapper,\n\tCircleIndicator,\n} from './styles/angle-picker-control-styles';\n\nimport type { WordPressComponentProps } from '../ui/context';\nimport type { AngleCircleProps } from './types';\n\ntype UseDraggingArgumentType = Parameters< typeof useDragging >[ 0 ];\ntype UseDraggingCallbackEvent =\n\t\| Parameters< UseDraggingArgumentType[ 'onDragStart' ] >[ 0 ]\n\t\| Parameters< UseDraggingArgumentType[ 'onDragMove' ] >[ 0 ]\n\t\| Parameters< UseDraggingArgumentType[ 'onDragEnd' ] >[ 0 ];\n\nfunction AngleCircle( {\n\tvalue,\n\tonChange,\n\t...props\n}: WordPressComponentProps< AngleCircleProps, 'div' > ) {\n\tconst angleCircleRef = useRef< HTMLDivElement \| null >( null );\n\tconst angleCircleCenter = useRef< { x: number; y: number } \| undefined >();\n\tconst previousCursorValue = useRef< CSSStyleDeclaration[ 'cursor' ] >();\n\n\tconst setAngleCircleCenter = () => {\n\t\tif ( angleCircleRef.current === null ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst rect = angleCircleRef.current.getBoundingClientRect();\n\t\tangleCircleCenter.current = {\n\t\t\tx: rect.x + rect.width / 2,\n\t\t\ty: rect.y + rect.height / 2,\n\t\t};\n\t};\n\n\tconst changeAngleToPosition = ( event: UseDraggingCallbackEvent ) => {\n\t\tif ( event === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Prevent (drag) mouse events from selecting and accidentally\n\t\t// triggering actions from other elements.\n\t\tevent.preventDefault();\n\t\t// Input control needs to lose focus and by preventDefault above, it doesn't.\n\t\t( event.target as HTMLDivElement \| null )?.focus();\n\n\t\tif (\n\t\t\tangleCircleCenter.current !== undefined &&\n\t\t\tonChange !== undefined\n\t\t) {\n\t\t\tconst { x: centerX, y: centerY } = angleCircleCenter.current;\n\t\t\tonChange(\n\t\t\t\tgetAngle( centerX, centerY, event.clientX, event.clientY )\n\t\t\t);\n\t\t}\n\t};\n\n\tconst { startDrag, isDragging } = useDragging( {\n\t\tonDragStart: ( event ) => {\n\t\t\tsetAngleCircleCenter();\n\t\t\tchangeAngleToPosition( event );\n\t\t},\n\t\tonDragMove: changeAngleToPosition,\n\t\tonDragEnd: changeAngleToPosition,\n\t} );\n\n\tuseEffect( () => {\n\t\tif ( isDragging ) {\n\t\t\tif ( previousCursorValue.current === undefined ) {\n\t\t\t\tpreviousCursorValue.current = document.body.style.cursor;\n\t\t\t}\n\t\t\tdocument.body.style.cursor = 'grabbing';\n\t\t} else {\n\t\t\tdocument.body.style.cursor = previousCursorValue.current \|\| '';\n\t\t\tpreviousCursorValue.current = undefined;\n\t\t}\n\t}, [ isDragging ] );\n\n\treturn (\n\t\t<CircleRoot\n\t\t\tref={ angleCircleRef }\n\t\t\tonMouseDown={ startDrag }\n\t\t\tclassName=\"components-angle-picker-control__angle-circle\"\n\t\t\t{ ...props }\n\t\t>\n\t\t\t<CircleIndicatorWrapper\n\t\t\t\tstyle={\n\t\t\t\t\tvalue ? { transform: `rotate(${ value }deg)` } : undefined\n\t\t\t\t}\n\t\t\t\tclassName=\"components-angle-picker-control__angle-circle-indicator-wrapper\"\n\t\t\t\ttabIndex={ -1 }\n\t\t\t>\n\t\t\t\t<CircleIndicator className=\"components-angle-picker-control__angle-circle-indicator\" />\n\t\t\t</CircleIndicatorWrapper>\n\t\t</CircleRoot>\n\t);\n}\n\nfunction getAngle(\n\tcenterX: number,\n\tcenterY: number,\n\tpointX: number,\n\tpointY: number\n) {\n\tconst y = pointY - centerY;\n\tconst x = pointX - centerX;\n\n\tconst angleInRadians = Math.atan2( y, x );\n\tconst angleInDeg = Math.round( angleInRadians ( 180 / Math.PI ) ) + 90;\n\tif ( angleInDeg < 0 ) {\n\t\treturn 360 + angleInDeg;\n\t}\n\treturn angleInDeg;\n}\n\nexport default AngleCircle;\n"]}

package/build-module/angle-picker-control/index.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 /**
@@ -52,12 +51,12 @@ function UnforwardedAnglePickerControl(props, ref) {
   const classes = classnames('components-angle-picker-control', className);
   const unitText = createElement(UnitText, null, "\xB0");
   const [prefixedUnitText, suffixedUnitText] = isRTL() ? [unitText, null] : [null, unitText];
-  return createElement(Root, _extends({}, restProps, {
+  return createElement(Root, { ...restProps,
     ref: ref,
     __nextHasNoMarginBottom: __nextHasNoMarginBottom,
     className: classes,
     gap: 2
-  }), createElement(FlexBlock, null, createElement(NumberControl, {
+  }, createElement(FlexBlock, null, createElement(NumberControl, {
     label: label,
     className: "components-angle-picker-control__input-field",
     max: 360,

package/build-module/angle-picker-control/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/angle-picker-control/index.tsx"],"names":["classnames","deprecated","forwardRef","isRTL","__","FlexBlock","Spacer","NumberControl","AngleCircle","Root","UnitText","UnforwardedAnglePickerControl","props","ref","__nextHasNoMarginBottom","className","label","onChange","value","restProps","since","version","hint","handleOnNumberChange","unprocessedValue","undefined","inputValue","parseInt","classes","unitText","prefixedUnitText","suffixedUnitText","AnglePickerControl"],"mappings":"~~;;;~~AAAA;AACA;AACA;AAEA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,uBAAvB;AACA,SAASC,UAAT,QAA2B,oBAA3B;AACA,SAASC,KAAT,EAAgBC,EAAhB,QAA0B,iBAA1B;AAEA;AACA;AACA;;AACA,SAASC,SAAT,QAA0B,SAA1B;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AACA,OAAOC,WAAP,MAAwB,gBAAxB;AACA,SAASC,IAAT,EAAeC,QAAf,QAA+B,sCAA/B;;AAKA,SAASC,6BAAT,CACCC,KADD,EAECC,GAFD,EAGE;AACD,QAAM;AACLC,IAAAA,uBAAuB,GAAG,KADrB;AAELC,IAAAA,SAFK;AAGLC,IAAAA,KAAK,GAAGZ,EAAE,CAAE,OAAF,CAHL;AAILa,IAAAA,QAJK;AAKLC,IAAAA,KALK;AAML,OAAGC;AANE,MAOFP,KAPJ;;AASA,MAAK,CAAEE,uBAAP,EAAiC;AAChCb,IAAAA,UAAU,CACT,2DADS,EAET;AACCmB,MAAAA,KAAK,EAAE,KADR;AAECC,MAAAA,OAAO,EAAE,KAFV;AAGCC,MAAAA,IAAI,EAAE;AAHP,KAFS,CAAV;AAQA;;AAED,QAAMC,oBAAoB,GAAKC,gBAAF,IAA4C;AACxE,QAAKP,QAAQ,KAAKQ,SAAlB,EAA8B;AAC7B;AACA;;AAED,UAAMC,UAAU,GACfF,gBAAgB,KAAKC,SAArB,IAAkCD,gBAAgB,KAAK,EAAvD,GACGG,QAAQ,CAAEH,gBAAF,EAAoB,EAApB,CADX,GAEG,CAHJ;AAIAP,IAAAA,QAAQ,CAAES,UAAF,CAAR;AACA,GAVD;;AAYA,QAAME,OAAO,GAAG5B,UAAU,CAAE,iCAAF,EAAqCe,SAArC,CAA1B;AAEA,QAAMc,QAAQ,GAAG,cAAC,QAAD,eAAjB;AACA,QAAM,CAAEC,gBAAF,EAAoBC,gBAApB,IAAyC5B,KAAK,KACjD,CAAE0B,QAAF,EAAY,IAAZ,CADiD,GAEjD,CAAE,IAAF,EAAQA,QAAR,CAFH;AAIA,SACC,cAAC,IAAD,~~eACMV~~,SADN;AAEC,IAAA,GAAG,EAAGN,GAFP;AAGC,IAAA,uBAAuB,EAAGC,uBAH3B;AAIC,IAAA,SAAS,EAAGc,OAJb;AAKC,IAAA,GAAG,EAAG;AALP,~~MAOC~~,cAAC,SAAD,QACC,cAAC,aAAD;AACC,IAAA,KAAK,EAAGZ,KADT;AAEC,IAAA,SAAS,EAAC,8CAFX;AAGC,IAAA,GAAG,EAAG,GAHP;AAIC,IAAA,GAAG,EAAG,CAJP;AAKC,IAAA,QAAQ,EAAGO,oBALZ;AAMC,IAAA,IAAI,EAAC,kBANN;AAOC,IAAA,IAAI,EAAC,GAPN;AAQC,IAAA,KAAK,EAAGL,KART;AASC,IAAA,YAAY,EAAC,MATd;AAUC,IAAA,MAAM,EAAGY,gBAVV;AAWC,IAAA,MAAM,EAAGC;AAXV,IADD,CAPD,EAsBC,cAAC,MAAD;AAAQ,IAAA,YAAY,EAAC,GAArB;AAAyB,IAAA,SAAS,EAAC;AAAnC,KACC,cAAC,WAAD;AACC,mBAAY,MADb;AAEC,IAAA,KAAK,EAAGb,KAFT;AAGC,IAAA,QAAQ,EAAGD;AAHZ,IADD,CAtBD,CADD;AAgCA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,MAAMe,kBAAkB,GAAG9B,UAAU,CAAES,6BAAF,CAArC;AAEP,eAAeqB,kBAAf","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\nimport { isRTL, __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport { FlexBlock } from '../flex';\nimport { Spacer } from '../spacer';\nimport NumberControl from '../number-control';\nimport AngleCircle from './angle-circle';\nimport { Root, UnitText } from './styles/angle-picker-control-styles';\n\nimport type { WordPressComponentProps } from '../ui/context';\nimport type { AnglePickerControlProps } from './types';\n\nfunction UnforwardedAnglePickerControl(\n\tprops: WordPressComponentProps< AnglePickerControlProps, 'div' >,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\tclassName,\n\t\tlabel = __( 'Angle' ),\n\t\tonChange,\n\t\tvalue,\n\t\t...restProps\n\t} = props;\n\n\tif ( ! __nextHasNoMarginBottom ) {\n\t\tdeprecated(\n\t\t\t'Bottom margin styles for wp.components.AnglePickerControl',\n\t\t\t{\n\t\t\t\tsince: '6.1',\n\t\t\t\tversion: '6.4',\n\t\t\t\thint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version.',\n\t\t\t}\n\t\t);\n\t}\n\n\tconst handleOnNumberChange = ( unprocessedValue: string \| undefined ) => {\n\t\tif ( onChange === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst inputValue =\n\t\t\tunprocessedValue !== undefined && unprocessedValue !== ''\n\t\t\t\t? parseInt( unprocessedValue, 10 )\n\t\t\t\t: 0;\n\t\tonChange( inputValue );\n\t};\n\n\tconst classes = classnames( 'components-angle-picker-control', className );\n\n\tconst unitText = <UnitText>°</UnitText>;\n\tconst [ prefixedUnitText, suffixedUnitText ] = isRTL()\n\t\t? [ unitText, null ]\n\t\t: [ null, unitText ];\n\n\treturn (\n\t\t<Root\n\t\t\t{ ...restProps }\n\t\t\tref={ ref }\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\tclassName={ classes }\n\t\t\tgap={ 2 }\n\t\t>\n\t\t\t<FlexBlock>\n\t\t\t\t<NumberControl\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tclassName=\"components-angle-picker-control__input-field\"\n\t\t\t\t\tmax={ 360 }\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tonChange={ handleOnNumberChange }\n\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\tstep=\"1\"\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\tprefix={ prefixedUnitText }\n\t\t\t\t\tsuffix={ suffixedUnitText }\n\t\t\t\t/>\n\t\t\t</FlexBlock>\n\t\t\t<Spacer marginBottom=\"1\" marginTop=\"auto\">\n\t\t\t\t<AngleCircle\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t/>\n\t\t\t</Spacer>\n\t\t</Root>\n\t);\n}\n\n/\n `AnglePickerControl` is a React component to render a UI that allows users to\n * pick an angle. Users can choose an angle in a visual UI with the mouse by\n * dragging an angle indicator inside a circle or by directly inserting the\n * desired angle in a text field.\n \n ```jsx\n * import { useState } from '@wordpress/element';\n * import { AnglePickerControl } from '@wordpress/components';\n \n function Example() {\n * const [ angle, setAngle ] = useState( 0 );\n * return (\n * <AnglePickerControl\n * value={ angle }\n * onChange={ setAngle }\n * __nextHasNoMarginBottom\n * </>\n * );\n * }\n * ```\n */\nexport const AnglePickerControl = forwardRef( UnforwardedAnglePickerControl );\n\nexport default AnglePickerControl;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/angle-picker-control/index.tsx"],"names":["classnames","deprecated","forwardRef","isRTL","__","FlexBlock","Spacer","NumberControl","AngleCircle","Root","UnitText","UnforwardedAnglePickerControl","props","ref","__nextHasNoMarginBottom","className","label","onChange","value","restProps","since","version","hint","handleOnNumberChange","unprocessedValue","undefined","inputValue","parseInt","classes","unitText","prefixedUnitText","suffixedUnitText","AnglePickerControl"],"mappings":";;AAAA;AACA;AACA;AAEA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,uBAAvB;AACA,SAASC,UAAT,QAA2B,oBAA3B;AACA,SAASC,KAAT,EAAgBC,EAAhB,QAA0B,iBAA1B;AAEA;AACA;AACA;;AACA,SAASC,SAAT,QAA0B,SAA1B;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AACA,OAAOC,WAAP,MAAwB,gBAAxB;AACA,SAASC,IAAT,EAAeC,QAAf,QAA+B,sCAA/B;;AAKA,SAASC,6BAAT,CACCC,KADD,EAECC,GAFD,EAGE;AACD,QAAM;AACLC,IAAAA,uBAAuB,GAAG,KADrB;AAELC,IAAAA,SAFK;AAGLC,IAAAA,KAAK,GAAGZ,EAAE,CAAE,OAAF,CAHL;AAILa,IAAAA,QAJK;AAKLC,IAAAA,KALK;AAML,OAAGC;AANE,MAOFP,KAPJ;;AASA,MAAK,CAAEE,uBAAP,EAAiC;AAChCb,IAAAA,UAAU,CACT,2DADS,EAET;AACCmB,MAAAA,KAAK,EAAE,KADR;AAECC,MAAAA,OAAO,EAAE,KAFV;AAGCC,MAAAA,IAAI,EAAE;AAHP,KAFS,CAAV;AAQA;;AAED,QAAMC,oBAAoB,GAAKC,gBAAF,IAA4C;AACxE,QAAKP,QAAQ,KAAKQ,SAAlB,EAA8B;AAC7B;AACA;;AAED,UAAMC,UAAU,GACfF,gBAAgB,KAAKC,SAArB,IAAkCD,gBAAgB,KAAK,EAAvD,GACGG,QAAQ,CAAEH,gBAAF,EAAoB,EAApB,CADX,GAEG,CAHJ;AAIAP,IAAAA,QAAQ,CAAES,UAAF,CAAR;AACA,GAVD;;AAYA,QAAME,OAAO,GAAG5B,UAAU,CAAE,iCAAF,EAAqCe,SAArC,CAA1B;AAEA,QAAMc,QAAQ,GAAG,cAAC,QAAD,eAAjB;AACA,QAAM,CAAEC,gBAAF,EAAoBC,gBAApB,IAAyC5B,KAAK,KACjD,CAAE0B,QAAF,EAAY,IAAZ,CADiD,GAEjD,CAAE,IAAF,EAAQA,QAAR,CAFH;AAIA,SACC,cAAC,IAAD,OACMV,SADN;AAEC,IAAA,GAAG,EAAGN,GAFP;AAGC,IAAA,uBAAuB,EAAGC,uBAH3B;AAIC,IAAA,SAAS,EAAGc,OAJb;AAKC,IAAA,GAAG,EAAG;AALP,KAOC,cAAC,SAAD,QACC,cAAC,aAAD;AACC,IAAA,KAAK,EAAGZ,KADT;AAEC,IAAA,SAAS,EAAC,8CAFX;AAGC,IAAA,GAAG,EAAG,GAHP;AAIC,IAAA,GAAG,EAAG,CAJP;AAKC,IAAA,QAAQ,EAAGO,oBALZ;AAMC,IAAA,IAAI,EAAC,kBANN;AAOC,IAAA,IAAI,EAAC,GAPN;AAQC,IAAA,KAAK,EAAGL,KART;AASC,IAAA,YAAY,EAAC,MATd;AAUC,IAAA,MAAM,EAAGY,gBAVV;AAWC,IAAA,MAAM,EAAGC;AAXV,IADD,CAPD,EAsBC,cAAC,MAAD;AAAQ,IAAA,YAAY,EAAC,GAArB;AAAyB,IAAA,SAAS,EAAC;AAAnC,KACC,cAAC,WAAD;AACC,mBAAY,MADb;AAEC,IAAA,KAAK,EAAGb,KAFT;AAGC,IAAA,QAAQ,EAAGD;AAHZ,IADD,CAtBD,CADD;AAgCA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,MAAMe,kBAAkB,GAAG9B,UAAU,CAAES,6BAAF,CAArC;AAEP,eAAeqB,kBAAf","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\nimport { isRTL, __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport { FlexBlock } from '../flex';\nimport { Spacer } from '../spacer';\nimport NumberControl from '../number-control';\nimport AngleCircle from './angle-circle';\nimport { Root, UnitText } from './styles/angle-picker-control-styles';\n\nimport type { WordPressComponentProps } from '../ui/context';\nimport type { AnglePickerControlProps } from './types';\n\nfunction UnforwardedAnglePickerControl(\n\tprops: WordPressComponentProps< AnglePickerControlProps, 'div' >,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\tclassName,\n\t\tlabel = __( 'Angle' ),\n\t\tonChange,\n\t\tvalue,\n\t\t...restProps\n\t} = props;\n\n\tif ( ! __nextHasNoMarginBottom ) {\n\t\tdeprecated(\n\t\t\t'Bottom margin styles for wp.components.AnglePickerControl',\n\t\t\t{\n\t\t\t\tsince: '6.1',\n\t\t\t\tversion: '6.4',\n\t\t\t\thint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version.',\n\t\t\t}\n\t\t);\n\t}\n\n\tconst handleOnNumberChange = ( unprocessedValue: string \| undefined ) => {\n\t\tif ( onChange === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst inputValue =\n\t\t\tunprocessedValue !== undefined && unprocessedValue !== ''\n\t\t\t\t? parseInt( unprocessedValue, 10 )\n\t\t\t\t: 0;\n\t\tonChange( inputValue );\n\t};\n\n\tconst classes = classnames( 'components-angle-picker-control', className );\n\n\tconst unitText = <UnitText>°</UnitText>;\n\tconst [ prefixedUnitText, suffixedUnitText ] = isRTL()\n\t\t? [ unitText, null ]\n\t\t: [ null, unitText ];\n\n\treturn (\n\t\t<Root\n\t\t\t{ ...restProps }\n\t\t\tref={ ref }\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\tclassName={ classes }\n\t\t\tgap={ 2 }\n\t\t>\n\t\t\t<FlexBlock>\n\t\t\t\t<NumberControl\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tclassName=\"components-angle-picker-control__input-field\"\n\t\t\t\t\tmax={ 360 }\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tonChange={ handleOnNumberChange }\n\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\tstep=\"1\"\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\tprefix={ prefixedUnitText }\n\t\t\t\t\tsuffix={ suffixedUnitText }\n\t\t\t\t/>\n\t\t\t</FlexBlock>\n\t\t\t<Spacer marginBottom=\"1\" marginTop=\"auto\">\n\t\t\t\t<AngleCircle\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t/>\n\t\t\t</Spacer>\n\t\t</Root>\n\t);\n}\n\n/\n `AnglePickerControl` is a React component to render a UI that allows users to\n * pick an angle. Users can choose an angle in a visual UI with the mouse by\n * dragging an angle indicator inside a circle or by directly inserting the\n * desired angle in a text field.\n \n ```jsx\n * import { useState } from '@wordpress/element';\n * import { AnglePickerControl } from '@wordpress/components';\n \n function Example() {\n * const [ angle, setAngle ] = useState( 0 );\n * return (\n * <AnglePickerControl\n * value={ angle }\n * onChange={ setAngle }\n * __nextHasNoMarginBottom\n * </>\n * );\n * }\n * ```\n */\nexport const AnglePickerControl = forwardRef( UnforwardedAnglePickerControl );\n\nexport default AnglePickerControl;\n"]}

package/build-module/autocomplete/autocompleter-ui.js CHANGED Viewed

@@ -10,7 +10,9 @@ import classnames from 'classnames';
 import { useLayoutEffect, useRef, useEffect, useState } from '@wordpress/element';
 import { useAnchor } from '@wordpress/rich-text';
-import { useMergeRefs, useRefEffect } from '@wordpress/compose';
+import { useDebounce, useMergeRefs, useRefEffect } from '@wordpress/compose';
+import { speak } from '@wordpress/a11y';
+import { __, _n, sprintf } from '@wordpress/i18n';
 /**
  * Internal dependencies
  */
@@ -50,8 +52,31 @@ export function getAutoCompleterUI(autocompleter) {
       setNeedsA11yCompat(node.ownerDocument !== contentRef.current.ownerDocument);
     }, [contentRef])]);
     useOnClickOutside(popoverRef, reset);
+    const debouncedSpeak = useDebounce(speak, 500);
+    function announce(options) {
+      if (!debouncedSpeak) {
+        return;
+      }
+      if (!!options.length) {
+        if (filterValue) {
+          debouncedSpeak(sprintf(
+          /* translators: %d: number of results. */
+          _n('%d result found, use up and down arrow keys to navigate.', '%d results found, use up and down arrow keys to navigate.', options.length), options.length), 'assertive');
+        } else {
+          debouncedSpeak(sprintf(
+          /* translators: %d: number of results. */
+          _n('Initial %d result loaded. Type to filter all available results. Use up and down arrow keys to navigate.', 'Initial %d results loaded. Type to filter all available results. Use up and down arrow keys to navigate.', options.length), options.length), 'assertive');
+        }
+      } else {
+        debouncedSpeak(__('No results.'), 'assertive');
+      }
+    }
     useLayoutEffect(() => {
-      onChangeOptions(items); // Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.
+      onChangeOptions(items);
+      announce(items); // Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.
       // See https://github.com/WordPress/gutenberg/pull/41820
       // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [items]);