@wordpress/components 25.0.0 → 25.1.1

package/build/palette-edit/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/palette-edit/index.tsx"],"names":["DEFAULT_COLOR","NameInput","value","onChange","label","getNameForPosition","elements","slugPrefix","temporaryNameRegex","RegExp","position","reduce","previousValue","currentValue","slug","matches","match","id","parseInt","ColorPickerPopover","isGradient","element","popoverProps","receivedPopoverProps","onClose","shift","offset","placement","className","color","newColor","gradient","newGradient","Option","canOnlyChangeValues","isEditing","onStartEditing","onRemove","onStopEditing","focusOutsideProps","popoverAnchor","setPopoverAnchor","anchor","undefined","style","cursor","background","name","nextName","lineSolid","isTemporaryElement","regex","test","DEFAULT_GRADIENT","PaletteEditListView","editingElement","setEditingElement","elementsReference","current","some","newElements","filter","length","debounceOnChange","map","index","newElement","currentElement","currentIndex","_currentElement","EMPTY_ARRAY","PaletteEdit","gradients","colors","paletteLabel","paletteLabelHeadingLevel","emptyMessage","canReset","setIsEditing","isAdding","elementsLength","hasElements","onSelectPaletteItem","newEditingElementIndex","selectedElement","key","plus","tempOptionName","moreVertical","isSmall"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { paramCase as kebabCase } from 'change-case';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseState,\n\tuseRef,\n\tuseEffect,\n\tuseCallback,\n\tuseMemo,\n} from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { lineSolid, moreVertical, plus } from '@wordpress/icons';\nimport {\n\t__experimentalUseFocusOutside as useFocusOutside,\n\tuseDebounce,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport { ColorPicker } from '../color-picker';\nimport { FlexItem } from '../flex';\nimport { HStack } from '../h-stack';\nimport { ItemGroup } from '../item-group';\nimport { VStack } from '../v-stack';\nimport GradientPicker from '../gradient-picker';\nimport ColorPalette from '../color-palette';\nimport DropdownMenu from '../dropdown-menu';\nimport Popover from '../popover';\nimport {\n\tPaletteActionsContainer,\n\tPaletteEditStyles,\n\tPaletteHeading,\n\tPaletteHStackHeader,\n\tIndicatorStyled,\n\tPaletteItem,\n\tNameContainer,\n\tNameInputControl,\n\tDoneButton,\n\tRemoveButton,\n} from './styles';\nimport { NavigableMenu } from '../navigable-container';\nimport { DEFAULT_GRADIENT } from '../custom-gradient-picker/constants';\nimport CustomGradientPicker from '../custom-gradient-picker';\nimport type {\n\tColor,\n\tColorPickerPopoverProps,\n\tGradient,\n\tNameInputProps,\n\tOptionProps,\n\tPaletteEditListViewProps,\n\tPaletteEditProps,\n\tPaletteElement,\n} from './types';\n\nconst DEFAULT_COLOR = '#000';\n\nfunction NameInput( { value, onChange, label }: NameInputProps ) {\n\treturn (\n\t\t<NameInputControl\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t/>\n\t);\n}\n\n/**\n * Returns a temporary name for a palette item in the format \"Color + id\".\n * To ensure there are no duplicate ids, this function checks all slugs for temporary names.\n * It expects slugs to be in the format: slugPrefix + color- + number.\n * It then sets the id component of the new name based on the incremented id of the highest existing slug id.\n *\n * @param elements   An array of color palette items.\n * @param slugPrefix The slug prefix used to match the element slug.\n *\n * @return A unique name for a palette item.\n */\nexport function getNameForPosition(\n\telements: PaletteElement[],\n\tslugPrefix: string\n) {\n\tconst temporaryNameRegex = new RegExp( `^${ slugPrefix }color-([\\\\d]+)$` );\n\tconst position = elements.reduce( ( previousValue, currentValue ) => {\n\t\tif ( typeof currentValue?.slug === 'string' ) {\n\t\t\tconst matches = currentValue?.slug.match( temporaryNameRegex );\n\t\t\tif ( matches ) {\n\t\t\t\tconst id = parseInt( matches[ 1 ], 10 );\n\t\t\t\tif ( id >= previousValue ) {\n\t\t\t\t\treturn id + 1;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\treturn previousValue;\n\t}, 1 );\n\n\treturn sprintf(\n\t\t/* translators: %s: is a temporary id for a custom color */\n\t\t__( 'Color %s' ),\n\t\tposition\n\t);\n}\n\nfunction ColorPickerPopover< T extends Color | Gradient >( {\n\tisGradient,\n\telement,\n\tonChange,\n\tpopoverProps: receivedPopoverProps,\n\tonClose = () => {},\n}: ColorPickerPopoverProps< T > ) {\n\tconst popoverProps: ColorPickerPopoverProps< T >[ 'popoverProps' ] =\n\t\tuseMemo(\n\t\t\t() => ( {\n\t\t\t\tshift: true,\n\t\t\t\toffset: 20,\n\t\t\t\tplacement: 'left-start',\n\t\t\t\t...receivedPopoverProps,\n\t\t\t\tclassName: classnames(\n\t\t\t\t\t'components-palette-edit__popover',\n\t\t\t\t\treceivedPopoverProps?.className\n\t\t\t\t),\n\t\t\t} ),\n\t\t\t[ receivedPopoverProps ]\n\t\t);\n\n\treturn (\n\t\t<Popover { ...popoverProps } onClose={ onClose }>\n\t\t\t{ ! isGradient && (\n\t\t\t\t<ColorPicker\n\t\t\t\t\tcolor={ element.color }\n\t\t\t\t\tenableAlpha\n\t\t\t\t\tonChange={ ( newColor ) => {\n\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t...element,\n\t\t\t\t\t\t\tcolor: newColor,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ isGradient && (\n\t\t\t\t<div className=\"components-palette-edit__popover-gradient-picker\">\n\t\t\t\t\t<CustomGradientPicker\n\t\t\t\t\t\t__nextHasNoMargin\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\tvalue={ element.gradient }\n\t\t\t\t\t\tonChange={ ( newGradient ) => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t...element,\n\t\t\t\t\t\t\t\tgradient: newGradient,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</Popover>\n\t);\n}\n\nfunction Option< T extends Color | Gradient >( {\n\tcanOnlyChangeValues,\n\telement,\n\tonChange,\n\tisEditing,\n\tonStartEditing,\n\tonRemove,\n\tonStopEditing,\n\tpopoverProps: receivedPopoverProps,\n\tslugPrefix,\n\tisGradient,\n}: OptionProps< T > ) {\n\tconst focusOutsideProps = useFocusOutside( onStopEditing );\n\tconst value = isGradient ? element.gradient : element.color;\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState( null );\n\tconst popoverProps = useMemo(\n\t\t() => ( {\n\t\t\t...receivedPopoverProps,\n\t\t\t// Use the custom palette color item as the popover anchor.\n\t\t\tanchor: popoverAnchor,\n\t\t} ),\n\t\t[ popoverAnchor, receivedPopoverProps ]\n\t);\n\n\treturn (\n\t\t<PaletteItem\n\t\t\tclassName={ isEditing ? 'is-selected' : undefined }\n\t\t\tas=\"div\"\n\t\t\tonClick={ onStartEditing }\n\t\t\tref={ setPopoverAnchor }\n\t\t\t{ ...( isEditing\n\t\t\t\t? { ...focusOutsideProps }\n\t\t\t\t: {\n\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t\t\t},\n\t\t\t\t  } ) }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<IndicatorStyled\n\t\t\t\t\t\tstyle={ { background: value, color: 'transparent' } }\n\t\t\t\t\t/>\n\t\t\t\t</FlexItem>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t{ isEditing && ! canOnlyChangeValues ? (\n\t\t\t\t\t\t<NameInput\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tisGradient\n\t\t\t\t\t\t\t\t\t? __( 'Gradient name' )\n\t\t\t\t\t\t\t\t\t: __( 'Color name' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ element.name }\n\t\t\t\t\t\t\tonChange={ ( nextName?: string ) =>\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t...element,\n\t\t\t\t\t\t\t\t\tname: nextName,\n\t\t\t\t\t\t\t\t\tslug:\n\t\t\t\t\t\t\t\t\t\tslugPrefix +\n\t\t\t\t\t\t\t\t\t\tkebabCase( nextName ?? '' ),\n\t\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<NameContainer>{ element.name }</NameContainer>\n\t\t\t\t\t) }\n\t\t\t\t</FlexItem>\n\t\t\t\t{ isEditing && ! canOnlyChangeValues && (\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<RemoveButton\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\ticon={ lineSolid }\n\t\t\t\t\t\t\tlabel={ __( 'Remove color' ) }\n\t\t\t\t\t\t\tonClick={ onRemove }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t\t{ isEditing && (\n\t\t\t\t<ColorPickerPopover\n\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\telement={ element }\n\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</PaletteItem>\n\t);\n}\n\nfunction isTemporaryElement(\n\tslugPrefix: string,\n\t{ slug, color, gradient }: Color | Gradient\n) {\n\tconst regex = new RegExp( `^${ slugPrefix }color-([\\\\d]+)$` );\n\treturn (\n\t\tregex.test( slug ) &&\n\t\t( ( !! color && color === DEFAULT_COLOR ) ||\n\t\t\t( !! gradient && gradient === DEFAULT_GRADIENT ) )\n\t);\n}\n\nfunction PaletteEditListView< T extends Color | Gradient >( {\n\telements,\n\tonChange,\n\teditingElement,\n\tsetEditingElement,\n\tcanOnlyChangeValues,\n\tslugPrefix,\n\tisGradient,\n\tpopoverProps,\n}: PaletteEditListViewProps< T > ) {\n\t// When unmounting the component if there are empty elements (the user did not complete the insertion) clean them.\n\tconst elementsReference = useRef< typeof elements >();\n\tuseEffect( () => {\n\t\telementsReference.current = elements;\n\t}, [ elements ] );\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tif (\n\t\t\t\telementsReference.current?.some( ( element ) =>\n\t\t\t\t\tisTemporaryElement( slugPrefix, element )\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tconst newElements = elementsReference.current.filter(\n\t\t\t\t\t( element ) => ! isTemporaryElement( slugPrefix, element )\n\t\t\t\t);\n\t\t\t\tonChange( newElements.length ? newElements : undefined );\n\t\t\t}\n\t\t};\n\t\t// Disable reason: adding the missing dependency here would cause breaking changes that will require\n\t\t// a heavier refactor to avoid. See https://github.com/WordPress/gutenberg/pull/43911\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [] );\n\n\tconst debounceOnChange = useDebounce( onChange, 100 );\n\n\treturn (\n\t\t<VStack spacing={ 3 }>\n\t\t\t<ItemGroup isRounded>\n\t\t\t\t{ elements.map( ( element, index ) => (\n\t\t\t\t\t<Option\n\t\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\t\tcanOnlyChangeValues={ canOnlyChangeValues }\n\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\telement={ element }\n\t\t\t\t\t\tonStartEditing={ () => {\n\t\t\t\t\t\t\tif ( editingElement !== index ) {\n\t\t\t\t\t\t\t\tsetEditingElement( index );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonChange={ ( newElement ) => {\n\t\t\t\t\t\t\tdebounceOnChange(\n\t\t\t\t\t\t\t\telements.map(\n\t\t\t\t\t\t\t\t\t( currentElement, currentIndex ) => {\n\t\t\t\t\t\t\t\t\t\tif ( currentIndex === index ) {\n\t\t\t\t\t\t\t\t\t\t\treturn newElement;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\treturn currentElement;\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);\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonRemove={ () => {\n\t\t\t\t\t\t\tsetEditingElement( null );\n\t\t\t\t\t\t\tconst newElements = elements.filter(\n\t\t\t\t\t\t\t\t( _currentElement, currentIndex ) => {\n\t\t\t\t\t\t\t\t\tif ( currentIndex === index ) {\n\t\t\t\t\t\t\t\t\t\treturn false;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\tnewElements.length ? newElements : undefined\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisEditing={ index === editingElement }\n\t\t\t\t\t\tonStopEditing={ () => {\n\t\t\t\t\t\t\tif ( index === editingElement ) {\n\t\t\t\t\t\t\t\tsetEditingElement( null );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tslugPrefix={ slugPrefix }\n\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</ItemGroup>\n\t\t</VStack>\n\t);\n}\n\nconst EMPTY_ARRAY: Color[] = [];\n\n/**\n * Allows editing a palette of colors or gradients.\n *\n * ```jsx\n * import { PaletteEdit } from '@wordpress/components';\n * const MyPaletteEdit = () => {\n *   const [ controlledColors, setControlledColors ] = useState( colors );\n *\n *   return (\n *     <PaletteEdit\n *       colors={ controlledColors }\n *       onChange={ ( newColors?: Color[] ) => {\n *         setControlledColors( newColors );\n *       } }\n *       paletteLabel=\"Here is a label\"\n *     />\n *   );\n * };\n * ```\n */\nexport function PaletteEdit( {\n\tgradients,\n\tcolors = EMPTY_ARRAY,\n\tonChange,\n\tpaletteLabel,\n\tpaletteLabelHeadingLevel = 2,\n\temptyMessage,\n\tcanOnlyChangeValues,\n\tcanReset,\n\tslugPrefix = '',\n\tpopoverProps,\n}: PaletteEditProps ) {\n\tconst isGradient = !! gradients;\n\tconst elements = isGradient ? gradients : colors;\n\tconst [ isEditing, setIsEditing ] = useState( false );\n\tconst [ editingElement, setEditingElement ] = useState<\n\t\tnumber | null | undefined\n\t>( null );\n\tconst isAdding =\n\t\tisEditing &&\n\t\t!! editingElement &&\n\t\telements[ editingElement ] &&\n\t\t! elements[ editingElement ].slug;\n\tconst elementsLength = elements.length;\n\tconst hasElements = elementsLength > 0;\n\tconst debounceOnChange = useDebounce( onChange, 100 );\n\tconst onSelectPaletteItem = useCallback(\n\t\t(\n\t\t\tvalue?: PaletteElement[ keyof PaletteElement ],\n\t\t\tnewEditingElementIndex?: number\n\t\t) => {\n\t\t\tconst selectedElement =\n\t\t\t\tnewEditingElementIndex === undefined\n\t\t\t\t\t? undefined\n\t\t\t\t\t: elements[ newEditingElementIndex ];\n\t\t\tconst key = isGradient ? 'gradient' : 'color';\n\t\t\t// Ensures that the index returned matches a known element value.\n\t\t\tif ( !! selectedElement && selectedElement[ key ] === value ) {\n\t\t\t\tsetEditingElement( newEditingElementIndex );\n\t\t\t} else {\n\t\t\t\tsetIsEditing( true );\n\t\t\t}\n\t\t},\n\t\t[ isGradient, elements ]\n\t);\n\n\treturn (\n\t\t<PaletteEditStyles>\n\t\t\t<PaletteHStackHeader>\n\t\t\t\t<PaletteHeading level={ paletteLabelHeadingLevel }>\n\t\t\t\t\t{ paletteLabel }\n\t\t\t\t</PaletteHeading>\n\t\t\t\t<PaletteActionsContainer>\n\t\t\t\t\t{ hasElements && isEditing && (\n\t\t\t\t\t\t<DoneButton\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetIsEditing( false );\n\t\t\t\t\t\t\t\tsetEditingElement( null );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Done' ) }\n\t\t\t\t\t\t</DoneButton>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! canOnlyChangeValues && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\tisPressed={ isAdding }\n\t\t\t\t\t\t\ticon={ plus }\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tisGradient\n\t\t\t\t\t\t\t\t\t? __( 'Add gradient' )\n\t\t\t\t\t\t\t\t\t: __( 'Add color' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tconst tempOptionName = getNameForPosition(\n\t\t\t\t\t\t\t\t\telements,\n\t\t\t\t\t\t\t\t\tslugPrefix\n\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\tif ( !! gradients ) {\n\t\t\t\t\t\t\t\t\tonChange( [\n\t\t\t\t\t\t\t\t\t\t...gradients,\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tgradient: DEFAULT_GRADIENT,\n\t\t\t\t\t\t\t\t\t\t\tname: tempOptionName,\n\t\t\t\t\t\t\t\t\t\t\tslug:\n\t\t\t\t\t\t\t\t\t\t\t\tslugPrefix +\n\t\t\t\t\t\t\t\t\t\t\t\tkebabCase( tempOptionName ),\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} else {\n\t\t\t\t\t\t\t\t\tonChange( [\n\t\t\t\t\t\t\t\t\t\t...colors,\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tcolor: DEFAULT_COLOR,\n\t\t\t\t\t\t\t\t\t\t\tname: tempOptionName,\n\t\t\t\t\t\t\t\t\t\t\tslug:\n\t\t\t\t\t\t\t\t\t\t\t\tslugPrefix +\n\t\t\t\t\t\t\t\t\t\t\t\tkebabCase( tempOptionName ),\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\tsetIsEditing( true );\n\t\t\t\t\t\t\t\tsetEditingElement( elements.length );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ hasElements &&\n\t\t\t\t\t\t( ! isEditing ||\n\t\t\t\t\t\t\t! canOnlyChangeValues ||\n\t\t\t\t\t\t\tcanReset ) && (\n\t\t\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\t\t\ticon={ moreVertical }\n\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\tisGradient\n\t\t\t\t\t\t\t\t\t\t? __( 'Gradient options' )\n\t\t\t\t\t\t\t\t\t\t: __( 'Color options' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\ttoggleProps={ {\n\t\t\t\t\t\t\t\t\tisSmall: true,\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\t{ ( { onClose }: { onClose: () => void } ) => (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<NavigableMenu role=\"menu\">\n\t\t\t\t\t\t\t\t\t\t\t{ ! isEditing && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetIsEditing( true );\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-palette-edit__menu-button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'Show details' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t{ ! canOnlyChangeValues && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetEditingElement(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnull\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetIsEditing( false );\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange();\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-palette-edit__menu-button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ isGradient\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Remove all gradients'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Remove all colors'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t  ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t{ canReset && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetEditingElement(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnull\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange();\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ isGradient\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? __( 'Reset gradient' )\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: __( 'Reset colors' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t</NavigableMenu>\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</DropdownMenu>\n\t\t\t\t\t\t) }\n\t\t\t\t</PaletteActionsContainer>\n\t\t\t</PaletteHStackHeader>\n\t\t\t{ hasElements && (\n\t\t\t\t<>\n\t\t\t\t\t{ isEditing && (\n\t\t\t\t\t\t<PaletteEditListView< ( typeof elements )[ number ] >\n\t\t\t\t\t\t\tcanOnlyChangeValues={ canOnlyChangeValues }\n\t\t\t\t\t\t\telements={ elements }\n\t\t\t\t\t\t\t// @ts-expect-error TODO: Don't know how to resolve\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\teditingElement={ editingElement }\n\t\t\t\t\t\t\tsetEditingElement={ setEditingElement }\n\t\t\t\t\t\t\tslugPrefix={ slugPrefix }\n\t\t\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! isEditing && editingElement !== null && (\n\t\t\t\t\t\t<ColorPickerPopover\n\t\t\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\t\t\tonClose={ () => setEditingElement( null ) }\n\t\t\t\t\t\t\tonChange={ (\n\t\t\t\t\t\t\t\tnewElement: ( typeof elements )[ number ]\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tdebounceOnChange(\n\t\t\t\t\t\t\t\t\t// @ts-expect-error TODO: Don't know how to resolve\n\t\t\t\t\t\t\t\t\telements.map(\n\t\t\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\t\t\tcurrentElement: ( typeof elements )[ number ],\n\t\t\t\t\t\t\t\t\t\t\tcurrentIndex: number\n\t\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t\tcurrentIndex === editingElement\n\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\treturn newElement;\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\treturn currentElement;\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} }\n\t\t\t\t\t\t\telement={ elements[ editingElement ?? -1 ] }\n\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! isEditing &&\n\t\t\t\t\t\t( isGradient ? (\n\t\t\t\t\t\t\t<GradientPicker\n\t\t\t\t\t\t\t\t__nextHasNoMargin\n\t\t\t\t\t\t\t\tgradients={ gradients }\n\t\t\t\t\t\t\t\tonChange={ onSelectPaletteItem }\n\t\t\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\t\t\tdisableCustomGradients={ true }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\t\t\tonChange={ onSelectPaletteItem }\n\t\t\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\t\t\tdisableCustomColors={ true }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) ) }\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t{ ! hasElements && emptyMessage }\n\t\t</PaletteEditStyles>\n\t);\n}\n\nexport default PaletteEdit;\n"]}
+{"version":3,"sources":["@wordpress/components/src/palette-edit/index.tsx"],"names":["DEFAULT_COLOR","NameInput","value","onChange","label","getNameForPosition","elements","slugPrefix","temporaryNameRegex","RegExp","position","reduce","previousValue","currentValue","slug","matches","match","id","parseInt","ColorPickerPopover","isGradient","element","popoverProps","receivedPopoverProps","onClose","shift","offset","placement","className","color","newColor","gradient","newGradient","Option","canOnlyChangeValues","isEditing","onStartEditing","onRemove","onStopEditing","focusOutsideProps","popoverAnchor","setPopoverAnchor","anchor","undefined","style","cursor","background","name","nextName","lineSolid","isTemporaryElement","regex","test","DEFAULT_GRADIENT","PaletteEditListView","editingElement","setEditingElement","elementsReference","current","some","newElements","filter","length","debounceOnChange","map","index","newElement","currentElement","currentIndex","_currentElement","EMPTY_ARRAY","PaletteEdit","gradients","colors","paletteLabel","paletteLabelHeadingLevel","emptyMessage","canReset","setIsEditing","isAdding","elementsLength","hasElements","onSelectPaletteItem","newEditingElementIndex","selectedElement","key","plus","tempOptionName","moreVertical","isSmall"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { paramCase as kebabCase } from 'change-case';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseState,\n\tuseRef,\n\tuseEffect,\n\tuseCallback,\n\tuseMemo,\n} from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { lineSolid, moreVertical, plus } from '@wordpress/icons';\nimport {\n\t__experimentalUseFocusOutside as useFocusOutside,\n\tuseDebounce,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport { ColorPicker } from '../color-picker';\nimport { FlexItem } from '../flex';\nimport { HStack } from '../h-stack';\nimport { ItemGroup } from '../item-group';\nimport { VStack } from '../v-stack';\nimport GradientPicker from '../gradient-picker';\nimport ColorPalette from '../color-palette';\nimport DropdownMenu from '../dropdown-menu';\nimport Popover from '../popover';\nimport {\n\tPaletteActionsContainer,\n\tPaletteEditStyles,\n\tPaletteHeading,\n\tPaletteHStackHeader,\n\tIndicatorStyled,\n\tPaletteItem,\n\tNameContainer,\n\tNameInputControl,\n\tDoneButton,\n\tRemoveButton,\n} from './styles';\nimport { NavigableMenu } from '../navigable-container';\nimport { DEFAULT_GRADIENT } from '../custom-gradient-picker/constants';\nimport CustomGradientPicker from '../custom-gradient-picker';\nimport type {\n\tColor,\n\tColorPickerPopoverProps,\n\tGradient,\n\tNameInputProps,\n\tOptionProps,\n\tPaletteEditListViewProps,\n\tPaletteEditProps,\n\tPaletteElement,\n} from './types';\n\nconst DEFAULT_COLOR = '#000';\n\nfunction NameInput( { value, onChange, label }: NameInputProps ) {\n\treturn (\n\t\t<NameInputControl\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t/>\n\t);\n}\n\n/**\n * Returns a temporary name for a palette item in the format \"Color + id\".\n * To ensure there are no duplicate ids, this function checks all slugs for temporary names.\n * It expects slugs to be in the format: slugPrefix + color- + number.\n * It then sets the id component of the new name based on the incremented id of the highest existing slug id.\n *\n * @param elements   An array of color palette items.\n * @param slugPrefix The slug prefix used to match the element slug.\n *\n * @return A unique name for a palette item.\n */\nexport function getNameForPosition(\n\telements: PaletteElement[],\n\tslugPrefix: string\n) {\n\tconst temporaryNameRegex = new RegExp( `^${ slugPrefix }color-([\\\\d]+)$` );\n\tconst position = elements.reduce( ( previousValue, currentValue ) => {\n\t\tif ( typeof currentValue?.slug === 'string' ) {\n\t\t\tconst matches = currentValue?.slug.match( temporaryNameRegex );\n\t\t\tif ( matches ) {\n\t\t\t\tconst id = parseInt( matches[ 1 ], 10 );\n\t\t\t\tif ( id >= previousValue ) {\n\t\t\t\t\treturn id + 1;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\treturn previousValue;\n\t}, 1 );\n\n\treturn sprintf(\n\t\t/* translators: %s: is a temporary id for a custom color */\n\t\t__( 'Color %s' ),\n\t\tposition\n\t);\n}\n\nfunction ColorPickerPopover< T extends Color | Gradient >( {\n\tisGradient,\n\telement,\n\tonChange,\n\tpopoverProps: receivedPopoverProps,\n\tonClose = () => {},\n}: ColorPickerPopoverProps< T > ) {\n\tconst popoverProps: ColorPickerPopoverProps< T >[ 'popoverProps' ] =\n\t\tuseMemo(\n\t\t\t() => ( {\n\t\t\t\tshift: true,\n\t\t\t\toffset: 20,\n\t\t\t\tplacement: 'left-start',\n\t\t\t\t...receivedPopoverProps,\n\t\t\t\tclassName: classnames(\n\t\t\t\t\t'components-palette-edit__popover',\n\t\t\t\t\treceivedPopoverProps?.className\n\t\t\t\t),\n\t\t\t} ),\n\t\t\t[ receivedPopoverProps ]\n\t\t);\n\n\treturn (\n\t\t<Popover { ...popoverProps } onClose={ onClose }>\n\t\t\t{ ! isGradient && (\n\t\t\t\t<ColorPicker\n\t\t\t\t\tcolor={ element.color }\n\t\t\t\t\tenableAlpha\n\t\t\t\t\tonChange={ ( newColor ) => {\n\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t...element,\n\t\t\t\t\t\t\tcolor: newColor,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ isGradient && (\n\t\t\t\t<div className=\"components-palette-edit__popover-gradient-picker\">\n\t\t\t\t\t<CustomGradientPicker\n\t\t\t\t\t\t__nextHasNoMargin\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\tvalue={ element.gradient }\n\t\t\t\t\t\tonChange={ ( newGradient ) => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t...element,\n\t\t\t\t\t\t\t\tgradient: newGradient,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</Popover>\n\t);\n}\n\nfunction Option< T extends Color | Gradient >( {\n\tcanOnlyChangeValues,\n\telement,\n\tonChange,\n\tisEditing,\n\tonStartEditing,\n\tonRemove,\n\tonStopEditing,\n\tpopoverProps: receivedPopoverProps,\n\tslugPrefix,\n\tisGradient,\n}: OptionProps< T > ) {\n\tconst focusOutsideProps = useFocusOutside( onStopEditing );\n\tconst value = isGradient ? element.gradient : element.color;\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState( null );\n\tconst popoverProps = useMemo(\n\t\t() => ( {\n\t\t\t...receivedPopoverProps,\n\t\t\t// Use the custom palette color item as the popover anchor.\n\t\t\tanchor: popoverAnchor,\n\t\t} ),\n\t\t[ popoverAnchor, receivedPopoverProps ]\n\t);\n\n\treturn (\n\t\t<PaletteItem\n\t\t\tclassName={ isEditing ? 'is-selected' : undefined }\n\t\t\tas=\"div\"\n\t\t\tonClick={ onStartEditing }\n\t\t\tref={ setPopoverAnchor }\n\t\t\t{ ...( isEditing\n\t\t\t\t? { ...focusOutsideProps }\n\t\t\t\t: {\n\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t\t\t},\n\t\t\t\t  } ) }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<IndicatorStyled\n\t\t\t\t\t\tstyle={ { background: value, color: 'transparent' } }\n\t\t\t\t\t/>\n\t\t\t\t</FlexItem>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t{ isEditing && ! canOnlyChangeValues ? (\n\t\t\t\t\t\t<NameInput\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tisGradient\n\t\t\t\t\t\t\t\t\t? __( 'Gradient name' )\n\t\t\t\t\t\t\t\t\t: __( 'Color name' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ element.name }\n\t\t\t\t\t\t\tonChange={ ( nextName?: string ) =>\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t...element,\n\t\t\t\t\t\t\t\t\tname: nextName,\n\t\t\t\t\t\t\t\t\tslug:\n\t\t\t\t\t\t\t\t\t\tslugPrefix +\n\t\t\t\t\t\t\t\t\t\tkebabCase( nextName ?? '' ),\n\t\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<NameContainer>{ element.name }</NameContainer>\n\t\t\t\t\t) }\n\t\t\t\t</FlexItem>\n\t\t\t\t{ isEditing && ! canOnlyChangeValues && (\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<RemoveButton\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\ticon={ lineSolid }\n\t\t\t\t\t\t\tlabel={ __( 'Remove color' ) }\n\t\t\t\t\t\t\tonClick={ onRemove }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t\t{ isEditing && (\n\t\t\t\t<ColorPickerPopover\n\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\telement={ element }\n\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</PaletteItem>\n\t);\n}\n\nfunction isTemporaryElement(\n\tslugPrefix: string,\n\t{ slug, color, gradient }: Color | Gradient\n) {\n\tconst regex = new RegExp( `^${ slugPrefix }color-([\\\\d]+)$` );\n\treturn (\n\t\tregex.test( slug ) &&\n\t\t( ( !! color && color === DEFAULT_COLOR ) ||\n\t\t\t( !! gradient && gradient === DEFAULT_GRADIENT ) )\n\t);\n}\n\nfunction PaletteEditListView< T extends Color | Gradient >( {\n\telements,\n\tonChange,\n\teditingElement,\n\tsetEditingElement,\n\tcanOnlyChangeValues,\n\tslugPrefix,\n\tisGradient,\n\tpopoverProps,\n}: PaletteEditListViewProps< T > ) {\n\t// When unmounting the component if there are empty elements (the user did not complete the insertion) clean them.\n\tconst elementsReference = useRef< typeof elements >();\n\tuseEffect( () => {\n\t\telementsReference.current = elements;\n\t}, [ elements ] );\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tif (\n\t\t\t\telementsReference.current?.some( ( element ) =>\n\t\t\t\t\tisTemporaryElement( slugPrefix, element )\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tconst newElements = elementsReference.current.filter(\n\t\t\t\t\t( element ) => ! isTemporaryElement( slugPrefix, element )\n\t\t\t\t);\n\t\t\t\tonChange( newElements.length ? newElements : undefined );\n\t\t\t}\n\t\t};\n\t\t// Disable reason: adding the missing dependency here would cause breaking changes that will require\n\t\t// a heavier refactor to avoid. See https://github.com/WordPress/gutenberg/pull/43911\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [] );\n\n\tconst debounceOnChange = useDebounce( onChange, 100 );\n\n\treturn (\n\t\t<VStack spacing={ 3 }>\n\t\t\t<ItemGroup isRounded>\n\t\t\t\t{ elements.map( ( element, index ) => (\n\t\t\t\t\t<Option\n\t\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\t\tcanOnlyChangeValues={ canOnlyChangeValues }\n\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\telement={ element }\n\t\t\t\t\t\tonStartEditing={ () => {\n\t\t\t\t\t\t\tif ( editingElement !== index ) {\n\t\t\t\t\t\t\t\tsetEditingElement( index );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonChange={ ( newElement ) => {\n\t\t\t\t\t\t\tdebounceOnChange(\n\t\t\t\t\t\t\t\telements.map(\n\t\t\t\t\t\t\t\t\t( currentElement, currentIndex ) => {\n\t\t\t\t\t\t\t\t\t\tif ( currentIndex === index ) {\n\t\t\t\t\t\t\t\t\t\t\treturn newElement;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\treturn currentElement;\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);\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonRemove={ () => {\n\t\t\t\t\t\t\tsetEditingElement( null );\n\t\t\t\t\t\t\tconst newElements = elements.filter(\n\t\t\t\t\t\t\t\t( _currentElement, currentIndex ) => {\n\t\t\t\t\t\t\t\t\tif ( currentIndex === index ) {\n\t\t\t\t\t\t\t\t\t\treturn false;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\tnewElements.length ? newElements : undefined\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisEditing={ index === editingElement }\n\t\t\t\t\t\tonStopEditing={ () => {\n\t\t\t\t\t\t\tif ( index === editingElement ) {\n\t\t\t\t\t\t\t\tsetEditingElement( null );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tslugPrefix={ slugPrefix }\n\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</ItemGroup>\n\t\t</VStack>\n\t);\n}\n\nconst EMPTY_ARRAY: Color[] = [];\n\n/**\n * Allows editing a palette of colors or gradients.\n *\n * ```jsx\n * import { PaletteEdit } from '@wordpress/components';\n * const MyPaletteEdit = () => {\n *   const [ controlledColors, setControlledColors ] = useState( colors );\n *\n *   return (\n *     <PaletteEdit\n *       colors={ controlledColors }\n *       onChange={ ( newColors?: Color[] ) => {\n *         setControlledColors( newColors );\n *       } }\n *       paletteLabel=\"Here is a label\"\n *     />\n *   );\n * };\n * ```\n */\nexport function PaletteEdit( {\n\tgradients,\n\tcolors = EMPTY_ARRAY,\n\tonChange,\n\tpaletteLabel,\n\tpaletteLabelHeadingLevel = 2,\n\temptyMessage,\n\tcanOnlyChangeValues,\n\tcanReset,\n\tslugPrefix = '',\n\tpopoverProps,\n}: PaletteEditProps ) {\n\tconst isGradient = !! gradients;\n\tconst elements = isGradient ? gradients : colors;\n\tconst [ isEditing, setIsEditing ] = useState( false );\n\tconst [ editingElement, setEditingElement ] = useState<\n\t\tnumber | null | undefined\n\t>( null );\n\tconst isAdding =\n\t\tisEditing &&\n\t\t!! editingElement &&\n\t\telements[ editingElement ] &&\n\t\t! elements[ editingElement ].slug;\n\tconst elementsLength = elements.length;\n\tconst hasElements = elementsLength > 0;\n\tconst debounceOnChange = useDebounce( onChange, 100 );\n\tconst onSelectPaletteItem = useCallback(\n\t\t(\n\t\t\tvalue?: PaletteElement[ keyof PaletteElement ],\n\t\t\tnewEditingElementIndex?: number\n\t\t) => {\n\t\t\tconst selectedElement =\n\t\t\t\tnewEditingElementIndex === undefined\n\t\t\t\t\t? undefined\n\t\t\t\t\t: elements[ newEditingElementIndex ];\n\t\t\tconst key = isGradient ? 'gradient' : 'color';\n\t\t\t// Ensures that the index returned matches a known element value.\n\t\t\tif ( !! selectedElement && selectedElement[ key ] === value ) {\n\t\t\t\tsetEditingElement( newEditingElementIndex );\n\t\t\t} else {\n\t\t\t\tsetIsEditing( true );\n\t\t\t}\n\t\t},\n\t\t[ isGradient, elements ]\n\t);\n\n\treturn (\n\t\t<PaletteEditStyles>\n\t\t\t<PaletteHStackHeader>\n\t\t\t\t<PaletteHeading level={ paletteLabelHeadingLevel }>\n\t\t\t\t\t{ paletteLabel }\n\t\t\t\t</PaletteHeading>\n\t\t\t\t<PaletteActionsContainer>\n\t\t\t\t\t{ hasElements && isEditing && (\n\t\t\t\t\t\t<DoneButton\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetIsEditing( false );\n\t\t\t\t\t\t\t\tsetEditingElement( null );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Done' ) }\n\t\t\t\t\t\t</DoneButton>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! canOnlyChangeValues && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\tisPressed={ isAdding }\n\t\t\t\t\t\t\ticon={ plus }\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tisGradient\n\t\t\t\t\t\t\t\t\t? __( 'Add gradient' )\n\t\t\t\t\t\t\t\t\t: __( 'Add color' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tconst tempOptionName = getNameForPosition(\n\t\t\t\t\t\t\t\t\telements,\n\t\t\t\t\t\t\t\t\tslugPrefix\n\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\tif ( !! gradients ) {\n\t\t\t\t\t\t\t\t\tonChange( [\n\t\t\t\t\t\t\t\t\t\t...gradients,\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tgradient: DEFAULT_GRADIENT,\n\t\t\t\t\t\t\t\t\t\t\tname: tempOptionName,\n\t\t\t\t\t\t\t\t\t\t\tslug:\n\t\t\t\t\t\t\t\t\t\t\t\tslugPrefix +\n\t\t\t\t\t\t\t\t\t\t\t\tkebabCase( tempOptionName ),\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} else {\n\t\t\t\t\t\t\t\t\tonChange( [\n\t\t\t\t\t\t\t\t\t\t...colors,\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tcolor: DEFAULT_COLOR,\n\t\t\t\t\t\t\t\t\t\t\tname: tempOptionName,\n\t\t\t\t\t\t\t\t\t\t\tslug:\n\t\t\t\t\t\t\t\t\t\t\t\tslugPrefix +\n\t\t\t\t\t\t\t\t\t\t\t\tkebabCase( tempOptionName ),\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\tsetIsEditing( true );\n\t\t\t\t\t\t\t\tsetEditingElement( elements.length );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ hasElements &&\n\t\t\t\t\t\t( ! isEditing ||\n\t\t\t\t\t\t\t! canOnlyChangeValues ||\n\t\t\t\t\t\t\tcanReset ) && (\n\t\t\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\t\t\ticon={ moreVertical }\n\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\tisGradient\n\t\t\t\t\t\t\t\t\t\t? __( 'Gradient options' )\n\t\t\t\t\t\t\t\t\t\t: __( 'Color options' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\ttoggleProps={ {\n\t\t\t\t\t\t\t\t\tisSmall: true,\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\t{ ( { onClose }: { onClose: () => void } ) => (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<NavigableMenu role=\"menu\">\n\t\t\t\t\t\t\t\t\t\t\t{ ! isEditing && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetIsEditing( true );\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-palette-edit__menu-button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'Show details' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t{ ! canOnlyChangeValues && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetEditingElement(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnull\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetIsEditing( false );\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange();\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-palette-edit__menu-button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ isGradient\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Remove all gradients'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Remove all colors'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t  ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t{ canReset && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetEditingElement(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnull\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange();\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ isGradient\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? __( 'Reset gradient' )\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: __( 'Reset colors' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t</NavigableMenu>\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</DropdownMenu>\n\t\t\t\t\t\t) }\n\t\t\t\t</PaletteActionsContainer>\n\t\t\t</PaletteHStackHeader>\n\t\t\t{ hasElements && (\n\t\t\t\t<>\n\t\t\t\t\t{ isEditing && (\n\t\t\t\t\t\t<PaletteEditListView< ( typeof elements )[ number ] >\n\t\t\t\t\t\t\tcanOnlyChangeValues={ canOnlyChangeValues }\n\t\t\t\t\t\t\telements={ elements }\n\t\t\t\t\t\t\t// @ts-expect-error TODO: Don't know how to resolve\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\teditingElement={ editingElement }\n\t\t\t\t\t\t\tsetEditingElement={ setEditingElement }\n\t\t\t\t\t\t\tslugPrefix={ slugPrefix }\n\t\t\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! isEditing && editingElement !== null && (\n\t\t\t\t\t\t<ColorPickerPopover\n\t\t\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\t\t\tonClose={ () => setEditingElement( null ) }\n\t\t\t\t\t\t\tonChange={ (\n\t\t\t\t\t\t\t\tnewElement: ( typeof elements )[ number ]\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tdebounceOnChange(\n\t\t\t\t\t\t\t\t\t// @ts-expect-error TODO: Don't know how to resolve\n\t\t\t\t\t\t\t\t\telements.map(\n\t\t\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\t\t\tcurrentElement: ( typeof elements )[ number ],\n\t\t\t\t\t\t\t\t\t\t\tcurrentIndex: number\n\t\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t\tcurrentIndex === editingElement\n\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\treturn newElement;\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\treturn currentElement;\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} }\n\t\t\t\t\t\t\telement={ elements[ editingElement ?? -1 ] }\n\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! isEditing &&\n\t\t\t\t\t\t( isGradient ? (\n\t\t\t\t\t\t\t<GradientPicker\n\t\t\t\t\t\t\t\t__nextHasNoMargin\n\t\t\t\t\t\t\t\tgradients={ gradients }\n\t\t\t\t\t\t\t\tonChange={ onSelectPaletteItem }\n\t\t\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\t\t\tdisableCustomGradients={ true }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\t\t\tonChange={ onSelectPaletteItem }\n\t\t\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\t\t\tdisableCustomColors={ true }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) ) }\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t{ ! hasElements && emptyMessage }\n\t\t</PaletteEditStyles>\n\t);\n}\n\nexport default PaletteEdit;\n"]}

package/build/panel/actions.native.js

@@ -30,17 +30,15 @@ var _bottomSeparatorCover = _interopRequireDefault(require("./bottom-separator-c
 /**
  * Internal dependencies
  */
-function PanelActions(_ref) {
-  let {
-    actions,
-    getStylesFromColorScheme
-  } = _ref;
+function PanelActions({
+  actions,
+  getStylesFromColorScheme
+}) {
   const mappedActions = (0, _element.useMemo)(() => {
-    return actions.map(_ref2 => {
-      let {
-        label,
-        onPress
-      } = _ref2;
+    return actions.map(({
+      label,
+      onPress
+    }) => {
       return (0, _element.createElement)(_components.TextControl, {
         label: label,
         onPress: onPress,

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/actions.native.js"],"names":["PanelActions","actions","getStylesFromColorScheme","mappedActions","map","label","onPress","styles","defaultLabelStyle","panelActionsContainer","panelActionsContainerDark"],"mappings":";;;;;;;;;AAUA;;AAPA;;AAKA;;AACA;;AAMA;;AACA;;AAhBA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AAIA,SAASA,YAAT,OAA+D;AAAA,MAAxC;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,GAAwC;AAC9D,QAAMC,aAAa,GAAG,sBAAS,MAAM;AACpC,WAAOF,OAAO,CAACG,GAAR,CAAa,SAA0B;AAAA,UAAxB;AAAEC,QAAAA,KAAF;AAASC,QAAAA;AAAT,OAAwB;AAC7C,aACC,4BAAC,uBAAD;AACC,QAAA,KAAK,EAAGD,KADT;AAEC,QAAA,OAAO,EAAGC,OAFX;AAGC,QAAA,UAAU,EAAGC,iBAAOC,iBAHrB;AAIC,QAAA,GAAG,EAAGH;AAJP,QADD;AAQA,KATM,CAAP;AAUA,GAXqB,EAWnB,CAAEJ,OAAF,CAXmB,CAAtB;AAaA,SACC,4BAAC,iBAAD;AACC,IAAA,KAAK,EAAGC,wBAAwB,CAC/BK,iBAAOE,qBADwB,EAE/BF,iBAAOG,yBAFwB;AADjC,KAMGP,aANH,EAOC,4BAAC,6BAAD,OAPD,CADD;AAWA;;eAEc,uCAA0BH,YAA1B,C","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { TextControl } from '@wordpress/components';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport styles from './actions.scss';\nimport BottomSeparatorCover from './bottom-separator-cover';\n\nfunction PanelActions( { actions, getStylesFromColorScheme } ) {\n\tconst mappedActions = useMemo( () => {\n\t\treturn actions.map( ( { label, onPress } ) => {\n\t\t\treturn (\n\t\t\t\t<TextControl\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tonPress={ onPress }\n\t\t\t\t\tlabelStyle={ styles.defaultLabelStyle }\n\t\t\t\t\tkey={ label }\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\t}, [ actions ] );\n\n\treturn (\n\t\t<View\n\t\t\tstyle={ getStylesFromColorScheme(\n\t\t\t\tstyles.panelActionsContainer,\n\t\t\t\tstyles.panelActionsContainerDark\n\t\t\t) }\n\t\t>\n\t\t\t{ mappedActions }\n\t\t\t<BottomSeparatorCover />\n\t\t</View>\n\t);\n}\n\nexport default withPreferredColorScheme( PanelActions );\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/actions.native.js"],"names":["PanelActions","actions","getStylesFromColorScheme","mappedActions","map","label","onPress","styles","defaultLabelStyle","panelActionsContainer","panelActionsContainerDark"],"mappings":";;;;;;;;;AAUA;;AAPA;;AAKA;;AACA;;AAMA;;AACA;;AAhBA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AAIA,SAASA,YAAT,CAAuB;AAAEC,EAAAA,OAAF;AAAWC,EAAAA;AAAX,CAAvB,EAA+D;AAC9D,QAAMC,aAAa,GAAG,sBAAS,MAAM;AACpC,WAAOF,OAAO,CAACG,GAAR,CAAa,CAAE;AAAEC,MAAAA,KAAF;AAASC,MAAAA;AAAT,KAAF,KAA0B;AAC7C,aACC,4BAAC,uBAAD;AACC,QAAA,KAAK,EAAGD,KADT;AAEC,QAAA,OAAO,EAAGC,OAFX;AAGC,QAAA,UAAU,EAAGC,iBAAOC,iBAHrB;AAIC,QAAA,GAAG,EAAGH;AAJP,QADD;AAQA,KATM,CAAP;AAUA,GAXqB,EAWnB,CAAEJ,OAAF,CAXmB,CAAtB;AAaA,SACC,4BAAC,iBAAD;AACC,IAAA,KAAK,EAAGC,wBAAwB,CAC/BK,iBAAOE,qBADwB,EAE/BF,iBAAOG,yBAFwB;AADjC,KAMGP,aANH,EAOC,4BAAC,6BAAD,OAPD,CADD;AAWA;;eAEc,uCAA0BH,YAA1B,C","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { TextControl } from '@wordpress/components';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport styles from './actions.scss';\nimport BottomSeparatorCover from './bottom-separator-cover';\n\nfunction PanelActions( { actions, getStylesFromColorScheme } ) {\n\tconst mappedActions = useMemo( () => {\n\t\treturn actions.map( ( { label, onPress } ) => {\n\t\t\treturn (\n\t\t\t\t<TextControl\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tonPress={ onPress }\n\t\t\t\t\tlabelStyle={ styles.defaultLabelStyle }\n\t\t\t\t\tkey={ label }\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\t}, [ actions ] );\n\n\treturn (\n\t\t<View\n\t\t\tstyle={ getStylesFromColorScheme(\n\t\t\t\tstyles.panelActionsContainer,\n\t\t\t\tstyles.panelActionsContainerDark\n\t\t\t) }\n\t\t>\n\t\t\t{ mappedActions }\n\t\t\t<BottomSeparatorCover />\n\t\t</View>\n\t);\n}\n\nexport default withPreferredColorScheme( PanelActions );\n"]}

package/build/panel/body.js

@@ -11,8 +11,6 @@ exports.default = void 0;
 
 var _element = require("@wordpress/element");
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
 
 var _compose = require("@wordpress/compose");
@@ -67,9 +65,7 @@ function UnforwardedPanelBody(props, ref) {
   scrollAfterOpenRef.current = scrollAfterOpen; // Runs after initial render.
 
   (0, _utils.useUpdateEffect)(() => {
-    var _nodeRef$current;
-
-    if (isOpened && scrollAfterOpenRef.current && (_nodeRef$current = nodeRef.current) !== null && _nodeRef$current !== void 0 && _nodeRef$current.scrollIntoView) {
+    if (isOpened && scrollAfterOpenRef.current && nodeRef.current?.scrollIntoView) {
       /*
        * Scrolls the content into view when visible.
        * This improves the UX when there are multiple stacking <PanelBody />
@@ -88,31 +84,32 @@ function UnforwardedPanelBody(props, ref) {
   return (0, _element.createElement)("div", {
     className: classes,
     ref: (0, _compose.useMergeRefs)([nodeRef, ref])
-  }, (0, _element.createElement)(PanelBodyTitle, (0, _extends2.default)({
+  }, (0, _element.createElement)(PanelBodyTitle, {
     icon: icon,
     isOpened: Boolean(isOpened),
     onClick: handleOnToggle,
-    title: title
-  }, buttonProps)), typeof children === 'function' ? children({
+    title: title,
+    ...buttonProps
+  }), typeof children === 'function' ? children({
     opened: Boolean(isOpened)
   }) : isOpened && children);
 }
 
-const PanelBodyTitle = (0, _element.forwardRef)((_ref, ref) => {
-  let {
-    isOpened,
-    icon,
-    title,
-    ...props
-  } = _ref;
+const PanelBodyTitle = (0, _element.forwardRef)(({
+  isOpened,
+  icon,
+  title,
+  ...props
+}, ref) => {
   if (!title) return null;
   return (0, _element.createElement)("h2", {
     className: "components-panel__body-title"
-  }, (0, _element.createElement)(_button.default, (0, _extends2.default)({
+  }, (0, _element.createElement)(_button.default, {
     className: "components-panel__body-toggle",
     "aria-expanded": isOpened,
-    ref: ref
-  }, props), (0, _element.createElement)("span", {
+    ref: ref,
+    ...props
+  }, (0, _element.createElement)("span", {
     "aria-hidden": "true"
   }, (0, _element.createElement)(_icon.default, {
     className: "components-panel__arrow",

package/build/panel/body.js.map

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

package/build/panel/body.native.js

@@ -23,13 +23,12 @@ var _bottomSeparatorCover = _interopRequireDefault(require("./bottom-separator-c
 /**
  * Internal dependencies
  */
-function PanelBody(_ref) {
-  let {
-    children,
-    title,
-    style,
-    titleStyle = {}
-  } = _ref;
+function PanelBody({
+  children,
+  title,
+  style,
+  titleStyle = {}
+}) {
   return (0, _element.createElement)(_reactNative.View, {
     style: [_body.default.panelContainer, style]
   }, title && (0, _element.createElement)(_reactNative.Text, {

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/body.native.js"],"names":["PanelBody","children","title","style","titleStyle","styles","panelContainer","sectionHeaderText"],"mappings":";;;;;;;;;;;;AAGA;;AAKA;;AACA;;AATA;AACA;AACA;;AAGA;AACA;AACA;AAIO,SAASA,SAAT,OAAkE;AAAA,MAA9C;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,KAAZ;AAAmBC,IAAAA,KAAnB;AAA0BC,IAAAA,UAAU,GAAG;AAAvC,GAA8C;AACxE,SACC,4BAAC,iBAAD;AAAM,IAAA,KAAK,EAAG,CAAEC,cAAOC,cAAT,EAAyBH,KAAzB;AAAd,KACGD,KAAK,IACN,4BAAC,iBAAD;AACC,IAAA,iBAAiB,EAAC,QADnB;AAEC,IAAA,KAAK,EAAG,CAAEG,cAAOE,iBAAT,EAA4BH,UAA5B;AAFT,KAIGF,KAJH,CAFF,EASGD,QATH,EAUC,4BAAC,6BAAD,OAVD,CADD;AAcA;;eAEcD,S","sourcesContent":["/**\n * External dependencies\n */\nimport { Text, View } from 'react-native';\n\n/**\n * Internal dependencies\n */\nimport styles from './body.scss';\nimport BottomSeparatorCover from './bottom-separator-cover';\n\nexport function PanelBody( { children, title, style, titleStyle = {} } ) {\n\treturn (\n\t\t<View style={ [ styles.panelContainer, style ] }>\n\t\t\t{ title && (\n\t\t\t\t<Text\n\t\t\t\t\taccessibilityRole=\"header\"\n\t\t\t\t\tstyle={ [ styles.sectionHeaderText, titleStyle ] }\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</Text>\n\t\t\t) }\n\t\t\t{ children }\n\t\t\t<BottomSeparatorCover />\n\t\t</View>\n\t);\n}\n\nexport default PanelBody;\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/body.native.js"],"names":["PanelBody","children","title","style","titleStyle","styles","panelContainer","sectionHeaderText"],"mappings":";;;;;;;;;;;;AAGA;;AAKA;;AACA;;AATA;AACA;AACA;;AAGA;AACA;AACA;AAIO,SAASA,SAAT,CAAoB;AAAEC,EAAAA,QAAF;AAAYC,EAAAA,KAAZ;AAAmBC,EAAAA,KAAnB;AAA0BC,EAAAA,UAAU,GAAG;AAAvC,CAApB,EAAkE;AACxE,SACC,4BAAC,iBAAD;AAAM,IAAA,KAAK,EAAG,CAAEC,cAAOC,cAAT,EAAyBH,KAAzB;AAAd,KACGD,KAAK,IACN,4BAAC,iBAAD;AACC,IAAA,iBAAiB,EAAC,QADnB;AAEC,IAAA,KAAK,EAAG,CAAEG,cAAOE,iBAAT,EAA4BH,UAA5B;AAFT,KAIGF,KAJH,CAFF,EASGD,QATH,EAUC,4BAAC,6BAAD,OAVD,CADD;AAcA;;eAEcD,S","sourcesContent":["/**\n * External dependencies\n */\nimport { Text, View } from 'react-native';\n\n/**\n * Internal dependencies\n */\nimport styles from './body.scss';\nimport BottomSeparatorCover from './bottom-separator-cover';\n\nexport function PanelBody( { children, title, style, titleStyle = {} } ) {\n\treturn (\n\t\t<View style={ [ styles.panelContainer, style ] }>\n\t\t\t{ title && (\n\t\t\t\t<Text\n\t\t\t\t\taccessibilityRole=\"header\"\n\t\t\t\t\tstyle={ [ styles.sectionHeaderText, titleStyle ] }\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</Text>\n\t\t\t) }\n\t\t\t{ children }\n\t\t\t<BottomSeparatorCover />\n\t\t</View>\n\t);\n}\n\nexport default PanelBody;\n"]}

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

@@ -26,10 +26,9 @@ var _bottomSeparatorCover = _interopRequireDefault(require("./bottom-separator-c
 /**
  * Internal dependencies
  */
-function BottomSeparatorCover(_ref) {
-  let {
-    getStylesFromColorScheme
-  } = _ref;
+function BottomSeparatorCover({
+  getStylesFromColorScheme
+}) {
   return (0, _element.createElement)(_reactNative.View, {
     style: getStylesFromColorScheme(_bottomSeparatorCover.default.coverSeparator, _bottomSeparatorCover.default.coverSeparatorDark)
   });

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/bottom-separator-cover.native.js"],"names":["BottomSeparatorCover","getStylesFromColorScheme","styles","coverSeparator","coverSeparatorDark"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAGA,SAASA,oBAAT,OAA8D;AAAA,MAA/B;AAAEC,IAAAA;AAAF,GAA+B;AAC7D,SACC,4BAAC,iBAAD;AACC,IAAA,KAAK,EAAGA,wBAAwB,CAC/BC,8BAAOC,cADwB,EAE/BD,8BAAOE,kBAFwB;AADjC,IADD;AAQA;;eAEc,uCAA0BJ,oBAA1B,C","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './bottom-separator-cover.scss';\n\nfunction BottomSeparatorCover( { getStylesFromColorScheme } ) {\n\treturn (\n\t\t<View\n\t\t\tstyle={ getStylesFromColorScheme(\n\t\t\t\tstyles.coverSeparator,\n\t\t\t\tstyles.coverSeparatorDark\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default withPreferredColorScheme( BottomSeparatorCover );\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/bottom-separator-cover.native.js"],"names":["BottomSeparatorCover","getStylesFromColorScheme","styles","coverSeparator","coverSeparatorDark"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAGA,SAASA,oBAAT,CAA+B;AAAEC,EAAAA;AAAF,CAA/B,EAA8D;AAC7D,SACC,4BAAC,iBAAD;AACC,IAAA,KAAK,EAAGA,wBAAwB,CAC/BC,8BAAOC,cADwB,EAE/BD,8BAAOE,kBAFwB;AADjC,IADD;AAQA;;eAEc,uCAA0BJ,oBAA1B,C","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './bottom-separator-cover.scss';\n\nfunction BottomSeparatorCover( { getStylesFromColorScheme } ) {\n\treturn (\n\t\t<View\n\t\t\tstyle={ getStylesFromColorScheme(\n\t\t\t\tstyles.coverSeparator,\n\t\t\t\tstyles.coverSeparatorDark\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default withPreferredColorScheme( BottomSeparatorCover );\n"]}

package/build/panel/header.js

@@ -16,11 +16,10 @@ var _element = require("@wordpress/element");
  * This is used by the `Panel` component under the hood,
  * so it does not typically need to be used.
  */
-function PanelHeader(_ref) {
-  let {
-    label,
-    children
-  } = _ref;
+function PanelHeader({
+  label,
+  children
+}) {
   return (0, _element.createElement)("div", {
     className: "components-panel__header"
   }, label && (0, _element.createElement)("h2", null, label), children);

package/build/panel/header.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/header.tsx"],"names":["PanelHeader","label","children"],"mappings":";;;;;;;;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA,SAASA,WAAT,OAA8D;AAAA,MAAxC;AAAEC,IAAAA,KAAF;AAASC,IAAAA;AAAT,GAAwC;AAC7D,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGD,KAAK,IAAI,wCAAMA,KAAN,CADZ,EAEGC,QAFH,CADD;AAMA;;eAEcF,W","sourcesContent":["/**\n * Internal dependencies\n */\nimport type { PanelHeaderProps } from './types';\n\n/**\n * `PanelHeader` renders the header for the `Panel`.\n * This is used by the `Panel` component under the hood,\n * so it does not typically need to be used.\n */\nfunction PanelHeader( { label, children }: PanelHeaderProps ) {\n\treturn (\n\t\t<div className=\"components-panel__header\">\n\t\t\t{ label && <h2>{ label }</h2> }\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\nexport default PanelHeader;\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/header.tsx"],"names":["PanelHeader","label","children"],"mappings":";;;;;;;;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA,SAASA,WAAT,CAAsB;AAAEC,EAAAA,KAAF;AAASC,EAAAA;AAAT,CAAtB,EAA8D;AAC7D,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGD,KAAK,IAAI,wCAAMA,KAAN,CADZ,EAEGC,QAFH,CADD;AAMA;;eAEcF,W","sourcesContent":["/**\n * Internal dependencies\n */\nimport type { PanelHeaderProps } from './types';\n\n/**\n * `PanelHeader` renders the header for the `Panel`.\n * This is used by the `Panel` component under the hood,\n * so it does not typically need to be used.\n */\nfunction PanelHeader( { label, children }: PanelHeaderProps ) {\n\treturn (\n\t\t<div className=\"components-panel__header\">\n\t\t\t{ label && <h2>{ label }</h2> }\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\nexport default PanelHeader;\n"]}

package/build/panel/index.js

@@ -24,12 +24,11 @@ var _header = _interopRequireDefault(require("./header"));
 /**
  * Internal dependencies
  */
-function UnforwardedPanel(_ref, ref) {
-  let {
-    header,
-    className,
-    children
-  } = _ref;
+function UnforwardedPanel({
+  header,
+  className,
+  children
+}, ref) {
   const classNames = (0, _classnames.default)(className, 'components-panel');
   return (0, _element.createElement)("div", {
     className: classNames,

package/build/panel/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/index.tsx"],"names":["UnforwardedPanel","ref","header","className","children","classNames","Panel"],"mappings":";;;;;;;;;AAQA;;AALA;;AAUA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAIA,SAASA,gBAAT,OAECC,GAFD,EAGE;AAAA,MAFD;AAAEC,IAAAA,MAAF;AAAUC,IAAAA,SAAV;AAAqBC,IAAAA;AAArB,GAEC;AACD,QAAMC,UAAU,GAAG,yBAAYF,SAAZ,EAAuB,kBAAvB,CAAnB;AACA,SACC;AAAK,IAAA,SAAS,EAAGE,UAAjB;AAA8B,IAAA,GAAG,EAAGJ;AAApC,KACGC,MAAM,IAAI,4BAAC,eAAD;AAAa,IAAA,KAAK,EAAGA;AAArB,IADb,EAEGE,QAFH,CADD;AAMA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAME,KAAK,GAAG,yBAAYN,gBAAZ,CAAd;;eAEQM,K","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport PanelHeader from './header';\nimport type { PanelProps } from './types';\n\nfunction UnforwardedPanel(\n\t{ header, className, children }: PanelProps,\n\tref: React.ForwardedRef< HTMLDivElement >\n) {\n\tconst classNames = classnames( className, 'components-panel' );\n\treturn (\n\t\t<div className={ classNames } ref={ ref }>\n\t\t\t{ header && <PanelHeader label={ header } /> }\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\n/**\n * `Panel` expands and collapses multiple sections of content.\n *\n * ```jsx\n * import { Panel, PanelBody, PanelRow } from '@wordpress/components';\n * import { more } from '@wordpress/icons';\n *\n * const MyPanel = () => (\n * \t<Panel header=\"My Panel\">\n * \t\t<PanelBody title=\"My Block Settings\" icon={ more } initialOpen={ true }>\n * \t\t\t<PanelRow>My Panel Inputs and Labels</PanelRow>\n * \t\t</PanelBody>\n * \t</Panel>\n * );\n * ```\n */\nexport const Panel = forwardRef( UnforwardedPanel );\n\nexport default Panel;\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/index.tsx"],"names":["UnforwardedPanel","header","className","children","ref","classNames","Panel"],"mappings":";;;;;;;;;AAQA;;AALA;;AAUA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAIA,SAASA,gBAAT,CACC;AAAEC,EAAAA,MAAF;AAAUC,EAAAA,SAAV;AAAqBC,EAAAA;AAArB,CADD,EAECC,GAFD,EAGE;AACD,QAAMC,UAAU,GAAG,yBAAYH,SAAZ,EAAuB,kBAAvB,CAAnB;AACA,SACC;AAAK,IAAA,SAAS,EAAGG,UAAjB;AAA8B,IAAA,GAAG,EAAGD;AAApC,KACGH,MAAM,IAAI,4BAAC,eAAD;AAAa,IAAA,KAAK,EAAGA;AAArB,IADb,EAEGE,QAFH,CADD;AAMA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMG,KAAK,GAAG,yBAAYN,gBAAZ,CAAd;;eAEQM,K","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport PanelHeader from './header';\nimport type { PanelProps } from './types';\n\nfunction UnforwardedPanel(\n\t{ header, className, children }: PanelProps,\n\tref: React.ForwardedRef< HTMLDivElement >\n) {\n\tconst classNames = classnames( className, 'components-panel' );\n\treturn (\n\t\t<div className={ classNames } ref={ ref }>\n\t\t\t{ header && <PanelHeader label={ header } /> }\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\n/**\n * `Panel` expands and collapses multiple sections of content.\n *\n * ```jsx\n * import { Panel, PanelBody, PanelRow } from '@wordpress/components';\n * import { more } from '@wordpress/icons';\n *\n * const MyPanel = () => (\n * \t<Panel header=\"My Panel\">\n * \t\t<PanelBody title=\"My Block Settings\" icon={ more } initialOpen={ true }>\n * \t\t\t<PanelRow>My Panel Inputs and Labels</PanelRow>\n * \t\t</PanelBody>\n * \t</Panel>\n * );\n * ```\n */\nexport const Panel = forwardRef( UnforwardedPanel );\n\nexport default Panel;\n"]}

package/build/panel/row.js

@@ -18,11 +18,10 @@ var _classnames = _interopRequireDefault(require("classnames"));
 /**
  * WordPress dependencies
  */
-function UnforwardedPanelRow(_ref, ref) {
-  let {
-    className,
-    children
-  } = _ref;
+function UnforwardedPanelRow({
+  className,
+  children
+}, ref) {
   return (0, _element.createElement)("div", {
     className: (0, _classnames.default)('components-panel__row', className),
     ref: ref

package/build/panel/row.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/panel/row.tsx"],"names":["UnforwardedPanelRow","ref","className","children","PanelRow"],"mappings":";;;;;;;;;AAQA;;AALA;;AAHA;AACA;AACA;;AAGA;AACA;AACA;AASA,SAASA,mBAAT,OAECC,GAFD,EAGE;AAAA,MAFD;AAAEC,IAAAA,SAAF;AAAaC,IAAAA;AAAb,GAEC;AACD,SACC;AACC,IAAA,SAAS,EAAG,yBAAY,uBAAZ,EAAqCD,SAArC,CADb;AAEC,IAAA,GAAG,EAAGD;AAFP,KAIGE,QAJH,CADD;AAQA;AAED;AACA;AACA;AACA;;;AACO,MAAMC,QAAQ,GAAG,yBAAYJ,mBAAZ,CAAjB;;eAEQI,Q","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { PanelRowProps } from './types';\n\nfunction UnforwardedPanelRow(\n\t{ className, children }: PanelRowProps,\n\tref: ForwardedRef< HTMLDivElement >\n) {\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames( 'components-panel__row', className ) }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\n/**\n * `PanelRow` is a generic container for rows within a `PanelBody`.\n * It is a flex container with a top margin for spacing.\n */\nexport const PanelRow = forwardRef( UnforwardedPanelRow );\n\nexport default PanelRow;\n"]}
+{"version":3,"sources":["@wordpress/components/src/panel/row.tsx"],"names":["UnforwardedPanelRow","className","children","ref","PanelRow"],"mappings":";;;;;;;;;AAQA;;AALA;;AAHA;AACA;AACA;;AAGA;AACA;AACA;AASA,SAASA,mBAAT,CACC;AAAEC,EAAAA,SAAF;AAAaC,EAAAA;AAAb,CADD,EAECC,GAFD,EAGE;AACD,SACC;AACC,IAAA,SAAS,EAAG,yBAAY,uBAAZ,EAAqCF,SAArC,CADb;AAEC,IAAA,GAAG,EAAGE;AAFP,KAIGD,QAJH,CADD;AAQA;AAED;AACA;AACA;AACA;;;AACO,MAAME,QAAQ,GAAG,yBAAYJ,mBAAZ,CAAjB;;eAEQI,Q","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { PanelRowProps } from './types';\n\nfunction UnforwardedPanelRow(\n\t{ className, children }: PanelRowProps,\n\tref: ForwardedRef< HTMLDivElement >\n) {\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames( 'components-panel__row', className ) }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\n/**\n * `PanelRow` is a generic container for rows within a `PanelBody`.\n * It is a flex container with a top margin for spacing.\n */\nexport const PanelRow = forwardRef( UnforwardedPanelRow );\n\nexport default PanelRow;\n"]}

package/build/placeholder/index.js

@@ -10,8 +10,6 @@ exports.default = void 0;
 
 var _element = require("@wordpress/element");
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
 
 var _compose = require("@wordpress/compose");
@@ -84,9 +82,9 @@ function Placeholder(props) {
   const fieldsetClasses = (0, _classnames.default)('components-placeholder__fieldset', {
     'is-column-layout': isColumnLayout
   });
-  return (0, _element.createElement)("div", (0, _extends2.default)({}, additionalProps, {
+  return (0, _element.createElement)("div", { ...additionalProps,
     className: classes
-  }), withIllustration ? PlaceholderIllustration : null, resizeListener, notices, preview && (0, _element.createElement)("div", {
+  }, withIllustration ? PlaceholderIllustration : null, resizeListener, notices, preview && (0, _element.createElement)("div", {
     className: "components-placeholder__preview"
   }, preview), (0, _element.createElement)("div", {
     className: "components-placeholder__label"

package/build/placeholder/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/placeholder/index.tsx"],"names":["PlaceholderIllustration","Placeholder","props","icon","children","label","instructions","className","notices","preview","isColumnLayout","withIllustration","additionalProps","resizeListener","width","modifierClassNames","classes","fieldsetClasses"],"mappings":";;;;;;;;;;;;;;AAGA;;AAKA;;AACA;;AAKA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAKA,MAAMA,uBAAuB,GAC5B,4BAAC,eAAD;AACC,EAAA,SAAS,EAAC,sCADX;AAEC,EAAA,IAAI,EAAC,MAFN;AAGC,EAAA,KAAK,EAAC,4BAHP;AAIC,EAAA,OAAO,EAAC,WAJT;AAKC,EAAA,mBAAmB,EAAC;AALrB,GAOC,4BAAC,gBAAD;AAAM,EAAA,YAAY,EAAC,oBAAnB;AAAwC,EAAA,CAAC,EAAC;AAA1C,EAPD,CADD;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,WAAT,CACNC,KADM,EAEL;AACD,QAAM;AACLC,IAAAA,IADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,KAHK;AAILC,IAAAA,YAJK;AAKLC,IAAAA,SALK;AAMLC,IAAAA,OANK;AAOLC,IAAAA,OAPK;AAQLC,IAAAA,cARK;AASLC,IAAAA,gBATK;AAUL,OAAGC;AAVE,MAWFV,KAXJ;AAYA,QAAM,CAAEW,cAAF,EAAkB;AAAEC,IAAAA;AAAF,GAAlB,IAAgC,iCAAtC,CAbC,CAeD;AACA;;AACA,MAAIC,kBAAJ;;AACA,MAAK,OAAOD,KAAP,KAAiB,QAAtB,EAAiC;AAChCC,IAAAA,kBAAkB,GAAG;AACpB,kBAAYD,KAAK,IAAI,GADD;AAEpB,mBAAaA,KAAK,IAAI,GAAT,IAAgBA,KAAK,GAAG,GAFjB;AAGpB,kBAAYA,KAAK,GAAG;AAHA,KAArB;AAKA;;AAED,QAAME,OAAO,GAAG,yBACf,wBADe,EAEfT,SAFe,EAGfQ,kBAHe,EAIfJ,gBAAgB,GAAG,kBAAH,GAAwB,IAJzB,CAAhB;AAMA,QAAMM,eAAe,GAAG,yBAAY,kCAAZ,EAAgD;AACvE,wBAAoBP;AADmD,GAAhD,CAAxB;AAGA,SACC,8DAAUE,eAAV;AAA4B,IAAA,SAAS,EAAGI;AAAxC,MACGL,gBAAgB,GAAGX,uBAAH,GAA6B,IADhD,EAEGa,cAFH,EAGGL,OAHH,EAIGC,OAAO,IACR;AAAK,IAAA,SAAS,EAAC;AAAf,KACGA,OADH,CALF,EASC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,4BAAC,aAAD;AAAM,IAAA,IAAI,EAAGN;AAAb,IADD,EAEGE,KAFH,CATD,EAaC;AAAU,IAAA,SAAS,EAAGY;AAAtB,KACG,CAAC,CAAEX,YAAH,IACD;AAAQ,IAAA,SAAS,EAAC;AAAlB,KACGA,YADH,CAFF,EAMGF,QANH,CAbD,CADD;AAwBA;;eAEcH,W","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useResizeObserver } from '@wordpress/compose';\nimport { SVG, Path } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport Icon from '../icon';\nimport type { PlaceholderProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst PlaceholderIllustration = (\n\t<SVG\n\t\tclassName=\"components-placeholder__illustration\"\n\t\tfill=\"none\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox=\"0 0 60 60\"\n\t\tpreserveAspectRatio=\"none\"\n\t>\n\t\t<Path vectorEffect=\"non-scaling-stroke\" d=\"M60 60 0 0\" />\n\t</SVG>\n);\n\n/**\n * Renders a placeholder. Normally used by blocks to render their empty state.\n *\n * ```jsx\n * import { Placeholder } from '@wordpress/components';\n * import { more } from '@wordpress/icons';\n *\n * const MyPlaceholder = () => <Placeholder icon={ more } label=\"Placeholder\" />;\n * ```\n */\nexport function Placeholder(\n\tprops: WordPressComponentProps< PlaceholderProps, 'div', false >\n) {\n\tconst {\n\t\ticon,\n\t\tchildren,\n\t\tlabel,\n\t\tinstructions,\n\t\tclassName,\n\t\tnotices,\n\t\tpreview,\n\t\tisColumnLayout,\n\t\twithIllustration,\n\t\t...additionalProps\n\t} = props;\n\tconst [ resizeListener, { width } ] = useResizeObserver();\n\n\t// Since `useResizeObserver` will report a width of `null` until after the\n\t// first render, avoid applying any modifier classes until width is known.\n\tlet modifierClassNames;\n\tif ( typeof width === 'number' ) {\n\t\tmodifierClassNames = {\n\t\t\t'is-large': width >= 480,\n\t\t\t'is-medium': width >= 160 && width < 480,\n\t\t\t'is-small': width < 160,\n\t\t};\n\t}\n\n\tconst classes = classnames(\n\t\t'components-placeholder',\n\t\tclassName,\n\t\tmodifierClassNames,\n\t\twithIllustration ? 'has-illustration' : null\n\t);\n\tconst fieldsetClasses = classnames( 'components-placeholder__fieldset', {\n\t\t'is-column-layout': isColumnLayout,\n\t} );\n\treturn (\n\t\t<div { ...additionalProps } className={ classes }>\n\t\t\t{ withIllustration ? PlaceholderIllustration : null }\n\t\t\t{ resizeListener }\n\t\t\t{ notices }\n\t\t\t{ preview && (\n\t\t\t\t<div className=\"components-placeholder__preview\">\n\t\t\t\t\t{ preview }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-placeholder__label\">\n\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t{ label }\n\t\t\t</div>\n\t\t\t<fieldset className={ fieldsetClasses }>\n\t\t\t\t{ !! instructions && (\n\t\t\t\t\t<legend className=\"components-placeholder__instructions\">\n\t\t\t\t\t\t{ instructions }\n\t\t\t\t\t</legend>\n\t\t\t\t) }\n\t\t\t\t{ children }\n\t\t\t</fieldset>\n\t\t</div>\n\t);\n}\n\nexport default Placeholder;\n"]}
+{"version":3,"sources":["@wordpress/components/src/placeholder/index.tsx"],"names":["PlaceholderIllustration","Placeholder","props","icon","children","label","instructions","className","notices","preview","isColumnLayout","withIllustration","additionalProps","resizeListener","width","modifierClassNames","classes","fieldsetClasses"],"mappings":";;;;;;;;;;;;AAGA;;AAKA;;AACA;;AAKA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAKA,MAAMA,uBAAuB,GAC5B,4BAAC,eAAD;AACC,EAAA,SAAS,EAAC,sCADX;AAEC,EAAA,IAAI,EAAC,MAFN;AAGC,EAAA,KAAK,EAAC,4BAHP;AAIC,EAAA,OAAO,EAAC,WAJT;AAKC,EAAA,mBAAmB,EAAC;AALrB,GAOC,4BAAC,gBAAD;AAAM,EAAA,YAAY,EAAC,oBAAnB;AAAwC,EAAA,CAAC,EAAC;AAA1C,EAPD,CADD;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,WAAT,CACNC,KADM,EAEL;AACD,QAAM;AACLC,IAAAA,IADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,KAHK;AAILC,IAAAA,YAJK;AAKLC,IAAAA,SALK;AAMLC,IAAAA,OANK;AAOLC,IAAAA,OAPK;AAQLC,IAAAA,cARK;AASLC,IAAAA,gBATK;AAUL,OAAGC;AAVE,MAWFV,KAXJ;AAYA,QAAM,CAAEW,cAAF,EAAkB;AAAEC,IAAAA;AAAF,GAAlB,IAAgC,iCAAtC,CAbC,CAeD;AACA;;AACA,MAAIC,kBAAJ;;AACA,MAAK,OAAOD,KAAP,KAAiB,QAAtB,EAAiC;AAChCC,IAAAA,kBAAkB,GAAG;AACpB,kBAAYD,KAAK,IAAI,GADD;AAEpB,mBAAaA,KAAK,IAAI,GAAT,IAAgBA,KAAK,GAAG,GAFjB;AAGpB,kBAAYA,KAAK,GAAG;AAHA,KAArB;AAKA;;AAED,QAAME,OAAO,GAAG,yBACf,wBADe,EAEfT,SAFe,EAGfQ,kBAHe,EAIfJ,gBAAgB,GAAG,kBAAH,GAAwB,IAJzB,CAAhB;AAMA,QAAMM,eAAe,GAAG,yBAAY,kCAAZ,EAAgD;AACvE,wBAAoBP;AADmD,GAAhD,CAAxB;AAGA,SACC,wCAAUE,eAAV;AAA4B,IAAA,SAAS,EAAGI;AAAxC,KACGL,gBAAgB,GAAGX,uBAAH,GAA6B,IADhD,EAEGa,cAFH,EAGGL,OAHH,EAIGC,OAAO,IACR;AAAK,IAAA,SAAS,EAAC;AAAf,KACGA,OADH,CALF,EASC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,4BAAC,aAAD;AAAM,IAAA,IAAI,EAAGN;AAAb,IADD,EAEGE,KAFH,CATD,EAaC;AAAU,IAAA,SAAS,EAAGY;AAAtB,KACG,CAAC,CAAEX,YAAH,IACD;AAAQ,IAAA,SAAS,EAAC;AAAlB,KACGA,YADH,CAFF,EAMGF,QANH,CAbD,CADD;AAwBA;;eAEcH,W","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useResizeObserver } from '@wordpress/compose';\nimport { SVG, Path } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport Icon from '../icon';\nimport type { PlaceholderProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst PlaceholderIllustration = (\n\t<SVG\n\t\tclassName=\"components-placeholder__illustration\"\n\t\tfill=\"none\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox=\"0 0 60 60\"\n\t\tpreserveAspectRatio=\"none\"\n\t>\n\t\t<Path vectorEffect=\"non-scaling-stroke\" d=\"M60 60 0 0\" />\n\t</SVG>\n);\n\n/**\n * Renders a placeholder. Normally used by blocks to render their empty state.\n *\n * ```jsx\n * import { Placeholder } from '@wordpress/components';\n * import { more } from '@wordpress/icons';\n *\n * const MyPlaceholder = () => <Placeholder icon={ more } label=\"Placeholder\" />;\n * ```\n */\nexport function Placeholder(\n\tprops: WordPressComponentProps< PlaceholderProps, 'div', false >\n) {\n\tconst {\n\t\ticon,\n\t\tchildren,\n\t\tlabel,\n\t\tinstructions,\n\t\tclassName,\n\t\tnotices,\n\t\tpreview,\n\t\tisColumnLayout,\n\t\twithIllustration,\n\t\t...additionalProps\n\t} = props;\n\tconst [ resizeListener, { width } ] = useResizeObserver();\n\n\t// Since `useResizeObserver` will report a width of `null` until after the\n\t// first render, avoid applying any modifier classes until width is known.\n\tlet modifierClassNames;\n\tif ( typeof width === 'number' ) {\n\t\tmodifierClassNames = {\n\t\t\t'is-large': width >= 480,\n\t\t\t'is-medium': width >= 160 && width < 480,\n\t\t\t'is-small': width < 160,\n\t\t};\n\t}\n\n\tconst classes = classnames(\n\t\t'components-placeholder',\n\t\tclassName,\n\t\tmodifierClassNames,\n\t\twithIllustration ? 'has-illustration' : null\n\t);\n\tconst fieldsetClasses = classnames( 'components-placeholder__fieldset', {\n\t\t'is-column-layout': isColumnLayout,\n\t} );\n\treturn (\n\t\t<div { ...additionalProps } className={ classes }>\n\t\t\t{ withIllustration ? PlaceholderIllustration : null }\n\t\t\t{ resizeListener }\n\t\t\t{ notices }\n\t\t\t{ preview && (\n\t\t\t\t<div className=\"components-placeholder__preview\">\n\t\t\t\t\t{ preview }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-placeholder__label\">\n\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t{ label }\n\t\t\t</div>\n\t\t\t<fieldset className={ fieldsetClasses }>\n\t\t\t\t{ !! instructions && (\n\t\t\t\t\t<legend className=\"components-placeholder__instructions\">\n\t\t\t\t\t\t{ instructions }\n\t\t\t\t\t</legend>\n\t\t\t\t) }\n\t\t\t\t{ children }\n\t\t\t</fieldset>\n\t\t</div>\n\t);\n}\n\nexport default Placeholder;\n"]}