@wordpress/components 25.5.0 → 25.6.1

package/build-module/color-palette/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-palette/index.tsx"],"names":["colord","extend","namesPlugin","a11yPlugin","classnames","__","sprintf","useCallback","useMemo","useState","forwardRef","Dropdown","ColorPicker","CircularOptionPicker","VStack","Truncate","ColorHeading","DropdownContentWrapper","extractColorNameFromCurrentValue","isMultiplePaletteArray","normalizeColorValue","SinglePalette","className","clearColor","colors","onChange","value","actions","colorOptions","map","color","name","index","colordColor","isSelected","fill","contrast","backgroundColor","MultiplePalettes","headingLevel","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","isHex","startsWith","displayValue","replace","customColorAccessibleLabel","paletteCommonProps","isOpen","onToggle","background","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';\nimport classnames from 'classnames';\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 { 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} 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\theadingLevel,\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 level={ headingLevel }>\n\t\t\t\t\t\t\t{ name }\n\t\t\t\t\t\t</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\theadingLevel = 2,\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\tconst isHex = value?.startsWith( '#' );\n\n\t// Leave hex values as-is. Remove the `var()` wrapper from CSS vars.\n\tconst displayValue = value?.replace( /^var\\((.+)\\)$/, '$1' );\n\tconst customColorAccessibleLabel = !! displayValue\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\tdisplayValue\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\theadingLevel,\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<VStack\n\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-wrapper\"\n\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tref={ customColorPaletteCallbackRef }\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-button\"\n\t\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\t\taria-label={ customColorAccessibleLabel }\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tbackground: value,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-text-wrapper\"\n\t\t\t\t\t\t\t\tspacing={ 0.5 }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Truncate className=\"components-color-palette__custom-color-name\">\n\t\t\t\t\t\t\t\t\t{ value\n\t\t\t\t\t\t\t\t\t\t? buttonLabelName\n\t\t\t\t\t\t\t\t\t\t: 'No color selected' }\n\t\t\t\t\t\t\t\t</Truncate>\n\t\t\t\t\t\t\t\t{ /*\n\t\t\t\t\t\t\t\tThis `Truncate` is always rendered, even if\n\t\t\t\t\t\t\t\tthere is no `displayValue`, to ensure the layout\n\t\t\t\t\t\t\t\tdoes not shift\n\t\t\t\t\t\t\t\t*/ }\n\t\t\t\t\t\t\t\t<Truncate\n\t\t\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t\t\t'components-color-palette__custom-color-value',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'components-color-palette__custom-color-value--is-hex':\n\t\t\t\t\t\t\t\t\t\t\t\tisHex,\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ displayValue }\n\t\t\t\t\t\t\t\t</Truncate>\n\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t</VStack>\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"]}
+{"version":3,"names":["colord","extend","namesPlugin","a11yPlugin","classnames","__","sprintf","useCallback","useMemo","useState","forwardRef","Dropdown","ColorPicker","CircularOptionPicker","VStack","Truncate","ColorHeading","DropdownContentWrapper","extractColorNameFromCurrentValue","isMultiplePaletteArray","normalizeColorValue","SinglePalette","className","clearColor","colors","onChange","value","actions","colorOptions","map","color","name","index","colordColor","isSelected","createElement","Option","key","selectedIconProps","fill","contrast","tooltipText","style","backgroundColor","onClick","options","MultiplePalettes","headingLevel","length","spacing","colorPalette","level","newColor","CustomColorPickerDropdown","isRenderedInSidebar","popoverProps","receivedPopoverProps","props","shift","placement","offset","contentClassName","UnforwardedColorPalette","forwardedRef","clearable","disableCustomColors","enableAlpha","__experimentalIsRenderedInSidebar","otherProps","normalizedColorValue","setNormalizedColorValue","undefined","customColorPaletteCallbackRef","node","hasMultipleColorOrigins","buttonLabelName","renderCustomColorPicker","paddingSize","isHex","startsWith","displayValue","replace","customColorAccessibleLabel","paletteCommonProps","ButtonAction","ref","renderContent","renderToggle","isOpen","onToggle","background","ColorPalette"],"sources":["@wordpress/components/src/color-palette/index.tsx"],"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';\nimport classnames from 'classnames';\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 { 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} 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\theadingLevel,\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 level={ headingLevel }>\n\t\t\t\t\t\t\t{ name }\n\t\t\t\t\t\t</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\theadingLevel = 2,\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\tconst isHex = value?.startsWith( '#' );\n\n\t// Leave hex values as-is. Remove the `var()` wrapper from CSS vars.\n\tconst displayValue = value?.replace( /^var\\((.+)\\)$/, '$1' );\n\tconst customColorAccessibleLabel = !! displayValue\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\tdisplayValue\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\theadingLevel,\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<VStack\n\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-wrapper\"\n\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tref={ customColorPaletteCallbackRef }\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-button\"\n\t\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\t\taria-label={ customColorAccessibleLabel }\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tbackground: value,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-text-wrapper\"\n\t\t\t\t\t\t\t\tspacing={ 0.5 }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Truncate className=\"components-color-palette__custom-color-name\">\n\t\t\t\t\t\t\t\t\t{ value\n\t\t\t\t\t\t\t\t\t\t? buttonLabelName\n\t\t\t\t\t\t\t\t\t\t: 'No color selected' }\n\t\t\t\t\t\t\t\t</Truncate>\n\t\t\t\t\t\t\t\t{ /*\n\t\t\t\t\t\t\t\tThis `Truncate` is always rendered, even if\n\t\t\t\t\t\t\t\tthere is no `displayValue`, to ensure the layout\n\t\t\t\t\t\t\t\tdoes not shift\n\t\t\t\t\t\t\t\t*/ }\n\t\t\t\t\t\t\t\t<Truncate\n\t\t\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t\t\t'components-color-palette__custom-color-value',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'components-color-palette__custom-color-value--is-hex':\n\t\t\t\t\t\t\t\t\t\t\t\tisHex,\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ displayValue }\n\t\t\t\t\t\t\t\t</Truncate>\n\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t</VStack>\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"],"mappings":";AAAA;AACA;AACA;;AAEA,SAASA,MAAM,EAAEC,MAAM,QAAQ,QAAQ;AACvC,OAAOC,WAAW,MAAM,sBAAsB;AAC9C,OAAOC,UAAU,MAAM,qBAAqB;AAC5C,OAAOC,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,EAAE,EAAEC,OAAO,QAAQ,iBAAiB;AAC7C,SAASC,WAAW,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,UAAU,QAAQ,oBAAoB;;AAE/E;AACA;AACA;AACA,OAAOC,QAAQ,MAAM,aAAa;AAClC,SAASC,WAAW,QAAQ,iBAAiB;AAC7C,OAAOC,oBAAoB,MAAM,2BAA2B;AAC5D,SAASC,MAAM,QAAQ,YAAY;AACnC,SAASC,QAAQ,QAAQ,aAAa;AACtC,SAASC,YAAY,QAAQ,UAAU;AACvC,OAAOC,sBAAsB,MAAM,sCAAsC;AAWzE,SACCC,gCAAgC,EAChCC,sBAAsB,EACtBC,mBAAmB,QACb,SAAS;AAEhBnB,MAAM,CAAE,CAAEC,WAAW,EAAEC,UAAU,CAAG,CAAC;AAErC,SAASkB,aAAaA,CAAE;EACvBC,SAAS;EACTC,UAAU;EACVC,MAAM;EACNC,QAAQ;EACRC,KAAK;EACLC;AACmB,CAAC,EAAG;EACvB,MAAMC,YAAY,GAAGpB,OAAO,CAAE,MAAM;IACnC,OAAOgB,MAAM,CAACK,GAAG,CAAE,CAAE;MAAEC,KAAK;MAAEC;IAAK,CAAC,EAAEC,KAAK,KAAM;MAChD,MAAMC,WAAW,GAAGjC,MAAM,CAAE8B,KAAM,CAAC;MACnC,MAAMI,UAAU,GAAGR,KAAK,KAAKI,KAAK;MAElC,OACCK,aAAA,CAACtB,oBAAoB,CAACuB,MAAM;QAC3BC,GAAG,EAAI,GAAGP,KAAO,IAAIE,KAAO,EAAG;QAC/BE,UAAU,EAAGA,UAAY;QACzBI,iBAAiB,EAChBJ,UAAU,GACP;UACAK,IAAI,EACHN,WAAW,CAACO,QAAQ,CAAC,CAAC,GACtBP,WAAW,CAACO,QAAQ,CAAE,MAAO,CAAC,GAC3B,MAAM,GACN;QACJ,CAAC,GACD,CAAC,CACJ;QACDC,WAAW,EACVV,IAAI;QACJ;QACAzB,OAAO,CAAED,EAAE,CAAE,gBAAiB,CAAC,EAAEyB,KAAM,CACvC;QACDY,KAAK,EAAG;UAAEC,eAAe,EAAEb,KAAK;UAAEA;QAAM,CAAG;QAC3Cc,OAAO,EACNV,UAAU,GAAGX,UAAU,GAAG,MAAME,QAAQ,CAAEK,KAAK,EAAEE,KAAM,CACvD;QACD,cACCD,IAAI;QACD;QACAzB,OAAO,CAAED,EAAE,CAAE,WAAY,CAAC,EAAE0B,IAAK,CAAC;QAClC;QACAzB,OAAO,CAAED,EAAE,CAAE,gBAAiB,CAAC,EAAEyB,KAAM;MAC1C,CACD,CAAC;IAEJ,CAAE,CAAC;EACJ,CAAC,EAAE,CAAEN,MAAM,EAAEE,KAAK,EAAED,QAAQ,EAAEF,UAAU,CAAG,CAAC;EAE5C,OACCY,aAAA,CAACtB,oBAAoB;IACpBS,SAAS,EAAGA,SAAW;IACvBuB,OAAO,EAAGjB,YAAc;IACxBD,OAAO,EAAGA;EAAS,CACnB,CAAC;AAEJ;AAEA,SAASmB,gBAAgBA,CAAE;EAC1BxB,SAAS;EACTC,UAAU;EACVC,MAAM;EACNC,QAAQ;EACRC,KAAK;EACLC,OAAO;EACPoB;AACsB,CAAC,EAAG;EAC1B,IAAKvB,MAAM,CAACwB,MAAM,KAAK,CAAC,EAAG;IAC1B,OAAO,IAAI;EACZ;EAEA,OACCb,aAAA,CAACrB,MAAM;IAACmC,OAAO,EAAG,CAAG;IAAC3B,SAAS,EAAGA;EAAW,GAC1CE,MAAM,CAACK,GAAG,CAAE,CAAE;IAAEE,IAAI;IAAEP,MAAM,EAAE0B;EAAa,CAAC,EAAElB,KAAK,KAAM;IAC1D,OACCG,aAAA,CAACrB,MAAM;MAACmC,OAAO,EAAG,CAAG;MAACZ,GAAG,EAAGL;IAAO,GAClCG,aAAA,CAACnB,YAAY;MAACmC,KAAK,EAAGJ;IAAc,GACjChB,IACW,CAAC,EACfI,aAAA,CAACd,aAAa;MACbE,UAAU,EAAGA,UAAY;MACzBC,MAAM,EAAG0B,YAAc;MACvBzB,QAAQ,EAAK2B,QAAQ,IACpB3B,QAAQ,CAAE2B,QAAQ,EAAEpB,KAAM,CAC1B;MACDN,KAAK,EAAGA,KAAO;MACfC,OAAO,EACNH,MAAM,CAACwB,MAAM,KAAKhB,KAAK,GAAG,CAAC,GAAGL,OAAO,GAAG;IACxC,CACD,CACM,CAAC;EAEX,CAAE,CACK,CAAC;AAEX;AAEA,OAAO,SAAS0B,yBAAyBA,CAAE;EAC1CC,mBAAmB;EACnBC,YAAY,EAAEC,oBAAoB;EAClC,GAAGC;AAC4B,CAAC,EAAG;EACnC,MAAMF,YAAY,GAAG/C,OAAO,CAC3B,OAAQ;IACPkD,KAAK,EAAE,IAAI;IACX,IAAKJ,mBAAmB,GACrB;MACA;MACA;MACAK,SAAS,EAAE,YAAY;MACvBC,MAAM,EAAE;IACR,CAAC,GACD;MACA;MACAD,SAAS,EAAE,QAAQ;MACnBC,MAAM,EAAE;IACR,CAAC,CAAE;IACN,GAAGJ;EACJ,CAAC,CAAE,EACH,CAAEF,mBAAmB,EAAEE,oBAAoB,CAC5C,CAAC;EAED,OACCrB,aAAA,CAACxB,QAAQ;IACRkD,gBAAgB,EAAC,yDAAyD;IAC1EN,YAAY,EAAGA,YAAc;IAAA,GACxBE;EAAK,CACV,CAAC;AAEJ;AAEA,SAASK,uBAAuBA,CAC/BL,KAA0D,EAC1DM,YAAiC,EAChC;EACD,MAAM;IACLC,SAAS,GAAG,IAAI;IAChBxC,MAAM,GAAG,EAAE;IACXyC,mBAAmB,GAAG,KAAK;IAC3BC,WAAW,GAAG,KAAK;IACnBzC,QAAQ;IACRC,KAAK;IACLyC,iCAAiC,GAAG,KAAK;IACzCpB,YAAY,GAAG,CAAC;IAChB,GAAGqB;EACJ,CAAC,GAAGX,KAAK;EACT,MAAM,CAAEY,oBAAoB,EAAEC,uBAAuB,CAAE,GAAG7D,QAAQ,CAAEiB,KAAM,CAAC;EAE3E,MAAMH,UAAU,GAAGhB,WAAW,CAAE,MAAMkB,QAAQ,CAAE8C,SAAU,CAAC,EAAE,CAAE9C,QAAQ,CAAG,CAAC;EAE3E,MAAM+C,6BAA6B,GAAGjE,WAAW,CAC9CkE,IAAwB,IAAM;IAC/BH,uBAAuB,CAAElD,mBAAmB,CAAEM,KAAK,EAAE+C,IAAK,CAAE,CAAC;EAC9D,CAAC,EACD,CAAE/C,KAAK,CACR,CAAC;EAED,MAAMgD,uBAAuB,GAAGvD,sBAAsB,CAAEK,MAAO,CAAC;EAChE,MAAMmD,eAAe,GAAGnE,OAAO,CAC9B,MACCU,gCAAgC,CAC/BQ,KAAK,EACLF,MAAM,EACNkD,uBACD,CAAC,EACF,CAAEhD,KAAK,EAAEF,MAAM,EAAEkD,uBAAuB,CACzC,CAAC;EAED,MAAME,uBAAuB,GAAGA,CAAA,KAC/BzC,aAAA,CAAClB,sBAAsB;IAAC4D,WAAW,EAAC;EAAM,GACzC1C,aAAA,CAACvB,WAAW;IACXkB,KAAK,EAAGuC,oBAAsB;IAC9B5C,QAAQ,EAAKK,KAAK,IAAML,QAAQ,CAAEK,KAAM,CAAG;IAC3CoC,WAAW,EAAGA;EAAa,CAC3B,CACsB,CACxB;EACD,MAAMY,KAAK,GAAGpD,KAAK,EAAEqD,UAAU,CAAE,GAAI,CAAC;;EAEtC;EACA,MAAMC,YAAY,GAAGtD,KAAK,EAAEuD,OAAO,CAAE,eAAe,EAAE,IAAK,CAAC;EAC5D,MAAMC,0BAA0B,GAAG,CAAC,CAAEF,YAAY,GAC/C1E,OAAO;EACP;EACAD,EAAE,CACD,+FACD,CAAC,EACDsE,eAAe,EACfK,YACA,CAAC,GACD3E,EAAE,CAAE,sBAAuB,CAAC;EAE/B,MAAM8E,kBAAkB,GAAG;IAC1BnB,SAAS;IACTzC,UAAU;IACVE,QAAQ;IACRC,KAAK;IACLC,OAAO,EAAE,CAAC,CAAEqC,SAAS,IACpB7B,aAAA,CAACtB,oBAAoB,CAACuE,YAAY;MAACxC,OAAO,EAAGrB;IAAY,GACtDlB,EAAE,CAAE,OAAQ,CACoB,CACnC;IACD0C;EACD,CAAC;EAED,OACCZ,aAAA,CAACrB,MAAM;IAACmC,OAAO,EAAG,CAAG;IAACoC,GAAG,EAAGtB,YAAc;IAAA,GAAMK;EAAU,GACvD,CAAEH,mBAAmB,IACtB9B,aAAA,CAACkB,yBAAyB;IACzBC,mBAAmB,EAAGa,iCAAmC;IACzDmB,aAAa,EAAGV,uBAAyB;IACzCW,YAAY,EAAGA,CAAE;MAAEC,MAAM;MAAEC;IAAS,CAAC,KACpCtD,aAAA,CAACrB,MAAM;MACNQ,SAAS,EAAC,gDAAgD;MAC1D2B,OAAO,EAAG;IAAG,GAEbd,aAAA;MACCkD,GAAG,EAAGb,6BAA+B;MACrClD,SAAS,EAAC,+CAA+C;MACzD,iBAAgBkE,MAAQ;MACxB,iBAAc,MAAM;MACpB5C,OAAO,EAAG6C,QAAU;MACpB,cAAaP,0BAA4B;MACzCxC,KAAK,EAAG;QACPgD,UAAU,EAAEhE;MACb;IAAG,CACH,CAAC,EACFS,aAAA,CAACrB,MAAM;MACNQ,SAAS,EAAC,qDAAqD;MAC/D2B,OAAO,EAAG;IAAK,GAEfd,aAAA,CAACpB,QAAQ;MAACO,SAAS,EAAC;IAA6C,GAC9DI,KAAK,GACJiD,eAAe,GACf,mBACM,CAAC,EAMXxC,aAAA,CAACpB,QAAQ;MACRO,SAAS,EAAGlB,UAAU,CACrB,8CAA8C,EAC9C;QACC,sDAAsD,EACrD0E;MACF,CACD;IAAG,GAEDE,YACO,CACH,CACD;EACN,CACH,CACD,EACCN,uBAAuB,GACxBvC,aAAA,CAACW,gBAAgB;IAAA,GACXqC,kBAAkB;IACvB3D,MAAM,EAAGA;EAA2B,CACpC,CAAC,GAEFW,aAAA,CAACd,aAAa;IAAA,GACR8D,kBAAkB;IACvB3D,MAAM,EAAGA;EAAyB,CAClC,CAEK,CAAC;AAEX;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMmE,YAAY,GAAGjF,UAAU,CAAEoD,uBAAwB,CAAC;AAEjE,eAAe6B,YAAY"}

package/build-module/color-palette/index.native.js

@@ -1,20 +1,19 @@
 import { createElement, Fragment } from "@wordpress/element";
-
 /**
  * External dependencies
  */
 import { ScrollView, TouchableWithoutFeedback, View, Animated, Easing, Dimensions, Platform, Text } from 'react-native';
+
 /**
  * WordPress dependencies
  */
-
 import { __, sprintf } from '@wordpress/i18n';
 import { useRef, useEffect } from '@wordpress/element';
 import { usePreferredColorSchemeStyle } from '@wordpress/compose';
+
 /**
  * Internal dependencies
  */
-
 import styles from './style.scss';
 import ColorIndicator from '../color-indicator';
 import { colorsUtils } from '../mobile/color-settings/utils';
@@ -22,7 +21,6 @@ const ANIMATION_DURATION = 200;
 let contentWidth = 0;
 let scrollPosition = 0;
 let customIndicatorWidth = 0;
-
 function ColorPalette({
   enableCustomColor = true,
   setColor,
@@ -40,7 +38,6 @@ function ColorPalette({
   label
 }) {
   var _defaultSettings$colo, _defaultSettings$allC, _defaultSettings$grad;
-
   const customSwatchGradients = ['linear-gradient(120deg, rgba(255,0,0,.8) 0%, rgba(255,255,255,1) 70.71%)', 'linear-gradient(240deg, rgba(0,255,0,.8) 0%, rgba(0,255,0,0) 70.71%)', 'linear-gradient(360deg, rgba(0,0,255,.8) 0%, rgba(0,0,255,0) 70.71%)'];
   const scrollViewRef = useRef();
   const isIOS = Platform.OS === 'ios';
@@ -61,9 +58,7 @@ function ColorPalette({
   const isCustomGradientColor = isGradientColor && isSelectedCustom();
   const shouldShowCustomIndicator = enableCustomColor && shouldShowCustomIndicatorOption && (!isGradientSegment || isCustomGradientColor);
   const accessibilityHint = isGradientSegment ? __('Navigates to customize the gradient') : __('Navigates to custom color picker');
-
   const customText = __('Custom');
-
   useEffect(() => {
     if (scrollViewRef.current) {
       if (isSelectedCustom()) {
@@ -74,30 +69,24 @@ function ColorPalette({
           y: 0
         });
       }
-    } // Temporarily disabling exhuastive-deps until the component can be refactored and updated safely.
+    }
+    // Temporarily disabling exhuastive-deps until the component can be refactored and updated safely.
     // Please see https://github.com/WordPress/gutenberg/pull/41253 for discussion and details.
     // eslint-disable-next-line react-hooks/exhaustive-deps
-
   }, [currentSegment]);
-
   function isSelectedCustom() {
     const isWithinColors = activeColor && mergedColors && mergedColors.includes(activeColor);
-
     if (enableCustomColor && activeColor) {
       if (isGradientSegment) {
         return isGradientColor && !isWithinColors;
       }
-
       return !isGradientColor && !isWithinColors;
     }
-
     return false;
   }
-
   function isSelected(color) {
     return !isSelectedCustom() && activeColor === color;
   }
-
   function timingAnimation(property, toValue) {
     return Animated.timing(property, {
       toValue,
@@ -106,29 +95,24 @@ function ColorPalette({
       useNativeDriver: true
     });
   }
-
   function performAnimation(color) {
     if (!isSelected(color)) {
       opacity.setValue(0);
     }
-
     Animated.parallel([timingAnimation(scale, 2), timingAnimation(opacity, 1)]).start(() => {
       opacity.setValue(1);
       scale.setValue(1);
     });
   }
-
   const scaleInterpolation = scale.interpolate({
     inputRange: [1, 1.5, 2],
     outputRange: [1, 0.7, 1]
   });
-
   function deselectCustomGradient() {
     const {
       width
     } = Dimensions.get('window');
     const isVisible = contentWidth - scrollPosition - customIndicatorWidth < width;
-
     if (isCustomGradientColor) {
       if (!isIOS) {
         // Scroll position on Android doesn't adjust automatically when removing the last item from the horizontal list.
@@ -142,29 +126,23 @@ function ColorPalette({
       }
     }
   }
-
   function getColorGradientName(value) {
-    const fallbackName = sprintf(
-    /* translators: %s: the hex color value */
+    const fallbackName = sprintf( /* translators: %s: the hex color value */
     __('Unlabeled color. %s'), value);
     const foundColorName = isGradientSegment ? defaultSettings.gradients?.find(gradient => gradient.gradient === value) : defaultSettings.allColors?.find(color => color.color === value);
     return foundColorName ? foundColorName?.name : fallbackName;
   }
-
   function onColorPress(color) {
     deselectCustomGradient();
     performAnimation(color);
     setColor(color);
   }
-
   function onContentSizeChange(width) {
     contentWidth = width;
-
     if (isSelectedCustom() && scrollViewRef.current) {
       scrollToEndWithDelay();
     }
   }
-
   function scrollToEndWithDelay() {
     const delayedScroll = setTimeout(() => {
       scrollViewRef.current.scrollToEnd();
@@ -173,25 +151,21 @@ function ColorPalette({
       clearTimeout(delayedScroll);
     };
   }
-
   function onCustomIndicatorLayout({
     nativeEvent
   }) {
     const {
       width
     } = nativeEvent.layout;
-
     if (width !== customIndicatorWidth) {
       customIndicatorWidth = width;
     }
   }
-
   function onScroll({
     nativeEvent
   }) {
     scrollPosition = nativeEvent.contentOffset.x;
   }
-
   const verticalSeparatorStyle = usePreferredColorSchemeStyle(styles.verticalSeparator, styles.verticalSeparatorDark);
   const customTextStyle = usePreferredColorSchemeStyle([styles.customText, !isIOS && styles.customTextAndroid], styles.customTextDark);
   const customIndicatorWrapperStyle = [styles.customIndicatorWrapper, customIndicatorWrapperStyles];
@@ -260,6 +234,5 @@ function ColorPalette({
     style: customTextStyle
   }, isIOS ? customText : customText.toUpperCase()))))));
 }
-
 export default ColorPalette;
 //# sourceMappingURL=index.native.js.map

package/build-module/color-palette/index.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-palette/index.native.js"],"names":["ScrollView","TouchableWithoutFeedback","View","Animated","Easing","Dimensions","Platform","Text","__","sprintf","useRef","useEffect","usePreferredColorSchemeStyle","styles","ColorIndicator","colorsUtils","ANIMATION_DURATION","contentWidth","scrollPosition","customIndicatorWidth","ColorPalette","enableCustomColor","setColor","activeColor","isGradientColor","defaultSettings","currentSegment","onCustomPress","shouldEnableBottomSheetScroll","shouldShowCustomIndicatorOption","shouldShowCustomLabel","shouldShowCustomVerticalSeparator","customColorIndicatorStyles","customIndicatorWrapperStyles","label","customSwatchGradients","scrollViewRef","isIOS","OS","isGradientSegment","segments","scale","Value","current","opacity","defaultColors","Set","colors","map","color","mergedColors","allColors","defaultGradientColors","gradients","gradient","customIndicatorColor","isCustomGradientColor","isSelectedCustom","shouldShowCustomIndicator","accessibilityHint","customText","scrollToEndWithDelay","scrollTo","x","y","isWithinColors","includes","isSelected","timingAnimation","property","toValue","timing","duration","easing","ease","useNativeDriver","performAnimation","setValue","parallel","start","scaleInterpolation","interpolate","inputRange","outputRange","deselectCustomGradient","width","get","isVisible","getColorGradientName","value","fallbackName","foundColorName","find","name","onColorPress","onContentSizeChange","delayedScroll","setTimeout","scrollToEnd","clearTimeout","onCustomIndicatorLayout","nativeEvent","layout","onScroll","contentOffset","verticalSeparatorStyle","verticalSeparator","verticalSeparatorDark","customTextStyle","customTextAndroid","customTextDark","customIndicatorWrapperStyle","customIndicatorWrapper","headerText","contentContainer","scaleValue","colorName","selected","transform","colorIndicator","toUpperCase"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tScrollView,\n\tTouchableWithoutFeedback,\n\tView,\n\tAnimated,\n\tEasing,\n\tDimensions,\n\tPlatform,\n\tText,\n} from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useRef, useEffect } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\nimport ColorIndicator from '../color-indicator';\nimport { colorsUtils } from '../mobile/color-settings/utils';\n\nconst ANIMATION_DURATION = 200;\n\nlet contentWidth = 0;\nlet scrollPosition = 0;\nlet customIndicatorWidth = 0;\n\nfunction ColorPalette( {\n\tenableCustomColor = true,\n\tsetColor,\n\tactiveColor,\n\tisGradientColor,\n\tdefaultSettings,\n\tcurrentSegment,\n\tonCustomPress,\n\tshouldEnableBottomSheetScroll,\n\tshouldShowCustomIndicatorOption = true,\n\tshouldShowCustomLabel = true,\n\tshouldShowCustomVerticalSeparator = true,\n\tcustomColorIndicatorStyles,\n\tcustomIndicatorWrapperStyles,\n\tlabel,\n} ) {\n\tconst customSwatchGradients = [\n\t\t'linear-gradient(120deg, rgba(255,0,0,.8) 0%, rgba(255,255,255,1) 70.71%)',\n\t\t'linear-gradient(240deg, rgba(0,255,0,.8) 0%, rgba(0,255,0,0) 70.71%)',\n\t\t'linear-gradient(360deg, rgba(0,0,255,.8) 0%, rgba(0,0,255,0) 70.71%)',\n\t];\n\n\tconst scrollViewRef = useRef();\n\tconst isIOS = Platform.OS === 'ios';\n\n\tconst isGradientSegment = currentSegment === colorsUtils.segments[ 1 ];\n\n\tconst scale = useRef( new Animated.Value( 1 ) ).current;\n\tconst opacity = useRef( new Animated.Value( 1 ) ).current;\n\n\tconst defaultColors = [\n\t\t...new Set(\n\t\t\t( defaultSettings.colors ?? [] ).map( ( { color } ) => color )\n\t\t),\n\t];\n\tconst mergedColors = [\n\t\t...new Set(\n\t\t\t( defaultSettings.allColors ?? [] ).map( ( { color } ) => color )\n\t\t),\n\t];\n\tconst defaultGradientColors = [\n\t\t...new Set(\n\t\t\t( defaultSettings.gradients ?? [] ).map(\n\t\t\t\t( { gradient } ) => gradient\n\t\t\t)\n\t\t),\n\t];\n\tconst colors = isGradientSegment ? defaultGradientColors : defaultColors;\n\n\tconst customIndicatorColor = isGradientSegment\n\t\t? activeColor\n\t\t: customSwatchGradients;\n\tconst isCustomGradientColor = isGradientColor && isSelectedCustom();\n\tconst shouldShowCustomIndicator =\n\t\tenableCustomColor &&\n\t\tshouldShowCustomIndicatorOption &&\n\t\t( ! isGradientSegment || isCustomGradientColor );\n\n\tconst accessibilityHint = isGradientSegment\n\t\t? __( 'Navigates to customize the gradient' )\n\t\t: __( 'Navigates to custom color picker' );\n\tconst customText = __( 'Custom' );\n\n\tuseEffect( () => {\n\t\tif ( scrollViewRef.current ) {\n\t\t\tif ( isSelectedCustom() ) {\n\t\t\t\tscrollToEndWithDelay();\n\t\t\t} else {\n\t\t\t\tscrollViewRef.current.scrollTo( { x: 0, y: 0 } );\n\t\t\t}\n\t\t}\n\t\t// Temporarily disabling exhuastive-deps until the component can be refactored and updated safely.\n\t\t// Please see https://github.com/WordPress/gutenberg/pull/41253 for discussion and details.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ currentSegment ] );\n\n\tfunction isSelectedCustom() {\n\t\tconst isWithinColors =\n\t\t\tactiveColor && mergedColors && mergedColors.includes( activeColor );\n\t\tif ( enableCustomColor && activeColor ) {\n\t\t\tif ( isGradientSegment ) {\n\t\t\t\treturn isGradientColor && ! isWithinColors;\n\t\t\t}\n\t\t\treturn ! isGradientColor && ! isWithinColors;\n\t\t}\n\t\treturn false;\n\t}\n\n\tfunction isSelected( color ) {\n\t\treturn ! isSelectedCustom() && activeColor === color;\n\t}\n\n\tfunction timingAnimation( property, toValue ) {\n\t\treturn Animated.timing( property, {\n\t\t\ttoValue,\n\t\t\tduration: ANIMATION_DURATION,\n\t\t\teasing: Easing.ease,\n\t\t\tuseNativeDriver: true,\n\t\t} );\n\t}\n\n\tfunction performAnimation( color ) {\n\t\tif ( ! isSelected( color ) ) {\n\t\t\topacity.setValue( 0 );\n\t\t}\n\n\t\tAnimated.parallel( [\n\t\t\ttimingAnimation( scale, 2 ),\n\t\t\ttimingAnimation( opacity, 1 ),\n\t\t] ).start( () => {\n\t\t\topacity.setValue( 1 );\n\t\t\tscale.setValue( 1 );\n\t\t} );\n\t}\n\n\tconst scaleInterpolation = scale.interpolate( {\n\t\tinputRange: [ 1, 1.5, 2 ],\n\t\toutputRange: [ 1, 0.7, 1 ],\n\t} );\n\n\tfunction deselectCustomGradient() {\n\t\tconst { width } = Dimensions.get( 'window' );\n\t\tconst isVisible =\n\t\t\tcontentWidth - scrollPosition - customIndicatorWidth < width;\n\n\t\tif ( isCustomGradientColor ) {\n\t\t\tif ( ! isIOS ) {\n\t\t\t\t// Scroll position on Android doesn't adjust automatically when removing the last item from the horizontal list.\n\t\t\t\t// https://github.com/facebook/react-native/issues/27504\n\t\t\t\t// Workaround: Force the scroll when deselecting custom gradient color and when custom indicator is visible on layout.\n\t\t\t\tif (\n\t\t\t\t\tisCustomGradientColor &&\n\t\t\t\t\tisVisible &&\n\t\t\t\t\tscrollViewRef.current\n\t\t\t\t) {\n\t\t\t\t\tscrollViewRef.current.scrollTo( {\n\t\t\t\t\t\tx: scrollPosition - customIndicatorWidth,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tfunction getColorGradientName( value ) {\n\t\tconst fallbackName = sprintf(\n\t\t\t/* translators: %s: the hex color value */\n\t\t\t__( 'Unlabeled color. %s' ),\n\t\t\tvalue\n\t\t);\n\t\tconst foundColorName = isGradientSegment\n\t\t\t? defaultSettings.gradients?.find(\n\t\t\t\t\t( gradient ) => gradient.gradient === value\n\t\t\t  )\n\t\t\t: defaultSettings.allColors?.find(\n\t\t\t\t\t( color ) => color.color === value\n\t\t\t  );\n\t\treturn foundColorName ? foundColorName?.name : fallbackName;\n\t}\n\n\tfunction onColorPress( color ) {\n\t\tdeselectCustomGradient();\n\t\tperformAnimation( color );\n\t\tsetColor( color );\n\t}\n\n\tfunction onContentSizeChange( width ) {\n\t\tcontentWidth = width;\n\t\tif ( isSelectedCustom() && scrollViewRef.current ) {\n\t\t\tscrollToEndWithDelay();\n\t\t}\n\t}\n\n\tfunction scrollToEndWithDelay() {\n\t\tconst delayedScroll = setTimeout( () => {\n\t\t\tscrollViewRef.current.scrollToEnd();\n\t\t}, ANIMATION_DURATION );\n\t\treturn () => {\n\t\t\tclearTimeout( delayedScroll );\n\t\t};\n\t}\n\n\tfunction onCustomIndicatorLayout( { nativeEvent } ) {\n\t\tconst { width } = nativeEvent.layout;\n\t\tif ( width !== customIndicatorWidth ) {\n\t\t\tcustomIndicatorWidth = width;\n\t\t}\n\t}\n\n\tfunction onScroll( { nativeEvent } ) {\n\t\tscrollPosition = nativeEvent.contentOffset.x;\n\t}\n\n\tconst verticalSeparatorStyle = usePreferredColorSchemeStyle(\n\t\tstyles.verticalSeparator,\n\t\tstyles.verticalSeparatorDark\n\t);\n\n\tconst customTextStyle = usePreferredColorSchemeStyle(\n\t\t[ styles.customText, ! isIOS && styles.customTextAndroid ],\n\t\tstyles.customTextDark\n\t);\n\n\tconst customIndicatorWrapperStyle = [\n\t\tstyles.customIndicatorWrapper,\n\t\tcustomIndicatorWrapperStyles,\n\t];\n\n\treturn (\n\t\t<>\n\t\t\t{ label && (\n\t\t\t\t<Text accessibilityRole=\"header\" style={ styles.headerText }>\n\t\t\t\t\t{ label }\n\t\t\t\t</Text>\n\t\t\t) }\n\n\t\t\t<ScrollView\n\t\t\t\tcontentContainerStyle={ styles.contentContainer }\n\t\t\t\thorizontal\n\t\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\t\tkeyboardShouldPersistTaps=\"always\"\n\t\t\t\tdisableScrollViewPanResponder\n\t\t\t\tscrollEventThrottle={ 16 }\n\t\t\t\tonScroll={ onScroll }\n\t\t\t\tonContentSizeChange={ onContentSizeChange }\n\t\t\t\tonScrollBeginDrag={ () =>\n\t\t\t\t\tshouldEnableBottomSheetScroll( false )\n\t\t\t\t}\n\t\t\t\tonScrollEndDrag={ () => shouldEnableBottomSheetScroll( true ) }\n\t\t\t\tref={ scrollViewRef }\n\t\t\t\ttestID={ `color-palette${ label ? '-' + label : '' }` }\n\t\t\t>\n\t\t\t\t{ colors.map( ( color ) => {\n\t\t\t\t\tconst scaleValue = isSelected( color )\n\t\t\t\t\t\t? scaleInterpolation\n\t\t\t\t\t\t: 1;\n\t\t\t\t\tconst colorName = getColorGradientName( color );\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<View key={ `${ color }-${ isSelected( color ) }` }>\n\t\t\t\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\t\t\t\tonPress={ () => onColorPress( color ) }\n\t\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\t\taccessibilityState={ {\n\t\t\t\t\t\t\t\t\tselected: isSelected( color ),\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\taccessibilityHint={ color }\n\t\t\t\t\t\t\t\taccessibilityLabel={ colorName }\n\t\t\t\t\t\t\t\ttestID={ color }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Animated.View\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\ttransform: [\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\tscale: scaleValue,\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\t\t\tcolor={ color }\n\t\t\t\t\t\t\t\t\t\tisSelected={ isSelected( color ) }\n\t\t\t\t\t\t\t\t\t\topacity={ opacity }\n\t\t\t\t\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\t\t\t\t\tstyles.colorIndicator,\n\t\t\t\t\t\t\t\t\t\t\tcustomColorIndicatorStyles,\n\t\t\t\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Animated.View>\n\t\t\t\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t\t\t\t</View>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t\t{ shouldShowCustomIndicator && (\n\t\t\t\t\t<View\n\t\t\t\t\t\tstyle={ customIndicatorWrapperStyle }\n\t\t\t\t\t\tonLayout={ onCustomIndicatorLayout }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ shouldShowCustomVerticalSeparator && (\n\t\t\t\t\t\t\t<View style={ verticalSeparatorStyle } />\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\t\t\tonPress={ onCustomPress }\n\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\taccessibilityState={ {\n\t\t\t\t\t\t\t\tselected: isSelectedCustom(),\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\taccessibilityHint={ accessibilityHint }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<View style={ customIndicatorWrapperStyle }>\n\t\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\t\twithCustomPicker={ ! isGradientSegment }\n\t\t\t\t\t\t\t\t\tcolor={ customIndicatorColor }\n\t\t\t\t\t\t\t\t\tisSelected={ isSelectedCustom() }\n\t\t\t\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\t\t\t\tstyles.colorIndicator,\n\t\t\t\t\t\t\t\t\t\tcustomColorIndicatorStyles,\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\t{ shouldShowCustomLabel && (\n\t\t\t\t\t\t\t\t\t<Text style={ customTextStyle }>\n\t\t\t\t\t\t\t\t\t\t{ isIOS\n\t\t\t\t\t\t\t\t\t\t\t? customText\n\t\t\t\t\t\t\t\t\t\t\t: customText.toUpperCase() }\n\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t\t\t</View>\n\t\t\t\t) }\n\t\t\t</ScrollView>\n\t\t</>\n\t);\n}\n\nexport default ColorPalette;\n"]}
+{"version":3,"names":["ScrollView","TouchableWithoutFeedback","View","Animated","Easing","Dimensions","Platform","Text","__","sprintf","useRef","useEffect","usePreferredColorSchemeStyle","styles","ColorIndicator","colorsUtils","ANIMATION_DURATION","contentWidth","scrollPosition","customIndicatorWidth","ColorPalette","enableCustomColor","setColor","activeColor","isGradientColor","defaultSettings","currentSegment","onCustomPress","shouldEnableBottomSheetScroll","shouldShowCustomIndicatorOption","shouldShowCustomLabel","shouldShowCustomVerticalSeparator","customColorIndicatorStyles","customIndicatorWrapperStyles","label","_defaultSettings$colo","_defaultSettings$allC","_defaultSettings$grad","customSwatchGradients","scrollViewRef","isIOS","OS","isGradientSegment","segments","scale","Value","current","opacity","defaultColors","Set","colors","map","color","mergedColors","allColors","defaultGradientColors","gradients","gradient","customIndicatorColor","isCustomGradientColor","isSelectedCustom","shouldShowCustomIndicator","accessibilityHint","customText","scrollToEndWithDelay","scrollTo","x","y","isWithinColors","includes","isSelected","timingAnimation","property","toValue","timing","duration","easing","ease","useNativeDriver","performAnimation","setValue","parallel","start","scaleInterpolation","interpolate","inputRange","outputRange","deselectCustomGradient","width","get","isVisible","getColorGradientName","value","fallbackName","foundColorName","find","name","onColorPress","onContentSizeChange","delayedScroll","setTimeout","scrollToEnd","clearTimeout","onCustomIndicatorLayout","nativeEvent","layout","onScroll","contentOffset","verticalSeparatorStyle","verticalSeparator","verticalSeparatorDark","customTextStyle","customTextAndroid","customTextDark","customIndicatorWrapperStyle","customIndicatorWrapper","createElement","Fragment","accessibilityRole","style","headerText","contentContainerStyle","contentContainer","horizontal","showsHorizontalScrollIndicator","keyboardShouldPersistTaps","disableScrollViewPanResponder","scrollEventThrottle","onScrollBeginDrag","onScrollEndDrag","ref","testID","scaleValue","colorName","key","onPress","accessibilityState","selected","accessibilityLabel","transform","colorIndicator","onLayout","withCustomPicker","toUpperCase"],"sources":["@wordpress/components/src/color-palette/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tScrollView,\n\tTouchableWithoutFeedback,\n\tView,\n\tAnimated,\n\tEasing,\n\tDimensions,\n\tPlatform,\n\tText,\n} from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useRef, useEffect } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\nimport ColorIndicator from '../color-indicator';\nimport { colorsUtils } from '../mobile/color-settings/utils';\n\nconst ANIMATION_DURATION = 200;\n\nlet contentWidth = 0;\nlet scrollPosition = 0;\nlet customIndicatorWidth = 0;\n\nfunction ColorPalette( {\n\tenableCustomColor = true,\n\tsetColor,\n\tactiveColor,\n\tisGradientColor,\n\tdefaultSettings,\n\tcurrentSegment,\n\tonCustomPress,\n\tshouldEnableBottomSheetScroll,\n\tshouldShowCustomIndicatorOption = true,\n\tshouldShowCustomLabel = true,\n\tshouldShowCustomVerticalSeparator = true,\n\tcustomColorIndicatorStyles,\n\tcustomIndicatorWrapperStyles,\n\tlabel,\n} ) {\n\tconst customSwatchGradients = [\n\t\t'linear-gradient(120deg, rgba(255,0,0,.8) 0%, rgba(255,255,255,1) 70.71%)',\n\t\t'linear-gradient(240deg, rgba(0,255,0,.8) 0%, rgba(0,255,0,0) 70.71%)',\n\t\t'linear-gradient(360deg, rgba(0,0,255,.8) 0%, rgba(0,0,255,0) 70.71%)',\n\t];\n\n\tconst scrollViewRef = useRef();\n\tconst isIOS = Platform.OS === 'ios';\n\n\tconst isGradientSegment = currentSegment === colorsUtils.segments[ 1 ];\n\n\tconst scale = useRef( new Animated.Value( 1 ) ).current;\n\tconst opacity = useRef( new Animated.Value( 1 ) ).current;\n\n\tconst defaultColors = [\n\t\t...new Set(\n\t\t\t( defaultSettings.colors ?? [] ).map( ( { color } ) => color )\n\t\t),\n\t];\n\tconst mergedColors = [\n\t\t...new Set(\n\t\t\t( defaultSettings.allColors ?? [] ).map( ( { color } ) => color )\n\t\t),\n\t];\n\tconst defaultGradientColors = [\n\t\t...new Set(\n\t\t\t( defaultSettings.gradients ?? [] ).map(\n\t\t\t\t( { gradient } ) => gradient\n\t\t\t)\n\t\t),\n\t];\n\tconst colors = isGradientSegment ? defaultGradientColors : defaultColors;\n\n\tconst customIndicatorColor = isGradientSegment\n\t\t? activeColor\n\t\t: customSwatchGradients;\n\tconst isCustomGradientColor = isGradientColor && isSelectedCustom();\n\tconst shouldShowCustomIndicator =\n\t\tenableCustomColor &&\n\t\tshouldShowCustomIndicatorOption &&\n\t\t( ! isGradientSegment || isCustomGradientColor );\n\n\tconst accessibilityHint = isGradientSegment\n\t\t? __( 'Navigates to customize the gradient' )\n\t\t: __( 'Navigates to custom color picker' );\n\tconst customText = __( 'Custom' );\n\n\tuseEffect( () => {\n\t\tif ( scrollViewRef.current ) {\n\t\t\tif ( isSelectedCustom() ) {\n\t\t\t\tscrollToEndWithDelay();\n\t\t\t} else {\n\t\t\t\tscrollViewRef.current.scrollTo( { x: 0, y: 0 } );\n\t\t\t}\n\t\t}\n\t\t// Temporarily disabling exhuastive-deps until the component can be refactored and updated safely.\n\t\t// Please see https://github.com/WordPress/gutenberg/pull/41253 for discussion and details.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ currentSegment ] );\n\n\tfunction isSelectedCustom() {\n\t\tconst isWithinColors =\n\t\t\tactiveColor && mergedColors && mergedColors.includes( activeColor );\n\t\tif ( enableCustomColor && activeColor ) {\n\t\t\tif ( isGradientSegment ) {\n\t\t\t\treturn isGradientColor && ! isWithinColors;\n\t\t\t}\n\t\t\treturn ! isGradientColor && ! isWithinColors;\n\t\t}\n\t\treturn false;\n\t}\n\n\tfunction isSelected( color ) {\n\t\treturn ! isSelectedCustom() && activeColor === color;\n\t}\n\n\tfunction timingAnimation( property, toValue ) {\n\t\treturn Animated.timing( property, {\n\t\t\ttoValue,\n\t\t\tduration: ANIMATION_DURATION,\n\t\t\teasing: Easing.ease,\n\t\t\tuseNativeDriver: true,\n\t\t} );\n\t}\n\n\tfunction performAnimation( color ) {\n\t\tif ( ! isSelected( color ) ) {\n\t\t\topacity.setValue( 0 );\n\t\t}\n\n\t\tAnimated.parallel( [\n\t\t\ttimingAnimation( scale, 2 ),\n\t\t\ttimingAnimation( opacity, 1 ),\n\t\t] ).start( () => {\n\t\t\topacity.setValue( 1 );\n\t\t\tscale.setValue( 1 );\n\t\t} );\n\t}\n\n\tconst scaleInterpolation = scale.interpolate( {\n\t\tinputRange: [ 1, 1.5, 2 ],\n\t\toutputRange: [ 1, 0.7, 1 ],\n\t} );\n\n\tfunction deselectCustomGradient() {\n\t\tconst { width } = Dimensions.get( 'window' );\n\t\tconst isVisible =\n\t\t\tcontentWidth - scrollPosition - customIndicatorWidth < width;\n\n\t\tif ( isCustomGradientColor ) {\n\t\t\tif ( ! isIOS ) {\n\t\t\t\t// Scroll position on Android doesn't adjust automatically when removing the last item from the horizontal list.\n\t\t\t\t// https://github.com/facebook/react-native/issues/27504\n\t\t\t\t// Workaround: Force the scroll when deselecting custom gradient color and when custom indicator is visible on layout.\n\t\t\t\tif (\n\t\t\t\t\tisCustomGradientColor &&\n\t\t\t\t\tisVisible &&\n\t\t\t\t\tscrollViewRef.current\n\t\t\t\t) {\n\t\t\t\t\tscrollViewRef.current.scrollTo( {\n\t\t\t\t\t\tx: scrollPosition - customIndicatorWidth,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tfunction getColorGradientName( value ) {\n\t\tconst fallbackName = sprintf(\n\t\t\t/* translators: %s: the hex color value */\n\t\t\t__( 'Unlabeled color. %s' ),\n\t\t\tvalue\n\t\t);\n\t\tconst foundColorName = isGradientSegment\n\t\t\t? defaultSettings.gradients?.find(\n\t\t\t\t\t( gradient ) => gradient.gradient === value\n\t\t\t  )\n\t\t\t: defaultSettings.allColors?.find(\n\t\t\t\t\t( color ) => color.color === value\n\t\t\t  );\n\t\treturn foundColorName ? foundColorName?.name : fallbackName;\n\t}\n\n\tfunction onColorPress( color ) {\n\t\tdeselectCustomGradient();\n\t\tperformAnimation( color );\n\t\tsetColor( color );\n\t}\n\n\tfunction onContentSizeChange( width ) {\n\t\tcontentWidth = width;\n\t\tif ( isSelectedCustom() && scrollViewRef.current ) {\n\t\t\tscrollToEndWithDelay();\n\t\t}\n\t}\n\n\tfunction scrollToEndWithDelay() {\n\t\tconst delayedScroll = setTimeout( () => {\n\t\t\tscrollViewRef.current.scrollToEnd();\n\t\t}, ANIMATION_DURATION );\n\t\treturn () => {\n\t\t\tclearTimeout( delayedScroll );\n\t\t};\n\t}\n\n\tfunction onCustomIndicatorLayout( { nativeEvent } ) {\n\t\tconst { width } = nativeEvent.layout;\n\t\tif ( width !== customIndicatorWidth ) {\n\t\t\tcustomIndicatorWidth = width;\n\t\t}\n\t}\n\n\tfunction onScroll( { nativeEvent } ) {\n\t\tscrollPosition = nativeEvent.contentOffset.x;\n\t}\n\n\tconst verticalSeparatorStyle = usePreferredColorSchemeStyle(\n\t\tstyles.verticalSeparator,\n\t\tstyles.verticalSeparatorDark\n\t);\n\n\tconst customTextStyle = usePreferredColorSchemeStyle(\n\t\t[ styles.customText, ! isIOS && styles.customTextAndroid ],\n\t\tstyles.customTextDark\n\t);\n\n\tconst customIndicatorWrapperStyle = [\n\t\tstyles.customIndicatorWrapper,\n\t\tcustomIndicatorWrapperStyles,\n\t];\n\n\treturn (\n\t\t<>\n\t\t\t{ label && (\n\t\t\t\t<Text accessibilityRole=\"header\" style={ styles.headerText }>\n\t\t\t\t\t{ label }\n\t\t\t\t</Text>\n\t\t\t) }\n\n\t\t\t<ScrollView\n\t\t\t\tcontentContainerStyle={ styles.contentContainer }\n\t\t\t\thorizontal\n\t\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\t\tkeyboardShouldPersistTaps=\"always\"\n\t\t\t\tdisableScrollViewPanResponder\n\t\t\t\tscrollEventThrottle={ 16 }\n\t\t\t\tonScroll={ onScroll }\n\t\t\t\tonContentSizeChange={ onContentSizeChange }\n\t\t\t\tonScrollBeginDrag={ () =>\n\t\t\t\t\tshouldEnableBottomSheetScroll( false )\n\t\t\t\t}\n\t\t\t\tonScrollEndDrag={ () => shouldEnableBottomSheetScroll( true ) }\n\t\t\t\tref={ scrollViewRef }\n\t\t\t\ttestID={ `color-palette${ label ? '-' + label : '' }` }\n\t\t\t>\n\t\t\t\t{ colors.map( ( color ) => {\n\t\t\t\t\tconst scaleValue = isSelected( color )\n\t\t\t\t\t\t? scaleInterpolation\n\t\t\t\t\t\t: 1;\n\t\t\t\t\tconst colorName = getColorGradientName( color );\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<View key={ `${ color }-${ isSelected( color ) }` }>\n\t\t\t\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\t\t\t\tonPress={ () => onColorPress( color ) }\n\t\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\t\taccessibilityState={ {\n\t\t\t\t\t\t\t\t\tselected: isSelected( color ),\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\taccessibilityHint={ color }\n\t\t\t\t\t\t\t\taccessibilityLabel={ colorName }\n\t\t\t\t\t\t\t\ttestID={ color }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Animated.View\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\ttransform: [\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\tscale: scaleValue,\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\t\t\tcolor={ color }\n\t\t\t\t\t\t\t\t\t\tisSelected={ isSelected( color ) }\n\t\t\t\t\t\t\t\t\t\topacity={ opacity }\n\t\t\t\t\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\t\t\t\t\tstyles.colorIndicator,\n\t\t\t\t\t\t\t\t\t\t\tcustomColorIndicatorStyles,\n\t\t\t\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Animated.View>\n\t\t\t\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t\t\t\t</View>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t\t{ shouldShowCustomIndicator && (\n\t\t\t\t\t<View\n\t\t\t\t\t\tstyle={ customIndicatorWrapperStyle }\n\t\t\t\t\t\tonLayout={ onCustomIndicatorLayout }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ shouldShowCustomVerticalSeparator && (\n\t\t\t\t\t\t\t<View style={ verticalSeparatorStyle } />\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\t\t\tonPress={ onCustomPress }\n\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\taccessibilityState={ {\n\t\t\t\t\t\t\t\tselected: isSelectedCustom(),\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\taccessibilityHint={ accessibilityHint }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<View style={ customIndicatorWrapperStyle }>\n\t\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\t\twithCustomPicker={ ! isGradientSegment }\n\t\t\t\t\t\t\t\t\tcolor={ customIndicatorColor }\n\t\t\t\t\t\t\t\t\tisSelected={ isSelectedCustom() }\n\t\t\t\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\t\t\t\tstyles.colorIndicator,\n\t\t\t\t\t\t\t\t\t\tcustomColorIndicatorStyles,\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\t{ shouldShowCustomLabel && (\n\t\t\t\t\t\t\t\t\t<Text style={ customTextStyle }>\n\t\t\t\t\t\t\t\t\t\t{ isIOS\n\t\t\t\t\t\t\t\t\t\t\t? customText\n\t\t\t\t\t\t\t\t\t\t\t: customText.toUpperCase() }\n\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t\t\t</View>\n\t\t\t\t) }\n\t\t\t</ScrollView>\n\t\t</>\n\t);\n}\n\nexport default ColorPalette;\n"],"mappings":"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"}

package/build-module/color-palette/styles.js

@@ -1,7 +1,5 @@
 import _styled from "@emotion/styled/base";
-
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
-
 /**
  * External dependencies
  */

package/build-module/color-palette/styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-palette/styles.ts"],"names":["Heading","ColorHeading"],"mappings":";;;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,OAAT,QAAwB,YAAxB;AAEA,OAAO,MAAMC,YAAY,GAAG,qBAAQD,OAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB","sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { Heading } from '../heading';\n\nexport const ColorHeading = styled( Heading )`\n\ttext-transform: uppercase;\n\tline-height: 24px;\n\tfont-weight: 500;\n\t&&& {\n\t\tfont-size: 11px;\n\t\tmargin-bottom: 0;\n\t}\n`;\n"]}
+{"version":3,"names":["Heading","ColorHeading","_styled","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__"],"sources":["@wordpress/components/src/color-palette/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { Heading } from '../heading';\n\nexport const ColorHeading = styled( Heading )`\n\ttext-transform: uppercase;\n\tline-height: 24px;\n\tfont-weight: 500;\n\t&&& {\n\t\tfont-size: 11px;\n\t\tmargin-bottom: 0;\n\t}\n`;\n"],"mappings":";;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,OAAO,QAAQ,YAAY;AAEpC,OAAO,MAAMC,YAAY,GAAG,aAAAC,OAAA,CAAQF,OAAO,EAAAG,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA,EAQ5C"}

package/build-module/color-palette/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}
+{"version":3,"names":[],"sources":["@wordpress/components/src/color-palette/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties, ReactNode } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { DropdownProps } from '../dropdown/types';\nimport type { HeadingSize } from '../heading/types';\n\nexport type ColorObject = {\n\tname: string;\n\tcolor: NonNullable< CSSProperties[ 'color' ] >;\n};\n\nexport type PaletteObject = {\n\tname: string;\n\tcolors: ColorObject[];\n};\n\ntype PaletteProps = {\n\tclassName?: string;\n\tclearColor: () => void;\n\t/**\n\t * Callback called when a color is selected.\n\t */\n\tonChange: ( newColor?: string, index?: number ) => void;\n\tvalue?: string;\n\tactions?: ReactNode;\n\theadingLevel?: HeadingSize;\n};\n\nexport type SinglePaletteProps = PaletteProps & {\n\tcolors: ColorObject[];\n};\n\nexport type MultiplePalettesProps = PaletteProps & {\n\tcolors: PaletteObject[];\n};\n\nexport type CustomColorPickerDropdownProps = DropdownProps & {\n\tisRenderedInSidebar: boolean;\n};\n\nexport type ColorPaletteProps = Pick< PaletteProps, 'onChange' > & {\n\t/**\n\t * Whether the palette should have a clearing button.\n\t *\n\t * @default true\n\t */\n\tclearable?: boolean;\n\t/**\n\t * Array with the colors to be shown. When displaying multiple color palettes\n\t * to choose from, the format of the array changes from an array of colors\n\t * objects, to an array of color palettes.\n\t *\n\t * @default []\n\t */\n\tcolors?: PaletteObject[] | ColorObject[];\n\t/**\n\t * Whether to allow the user to pick a custom color on top of the predefined\n\t * choices (defined via the `colors` prop).\n\t *\n\t * @default false\n\t */\n\tdisableCustomColors?: boolean;\n\t/**\n\t * This controls whether the alpha channel will be offered when selecting\n\t * custom colors.\n\t *\n\t * @default false\n\t */\n\tenableAlpha?: boolean;\n\t/**\n\t * The heading level.\n\t *\n\t * @default 2\n\t */\n\theadingLevel?: HeadingSize;\n\t/**\n\t * Currently active value.\n\t */\n\tvalue?: string;\n\t/**\n\t * Whether this is rendered in the sidebar.\n\t *\n\t * @default false\n\t */\n\t__experimentalIsRenderedInSidebar?: boolean;\n};\n"],"mappings":""}

package/build-module/color-palette/utils.js

@@ -4,11 +4,12 @@
 import { colord, extend } from 'colord';
 import namesPlugin from 'colord/plugins/names';
 import a11yPlugin from 'colord/plugins/a11y';
+
 /**
  * WordPress dependencies
  */
-
 import { __ } from '@wordpress/i18n';
+
 /**
  * Internal dependencies
  */
@@ -18,14 +19,14 @@ export const extractColorNameFromCurrentValue = (currentValue, colors = [], show
   if (!currentValue) {
     return '';
   }
-
   const currentValueIsCssVariable = /^var\(/.test(currentValue);
-  const normalizedCurrentValue = currentValueIsCssVariable ? currentValue : colord(currentValue).toHex(); // Normalize format of `colors` to simplify the following loop
+  const normalizedCurrentValue = currentValueIsCssVariable ? currentValue : colord(currentValue).toHex();
+
+  // Normalize format of `colors` to simplify the following loop
 
   const colorPalettes = showMultiplePalettes ? colors : [{
     colors: colors
   }];
-
   for (const {
     colors: paletteColors
   } of colorPalettes) {
@@ -34,29 +35,23 @@ export const extractColorNameFromCurrentValue = (currentValue, colors = [], show
       color: colorValue
     } of paletteColors) {
       const normalizedColorValue = currentValueIsCssVariable ? colorValue : colord(colorValue).toHex();
-
       if (normalizedCurrentValue === normalizedColorValue) {
         return colorName;
       }
     }
-  } // translators: shown when the user has picked a custom color (i.e not in the palette of colors).
-
+  }
 
+  // translators: shown when the user has picked a custom color (i.e not in the palette of colors).
   return __('Custom');
 };
-export const showTransparentBackground = currentValue => {
-  if (typeof currentValue === 'undefined') {
-    return true;
-  }
 
-  return colord(currentValue).alpha() === 0;
-}; // The PaletteObject type has a `colors` property (an array of ColorObject),
+// The PaletteObject type has a `colors` property (an array of ColorObject),
 // while the ColorObject type has a `color` property (the CSS color value).
-
 export const isMultiplePaletteObject = obj => Array.isArray(obj.colors) && !('color' in obj);
 export 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.
  *
@@ -64,14 +59,11 @@ export const isMultiplePaletteArray = arr => {
  * @param element The element for which to get the computed style.
  * @return The background color value computed from a element.
  */
-
 export const normalizeColorValue = (value, element) => {
   const currentValueIsCssVariable = /^var\(/.test(value !== null && value !== void 0 ? value : '');
-
   if (!currentValueIsCssVariable || element === null) {
     return value;
   }
-
   const {
     ownerDocument
   } = element;

package/build-module/color-palette/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-palette/utils.ts"],"names":["colord","extend","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":"AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,MAAjB,QAA+B,QAA/B;AACA,OAAOC,WAAP,MAAwB,sBAAxB;AACA,OAAOC,UAAP,MAAuB,qBAAvB;AAEA;AACA;AACA;;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AAGAH,MAAM,CAAE,CAAEC,WAAF,EAAeC,UAAf,CAAF,CAAN;AAEA,OAAO,MAAME,gCAAgC,GAAG,CAC/CC,YAD+C,EAE/CC,MAAqC,GAAG,EAFO,EAG/CC,oBAA6B,GAAG,KAHe,KAI3C;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,GAErDN,MAAM,CAAEM,YAAF,CAAN,CAAuBM,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,GAEnDlB,MAAM,CAAEkB,UAAF,CAAN,CAAqBN,KAArB,EAFH;;AAIA,UAAKD,sBAAsB,KAAKQ,oBAAhC,EAAuD;AACtD,eAAOH,SAAP;AACA;AACD;AACD,GAzBG,CA2BJ;;;AACA,SAAOZ,EAAE,CAAE,QAAF,CAAT;AACA,CAjCM;AAmCP,OAAO,MAAMgB,yBAAyB,GAAKd,YAAF,IAA6B;AACrE,MAAK,OAAOA,YAAP,KAAwB,WAA7B,EAA2C;AAC1C,WAAO,IAAP;AACA;;AACD,SAAON,MAAM,CAAEM,YAAF,CAAN,CAAuBe,KAAvB,OAAmC,CAA1C;AACA,CALM,C,CAOP;AACA;;AACA,OAAO,MAAMC,uBAAuB,GACnCC,GADsC,IAGtCC,KAAK,CAACC,OAAN,CAAiBF,GAAF,CAAyBhB,MAAxC,KAAoD,EAAI,WAAWgB,GAAf,CAH9C;AAKP,OAAO,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;;AACA,OAAO,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,WAAW,EAAEE,gBAAb,CAA+BJ,OAA/B,EAAyCK,eAD1C;AAGA,SAAOF,uBAAuB,GAC3BpC,MAAM,CAAEoC,uBAAF,CAAN,CAAkCxB,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"]}
+{"version":3,"names":["colord","extend","namesPlugin","a11yPlugin","__","extractColorNameFromCurrentValue","currentValue","colors","showMultiplePalettes","currentValueIsCssVariable","test","normalizedCurrentValue","toHex","colorPalettes","paletteColors","name","colorName","color","colorValue","normalizedColorValue","isMultiplePaletteObject","obj","Array","isArray","isMultiplePaletteArray","arr","length","every","colorObj","normalizeColorValue","value","element","ownerDocument","defaultView","computedBackgroundColor","getComputedStyle","backgroundColor"],"sources":["@wordpress/components/src/color-palette/utils.ts"],"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\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"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,MAAM,EAAEC,MAAM,QAAQ,QAAQ;AACvC,OAAOC,WAAW,MAAM,sBAAsB;AAC9C,OAAOC,UAAU,MAAM,qBAAqB;;AAE5C;AACA;AACA;AACA,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;;AAGAH,MAAM,CAAE,CAAEC,WAAW,EAAEC,UAAU,CAAG,CAAC;AAErC,OAAO,MAAME,gCAAgC,GAAGA,CAC/CC,YAA2C,EAC3CC,MAAqC,GAAG,EAAE,EAC1CC,oBAA6B,GAAG,KAAK,KACjC;EACJ,IAAK,CAAEF,YAAY,EAAG;IACrB,OAAO,EAAE;EACV;EAEA,MAAMG,yBAAyB,GAAG,QAAQ,CAACC,IAAI,CAAEJ,YAAa,CAAC;EAC/D,MAAMK,sBAAsB,GAAGF,yBAAyB,GACrDH,YAAY,GACZN,MAAM,CAAEM,YAAa,CAAC,CAACM,KAAK,CAAC,CAAC;;EAEjC;;EAEA,MAAMC,aAAwC,GAAGL,oBAAoB,GAChED,MAAM,GACR,CAAE;IAAEA,MAAM,EAAEA;EAAwB,CAAC,CAAE;EAC1C,KAAM,MAAM;IAAEA,MAAM,EAAEO;EAAc,CAAC,IAAID,aAAa,EAAG;IACxD,KAAM,MAAM;MAAEE,IAAI,EAAEC,SAAS;MAAEC,KAAK,EAAEC;IAAW,CAAC,IAAIJ,aAAa,EAAG;MACrE,MAAMK,oBAAoB,GAAGV,yBAAyB,GACnDS,UAAU,GACVlB,MAAM,CAAEkB,UAAW,CAAC,CAACN,KAAK,CAAC,CAAC;MAE/B,IAAKD,sBAAsB,KAAKQ,oBAAoB,EAAG;QACtD,OAAOH,SAAS;MACjB;IACD;EACD;;EAEA;EACA,OAAOZ,EAAE,CAAE,QAAS,CAAC;AACtB,CAAC;;AAED;AACA;AACA,OAAO,MAAMgB,uBAAuB,GACnCC,GAAgC,IAEhCC,KAAK,CAACC,OAAO,CAAIF,GAAG,CAAoBd,MAAO,CAAC,IAAI,EAAI,OAAO,IAAIc,GAAG,CAAE;AAEzE,OAAO,MAAMG,sBAAsB,GAClCC,GAAsC,IACV;EAC5B,OACCA,GAAG,CAACC,MAAM,GAAG,CAAC,IACdD,GAAG,CAACE,KAAK,CAAIC,QAAQ,IAAMR,uBAAuB,CAAEQ,QAAS,CAAE,CAAC;AAElE,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,mBAAmB,GAAGA,CAClCC,KAAyB,EACzBC,OAA2B,KACvB;EACJ,MAAMtB,yBAAyB,GAAG,QAAQ,CAACC,IAAI,CAAEoB,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAG,CAAC;EAE9D,IAAK,CAAErB,yBAAyB,IAAIsB,OAAO,KAAK,IAAI,EAAG;IACtD,OAAOD,KAAK;EACb;EAEA,MAAM;IAAEE;EAAc,CAAC,GAAGD,OAAO;EACjC,MAAM;IAAEE;EAAY,CAAC,GAAGD,aAAa;EACrC,MAAME,uBAAuB,GAC5BD,WAAW,EAAEE,gBAAgB,CAAEJ,OAAQ,CAAC,CAACK,eAAe;EAEzD,OAAOF,uBAAuB,GAC3BlC,MAAM,CAAEkC,uBAAwB,CAAC,CAACtB,KAAK,CAAC,CAAC,GACzCkB,KAAK;AACT,CAAC"}

package/build-module/color-picker/color-copy-button.js

@@ -1,5 +1,4 @@
 import { createElement } from "@wordpress/element";
-
 /**
  * WordPress dependencies
  */
@@ -7,10 +6,10 @@ import { useCopyToClipboard } from '@wordpress/compose';
 import { useState, useEffect, useRef } from '@wordpress/element';
 import { copy } from '@wordpress/icons';
 import { __ } from '@wordpress/i18n';
+
 /**
  * Internal dependencies
  */
-
 import { CopyButton } from './styles';
 import { Text } from '../text';
 import { Tooltip } from '../ui/tooltip';
@@ -27,12 +26,10 @@ export const ColorCopyButton = props => {
         {
           return color.toHslString();
         }
-
       case 'rgb':
         {
           return color.toRgbString();
         }
-
       default:
       case 'hex':
         {
@@ -43,7 +40,6 @@ export const ColorCopyButton = props => {
     if (copyTimer.current) {
       clearTimeout(copyTimer.current);
     }
-
     setCopiedColor(color.toHex());
     copyTimer.current = setTimeout(() => {
       setCopiedColor(null);

package/build-module/color-picker/color-copy-button.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-picker/color-copy-button.tsx"],"names":["useCopyToClipboard","useState","useEffect","useRef","copy","__","CopyButton","Text","Tooltip","ColorCopyButton","props","color","colorType","copiedColor","setCopiedColor","copyTimer","copyRef","toHslString","toRgbString","toHex","current","clearTimeout","setTimeout","undefined"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,kBAAT,QAAmC,oBAAnC;AACA,SAASC,QAAT,EAAmBC,SAAnB,EAA8BC,MAA9B,QAA4C,oBAA5C;AACA,SAASC,IAAT,QAAqB,kBAArB;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,SAASC,UAAT,QAA2B,UAA3B;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,OAAT,QAAwB,eAAxB;AAIA,OAAO,MAAMC,eAAe,GAAKC,KAAF,IAAmC;AACjE,QAAM;AAAEC,IAAAA,KAAF;AAASC,IAAAA;AAAT,MAAuBF,KAA7B;AACA,QAAM,CAAEG,WAAF,EAAeC,cAAf,IAAkCb,QAAQ,CAAmB,IAAnB,CAAhD;AACA,QAAMc,SAAS,GAAGZ,MAAM,EAAxB;AACA,QAAMa,OAAO,GAAGhB,kBAAkB,CACjC,MAAM;AACL,YAASY,SAAT;AACC,WAAK,KAAL;AAAY;AACX,iBAAOD,KAAK,CAACM,WAAN,EAAP;AACA;;AACD,WAAK,KAAL;AAAY;AACX,iBAAON,KAAK,CAACO,WAAN,EAAP;AACA;;AACD;AACA,WAAK,KAAL;AAAY;AACX,iBAAOP,KAAK,CAACQ,KAAN,EAAP;AACA;AAVF;AAYA,GAdgC,EAejC,MAAM;AACL,QAAKJ,SAAS,CAACK,OAAf,EAAyB;AACxBC,MAAAA,YAAY,CAAEN,SAAS,CAACK,OAAZ,CAAZ;AACA;;AACDN,IAAAA,cAAc,CAAEH,KAAK,CAACQ,KAAN,EAAF,CAAd;AACAJ,IAAAA,SAAS,CAACK,OAAV,GAAoBE,UAAU,CAAE,MAAM;AACrCR,MAAAA,cAAc,CAAE,IAAF,CAAd;AACAC,MAAAA,SAAS,CAACK,OAAV,GAAoBG,SAApB;AACA,KAH6B,EAG3B,IAH2B,CAA9B;AAIA,GAxBgC,CAAlC;AA0BArB,EAAAA,SAAS,CAAE,MAAM;AAChB;AACA,WAAO,MAAM;AACZ,UAAKa,SAAS,CAACK,OAAf,EAAyB;AACxBC,QAAAA,YAAY,CAAEN,SAAS,CAACK,OAAZ,CAAZ;AACA;AACD,KAJD;AAKA,GAPQ,EAON,EAPM,CAAT;AASA,SACC,cAAC,OAAD;AACC,IAAA,OAAO,EACN,cAAC,IAAD;AAAM,MAAA,KAAK,EAAC;AAAZ,OACGP,WAAW,KAAKF,KAAK,CAACQ,KAAN,EAAhB,GACCd,EAAE,CAAE,SAAF,CADH,GAECA,EAAE,CAAE,MAAF,CAHN,CAFF;AAQC,IAAA,SAAS,EAAC;AARX,KAUC,cAAC,UAAD;AACC,IAAA,OAAO,MADR;AAEC,IAAA,GAAG,EAAGW,OAFP;AAGC,IAAA,IAAI,EAAGZ,IAHR;AAIC,IAAA,WAAW,EAAG;AAJf,IAVD,CADD;AAmBA,CA1DM","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCopyToClipboard } from '@wordpress/compose';\nimport { useState, useEffect, useRef } from '@wordpress/element';\nimport { copy } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { CopyButton } from './styles';\nimport { Text } from '../text';\nimport { Tooltip } from '../ui/tooltip';\n\nimport type { ColorCopyButtonProps } from './types';\n\nexport const ColorCopyButton = ( props: ColorCopyButtonProps ) => {\n\tconst { color, colorType } = props;\n\tconst [ copiedColor, setCopiedColor ] = useState< string | null >( null );\n\tconst copyTimer = useRef< ReturnType< typeof setTimeout > | undefined >();\n\tconst copyRef = useCopyToClipboard< HTMLDivElement >(\n\t\t() => {\n\t\t\tswitch ( colorType ) {\n\t\t\t\tcase 'hsl': {\n\t\t\t\t\treturn color.toHslString();\n\t\t\t\t}\n\t\t\t\tcase 'rgb': {\n\t\t\t\t\treturn color.toRgbString();\n\t\t\t\t}\n\t\t\t\tdefault:\n\t\t\t\tcase 'hex': {\n\t\t\t\t\treturn color.toHex();\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t() => {\n\t\t\tif ( copyTimer.current ) {\n\t\t\t\tclearTimeout( copyTimer.current );\n\t\t\t}\n\t\t\tsetCopiedColor( color.toHex() );\n\t\t\tcopyTimer.current = setTimeout( () => {\n\t\t\t\tsetCopiedColor( null );\n\t\t\t\tcopyTimer.current = undefined;\n\t\t\t}, 3000 );\n\t\t}\n\t);\n\tuseEffect( () => {\n\t\t// Clear copyTimer on component unmount.\n\t\treturn () => {\n\t\t\tif ( copyTimer.current ) {\n\t\t\t\tclearTimeout( copyTimer.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Tooltip\n\t\t\tcontent={\n\t\t\t\t<Text color=\"white\">\n\t\t\t\t\t{ copiedColor === color.toHex()\n\t\t\t\t\t\t? __( 'Copied!' )\n\t\t\t\t\t\t: __( 'Copy' ) }\n\t\t\t\t</Text>\n\t\t\t}\n\t\t\tplacement=\"bottom\"\n\t\t>\n\t\t\t<CopyButton\n\t\t\t\tisSmall\n\t\t\t\tref={ copyRef }\n\t\t\t\ticon={ copy }\n\t\t\t\tshowTooltip={ false }\n\t\t\t/>\n\t\t</Tooltip>\n\t);\n};\n"]}
+{"version":3,"names":["useCopyToClipboard","useState","useEffect","useRef","copy","__","CopyButton","Text","Tooltip","ColorCopyButton","props","color","colorType","copiedColor","setCopiedColor","copyTimer","copyRef","toHslString","toRgbString","toHex","current","clearTimeout","setTimeout","undefined","createElement","content","placement","isSmall","ref","icon","showTooltip"],"sources":["@wordpress/components/src/color-picker/color-copy-button.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCopyToClipboard } from '@wordpress/compose';\nimport { useState, useEffect, useRef } from '@wordpress/element';\nimport { copy } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { CopyButton } from './styles';\nimport { Text } from '../text';\nimport { Tooltip } from '../ui/tooltip';\n\nimport type { ColorCopyButtonProps } from './types';\n\nexport const ColorCopyButton = ( props: ColorCopyButtonProps ) => {\n\tconst { color, colorType } = props;\n\tconst [ copiedColor, setCopiedColor ] = useState< string | null >( null );\n\tconst copyTimer = useRef< ReturnType< typeof setTimeout > | undefined >();\n\tconst copyRef = useCopyToClipboard< HTMLDivElement >(\n\t\t() => {\n\t\t\tswitch ( colorType ) {\n\t\t\t\tcase 'hsl': {\n\t\t\t\t\treturn color.toHslString();\n\t\t\t\t}\n\t\t\t\tcase 'rgb': {\n\t\t\t\t\treturn color.toRgbString();\n\t\t\t\t}\n\t\t\t\tdefault:\n\t\t\t\tcase 'hex': {\n\t\t\t\t\treturn color.toHex();\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t() => {\n\t\t\tif ( copyTimer.current ) {\n\t\t\t\tclearTimeout( copyTimer.current );\n\t\t\t}\n\t\t\tsetCopiedColor( color.toHex() );\n\t\t\tcopyTimer.current = setTimeout( () => {\n\t\t\t\tsetCopiedColor( null );\n\t\t\t\tcopyTimer.current = undefined;\n\t\t\t}, 3000 );\n\t\t}\n\t);\n\tuseEffect( () => {\n\t\t// Clear copyTimer on component unmount.\n\t\treturn () => {\n\t\t\tif ( copyTimer.current ) {\n\t\t\t\tclearTimeout( copyTimer.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Tooltip\n\t\t\tcontent={\n\t\t\t\t<Text color=\"white\">\n\t\t\t\t\t{ copiedColor === color.toHex()\n\t\t\t\t\t\t? __( 'Copied!' )\n\t\t\t\t\t\t: __( 'Copy' ) }\n\t\t\t\t</Text>\n\t\t\t}\n\t\t\tplacement=\"bottom\"\n\t\t>\n\t\t\t<CopyButton\n\t\t\t\tisSmall\n\t\t\t\tref={ copyRef }\n\t\t\t\ticon={ copy }\n\t\t\t\tshowTooltip={ false }\n\t\t\t/>\n\t\t</Tooltip>\n\t);\n};\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,kBAAkB,QAAQ,oBAAoB;AACvD,SAASC,QAAQ,EAAEC,SAAS,EAAEC,MAAM,QAAQ,oBAAoB;AAChE,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,SAASC,UAAU,QAAQ,UAAU;AACrC,SAASC,IAAI,QAAQ,SAAS;AAC9B,SAASC,OAAO,QAAQ,eAAe;AAIvC,OAAO,MAAMC,eAAe,GAAKC,KAA2B,IAAM;EACjE,MAAM;IAAEC,KAAK;IAAEC;EAAU,CAAC,GAAGF,KAAK;EAClC,MAAM,CAAEG,WAAW,EAAEC,cAAc,CAAE,GAAGb,QAAQ,CAAmB,IAAK,CAAC;EACzE,MAAMc,SAAS,GAAGZ,MAAM,CAAgD,CAAC;EACzE,MAAMa,OAAO,GAAGhB,kBAAkB,CACjC,MAAM;IACL,QAASY,SAAS;MACjB,KAAK,KAAK;QAAE;UACX,OAAOD,KAAK,CAACM,WAAW,CAAC,CAAC;QAC3B;MACA,KAAK,KAAK;QAAE;UACX,OAAON,KAAK,CAACO,WAAW,CAAC,CAAC;QAC3B;MACA;MACA,KAAK,KAAK;QAAE;UACX,OAAOP,KAAK,CAACQ,KAAK,CAAC,CAAC;QACrB;IACD;EACD,CAAC,EACD,MAAM;IACL,IAAKJ,SAAS,CAACK,OAAO,EAAG;MACxBC,YAAY,CAAEN,SAAS,CAACK,OAAQ,CAAC;IAClC;IACAN,cAAc,CAAEH,KAAK,CAACQ,KAAK,CAAC,CAAE,CAAC;IAC/BJ,SAAS,CAACK,OAAO,GAAGE,UAAU,CAAE,MAAM;MACrCR,cAAc,CAAE,IAAK,CAAC;MACtBC,SAAS,CAACK,OAAO,GAAGG,SAAS;IAC9B,CAAC,EAAE,IAAK,CAAC;EACV,CACD,CAAC;EACDrB,SAAS,CAAE,MAAM;IAChB;IACA,OAAO,MAAM;MACZ,IAAKa,SAAS,CAACK,OAAO,EAAG;QACxBC,YAAY,CAAEN,SAAS,CAACK,OAAQ,CAAC;MAClC;IACD,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,OACCI,aAAA,CAAChB,OAAO;IACPiB,OAAO,EACND,aAAA,CAACjB,IAAI;MAACI,KAAK,EAAC;IAAO,GAChBE,WAAW,KAAKF,KAAK,CAACQ,KAAK,CAAC,CAAC,GAC5Bd,EAAE,CAAE,SAAU,CAAC,GACfA,EAAE,CAAE,MAAO,CACT,CACN;IACDqB,SAAS,EAAC;EAAQ,GAElBF,aAAA,CAAClB,UAAU;IACVqB,OAAO;IACPC,GAAG,EAAGZ,OAAS;IACfa,IAAI,EAAGzB,IAAM;IACb0B,WAAW,EAAG;EAAO,CACrB,CACO,CAAC;AAEZ,CAAC"}

package/build-module/color-picker/color-input.js

@@ -1,5 +1,4 @@
 import { createElement } from "@wordpress/element";
-
 /**
  * Internal dependencies
  */
@@ -17,19 +16,19 @@ export const ColorInput = ({
     onChange,
     enableAlpha
   };
-
   switch (colorType) {
     case 'hsl':
-      return createElement(HslInput, { ...props
+      return createElement(HslInput, {
+        ...props
       });
-
     case 'rgb':
-      return createElement(RgbInput, { ...props
+      return createElement(RgbInput, {
+        ...props
       });
-
     default:
     case 'hex':
-      return createElement(HexInput, { ...props
+      return createElement(HexInput, {
+        ...props
       });
   }
 };

package/build-module/color-picker/color-input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-picker/color-input.tsx"],"names":["RgbInput","HslInput","HexInput","ColorInput","colorType","color","onChange","enableAlpha","props"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,QAAT,QAAyB,aAAzB;AACA,SAASC,QAAT,QAAyB,aAAzB;AACA,SAASC,QAAT,QAAyB,aAAzB;AAGA,OAAO,MAAMC,UAAU,GAAG,CAAE;AAC3BC,EAAAA,SAD2B;AAE3BC,EAAAA,KAF2B;AAG3BC,EAAAA,QAH2B;AAI3BC,EAAAA;AAJ2B,CAAF,KAKF;AACvB,QAAMC,KAAK,GAAG;AAAEH,IAAAA,KAAF;AAASC,IAAAA,QAAT;AAAmBC,IAAAA;AAAnB,GAAd;;AACA,UAASH,SAAT;AACC,SAAK,KAAL;AACC,aAAO,cAAC,QAAD,OAAeI;AAAf,QAAP;;AACD,SAAK,KAAL;AACC,aAAO,cAAC,QAAD,OAAeA;AAAf,QAAP;;AACD;AACA,SAAK,KAAL;AACC,aAAO,cAAC,QAAD,OAAeA;AAAf,QAAP;AAPF;AASA,CAhBM","sourcesContent":["/**\n * Internal dependencies\n */\nimport { RgbInput } from './rgb-input';\nimport { HslInput } from './hsl-input';\nimport { HexInput } from './hex-input';\nimport type { ColorInputProps } from './types';\n\nexport const ColorInput = ( {\n\tcolorType,\n\tcolor,\n\tonChange,\n\tenableAlpha,\n}: ColorInputProps ) => {\n\tconst props = { color, onChange, enableAlpha };\n\tswitch ( colorType ) {\n\t\tcase 'hsl':\n\t\t\treturn <HslInput { ...props } />;\n\t\tcase 'rgb':\n\t\t\treturn <RgbInput { ...props } />;\n\t\tdefault:\n\t\tcase 'hex':\n\t\t\treturn <HexInput { ...props } />;\n\t}\n};\n"]}
+{"version":3,"names":["RgbInput","HslInput","HexInput","ColorInput","colorType","color","onChange","enableAlpha","props","createElement"],"sources":["@wordpress/components/src/color-picker/color-input.tsx"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { RgbInput } from './rgb-input';\nimport { HslInput } from './hsl-input';\nimport { HexInput } from './hex-input';\nimport type { ColorInputProps } from './types';\n\nexport const ColorInput = ( {\n\tcolorType,\n\tcolor,\n\tonChange,\n\tenableAlpha,\n}: ColorInputProps ) => {\n\tconst props = { color, onChange, enableAlpha };\n\tswitch ( colorType ) {\n\t\tcase 'hsl':\n\t\t\treturn <HslInput { ...props } />;\n\t\tcase 'rgb':\n\t\t\treturn <RgbInput { ...props } />;\n\t\tdefault:\n\t\tcase 'hex':\n\t\t\treturn <HexInput { ...props } />;\n\t}\n};\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,QAAQ,QAAQ,aAAa;AACtC,SAASC,QAAQ,QAAQ,aAAa;AACtC,SAASC,QAAQ,QAAQ,aAAa;AAGtC,OAAO,MAAMC,UAAU,GAAGA,CAAE;EAC3BC,SAAS;EACTC,KAAK;EACLC,QAAQ;EACRC;AACgB,CAAC,KAAM;EACvB,MAAMC,KAAK,GAAG;IAAEH,KAAK;IAAEC,QAAQ;IAAEC;EAAY,CAAC;EAC9C,QAASH,SAAS;IACjB,KAAK,KAAK;MACT,OAAOK,aAAA,CAACR,QAAQ;QAAA,GAAMO;MAAK,CAAI,CAAC;IACjC,KAAK,KAAK;MACT,OAAOC,aAAA,CAACT,QAAQ;QAAA,GAAMQ;MAAK,CAAI,CAAC;IACjC;IACA,KAAK,KAAK;MACT,OAAOC,aAAA,CAACP,QAAQ;QAAA,GAAMM;MAAK,CAAI,CAAC;EAClC;AACD,CAAC"}