@wordpress/components 25.6.1 → 25.8.0

package/build/color-picker/saturation-picker.native.js

@@ -0,0 +1,178 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _element = _interopRequireWildcard(require("@wordpress/element"));
+var _reactNative = require("react-native");
+var _reactNativeLinearGradient = _interopRequireDefault(require("react-native-linear-gradient"));
+var _colord = require("colord");
+var _styleNative = _interopRequireDefault(require("./style.native.scss"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/**
+ * External dependencies
+ */
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+
+class SaturationValuePicker extends _element.Component {
+  constructor(props) {
+    super(props);
+    this.panResponder = _reactNative.PanResponder.create({
+      onStartShouldSetPanResponder: () => true,
+      onStartShouldSetPanResponderCapture: () => true,
+      onMoveShouldSetPanResponder: () => true,
+      onMoveShouldSetPanResponderCapture: () => true,
+      onPanResponderGrant: (evt, gestureState) => {
+        const {
+          onPress
+        } = this.props;
+        const {
+          saturation,
+          value
+        } = this.computeSatValPress(evt);
+        this.dragStartValue = {
+          saturation,
+          value
+        };
+        if (onPress) {
+          onPress({
+            ...this.computeSatValPress(evt),
+            nativeEvent: evt.nativeEvent
+          });
+        }
+        this.fireDragEvent('onDragStart', gestureState);
+      },
+      onPanResponderMove: (evt, gestureState) => {
+        this.fireDragEvent('onDragMove', gestureState);
+      },
+      onPanResponderTerminationRequest: () => true,
+      onPanResponderRelease: (evt, gestureState) => {
+        this.fireDragEvent('onDragEnd', gestureState);
+      },
+      onPanResponderTerminate: (evt, gestureState) => {
+        this.fireDragEvent('onDragTerminate', gestureState);
+      },
+      onShouldBlockNativeResponder: () => true
+    });
+  }
+  normalizeValue(value) {
+    if (value < 0) return 0;
+    if (value > 1) return 1;
+    return value;
+  }
+  computeSatValDrag(gestureState) {
+    const {
+      dx,
+      dy
+    } = gestureState;
+    const {
+      size
+    } = this.props;
+    const {
+      saturation,
+      value
+    } = this.dragStartValue;
+    const diffx = dx / size.width;
+    const diffy = dy / size.height;
+    return {
+      saturation: this.normalizeValue(saturation + diffx),
+      value: this.normalizeValue(value - diffy)
+    };
+  }
+  computeSatValPress(event) {
+    const {
+      nativeEvent
+    } = event;
+    const {
+      locationX,
+      locationY
+    } = nativeEvent;
+    const {
+      size
+    } = this.props;
+    return {
+      saturation: this.normalizeValue(locationX / size.width),
+      value: 1 - this.normalizeValue(locationY / size.height)
+    };
+  }
+  fireDragEvent(eventName, gestureState) {
+    const {
+      [eventName]: event
+    } = this.props;
+    if (event) {
+      event({
+        ...this.computeSatValDrag(gestureState),
+        gestureState
+      });
+    }
+  }
+  render() {
+    const {
+      size,
+      sliderSize = 24,
+      hue = 0,
+      value = 1,
+      saturation = 1,
+      containerStyle = {},
+      borderRadius = 0,
+      currentColor
+    } = this.props;
+    return (0, _element.createElement)(_reactNative.View, {
+      style: [_styleNative.default['hsv-container'], containerStyle, {
+        height: size.height + sliderSize,
+        width: size.width + sliderSize
+      }],
+      ...this.panResponder.panHandlers
+    }, (0, _element.createElement)(_reactNativeLinearGradient.default, {
+      style: [_styleNative.default['gradient-container'], {
+        borderRadius
+      }],
+      colors: ['#fff', (0, _colord.colord)({
+        h: hue,
+        s: 100,
+        l: 50
+      }).toHex()],
+      start: {
+        x: 0,
+        y: 0.5
+      },
+      end: {
+        x: 1,
+        y: 0.5
+      }
+    }, (0, _element.createElement)(_reactNativeLinearGradient.default, {
+      colors: ['rgba(0, 0, 0, 0)', '#000']
+    }, (0, _element.createElement)(_reactNative.View, {
+      style: {
+        height: size.height,
+        width: size.width
+      }
+    }))), (0, _element.createElement)(_reactNative.View, {
+      pointerEvents: "none",
+      style: [_styleNative.default['saturation-slider'], {
+        width: sliderSize,
+        height: sliderSize,
+        borderRadius: sliderSize / 2,
+        borderWidth: sliderSize / 10,
+        backgroundColor: currentColor,
+        transform: [{
+          translateX: size.width * saturation
+        }, {
+          translateY: size.height * (1 - value)
+        }]
+      }]
+    }));
+  }
+}
+exports.default = SaturationValuePicker;
+//# sourceMappingURL=saturation-picker.native.js.map

package/build/color-picker/saturation-picker.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_element","_interopRequireWildcard","require","_reactNative","_reactNativeLinearGradient","_interopRequireDefault","_colord","_styleNative","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","SaturationValuePicker","Component","constructor","props","panResponder","PanResponder","create","onStartShouldSetPanResponder","onStartShouldSetPanResponderCapture","onMoveShouldSetPanResponder","onMoveShouldSetPanResponderCapture","onPanResponderGrant","evt","gestureState","onPress","saturation","value","computeSatValPress","dragStartValue","nativeEvent","fireDragEvent","onPanResponderMove","onPanResponderTerminationRequest","onPanResponderRelease","onPanResponderTerminate","onShouldBlockNativeResponder","normalizeValue","computeSatValDrag","dx","dy","size","diffx","width","diffy","height","event","locationX","locationY","eventName","render","sliderSize","hue","containerStyle","borderRadius","currentColor","createElement","View","style","styles","panHandlers","colors","colord","h","s","l","toHex","start","x","y","end","pointerEvents","borderWidth","backgroundColor","transform","translateX","translateY","exports"],"sources":["@wordpress/components/src/color-picker/saturation-picker.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { View, PanResponder } from 'react-native';\nimport LinearGradient from 'react-native-linear-gradient';\nimport { colord } from 'colord';\n\n/**\n * WordPress dependencies\n */\nimport React, { Component } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.native.scss';\n\nexport default class SaturationValuePicker extends Component {\n\tconstructor( props ) {\n\t\tsuper( props );\n\n\t\tthis.panResponder = PanResponder.create( {\n\t\t\tonStartShouldSetPanResponder: () => true,\n\t\t\tonStartShouldSetPanResponderCapture: () => true,\n\t\t\tonMoveShouldSetPanResponder: () => true,\n\t\t\tonMoveShouldSetPanResponderCapture: () => true,\n\t\t\tonPanResponderGrant: ( evt, gestureState ) => {\n\t\t\t\tconst { onPress } = this.props;\n\t\t\t\tconst { saturation, value } = this.computeSatValPress( evt );\n\t\t\t\tthis.dragStartValue = {\n\t\t\t\t\tsaturation,\n\t\t\t\t\tvalue,\n\t\t\t\t};\n\n\t\t\t\tif ( onPress ) {\n\t\t\t\t\tonPress( {\n\t\t\t\t\t\t...this.computeSatValPress( evt ),\n\t\t\t\t\t\tnativeEvent: evt.nativeEvent,\n\t\t\t\t\t} );\n\t\t\t\t}\n\n\t\t\t\tthis.fireDragEvent( 'onDragStart', gestureState );\n\t\t\t},\n\t\t\tonPanResponderMove: ( evt, gestureState ) => {\n\t\t\t\tthis.fireDragEvent( 'onDragMove', gestureState );\n\t\t\t},\n\t\t\tonPanResponderTerminationRequest: () => true,\n\t\t\tonPanResponderRelease: ( evt, gestureState ) => {\n\t\t\t\tthis.fireDragEvent( 'onDragEnd', gestureState );\n\t\t\t},\n\t\t\tonPanResponderTerminate: ( evt, gestureState ) => {\n\t\t\t\tthis.fireDragEvent( 'onDragTerminate', gestureState );\n\t\t\t},\n\t\t\tonShouldBlockNativeResponder: () => true,\n\t\t} );\n\t}\n\n\tnormalizeValue( value ) {\n\t\tif ( value < 0 ) return 0;\n\t\tif ( value > 1 ) return 1;\n\t\treturn value;\n\t}\n\n\tcomputeSatValDrag( gestureState ) {\n\t\tconst { dx, dy } = gestureState;\n\t\tconst { size } = this.props;\n\t\tconst { saturation, value } = this.dragStartValue;\n\t\tconst diffx = dx / size.width;\n\t\tconst diffy = dy / size.height;\n\t\treturn {\n\t\t\tsaturation: this.normalizeValue( saturation + diffx ),\n\t\t\tvalue: this.normalizeValue( value - diffy ),\n\t\t};\n\t}\n\n\tcomputeSatValPress( event ) {\n\t\tconst { nativeEvent } = event;\n\t\tconst { locationX, locationY } = nativeEvent;\n\t\tconst { size } = this.props;\n\t\treturn {\n\t\t\tsaturation: this.normalizeValue( locationX / size.width ),\n\t\t\tvalue: 1 - this.normalizeValue( locationY / size.height ),\n\t\t};\n\t}\n\n\tfireDragEvent( eventName, gestureState ) {\n\t\tconst { [ eventName ]: event } = this.props;\n\t\tif ( event ) {\n\t\t\tevent( {\n\t\t\t\t...this.computeSatValDrag( gestureState ),\n\t\t\t\tgestureState,\n\t\t\t} );\n\t\t}\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tsize,\n\t\t\tsliderSize = 24,\n\t\t\thue = 0,\n\t\t\tvalue = 1,\n\t\t\tsaturation = 1,\n\t\t\tcontainerStyle = {},\n\t\t\tborderRadius = 0,\n\t\t\tcurrentColor,\n\t\t} = this.props;\n\n\t\treturn (\n\t\t\t<View\n\t\t\t\tstyle={ [\n\t\t\t\t\tstyles[ 'hsv-container' ],\n\t\t\t\t\tcontainerStyle,\n\t\t\t\t\t{\n\t\t\t\t\t\theight: size.height + sliderSize,\n\t\t\t\t\t\twidth: size.width + sliderSize,\n\t\t\t\t\t},\n\t\t\t\t] }\n\t\t\t\t{ ...this.panResponder.panHandlers }\n\t\t\t>\n\t\t\t\t<LinearGradient\n\t\t\t\t\tstyle={ [\n\t\t\t\t\t\tstyles[ 'gradient-container' ],\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tborderRadius,\n\t\t\t\t\t\t},\n\t\t\t\t\t] }\n\t\t\t\t\tcolors={ [\n\t\t\t\t\t\t'#fff',\n\t\t\t\t\t\tcolord( { h: hue, s: 100, l: 50 } ).toHex(),\n\t\t\t\t\t] }\n\t\t\t\t\tstart={ { x: 0, y: 0.5 } }\n\t\t\t\t\tend={ { x: 1, y: 0.5 } }\n\t\t\t\t>\n\t\t\t\t\t<LinearGradient colors={ [ 'rgba(0, 0, 0, 0)', '#000' ] }>\n\t\t\t\t\t\t<View\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: size.height,\n\t\t\t\t\t\t\t\twidth: size.width,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</LinearGradient>\n\t\t\t\t</LinearGradient>\n\t\t\t\t<View\n\t\t\t\t\tpointerEvents=\"none\"\n\t\t\t\t\tstyle={ [\n\t\t\t\t\t\tstyles[ 'saturation-slider' ],\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\twidth: sliderSize,\n\t\t\t\t\t\t\theight: sliderSize,\n\t\t\t\t\t\t\tborderRadius: sliderSize / 2,\n\t\t\t\t\t\t\tborderWidth: sliderSize / 10,\n\t\t\t\t\t\t\tbackgroundColor: currentColor,\n\t\t\t\t\t\t\ttransform: [\n\t\t\t\t\t\t\t\t{ translateX: size.width * saturation },\n\t\t\t\t\t\t\t\t{ translateY: size.height * ( 1 - value ) },\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/>\n\t\t\t</View>\n\t\t);\n\t}\n}\n"],"mappings":"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"}

package/build/combobox-control/index.js

@@ -35,13 +35,10 @@ var _useDeprecatedProps = require("../utils/use-deprecated-props");
 
 const noop = () => {};
 const DetectOutside = (0, _withFocusOutside.default)(class extends _element.Component {
-  // @ts-expect-error - TODO: Should be resolved when `withFocusOutside` is refactored to TypeScript
   handleFocusOutside(event) {
-    // @ts-expect-error - TODO: Should be resolved when `withFocusOutside` is refactored to TypeScript
     this.props.onFocusOutside(event);
   }
   render() {
-    // @ts-expect-error - TODO: Should be resolved when `withFocusOutside` is refactored to TypeScript
     return this.props.children;
   }
 });

package/build/combobox-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_i18n","_compose","_a11y","_icons","_styles","_tokenInput","_suggestionsList","_baseControl","_button","_flex","_withFocusOutside","_hooks","_strings","_useDeprecatedProps","noop","DetectOutside","withFocusOutside","Component","handleFocusOutside","event","props","onFocusOutside","render","children","getIndexOfMatchingSuggestion","selectedSuggestion","matchingSuggestions","indexOf","ComboboxControl","_currentOption$label","__nextHasNoMarginBottom","__next40pxDefaultSize","value","valueProp","label","options","onChange","onChangeProp","onFilterValueChange","hideLabelFromVision","help","allowReset","className","messages","selected","__","__experimentalRenderItem","useDeprecated36pxDefaultSizeProp","setValue","useControlledValue","currentOption","find","option","currentLabel","instanceId","useInstanceId","setSelectedSuggestion","useState","isExpanded","setIsExpanded","inputHasFocus","setInputHasFocus","inputValue","setInputValue","inputContainer","useRef","useMemo","startsWithMatch","containsMatch","match","normalizeTextString","forEach","index","push","concat","onSuggestionSelected","newSelectedSuggestion","speak","handleArrowNavigation","offset","nextIndex","length","onKeyDown","preventDefault","defaultPrevented","nativeEvent","isComposing","keyCode","code","onBlur","onFocus","onInputChange","text","handleOnReset","current","focus","useEffect","hasMatchingSuggestions","hasSelectedMatchingSuggestions","message","sprintf","_n","createElement","default","classnames","id","tabIndex","InputWrapperFlex","FlexBlock","ref","selectedSuggestionIndex","FlexItem","icon","closeSmall","disabled","onClick","displayTransform","suggestion","suggestions","selectedIndex","onHover","onSelect","scrollIntoView","_default","exports"],"sources":["@wordpress/components/src/combobox-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport {\n\tComponent,\n\tuseState,\n\tuseMemo,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { InputWrapperFlex } from './styles';\nimport TokenInput from '../form-token-field/token-input';\nimport SuggestionsList from '../form-token-field/suggestions-list';\nimport BaseControl from '../base-control';\nimport Button from '../button';\nimport { FlexBlock, FlexItem } from '../flex';\nimport withFocusOutside from '../higher-order/with-focus-outside';\nimport { useControlledValue } from '../utils/hooks';\nimport { normalizeTextString } from '../utils/strings';\nimport type { ComboboxControlOption, ComboboxControlProps } from './types';\nimport type { TokenInputProps } from '../form-token-field/types';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\n\nconst noop = () => {};\n\nconst DetectOutside = withFocusOutside(\n\tclass extends Component {\n\t\t// @ts-expect-error - TODO: Should be resolved when `withFocusOutside` is refactored to TypeScript\n\t\thandleFocusOutside( event ) {\n\t\t\t// @ts-expect-error - TODO: Should be resolved when `withFocusOutside` is refactored to TypeScript\n\t\t\tthis.props.onFocusOutside( event );\n\t\t}\n\n\t\trender() {\n\t\t\t// @ts-expect-error - TODO: Should be resolved when `withFocusOutside` is refactored to TypeScript\n\t\t\treturn this.props.children;\n\t\t}\n\t}\n);\n\nconst getIndexOfMatchingSuggestion = (\n\tselectedSuggestion: ComboboxControlOption | null,\n\tmatchingSuggestions: ComboboxControlOption[]\n) =>\n\tselectedSuggestion === null\n\t\t? -1\n\t\t: matchingSuggestions.indexOf( selectedSuggestion );\n\n/**\n * `ComboboxControl` is an enhanced version of a [`SelectControl`](../select-control/README.md) with the addition of\n * being able to search for options using a search input.\n *\n * ```jsx\n * import { ComboboxControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const options = [\n * \t{\n * \t\tvalue: 'small',\n * \t\tlabel: 'Small',\n * \t},\n * \t{\n * \t\tvalue: 'normal',\n * \t\tlabel: 'Normal',\n * \t},\n * \t{\n * \t\tvalue: 'large',\n * \t\tlabel: 'Large',\n * \t},\n * ];\n *\n * function MyComboboxControl() {\n * \tconst [ fontSize, setFontSize ] = useState();\n * \tconst [ filteredOptions, setFilteredOptions ] = useState( options );\n * \treturn (\n * \t\t<ComboboxControl\n * \t\t\tlabel=\"Font Size\"\n * \t\t\tvalue={ fontSize }\n * \t\t\tonChange={ setFontSize }\n * \t\t\toptions={ filteredOptions }\n * \t\t\tonFilterValueChange={ ( inputValue ) =>\n * \t\t\t\tsetFilteredOptions(\n * \t\t\t\t\toptions.filter( ( option ) =>\n * \t\t\t\t\t\toption.label\n * \t\t\t\t\t\t\t.toLowerCase()\n * \t\t\t\t\t\t\t.startsWith( inputValue.toLowerCase() )\n * \t\t\t\t\t)\n * \t\t\t\t)\n * \t\t\t}\n * \t\t/>\n * \t);\n * }\n * ```\n */\nfunction ComboboxControl( props: ComboboxControlProps ) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\t__next40pxDefaultSize = false,\n\t\tvalue: valueProp,\n\t\tlabel,\n\t\toptions,\n\t\tonChange: onChangeProp,\n\t\tonFilterValueChange = noop,\n\t\thideLabelFromVision,\n\t\thelp,\n\t\tallowReset = true,\n\t\tclassName,\n\t\tmessages = {\n\t\t\tselected: __( 'Item selected.' ),\n\t\t},\n\t\t__experimentalRenderItem,\n\t} = useDeprecated36pxDefaultSizeProp< ComboboxControlProps >(\n\t\tprops,\n\t\t'wp.components.ComboboxControl'\n\t);\n\n\tconst [ value, setValue ] = useControlledValue( {\n\t\tvalue: valueProp,\n\t\tonChange: onChangeProp,\n\t} );\n\n\tconst currentOption = options.find( ( option ) => option.value === value );\n\tconst currentLabel = currentOption?.label ?? '';\n\t// Use a custom prefix when generating the `instanceId` to avoid having\n\t// duplicate input IDs when rendering this component and `FormTokenField`\n\t// in the same page (see https://github.com/WordPress/gutenberg/issues/42112).\n\tconst instanceId = useInstanceId( ComboboxControl, 'combobox-control' );\n\tconst [ selectedSuggestion, setSelectedSuggestion ] = useState(\n\t\tcurrentOption || null\n\t);\n\tconst [ isExpanded, setIsExpanded ] = useState( false );\n\tconst [ inputHasFocus, setInputHasFocus ] = useState( false );\n\tconst [ inputValue, setInputValue ] = useState( '' );\n\tconst inputContainer = useRef< HTMLInputElement >( null );\n\n\tconst matchingSuggestions = useMemo( () => {\n\t\tconst startsWithMatch: ComboboxControlOption[] = [];\n\t\tconst containsMatch: ComboboxControlOption[] = [];\n\t\tconst match = normalizeTextString( inputValue );\n\t\toptions.forEach( ( option ) => {\n\t\t\tconst index = normalizeTextString( option.label ).indexOf( match );\n\t\t\tif ( index === 0 ) {\n\t\t\t\tstartsWithMatch.push( option );\n\t\t\t} else if ( index > 0 ) {\n\t\t\t\tcontainsMatch.push( option );\n\t\t\t}\n\t\t} );\n\n\t\treturn startsWithMatch.concat( containsMatch );\n\t}, [ inputValue, options ] );\n\n\tconst onSuggestionSelected = (\n\t\tnewSelectedSuggestion: ComboboxControlOption\n\t) => {\n\t\tsetValue( newSelectedSuggestion.value );\n\t\tspeak( messages.selected, 'assertive' );\n\t\tsetSelectedSuggestion( newSelectedSuggestion );\n\t\tsetInputValue( '' );\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst handleArrowNavigation = ( offset = 1 ) => {\n\t\tconst index = getIndexOfMatchingSuggestion(\n\t\t\tselectedSuggestion,\n\t\t\tmatchingSuggestions\n\t\t);\n\t\tlet nextIndex = index + offset;\n\t\tif ( nextIndex < 0 ) {\n\t\t\tnextIndex = matchingSuggestions.length - 1;\n\t\t} else if ( nextIndex >= matchingSuggestions.length ) {\n\t\t\tnextIndex = 0;\n\t\t}\n\t\tsetSelectedSuggestion( matchingSuggestions[ nextIndex ] );\n\t\tsetIsExpanded( true );\n\t};\n\n\tconst onKeyDown: React.KeyboardEventHandler< HTMLDivElement > = (\n\t\tevent\n\t) => {\n\t\tlet preventDefault = false;\n\n\t\tif (\n\t\t\tevent.defaultPrevented ||\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.isComposing ||\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tswitch ( event.code ) {\n\t\t\tcase 'Enter':\n\t\t\t\tif ( selectedSuggestion ) {\n\t\t\t\t\tonSuggestionSelected( selectedSuggestion );\n\t\t\t\t\tpreventDefault = true;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowUp':\n\t\t\t\thandleArrowNavigation( -1 );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowDown':\n\t\t\t\thandleArrowNavigation( 1 );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tcase 'Escape':\n\t\t\t\tsetIsExpanded( false );\n\t\t\t\tsetSelectedSuggestion( null );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t};\n\n\tconst onBlur = () => {\n\t\tsetInputHasFocus( false );\n\t};\n\n\tconst onFocus = () => {\n\t\tsetInputHasFocus( true );\n\t\tsetIsExpanded( true );\n\t\tonFilterValueChange( '' );\n\t\tsetInputValue( '' );\n\t};\n\n\tconst onFocusOutside = () => {\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst onInputChange: TokenInputProps[ 'onChange' ] = ( event ) => {\n\t\tconst text = event.value;\n\t\tsetInputValue( text );\n\t\tonFilterValueChange( text );\n\t\tif ( inputHasFocus ) {\n\t\t\tsetIsExpanded( true );\n\t\t}\n\t};\n\n\tconst handleOnReset = () => {\n\t\tsetValue( null );\n\t\tinputContainer.current?.focus();\n\t};\n\n\t// Update current selections when the filter input changes.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tconst hasSelectedMatchingSuggestions =\n\t\t\tgetIndexOfMatchingSuggestion(\n\t\t\t\tselectedSuggestion,\n\t\t\t\tmatchingSuggestions\n\t\t\t) > 0;\n\n\t\tif ( hasMatchingSuggestions && ! hasSelectedMatchingSuggestions ) {\n\t\t\t// If the current selection isn't present in the list of suggestions, then automatically select the first item from the list of suggestions.\n\t\t\tsetSelectedSuggestion( matchingSuggestions[ 0 ] );\n\t\t}\n\t}, [ matchingSuggestions, selectedSuggestion ] );\n\n\t// Announcements.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tif ( isExpanded ) {\n\t\t\tconst message = hasMatchingSuggestions\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t/* translators: %d: number of results. */\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d result found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\t'%d results found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t\t\t),\n\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t  )\n\t\t\t\t: __( 'No results.' );\n\n\t\t\tspeak( message, 'polite' );\n\t\t}\n\t}, [ matchingSuggestions, isExpanded ] );\n\n\t// Disable reason: There is no appropriate role which describes the\n\t// input container intended accessible usability.\n\t// TODO: Refactor click detection to use blur to stop propagation.\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<DetectOutside onFocusOutside={ onFocusOutside }>\n\t\t\t<BaseControl\n\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\tclassName,\n\t\t\t\t\t'components-combobox-control'\n\t\t\t\t) }\n\t\t\t\tlabel={ label }\n\t\t\t\tid={ `components-form-token-input-${ instanceId }` }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\thelp={ help }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"components-combobox-control__suggestions-container\"\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<InputWrapperFlex\n\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t<TokenInput\n\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__input\"\n\t\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\t\tref={ inputContainer }\n\t\t\t\t\t\t\t\tvalue={ isExpanded ? inputValue : currentLabel }\n\t\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\t\t\t\tisExpanded={ isExpanded }\n\t\t\t\t\t\t\t\tselectedSuggestionIndex={ getIndexOfMatchingSuggestion(\n\t\t\t\t\t\t\t\t\tselectedSuggestion,\n\t\t\t\t\t\t\t\t\tmatchingSuggestions\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonChange={ onInputChange }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t{ allowReset && (\n\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__reset\"\n\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\tdisabled={ ! value }\n\t\t\t\t\t\t\t\t\tonClick={ handleOnReset }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</InputWrapperFlex>\n\t\t\t\t\t{ isExpanded && (\n\t\t\t\t\t\t<SuggestionsList\n\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\t// The empty string for `value` here is not actually used, but is\n\t\t\t\t\t\t\t// just a quick way to satisfy the TypeScript requirements of SuggestionsList.\n\t\t\t\t\t\t\t// See: https://github.com/WordPress/gutenberg/pull/47581/files#r1091089330\n\t\t\t\t\t\t\tmatch={ { label: inputValue, value: '' } }\n\t\t\t\t\t\t\tdisplayTransform={ ( suggestion ) =>\n\t\t\t\t\t\t\t\tsuggestion.label\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsuggestions={ matchingSuggestions }\n\t\t\t\t\t\t\tselectedIndex={ getIndexOfMatchingSuggestion(\n\t\t\t\t\t\t\t\tselectedSuggestion,\n\t\t\t\t\t\t\t\tmatchingSuggestions\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonHover={ setSelectedSuggestion }\n\t\t\t\t\t\t\tonSelect={ onSuggestionSelected }\n\t\t\t\t\t\t\tscrollIntoView\n\t\t\t\t\t\t\t__experimentalRenderItem={\n\t\t\t\t\t\t\t\t__experimentalRenderItem\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</div>\n\t\t\t</BaseControl>\n\t\t</DetectOutside>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n\nexport default ComboboxControl;\n"],"mappings":"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"}
+{"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_i18n","_compose","_a11y","_icons","_styles","_tokenInput","_suggestionsList","_baseControl","_button","_flex","_withFocusOutside","_hooks","_strings","_useDeprecatedProps","noop","DetectOutside","withFocusOutside","Component","handleFocusOutside","event","props","onFocusOutside","render","children","getIndexOfMatchingSuggestion","selectedSuggestion","matchingSuggestions","indexOf","ComboboxControl","_currentOption$label","__nextHasNoMarginBottom","__next40pxDefaultSize","value","valueProp","label","options","onChange","onChangeProp","onFilterValueChange","hideLabelFromVision","help","allowReset","className","messages","selected","__","__experimentalRenderItem","useDeprecated36pxDefaultSizeProp","setValue","useControlledValue","currentOption","find","option","currentLabel","instanceId","useInstanceId","setSelectedSuggestion","useState","isExpanded","setIsExpanded","inputHasFocus","setInputHasFocus","inputValue","setInputValue","inputContainer","useRef","useMemo","startsWithMatch","containsMatch","match","normalizeTextString","forEach","index","push","concat","onSuggestionSelected","newSelectedSuggestion","speak","handleArrowNavigation","offset","nextIndex","length","onKeyDown","preventDefault","defaultPrevented","nativeEvent","isComposing","keyCode","code","onBlur","onFocus","onInputChange","text","handleOnReset","current","focus","useEffect","hasMatchingSuggestions","hasSelectedMatchingSuggestions","message","sprintf","_n","createElement","default","classnames","id","tabIndex","InputWrapperFlex","FlexBlock","ref","selectedSuggestionIndex","FlexItem","icon","closeSmall","disabled","onClick","displayTransform","suggestion","suggestions","selectedIndex","onHover","onSelect","scrollIntoView","_default","exports"],"sources":["@wordpress/components/src/combobox-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport {\n\tComponent,\n\tuseState,\n\tuseMemo,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { InputWrapperFlex } from './styles';\nimport TokenInput from '../form-token-field/token-input';\nimport SuggestionsList from '../form-token-field/suggestions-list';\nimport BaseControl from '../base-control';\nimport Button from '../button';\nimport { FlexBlock, FlexItem } from '../flex';\nimport withFocusOutside from '../higher-order/with-focus-outside';\nimport { useControlledValue } from '../utils/hooks';\nimport { normalizeTextString } from '../utils/strings';\nimport type { ComboboxControlOption, ComboboxControlProps } from './types';\nimport type { TokenInputProps } from '../form-token-field/types';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\n\nconst noop = () => {};\n\ninterface DetectOutsideComponentProps {\n\tonFocusOutside: ( event: React.FocusEvent ) => void;\n\tchildren?: React.ReactNode;\n}\n\nconst DetectOutside = withFocusOutside(\n\tclass extends Component< DetectOutsideComponentProps > {\n\t\thandleFocusOutside( event: React.FocusEvent ) {\n\t\t\tthis.props.onFocusOutside( event );\n\t\t}\n\n\t\trender() {\n\t\t\treturn this.props.children;\n\t\t}\n\t}\n);\n\nconst getIndexOfMatchingSuggestion = (\n\tselectedSuggestion: ComboboxControlOption | null,\n\tmatchingSuggestions: ComboboxControlOption[]\n) =>\n\tselectedSuggestion === null\n\t\t? -1\n\t\t: matchingSuggestions.indexOf( selectedSuggestion );\n\n/**\n * `ComboboxControl` is an enhanced version of a [`SelectControl`](../select-control/README.md) with the addition of\n * being able to search for options using a search input.\n *\n * ```jsx\n * import { ComboboxControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const options = [\n * \t{\n * \t\tvalue: 'small',\n * \t\tlabel: 'Small',\n * \t},\n * \t{\n * \t\tvalue: 'normal',\n * \t\tlabel: 'Normal',\n * \t},\n * \t{\n * \t\tvalue: 'large',\n * \t\tlabel: 'Large',\n * \t},\n * ];\n *\n * function MyComboboxControl() {\n * \tconst [ fontSize, setFontSize ] = useState();\n * \tconst [ filteredOptions, setFilteredOptions ] = useState( options );\n * \treturn (\n * \t\t<ComboboxControl\n * \t\t\tlabel=\"Font Size\"\n * \t\t\tvalue={ fontSize }\n * \t\t\tonChange={ setFontSize }\n * \t\t\toptions={ filteredOptions }\n * \t\t\tonFilterValueChange={ ( inputValue ) =>\n * \t\t\t\tsetFilteredOptions(\n * \t\t\t\t\toptions.filter( ( option ) =>\n * \t\t\t\t\t\toption.label\n * \t\t\t\t\t\t\t.toLowerCase()\n * \t\t\t\t\t\t\t.startsWith( inputValue.toLowerCase() )\n * \t\t\t\t\t)\n * \t\t\t\t)\n * \t\t\t}\n * \t\t/>\n * \t);\n * }\n * ```\n */\nfunction ComboboxControl( props: ComboboxControlProps ) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\t__next40pxDefaultSize = false,\n\t\tvalue: valueProp,\n\t\tlabel,\n\t\toptions,\n\t\tonChange: onChangeProp,\n\t\tonFilterValueChange = noop,\n\t\thideLabelFromVision,\n\t\thelp,\n\t\tallowReset = true,\n\t\tclassName,\n\t\tmessages = {\n\t\t\tselected: __( 'Item selected.' ),\n\t\t},\n\t\t__experimentalRenderItem,\n\t} = useDeprecated36pxDefaultSizeProp< ComboboxControlProps >(\n\t\tprops,\n\t\t'wp.components.ComboboxControl'\n\t);\n\n\tconst [ value, setValue ] = useControlledValue( {\n\t\tvalue: valueProp,\n\t\tonChange: onChangeProp,\n\t} );\n\n\tconst currentOption = options.find( ( option ) => option.value === value );\n\tconst currentLabel = currentOption?.label ?? '';\n\t// Use a custom prefix when generating the `instanceId` to avoid having\n\t// duplicate input IDs when rendering this component and `FormTokenField`\n\t// in the same page (see https://github.com/WordPress/gutenberg/issues/42112).\n\tconst instanceId = useInstanceId( ComboboxControl, 'combobox-control' );\n\tconst [ selectedSuggestion, setSelectedSuggestion ] = useState(\n\t\tcurrentOption || null\n\t);\n\tconst [ isExpanded, setIsExpanded ] = useState( false );\n\tconst [ inputHasFocus, setInputHasFocus ] = useState( false );\n\tconst [ inputValue, setInputValue ] = useState( '' );\n\tconst inputContainer = useRef< HTMLInputElement >( null );\n\n\tconst matchingSuggestions = useMemo( () => {\n\t\tconst startsWithMatch: ComboboxControlOption[] = [];\n\t\tconst containsMatch: ComboboxControlOption[] = [];\n\t\tconst match = normalizeTextString( inputValue );\n\t\toptions.forEach( ( option ) => {\n\t\t\tconst index = normalizeTextString( option.label ).indexOf( match );\n\t\t\tif ( index === 0 ) {\n\t\t\t\tstartsWithMatch.push( option );\n\t\t\t} else if ( index > 0 ) {\n\t\t\t\tcontainsMatch.push( option );\n\t\t\t}\n\t\t} );\n\n\t\treturn startsWithMatch.concat( containsMatch );\n\t}, [ inputValue, options ] );\n\n\tconst onSuggestionSelected = (\n\t\tnewSelectedSuggestion: ComboboxControlOption\n\t) => {\n\t\tsetValue( newSelectedSuggestion.value );\n\t\tspeak( messages.selected, 'assertive' );\n\t\tsetSelectedSuggestion( newSelectedSuggestion );\n\t\tsetInputValue( '' );\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst handleArrowNavigation = ( offset = 1 ) => {\n\t\tconst index = getIndexOfMatchingSuggestion(\n\t\t\tselectedSuggestion,\n\t\t\tmatchingSuggestions\n\t\t);\n\t\tlet nextIndex = index + offset;\n\t\tif ( nextIndex < 0 ) {\n\t\t\tnextIndex = matchingSuggestions.length - 1;\n\t\t} else if ( nextIndex >= matchingSuggestions.length ) {\n\t\t\tnextIndex = 0;\n\t\t}\n\t\tsetSelectedSuggestion( matchingSuggestions[ nextIndex ] );\n\t\tsetIsExpanded( true );\n\t};\n\n\tconst onKeyDown: React.KeyboardEventHandler< HTMLDivElement > = (\n\t\tevent\n\t) => {\n\t\tlet preventDefault = false;\n\n\t\tif (\n\t\t\tevent.defaultPrevented ||\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.isComposing ||\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tswitch ( event.code ) {\n\t\t\tcase 'Enter':\n\t\t\t\tif ( selectedSuggestion ) {\n\t\t\t\t\tonSuggestionSelected( selectedSuggestion );\n\t\t\t\t\tpreventDefault = true;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowUp':\n\t\t\t\thandleArrowNavigation( -1 );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowDown':\n\t\t\t\thandleArrowNavigation( 1 );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tcase 'Escape':\n\t\t\t\tsetIsExpanded( false );\n\t\t\t\tsetSelectedSuggestion( null );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t};\n\n\tconst onBlur = () => {\n\t\tsetInputHasFocus( false );\n\t};\n\n\tconst onFocus = () => {\n\t\tsetInputHasFocus( true );\n\t\tsetIsExpanded( true );\n\t\tonFilterValueChange( '' );\n\t\tsetInputValue( '' );\n\t};\n\n\tconst onFocusOutside = () => {\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst onInputChange: TokenInputProps[ 'onChange' ] = ( event ) => {\n\t\tconst text = event.value;\n\t\tsetInputValue( text );\n\t\tonFilterValueChange( text );\n\t\tif ( inputHasFocus ) {\n\t\t\tsetIsExpanded( true );\n\t\t}\n\t};\n\n\tconst handleOnReset = () => {\n\t\tsetValue( null );\n\t\tinputContainer.current?.focus();\n\t};\n\n\t// Update current selections when the filter input changes.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tconst hasSelectedMatchingSuggestions =\n\t\t\tgetIndexOfMatchingSuggestion(\n\t\t\t\tselectedSuggestion,\n\t\t\t\tmatchingSuggestions\n\t\t\t) > 0;\n\n\t\tif ( hasMatchingSuggestions && ! hasSelectedMatchingSuggestions ) {\n\t\t\t// If the current selection isn't present in the list of suggestions, then automatically select the first item from the list of suggestions.\n\t\t\tsetSelectedSuggestion( matchingSuggestions[ 0 ] );\n\t\t}\n\t}, [ matchingSuggestions, selectedSuggestion ] );\n\n\t// Announcements.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tif ( isExpanded ) {\n\t\t\tconst message = hasMatchingSuggestions\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t/* translators: %d: number of results. */\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d result found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\t'%d results found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t\t\t),\n\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t  )\n\t\t\t\t: __( 'No results.' );\n\n\t\t\tspeak( message, 'polite' );\n\t\t}\n\t}, [ matchingSuggestions, isExpanded ] );\n\n\t// Disable reason: There is no appropriate role which describes the\n\t// input container intended accessible usability.\n\t// TODO: Refactor click detection to use blur to stop propagation.\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<DetectOutside onFocusOutside={ onFocusOutside }>\n\t\t\t<BaseControl\n\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\tclassName,\n\t\t\t\t\t'components-combobox-control'\n\t\t\t\t) }\n\t\t\t\tlabel={ label }\n\t\t\t\tid={ `components-form-token-input-${ instanceId }` }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\thelp={ help }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"components-combobox-control__suggestions-container\"\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<InputWrapperFlex\n\t\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t<TokenInput\n\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__input\"\n\t\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\t\tref={ inputContainer }\n\t\t\t\t\t\t\t\tvalue={ isExpanded ? inputValue : currentLabel }\n\t\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\t\t\t\tisExpanded={ isExpanded }\n\t\t\t\t\t\t\t\tselectedSuggestionIndex={ getIndexOfMatchingSuggestion(\n\t\t\t\t\t\t\t\t\tselectedSuggestion,\n\t\t\t\t\t\t\t\t\tmatchingSuggestions\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonChange={ onInputChange }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t{ allowReset && (\n\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__reset\"\n\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\tdisabled={ ! value }\n\t\t\t\t\t\t\t\t\tonClick={ handleOnReset }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</InputWrapperFlex>\n\t\t\t\t\t{ isExpanded && (\n\t\t\t\t\t\t<SuggestionsList\n\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\t// The empty string for `value` here is not actually used, but is\n\t\t\t\t\t\t\t// just a quick way to satisfy the TypeScript requirements of SuggestionsList.\n\t\t\t\t\t\t\t// See: https://github.com/WordPress/gutenberg/pull/47581/files#r1091089330\n\t\t\t\t\t\t\tmatch={ { label: inputValue, value: '' } }\n\t\t\t\t\t\t\tdisplayTransform={ ( suggestion ) =>\n\t\t\t\t\t\t\t\tsuggestion.label\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsuggestions={ matchingSuggestions }\n\t\t\t\t\t\t\tselectedIndex={ getIndexOfMatchingSuggestion(\n\t\t\t\t\t\t\t\tselectedSuggestion,\n\t\t\t\t\t\t\t\tmatchingSuggestions\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonHover={ setSelectedSuggestion }\n\t\t\t\t\t\t\tonSelect={ onSuggestionSelected }\n\t\t\t\t\t\t\tscrollIntoView\n\t\t\t\t\t\t\t__experimentalRenderItem={\n\t\t\t\t\t\t\t\t__experimentalRenderItem\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</div>\n\t\t\t</BaseControl>\n\t\t</DetectOutside>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n\nexport default ComboboxControl;\n"],"mappings":"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"}

package/build/composite/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_reakit","require"],"sources":["@wordpress/components/src/composite/index.js"],"sourcesContent":["/**\n * Composite is a component that may contain navigable items represented by\n * CompositeItem. It's inspired by the WAI-ARIA Composite Role and implements\n * all the keyboard navigation mechanisms to ensure that there's only one\n * tab stop for the whole Composite element. This means that it can behave as\n * a roving tabindex or aria-activedescendant container.\n *\n * @see https://reakit.io/docs/composite/\n *\n * The plan is to build own API that accounts for future breaking changes\n * in Reakit (https://github.com/WordPress/gutenberg/pull/28085).\n */\n/* eslint-disable-next-line no-restricted-imports */\nexport {\n\tComposite,\n\tCompositeGroup,\n\tCompositeItem,\n\tuseCompositeState,\n} from 'reakit';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,IAAAA,OAAA,GAAAC,OAAA"}
+{"version":3,"names":["_reakit","require"],"sources":["@wordpress/components/src/composite/index.ts"],"sourcesContent":["/**\n * Composite is a component that may contain navigable items represented by\n * CompositeItem. It's inspired by the WAI-ARIA Composite Role and implements\n * all the keyboard navigation mechanisms to ensure that there's only one\n * tab stop for the whole Composite element. This means that it can behave as\n * a roving tabindex or aria-activedescendant container.\n *\n * @see https://reakit.io/docs/composite/\n *\n * The plan is to build own API that accounts for future breaking changes\n * in Reakit (https://github.com/WordPress/gutenberg/pull/28085).\n */\n/* eslint-disable-next-line no-restricted-imports */\nexport {\n\tComposite,\n\tCompositeGroup,\n\tCompositeItem,\n\tuseCompositeState,\n} from 'reakit';\n\n/* eslint-disable-next-line no-restricted-imports */\nexport type { CompositeStateReturn as CompositeState } from 'reakit';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,IAAAA,OAAA,GAAAC,OAAA"}

package/build/custom-gradient-picker/gradient-bar/control-points.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_colord","_compose","_i18n","_icons","_button","_hStack","_colorPicker","_visuallyHidden","_colorPalette","_utils","_constants","ControlPointButton","isOpen","position","color","additionalProps","instanceId","useInstanceId","descriptionId","createElement","Fragment","default","sprintf","__","className","classnames","VisuallyHidden","id","GradientColorPickerDropdown","isRenderedInSidebar","props","popoverProps","useMemo","placement","offset","mergedClassName","CustomColorPickerDropdown","ControlPoints","disableRemove","disableAlpha","gradientPickerDomRef","ignoreMarkerPosition","value","controlPoints","onChange","onStartControlPointChange","onStopControlPointChange","__experimentalIsRenderedInSidebar","controlPointMoveState","useRef","onMouseMove","event","current","undefined","relativePosition","getHorizontalRelativeGradientPosition","clientX","initialPosition","index","significantMoveHappened","Math","abs","MINIMUM_SIGNIFICANT_MOVE","updateControlPointPosition","cleanEventListeners","window","removeEventListener","listenersActivated","cleanEventListenersRef","useEffect","map","point","key","onClose","renderToggle","onToggle","onClick","onMouseDown","addEventListener","onKeyDown","code","stopPropagation","clampPercent","KEYBOARD_CONTROL_POINT_VARIATION","renderContent","ColorPicker","enableAlpha","updateControlPointColor","colord","toRgbString","length","HStack","alignment","removeControlPoint","variant","style","left","transform","InsertPoint","onOpenInserter","onCloseInserter","insertPosition","alreadyInsertedPoint","setAlreadyInsertedPoint","useState","icon","plus","addControlPoint","updateControlPointColorByPosition","_default","exports"],"sources":["@wordpress/components/src/custom-gradient-picker/gradient-bar/control-points.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { colord } from 'colord';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useEffect, useRef, useState, useMemo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { plus } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport { HStack } from '../../h-stack';\nimport { ColorPicker } from '../../color-picker';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport { CustomColorPickerDropdown } from '../../color-palette';\n\nimport {\n\taddControlPoint,\n\tclampPercent,\n\tremoveControlPoint,\n\tupdateControlPointColor,\n\tupdateControlPointColorByPosition,\n\tupdateControlPointPosition,\n\tgetHorizontalRelativeGradientPosition,\n} from './utils';\nimport {\n\tMINIMUM_SIGNIFICANT_MOVE,\n\tKEYBOARD_CONTROL_POINT_VARIATION,\n} from './constants';\nimport type { WordPressComponentProps } from '../../ui/context';\nimport type {\n\tControlPointButtonProps,\n\tControlPointMoveState,\n\tControlPointsProps,\n\tInsertPointProps,\n} from '../types';\nimport type { CustomColorPickerDropdownProps } from '../../color-palette/types';\n\nfunction ControlPointButton( {\n\tisOpen,\n\tposition,\n\tcolor,\n\t...additionalProps\n}: WordPressComponentProps< ControlPointButtonProps, 'button', true > ) {\n\tconst instanceId = useInstanceId( ControlPointButton );\n\tconst descriptionId = `components-custom-gradient-picker__control-point-button-description-${ instanceId }`;\n\treturn (\n\t\t<>\n\t\t\t<Button\n\t\t\t\taria-label={ sprintf(\n\t\t\t\t\t// translators: %1$s: gradient position e.g: 70, %2$s: gradient color code e.g: rgb(52,121,151).\n\t\t\t\t\t__(\n\t\t\t\t\t\t'Gradient control point at position %1$s%% with color code %2$s.'\n\t\t\t\t\t),\n\t\t\t\t\tposition,\n\t\t\t\t\tcolor\n\t\t\t\t) }\n\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\taria-haspopup=\"true\"\n\t\t\t\taria-expanded={ isOpen }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'components-custom-gradient-picker__control-point-button',\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-active': isOpen,\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t\t{ ...additionalProps }\n\t\t\t/>\n\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t{ __(\n\t\t\t\t\t'Use your left or right arrow keys or drag and drop with the mouse to change the gradient position. Press the button to change the color or remove the control point.'\n\t\t\t\t) }\n\t\t\t</VisuallyHidden>\n\t\t</>\n\t);\n}\n\nfunction GradientColorPickerDropdown( {\n\tisRenderedInSidebar,\n\tclassName,\n\t...props\n}: CustomColorPickerDropdownProps ) {\n\t// Open the popover below the gradient control/insertion point\n\tconst popoverProps = useMemo(\n\t\t() =>\n\t\t\t( {\n\t\t\t\tplacement: 'bottom',\n\t\t\t\toffset: 8,\n\t\t\t} as const ),\n\t\t[]\n\t);\n\n\tconst mergedClassName = classnames(\n\t\t'components-custom-gradient-picker__control-point-dropdown',\n\t\tclassName\n\t);\n\n\treturn (\n\t\t<CustomColorPickerDropdown\n\t\t\tisRenderedInSidebar={ isRenderedInSidebar }\n\t\t\tpopoverProps={ popoverProps }\n\t\t\tclassName={ mergedClassName }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction ControlPoints( {\n\tdisableRemove,\n\tdisableAlpha,\n\tgradientPickerDomRef,\n\tignoreMarkerPosition,\n\tvalue: controlPoints,\n\tonChange,\n\tonStartControlPointChange,\n\tonStopControlPointChange,\n\t__experimentalIsRenderedInSidebar,\n}: ControlPointsProps ) {\n\tconst controlPointMoveState = useRef< ControlPointMoveState >();\n\n\tconst onMouseMove = ( event: MouseEvent ) => {\n\t\tif (\n\t\t\tcontrolPointMoveState.current === undefined ||\n\t\t\tgradientPickerDomRef.current === null\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst relativePosition = getHorizontalRelativeGradientPosition(\n\t\t\tevent.clientX,\n\t\t\tgradientPickerDomRef.current\n\t\t);\n\n\t\tconst { initialPosition, index, significantMoveHappened } =\n\t\t\tcontrolPointMoveState.current;\n\n\t\tif (\n\t\t\t! significantMoveHappened &&\n\t\t\tMath.abs( initialPosition - relativePosition ) >=\n\t\t\t\tMINIMUM_SIGNIFICANT_MOVE\n\t\t) {\n\t\t\tcontrolPointMoveState.current.significantMoveHappened = true;\n\t\t}\n\n\t\tonChange(\n\t\t\tupdateControlPointPosition( controlPoints, index, relativePosition )\n\t\t);\n\t};\n\n\tconst cleanEventListeners = () => {\n\t\tif (\n\t\t\twindow &&\n\t\t\twindow.removeEventListener &&\n\t\t\tcontrolPointMoveState.current &&\n\t\t\tcontrolPointMoveState.current.listenersActivated\n\t\t) {\n\t\t\twindow.removeEventListener( 'mousemove', onMouseMove );\n\t\t\twindow.removeEventListener( 'mouseup', cleanEventListeners );\n\t\t\tonStopControlPointChange();\n\t\t\tcontrolPointMoveState.current.listenersActivated = false;\n\t\t}\n\t};\n\n\t// Adding `cleanEventListeners` to the dependency array below requires the function itself to be wrapped in a `useCallback`\n\t// This memoization would prevent the event listeners from being properly cleaned.\n\t// Instead, we'll pass a ref to the function in our `useEffect` so `cleanEventListeners` itself is no longer a dependency.\n\tconst cleanEventListenersRef = useRef< () => void >();\n\tcleanEventListenersRef.current = cleanEventListeners;\n\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tcleanEventListenersRef.current?.();\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<>\n\t\t\t{ controlPoints.map( ( point, index ) => {\n\t\t\t\tconst initialPosition = point?.position;\n\t\t\t\treturn (\n\t\t\t\t\tignoreMarkerPosition !== initialPosition && (\n\t\t\t\t\t\t<GradientColorPickerDropdown\n\t\t\t\t\t\t\tisRenderedInSidebar={\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\tonClose={ onStopControlPointChange }\n\t\t\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t\t\t<ControlPointButton\n\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveState.current &&\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveState.current\n\t\t\t\t\t\t\t\t\t\t\t\t.significantMoveHappened\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\t\t\t\t\tonStopControlPointChange();\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\tonStartControlPointChange();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tonMouseDown={ () => {\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\twindow &&\n\t\t\t\t\t\t\t\t\t\t\twindow.addEventListener\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveState.current = {\n\t\t\t\t\t\t\t\t\t\t\t\tinitialPosition,\n\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\tsignificantMoveHappened: false,\n\t\t\t\t\t\t\t\t\t\t\t\tlistenersActivated: true,\n\t\t\t\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\t\t\t\tonStartControlPointChange();\n\t\t\t\t\t\t\t\t\t\t\twindow.addEventListener(\n\t\t\t\t\t\t\t\t\t\t\t\t'mousemove',\n\t\t\t\t\t\t\t\t\t\t\t\tonMouseMove\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\twindow.addEventListener(\n\t\t\t\t\t\t\t\t\t\t\t\t'mouseup',\n\t\t\t\t\t\t\t\t\t\t\t\tcleanEventListeners\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\tif ( event.code === 'ArrowLeft' ) {\n\t\t\t\t\t\t\t\t\t\t\t// Stop propagation of the key press event to avoid focus moving\n\t\t\t\t\t\t\t\t\t\t\t// to another editor area.\n\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\tupdateControlPointPosition(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tclampPercent(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tpoint.position -\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tKEYBOARD_CONTROL_POINT_VARIATION\n\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} else if (\n\t\t\t\t\t\t\t\t\t\t\tevent.code === 'ArrowRight'\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t// Stop propagation of the key press event to avoid focus moving\n\t\t\t\t\t\t\t\t\t\t\t// to another editor area.\n\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\tupdateControlPointPosition(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tclampPercent(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tpoint.position +\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tKEYBOARD_CONTROL_POINT_VARIATION\n\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tisOpen={ isOpen }\n\t\t\t\t\t\t\t\t\tposition={ point.position }\n\t\t\t\t\t\t\t\t\tcolor={ point.color }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\trenderContent={ ( { onClose } ) => (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<ColorPicker\n\t\t\t\t\t\t\t\t\t\tenableAlpha={ ! disableAlpha }\n\t\t\t\t\t\t\t\t\t\tcolor={ point.color }\n\t\t\t\t\t\t\t\t\t\tonChange={ ( color ) => {\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\tupdateControlPointColor(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tcolord(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolor\n\t\t\t\t\t\t\t\t\t\t\t\t\t).toRgbString()\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t{ ! disableRemove &&\n\t\t\t\t\t\t\t\t\t\tcontrolPoints.length > 2 && (\n\t\t\t\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-custom-gradient-picker__remove-control-point-wrapper\"\n\t\t\t\t\t\t\t\t\t\t\t\talignment=\"center\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tremoveControlPoint(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"link\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Remove Control Point'\n\t\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tleft: `${ point.position }%`,\n\t\t\t\t\t\t\t\ttransform: 'translateX( -50% )',\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);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n\nfunction InsertPoint( {\n\tvalue: controlPoints,\n\tonChange,\n\tonOpenInserter,\n\tonCloseInserter,\n\tinsertPosition,\n\tdisableAlpha,\n\t__experimentalIsRenderedInSidebar,\n}: InsertPointProps ) {\n\tconst [ alreadyInsertedPoint, setAlreadyInsertedPoint ] = useState( false );\n\treturn (\n\t\t<GradientColorPickerDropdown\n\t\t\tisRenderedInSidebar={ __experimentalIsRenderedInSidebar }\n\t\t\tclassName=\"components-custom-gradient-picker__inserter\"\n\t\t\tonClose={ () => {\n\t\t\t\tonCloseInserter();\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t<Button\n\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\tonCloseInserter();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tsetAlreadyInsertedPoint( false );\n\t\t\t\t\t\t\tonOpenInserter();\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t} }\n\t\t\t\t\tclassName=\"components-custom-gradient-picker__insert-point-dropdown\"\n\t\t\t\t\ticon={ plus }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\trenderContent={ () => (\n\t\t\t\t<ColorPicker\n\t\t\t\t\tenableAlpha={ ! disableAlpha }\n\t\t\t\t\tonChange={ ( color ) => {\n\t\t\t\t\t\tif ( ! alreadyInsertedPoint ) {\n\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\taddControlPoint(\n\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\tinsertPosition,\n\t\t\t\t\t\t\t\t\tcolord( color ).toRgbString()\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tsetAlreadyInsertedPoint( true );\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\tupdateControlPointColorByPosition(\n\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\tinsertPosition,\n\t\t\t\t\t\t\t\t\tcolord( color ).toRgbString()\n\t\t\t\t\t\t\t\t)\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/>\n\t\t\t) }\n\t\t\tstyle={\n\t\t\t\tinsertPosition !== null\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tleft: `${ insertPosition }%`,\n\t\t\t\t\t\t\ttransform: 'translateX( -50% )',\n\t\t\t\t\t  }\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t/>\n\t);\n}\nControlPoints.InsertPoint = InsertPoint;\n\nexport default ControlPoints;\n"],"mappings":"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"}
+{"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_colord","_compose","_i18n","_icons","_button","_hStack","_colorPicker","_visuallyHidden","_colorPalette","_utils","_constants","ControlPointButton","isOpen","position","color","additionalProps","instanceId","useInstanceId","descriptionId","createElement","Fragment","default","sprintf","__","className","classnames","VisuallyHidden","id","GradientColorPickerDropdown","isRenderedInSidebar","props","popoverProps","useMemo","placement","offset","mergedClassName","CustomColorPickerDropdown","ControlPoints","disableRemove","disableAlpha","gradientPickerDomRef","ignoreMarkerPosition","value","controlPoints","onChange","onStartControlPointChange","onStopControlPointChange","__experimentalIsRenderedInSidebar","controlPointMoveState","useRef","onMouseMove","event","current","undefined","relativePosition","getHorizontalRelativeGradientPosition","clientX","initialPosition","index","significantMoveHappened","Math","abs","MINIMUM_SIGNIFICANT_MOVE","updateControlPointPosition","cleanEventListeners","window","removeEventListener","listenersActivated","cleanEventListenersRef","useEffect","map","point","key","onClose","renderToggle","onToggle","onClick","onMouseDown","addEventListener","onKeyDown","code","stopPropagation","clampPercent","KEYBOARD_CONTROL_POINT_VARIATION","renderContent","ColorPicker","enableAlpha","updateControlPointColor","colord","toRgbString","length","HStack","alignment","removeControlPoint","variant","style","left","transform","InsertPoint","onOpenInserter","onCloseInserter","insertPosition","alreadyInsertedPoint","setAlreadyInsertedPoint","useState","icon","plus","addControlPoint","updateControlPointColorByPosition","_default","exports"],"sources":["@wordpress/components/src/custom-gradient-picker/gradient-bar/control-points.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { colord } from 'colord';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useEffect, useRef, useState, useMemo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { plus } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport { HStack } from '../../h-stack';\nimport { ColorPicker } from '../../color-picker';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport { CustomColorPickerDropdown } from '../../color-palette';\n\nimport {\n\taddControlPoint,\n\tclampPercent,\n\tremoveControlPoint,\n\tupdateControlPointColor,\n\tupdateControlPointColorByPosition,\n\tupdateControlPointPosition,\n\tgetHorizontalRelativeGradientPosition,\n} from './utils';\nimport {\n\tMINIMUM_SIGNIFICANT_MOVE,\n\tKEYBOARD_CONTROL_POINT_VARIATION,\n} from './constants';\nimport type { WordPressComponentProps } from '../../ui/context';\nimport type {\n\tControlPointButtonProps,\n\tControlPointMoveState,\n\tControlPointsProps,\n\tInsertPointProps,\n} from '../types';\nimport type { CustomColorPickerDropdownProps } from '../../color-palette/types';\n\nfunction ControlPointButton( {\n\tisOpen,\n\tposition,\n\tcolor,\n\t...additionalProps\n}: WordPressComponentProps< ControlPointButtonProps, 'button', true > ) {\n\tconst instanceId = useInstanceId( ControlPointButton );\n\tconst descriptionId = `components-custom-gradient-picker__control-point-button-description-${ instanceId }`;\n\treturn (\n\t\t<>\n\t\t\t<Button\n\t\t\t\taria-label={ sprintf(\n\t\t\t\t\t// translators: %1$s: gradient position e.g: 70, %2$s: gradient color code e.g: rgb(52,121,151).\n\t\t\t\t\t__(\n\t\t\t\t\t\t'Gradient control point at position %1$s%% with color code %2$s.'\n\t\t\t\t\t),\n\t\t\t\t\tposition,\n\t\t\t\t\tcolor\n\t\t\t\t) }\n\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\taria-haspopup=\"true\"\n\t\t\t\taria-expanded={ isOpen }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'components-custom-gradient-picker__control-point-button',\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-active': isOpen,\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t\t{ ...additionalProps }\n\t\t\t/>\n\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t{ __(\n\t\t\t\t\t'Use your left or right arrow keys or drag and drop with the mouse to change the gradient position. Press the button to change the color or remove the control point.'\n\t\t\t\t) }\n\t\t\t</VisuallyHidden>\n\t\t</>\n\t);\n}\n\nfunction GradientColorPickerDropdown( {\n\tisRenderedInSidebar,\n\tclassName,\n\t...props\n}: CustomColorPickerDropdownProps ) {\n\t// Open the popover below the gradient control/insertion point\n\tconst popoverProps = useMemo(\n\t\t() =>\n\t\t\t( {\n\t\t\t\tplacement: 'bottom',\n\t\t\t\toffset: 8,\n\t\t\t} ) as const,\n\t\t[]\n\t);\n\n\tconst mergedClassName = classnames(\n\t\t'components-custom-gradient-picker__control-point-dropdown',\n\t\tclassName\n\t);\n\n\treturn (\n\t\t<CustomColorPickerDropdown\n\t\t\tisRenderedInSidebar={ isRenderedInSidebar }\n\t\t\tpopoverProps={ popoverProps }\n\t\t\tclassName={ mergedClassName }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction ControlPoints( {\n\tdisableRemove,\n\tdisableAlpha,\n\tgradientPickerDomRef,\n\tignoreMarkerPosition,\n\tvalue: controlPoints,\n\tonChange,\n\tonStartControlPointChange,\n\tonStopControlPointChange,\n\t__experimentalIsRenderedInSidebar,\n}: ControlPointsProps ) {\n\tconst controlPointMoveState = useRef< ControlPointMoveState >();\n\n\tconst onMouseMove = ( event: MouseEvent ) => {\n\t\tif (\n\t\t\tcontrolPointMoveState.current === undefined ||\n\t\t\tgradientPickerDomRef.current === null\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst relativePosition = getHorizontalRelativeGradientPosition(\n\t\t\tevent.clientX,\n\t\t\tgradientPickerDomRef.current\n\t\t);\n\n\t\tconst { initialPosition, index, significantMoveHappened } =\n\t\t\tcontrolPointMoveState.current;\n\n\t\tif (\n\t\t\t! significantMoveHappened &&\n\t\t\tMath.abs( initialPosition - relativePosition ) >=\n\t\t\t\tMINIMUM_SIGNIFICANT_MOVE\n\t\t) {\n\t\t\tcontrolPointMoveState.current.significantMoveHappened = true;\n\t\t}\n\n\t\tonChange(\n\t\t\tupdateControlPointPosition( controlPoints, index, relativePosition )\n\t\t);\n\t};\n\n\tconst cleanEventListeners = () => {\n\t\tif (\n\t\t\twindow &&\n\t\t\twindow.removeEventListener &&\n\t\t\tcontrolPointMoveState.current &&\n\t\t\tcontrolPointMoveState.current.listenersActivated\n\t\t) {\n\t\t\twindow.removeEventListener( 'mousemove', onMouseMove );\n\t\t\twindow.removeEventListener( 'mouseup', cleanEventListeners );\n\t\t\tonStopControlPointChange();\n\t\t\tcontrolPointMoveState.current.listenersActivated = false;\n\t\t}\n\t};\n\n\t// Adding `cleanEventListeners` to the dependency array below requires the function itself to be wrapped in a `useCallback`\n\t// This memoization would prevent the event listeners from being properly cleaned.\n\t// Instead, we'll pass a ref to the function in our `useEffect` so `cleanEventListeners` itself is no longer a dependency.\n\tconst cleanEventListenersRef = useRef< () => void >();\n\tcleanEventListenersRef.current = cleanEventListeners;\n\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tcleanEventListenersRef.current?.();\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<>\n\t\t\t{ controlPoints.map( ( point, index ) => {\n\t\t\t\tconst initialPosition = point?.position;\n\t\t\t\treturn (\n\t\t\t\t\tignoreMarkerPosition !== initialPosition && (\n\t\t\t\t\t\t<GradientColorPickerDropdown\n\t\t\t\t\t\t\tisRenderedInSidebar={\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\tonClose={ onStopControlPointChange }\n\t\t\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t\t\t<ControlPointButton\n\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveState.current &&\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveState.current\n\t\t\t\t\t\t\t\t\t\t\t\t.significantMoveHappened\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\t\t\t\t\tonStopControlPointChange();\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\tonStartControlPointChange();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tonMouseDown={ () => {\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\twindow &&\n\t\t\t\t\t\t\t\t\t\t\twindow.addEventListener\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveState.current = {\n\t\t\t\t\t\t\t\t\t\t\t\tinitialPosition,\n\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\tsignificantMoveHappened: false,\n\t\t\t\t\t\t\t\t\t\t\t\tlistenersActivated: true,\n\t\t\t\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\t\t\t\tonStartControlPointChange();\n\t\t\t\t\t\t\t\t\t\t\twindow.addEventListener(\n\t\t\t\t\t\t\t\t\t\t\t\t'mousemove',\n\t\t\t\t\t\t\t\t\t\t\t\tonMouseMove\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\twindow.addEventListener(\n\t\t\t\t\t\t\t\t\t\t\t\t'mouseup',\n\t\t\t\t\t\t\t\t\t\t\t\tcleanEventListeners\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\tif ( event.code === 'ArrowLeft' ) {\n\t\t\t\t\t\t\t\t\t\t\t// Stop propagation of the key press event to avoid focus moving\n\t\t\t\t\t\t\t\t\t\t\t// to another editor area.\n\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\tupdateControlPointPosition(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tclampPercent(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tpoint.position -\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tKEYBOARD_CONTROL_POINT_VARIATION\n\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} else if (\n\t\t\t\t\t\t\t\t\t\t\tevent.code === 'ArrowRight'\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t// Stop propagation of the key press event to avoid focus moving\n\t\t\t\t\t\t\t\t\t\t\t// to another editor area.\n\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\tupdateControlPointPosition(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tclampPercent(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tpoint.position +\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tKEYBOARD_CONTROL_POINT_VARIATION\n\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tisOpen={ isOpen }\n\t\t\t\t\t\t\t\t\tposition={ point.position }\n\t\t\t\t\t\t\t\t\tcolor={ point.color }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\trenderContent={ ( { onClose } ) => (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<ColorPicker\n\t\t\t\t\t\t\t\t\t\tenableAlpha={ ! disableAlpha }\n\t\t\t\t\t\t\t\t\t\tcolor={ point.color }\n\t\t\t\t\t\t\t\t\t\tonChange={ ( color ) => {\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\tupdateControlPointColor(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tcolord(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolor\n\t\t\t\t\t\t\t\t\t\t\t\t\t).toRgbString()\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t{ ! disableRemove &&\n\t\t\t\t\t\t\t\t\t\tcontrolPoints.length > 2 && (\n\t\t\t\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-custom-gradient-picker__remove-control-point-wrapper\"\n\t\t\t\t\t\t\t\t\t\t\t\talignment=\"center\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tremoveControlPoint(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"link\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Remove Control Point'\n\t\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tleft: `${ point.position }%`,\n\t\t\t\t\t\t\t\ttransform: 'translateX( -50% )',\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);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n\nfunction InsertPoint( {\n\tvalue: controlPoints,\n\tonChange,\n\tonOpenInserter,\n\tonCloseInserter,\n\tinsertPosition,\n\tdisableAlpha,\n\t__experimentalIsRenderedInSidebar,\n}: InsertPointProps ) {\n\tconst [ alreadyInsertedPoint, setAlreadyInsertedPoint ] = useState( false );\n\treturn (\n\t\t<GradientColorPickerDropdown\n\t\t\tisRenderedInSidebar={ __experimentalIsRenderedInSidebar }\n\t\t\tclassName=\"components-custom-gradient-picker__inserter\"\n\t\t\tonClose={ () => {\n\t\t\t\tonCloseInserter();\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t<Button\n\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\tonCloseInserter();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tsetAlreadyInsertedPoint( false );\n\t\t\t\t\t\t\tonOpenInserter();\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t} }\n\t\t\t\t\tclassName=\"components-custom-gradient-picker__insert-point-dropdown\"\n\t\t\t\t\ticon={ plus }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\trenderContent={ () => (\n\t\t\t\t<ColorPicker\n\t\t\t\t\tenableAlpha={ ! disableAlpha }\n\t\t\t\t\tonChange={ ( color ) => {\n\t\t\t\t\t\tif ( ! alreadyInsertedPoint ) {\n\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\taddControlPoint(\n\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\tinsertPosition,\n\t\t\t\t\t\t\t\t\tcolord( color ).toRgbString()\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tsetAlreadyInsertedPoint( true );\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\tupdateControlPointColorByPosition(\n\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\tinsertPosition,\n\t\t\t\t\t\t\t\t\tcolord( color ).toRgbString()\n\t\t\t\t\t\t\t\t)\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/>\n\t\t\t) }\n\t\t\tstyle={\n\t\t\t\tinsertPosition !== null\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tleft: `${ insertPosition }%`,\n\t\t\t\t\t\t\ttransform: 'translateX( -50% )',\n\t\t\t\t\t  }\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t/>\n\t);\n}\nControlPoints.InsertPoint = InsertPoint;\n\nexport default ControlPoints;\n"],"mappings":"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"}

package/build/date-time/time/timezone.js

@@ -39,7 +39,7 @@ const TimeZone = () => {
   const zoneAbbr = '' !== timezone.abbr && isNaN(Number(timezone.abbr)) ? timezone.abbr : `UTC${offsetSymbol}${timezone.offset}`;
   const timezoneDetail = 'UTC' === timezone.string ? (0, _i18n.__)('Coordinated Universal Time') : `(${zoneAbbr}) ${timezone.string.replace('_', ' ')}`;
   return (0, _element.createElement)(_tooltip.default, {
-    position: "top center",
+    placement: "top",
     text: timezoneDetail
   }, (0, _element.createElement)(_styles.TimeZone, {
     className: "components-datetime__timezone"

package/build/date-time/time/timezone.js.map

@@ -1 +1 @@
-{"version":3,"names":["_i18n","require","_date","_tooltip","_interopRequireDefault","_styles","TimeZone","timezone","getDateSettings","userTimezoneOffset","Date","getTimezoneOffset","Number","offset","offsetSymbol","zoneAbbr","abbr","isNaN","timezoneDetail","string","__","replace","_element","createElement","default","position","text","className","_default","exports"],"sources":["@wordpress/components/src/date-time/time/timezone.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { getSettings as getDateSettings } from '@wordpress/date';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../../tooltip';\nimport { TimeZone as StyledComponent } from './styles';\n\n/**\n * Displays timezone information when user timezone is different from site\n * timezone.\n */\nconst TimeZone = () => {\n\tconst { timezone } = getDateSettings();\n\n\t// Convert timezone offset to hours.\n\tconst userTimezoneOffset = -1 * ( new Date().getTimezoneOffset() / 60 );\n\n\t// System timezone and user timezone match, nothing needed.\n\t// Compare as numbers because it comes over as string.\n\tif ( Number( timezone.offset ) === userTimezoneOffset ) {\n\t\treturn null;\n\t}\n\n\tconst offsetSymbol = Number( timezone.offset ) >= 0 ? '+' : '';\n\tconst zoneAbbr =\n\t\t'' !== timezone.abbr && isNaN( Number( timezone.abbr ) )\n\t\t\t? timezone.abbr\n\t\t\t: `UTC${ offsetSymbol }${ timezone.offset }`;\n\n\tconst timezoneDetail =\n\t\t'UTC' === timezone.string\n\t\t\t? __( 'Coordinated Universal Time' )\n\t\t\t: `(${ zoneAbbr }) ${ timezone.string.replace( '_', ' ' ) }`;\n\n\treturn (\n\t\t<Tooltip position=\"top center\" text={ timezoneDetail }>\n\t\t\t<StyledComponent className=\"components-datetime__timezone\">\n\t\t\t\t{ zoneAbbr }\n\t\t\t</StyledComponent>\n\t\t</Tooltip>\n\t);\n};\n\nexport default TimeZone;\n"],"mappings":";;;;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AAKA,IAAAE,QAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAVA;AACA;AACA;;AAIA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA,MAAMK,QAAQ,GAAGA,CAAA,KAAM;EACtB,MAAM;IAAEC;EAAS,CAAC,GAAG,IAAAC,iBAAe,EAAC,CAAC;;EAEtC;EACA,MAAMC,kBAAkB,GAAG,CAAC,CAAC,IAAK,IAAIC,IAAI,CAAC,CAAC,CAACC,iBAAiB,CAAC,CAAC,GAAG,EAAE,CAAE;;EAEvE;EACA;EACA,IAAKC,MAAM,CAAEL,QAAQ,CAACM,MAAO,CAAC,KAAKJ,kBAAkB,EAAG;IACvD,OAAO,IAAI;EACZ;EAEA,MAAMK,YAAY,GAAGF,MAAM,CAAEL,QAAQ,CAACM,MAAO,CAAC,IAAI,CAAC,GAAG,GAAG,GAAG,EAAE;EAC9D,MAAME,QAAQ,GACb,EAAE,KAAKR,QAAQ,CAACS,IAAI,IAAIC,KAAK,CAAEL,MAAM,CAAEL,QAAQ,CAACS,IAAK,CAAE,CAAC,GACrDT,QAAQ,CAACS,IAAI,GACZ,MAAMF,YAAc,GAAGP,QAAQ,CAACM,MAAQ,EAAC;EAE9C,MAAMK,cAAc,GACnB,KAAK,KAAKX,QAAQ,CAACY,MAAM,GACtB,IAAAC,QAAE,EAAE,4BAA6B,CAAC,GACjC,IAAIL,QAAU,KAAKR,QAAQ,CAACY,MAAM,CAACE,OAAO,CAAE,GAAG,EAAE,GAAI,CAAG,EAAC;EAE9D,OACC,IAAAC,QAAA,CAAAC,aAAA,EAACpB,QAAA,CAAAqB,OAAO;IAACC,QAAQ,EAAC,YAAY;IAACC,IAAI,EAAGR;EAAgB,GACrD,IAAAI,QAAA,CAAAC,aAAA,EAAClB,OAAA,CAAAC,QAAe;IAACqB,SAAS,EAAC;EAA+B,GACvDZ,QACc,CACT,CAAC;AAEZ,CAAC;AAAC,IAAAa,QAAA,GAEatB,QAAQ;AAAAuB,OAAA,CAAAL,OAAA,GAAAI,QAAA"}
+{"version":3,"names":["_i18n","require","_date","_tooltip","_interopRequireDefault","_styles","TimeZone","timezone","getDateSettings","userTimezoneOffset","Date","getTimezoneOffset","Number","offset","offsetSymbol","zoneAbbr","abbr","isNaN","timezoneDetail","string","__","replace","_element","createElement","default","placement","text","className","_default","exports"],"sources":["@wordpress/components/src/date-time/time/timezone.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { getSettings as getDateSettings } from '@wordpress/date';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../../tooltip';\nimport { TimeZone as StyledComponent } from './styles';\n\n/**\n * Displays timezone information when user timezone is different from site\n * timezone.\n */\nconst TimeZone = () => {\n\tconst { timezone } = getDateSettings();\n\n\t// Convert timezone offset to hours.\n\tconst userTimezoneOffset = -1 * ( new Date().getTimezoneOffset() / 60 );\n\n\t// System timezone and user timezone match, nothing needed.\n\t// Compare as numbers because it comes over as string.\n\tif ( Number( timezone.offset ) === userTimezoneOffset ) {\n\t\treturn null;\n\t}\n\n\tconst offsetSymbol = Number( timezone.offset ) >= 0 ? '+' : '';\n\tconst zoneAbbr =\n\t\t'' !== timezone.abbr && isNaN( Number( timezone.abbr ) )\n\t\t\t? timezone.abbr\n\t\t\t: `UTC${ offsetSymbol }${ timezone.offset }`;\n\n\tconst timezoneDetail =\n\t\t'UTC' === timezone.string\n\t\t\t? __( 'Coordinated Universal Time' )\n\t\t\t: `(${ zoneAbbr }) ${ timezone.string.replace( '_', ' ' ) }`;\n\n\treturn (\n\t\t<Tooltip placement=\"top\" text={ timezoneDetail }>\n\t\t\t<StyledComponent className=\"components-datetime__timezone\">\n\t\t\t\t{ zoneAbbr }\n\t\t\t</StyledComponent>\n\t\t</Tooltip>\n\t);\n};\n\nexport default TimeZone;\n"],"mappings":";;;;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AAKA,IAAAE,QAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAVA;AACA;AACA;;AAIA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA,MAAMK,QAAQ,GAAGA,CAAA,KAAM;EACtB,MAAM;IAAEC;EAAS,CAAC,GAAG,IAAAC,iBAAe,EAAC,CAAC;;EAEtC;EACA,MAAMC,kBAAkB,GAAG,CAAC,CAAC,IAAK,IAAIC,IAAI,CAAC,CAAC,CAACC,iBAAiB,CAAC,CAAC,GAAG,EAAE,CAAE;;EAEvE;EACA;EACA,IAAKC,MAAM,CAAEL,QAAQ,CAACM,MAAO,CAAC,KAAKJ,kBAAkB,EAAG;IACvD,OAAO,IAAI;EACZ;EAEA,MAAMK,YAAY,GAAGF,MAAM,CAAEL,QAAQ,CAACM,MAAO,CAAC,IAAI,CAAC,GAAG,GAAG,GAAG,EAAE;EAC9D,MAAME,QAAQ,GACb,EAAE,KAAKR,QAAQ,CAACS,IAAI,IAAIC,KAAK,CAAEL,MAAM,CAAEL,QAAQ,CAACS,IAAK,CAAE,CAAC,GACrDT,QAAQ,CAACS,IAAI,GACZ,MAAMF,YAAc,GAAGP,QAAQ,CAACM,MAAQ,EAAC;EAE9C,MAAMK,cAAc,GACnB,KAAK,KAAKX,QAAQ,CAACY,MAAM,GACtB,IAAAC,QAAE,EAAE,4BAA6B,CAAC,GACjC,IAAIL,QAAU,KAAKR,QAAQ,CAACY,MAAM,CAACE,OAAO,CAAE,GAAG,EAAE,GAAI,CAAG,EAAC;EAE9D,OACC,IAAAC,QAAA,CAAAC,aAAA,EAACpB,QAAA,CAAAqB,OAAO;IAACC,SAAS,EAAC,KAAK;IAACC,IAAI,EAAGR;EAAgB,GAC/C,IAAAI,QAAA,CAAAC,aAAA,EAAClB,OAAA,CAAAC,QAAe;IAACqB,SAAS,EAAC;EAA+B,GACvDZ,QACc,CACT,CAAC;AAEZ,CAAC;AAAC,IAAAa,QAAA,GAEatB,QAAQ;AAAAuB,OAAA,CAAAL,OAAA,GAAAI,QAAA"}

package/build/dropdown/index.js

@@ -10,6 +10,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _compose = require("@wordpress/compose");
 var _deprecated = _interopRequireDefault(require("@wordpress/deprecated"));
 var _context = require("../ui/context");
+var _hooks = require("../utils/hooks");
 var _popover = _interopRequireDefault(require("../popover"));
 /**
  * External dependencies
@@ -23,15 +24,6 @@ var _popover = _interopRequireDefault(require("../popover"));
  * Internal dependencies
  */
 
-function useObservableState(initialState, onStateChange) {
-  const [state, setState] = (0, _element.useState)(initialState);
-  return [state, value => {
-    setState(value);
-    if (onStateChange) {
-      onStateChange(value);
-    }
-  }];
-}
 const UnconnectedDropdown = (props, forwardedRef) => {
   const {
     renderContent,
@@ -45,6 +37,8 @@ const UnconnectedDropdown = (props, forwardedRef) => {
     onClose,
     onToggle,
     style,
+    open,
+    defaultOpen,
     // Deprecated props
     position,
     // From context system
@@ -62,15 +56,11 @@ const UnconnectedDropdown = (props, forwardedRef) => {
   // re-renders when the popover's anchor updates.
   const [fallbackPopoverAnchor, setFallbackPopoverAnchor] = (0, _element.useState)(null);
   const containerRef = (0, _element.useRef)();
-  const [isOpen, setIsOpen] = useObservableState(false, onToggle);
-  (0, _element.useEffect)(() => () => {
-    if (onToggle && isOpen) {
-      onToggle(false);
-    }
-  }, [onToggle, isOpen]);
-  function toggle() {
-    setIsOpen(!isOpen);
-  }
+  const [isOpen, setIsOpen] = (0, _hooks.useControlledValue)({
+    defaultValue: defaultOpen,
+    value: open,
+    onChange: onToggle
+  });
 
   /**
    * Closes the popover when focus leaves it unless the toggle was pressed or
@@ -91,14 +81,12 @@ const UnconnectedDropdown = (props, forwardedRef) => {
     }
   }
   function close() {
-    if (onClose) {
-      onClose();
-    }
+    onClose?.();
     setIsOpen(false);
   }
   const args = {
-    isOpen,
-    onToggle: toggle,
+    isOpen: !!isOpen,
+    onToggle: () => setIsOpen(!isOpen),
     onClose: close
   };
   const popoverPropsHaveAnchor = !!popoverProps?.anchor ||

package/build/dropdown/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_compose","_deprecated","_context","_popover","useObservableState","initialState","onStateChange","state","setState","useState","value","UnconnectedDropdown","props","forwardedRef","renderContent","renderToggle","className","contentClassName","expandOnMobile","headerTitle","focusOnMount","popoverProps","onClose","onToggle","style","position","variant","useContextSystem","undefined","deprecated","since","alternative","hint","fallbackPopoverAnchor","setFallbackPopoverAnchor","containerRef","useRef","isOpen","setIsOpen","useEffect","toggle","closeIfFocusOutside","current","ownerDocument","dialog","activeElement","closest","contains","close","args","popoverPropsHaveAnchor","anchor","anchorRef","getAnchorRect","anchorRect","createElement","ref","useMergeRefs","tabIndex","default","onFocusOutside","offset","classnames","Dropdown","contextConnect","exports","_default"],"sources":["@wordpress/components/src/dropdown/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect, useContextSystem } from '../ui/context';\nimport Popover from '../popover';\nimport type { DropdownProps, DropdownInternalContext } from './types';\n\nfunction useObservableState(\n\tinitialState: boolean,\n\tonStateChange?: ( newState: boolean ) => void\n) {\n\tconst [ state, setState ] = useState( initialState );\n\treturn [\n\t\tstate,\n\t\t( value: boolean ) => {\n\t\t\tsetState( value );\n\t\t\tif ( onStateChange ) {\n\t\t\t\tonStateChange( value );\n\t\t\t}\n\t\t},\n\t] as const;\n}\n\nconst UnconnectedDropdown = (\n\tprops: DropdownProps,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\trenderContent,\n\t\trenderToggle,\n\t\tclassName,\n\t\tcontentClassName,\n\t\texpandOnMobile,\n\t\theaderTitle,\n\t\tfocusOnMount,\n\t\tpopoverProps,\n\t\tonClose,\n\t\tonToggle,\n\t\tstyle,\n\n\t\t// Deprecated props\n\t\tposition,\n\n\t\t// From context system\n\t\tvariant,\n\t} = useContextSystem< DropdownProps & DropdownInternalContext >(\n\t\tprops,\n\t\t'Dropdown'\n\t);\n\n\tif ( position !== undefined ) {\n\t\tdeprecated( '`position` prop in wp.components.Dropdown', {\n\t\t\tsince: '6.2',\n\t\t\talternative: '`popoverProps.placement` prop',\n\t\t\thint: 'Note that the `position` prop will override any values passed through the `popoverProps.placement` prop.',\n\t\t} );\n\t}\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ fallbackPopoverAnchor, setFallbackPopoverAnchor ] =\n\t\tuseState< HTMLDivElement | null >( null );\n\tconst containerRef = useRef< HTMLDivElement >();\n\tconst [ isOpen, setIsOpen ] = useObservableState( false, onToggle );\n\n\tuseEffect(\n\t\t() => () => {\n\t\t\tif ( onToggle && isOpen ) {\n\t\t\t\tonToggle( false );\n\t\t\t}\n\t\t},\n\t\t[ onToggle, isOpen ]\n\t);\n\n\tfunction toggle() {\n\t\tsetIsOpen( ! isOpen );\n\t}\n\n\t/**\n\t * Closes the popover when focus leaves it unless the toggle was pressed or\n\t * focus has moved to a separate dialog. The former is to let the toggle\n\t * handle closing the popover and the latter is to preserve presence in\n\t * case a dialog has opened, allowing focus to return when it's dismissed.\n\t */\n\tfunction closeIfFocusOutside() {\n\t\tif ( ! containerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { ownerDocument } = containerRef.current;\n\t\tconst dialog =\n\t\t\townerDocument?.activeElement?.closest( '[role=\"dialog\"]' );\n\t\tif (\n\t\t\t! containerRef.current.contains( ownerDocument.activeElement ) &&\n\t\t\t( ! dialog || dialog.contains( containerRef.current ) )\n\t\t) {\n\t\t\tclose();\n\t\t}\n\t}\n\n\tfunction close() {\n\t\tif ( onClose ) {\n\t\t\tonClose();\n\t\t}\n\t\tsetIsOpen( false );\n\t}\n\n\tconst args = { isOpen, onToggle: toggle, onClose: close };\n\tconst popoverPropsHaveAnchor =\n\t\t!! popoverProps?.anchor ||\n\t\t// Note: `anchorRef`, `getAnchorRect` and `anchorRect` are deprecated and\n\t\t// be removed from `Popover` from WordPress 6.3\n\t\t!! popoverProps?.anchorRef ||\n\t\t!! popoverProps?.getAnchorRect ||\n\t\t!! popoverProps?.anchorRect;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ className }\n\t\t\tref={ useMergeRefs( [\n\t\t\t\tcontainerRef,\n\t\t\t\tforwardedRef,\n\t\t\t\tsetFallbackPopoverAnchor,\n\t\t\t] ) }\n\t\t\t// Some UAs focus the closest focusable parent when the toggle is\n\t\t\t// clicked. Making this div focusable ensures such UAs will focus\n\t\t\t// it and `closeIfFocusOutside` can tell if the toggle was clicked.\n\t\t\ttabIndex={ -1 }\n\t\t\tstyle={ style }\n\t\t>\n\t\t\t{ renderToggle( args ) }\n\t\t\t{ isOpen && (\n\t\t\t\t<Popover\n\t\t\t\t\tposition={ position }\n\t\t\t\t\tonClose={ close }\n\t\t\t\t\tonFocusOutside={ closeIfFocusOutside }\n\t\t\t\t\texpandOnMobile={ expandOnMobile }\n\t\t\t\t\theaderTitle={ headerTitle }\n\t\t\t\t\tfocusOnMount={ focusOnMount }\n\t\t\t\t\t// This value is used to ensure that the dropdowns\n\t\t\t\t\t// align with the editor header by default.\n\t\t\t\t\toffset={ 13 }\n\t\t\t\t\tanchor={\n\t\t\t\t\t\t! popoverPropsHaveAnchor\n\t\t\t\t\t\t\t? fallbackPopoverAnchor\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tvariant={ variant }\n\t\t\t\t\t{ ...popoverProps }\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-dropdown__content',\n\t\t\t\t\t\tpopoverProps?.className,\n\t\t\t\t\t\tcontentClassName\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t{ renderContent( args ) }\n\t\t\t\t</Popover>\n\t\t\t) }\n\t\t</div>\n\t);\n};\n\n/**\n * Renders a button that opens a floating content modal when clicked.\n *\n * ```jsx\n * import { Button, Dropdown } from '@wordpress/components';\n *\n * const MyDropdown = () => (\n *   <Dropdown\n *     className=\"my-container-class-name\"\n *     contentClassName=\"my-dropdown-content-classname\"\n *     popoverProps={ { placement: 'bottom-start' } }\n *     renderToggle={ ( { isOpen, onToggle } ) => (\n *       <Button\n *         variant=\"primary\"\n *         onClick={ onToggle }\n *         aria-expanded={ isOpen }\n *       >\n *         Toggle Dropdown!\n *       </Button>\n *     ) }\n *     renderContent={ () => <div>This is the content of the dropdown.</div> }\n *   />\n * );\n * ```\n */\nexport const Dropdown = contextConnect( UnconnectedDropdown, 'Dropdown' );\n\nexport default Dropdown;\n"],"mappings":"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"}
+{"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_compose","_deprecated","_context","_hooks","_popover","UnconnectedDropdown","props","forwardedRef","renderContent","renderToggle","className","contentClassName","expandOnMobile","headerTitle","focusOnMount","popoverProps","onClose","onToggle","style","open","defaultOpen","position","variant","useContextSystem","undefined","deprecated","since","alternative","hint","fallbackPopoverAnchor","setFallbackPopoverAnchor","useState","containerRef","useRef","isOpen","setIsOpen","useControlledValue","defaultValue","value","onChange","closeIfFocusOutside","current","ownerDocument","dialog","activeElement","closest","contains","close","args","popoverPropsHaveAnchor","anchor","anchorRef","getAnchorRect","anchorRect","createElement","ref","useMergeRefs","tabIndex","default","onFocusOutside","offset","classnames","Dropdown","contextConnect","exports","_default"],"sources":["@wordpress/components/src/dropdown/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useRef, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect, useContextSystem } from '../ui/context';\nimport { useControlledValue } from '../utils/hooks';\nimport Popover from '../popover';\nimport type { DropdownProps, DropdownInternalContext } from './types';\n\nconst UnconnectedDropdown = (\n\tprops: DropdownProps,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\trenderContent,\n\t\trenderToggle,\n\t\tclassName,\n\t\tcontentClassName,\n\t\texpandOnMobile,\n\t\theaderTitle,\n\t\tfocusOnMount,\n\t\tpopoverProps,\n\t\tonClose,\n\t\tonToggle,\n\t\tstyle,\n\n\t\topen,\n\t\tdefaultOpen,\n\n\t\t// Deprecated props\n\t\tposition,\n\n\t\t// From context system\n\t\tvariant,\n\t} = useContextSystem< DropdownProps & DropdownInternalContext >(\n\t\tprops,\n\t\t'Dropdown'\n\t);\n\n\tif ( position !== undefined ) {\n\t\tdeprecated( '`position` prop in wp.components.Dropdown', {\n\t\t\tsince: '6.2',\n\t\t\talternative: '`popoverProps.placement` prop',\n\t\t\thint: 'Note that the `position` prop will override any values passed through the `popoverProps.placement` prop.',\n\t\t} );\n\t}\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ fallbackPopoverAnchor, setFallbackPopoverAnchor ] =\n\t\tuseState< HTMLDivElement | null >( null );\n\tconst containerRef = useRef< HTMLDivElement >();\n\n\tconst [ isOpen, setIsOpen ] = useControlledValue( {\n\t\tdefaultValue: defaultOpen,\n\t\tvalue: open,\n\t\tonChange: onToggle,\n\t} );\n\n\t/**\n\t * Closes the popover when focus leaves it unless the toggle was pressed or\n\t * focus has moved to a separate dialog. The former is to let the toggle\n\t * handle closing the popover and the latter is to preserve presence in\n\t * case a dialog has opened, allowing focus to return when it's dismissed.\n\t */\n\tfunction closeIfFocusOutside() {\n\t\tif ( ! containerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { ownerDocument } = containerRef.current;\n\t\tconst dialog =\n\t\t\townerDocument?.activeElement?.closest( '[role=\"dialog\"]' );\n\t\tif (\n\t\t\t! containerRef.current.contains( ownerDocument.activeElement ) &&\n\t\t\t( ! dialog || dialog.contains( containerRef.current ) )\n\t\t) {\n\t\t\tclose();\n\t\t}\n\t}\n\n\tfunction close() {\n\t\tonClose?.();\n\t\tsetIsOpen( false );\n\t}\n\n\tconst args = {\n\t\tisOpen: !! isOpen,\n\t\tonToggle: () => setIsOpen( ! isOpen ),\n\t\tonClose: close,\n\t};\n\tconst popoverPropsHaveAnchor =\n\t\t!! popoverProps?.anchor ||\n\t\t// Note: `anchorRef`, `getAnchorRect` and `anchorRect` are deprecated and\n\t\t// be removed from `Popover` from WordPress 6.3\n\t\t!! popoverProps?.anchorRef ||\n\t\t!! popoverProps?.getAnchorRect ||\n\t\t!! popoverProps?.anchorRect;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ className }\n\t\t\tref={ useMergeRefs( [\n\t\t\t\tcontainerRef,\n\t\t\t\tforwardedRef,\n\t\t\t\tsetFallbackPopoverAnchor,\n\t\t\t] ) }\n\t\t\t// Some UAs focus the closest focusable parent when the toggle is\n\t\t\t// clicked. Making this div focusable ensures such UAs will focus\n\t\t\t// it and `closeIfFocusOutside` can tell if the toggle was clicked.\n\t\t\ttabIndex={ -1 }\n\t\t\tstyle={ style }\n\t\t>\n\t\t\t{ renderToggle( args ) }\n\t\t\t{ isOpen && (\n\t\t\t\t<Popover\n\t\t\t\t\tposition={ position }\n\t\t\t\t\tonClose={ close }\n\t\t\t\t\tonFocusOutside={ closeIfFocusOutside }\n\t\t\t\t\texpandOnMobile={ expandOnMobile }\n\t\t\t\t\theaderTitle={ headerTitle }\n\t\t\t\t\tfocusOnMount={ focusOnMount }\n\t\t\t\t\t// This value is used to ensure that the dropdowns\n\t\t\t\t\t// align with the editor header by default.\n\t\t\t\t\toffset={ 13 }\n\t\t\t\t\tanchor={\n\t\t\t\t\t\t! popoverPropsHaveAnchor\n\t\t\t\t\t\t\t? fallbackPopoverAnchor\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tvariant={ variant }\n\t\t\t\t\t{ ...popoverProps }\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-dropdown__content',\n\t\t\t\t\t\tpopoverProps?.className,\n\t\t\t\t\t\tcontentClassName\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t{ renderContent( args ) }\n\t\t\t\t</Popover>\n\t\t\t) }\n\t\t</div>\n\t);\n};\n\n/**\n * Renders a button that opens a floating content modal when clicked.\n *\n * ```jsx\n * import { Button, Dropdown } from '@wordpress/components';\n *\n * const MyDropdown = () => (\n *   <Dropdown\n *     className=\"my-container-class-name\"\n *     contentClassName=\"my-dropdown-content-classname\"\n *     popoverProps={ { placement: 'bottom-start' } }\n *     renderToggle={ ( { isOpen, onToggle } ) => (\n *       <Button\n *         variant=\"primary\"\n *         onClick={ onToggle }\n *         aria-expanded={ isOpen }\n *       >\n *         Toggle Dropdown!\n *       </Button>\n *     ) }\n *     renderContent={ () => <div>This is the content of the dropdown.</div> }\n *   />\n * );\n * ```\n */\nexport const Dropdown = contextConnect( UnconnectedDropdown, 'Dropdown' );\n\nexport default Dropdown;\n"],"mappings":";;;;;;;AASA,IAAAA,QAAA,GAAAC,OAAA;AANA,IAAAC,WAAA,GAAAC,sBAAA,CAAAF,OAAA;AAOA,IAAAG,QAAA,GAAAH,OAAA;AACA,IAAAI,WAAA,GAAAF,sBAAA,CAAAF,OAAA;AAKA,IAAAK,QAAA,GAAAL,OAAA;AACA,IAAAM,MAAA,GAAAN,OAAA;AACA,IAAAO,QAAA,GAAAL,sBAAA,CAAAF,OAAA;AAlBA;AACA;AACA;;AAIA;AACA;AACA;;AAKA;AACA;AACA;;AAMA,MAAMQ,mBAAmB,GAAGA,CAC3BC,KAAoB,EACpBC,YAAiC,KAC7B;EACJ,MAAM;IACLC,aAAa;IACbC,YAAY;IACZC,SAAS;IACTC,gBAAgB;IAChBC,cAAc;IACdC,WAAW;IACXC,YAAY;IACZC,YAAY;IACZC,OAAO;IACPC,QAAQ;IACRC,KAAK;IAELC,IAAI;IACJC,WAAW;IAEX;IACAC,QAAQ;IAER;IACAC;EACD,CAAC,GAAG,IAAAC,yBAAgB,EACnBjB,KAAK,EACL,UACD,CAAC;EAED,IAAKe,QAAQ,KAAKG,SAAS,EAAG;IAC7B,IAAAC,mBAAU,EAAE,2CAA2C,EAAE;MACxDC,KAAK,EAAE,KAAK;MACZC,WAAW,EAAE,+BAA+B;MAC5CC,IAAI,EAAE;IACP,CAAE,CAAC;EACJ;;EAEA;EACA;EACA,MAAM,CAAEC,qBAAqB,EAAEC,wBAAwB,CAAE,GACxD,IAAAC,iBAAQ,EAA2B,IAAK,CAAC;EAC1C,MAAMC,YAAY,GAAG,IAAAC,eAAM,EAAmB,CAAC;EAE/C,MAAM,CAAEC,MAAM,EAAEC,SAAS,CAAE,GAAG,IAAAC,yBAAkB,EAAE;IACjDC,YAAY,EAAEjB,WAAW;IACzBkB,KAAK,EAAEnB,IAAI;IACXoB,QAAQ,EAAEtB;EACX,CAAE,CAAC;;EAEH;AACD;AACA;AACA;AACA;AACA;EACC,SAASuB,mBAAmBA,CAAA,EAAG;IAC9B,IAAK,CAAER,YAAY,CAACS,OAAO,EAAG;MAC7B;IACD;IAEA,MAAM;MAAEC;IAAc,CAAC,GAAGV,YAAY,CAACS,OAAO;IAC9C,MAAME,MAAM,GACXD,aAAa,EAAEE,aAAa,EAAEC,OAAO,CAAE,iBAAkB,CAAC;IAC3D,IACC,CAAEb,YAAY,CAACS,OAAO,CAACK,QAAQ,CAAEJ,aAAa,CAACE,aAAc,CAAC,KAC5D,CAAED,MAAM,IAAIA,MAAM,CAACG,QAAQ,CAAEd,YAAY,CAACS,OAAQ,CAAC,CAAE,EACtD;MACDM,KAAK,CAAC,CAAC;IACR;EACD;EAEA,SAASA,KAAKA,CAAA,EAAG;IAChB/B,OAAO,GAAG,CAAC;IACXmB,SAAS,CAAE,KAAM,CAAC;EACnB;EAEA,MAAMa,IAAI,GAAG;IACZd,MAAM,EAAE,CAAC,CAAEA,MAAM;IACjBjB,QAAQ,EAAEA,CAAA,KAAMkB,SAAS,CAAE,CAAED,MAAO,CAAC;IACrClB,OAAO,EAAE+B;EACV,CAAC;EACD,MAAME,sBAAsB,GAC3B,CAAC,CAAElC,YAAY,EAAEmC,MAAM;EACvB;EACA;EACA,CAAC,CAAEnC,YAAY,EAAEoC,SAAS,IAC1B,CAAC,CAAEpC,YAAY,EAAEqC,aAAa,IAC9B,CAAC,CAAErC,YAAY,EAAEsC,UAAU;EAE5B,OACC,IAAAzD,QAAA,CAAA0D,aAAA;IACC5C,SAAS,EAAGA,SAAW;IACvB6C,GAAG,EAAG,IAAAC,qBAAY,EAAE,CACnBxB,YAAY,EACZzB,YAAY,EACZuB,wBAAwB,CACvB;IACF;IACA;IACA;IAAA;IACA2B,QAAQ,EAAG,CAAC,CAAG;IACfvC,KAAK,EAAGA;EAAO,GAEbT,YAAY,CAAEuC,IAAK,CAAC,EACpBd,MAAM,IACP,IAAAtC,QAAA,CAAA0D,aAAA,EAAClD,QAAA,CAAAsD,OAAO;IACPrC,QAAQ,EAAGA,QAAU;IACrBL,OAAO,EAAG+B,KAAO;IACjBY,cAAc,EAAGnB,mBAAqB;IACtC5B,cAAc,EAAGA,cAAgB;IACjCC,WAAW,EAAGA,WAAa;IAC3BC,YAAY,EAAGA;IACf;IACA;IAAA;IACA8C,MAAM,EAAG,EAAI;IACbV,MAAM,EACL,CAAED,sBAAsB,GACrBpB,qBAAqB,GACrBL,SACH;IACDF,OAAO,EAAGA,OAAS;IAAA,GACdP,YAAY;IACjBL,SAAS,EAAG,IAAAmD,mBAAU,EACrB,8BAA8B,EAC9B9C,YAAY,EAAEL,SAAS,EACvBC,gBACD;EAAG,GAEDH,aAAa,CAAEwC,IAAK,CACd,CAEN,CAAC;AAER,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMc,QAAQ,GAAG,IAAAC,uBAAc,EAAE1D,mBAAmB,EAAE,UAAW,CAAC;AAAC2D,OAAA,CAAAF,QAAA,GAAAA,QAAA;AAAA,IAAAG,QAAA,GAE3DH,QAAQ;AAAAE,OAAA,CAAAN,OAAA,GAAAO,QAAA"}