npm - @wordpress/components - Versions diffs - 23.3.1 → 23.3.2 - Mend

@wordpress/components 23.3.1 → 23.3.2

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

Files changed (220) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -2,6 +2,25 @@
 ## Unreleased
+### Bug Fix
+-   `SelectControl`: Fix styling when `multiple` prop is enabled ([#47893](https://github.com/WordPress/gutenberg/pull/43213)).
+### Enhancements
+-   `ColorPalette`: ensure text label contrast checking works with CSS variables ([#47373](https://github.com/WordPress/gutenberg/pull/47373)).
+-  `Navigator`: Support dynamic paths with parameters ([#47827](https://github.com/WordPress/gutenberg/pull/47827)).
+-  `Navigator`: Support hierarchical paths navigation and add `NavigatorToParentButton` component ([#47883](https://github.com/WordPress/gutenberg/pull/47883)).
+### Internal
+-   `NavigatorButton`: Reuse `Button` types ([47754](https://github.com/WordPress/gutenberg/pull/47754)).
+-   `ToolsPanel`: Allow display of optional items when values are updated externally to item controls ([47727](https://github.com/WordPress/gutenberg/pull/47727)).
+-   `ToolsPanel`: Ensure display of optional items when values are updated externally and multiple blocks selected ([47864](https://github.com/WordPress/gutenberg/pull/47864)).
+-   `CustomSelectControl`: lock the `__experimentalShowSelectedHint` prop ([#47229](https://github.com/WordPress/gutenberg/pull/47229)).
+-   Lock the `__experimentalPopoverPositionToPlacement` function and rename it to `__experimentalPopoverLegacyPositionToPlacement` ([#47505](https://github.com/WordPress/gutenberg/pull/47505)).
+-   `Navigator`: add more pattern matching tests, refine existing tests ([47910](https://github.com/WordPress/gutenberg/pull/47910)).
 ## 23.3.0 (2023-02-01)
 ### Deprecations
@@ -10,7 +29,7 @@
 ### Enhancements
--   `Dropdown`: deprecate `position`  prop, use `popoverProps` instead ([46865](https://github.com/WordPress/gutenberg/pull/46865)).
+-   `Dropdown`: deprecate `position` prop, use `popoverProps` instead ([46865](https://github.com/WordPress/gutenberg/pull/46865)).
 -   `Button`: improve padding for buttons with icon and text. ([46764](https://github.com/WordPress/gutenberg/pull/46764)).
 -   `ColorPalette`: Use computed color when css variable is passed to `ColorPicker` ([47181](https://github.com/WordPress/gutenberg/pull/47181)).
@@ -22,7 +41,7 @@
 -   `ColorListPicker`: Convert to TypeScript ([#46358](https://github.com/WordPress/gutenberg/pull/46358)).
 -   `KeyboardShortcuts`: Convert to TypeScript ([#47429](https://github.com/WordPress/gutenberg/pull/47429)).
 -   `ColorPalette`, `BorderControl`, `GradientPicker`: refine types and logic around single vs multiple palettes
- ([#47384](https://github.com/WordPress/gutenberg/pull/47384)).
+    ([#47384](https://github.com/WordPress/gutenberg/pull/47384)).
 -   `Button`: Convert to TypeScript ([#46997](https://github.com/WordPress/gutenberg/pull/46997)).
 -   `QueryControls`: Convert to TypeScript ([#46721](https://github.com/WordPress/gutenberg/pull/46721)).
 -   `Notice`: refactor to TypeScript ([47118](https://github.com/WordPress/gutenberg/pull/47118)).
@@ -35,6 +54,7 @@
 ## 23.2.0 (2023-01-11)
 ### Internal
 -   `AlignmentMatrixControl`: Update center cell label to 'Center' instead of 'Center Center' ([#46852](https://github.com/WordPress/gutenberg/pull/46852)).
 -   `Toolbar`: move all subcomponents under the same folder ([46951](https://github.com/WordPress/gutenberg/pull/46951)).
 -   `Dashicon`: remove unnecessary type for `className` prop ([46849](https://github.com/WordPress/gutenberg/pull/46849)).

package/build/color-palette/index.js CHANGED Viewed

@@ -157,7 +157,6 @@ function CustomColorPickerDropdown(_ref5) {
 }
 function UnforwardedColorPalette(props, forwardedRef) {
-  const customColorPaletteRef = (0, _element.useRef)(null);
   const {
     clearable = true,
     colors = [],
@@ -168,19 +167,23 @@ function UnforwardedColorPalette(props, forwardedRef) {
     __experimentalIsRenderedInSidebar = false,
     ...otherProps
   } = props;
+  const [normalizedColorValue, setNormalizedColorValue] = (0, _element.useState)(value);
   const clearColor = (0, _element.useCallback)(() => onChange(undefined), [onChange]);
+  const customColorPaletteCallbackRef = (0, _element.useCallback)(node => {
+    setNormalizedColorValue((0, _utils.normalizeColorValue)(value, node));
+  }, [value]);
   const hasMultipleColorOrigins = (0, _utils.isMultiplePaletteArray)(colors);
   const buttonLabelName = (0, _element.useMemo)(() => (0, _utils.extractColorNameFromCurrentValue)(value, colors, hasMultipleColorOrigins), [value, colors, hasMultipleColorOrigins]);
   const renderCustomColorPicker = () => (0, _element.createElement)(_dropdownContentWrapper.default, {
     paddingSize: "none"
   }, (0, _element.createElement)(_colorPicker.ColorPicker, {
-    color: (0, _utils.normalizeColorValue)(value, customColorPaletteRef),
+    color: normalizedColorValue,
     onChange: color => onChange(color),
     enableAlpha: enableAlpha
   }));
-  const colordColor = (0, _colord.colord)(value !== null && value !== void 0 ? value : '');
+  const colordColor = (0, _colord.colord)(normalizedColorValue !== null && normalizedColorValue !== void 0 ? normalizedColorValue : '');
   const valueWithoutLeadingHash = value !== null && value !== void 0 && value.startsWith('#') ? value.substring(1) : value !== null && value !== void 0 ? value : '';
   const customColorAccessibleLabel = !!valueWithoutLeadingHash ? (0, _i18n.sprintf)( // translators: %1$s: The name of the color e.g: "vivid red". %2$s: The color's hex code e.g: "#f00".
   (0, _i18n.__)('Custom color picker. The currently selected color is called "%1$s" and has a value of "%2$s".'), buttonLabelName, valueWithoutLeadingHash) : (0, _i18n.__)('Custom color picker.');
@@ -206,7 +209,7 @@ function UnforwardedColorPalette(props, forwardedRef) {
       } = _ref6;
       return (0, _element.createElement)(_flex.Flex, {
         as: 'button',
-        ref: customColorPaletteRef,
+        ref: customColorPaletteCallbackRef,
         justify: "space-between",
         align: "flex-start",
         className: "components-color-palette__custom-color",

package/build/color-palette/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/color-palette/index.tsx"],"names":["namesPlugin","a11yPlugin","SinglePalette","className","clearColor","colors","onChange","value","actions","colorOptions","map","index","color","name","colordColor","isSelected","fill","contrast","backgroundColor","MultiplePalettes","length","colorPalette","newColor","CustomColorPickerDropdown","isRenderedInSidebar","popoverProps","receivedPopoverProps","props","shift","placement","offset","UnforwardedColorPalette","forwardedRef","customColorPaletteRef","clearable","disableCustomColors","enableAlpha","__experimentalIsRenderedInSidebar","otherProps","undefined","hasMultipleColorOrigins","buttonLabelName","renderCustomColorPicker","valueWithoutLeadingHash","startsWith","substring","customColorAccessibleLabel","paletteCommonProps","isOpen","onToggle","background","Truncate","ColorPalette"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\n\n/\n WordPress dependencies\n /\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useRef, useMemo, forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport Dropdown from '../dropdown';\nimport { ColorPicker } from '../color-picker';\nimport CircularOptionPicker from '../circular-option-picker';\nimport { VStack } from '../v-stack';\nimport { Flex, FlexItem } from '../flex';\nimport { Truncate } from '../truncate';\nimport { ColorHeading } from './styles';\nimport DropdownContentWrapper from '../dropdown/dropdown-content-wrapper';\nimport type {\n\tColorObject,\n\tColorPaletteProps,\n\tCustomColorPickerDropdownProps,\n\tMultiplePalettesProps,\n\tPaletteObject,\n\tSinglePaletteProps,\n} from './types';\nimport type { WordPressComponentProps } from '../ui/context';\nimport type { DropdownProps } from '../dropdown/types';\nimport {\n\textractColorNameFromCurrentValue,\n\tisMultiplePaletteArray,\n\tnormalizeColorValue,\n\tshowTransparentBackground,\n} from './utils';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction SinglePalette( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\tactions,\n}: SinglePaletteProps ) {\n\tconst colorOptions = useMemo( () => {\n\t\treturn colors.map( ( { color, name }, index ) => {\n\t\t\tconst colordColor = colord( color );\n\t\t\tconst isSelected = value === color;\n\n\t\t\treturn (\n\t\t\t\t<CircularOptionPicker.Option\n\t\t\t\t\tkey={ `${ color }-${ index }` }\n\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\tselectedIconProps={\n\t\t\t\t\t\tisSelected\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tfill:\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: {}\n\t\t\t\t\t}\n\t\t\t\t\ttooltipText={\n\t\t\t\t\t\tname \|\|\n\t\t\t\t\t\t// translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\tsprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t\tstyle={ { backgroundColor: color, color } }\n\t\t\t\t\tonClick={\n\t\t\t\t\t\tisSelected ? clearColor : () => onChange( color, index )\n\t\t\t\t\t}\n\t\t\t\t\taria-label={\n\t\t\t\t\t\tname\n\t\t\t\t\t\t\t? // translators: %s: The name of the color e.g: \"vivid red\".\n\t\t\t\t\t\t\t sprintf( __( 'Color: %s' ), name )\n\t\t\t\t\t\t\t: // translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\t\t sprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\t}, [ colors, value, onChange, clearColor ] );\n\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\tclassName={ className }\n\t\t\toptions={ colorOptions }\n\t\t\tactions={ actions }\n\t\t/>\n\t);\n}\n\nfunction MultiplePalettes( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\tactions,\n}: MultiplePalettesProps ) {\n\tif ( colors.length === 0 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ colors.map( ( { name, colors: colorPalette }, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading>{ name }</ColorHeading>\n\t\t\t\t\t\t<SinglePalette\n\t\t\t\t\t\t\tclearColor={ clearColor }\n\t\t\t\t\t\t\tcolors={ colorPalette }\n\t\t\t\t\t\t\tonChange={ ( newColor ) =>\n\t\t\t\t\t\t\t\tonChange( newColor, index )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\tactions={\n\t\t\t\t\t\t\t\tcolors.length === index + 1 ? actions : null\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nexport function CustomColorPickerDropdown( {\n\tisRenderedInSidebar,\n\tpopoverProps: receivedPopoverProps,\n\t...props\n}: CustomColorPickerDropdownProps ) {\n\tconst popoverProps = useMemo< DropdownProps[ 'popoverProps' ] >(\n\t\t() => ( {\n\t\t\tshift: true,\n\t\t\t...( isRenderedInSidebar\n\t\t\t\t? {\n\t\t\t\t\t\t// When in the sidebar: open to the left (stacking),\n\t\t\t\t\t\t// leaving the same gap as the parent popover.\n\t\t\t\t\t\tplacement: 'left-start',\n\t\t\t\t\t\toffset: 34,\n\t\t\t\t }\n\t\t\t\t: {\n\t\t\t\t\t\t// Default behavior: open below the anchor\n\t\t\t\t\t\tplacement: 'bottom',\n\t\t\t\t\t\toffset: 8,\n\t\t\t\t } ),\n\t\t\t...receivedPopoverProps,\n\t\t} ),\n\t\t[ isRenderedInSidebar, receivedPopoverProps ]\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\tcontentClassName=\"components-color-palette__custom-color-dropdown-content\"\n\t\t\tpopoverProps={ popoverProps }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction UnforwardedColorPalette(\n\tprops: WordPressComponentProps< ColorPaletteProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst customColorPaletteRef = useRef< HTMLElement \| null >( null );\n\tconst {\n\t\tclearable = true,\n\t\tcolors = [],\n\t\tdisableCustomColors = false,\n\t\tenableAlpha = false,\n\t\tonChange,\n\t\tvalue,\n\t\t__experimentalIsRenderedInSidebar = false,\n\t\t...otherProps\n\t} = props;\n\tconst clearColor = useCallback( () => onChange( undefined ), [ onChange ] );\n\n\tconst hasMultipleColorOrigins = isMultiplePaletteArray( colors );\n\tconst buttonLabelName = useMemo(\n\t\t() =>\n\t\t\textractColorNameFromCurrentValue(\n\t\t\t\tvalue,\n\t\t\t\tcolors,\n\t\t\t\thasMultipleColorOrigins\n\t\t\t),\n\t\t[ value, colors, hasMultipleColorOrigins ]\n\t);\n\n\tconst renderCustomColorPicker = () => (\n\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t<ColorPicker\n\t\t\t\tcolor={ normalizeColorValue( value, customColorPaletteRef ) }\n\t\t\t\tonChange={ ( color ) => onChange( color ) }\n\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t/>\n\t\t</DropdownContentWrapper>\n\t);\n\n\tconst colordColor = colord( value ?? '' );\n\n\tconst valueWithoutLeadingHash = value?.startsWith( '#' )\n\t\t? value.substring( 1 )\n\t\t: value ?? '';\n\n\tconst customColorAccessibleLabel = !! valueWithoutLeadingHash\n\t\t? sprintf(\n\t\t\t\t// translators: %1$s: The name of the color e.g: \"vivid red\". %2$s: The color's hex code e.g: \"#f00\".\n\t\t\t\t__(\n\t\t\t\t\t'Custom color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'\n\t\t\t\t),\n\t\t\t\tbuttonLabelName,\n\t\t\t\tvalueWithoutLeadingHash\n\t\t )\n\t\t: __( 'Custom color picker.' );\n\n\tconst paletteCommonProps = {\n\t\tclearable,\n\t\tclearColor,\n\t\tonChange,\n\t\tvalue,\n\t\tactions: !! clearable && (\n\t\t\t<CircularOptionPicker.ButtonAction onClick={ clearColor }>\n\t\t\t\t{ __( 'Clear' ) }\n\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t),\n\t};\n\n\treturn (\n\t\t<VStack spacing={ 3 } ref={ forwardedRef } { ...otherProps }>\n\t\t\t{ ! disableCustomColors && (\n\t\t\t\t<CustomColorPickerDropdown\n\t\t\t\t\tisRenderedInSidebar={ __experimentalIsRenderedInSidebar }\n\t\t\t\t\trenderContent={ renderCustomColorPicker }\n\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\tas={ 'button' }\n\t\t\t\t\t\t\tref={ customColorPaletteRef }\n\t\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t\t\talign=\"flex-start\"\n\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color\"\n\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\taria-label={ customColorAccessibleLabel }\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\tshowTransparentBackground( value )\n\t\t\t\t\t\t\t\t\t? { color: '#000' }\n\t\t\t\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\t\t\t\tbackground: value,\n\t\t\t\t\t\t\t\t\t\t\tcolor:\n\t\t\t\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\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\t\t<FlexItem\n\t\t\t\t\t\t\t\tisBlock\n\t\t\t\t\t\t\t\tas={ Truncate }\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-name\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ buttonLabelName }\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\tas=\"span\"\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-value\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ valueWithoutLeadingHash }\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t</Flex>\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ hasMultipleColorOrigins ? (\n\t\t\t\t<MultiplePalettes\n\t\t\t\t\t{ ...paletteCommonProps }\n\t\t\t\t\tcolors={ colors as PaletteObject[] }\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<SinglePalette\n\t\t\t\t\t{ ...paletteCommonProps }\n\t\t\t\t\tcolors={ colors as ColorObject[] }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\n/\n Allows the user to pick a color from a list of pre-defined color entries.\n \n ```jsx\n * import { ColorPalette } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyColorPalette = () => {\n * const [ color, setColor ] = useState ( '#f00' )\n * const colors = [\n * { name: 'red', color: '#f00' },\n * { name: 'white', color: '#fff' },\n * { name: 'blue', color: '#00f' },\n * ];\n * return (\n * <ColorPalette\n * colors={ colors }\n * value={ color }\n * onChange={ ( color ) => setColor( color ) }\n * />\n * );\n * } );\n * ```\n */\nexport const ColorPalette = forwardRef( UnforwardedColorPalette );\n\nexport default ColorPalette;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/color-palette/index.tsx"],"names":["namesPlugin","a11yPlugin","SinglePalette","className","clearColor","colors","onChange","value","actions","colorOptions","map","index","color","name","colordColor","isSelected","fill","contrast","backgroundColor","MultiplePalettes","length","colorPalette","newColor","CustomColorPickerDropdown","isRenderedInSidebar","popoverProps","receivedPopoverProps","props","shift","placement","offset","UnforwardedColorPalette","forwardedRef","clearable","disableCustomColors","enableAlpha","__experimentalIsRenderedInSidebar","otherProps","normalizedColorValue","setNormalizedColorValue","undefined","customColorPaletteCallbackRef","node","hasMultipleColorOrigins","buttonLabelName","renderCustomColorPicker","valueWithoutLeadingHash","startsWith","substring","customColorAccessibleLabel","paletteCommonProps","isOpen","onToggle","background","Truncate","ColorPalette"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\n\n/\n WordPress dependencies\n /\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useMemo, useState, forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport Dropdown from '../dropdown';\nimport { ColorPicker } from '../color-picker';\nimport CircularOptionPicker from '../circular-option-picker';\nimport { VStack } from '../v-stack';\nimport { Flex, FlexItem } from '../flex';\nimport { Truncate } from '../truncate';\nimport { ColorHeading } from './styles';\nimport DropdownContentWrapper from '../dropdown/dropdown-content-wrapper';\nimport type {\n\tColorObject,\n\tColorPaletteProps,\n\tCustomColorPickerDropdownProps,\n\tMultiplePalettesProps,\n\tPaletteObject,\n\tSinglePaletteProps,\n} from './types';\nimport type { WordPressComponentProps } from '../ui/context';\nimport type { DropdownProps } from '../dropdown/types';\nimport {\n\textractColorNameFromCurrentValue,\n\tisMultiplePaletteArray,\n\tnormalizeColorValue,\n\tshowTransparentBackground,\n} from './utils';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction SinglePalette( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\tactions,\n}: SinglePaletteProps ) {\n\tconst colorOptions = useMemo( () => {\n\t\treturn colors.map( ( { color, name }, index ) => {\n\t\t\tconst colordColor = colord( color );\n\t\t\tconst isSelected = value === color;\n\n\t\t\treturn (\n\t\t\t\t<CircularOptionPicker.Option\n\t\t\t\t\tkey={ `${ color }-${ index }` }\n\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\tselectedIconProps={\n\t\t\t\t\t\tisSelected\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tfill:\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: {}\n\t\t\t\t\t}\n\t\t\t\t\ttooltipText={\n\t\t\t\t\t\tname \|\|\n\t\t\t\t\t\t// translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\tsprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t\tstyle={ { backgroundColor: color, color } }\n\t\t\t\t\tonClick={\n\t\t\t\t\t\tisSelected ? clearColor : () => onChange( color, index )\n\t\t\t\t\t}\n\t\t\t\t\taria-label={\n\t\t\t\t\t\tname\n\t\t\t\t\t\t\t? // translators: %s: The name of the color e.g: \"vivid red\".\n\t\t\t\t\t\t\t sprintf( __( 'Color: %s' ), name )\n\t\t\t\t\t\t\t: // translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\t\t sprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\t}, [ colors, value, onChange, clearColor ] );\n\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\tclassName={ className }\n\t\t\toptions={ colorOptions }\n\t\t\tactions={ actions }\n\t\t/>\n\t);\n}\n\nfunction MultiplePalettes( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\tactions,\n}: MultiplePalettesProps ) {\n\tif ( colors.length === 0 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ colors.map( ( { name, colors: colorPalette }, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading>{ name }</ColorHeading>\n\t\t\t\t\t\t<SinglePalette\n\t\t\t\t\t\t\tclearColor={ clearColor }\n\t\t\t\t\t\t\tcolors={ colorPalette }\n\t\t\t\t\t\t\tonChange={ ( newColor ) =>\n\t\t\t\t\t\t\t\tonChange( newColor, index )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\tactions={\n\t\t\t\t\t\t\t\tcolors.length === index + 1 ? actions : null\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nexport function CustomColorPickerDropdown( {\n\tisRenderedInSidebar,\n\tpopoverProps: receivedPopoverProps,\n\t...props\n}: CustomColorPickerDropdownProps ) {\n\tconst popoverProps = useMemo< DropdownProps[ 'popoverProps' ] >(\n\t\t() => ( {\n\t\t\tshift: true,\n\t\t\t...( isRenderedInSidebar\n\t\t\t\t? {\n\t\t\t\t\t\t// When in the sidebar: open to the left (stacking),\n\t\t\t\t\t\t// leaving the same gap as the parent popover.\n\t\t\t\t\t\tplacement: 'left-start',\n\t\t\t\t\t\toffset: 34,\n\t\t\t\t }\n\t\t\t\t: {\n\t\t\t\t\t\t// Default behavior: open below the anchor\n\t\t\t\t\t\tplacement: 'bottom',\n\t\t\t\t\t\toffset: 8,\n\t\t\t\t } ),\n\t\t\t...receivedPopoverProps,\n\t\t} ),\n\t\t[ isRenderedInSidebar, receivedPopoverProps ]\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\tcontentClassName=\"components-color-palette__custom-color-dropdown-content\"\n\t\t\tpopoverProps={ popoverProps }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction UnforwardedColorPalette(\n\tprops: WordPressComponentProps< ColorPaletteProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\tclearable = true,\n\t\tcolors = [],\n\t\tdisableCustomColors = false,\n\t\tenableAlpha = false,\n\t\tonChange,\n\t\tvalue,\n\t\t__experimentalIsRenderedInSidebar = false,\n\t\t...otherProps\n\t} = props;\n\tconst [ normalizedColorValue, setNormalizedColorValue ] = useState( value );\n\n\tconst clearColor = useCallback( () => onChange( undefined ), [ onChange ] );\n\n\tconst customColorPaletteCallbackRef = useCallback(\n\t\t( node: HTMLElement \| null ) => {\n\t\t\tsetNormalizedColorValue( normalizeColorValue( value, node ) );\n\t\t},\n\t\t[ value ]\n\t);\n\n\tconst hasMultipleColorOrigins = isMultiplePaletteArray( colors );\n\tconst buttonLabelName = useMemo(\n\t\t() =>\n\t\t\textractColorNameFromCurrentValue(\n\t\t\t\tvalue,\n\t\t\t\tcolors,\n\t\t\t\thasMultipleColorOrigins\n\t\t\t),\n\t\t[ value, colors, hasMultipleColorOrigins ]\n\t);\n\n\tconst renderCustomColorPicker = () => (\n\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t<ColorPicker\n\t\t\t\tcolor={ normalizedColorValue }\n\t\t\t\tonChange={ ( color ) => onChange( color ) }\n\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t/>\n\t\t</DropdownContentWrapper>\n\t);\n\n\tconst colordColor = colord( normalizedColorValue ?? '' );\n\n\tconst valueWithoutLeadingHash = value?.startsWith( '#' )\n\t\t? value.substring( 1 )\n\t\t: value ?? '';\n\n\tconst customColorAccessibleLabel = !! valueWithoutLeadingHash\n\t\t? sprintf(\n\t\t\t\t// translators: %1$s: The name of the color e.g: \"vivid red\". %2$s: The color's hex code e.g: \"#f00\".\n\t\t\t\t__(\n\t\t\t\t\t'Custom color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'\n\t\t\t\t),\n\t\t\t\tbuttonLabelName,\n\t\t\t\tvalueWithoutLeadingHash\n\t\t )\n\t\t: __( 'Custom color picker.' );\n\n\tconst paletteCommonProps = {\n\t\tclearable,\n\t\tclearColor,\n\t\tonChange,\n\t\tvalue,\n\t\tactions: !! clearable && (\n\t\t\t<CircularOptionPicker.ButtonAction onClick={ clearColor }>\n\t\t\t\t{ __( 'Clear' ) }\n\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t),\n\t};\n\n\treturn (\n\t\t<VStack spacing={ 3 } ref={ forwardedRef } { ...otherProps }>\n\t\t\t{ ! disableCustomColors && (\n\t\t\t\t<CustomColorPickerDropdown\n\t\t\t\t\tisRenderedInSidebar={ __experimentalIsRenderedInSidebar }\n\t\t\t\t\trenderContent={ renderCustomColorPicker }\n\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\tas={ 'button' }\n\t\t\t\t\t\t\tref={ customColorPaletteCallbackRef }\n\t\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t\t\talign=\"flex-start\"\n\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color\"\n\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\taria-label={ customColorAccessibleLabel }\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\tshowTransparentBackground( value )\n\t\t\t\t\t\t\t\t\t? { color: '#000' }\n\t\t\t\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\t\t\t\tbackground: value,\n\t\t\t\t\t\t\t\t\t\t\tcolor:\n\t\t\t\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\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\t\t<FlexItem\n\t\t\t\t\t\t\t\tisBlock\n\t\t\t\t\t\t\t\tas={ Truncate }\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-name\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ buttonLabelName }\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\tas=\"span\"\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-value\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ valueWithoutLeadingHash }\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t</Flex>\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ hasMultipleColorOrigins ? (\n\t\t\t\t<MultiplePalettes\n\t\t\t\t\t{ ...paletteCommonProps }\n\t\t\t\t\tcolors={ colors as PaletteObject[] }\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<SinglePalette\n\t\t\t\t\t{ ...paletteCommonProps }\n\t\t\t\t\tcolors={ colors as ColorObject[] }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\n/\n Allows the user to pick a color from a list of pre-defined color entries.\n \n ```jsx\n * import { ColorPalette } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyColorPalette = () => {\n * const [ color, setColor ] = useState ( '#f00' )\n * const colors = [\n * { name: 'red', color: '#f00' },\n * { name: 'white', color: '#fff' },\n * { name: 'blue', color: '#00f' },\n * ];\n * return (\n * <ColorPalette\n * colors={ colors }\n * value={ color }\n * onChange={ ( color ) => setColor( color ) }\n * />\n * );\n * } );\n * ```\n */\nexport const ColorPalette = forwardRef( UnforwardedColorPalette );\n\nexport default ColorPalette;\n"]}

package/build/color-palette/utils.js CHANGED Viewed

@@ -79,23 +79,31 @@ exports.isMultiplePaletteObject = isMultiplePaletteObject;
 const isMultiplePaletteArray = arr => {
   return arr.length > 0 && arr.every(colorObj => isMultiplePaletteObject(colorObj));
 };
+/**
+ * Transform a CSS variable used as background color into the color value itself.
+ *
+ * @param value   The color value that may be a CSS variable.
+ * @param element The element for which to get the computed style.
+ * @return The background color value computed from a element.
+ */
 exports.isMultiplePaletteArray = isMultiplePaletteArray;
-const normalizeColorValue = (value, ref) => {
+const normalizeColorValue = (value, element) => {
   const currentValueIsCssVariable = /^var\(/.test(value !== null && value !== void 0 ? value : '');
-  if (!currentValueIsCssVariable || !(ref !== null && ref !== void 0 && ref.current)) {
+  if (!currentValueIsCssVariable || element === null) {
     return value;
   }
   const {
     ownerDocument
-  } = ref.current;
+  } = element;
   const {
     defaultView
   } = ownerDocument;
-  const computedBackgroundColor = defaultView === null || defaultView === void 0 ? void 0 : defaultView.getComputedStyle(ref.current).backgroundColor;
+  const computedBackgroundColor = defaultView === null || defaultView === void 0 ? void 0 : defaultView.getComputedStyle(element).backgroundColor;
   return computedBackgroundColor ? (0, _colord.colord)(computedBackgroundColor).toHex() : value;
 };

package/build/color-palette/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/color-palette/utils.ts"],"names":["namesPlugin","a11yPlugin","extractColorNameFromCurrentValue","currentValue","colors","showMultiplePalettes","currentValueIsCssVariable","test","normalizedCurrentValue","toHex","colorPalettes","paletteColors","name","colorName","color","colorValue","normalizedColorValue","showTransparentBackground","alpha","isMultiplePaletteObject","obj","Array","isArray","isMultiplePaletteArray","arr","length","every","colorObj","normalizeColorValue","value","~~ref~~","~~current","~~ownerDocument","defaultView","computedBackgroundColor","getComputedStyle","backgroundColor"],"mappings":";;;;;;;;;~~AAIA~~;;AACA;;AACA;;AAKA;;~~AAXA~~;AACA;AACA;;~~AAMA~~;AACA;AACA;AAQA,oBAAQ,CAAEA,cAAF,EAAeC,aAAf,CAAR;;AAEO,MAAMC,gCAAgC,GAAG,UAC/CC,YAD+C,EAI3C;AAAA,MAFJC,MAEI,uEAFoC,EAEpC;AAAA,MADJC,oBACI,uEAD4B,KAC5B;;AACJ,MAAK,CAAEF,YAAP,EAAsB;AACrB,WAAO,EAAP;AACA;;AAED,QAAMG,yBAAyB,GAAG,SAASC,IAAT,CAAeJ,YAAf,CAAlC;AACA,QAAMK,sBAAsB,GAAGF,yBAAyB,GACrDH,YADqD,GAErD,oBAAQA,YAAR,EAAuBM,KAAvB,EAFH,CANI,CAUJ;;AAEA,QAAMC,aAAwC,GAAGL,oBAAoB,GAChED,MADgE,GAElE,CAAE;AAAEA,IAAAA,MAAM,EAAEA;AAAV,GAAF,CAFH;;AAGA,OAAM,MAAM;AAAEA,IAAAA,MAAM,EAAEO;AAAV,GAAZ,IAAyCD,aAAzC,EAAyD;AACxD,SAAM,MAAM;AAAEE,MAAAA,IAAI,EAAEC,SAAR;AAAmBC,MAAAA,KAAK,EAAEC;AAA1B,KAAZ,IAAsDJ,aAAtD,EAAsE;AACrE,YAAMK,oBAAoB,GAAGV,yBAAyB,GACnDS,UADmD,GAEnD,oBAAQA,UAAR,EAAqBN,KAArB,EAFH;;AAIA,UAAKD,sBAAsB,KAAKQ,oBAAhC,EAAuD;AACtD,eAAOH,SAAP;AACA;AACD;AACD,GAzBG,CA2BJ;;;AACA,SAAO,cAAI,QAAJ,CAAP;AACA,CAjCM;;;;AAmCA,MAAMI,yBAAyB,GAAKd,YAAF,IAA6B;AACrE,MAAK,OAAOA,YAAP,KAAwB,WAA7B,EAA2C;AAC1C,WAAO,IAAP;AACA;;AACD,SAAO,oBAAQA,YAAR,EAAuBe,KAAvB,OAAmC,CAA1C;AACA,CALM,C,CAOP;AACA;;;;;AACO,MAAMC,uBAAuB,GACnCC,GADsC,IAGtCC,KAAK,CAACC,OAAN,CAAiBF,GAAF,CAAyBhB,MAAxC,KAAoD,EAAI,WAAWgB,GAAf,CAH9C;;;;AAKA,MAAMG,sBAAsB,GAClCC,GADqC,IAET;AAC5B,SACCA,GAAG,CAACC,MAAJ,GAAa,CAAb,IACAD,GAAG,CAACE,KAAJ,CAAaC,QAAF,IAAgBR,uBAAuB,CAAEQ,QAAF,CAAlD,CAFD;AAIA,CAPM~~;;;;AASA~~,MAAMC,mBAAmB,GAAG,CAClCC,KADkC,EAElCC,~~GAFkC~~,KAG9B;AACJ,QAAMxB,yBAAyB,GAAG,SAASC,IAAT,CAAesB,KAAf,aAAeA,KAAf,cAAeA,KAAf,GAAwB,EAAxB,CAAlC;;AAEA,MAAK,CAAEvB,yBAAF,IAA+B,~~EAAEwB~~,~~GAAF~~,~~aAAEA~~,~~GAAF,eAAEA,GAAG,CAAEC,OAAP,CAApC,EAAqD~~;~~AACpD~~,~~WAAOF~~,KAAP;AACA;;AAED,QAAM;~~AAAEG~~,IAAAA;AAAF,~~MAAoBF~~,~~GAAG,CAACC,OAA9B~~;AACA,QAAM;AAAEE,IAAAA;AAAF,MAAkBD,aAAxB;AACA,QAAME,uBAAuB,~~GAAGD~~,~~WAAH~~,~~aAAGA~~,~~WAAH~~,~~uBAAGA~~,WAAW,CAAEE,gBAAb,~~CAC~~/BL,~~GAAG~~,~~CAACC,OAD2B,EAE9BK,eAFF~~;~~AAIA~~,SAAOF,uBAAuB,GAC3B,oBAAQA,uBAAR,~~EAAkCzB~~,KAAlC,EAD2B,GAE3BoB,KAFH;AAGA,~~CAnBM~~","sourcesContent":["/*\n External dependencies\n /\nimport ~~type~~ { ~~RefObject } from 'react';\nimport {~~ colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n */\nimport type { ColorObject, ColorPaletteProps, PaletteObject } from './types';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nexport const extractColorNameFromCurrentValue = (\n\tcurrentValue?: ColorPaletteProps[ 'value' ],\n\tcolors: ColorPaletteProps[ 'colors' ] = [],\n\tshowMultiplePalettes: boolean = false\n) => {\n\tif ( ! currentValue ) {\n\t\treturn '';\n\t}\n\n\tconst currentValueIsCssVariable = /^var\\(/.test( currentValue );\n\tconst normalizedCurrentValue = currentValueIsCssVariable\n\t\t? currentValue\n\t\t: colord( currentValue ).toHex();\n\n\t// Normalize format of `colors` to simplify the following loop\n\ttype normalizedPaletteObject = { colors: ColorObject[] };\n\tconst colorPalettes: normalizedPaletteObject[] = showMultiplePalettes\n\t\t? ( colors as PaletteObject[] )\n\t\t: [ { colors: colors as ColorObject[] } ];\n\tfor ( const { colors: paletteColors } of colorPalettes ) {\n\t\tfor ( const { name: colorName, color: colorValue } of paletteColors ) {\n\t\t\tconst normalizedColorValue = currentValueIsCssVariable\n\t\t\t\t? colorValue\n\t\t\t\t: colord( colorValue ).toHex();\n\n\t\t\tif ( normalizedCurrentValue === normalizedColorValue ) {\n\t\t\t\treturn colorName;\n\t\t\t}\n\t\t}\n\t}\n\n\t// translators: shown when the user has picked a custom color (i.e not in the palette of colors).\n\treturn __( 'Custom' );\n};\n\nexport const showTransparentBackground = ( currentValue?: string ) => {\n\tif ( typeof currentValue === 'undefined' ) {\n\t\treturn true;\n\t}\n\treturn colord( currentValue ).alpha() === 0;\n};\n\n// The PaletteObject type has a `colors` property (an array of ColorObject),\n// while the ColorObject type has a `color` property (the CSS color value).\nexport const isMultiplePaletteObject = (\n\tobj: PaletteObject \| ColorObject\n): obj is PaletteObject =>\n\tArray.isArray( ( obj as PaletteObject ).colors ) && ! ( 'color' in obj );\n\nexport const isMultiplePaletteArray = (\n\tarr: ( PaletteObject \| ColorObject )[]\n): arr is PaletteObject[] => {\n\treturn (\n\t\tarr.length > 0 &&\n\t\tarr.every( ( colorObj ) => isMultiplePaletteObject( colorObj ) )\n\t);\n};\n\nexport const normalizeColorValue = (\n\tvalue: string \| undefined,\n\~~tref~~: ~~RefObject<~~ HTMLElement > \| null\n) => {\n\tconst currentValueIsCssVariable = /^var\\(/.test( value ?? '' );\n\n\tif ( ! currentValueIsCssVariable \|\| ! ~~ref?.current~~ ) {\n\t\treturn value;\n\t}\n\n\tconst { ownerDocument } = ~~ref.current~~;\n\tconst { defaultView } = ownerDocument;\n\tconst computedBackgroundColor ~~= defaultView?.getComputedStyle(\~~n\t\~~tref.current\n\t~~).backgroundColor;\n\n\treturn computedBackgroundColor\n\t\t? colord( computedBackgroundColor ).toHex()\n\t\t: value;\n};\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/color-palette/utils.ts"],"names":["namesPlugin","a11yPlugin","extractColorNameFromCurrentValue","currentValue","colors","showMultiplePalettes","currentValueIsCssVariable","test","normalizedCurrentValue","toHex","colorPalettes","paletteColors","name","colorName","color","colorValue","normalizedColorValue","showTransparentBackground","alpha","isMultiplePaletteObject","obj","Array","isArray","isMultiplePaletteArray","arr","length","every","colorObj","normalizeColorValue","value","element","ownerDocument","defaultView","computedBackgroundColor","getComputedStyle","backgroundColor"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AAKA;;AAVA;AACA;AACA;;AAKA;AACA;AACA;AAQA,oBAAQ,CAAEA,cAAF,EAAeC,aAAf,CAAR;;AAEO,MAAMC,gCAAgC,GAAG,UAC/CC,YAD+C,EAI3C;AAAA,MAFJC,MAEI,uEAFoC,EAEpC;AAAA,MADJC,oBACI,uEAD4B,KAC5B;;AACJ,MAAK,CAAEF,YAAP,EAAsB;AACrB,WAAO,EAAP;AACA;;AAED,QAAMG,yBAAyB,GAAG,SAASC,IAAT,CAAeJ,YAAf,CAAlC;AACA,QAAMK,sBAAsB,GAAGF,yBAAyB,GACrDH,YADqD,GAErD,oBAAQA,YAAR,EAAuBM,KAAvB,EAFH,CANI,CAUJ;;AAEA,QAAMC,aAAwC,GAAGL,oBAAoB,GAChED,MADgE,GAElE,CAAE;AAAEA,IAAAA,MAAM,EAAEA;AAAV,GAAF,CAFH;;AAGA,OAAM,MAAM;AAAEA,IAAAA,MAAM,EAAEO;AAAV,GAAZ,IAAyCD,aAAzC,EAAyD;AACxD,SAAM,MAAM;AAAEE,MAAAA,IAAI,EAAEC,SAAR;AAAmBC,MAAAA,KAAK,EAAEC;AAA1B,KAAZ,IAAsDJ,aAAtD,EAAsE;AACrE,YAAMK,oBAAoB,GAAGV,yBAAyB,GACnDS,UADmD,GAEnD,oBAAQA,UAAR,EAAqBN,KAArB,EAFH;;AAIA,UAAKD,sBAAsB,KAAKQ,oBAAhC,EAAuD;AACtD,eAAOH,SAAP;AACA;AACD;AACD,GAzBG,CA2BJ;;;AACA,SAAO,cAAI,QAAJ,CAAP;AACA,CAjCM;;;;AAmCA,MAAMI,yBAAyB,GAAKd,YAAF,IAA6B;AACrE,MAAK,OAAOA,YAAP,KAAwB,WAA7B,EAA2C;AAC1C,WAAO,IAAP;AACA;;AACD,SAAO,oBAAQA,YAAR,EAAuBe,KAAvB,OAAmC,CAA1C;AACA,CALM,C,CAOP;AACA;;;;;AACO,MAAMC,uBAAuB,GACnCC,GADsC,IAGtCC,KAAK,CAACC,OAAN,CAAiBF,GAAF,CAAyBhB,MAAxC,KAAoD,EAAI,WAAWgB,GAAf,CAH9C;;;;AAKA,MAAMG,sBAAsB,GAClCC,GADqC,IAET;AAC5B,SACCA,GAAG,CAACC,MAAJ,GAAa,CAAb,IACAD,GAAG,CAACE,KAAJ,CAAaC,QAAF,IAAgBR,uBAAuB,CAAEQ,QAAF,CAAlD,CAFD;AAIA,CAPM;AASP;AACA;AACA;AACA;AACA;AACA;AACA;;;;;AACO,MAAMC,mBAAmB,GAAG,CAClCC,KADkC,EAElCC,OAFkC,KAG9B;AACJ,QAAMxB,yBAAyB,GAAG,SAASC,IAAT,CAAesB,KAAf,aAAeA,KAAf,cAAeA,KAAf,GAAwB,EAAxB,CAAlC;;AAEA,MAAK,CAAEvB,yBAAF,IAA+BwB,OAAO,KAAK,IAAhD,EAAuD;AACtD,WAAOD,KAAP;AACA;;AAED,QAAM;AAAEE,IAAAA;AAAF,MAAoBD,OAA1B;AACA,QAAM;AAAEE,IAAAA;AAAF,MAAkBD,aAAxB;AACA,QAAME,uBAAuB,GAC5BD,WAD4B,aAC5BA,WAD4B,uBAC5BA,WAAW,CAAEE,gBAAb,CAA+BJ,OAA/B,EAAyCK,eAD1C;AAGA,SAAOF,uBAAuB,GAC3B,oBAAQA,uBAAR,EAAkCxB,KAAlC,EAD2B,GAE3BoB,KAFH;AAGA,CAlBM","sourcesContent":["/*\n External dependencies\n /\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport type { ColorObject, ColorPaletteProps, PaletteObject } from './types';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nexport const extractColorNameFromCurrentValue = (\n\tcurrentValue?: ColorPaletteProps[ 'value' ],\n\tcolors: ColorPaletteProps[ 'colors' ] = [],\n\tshowMultiplePalettes: boolean = false\n) => {\n\tif ( ! currentValue ) {\n\t\treturn '';\n\t}\n\n\tconst currentValueIsCssVariable = /^var\\(/.test( currentValue );\n\tconst normalizedCurrentValue = currentValueIsCssVariable\n\t\t? currentValue\n\t\t: colord( currentValue ).toHex();\n\n\t// Normalize format of `colors` to simplify the following loop\n\ttype normalizedPaletteObject = { colors: ColorObject[] };\n\tconst colorPalettes: normalizedPaletteObject[] = showMultiplePalettes\n\t\t? ( colors as PaletteObject[] )\n\t\t: [ { colors: colors as ColorObject[] } ];\n\tfor ( const { colors: paletteColors } of colorPalettes ) {\n\t\tfor ( const { name: colorName, color: colorValue } of paletteColors ) {\n\t\t\tconst normalizedColorValue = currentValueIsCssVariable\n\t\t\t\t? colorValue\n\t\t\t\t: colord( colorValue ).toHex();\n\n\t\t\tif ( normalizedCurrentValue === normalizedColorValue ) {\n\t\t\t\treturn colorName;\n\t\t\t}\n\t\t}\n\t}\n\n\t// translators: shown when the user has picked a custom color (i.e not in the palette of colors).\n\treturn __( 'Custom' );\n};\n\nexport const showTransparentBackground = ( currentValue?: string ) => {\n\tif ( typeof currentValue === 'undefined' ) {\n\t\treturn true;\n\t}\n\treturn colord( currentValue ).alpha() === 0;\n};\n\n// The PaletteObject type has a `colors` property (an array of ColorObject),\n// while the ColorObject type has a `color` property (the CSS color value).\nexport const isMultiplePaletteObject = (\n\tobj: PaletteObject \| ColorObject\n): obj is PaletteObject =>\n\tArray.isArray( ( obj as PaletteObject ).colors ) && ! ( 'color' in obj );\n\nexport const isMultiplePaletteArray = (\n\tarr: ( PaletteObject \| ColorObject )[]\n): arr is PaletteObject[] => {\n\treturn (\n\t\tarr.length > 0 &&\n\t\tarr.every( ( colorObj ) => isMultiplePaletteObject( colorObj ) )\n\t);\n};\n\n/\n Transform a CSS variable used as background color into the color value itself.\n \n @param value The color value that may be a CSS variable.\n * @param element The element for which to get the computed style.\n * @return The background color value computed from a element.\n */\nexport const normalizeColorValue = (\n\tvalue: string \| undefined,\n\telement: HTMLElement \| null\n) => {\n\tconst currentValueIsCssVariable = /^var\\(/.test( value ?? '' );\n\n\tif ( ! currentValueIsCssVariable \|\| element === null ) {\n\t\treturn value;\n\t}\n\n\tconst { ownerDocument } = element;\n\tconst { defaultView } = ownerDocument;\n\tconst computedBackgroundColor =\n\t\tdefaultView?.getComputedStyle( element ).backgroundColor;\n\n\treturn computedBackgroundColor\n\t\t? colord( computedBackgroundColor ).toHex()\n\t\t: value;\n};\n"]}

package/build/custom-select-control/index.js CHANGED Viewed

@@ -5,6 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.StableCustomSelectControl = StableCustomSelectControl;
 exports.default = CustomSelectControl;
 var _element = require("@wordpress/element");
@@ -225,4 +226,10 @@ function CustomSelectControl(props) {
     className: "components-custom-select-control__item-icon"
   })))));
 }
+function StableCustomSelectControl(props) {
+  return (0, _element.createElement)(CustomSelectControl, (0, _extends2.default)({}, props, {
+    __experimentalShowSelectedHint: false
+  }));
+}
 //# sourceMappingURL=index.js.map

package/build/custom-select-control/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/custom-select-control/index.js"],"names":["itemToString","item","name","stateReducer","selectedItem","type","changes","props","items","useSelect","stateChangeTypes","ToggleButtonKeyDownArrowDown","Math","min","indexOf","length","ToggleButtonKeyDownArrowUp","max","CustomSelectControl","__next36pxDefaultSize","__nextUnconstrainedWidth","className","hideLabelFromVision","label","describedBy","options","onChange","onSelectedItemChange","size","value","_selectedItem","onMouseOver","onMouseOut","onFocus","onBlur","__experimentalShowSelectedHint","getLabelProps","getToggleButtonProps","getMenuProps","getItemProps","isOpen","highlightedIndex","initialSelectedItem","undefined","isFocused","setIsFocused","handleOnFocus","e","handleOnBlur","since","version","hint","getDescribedBy","menuProps","onKeyDownHandler","stopPropagation","onKeyDown","startsWith","__experimentalHint","map","index","key","style","check"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/*\n External dependencies\n /\nimport { useSelect } from 'downshift';\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Icon, check } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useState } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\n\n/\n Internal dependencies\n /\nimport { VisuallyHidden } from '../visually-hidden';\nimport { Select as SelectControlSelect } from '../select-control/styles/select-control-styles';\nimport SelectControlChevronDown from '../select-control/chevron-down';\nimport { InputBaseWithBackCompatMinWidth } from './styles';\nimport { StyledLabel } from '../base-control/styles/base-control-styles';\n\nconst itemToString = ( item ) => item?.name;\n// This is needed so that in Windows, where\n// the menu does not necessarily open on\n// key up/down, you can still switch between\n// options with the menu closed.\nconst stateReducer = (\n\t{ selectedItem },\n\t{ type, changes, props: { items } }\n) => {\n\tswitch ( type ) {\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowDown:\n\t\t\t// If we already have a selected item, try to select the next one,\n\t\t\t// without circular navigation. Otherwise, select the first item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.min(\n\t\t\t\t\t\t\t\t\titems.indexOf( selectedItem ) + 1,\n\t\t\t\t\t\t\t\t\titems.length - 1\n\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t: 0\n\t\t\t\t\t],\n\t\t\t};\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowUp:\n\t\t\t// If we already have a selected item, try to select the previous one,\n\t\t\t// without circular navigation. Otherwise, select the last item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.max( items.indexOf( selectedItem ) - 1, 0 )\n\t\t\t\t\t\t\t: items.length - 1\n\t\t\t\t\t],\n\t\t\t};\n\t\tdefault:\n\t\t\treturn changes;\n\t}\n};\n\nexport default function CustomSelectControl( props ) {\n\tconst {\n\t\t/* Start opting into the larger default height that will become the default size in a future version. /\n\t\t__next36pxDefaultSize = false,\n\t\t/* Start opting into the unconstrained width that will become the default in a future version. /\n\t\t__nextUnconstrainedWidth = false,\n\t\tclassName,\n\t\thideLabelFromVision,\n\t\tlabel,\n\t\tdescribedBy,\n\t\toptions: items,\n\t\tonChange: onSelectedItemChange,\n\t\t/* @type {import('../select-control/types').SelectControlProps.size} /\n\t\tsize = 'default',\n\t\tvalue: _selectedItem,\n\t\tonMouseOver,\n\t\tonMouseOut,\n\t\tonFocus,\n\t\tonBlur,\n\t\t__experimentalShowSelectedHint = false,\n\t} = props;\n\n\tconst {\n\t\tgetLabelProps,\n\t\tgetToggleButtonProps,\n\t\tgetMenuProps,\n\t\tgetItemProps,\n\t\tisOpen,\n\t\thighlightedIndex,\n\t\tselectedItem,\n\t} = useSelect( {\n\t\tinitialSelectedItem: items[ 0 ],\n\t\titems,\n\t\titemToString,\n\t\tonSelectedItemChange,\n\t\t...( typeof _selectedItem !== 'undefined' && _selectedItem !== null\n\t\t\t? { selectedItem: _selectedItem }\n\t\t\t: undefined ),\n\t\tstateReducer,\n\t} );\n\n\tconst [ isFocused, setIsFocused ] = useState( false );\n\n\tfunction handleOnFocus( e ) {\n\t\tsetIsFocused( true );\n\t\tonFocus?.( e );\n\t}\n\n\tfunction handleOnBlur( e ) {\n\t\tsetIsFocused( false );\n\t\tonBlur?.( e );\n\t}\n\n\tif ( ! __nextUnconstrainedWidth ) {\n\t\tdeprecated(\n\t\t\t'Constrained width styles for wp.components.CustomSelectControl',\n\t\t\t{\n\t\t\t\tsince: '6.1',\n\t\t\t\tversion: '6.4',\n\t\t\t\thint: 'Set the `__nextUnconstrainedWidth` prop to true to start opting into the new styles, which will become the default in a future version',\n\t\t\t}\n\t\t);\n\t}\n\n\tfunction getDescribedBy() {\n\t\tif ( describedBy ) {\n\t\t\treturn describedBy;\n\t\t}\n\n\t\tif ( ! selectedItem ) {\n\t\t\treturn __( 'No selection' );\n\t\t}\n\n\t\t// translators: %s: The selected option.\n\t\treturn sprintf( __( 'Currently selected: %s' ), selectedItem.name );\n\t}\n\n\tconst menuProps = getMenuProps( {\n\t\tclassName: 'components-custom-select-control__menu',\n\t\t'aria-hidden': ! isOpen,\n\t} );\n\n\tconst onKeyDownHandler = useCallback(\n\t\t( e ) => {\n\t\t\te.stopPropagation();\n\t\t\tmenuProps?.onKeyDown?.( e );\n\t\t},\n\t\t[ menuProps ]\n\t);\n\n\t// We need this here, because the null active descendant is not fully ARIA compliant.\n\tif (\n\t\tmenuProps[ 'aria-activedescendant' ]?.startsWith( 'downshift-null' )\n\t) {\n\t\tdelete menuProps[ 'aria-activedescendant' ];\n\t}\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-custom-select-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t{ hideLabelFromVision ? (\n\t\t\t\t<VisuallyHidden as=\"label\" { ...getLabelProps() }>\n\t\t\t\t\t{ label }\n\t\t\t\t</VisuallyHidden>\n\t\t\t) : (\n\t\t\t\t/ eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for /\n\t\t\t\t<StyledLabel\n\t\t\t\t\t{ ...getLabelProps( {\n\t\t\t\t\t\tclassName: 'components-custom-select-control__label',\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</StyledLabel>\n\t\t\t) }\n\t\t\t<InputBaseWithBackCompatMinWidth\n\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t__nextUnconstrainedWidth={ __nextUnconstrainedWidth }\n\t\t\t\tisFocused={ isOpen \|\| isFocused }\n\t\t\t\t__unstableInputWidth={\n\t\t\t\t\t__nextUnconstrainedWidth ? undefined : 'auto'\n\t\t\t\t}\n\t\t\t\tlabelPosition={ __nextUnconstrainedWidth ? undefined : 'top' }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ <SelectControlChevronDown /> }\n\t\t\t>\n\t\t\t\t<SelectControlSelect\n\t\t\t\t\tonMouseOver={ onMouseOver }\n\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\tas=\"button\"\n\t\t\t\t\tonFocus={ handleOnFocus }\n\t\t\t\t\tonBlur={ handleOnBlur }\n\t\t\t\t\tselectSize={ size }\n\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t{ ...getToggleButtonProps( {\n\t\t\t\t\t\t// This is needed because some speech recognition software don't support `aria-labelledby`.\n\t\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t\t'aria-labelledby': undefined,\n\t\t\t\t\t\tclassName: 'components-custom-select-control__button',\n\t\t\t\t\t\tdescribedBy: getDescribedBy(),\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ itemToString( selectedItem ) }\n\t\t\t\t\t{ __experimentalShowSelectedHint &&\n\t\t\t\t\t\tselectedItem.__experimentalHint && (\n\t\t\t\t\t\t\t<span className=\"components-custom-select-control__hint\">\n\t\t\t\t\t\t\t\t{ selectedItem.__experimentalHint }\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t) }\n\t\t\t\t</SelectControlSelect>\n\t\t\t</InputBaseWithBackCompatMinWidth>\n\t\t\t{ / eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t<ul { ...menuProps } onKeyDown={ onKeyDownHandler }>\n\t\t\t\t{ isOpen &&\n\t\t\t\t\titems.map( ( item, index ) => (\n\t\t\t\t\t\t// eslint-disable-next-line react/jsx-key\n\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t{ ...getItemProps( {\n\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\tkey: item.key,\n\t\t\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t\t\titem.className,\n\t\t\t\t\t\t\t\t\t'components-custom-select-control__item',\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t'is-highlighted':\n\t\t\t\t\t\t\t\t\t\t\tindex === highlightedIndex,\n\t\t\t\t\t\t\t\t\t\t'has-hint': !! item.__experimentalHint,\n\t\t\t\t\t\t\t\t\t\t'is-next-36px-default-size':\n\t\t\t\t\t\t\t\t\t\t\t__next36pxDefaultSize,\n\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\tstyle: item.style,\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ item.name }\n\t\t\t\t\t\t\t{ item.__experimentalHint && (\n\t\t\t\t\t\t\t\t<span className=\"components-custom-select-control__item-hint\">\n\t\t\t\t\t\t\t\t\t{ item.__experimentalHint }\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t{ item === selectedItem && (\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\tclassName=\"components-custom-select-control__item-icon\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</li>\n\t\t\t\t\t) ) }\n\t\t\t</ul>\n\t\t</div>\n\t);\n}\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/custom-select-control/index.js"],"names":["itemToString","item","name","stateReducer","selectedItem","type","changes","props","items","useSelect","stateChangeTypes","ToggleButtonKeyDownArrowDown","Math","min","indexOf","length","ToggleButtonKeyDownArrowUp","max","CustomSelectControl","__next36pxDefaultSize","__nextUnconstrainedWidth","className","hideLabelFromVision","label","describedBy","options","onChange","onSelectedItemChange","size","value","_selectedItem","onMouseOver","onMouseOut","onFocus","onBlur","__experimentalShowSelectedHint","getLabelProps","getToggleButtonProps","getMenuProps","getItemProps","isOpen","highlightedIndex","initialSelectedItem","undefined","isFocused","setIsFocused","handleOnFocus","e","handleOnBlur","since","version","hint","getDescribedBy","menuProps","onKeyDownHandler","stopPropagation","onKeyDown","startsWith","__experimentalHint","map","index","key","style","check","StableCustomSelectControl"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/*\n External dependencies\n /\nimport { useSelect } from 'downshift';\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Icon, check } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useState } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\n\n/\n Internal dependencies\n /\nimport { VisuallyHidden } from '../visually-hidden';\nimport { Select as SelectControlSelect } from '../select-control/styles/select-control-styles';\nimport SelectControlChevronDown from '../select-control/chevron-down';\nimport { InputBaseWithBackCompatMinWidth } from './styles';\nimport { StyledLabel } from '../base-control/styles/base-control-styles';\n\nconst itemToString = ( item ) => item?.name;\n// This is needed so that in Windows, where\n// the menu does not necessarily open on\n// key up/down, you can still switch between\n// options with the menu closed.\nconst stateReducer = (\n\t{ selectedItem },\n\t{ type, changes, props: { items } }\n) => {\n\tswitch ( type ) {\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowDown:\n\t\t\t// If we already have a selected item, try to select the next one,\n\t\t\t// without circular navigation. Otherwise, select the first item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.min(\n\t\t\t\t\t\t\t\t\titems.indexOf( selectedItem ) + 1,\n\t\t\t\t\t\t\t\t\titems.length - 1\n\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t: 0\n\t\t\t\t\t],\n\t\t\t};\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowUp:\n\t\t\t// If we already have a selected item, try to select the previous one,\n\t\t\t// without circular navigation. Otherwise, select the last item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.max( items.indexOf( selectedItem ) - 1, 0 )\n\t\t\t\t\t\t\t: items.length - 1\n\t\t\t\t\t],\n\t\t\t};\n\t\tdefault:\n\t\t\treturn changes;\n\t}\n};\n\nexport default function CustomSelectControl( props ) {\n\tconst {\n\t\t/* Start opting into the larger default height that will become the default size in a future version. /\n\t\t__next36pxDefaultSize = false,\n\t\t/* Start opting into the unconstrained width that will become the default in a future version. /\n\t\t__nextUnconstrainedWidth = false,\n\t\tclassName,\n\t\thideLabelFromVision,\n\t\tlabel,\n\t\tdescribedBy,\n\t\toptions: items,\n\t\tonChange: onSelectedItemChange,\n\t\t/* @type {import('../select-control/types').SelectControlProps.size} /\n\t\tsize = 'default',\n\t\tvalue: _selectedItem,\n\t\tonMouseOver,\n\t\tonMouseOut,\n\t\tonFocus,\n\t\tonBlur,\n\t\t__experimentalShowSelectedHint = false,\n\t} = props;\n\n\tconst {\n\t\tgetLabelProps,\n\t\tgetToggleButtonProps,\n\t\tgetMenuProps,\n\t\tgetItemProps,\n\t\tisOpen,\n\t\thighlightedIndex,\n\t\tselectedItem,\n\t} = useSelect( {\n\t\tinitialSelectedItem: items[ 0 ],\n\t\titems,\n\t\titemToString,\n\t\tonSelectedItemChange,\n\t\t...( typeof _selectedItem !== 'undefined' && _selectedItem !== null\n\t\t\t? { selectedItem: _selectedItem }\n\t\t\t: undefined ),\n\t\tstateReducer,\n\t} );\n\n\tconst [ isFocused, setIsFocused ] = useState( false );\n\n\tfunction handleOnFocus( e ) {\n\t\tsetIsFocused( true );\n\t\tonFocus?.( e );\n\t}\n\n\tfunction handleOnBlur( e ) {\n\t\tsetIsFocused( false );\n\t\tonBlur?.( e );\n\t}\n\n\tif ( ! __nextUnconstrainedWidth ) {\n\t\tdeprecated(\n\t\t\t'Constrained width styles for wp.components.CustomSelectControl',\n\t\t\t{\n\t\t\t\tsince: '6.1',\n\t\t\t\tversion: '6.4',\n\t\t\t\thint: 'Set the `__nextUnconstrainedWidth` prop to true to start opting into the new styles, which will become the default in a future version',\n\t\t\t}\n\t\t);\n\t}\n\n\tfunction getDescribedBy() {\n\t\tif ( describedBy ) {\n\t\t\treturn describedBy;\n\t\t}\n\n\t\tif ( ! selectedItem ) {\n\t\t\treturn __( 'No selection' );\n\t\t}\n\n\t\t// translators: %s: The selected option.\n\t\treturn sprintf( __( 'Currently selected: %s' ), selectedItem.name );\n\t}\n\n\tconst menuProps = getMenuProps( {\n\t\tclassName: 'components-custom-select-control__menu',\n\t\t'aria-hidden': ! isOpen,\n\t} );\n\n\tconst onKeyDownHandler = useCallback(\n\t\t( e ) => {\n\t\t\te.stopPropagation();\n\t\t\tmenuProps?.onKeyDown?.( e );\n\t\t},\n\t\t[ menuProps ]\n\t);\n\n\t// We need this here, because the null active descendant is not fully ARIA compliant.\n\tif (\n\t\tmenuProps[ 'aria-activedescendant' ]?.startsWith( 'downshift-null' )\n\t) {\n\t\tdelete menuProps[ 'aria-activedescendant' ];\n\t}\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-custom-select-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t{ hideLabelFromVision ? (\n\t\t\t\t<VisuallyHidden as=\"label\" { ...getLabelProps() }>\n\t\t\t\t\t{ label }\n\t\t\t\t</VisuallyHidden>\n\t\t\t) : (\n\t\t\t\t/ eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for /\n\t\t\t\t<StyledLabel\n\t\t\t\t\t{ ...getLabelProps( {\n\t\t\t\t\t\tclassName: 'components-custom-select-control__label',\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</StyledLabel>\n\t\t\t) }\n\t\t\t<InputBaseWithBackCompatMinWidth\n\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t__nextUnconstrainedWidth={ __nextUnconstrainedWidth }\n\t\t\t\tisFocused={ isOpen \|\| isFocused }\n\t\t\t\t__unstableInputWidth={\n\t\t\t\t\t__nextUnconstrainedWidth ? undefined : 'auto'\n\t\t\t\t}\n\t\t\t\tlabelPosition={ __nextUnconstrainedWidth ? undefined : 'top' }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ <SelectControlChevronDown /> }\n\t\t\t>\n\t\t\t\t<SelectControlSelect\n\t\t\t\t\tonMouseOver={ onMouseOver }\n\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\tas=\"button\"\n\t\t\t\t\tonFocus={ handleOnFocus }\n\t\t\t\t\tonBlur={ handleOnBlur }\n\t\t\t\t\tselectSize={ size }\n\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t{ ...getToggleButtonProps( {\n\t\t\t\t\t\t// This is needed because some speech recognition software don't support `aria-labelledby`.\n\t\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t\t'aria-labelledby': undefined,\n\t\t\t\t\t\tclassName: 'components-custom-select-control__button',\n\t\t\t\t\t\tdescribedBy: getDescribedBy(),\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ itemToString( selectedItem ) }\n\t\t\t\t\t{ __experimentalShowSelectedHint &&\n\t\t\t\t\t\tselectedItem.__experimentalHint && (\n\t\t\t\t\t\t\t<span className=\"components-custom-select-control__hint\">\n\t\t\t\t\t\t\t\t{ selectedItem.__experimentalHint }\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t) }\n\t\t\t\t</SelectControlSelect>\n\t\t\t</InputBaseWithBackCompatMinWidth>\n\t\t\t{ / eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t<ul { ...menuProps } onKeyDown={ onKeyDownHandler }>\n\t\t\t\t{ isOpen &&\n\t\t\t\t\titems.map( ( item, index ) => (\n\t\t\t\t\t\t// eslint-disable-next-line react/jsx-key\n\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t{ ...getItemProps( {\n\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\tkey: item.key,\n\t\t\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t\t\titem.className,\n\t\t\t\t\t\t\t\t\t'components-custom-select-control__item',\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t'is-highlighted':\n\t\t\t\t\t\t\t\t\t\t\tindex === highlightedIndex,\n\t\t\t\t\t\t\t\t\t\t'has-hint': !! item.__experimentalHint,\n\t\t\t\t\t\t\t\t\t\t'is-next-36px-default-size':\n\t\t\t\t\t\t\t\t\t\t\t__next36pxDefaultSize,\n\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\tstyle: item.style,\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ item.name }\n\t\t\t\t\t\t\t{ item.__experimentalHint && (\n\t\t\t\t\t\t\t\t<span className=\"components-custom-select-control__item-hint\">\n\t\t\t\t\t\t\t\t\t{ item.__experimentalHint }\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t{ item === selectedItem && (\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\tclassName=\"components-custom-select-control__item-icon\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</li>\n\t\t\t\t\t) ) }\n\t\t\t</ul>\n\t\t</div>\n\t);\n}\n\nexport function StableCustomSelectControl( props ) {\n\treturn (\n\t\t<CustomSelectControl\n\t\t\t{ ...props }\n\t\t\t__experimentalShowSelectedHint={ false }\n\t\t/>\n\t);\n}\n"]}

package/build/index.js CHANGED Viewed

@@ -134,7 +134,7 @@ Object.defineProperty(exports, "CustomGradientPicker", {
 Object.defineProperty(exports, "CustomSelectControl", {
   enumerable: true,
   get: function () {
-    return _customSelectControl.default;
+    return _customSelectControl.StableCustomSelectControl;
   }
 });
 Object.defineProperty(exports, "Dashicon", {
@@ -797,6 +797,12 @@ Object.defineProperty(exports, "__experimentalNavigatorScreen", {
     return _navigator.NavigatorScreen;
   }
 });
+Object.defineProperty(exports, "__experimentalNavigatorToParentButton", {
+  enumerable: true,
+  get: function () {
+    return _navigator.NavigatorToParentButton;
+  }
+});
 Object.defineProperty(exports, "__experimentalNumberControl", {
   enumerable: true,
   get: function () {
@@ -815,12 +821,6 @@ Object.defineProperty(exports, "__experimentalParseQuantityAndUnitFromRawValue",
     return _unitControl.parseQuantityAndUnitFromRawValue;
   }
 });
-Object.defineProperty(exports, "__experimentalPopoverPositionToPlacement", {
-  enumerable: true,
-  get: function () {
-    return _utils.positionToPlacement;
-  }
-});
 Object.defineProperty(exports, "__experimentalRadio", {
   enumerable: true,
   get: function () {
@@ -1055,6 +1055,12 @@ Object.defineProperty(exports, "navigateRegions", {
     return _navigateRegions.default;
   }
 });
+Object.defineProperty(exports, "privateApis", {
+  enumerable: true,
+  get: function () {
+    return _privateApis.privateApis;
+  }
+});
 Object.defineProperty(exports, "useBaseControlProps", {
   enumerable: true,
   get: function () {
@@ -1148,7 +1154,7 @@ var _composite = require("./composite");
 var _confirmDialog = require("./confirm-dialog");
-var _customSelectControl = _interopRequireDefault(require("./custom-select-control"));
+var _customSelectControl = require("./custom-select-control");
 var _dashicon = _interopRequireDefault(require("./dashicon"));
@@ -1264,8 +1270,6 @@ var _placeholder = _interopRequireDefault(require("./placeholder"));
 var _popover = _interopRequireDefault(require("./popover"));
-var _utils = require("./popover/utils");
 var _queryControls = _interopRequireDefault(require("./query-controls"));
 var _radio = _interopRequireDefault(require("./radio-group/radio"));
@@ -1358,6 +1362,8 @@ var _withNotices = _interopRequireDefault(require("./higher-order/with-notices")
 var _withSpokenMessages = _interopRequireDefault(require("./higher-order/with-spoken-messages"));
+var _privateApis = require("./private-apis");
 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; }

package/build/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;AAaA;;AACA;;AAIA;;AACA;;AACA;;AAIA;;AACA;;AAMA;;AACA;;AAIA;;AACA;;AACA;;AAQA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAMA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAIA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAOA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AAQA;;AAKA;;AACA;;AAMA;;AACA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAQA;;AACA;;AAGA;;AAIA;;AACA;;AACA;;AACA;;AACA;;AAIA;;AACA","sourcesContent":["// Primitives.\nexport {\n\tSVG,\n\tPath,\n\tCircle,\n\tPolygon,\n\tRect,\n\tG,\n\tLine,\n\tHorizontalRule,\n\tBlockQuotation,\n} from '@wordpress/primitives';\n\n// Components.\nexport { default as __experimentalAlignmentMatrixControl } from './alignment-matrix-control';\nexport {\n\tdefault as Animate,\n\tgetAnimateClassName as __unstableGetAnimateClassName,\n} from './animate';\nexport { __unstableMotion, __unstableAnimatePresence } from './animation';\nexport { default as AnglePickerControl } from './angle-picker-control';\nexport {\n\tdefault as Autocomplete,\n\tuseAutocompleteProps as __unstableUseAutocompleteProps,\n} from './autocomplete';\nexport { default as BaseControl, useBaseControlProps } from './base-control';\nexport {\n\tBorderBoxControl as __experimentalBorderBoxControl,\n\thasSplitBorders as __experimentalHasSplitBorders,\n\tisDefinedBorder as __experimentalIsDefinedBorder,\n\tisEmptyBorder as __experimentalIsEmptyBorder,\n} from './border-box-control';\nexport { BorderControl as __experimentalBorderControl } from './border-control';\nexport {\n\tdefault as __experimentalBoxControl,\n\tapplyValueToSides as __experimentalApplyValueToSides,\n} from './box-control';\nexport { default as Button } from './button';\nexport { default as ButtonGroup } from './button-group';\nexport {\n\tCard,\n\tCardBody,\n\tCardDivider,\n\tCardFooter,\n\tCardHeader,\n\tCardMedia,\n} from './card';\nexport { default as CheckboxControl } from './checkbox-control';\nexport { default as ClipboardButton } from './clipboard-button';\nexport { default as __experimentalPaletteEdit } from './palette-edit';\nexport { default as ColorIndicator } from './color-indicator';\nexport { default as ColorPalette } from './color-palette';\nexport { ColorPicker } from './color-picker';\nexport { default as ComboboxControl } from './combobox-control';\nexport {\n\tComposite as __unstableComposite,\n\tCompositeGroup as __unstableCompositeGroup,\n\tCompositeItem as __unstableCompositeItem,\n\tuseCompositeState as __unstableUseCompositeState,\n} from './composite';\nexport { ConfirmDialog as __experimentalConfirmDialog } from './confirm-dialog';\nexport { default as CustomSelectControl } from './custom-select-control';\nexport { default as Dashicon } from './dashicon';\nexport { default as DateTimePicker, DatePicker, TimePicker } from './date-time';\nexport { default as __experimentalDimensionControl } from './dimension-control';\nexport { default as Disabled } from './disabled';\nexport { DisclosureContent as __unstableDisclosureContent } from './disclosure';\nexport { Divider as __experimentalDivider } from './divider';\nexport { default as Draggable } from './draggable';\nexport { default as DropZone } from './drop-zone';\nexport { default as DropZoneProvider } from './drop-zone/provider';\nexport { default as Dropdown } from './dropdown';\nexport { default as __experimentalDropdownContentWrapper } from './dropdown/dropdown-content-wrapper';\nexport { default as DropdownMenu } from './dropdown-menu';\nexport { DuotoneSwatch, DuotonePicker } from './duotone-picker';\nexport { Elevation as __experimentalElevation } from './elevation';\nexport { default as ExternalLink } from './external-link';\nexport { Flex, FlexBlock, FlexItem } from './flex';\nexport { default as FocalPointPicker } from './focal-point-picker';\nexport { default as FocusableIframe } from './focusable-iframe';\nexport { default as FontSizePicker } from './font-size-picker';\nexport { default as FormFileUpload } from './form-file-upload';\nexport { default as FormToggle } from './form-toggle';\nexport { default as FormTokenField } from './form-token-field';\nexport { default as GradientPicker } from './gradient-picker';\nexport { default as CustomGradientPicker } from './custom-gradient-picker';\nexport { Grid as __experimentalGrid } from './grid';\nexport { default as Guide } from './guide';\nexport { default as GuidePage } from './guide/page';\nexport { Heading as __experimentalHeading } from './heading';\nexport { HStack as __experimentalHStack } from './h-stack';\nexport { default as Icon } from './icon';\nexport { default as IconButton } from './button/deprecated';\nexport {\n\tItemGroup as __experimentalItemGroup,\n\tItem as __experimentalItem,\n} from './item-group';\nexport { default as __experimentalInputControl } from './input-control';\nexport { default as __experimentalInputControlPrefixWrapper } from './input-control/input-prefix-wrapper';\nexport { default as __experimentalInputControlSuffixWrapper } from './input-control/input-suffix-wrapper';\nexport { default as KeyboardShortcuts } from './keyboard-shortcuts';\nexport { default as MenuGroup } from './menu-group';\nexport { default as MenuItem } from './menu-item';\nexport { default as MenuItemsChoice } from './menu-items-choice';\nexport { default as Modal } from './modal';\nexport { default as ScrollLock } from './scroll-lock';\nexport { NavigableMenu, TabbableContainer } from './navigable-container';\nexport { default as __experimentalNavigation } from './navigation';\nexport { default as __experimentalNavigationBackButton } from './navigation/back-button';\nexport { default as __experimentalNavigationGroup } from './navigation/group';\nexport { default as __experimentalNavigationItem } from './navigation/item';\nexport { default as __experimentalNavigationMenu } from './navigation/menu';\nexport {\n\tNavigatorProvider as __experimentalNavigatorProvider,\n\tNavigatorScreen as __experimentalNavigatorScreen,\n\tNavigatorButton as __experimentalNavigatorButton,\n\tNavigatorBackButton as __experimentalNavigatorBackButton,\n\tuseNavigator as __experimentalUseNavigator,\n} from './navigator';\nexport { default as Notice } from './notice';\nexport { default as __experimentalNumberControl } from './number-control';\nexport { default as NoticeList } from './notice/list';\nexport { default as Panel } from './panel';\nexport { default as PanelBody } from './panel/body';\nexport { default as PanelHeader } from './panel/header';\nexport { default as PanelRow } from './panel/row';\nexport { default as Placeholder } from './placeholder';\nexport { default as Popover } from './popover';\nexport { positionToPlacement as __experimentalPopoverPositionToPlacement } from './popover/utils';\nexport { default as QueryControls } from './query-controls';\nexport { default as __experimentalRadio } from './radio-group/radio';\nexport { default as __experimentalRadioGroup } from './radio-group';\nexport { default as RadioControl } from './radio-control';\nexport { default as RangeControl } from './range-control';\nexport { default as ResizableBox } from './resizable-box';\nexport { default as ResponsiveWrapper } from './responsive-wrapper';\nexport { default as SandBox } from './sandbox';\nexport { default as SearchControl } from './search-control';\nexport { default as SelectControl } from './select-control';\nexport { default as Snackbar } from './snackbar';\nexport { default as SnackbarList } from './snackbar/list';\nexport { Spacer as __experimentalSpacer } from './spacer';\nexport { Scrollable as __experimentalScrollable } from './scrollable';\nexport { default as Spinner } from './spinner';\nexport { Surface as __experimentalSurface } from './surface';\nexport { default as TabPanel } from './tab-panel';\nexport { Text as __experimentalText } from './text';\nexport { default as TextControl } from './text-control';\nexport { default as TextareaControl } from './textarea-control';\nexport { default as TextHighlight } from './text-highlight';\nexport { default as Tip } from './tip';\nexport { default as ToggleControl } from './toggle-control';\nexport {\n\tToggleGroupControl as __experimentalToggleGroupControl,\n\tToggleGroupControlOption as __experimentalToggleGroupControlOption,\n\tToggleGroupControlOptionIcon as __experimentalToggleGroupControlOptionIcon,\n} from './toggle-group-control';\nexport {\n\tToolbar,\n\tToolbarButton,\n\tToolbarContext as __experimentalToolbarContext,\n\tToolbarDropdownMenu,\n\tToolbarGroup,\n\tToolbarItem,\n} from './toolbar';\nexport {\n\tToolsPanel as __experimentalToolsPanel,\n\tToolsPanelItem as __experimentalToolsPanelItem,\n\tToolsPanelContext as __experimentalToolsPanelContext,\n} from './tools-panel';\nexport { default as Tooltip } from './tooltip';\nexport {\n\tdefault as __experimentalTreeGrid,\n\tTreeGridRow as __experimentalTreeGridRow,\n\tTreeGridCell as __experimentalTreeGridCell,\n\tTreeGridItem as __experimentalTreeGridItem,\n} from './tree-grid';\nexport { default as TreeSelect } from './tree-select';\nexport { Truncate as __experimentalTruncate } from './truncate';\nexport {\n\tdefault as __experimentalUnitControl,\n\tuseCustomUnits as __experimentalUseCustomUnits,\n\tparseQuantityAndUnitFromRawValue as __experimentalParseQuantityAndUnitFromRawValue,\n} from './unit-control';\nexport { View as __experimentalView } from './view';\nexport { VisuallyHidden } from './visually-hidden';\nexport { VStack as __experimentalVStack } from './v-stack';\nexport { default as IsolatedEventContainer } from './isolated-event-container';\nexport {\n\tcreateSlotFill,\n\tSlot,\n\tFill,\n\tProvider as SlotFillProvider,\n\tuseSlot as __experimentalUseSlot,\n\tuseSlotFills as __experimentalUseSlotFills,\n} from './slot-fill';\nexport { default as __experimentalStyleProvider } from './style-provider';\nexport { ZStack as __experimentalZStack } from './z-stack';\n\n// Higher-Order Components.\nexport {\n\tdefault as navigateRegions,\n\tuseNavigateRegions as __unstableUseNavigateRegions,\n} from './higher-order/navigate-regions';\nexport { default as withConstrainedTabbing } from './higher-order/with-constrained-tabbing';\nexport { default as withFallbackStyles } from './higher-order/with-fallback-styles';\nexport { default as withFilters } from './higher-order/with-filters';\nexport { default as withFocusOutside } from './higher-order/with-focus-outside';\nexport {\n\tdefault as withFocusReturn,\n\tProvider as FocusReturnProvider,\n} from './higher-order/with-focus-return';\nexport { default as withNotices } from './higher-order/with-notices';\nexport { default as withSpokenMessages } from './higher-order/with-spoken-messages';\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;AAaA;;AACA;;AAIA;;AACA;;AACA;;AAIA;;AACA;;AAMA;;AACA;;AAIA;;AACA;;AACA;;AAQA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAMA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAIA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAQA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AAQA;;AAKA;;AACA;;AAMA;;AACA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAQA;;AACA;;AAGA;;AAIA;;AACA;;AACA;;AACA;;AACA;;AAIA;;AACA;;AAGA","sourcesContent":["// Primitives.\nexport {\n\tSVG,\n\tPath,\n\tCircle,\n\tPolygon,\n\tRect,\n\tG,\n\tLine,\n\tHorizontalRule,\n\tBlockQuotation,\n} from '@wordpress/primitives';\n\n// Components.\nexport { default as __experimentalAlignmentMatrixControl } from './alignment-matrix-control';\nexport {\n\tdefault as Animate,\n\tgetAnimateClassName as __unstableGetAnimateClassName,\n} from './animate';\nexport { __unstableMotion, __unstableAnimatePresence } from './animation';\nexport { default as AnglePickerControl } from './angle-picker-control';\nexport {\n\tdefault as Autocomplete,\n\tuseAutocompleteProps as __unstableUseAutocompleteProps,\n} from './autocomplete';\nexport { default as BaseControl, useBaseControlProps } from './base-control';\nexport {\n\tBorderBoxControl as __experimentalBorderBoxControl,\n\thasSplitBorders as __experimentalHasSplitBorders,\n\tisDefinedBorder as __experimentalIsDefinedBorder,\n\tisEmptyBorder as __experimentalIsEmptyBorder,\n} from './border-box-control';\nexport { BorderControl as __experimentalBorderControl } from './border-control';\nexport {\n\tdefault as __experimentalBoxControl,\n\tapplyValueToSides as __experimentalApplyValueToSides,\n} from './box-control';\nexport { default as Button } from './button';\nexport { default as ButtonGroup } from './button-group';\nexport {\n\tCard,\n\tCardBody,\n\tCardDivider,\n\tCardFooter,\n\tCardHeader,\n\tCardMedia,\n} from './card';\nexport { default as CheckboxControl } from './checkbox-control';\nexport { default as ClipboardButton } from './clipboard-button';\nexport { default as __experimentalPaletteEdit } from './palette-edit';\nexport { default as ColorIndicator } from './color-indicator';\nexport { default as ColorPalette } from './color-palette';\nexport { ColorPicker } from './color-picker';\nexport { default as ComboboxControl } from './combobox-control';\nexport {\n\tComposite as __unstableComposite,\n\tCompositeGroup as __unstableCompositeGroup,\n\tCompositeItem as __unstableCompositeItem,\n\tuseCompositeState as __unstableUseCompositeState,\n} from './composite';\nexport { ConfirmDialog as __experimentalConfirmDialog } from './confirm-dialog';\nexport { StableCustomSelectControl as CustomSelectControl } from './custom-select-control';\nexport { default as Dashicon } from './dashicon';\nexport { default as DateTimePicker, DatePicker, TimePicker } from './date-time';\nexport { default as __experimentalDimensionControl } from './dimension-control';\nexport { default as Disabled } from './disabled';\nexport { DisclosureContent as __unstableDisclosureContent } from './disclosure';\nexport { Divider as __experimentalDivider } from './divider';\nexport { default as Draggable } from './draggable';\nexport { default as DropZone } from './drop-zone';\nexport { default as DropZoneProvider } from './drop-zone/provider';\nexport { default as Dropdown } from './dropdown';\nexport { default as __experimentalDropdownContentWrapper } from './dropdown/dropdown-content-wrapper';\nexport { default as DropdownMenu } from './dropdown-menu';\nexport { DuotoneSwatch, DuotonePicker } from './duotone-picker';\nexport { Elevation as __experimentalElevation } from './elevation';\nexport { default as ExternalLink } from './external-link';\nexport { Flex, FlexBlock, FlexItem } from './flex';\nexport { default as FocalPointPicker } from './focal-point-picker';\nexport { default as FocusableIframe } from './focusable-iframe';\nexport { default as FontSizePicker } from './font-size-picker';\nexport { default as FormFileUpload } from './form-file-upload';\nexport { default as FormToggle } from './form-toggle';\nexport { default as FormTokenField } from './form-token-field';\nexport { default as GradientPicker } from './gradient-picker';\nexport { default as CustomGradientPicker } from './custom-gradient-picker';\nexport { Grid as __experimentalGrid } from './grid';\nexport { default as Guide } from './guide';\nexport { default as GuidePage } from './guide/page';\nexport { Heading as __experimentalHeading } from './heading';\nexport { HStack as __experimentalHStack } from './h-stack';\nexport { default as Icon } from './icon';\nexport { default as IconButton } from './button/deprecated';\nexport {\n\tItemGroup as __experimentalItemGroup,\n\tItem as __experimentalItem,\n} from './item-group';\nexport { default as __experimentalInputControl } from './input-control';\nexport { default as __experimentalInputControlPrefixWrapper } from './input-control/input-prefix-wrapper';\nexport { default as __experimentalInputControlSuffixWrapper } from './input-control/input-suffix-wrapper';\nexport { default as KeyboardShortcuts } from './keyboard-shortcuts';\nexport { default as MenuGroup } from './menu-group';\nexport { default as MenuItem } from './menu-item';\nexport { default as MenuItemsChoice } from './menu-items-choice';\nexport { default as Modal } from './modal';\nexport { default as ScrollLock } from './scroll-lock';\nexport { NavigableMenu, TabbableContainer } from './navigable-container';\nexport { default as __experimentalNavigation } from './navigation';\nexport { default as __experimentalNavigationBackButton } from './navigation/back-button';\nexport { default as __experimentalNavigationGroup } from './navigation/group';\nexport { default as __experimentalNavigationItem } from './navigation/item';\nexport { default as __experimentalNavigationMenu } from './navigation/menu';\nexport {\n\tNavigatorProvider as __experimentalNavigatorProvider,\n\tNavigatorScreen as __experimentalNavigatorScreen,\n\tNavigatorButton as __experimentalNavigatorButton,\n\tNavigatorBackButton as __experimentalNavigatorBackButton,\n\tNavigatorToParentButton as __experimentalNavigatorToParentButton,\n\tuseNavigator as __experimentalUseNavigator,\n} from './navigator';\nexport { default as Notice } from './notice';\nexport { default as __experimentalNumberControl } from './number-control';\nexport { default as NoticeList } from './notice/list';\nexport { default as Panel } from './panel';\nexport { default as PanelBody } from './panel/body';\nexport { default as PanelHeader } from './panel/header';\nexport { default as PanelRow } from './panel/row';\nexport { default as Placeholder } from './placeholder';\nexport { default as Popover } from './popover';\nexport { default as QueryControls } from './query-controls';\nexport { default as __experimentalRadio } from './radio-group/radio';\nexport { default as __experimentalRadioGroup } from './radio-group';\nexport { default as RadioControl } from './radio-control';\nexport { default as RangeControl } from './range-control';\nexport { default as ResizableBox } from './resizable-box';\nexport { default as ResponsiveWrapper } from './responsive-wrapper';\nexport { default as SandBox } from './sandbox';\nexport { default as SearchControl } from './search-control';\nexport { default as SelectControl } from './select-control';\nexport { default as Snackbar } from './snackbar';\nexport { default as SnackbarList } from './snackbar/list';\nexport { Spacer as __experimentalSpacer } from './spacer';\nexport { Scrollable as __experimentalScrollable } from './scrollable';\nexport { default as Spinner } from './spinner';\nexport { Surface as __experimentalSurface } from './surface';\nexport { default as TabPanel } from './tab-panel';\nexport { Text as __experimentalText } from './text';\nexport { default as TextControl } from './text-control';\nexport { default as TextareaControl } from './textarea-control';\nexport { default as TextHighlight } from './text-highlight';\nexport { default as Tip } from './tip';\nexport { default as ToggleControl } from './toggle-control';\nexport {\n\tToggleGroupControl as __experimentalToggleGroupControl,\n\tToggleGroupControlOption as __experimentalToggleGroupControlOption,\n\tToggleGroupControlOptionIcon as __experimentalToggleGroupControlOptionIcon,\n} from './toggle-group-control';\nexport {\n\tToolbar,\n\tToolbarButton,\n\tToolbarContext as __experimentalToolbarContext,\n\tToolbarDropdownMenu,\n\tToolbarGroup,\n\tToolbarItem,\n} from './toolbar';\nexport {\n\tToolsPanel as __experimentalToolsPanel,\n\tToolsPanelItem as __experimentalToolsPanelItem,\n\tToolsPanelContext as __experimentalToolsPanelContext,\n} from './tools-panel';\nexport { default as Tooltip } from './tooltip';\nexport {\n\tdefault as __experimentalTreeGrid,\n\tTreeGridRow as __experimentalTreeGridRow,\n\tTreeGridCell as __experimentalTreeGridCell,\n\tTreeGridItem as __experimentalTreeGridItem,\n} from './tree-grid';\nexport { default as TreeSelect } from './tree-select';\nexport { Truncate as __experimentalTruncate } from './truncate';\nexport {\n\tdefault as __experimentalUnitControl,\n\tuseCustomUnits as __experimentalUseCustomUnits,\n\tparseQuantityAndUnitFromRawValue as __experimentalParseQuantityAndUnitFromRawValue,\n} from './unit-control';\nexport { View as __experimentalView } from './view';\nexport { VisuallyHidden } from './visually-hidden';\nexport { VStack as __experimentalVStack } from './v-stack';\nexport { default as IsolatedEventContainer } from './isolated-event-container';\nexport {\n\tcreateSlotFill,\n\tSlot,\n\tFill,\n\tProvider as SlotFillProvider,\n\tuseSlot as __experimentalUseSlot,\n\tuseSlotFills as __experimentalUseSlotFills,\n} from './slot-fill';\nexport { default as __experimentalStyleProvider } from './style-provider';\nexport { ZStack as __experimentalZStack } from './z-stack';\n\n// Higher-Order Components.\nexport {\n\tdefault as navigateRegions,\n\tuseNavigateRegions as __unstableUseNavigateRegions,\n} from './higher-order/navigate-regions';\nexport { default as withConstrainedTabbing } from './higher-order/with-constrained-tabbing';\nexport { default as withFallbackStyles } from './higher-order/with-fallback-styles';\nexport { default as withFilters } from './higher-order/with-filters';\nexport { default as withFocusOutside } from './higher-order/with-focus-outside';\nexport {\n\tdefault as withFocusReturn,\n\tProvider as FocusReturnProvider,\n} from './higher-order/with-focus-return';\nexport { default as withNotices } from './higher-order/with-notices';\nexport { default as withSpokenMessages } from './higher-order/with-spoken-messages';\n\n// Private APIs.\nexport { privateApis } from './private-apis';\n"]}

package/build/navigator/context.js CHANGED Viewed

@@ -13,7 +13,11 @@ var _element = require("@wordpress/element");
 const initialContextValue = {
   location: {},
   goTo: () => {},
-  goBack: () => {}
+  goBack: () => {},
+  goToParent: () => {},
+  addScreen: () => {},
+  removeScreen: () => {},
+  params: {}
 };
 const NavigatorContext = (0, _element.createContext)(initialContextValue);
 exports.NavigatorContext = NavigatorContext;

package/build/navigator/context.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigator/context.ts"],"names":["initialContextValue","location","goTo","goBack","NavigatorContext"],"mappings":";;;;;;;AAGA;;AAHA;AACA;AACA;AAQA,MAAMA,mBAAyC,GAAG;AACjDC,EAAAA,QAAQ,EAAE,EADuC;AAEjDC,EAAAA,IAAI,EAAE,MAAM,CAAE,CAFmC;AAGjDC,EAAAA,MAAM,EAAE,MAAM,CAAE;~~AAHiC~~,CAAlD;~~AAKO~~,MAAMC,gBAAgB,GAAG,~~4BAAeJ~~,mBAAf,CAAzB","sourcesContent":["/*\n WordPress dependencies\n /\nimport { createContext } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport type { NavigatorContext as NavigatorContextType } from './types';\n\nconst initialContextValue: NavigatorContextType = {\n\tlocation: {},\n\tgoTo: () => {},\n\tgoBack: () => {},\n};\nexport const NavigatorContext = createContext( initialContextValue );\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigator/context.ts"],"names":["initialContextValue","location","goTo","goBack","goToParent","addScreen","removeScreen","params","NavigatorContext"],"mappings":";;;;;;;AAGA;;AAHA;AACA;AACA;AAQA,MAAMA,mBAAyC,GAAG;AACjDC,EAAAA,QAAQ,EAAE,EADuC;AAEjDC,EAAAA,IAAI,EAAE,MAAM,CAAE,CAFmC;AAGjDC,EAAAA,MAAM,EAAE,MAAM,CAAE,CAHiC;AAIjDC,EAAAA,UAAU,EAAE,MAAM,CAAE,CAJ6B;AAKjDC,EAAAA,SAAS,EAAE,MAAM,CAAE,CAL8B;AAMjDC,EAAAA,YAAY,EAAE,MAAM,CAAE,CAN2B;AAOjDC,EAAAA,MAAM,EAAE;AAPyC,CAAlD;AASO,MAAMC,gBAAgB,GAAG,4BAAeR,mBAAf,CAAzB","sourcesContent":["/*\n WordPress dependencies\n /\nimport { createContext } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport type { NavigatorContext as NavigatorContextType } from './types';\n\nconst initialContextValue: NavigatorContextType = {\n\tlocation: {},\n\tgoTo: () => {},\n\tgoBack: () => {},\n\tgoToParent: () => {},\n\taddScreen: () => {},\n\tremoveScreen: () => {},\n\tparams: {},\n};\nexport const NavigatorContext = createContext( initialContextValue );\n"]}

package/build/navigator/index.js CHANGED Viewed

@@ -29,6 +29,12 @@ Object.defineProperty(exports, "NavigatorScreen", {
     return _navigatorScreen.NavigatorScreen;
   }
 });
+Object.defineProperty(exports, "NavigatorToParentButton", {
+  enumerable: true,
+  get: function () {
+    return _navigatorToParentButton.NavigatorToParentButton;
+  }
+});
 Object.defineProperty(exports, "useNavigator", {
   enumerable: true,
   get: function () {
@@ -44,5 +50,7 @@ var _navigatorButton = require("./navigator-button");
 var _navigatorBackButton = require("./navigator-back-button");
+var _navigatorToParentButton = require("./navigator-to-parent-button");
 var _useNavigator = _interopRequireDefault(require("./use-navigator"));
 //# sourceMappingURL=index.js.map

package/build/navigator/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigator/index.ts"],"names":[],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAAA;;AACA;;AACA;;AACA;;AACA","sourcesContent":["export { NavigatorProvider } from './navigator-provider';\nexport { NavigatorScreen } from './navigator-screen';\nexport { NavigatorButton } from './navigator-button';\nexport { NavigatorBackButton } from './navigator-back-button';\nexport { default as useNavigator } from './use-navigator';\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigator/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA","sourcesContent":["export { NavigatorProvider } from './navigator-provider';\nexport { NavigatorScreen } from './navigator-screen';\nexport { NavigatorButton } from './navigator-button';\nexport { NavigatorBackButton } from './navigator-back-button';\nexport { NavigatorToParentButton } from './navigator-to-parent-button';\nexport { default as useNavigator } from './use-navigator';\n"]}

package/build/navigator/navigator-back-button/hook.js CHANGED Viewed

@@ -26,16 +26,24 @@ function useNavigatorBackButton(props) {
   const {
     onClick,
     as = _button.default,
+    goToParent: goToParentProp = false,
     ...otherProps
   } = (0, _context.useContextSystem)(props, 'NavigatorBackButton');
   const {
-    goBack
+    goBack,
+    goToParent
   } = (0, _useNavigator.default)();
   const handleClick = (0, _element.useCallback)(e => {
     e.preventDefault();
-    goBack();
+    if (goToParentProp) {
+      goToParent();
+    } else {
+      goBack();
+    }
     onClick === null || onClick === void 0 ? void 0 : onClick(e);
-  }, [goBack, onClick]);
+  }, [goToParentProp, goToParent, goBack, onClick]);
   return {
     as,
     onClick: handleClick,

package/build/navigator/navigator-back-button/hook.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigator/navigator-back-button/hook.ts"],"names":["useNavigatorBackButton","props","onClick","as","Button","otherProps","goBack","handleClick","e","preventDefault"],"mappings":";;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAMO,SAASA,sBAAT,CACNC,KADM,EAEL;AACD,QAAM;AACLC,IAAAA,OADK;AAELC,IAAAA,EAAE,GAAGC,eAFA;~~AAGL~~,OAAGC;~~AAHE~~,~~MAIF~~,+~~BAAkBJ~~,KAAlB,EAAyB,qBAAzB,~~CAJJ~~;~~AAMA~~,QAAM;~~AAAEK~~,IAAAA;~~AAAF~~,~~MAAa~~,~~4BAAnB~~;AACA,~~QAAMC~~,WAAyD,GAC9D,0BACGC,CAAF,IAAS;AACRA,IAAAA,CAAC,CAACC,cAAF;~~AACAH~~,~~IAAAA~~,MAAM;~~AACNJ~~,IAAAA,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,~~CAAIM~~,CAAJ,CAAP;AACA,~~GALF~~,~~EAMC~~,~~CAAEF~~,~~MAAF~~,~~EAAUJ~~,~~OAAV~~,~~CAND~~,CADD;~~AAUA~~,SAAO;AACNC,IAAAA,EADM;AAEND,IAAAA,OAAO,~~EAAEK~~,WAFH;AAGN,OAAGF;AAHG,GAAP;AAKA","sourcesContent":["/*\n WordPress dependencies\n /\nimport { useCallback } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport Button from '../../button';\nimport useNavigator from '../use-navigator';\nimport type { ~~NavigatorBackButtonProps~~ } from '../types';\n\nexport function useNavigatorBackButton(\n\tprops: WordPressComponentProps< ~~NavigatorBackButtonProps~~, 'button' >\n) {\n\tconst {\n\t\tonClick,\n\t\tas = Button,\n\t\t...otherProps\n\t} = useContextSystem( props, 'NavigatorBackButton' );\n\n\tconst { goBack } = useNavigator();\n\tconst handleClick: React.MouseEventHandler< HTMLButtonElement > =\n\t\tuseCallback(\n\t\t\t( e ) => {\n\t\t\t\te.preventDefault();\n\t\t\t\tgoBack();\n\t\t\t\tonClick?.( e );\n\t\t\t},\n\t\t\t[ goBack, onClick ]\n\t\t);\n\n\treturn {\n\t\tas,\n\t\tonClick: handleClick,\n\t\t...otherProps,\n\t};\n}\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigator/navigator-back-button/hook.ts"],"names":["useNavigatorBackButton","props","onClick","as","Button","goToParent","goToParentProp","otherProps","goBack","handleClick","e","preventDefault"],"mappings":";;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAMO,SAASA,sBAAT,CACNC,KADM,EAEL;AACD,QAAM;AACLC,IAAAA,OADK;AAELC,IAAAA,EAAE,GAAGC,eAFA;AAGLC,IAAAA,UAAU,EAAEC,cAAc,GAAG,KAHxB;AAIL,OAAGC;AAJE,MAKF,+BAAkBN,KAAlB,EAAyB,qBAAzB,CALJ;AAOA,QAAM;AAAEO,IAAAA,MAAF;AAAUH,IAAAA;AAAV,MAAyB,4BAA/B;AACA,QAAMI,WAAyD,GAC9D,0BACGC,CAAF,IAAS;AACRA,IAAAA,CAAC,CAACC,cAAF;;AACA,QAAKL,cAAL,EAAsB;AACrBD,MAAAA,UAAU;AACV,KAFD,MAEO;AACNG,MAAAA,MAAM;AACN;;AACDN,IAAAA,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAIQ,CAAJ,CAAP;AACA,GATF,EAUC,CAAEJ,cAAF,EAAkBD,UAAlB,EAA8BG,MAA9B,EAAsCN,OAAtC,CAVD,CADD;AAcA,SAAO;AACNC,IAAAA,EADM;AAEND,IAAAA,OAAO,EAAEO,WAFH;AAGN,OAAGF;AAHG,GAAP;AAKA","sourcesContent":["/*\n WordPress dependencies\n /\nimport { useCallback } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport Button from '../../button';\nimport useNavigator from '../use-navigator';\nimport type { NavigatorBackButtonHookProps } from '../types';\n\nexport function useNavigatorBackButton(\n\tprops: WordPressComponentProps< NavigatorBackButtonHookProps, 'button' >\n) {\n\tconst {\n\t\tonClick,\n\t\tas = Button,\n\t\tgoToParent: goToParentProp = false,\n\t\t...otherProps\n\t} = useContextSystem( props, 'NavigatorBackButton' );\n\n\tconst { goBack, goToParent } = useNavigator();\n\tconst handleClick: React.MouseEventHandler< HTMLButtonElement > =\n\t\tuseCallback(\n\t\t\t( e ) => {\n\t\t\t\te.preventDefault();\n\t\t\t\tif ( goToParentProp ) {\n\t\t\t\t\tgoToParent();\n\t\t\t\t} else {\n\t\t\t\t\tgoBack();\n\t\t\t\t}\n\t\t\t\tonClick?.( e );\n\t\t\t},\n\t\t\t[ goToParentProp, goToParent, goBack, onClick ]\n\t\t);\n\n\treturn {\n\t\tas,\n\t\tonClick: handleClick,\n\t\t...otherProps,\n\t};\n}\n"]}