@wordpress/components 23.8.0 → 24.0.0

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","onClose","color","newColor","gradient","newGradient","Option","canOnlyChangeValues","isEditing","onStartEditing","onRemove","onStopEditing","focusOutsideProps","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 { paramCase as kebabCase } from 'change-case';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useRef, useEffect, useCallback } 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\tonClose = () => {},\n}: ColorPickerPopoverProps< T > ) {\n\treturn (\n\t\t<Popover\n\t\t\tplacement=\"left-start\"\n\t\t\toffset={ 20 }\n\t\t\tclassName=\"components-palette-edit__popover\"\n\t\t\tonClose={ onClose }\n\t\t>\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\tslugPrefix,\n\tisGradient,\n}: OptionProps< T > ) {\n\tconst focusOutsideProps = useFocusOutside( onStopEditing );\n\tconst value = isGradient ? element.gradient : element.color;\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\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/>\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}: 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/>\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}: 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/>\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/>\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/popover/index.js

@@ -83,23 +83,16 @@ const AnimatedWrapper = (0, _element.forwardRef)((_ref, forwardedRef) => {
     shouldAnimate = false,
     ...props
   } = _ref;
-  // When animating, animate only once (i.e. when the popover is opened), and
-  // do not animate on subsequent prop changes (as it conflicts with
-  // floating-ui's positioning updates).
-  const [hasAnimatedOnce, setHasAnimatedOnce] = (0, _element.useState)(false);
   const shouldReduceMotion = (0, _framerMotion.useReducedMotion)();
   const {
     style: motionInlineStyles,
     ...otherMotionProps
   } = (0, _element.useMemo)(() => (0, _utils.placementToMotionAnimationProps)(placement), [placement]);
-  const onAnimationComplete = (0, _element.useCallback)(() => setHasAnimatedOnce(true), []);
   const computedAnimationProps = shouldAnimate && !shouldReduceMotion ? {
     style: { ...motionInlineStyles,
       ...receivedInlineStyles
     },
-    ...otherMotionProps,
-    onAnimationComplete,
-    animate: hasAnimatedOnce ? false : otherMotionProps.animate
+    ...otherMotionProps
   } : {
     animate: false,
     style: receivedInlineStyles

package/build/popover/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/popover/index.tsx"],"names":["SLOT_NAME","ArrowTriangle","AnimatedWrapper","forwardedRef","style","receivedInlineStyles","placement","shouldAnimate","props","hasAnimatedOnce","setHasAnimatedOnce","shouldReduceMotion","motionInlineStyles","otherMotionProps","onAnimationComplete","computedAnimationProps","animate","slotNameContext","undefined","UnforwardedPopover","headerTitle","onClose","children","className","noArrow","position","placementProp","offset","offsetProp","focusOnMount","anchor","expandOnMobile","onFocusOutside","__unstableSlotName","flip","resize","shift","variant","__unstableForcePosition","anchorRef","anchorRect","getAnchorRect","isAlternate","contentProps","computedFlipProp","computedResizeProp","since","version","alternative","computedVariant","arrowRef","fallbackReferenceElement","setFallbackReferenceElement","referenceOwnerDocument","setReferenceOwnerDocument","anchorRefFallback","node","isMobileViewport","isExpanded","hasArrow","normalizedPlacementFromProps","frameOffsetRef","middleware","name","fn","x","y","current","data","amount","apply","sizeProps","firstElementChild","refs","floating","HTMLElement","Object","assign","maxHeight","availableHeight","overflow","crossAxis","limiter","padding","element","filter","m","slotName","slot","onDialogClose","type","event","dialogRef","dialogProps","__unstableOnClose","reference","referenceCallbackRef","strategy","update","computedPlacement","middlewareData","arrow","arrowData","whileElementsMounted","referenceParam","floatingParam","updateParam","animationFrame","arrowCallbackRef","anchorRefTop","top","anchorRefBottom","bottom","anchorRefStartContainer","startContainer","anchorRefCurrent","resultingReferenceOwnerDoc","fallbackDocument","document","scale","resultingReferenceElement","ownerDocument","defaultView","frameElement","scrollContainer","updateFrameOffset","addEventListener","removeEventListener","mergedFloatingRef","content","left","Math","round","close","split","join","Number","isFinite","ref","Popover","PopoverSlot","Slot","__unstableSlotNameProvider","Provider"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef, SyntheticEvent, RefCallback } from 'react';\nimport classnames from 'classnames';\nimport {\n\tuseFloating,\n\tflip as flipMiddleware,\n\tshift as shiftMiddleware,\n\tautoUpdate,\n\tarrow,\n\toffset as offsetMiddleware,\n\tsize,\n\tMiddleware,\n\tMiddlewareArguments,\n} from '@floating-ui/react-dom';\n// eslint-disable-next-line no-restricted-imports\nimport {\n\tmotion,\n\tuseReducedMotion,\n\tHTMLMotionProps,\n\tMotionProps,\n} from 'framer-motion';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseRef,\n\tuseLayoutEffect,\n\tforwardRef,\n\tcreateContext,\n\tuseContext,\n\tuseMemo,\n\tuseState,\n\tuseCallback,\n} from '@wordpress/element';\nimport {\n\tuseViewportMatch,\n\tuseMergeRefs,\n\t__experimentalUseDialog as useDialog,\n} from '@wordpress/compose';\nimport { close } from '@wordpress/icons';\nimport deprecated from '@wordpress/deprecated';\nimport { Path, SVG } from '@wordpress/primitives';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport ScrollLock from '../scroll-lock';\nimport { Slot, Fill, useSlot } from '../slot-fill';\nimport {\n\tgetFrameOffset,\n\tgetFrameScale,\n\tpositionToPlacement,\n\tplacementToMotionAnimationProps,\n\tgetReferenceOwnerDocument,\n\tgetReferenceElement,\n} from './utils';\nimport type { WordPressComponentProps } from '../ui/context';\nimport type {\n\tPopoverProps,\n\tAnimatedWrapperProps,\n\tPopoverAnchorRefReference,\n\tPopoverAnchorRefTopBottom,\n} from './types';\nimport { limitShift as customLimitShift } from './limit-shift';\nimport { overlayMiddlewares } from './overlay-middlewares';\n\n/**\n * Name of slot in which popover should fill.\n *\n * @type {string}\n */\nconst SLOT_NAME = 'Popover';\n\n// An SVG displaying a triangle facing down, filled with a solid\n// color and bordered in such a way to create an arrow-like effect.\n// Keeping the SVG's viewbox squared simplify the arrow positioning\n// calculations.\nconst ArrowTriangle = () => (\n\t<SVG\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox={ `0 0 100 100` }\n\t\tclassName=\"components-popover__triangle\"\n\t\trole=\"presentation\"\n\t>\n\t\t<Path\n\t\t\tclassName=\"components-popover__triangle-bg\"\n\t\t\td=\"M 0 0 L 50 50 L 100 0\"\n\t\t/>\n\t\t<Path\n\t\t\tclassName=\"components-popover__triangle-border\"\n\t\t\td=\"M 0 0 L 50 50 L 100 0\"\n\t\t\tvectorEffect=\"non-scaling-stroke\"\n\t\t/>\n\t</SVG>\n);\n\nconst AnimatedWrapper = forwardRef(\n\t(\n\t\t{\n\t\t\tstyle: receivedInlineStyles,\n\t\t\tplacement,\n\t\t\tshouldAnimate = false,\n\t\t\t...props\n\t\t}: HTMLMotionProps< 'div' > & AnimatedWrapperProps,\n\t\tforwardedRef: ForwardedRef< any >\n\t) => {\n\t\t// When animating, animate only once (i.e. when the popover is opened), and\n\t\t// do not animate on subsequent prop changes (as it conflicts with\n\t\t// floating-ui's positioning updates).\n\t\tconst [ hasAnimatedOnce, setHasAnimatedOnce ] = useState( false );\n\t\tconst shouldReduceMotion = useReducedMotion();\n\n\t\tconst { style: motionInlineStyles, ...otherMotionProps } = useMemo(\n\t\t\t() => placementToMotionAnimationProps( placement ),\n\t\t\t[ placement ]\n\t\t);\n\n\t\tconst onAnimationComplete = useCallback(\n\t\t\t() => setHasAnimatedOnce( true ),\n\t\t\t[]\n\t\t);\n\n\t\tconst computedAnimationProps: HTMLMotionProps< 'div' > =\n\t\t\tshouldAnimate && ! shouldReduceMotion\n\t\t\t\t? {\n\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t...motionInlineStyles,\n\t\t\t\t\t\t\t...receivedInlineStyles,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t...otherMotionProps,\n\t\t\t\t\t\tonAnimationComplete,\n\t\t\t\t\t\tanimate: hasAnimatedOnce\n\t\t\t\t\t\t\t? false\n\t\t\t\t\t\t\t: otherMotionProps.animate,\n\t\t\t\t  }\n\t\t\t\t: {\n\t\t\t\t\t\tanimate: false,\n\t\t\t\t\t\tstyle: receivedInlineStyles,\n\t\t\t\t  };\n\n\t\treturn (\n\t\t\t<motion.div\n\t\t\t\t{ ...computedAnimationProps }\n\t\t\t\t{ ...props }\n\t\t\t\tref={ forwardedRef }\n\t\t\t/>\n\t\t);\n\t}\n);\n\nconst slotNameContext = createContext< string | undefined >( undefined );\n\nconst UnforwardedPopover = (\n\tprops: Omit<\n\t\tWordPressComponentProps< PopoverProps, 'div', false >,\n\t\t// To avoid overlaps between the standard HTML attributes and the props\n\t\t// expected by `framer-motion`, omit all framer motion props from popover\n\t\t// props (except for `animate`, which is re-defined in `PopoverProps`).\n\t\tkeyof Omit< MotionProps, 'animate' >\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\tanimate = true,\n\t\theaderTitle,\n\t\tonClose,\n\t\tchildren,\n\t\tclassName,\n\t\tnoArrow = true,\n\t\tposition,\n\t\tplacement: placementProp = 'bottom-start',\n\t\toffset: offsetProp = 0,\n\t\tfocusOnMount = 'firstElement',\n\t\tanchor,\n\t\texpandOnMobile,\n\t\tonFocusOutside,\n\t\t__unstableSlotName = SLOT_NAME,\n\t\tflip = true,\n\t\tresize = true,\n\t\tshift = false,\n\t\tvariant,\n\n\t\t// Deprecated props\n\t\t__unstableForcePosition,\n\t\tanchorRef,\n\t\tanchorRect,\n\t\tgetAnchorRect,\n\t\tisAlternate,\n\n\t\t// Rest\n\t\t...contentProps\n\t} = props;\n\n\tlet computedFlipProp = flip;\n\tlet computedResizeProp = resize;\n\tif ( __unstableForcePosition !== undefined ) {\n\t\tdeprecated( '`__unstableForcePosition` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t\talternative: '`flip={ false }` and  `resize={ false }`',\n\t\t} );\n\n\t\t// Back-compat, set the `flip` and `resize` props\n\t\t// to `false` to replicate `__unstableForcePosition`.\n\t\tcomputedFlipProp = ! __unstableForcePosition;\n\t\tcomputedResizeProp = ! __unstableForcePosition;\n\t}\n\n\tif ( anchorRef !== undefined ) {\n\t\tdeprecated( '`anchorRef` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\talternative: '`anchor` prop',\n\t\t} );\n\t}\n\n\tif ( anchorRect !== undefined ) {\n\t\tdeprecated( '`anchorRect` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\talternative: '`anchor` prop',\n\t\t} );\n\t}\n\n\tif ( getAnchorRect !== undefined ) {\n\t\tdeprecated( '`getAnchorRect` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\talternative: '`anchor` prop',\n\t\t} );\n\t}\n\n\tconst computedVariant = isAlternate ? 'toolbar' : variant;\n\tif ( isAlternate !== undefined ) {\n\t\tdeprecated( '`isAlternate` prop in wp.components.Popover', {\n\t\t\tsince: '6.2',\n\t\t\talternative: \"`variant` prop with the `'toolbar'` value\",\n\t\t} );\n\t}\n\n\tconst arrowRef = useRef< HTMLElement | null >( null );\n\n\tconst [ fallbackReferenceElement, setFallbackReferenceElement ] =\n\t\tuseState< HTMLSpanElement | null >( null );\n\tconst [ referenceOwnerDocument, setReferenceOwnerDocument ] = useState<\n\t\tDocument | undefined\n\t>();\n\n\tconst anchorRefFallback: RefCallback< HTMLSpanElement > = useCallback(\n\t\t( node ) => {\n\t\t\tsetFallbackReferenceElement( node );\n\t\t},\n\t\t[]\n\t);\n\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst isExpanded = expandOnMobile && isMobileViewport;\n\tconst hasArrow = ! isExpanded && ! noArrow;\n\tconst normalizedPlacementFromProps = position\n\t\t? positionToPlacement( position )\n\t\t: placementProp;\n\n\t/**\n\t * Offsets the position of the popover when the anchor is inside an iframe.\n\t *\n\t * Store the offset in a ref, due to constraints with floating-ui:\n\t * https://floating-ui.com/docs/react-dom#variables-inside-middleware-functions.\n\t */\n\tconst frameOffsetRef = useRef( getFrameOffset( referenceOwnerDocument ) );\n\n\tconst middleware = [\n\t\t...( placementProp === 'overlay' ? overlayMiddlewares() : [] ),\n\t\t// Custom middleware which adjusts the popover's position by taking into\n\t\t// account the offset of the anchor's iframe (if any) compared to the page.\n\t\t{\n\t\t\tname: 'frameOffset',\n\t\t\tfn( { x, y }: MiddlewareArguments ) {\n\t\t\t\tif ( ! frameOffsetRef.current ) {\n\t\t\t\t\treturn {\n\t\t\t\t\t\tx,\n\t\t\t\t\t\ty,\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\treturn {\n\t\t\t\t\tx: x + frameOffsetRef.current.x,\n\t\t\t\t\ty: y + frameOffsetRef.current.y,\n\t\t\t\t\tdata: {\n\t\t\t\t\t\t// This will be used in the customLimitShift() function.\n\t\t\t\t\t\tamount: frameOffsetRef.current,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t},\n\t\t},\n\t\toffsetMiddleware( offsetProp ),\n\t\tcomputedFlipProp ? flipMiddleware() : undefined,\n\t\tcomputedResizeProp\n\t\t\t? size( {\n\t\t\t\t\tapply( sizeProps ) {\n\t\t\t\t\t\tconst { firstElementChild } =\n\t\t\t\t\t\t\trefs.floating.current ?? {};\n\n\t\t\t\t\t\t// Only HTMLElement instances have the `style` property.\n\t\t\t\t\t\tif ( ! ( firstElementChild instanceof HTMLElement ) )\n\t\t\t\t\t\t\treturn;\n\n\t\t\t\t\t\t// Reduce the height of the popover to the available space.\n\t\t\t\t\t\tObject.assign( firstElementChild.style, {\n\t\t\t\t\t\t\tmaxHeight: `${ sizeProps.availableHeight }px`,\n\t\t\t\t\t\t\toverflow: 'auto',\n\t\t\t\t\t\t} );\n\t\t\t\t\t},\n\t\t\t  } )\n\t\t\t: undefined,\n\t\tshift\n\t\t\t? shiftMiddleware( {\n\t\t\t\t\tcrossAxis: true,\n\t\t\t\t\tlimiter: customLimitShift(),\n\t\t\t\t\tpadding: 1, // Necessary to avoid flickering at the edge of the viewport.\n\t\t\t  } )\n\t\t\t: undefined,\n\t\tarrow( { element: arrowRef } ),\n\t].filter(\n\t\t( m: Middleware | undefined ): m is Middleware => m !== undefined\n\t);\n\tconst slotName = useContext( slotNameContext ) || __unstableSlotName;\n\tconst slot = useSlot( slotName );\n\n\tlet onDialogClose;\n\n\tif ( onClose || onFocusOutside ) {\n\t\tonDialogClose = ( type: string | undefined, event: SyntheticEvent ) => {\n\t\t\t// Ideally the popover should have just a single onClose prop and\n\t\t\t// not three props that potentially do the same thing.\n\t\t\tif ( type === 'focus-outside' && onFocusOutside ) {\n\t\t\t\tonFocusOutside( event );\n\t\t\t} else if ( onClose ) {\n\t\t\t\tonClose();\n\t\t\t}\n\t\t};\n\t}\n\n\tconst [ dialogRef, dialogProps ] = useDialog( {\n\t\tfocusOnMount,\n\t\t__unstableOnClose: onDialogClose,\n\t\t// @ts-expect-error The __unstableOnClose property needs to be deprecated first (see https://github.com/WordPress/gutenberg/pull/27675)\n\t\tonClose: onDialogClose,\n\t} );\n\n\tconst {\n\t\t// Positioning coordinates\n\t\tx,\n\t\ty,\n\t\t// Callback refs (not regular refs). This allows the position to be updated.\n\t\t// when either elements change.\n\t\treference: referenceCallbackRef,\n\t\tfloating,\n\t\t// Object with \"regular\" refs to both \"reference\" and \"floating\"\n\t\trefs,\n\t\t// Type of CSS position property to use (absolute or fixed)\n\t\tstrategy,\n\t\tupdate,\n\t\tplacement: computedPlacement,\n\t\tmiddlewareData: { arrow: arrowData },\n\t} = useFloating( {\n\t\tplacement:\n\t\t\tnormalizedPlacementFromProps === 'overlay'\n\t\t\t\t? undefined\n\t\t\t\t: normalizedPlacementFromProps,\n\t\tmiddleware,\n\t\twhileElementsMounted: ( referenceParam, floatingParam, updateParam ) =>\n\t\t\tautoUpdate( referenceParam, floatingParam, updateParam, {\n\t\t\t\tanimationFrame: true,\n\t\t\t} ),\n\t} );\n\n\tconst arrowCallbackRef = useCallback(\n\t\t( node: HTMLElement | null ) => {\n\t\t\tarrowRef.current = node;\n\t\t\tupdate();\n\t\t},\n\t\t[ update ]\n\t);\n\n\t// When any of the possible anchor \"sources\" change,\n\t// recompute the reference element (real or virtual) and its owner document.\n\n\tconst anchorRefTop = ( anchorRef as PopoverAnchorRefTopBottom | undefined )\n\t\t?.top;\n\tconst anchorRefBottom = (\n\t\tanchorRef as PopoverAnchorRefTopBottom | undefined\n\t )?.bottom;\n\tconst anchorRefStartContainer = ( anchorRef as Range | undefined )\n\t\t?.startContainer;\n\tconst anchorRefCurrent = ( anchorRef as PopoverAnchorRefReference )\n\t\t?.current;\n\n\tuseLayoutEffect( () => {\n\t\tconst resultingReferenceOwnerDoc = getReferenceOwnerDocument( {\n\t\t\tanchor,\n\t\t\tanchorRef,\n\t\t\tanchorRect,\n\t\t\tgetAnchorRect,\n\t\t\tfallbackReferenceElement,\n\t\t\tfallbackDocument: document,\n\t\t} );\n\t\tconst scale = getFrameScale( resultingReferenceOwnerDoc );\n\t\tconst resultingReferenceElement = getReferenceElement( {\n\t\t\tanchor,\n\t\t\tanchorRef,\n\t\t\tanchorRect,\n\t\t\tgetAnchorRect,\n\t\t\tfallbackReferenceElement,\n\t\t\tscale,\n\t\t} );\n\n\t\treferenceCallbackRef( resultingReferenceElement );\n\n\t\tsetReferenceOwnerDocument( resultingReferenceOwnerDoc );\n\t}, [\n\t\tanchor,\n\t\tanchorRef,\n\t\tanchorRefTop,\n\t\tanchorRefBottom,\n\t\tanchorRefStartContainer,\n\t\tanchorRefCurrent,\n\t\tanchorRect,\n\t\tgetAnchorRect,\n\t\tfallbackReferenceElement,\n\t\treferenceCallbackRef,\n\t] );\n\n\t// If the reference element is in a different ownerDocument (e.g. iFrame),\n\t// we need to manually update the floating's position as the reference's owner\n\t// document scrolls. Also update the frame offset if the view resizes.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\t// Reference and root documents are the same.\n\t\t\treferenceOwnerDocument === document ||\n\t\t\t// Reference and floating are in the same document.\n\t\t\treferenceOwnerDocument === refs.floating.current?.ownerDocument ||\n\t\t\t// The reference's document has no view (i.e. window)\n\t\t\t// or frame element (ie. it's not an iframe).\n\t\t\t! referenceOwnerDocument?.defaultView?.frameElement\n\t\t) {\n\t\t\tframeOffsetRef.current = undefined;\n\t\t\treturn;\n\t\t}\n\n\t\tconst { defaultView } = referenceOwnerDocument;\n\t\tconst { frameElement } = defaultView;\n\n\t\tconst scrollContainer = frameElement\n\t\t\t? getScrollContainer( frameElement )\n\t\t\t: null;\n\n\t\tconst updateFrameOffset = () => {\n\t\t\tframeOffsetRef.current = getFrameOffset( referenceOwnerDocument );\n\t\t\tupdate();\n\t\t};\n\t\tdefaultView.addEventListener( 'resize', updateFrameOffset );\n\t\tscrollContainer?.addEventListener( 'scroll', updateFrameOffset );\n\n\t\tupdateFrameOffset();\n\n\t\treturn () => {\n\t\t\tdefaultView.removeEventListener( 'resize', updateFrameOffset );\n\t\t\tscrollContainer?.removeEventListener( 'scroll', updateFrameOffset );\n\t\t};\n\t}, [ referenceOwnerDocument, update, refs.floating ] );\n\n\tconst mergedFloatingRef = useMergeRefs( [\n\t\tfloating,\n\t\tdialogRef,\n\t\tforwardedRef,\n\t] );\n\n\t// Disable reason: We care to capture the _bubbled_ events from inputs\n\t// within popover as inferring close intent.\n\n\tlet content = (\n\t\t// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<AnimatedWrapper\n\t\t\tshouldAnimate={ animate && ! isExpanded }\n\t\t\tplacement={ computedPlacement }\n\t\t\tclassName={ classnames( 'components-popover', className, {\n\t\t\t\t'is-expanded': isExpanded,\n\t\t\t\t'is-positioned': x !== null && y !== null,\n\t\t\t\t// Use the 'alternate' classname for 'toolbar' variant for back compat.\n\t\t\t\t[ `is-${\n\t\t\t\t\tcomputedVariant === 'toolbar'\n\t\t\t\t\t\t? 'alternate'\n\t\t\t\t\t\t: computedVariant\n\t\t\t\t}` ]: computedVariant,\n\t\t\t} ) }\n\t\t\t{ ...contentProps }\n\t\t\tref={ mergedFloatingRef }\n\t\t\t{ ...dialogProps }\n\t\t\ttabIndex={ -1 }\n\t\t\tstyle={\n\t\t\t\tisExpanded\n\t\t\t\t\t? undefined\n\t\t\t\t\t: {\n\t\t\t\t\t\t\tposition: strategy,\n\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t\t// `x` and `y` are framer-motion specific props and are shorthands\n\t\t\t\t\t\t\t// for `translateX` and `translateY`. Currently it is not possible\n\t\t\t\t\t\t\t// to use `translateX` and `translateY` because those values would\n\t\t\t\t\t\t\t// be overridden by the return value of the\n\t\t\t\t\t\t\t// `placementToMotionAnimationProps` function in `AnimatedWrapper`\n\t\t\t\t\t\t\tx: Math.round( x ?? 0 ) || undefined,\n\t\t\t\t\t\t\ty: Math.round( y ?? 0 ) || undefined,\n\t\t\t\t\t  }\n\t\t\t}\n\t\t>\n\t\t\t{ /* Prevents scroll on the document */ }\n\t\t\t{ isExpanded && <ScrollLock /> }\n\t\t\t{ isExpanded && (\n\t\t\t\t<div className=\"components-popover__header\">\n\t\t\t\t\t<span className=\"components-popover__header-title\">\n\t\t\t\t\t\t{ headerTitle }\n\t\t\t\t\t</span>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"components-popover__close\"\n\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-popover__content\">{ children }</div>\n\t\t\t{ hasArrow && (\n\t\t\t\t<div\n\t\t\t\t\tref={ arrowCallbackRef }\n\t\t\t\t\tclassName={ [\n\t\t\t\t\t\t'components-popover__arrow',\n\t\t\t\t\t\t`is-${ computedPlacement.split( '-' )[ 0 ] }`,\n\t\t\t\t\t].join( ' ' ) }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\tleft:\n\t\t\t\t\t\t\ttypeof arrowData?.x !== 'undefined' &&\n\t\t\t\t\t\t\tNumber.isFinite( arrowData.x )\n\t\t\t\t\t\t\t\t? `${\n\t\t\t\t\t\t\t\t\t\tarrowData.x +\n\t\t\t\t\t\t\t\t\t\t( frameOffsetRef.current?.x ?? 0 )\n\t\t\t\t\t\t\t\t  }px`\n\t\t\t\t\t\t\t\t: '',\n\t\t\t\t\t\ttop:\n\t\t\t\t\t\t\ttypeof arrowData?.y !== 'undefined' &&\n\t\t\t\t\t\t\tNumber.isFinite( arrowData.y )\n\t\t\t\t\t\t\t\t? `${\n\t\t\t\t\t\t\t\t\t\tarrowData.y +\n\t\t\t\t\t\t\t\t\t\t( frameOffsetRef.current?.y ?? 0 )\n\t\t\t\t\t\t\t\t  }px`\n\t\t\t\t\t\t\t\t: '',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<ArrowTriangle />\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</AnimatedWrapper>\n\t);\n\n\tif ( slot.ref ) {\n\t\tcontent = <Fill name={ slotName }>{ content }</Fill>;\n\t}\n\n\tif ( anchorRef || anchorRect || anchor ) {\n\t\treturn content;\n\t}\n\n\treturn <span ref={ anchorRefFallback }>{ content }</span>;\n};\n\n/**\n * `Popover` renders its content in a floating modal. If no explicit anchor is passed via props, it anchors to its parent element by default.\n *\n * ```jsx\n * import { Button, Popover } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyPopover = () => {\n * \tconst [ isVisible, setIsVisible ] = useState( false );\n * \tconst toggleVisible = () => {\n * \t\tsetIsVisible( ( state ) => ! state );\n * \t};\n *\n * \treturn (\n * \t\t<Button variant=\"secondary\" onClick={ toggleVisible }>\n * \t\t\tToggle Popover!\n * \t\t\t{ isVisible && <Popover>Popover is toggled!</Popover> }\n * \t\t</Button>\n * \t);\n * };\n * ```\n *\n */\nexport const Popover = forwardRef( UnforwardedPopover );\n\nfunction PopoverSlot(\n\t{ name = SLOT_NAME }: { name?: string },\n\tref: ForwardedRef< any >\n) {\n\treturn (\n\t\t<Slot\n\t\t\t// @ts-expect-error Need to type `SlotFill`\n\t\t\tbubblesVirtually\n\t\t\tname={ name }\n\t\t\tclassName=\"popover-slot\"\n\t\t\tref={ ref }\n\t\t/>\n\t);\n}\n\n// @ts-expect-error For Legacy Reasons\nPopover.Slot = forwardRef( PopoverSlot );\n// @ts-expect-error For Legacy Reasons\nPopover.__unstableSlotNameProvider = slotNameContext.Provider;\n\nexport default Popover;\n"]}
+{"version":3,"sources":["@wordpress/components/src/popover/index.tsx"],"names":["SLOT_NAME","ArrowTriangle","AnimatedWrapper","forwardedRef","style","receivedInlineStyles","placement","shouldAnimate","props","shouldReduceMotion","motionInlineStyles","otherMotionProps","computedAnimationProps","animate","slotNameContext","undefined","UnforwardedPopover","headerTitle","onClose","children","className","noArrow","position","placementProp","offset","offsetProp","focusOnMount","anchor","expandOnMobile","onFocusOutside","__unstableSlotName","flip","resize","shift","variant","__unstableForcePosition","anchorRef","anchorRect","getAnchorRect","isAlternate","contentProps","computedFlipProp","computedResizeProp","since","version","alternative","computedVariant","arrowRef","fallbackReferenceElement","setFallbackReferenceElement","referenceOwnerDocument","setReferenceOwnerDocument","anchorRefFallback","node","isMobileViewport","isExpanded","hasArrow","normalizedPlacementFromProps","frameOffsetRef","middleware","name","fn","x","y","current","data","amount","apply","sizeProps","firstElementChild","refs","floating","HTMLElement","Object","assign","maxHeight","availableHeight","overflow","crossAxis","limiter","padding","element","filter","m","slotName","slot","onDialogClose","type","event","dialogRef","dialogProps","__unstableOnClose","reference","referenceCallbackRef","strategy","update","computedPlacement","middlewareData","arrow","arrowData","whileElementsMounted","referenceParam","floatingParam","updateParam","animationFrame","arrowCallbackRef","anchorRefTop","top","anchorRefBottom","bottom","anchorRefStartContainer","startContainer","anchorRefCurrent","resultingReferenceOwnerDoc","fallbackDocument","document","scale","resultingReferenceElement","ownerDocument","defaultView","frameElement","scrollContainer","updateFrameOffset","addEventListener","removeEventListener","mergedFloatingRef","content","left","Math","round","close","split","join","Number","isFinite","ref","Popover","PopoverSlot","Slot","__unstableSlotNameProvider","Provider"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef, SyntheticEvent, RefCallback } from 'react';\nimport classnames from 'classnames';\nimport {\n\tuseFloating,\n\tflip as flipMiddleware,\n\tshift as shiftMiddleware,\n\tautoUpdate,\n\tarrow,\n\toffset as offsetMiddleware,\n\tsize,\n\tMiddleware,\n\tMiddlewareArguments,\n} from '@floating-ui/react-dom';\n// eslint-disable-next-line no-restricted-imports\nimport {\n\tmotion,\n\tuseReducedMotion,\n\tHTMLMotionProps,\n\tMotionProps,\n} from 'framer-motion';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseRef,\n\tuseLayoutEffect,\n\tforwardRef,\n\tcreateContext,\n\tuseContext,\n\tuseMemo,\n\tuseState,\n\tuseCallback,\n} from '@wordpress/element';\nimport {\n\tuseViewportMatch,\n\tuseMergeRefs,\n\t__experimentalUseDialog as useDialog,\n} from '@wordpress/compose';\nimport { close } from '@wordpress/icons';\nimport deprecated from '@wordpress/deprecated';\nimport { Path, SVG } from '@wordpress/primitives';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport ScrollLock from '../scroll-lock';\nimport { Slot, Fill, useSlot } from '../slot-fill';\nimport {\n\tgetFrameOffset,\n\tgetFrameScale,\n\tpositionToPlacement,\n\tplacementToMotionAnimationProps,\n\tgetReferenceOwnerDocument,\n\tgetReferenceElement,\n} from './utils';\nimport type { WordPressComponentProps } from '../ui/context';\nimport type {\n\tPopoverProps,\n\tAnimatedWrapperProps,\n\tPopoverAnchorRefReference,\n\tPopoverAnchorRefTopBottom,\n} from './types';\nimport { limitShift as customLimitShift } from './limit-shift';\nimport { overlayMiddlewares } from './overlay-middlewares';\n\n/**\n * Name of slot in which popover should fill.\n *\n * @type {string}\n */\nconst SLOT_NAME = 'Popover';\n\n// An SVG displaying a triangle facing down, filled with a solid\n// color and bordered in such a way to create an arrow-like effect.\n// Keeping the SVG's viewbox squared simplify the arrow positioning\n// calculations.\nconst ArrowTriangle = () => (\n\t<SVG\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox={ `0 0 100 100` }\n\t\tclassName=\"components-popover__triangle\"\n\t\trole=\"presentation\"\n\t>\n\t\t<Path\n\t\t\tclassName=\"components-popover__triangle-bg\"\n\t\t\td=\"M 0 0 L 50 50 L 100 0\"\n\t\t/>\n\t\t<Path\n\t\t\tclassName=\"components-popover__triangle-border\"\n\t\t\td=\"M 0 0 L 50 50 L 100 0\"\n\t\t\tvectorEffect=\"non-scaling-stroke\"\n\t\t/>\n\t</SVG>\n);\n\nconst AnimatedWrapper = forwardRef(\n\t(\n\t\t{\n\t\t\tstyle: receivedInlineStyles,\n\t\t\tplacement,\n\t\t\tshouldAnimate = false,\n\t\t\t...props\n\t\t}: HTMLMotionProps< 'div' > & AnimatedWrapperProps,\n\t\tforwardedRef: ForwardedRef< any >\n\t) => {\n\t\tconst shouldReduceMotion = useReducedMotion();\n\n\t\tconst { style: motionInlineStyles, ...otherMotionProps } = useMemo(\n\t\t\t() => placementToMotionAnimationProps( placement ),\n\t\t\t[ placement ]\n\t\t);\n\n\t\tconst computedAnimationProps: HTMLMotionProps< 'div' > =\n\t\t\tshouldAnimate && ! shouldReduceMotion\n\t\t\t\t? {\n\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t...motionInlineStyles,\n\t\t\t\t\t\t\t...receivedInlineStyles,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t...otherMotionProps,\n\t\t\t\t  }\n\t\t\t\t: {\n\t\t\t\t\t\tanimate: false,\n\t\t\t\t\t\tstyle: receivedInlineStyles,\n\t\t\t\t  };\n\n\t\treturn (\n\t\t\t<motion.div\n\t\t\t\t{ ...computedAnimationProps }\n\t\t\t\t{ ...props }\n\t\t\t\tref={ forwardedRef }\n\t\t\t/>\n\t\t);\n\t}\n);\n\nconst slotNameContext = createContext< string | undefined >( undefined );\n\nconst UnforwardedPopover = (\n\tprops: Omit<\n\t\tWordPressComponentProps< PopoverProps, 'div', false >,\n\t\t// To avoid overlaps between the standard HTML attributes and the props\n\t\t// expected by `framer-motion`, omit all framer motion props from popover\n\t\t// props (except for `animate` and `children`, which are re-defined in `PopoverProps`).\n\t\tkeyof Omit< MotionProps, 'animate' | 'children' >\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\tanimate = true,\n\t\theaderTitle,\n\t\tonClose,\n\t\tchildren,\n\t\tclassName,\n\t\tnoArrow = true,\n\t\tposition,\n\t\tplacement: placementProp = 'bottom-start',\n\t\toffset: offsetProp = 0,\n\t\tfocusOnMount = 'firstElement',\n\t\tanchor,\n\t\texpandOnMobile,\n\t\tonFocusOutside,\n\t\t__unstableSlotName = SLOT_NAME,\n\t\tflip = true,\n\t\tresize = true,\n\t\tshift = false,\n\t\tvariant,\n\n\t\t// Deprecated props\n\t\t__unstableForcePosition,\n\t\tanchorRef,\n\t\tanchorRect,\n\t\tgetAnchorRect,\n\t\tisAlternate,\n\n\t\t// Rest\n\t\t...contentProps\n\t} = props;\n\n\tlet computedFlipProp = flip;\n\tlet computedResizeProp = resize;\n\tif ( __unstableForcePosition !== undefined ) {\n\t\tdeprecated( '`__unstableForcePosition` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t\talternative: '`flip={ false }` and  `resize={ false }`',\n\t\t} );\n\n\t\t// Back-compat, set the `flip` and `resize` props\n\t\t// to `false` to replicate `__unstableForcePosition`.\n\t\tcomputedFlipProp = ! __unstableForcePosition;\n\t\tcomputedResizeProp = ! __unstableForcePosition;\n\t}\n\n\tif ( anchorRef !== undefined ) {\n\t\tdeprecated( '`anchorRef` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\talternative: '`anchor` prop',\n\t\t} );\n\t}\n\n\tif ( anchorRect !== undefined ) {\n\t\tdeprecated( '`anchorRect` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\talternative: '`anchor` prop',\n\t\t} );\n\t}\n\n\tif ( getAnchorRect !== undefined ) {\n\t\tdeprecated( '`getAnchorRect` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\talternative: '`anchor` prop',\n\t\t} );\n\t}\n\n\tconst computedVariant = isAlternate ? 'toolbar' : variant;\n\tif ( isAlternate !== undefined ) {\n\t\tdeprecated( '`isAlternate` prop in wp.components.Popover', {\n\t\t\tsince: '6.2',\n\t\t\talternative: \"`variant` prop with the `'toolbar'` value\",\n\t\t} );\n\t}\n\n\tconst arrowRef = useRef< HTMLElement | null >( null );\n\n\tconst [ fallbackReferenceElement, setFallbackReferenceElement ] =\n\t\tuseState< HTMLSpanElement | null >( null );\n\tconst [ referenceOwnerDocument, setReferenceOwnerDocument ] = useState<\n\t\tDocument | undefined\n\t>();\n\n\tconst anchorRefFallback: RefCallback< HTMLSpanElement > = useCallback(\n\t\t( node ) => {\n\t\t\tsetFallbackReferenceElement( node );\n\t\t},\n\t\t[]\n\t);\n\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst isExpanded = expandOnMobile && isMobileViewport;\n\tconst hasArrow = ! isExpanded && ! noArrow;\n\tconst normalizedPlacementFromProps = position\n\t\t? positionToPlacement( position )\n\t\t: placementProp;\n\n\t/**\n\t * Offsets the position of the popover when the anchor is inside an iframe.\n\t *\n\t * Store the offset in a ref, due to constraints with floating-ui:\n\t * https://floating-ui.com/docs/react-dom#variables-inside-middleware-functions.\n\t */\n\tconst frameOffsetRef = useRef( getFrameOffset( referenceOwnerDocument ) );\n\n\tconst middleware = [\n\t\t...( placementProp === 'overlay' ? overlayMiddlewares() : [] ),\n\t\t// Custom middleware which adjusts the popover's position by taking into\n\t\t// account the offset of the anchor's iframe (if any) compared to the page.\n\t\t{\n\t\t\tname: 'frameOffset',\n\t\t\tfn( { x, y }: MiddlewareArguments ) {\n\t\t\t\tif ( ! frameOffsetRef.current ) {\n\t\t\t\t\treturn {\n\t\t\t\t\t\tx,\n\t\t\t\t\t\ty,\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\treturn {\n\t\t\t\t\tx: x + frameOffsetRef.current.x,\n\t\t\t\t\ty: y + frameOffsetRef.current.y,\n\t\t\t\t\tdata: {\n\t\t\t\t\t\t// This will be used in the customLimitShift() function.\n\t\t\t\t\t\tamount: frameOffsetRef.current,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t},\n\t\t},\n\t\toffsetMiddleware( offsetProp ),\n\t\tcomputedFlipProp ? flipMiddleware() : undefined,\n\t\tcomputedResizeProp\n\t\t\t? size( {\n\t\t\t\t\tapply( sizeProps ) {\n\t\t\t\t\t\tconst { firstElementChild } =\n\t\t\t\t\t\t\trefs.floating.current ?? {};\n\n\t\t\t\t\t\t// Only HTMLElement instances have the `style` property.\n\t\t\t\t\t\tif ( ! ( firstElementChild instanceof HTMLElement ) )\n\t\t\t\t\t\t\treturn;\n\n\t\t\t\t\t\t// Reduce the height of the popover to the available space.\n\t\t\t\t\t\tObject.assign( firstElementChild.style, {\n\t\t\t\t\t\t\tmaxHeight: `${ sizeProps.availableHeight }px`,\n\t\t\t\t\t\t\toverflow: 'auto',\n\t\t\t\t\t\t} );\n\t\t\t\t\t},\n\t\t\t  } )\n\t\t\t: undefined,\n\t\tshift\n\t\t\t? shiftMiddleware( {\n\t\t\t\t\tcrossAxis: true,\n\t\t\t\t\tlimiter: customLimitShift(),\n\t\t\t\t\tpadding: 1, // Necessary to avoid flickering at the edge of the viewport.\n\t\t\t  } )\n\t\t\t: undefined,\n\t\tarrow( { element: arrowRef } ),\n\t].filter(\n\t\t( m: Middleware | undefined ): m is Middleware => m !== undefined\n\t);\n\tconst slotName = useContext( slotNameContext ) || __unstableSlotName;\n\tconst slot = useSlot( slotName );\n\n\tlet onDialogClose;\n\n\tif ( onClose || onFocusOutside ) {\n\t\tonDialogClose = ( type: string | undefined, event: SyntheticEvent ) => {\n\t\t\t// Ideally the popover should have just a single onClose prop and\n\t\t\t// not three props that potentially do the same thing.\n\t\t\tif ( type === 'focus-outside' && onFocusOutside ) {\n\t\t\t\tonFocusOutside( event );\n\t\t\t} else if ( onClose ) {\n\t\t\t\tonClose();\n\t\t\t}\n\t\t};\n\t}\n\n\tconst [ dialogRef, dialogProps ] = useDialog( {\n\t\tfocusOnMount,\n\t\t__unstableOnClose: onDialogClose,\n\t\t// @ts-expect-error The __unstableOnClose property needs to be deprecated first (see https://github.com/WordPress/gutenberg/pull/27675)\n\t\tonClose: onDialogClose,\n\t} );\n\n\tconst {\n\t\t// Positioning coordinates\n\t\tx,\n\t\ty,\n\t\t// Callback refs (not regular refs). This allows the position to be updated.\n\t\t// when either elements change.\n\t\treference: referenceCallbackRef,\n\t\tfloating,\n\t\t// Object with \"regular\" refs to both \"reference\" and \"floating\"\n\t\trefs,\n\t\t// Type of CSS position property to use (absolute or fixed)\n\t\tstrategy,\n\t\tupdate,\n\t\tplacement: computedPlacement,\n\t\tmiddlewareData: { arrow: arrowData },\n\t} = useFloating( {\n\t\tplacement:\n\t\t\tnormalizedPlacementFromProps === 'overlay'\n\t\t\t\t? undefined\n\t\t\t\t: normalizedPlacementFromProps,\n\t\tmiddleware,\n\t\twhileElementsMounted: ( referenceParam, floatingParam, updateParam ) =>\n\t\t\tautoUpdate( referenceParam, floatingParam, updateParam, {\n\t\t\t\tanimationFrame: true,\n\t\t\t} ),\n\t} );\n\n\tconst arrowCallbackRef = useCallback(\n\t\t( node: HTMLElement | null ) => {\n\t\t\tarrowRef.current = node;\n\t\t\tupdate();\n\t\t},\n\t\t[ update ]\n\t);\n\n\t// When any of the possible anchor \"sources\" change,\n\t// recompute the reference element (real or virtual) and its owner document.\n\n\tconst anchorRefTop = ( anchorRef as PopoverAnchorRefTopBottom | undefined )\n\t\t?.top;\n\tconst anchorRefBottom = (\n\t\tanchorRef as PopoverAnchorRefTopBottom | undefined\n\t )?.bottom;\n\tconst anchorRefStartContainer = ( anchorRef as Range | undefined )\n\t\t?.startContainer;\n\tconst anchorRefCurrent = ( anchorRef as PopoverAnchorRefReference )\n\t\t?.current;\n\n\tuseLayoutEffect( () => {\n\t\tconst resultingReferenceOwnerDoc = getReferenceOwnerDocument( {\n\t\t\tanchor,\n\t\t\tanchorRef,\n\t\t\tanchorRect,\n\t\t\tgetAnchorRect,\n\t\t\tfallbackReferenceElement,\n\t\t\tfallbackDocument: document,\n\t\t} );\n\t\tconst scale = getFrameScale( resultingReferenceOwnerDoc );\n\t\tconst resultingReferenceElement = getReferenceElement( {\n\t\t\tanchor,\n\t\t\tanchorRef,\n\t\t\tanchorRect,\n\t\t\tgetAnchorRect,\n\t\t\tfallbackReferenceElement,\n\t\t\tscale,\n\t\t} );\n\n\t\treferenceCallbackRef( resultingReferenceElement );\n\n\t\tsetReferenceOwnerDocument( resultingReferenceOwnerDoc );\n\t}, [\n\t\tanchor,\n\t\tanchorRef,\n\t\tanchorRefTop,\n\t\tanchorRefBottom,\n\t\tanchorRefStartContainer,\n\t\tanchorRefCurrent,\n\t\tanchorRect,\n\t\tgetAnchorRect,\n\t\tfallbackReferenceElement,\n\t\treferenceCallbackRef,\n\t] );\n\n\t// If the reference element is in a different ownerDocument (e.g. iFrame),\n\t// we need to manually update the floating's position as the reference's owner\n\t// document scrolls. Also update the frame offset if the view resizes.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\t// Reference and root documents are the same.\n\t\t\treferenceOwnerDocument === document ||\n\t\t\t// Reference and floating are in the same document.\n\t\t\treferenceOwnerDocument === refs.floating.current?.ownerDocument ||\n\t\t\t// The reference's document has no view (i.e. window)\n\t\t\t// or frame element (ie. it's not an iframe).\n\t\t\t! referenceOwnerDocument?.defaultView?.frameElement\n\t\t) {\n\t\t\tframeOffsetRef.current = undefined;\n\t\t\treturn;\n\t\t}\n\n\t\tconst { defaultView } = referenceOwnerDocument;\n\t\tconst { frameElement } = defaultView;\n\n\t\tconst scrollContainer = frameElement\n\t\t\t? getScrollContainer( frameElement )\n\t\t\t: null;\n\n\t\tconst updateFrameOffset = () => {\n\t\t\tframeOffsetRef.current = getFrameOffset( referenceOwnerDocument );\n\t\t\tupdate();\n\t\t};\n\t\tdefaultView.addEventListener( 'resize', updateFrameOffset );\n\t\tscrollContainer?.addEventListener( 'scroll', updateFrameOffset );\n\n\t\tupdateFrameOffset();\n\n\t\treturn () => {\n\t\t\tdefaultView.removeEventListener( 'resize', updateFrameOffset );\n\t\t\tscrollContainer?.removeEventListener( 'scroll', updateFrameOffset );\n\t\t};\n\t}, [ referenceOwnerDocument, update, refs.floating ] );\n\n\tconst mergedFloatingRef = useMergeRefs( [\n\t\tfloating,\n\t\tdialogRef,\n\t\tforwardedRef,\n\t] );\n\n\t// Disable reason: We care to capture the _bubbled_ events from inputs\n\t// within popover as inferring close intent.\n\n\tlet content = (\n\t\t// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<AnimatedWrapper\n\t\t\tshouldAnimate={ animate && ! isExpanded }\n\t\t\tplacement={ computedPlacement }\n\t\t\tclassName={ classnames( 'components-popover', className, {\n\t\t\t\t'is-expanded': isExpanded,\n\t\t\t\t'is-positioned': x !== null && y !== null,\n\t\t\t\t// Use the 'alternate' classname for 'toolbar' variant for back compat.\n\t\t\t\t[ `is-${\n\t\t\t\t\tcomputedVariant === 'toolbar'\n\t\t\t\t\t\t? 'alternate'\n\t\t\t\t\t\t: computedVariant\n\t\t\t\t}` ]: computedVariant,\n\t\t\t} ) }\n\t\t\t{ ...contentProps }\n\t\t\tref={ mergedFloatingRef }\n\t\t\t{ ...dialogProps }\n\t\t\ttabIndex={ -1 }\n\t\t\tstyle={\n\t\t\t\tisExpanded\n\t\t\t\t\t? undefined\n\t\t\t\t\t: {\n\t\t\t\t\t\t\tposition: strategy,\n\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t\t// `x` and `y` are framer-motion specific props and are shorthands\n\t\t\t\t\t\t\t// for `translateX` and `translateY`. Currently it is not possible\n\t\t\t\t\t\t\t// to use `translateX` and `translateY` because those values would\n\t\t\t\t\t\t\t// be overridden by the return value of the\n\t\t\t\t\t\t\t// `placementToMotionAnimationProps` function in `AnimatedWrapper`\n\t\t\t\t\t\t\tx: Math.round( x ?? 0 ) || undefined,\n\t\t\t\t\t\t\ty: Math.round( y ?? 0 ) || undefined,\n\t\t\t\t\t  }\n\t\t\t}\n\t\t>\n\t\t\t{ /* Prevents scroll on the document */ }\n\t\t\t{ isExpanded && <ScrollLock /> }\n\t\t\t{ isExpanded && (\n\t\t\t\t<div className=\"components-popover__header\">\n\t\t\t\t\t<span className=\"components-popover__header-title\">\n\t\t\t\t\t\t{ headerTitle }\n\t\t\t\t\t</span>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"components-popover__close\"\n\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-popover__content\">{ children }</div>\n\t\t\t{ hasArrow && (\n\t\t\t\t<div\n\t\t\t\t\tref={ arrowCallbackRef }\n\t\t\t\t\tclassName={ [\n\t\t\t\t\t\t'components-popover__arrow',\n\t\t\t\t\t\t`is-${ computedPlacement.split( '-' )[ 0 ] }`,\n\t\t\t\t\t].join( ' ' ) }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\tleft:\n\t\t\t\t\t\t\ttypeof arrowData?.x !== 'undefined' &&\n\t\t\t\t\t\t\tNumber.isFinite( arrowData.x )\n\t\t\t\t\t\t\t\t? `${\n\t\t\t\t\t\t\t\t\t\tarrowData.x +\n\t\t\t\t\t\t\t\t\t\t( frameOffsetRef.current?.x ?? 0 )\n\t\t\t\t\t\t\t\t  }px`\n\t\t\t\t\t\t\t\t: '',\n\t\t\t\t\t\ttop:\n\t\t\t\t\t\t\ttypeof arrowData?.y !== 'undefined' &&\n\t\t\t\t\t\t\tNumber.isFinite( arrowData.y )\n\t\t\t\t\t\t\t\t? `${\n\t\t\t\t\t\t\t\t\t\tarrowData.y +\n\t\t\t\t\t\t\t\t\t\t( frameOffsetRef.current?.y ?? 0 )\n\t\t\t\t\t\t\t\t  }px`\n\t\t\t\t\t\t\t\t: '',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<ArrowTriangle />\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</AnimatedWrapper>\n\t);\n\n\tif ( slot.ref ) {\n\t\tcontent = <Fill name={ slotName }>{ content }</Fill>;\n\t}\n\n\tif ( anchorRef || anchorRect || anchor ) {\n\t\treturn content;\n\t}\n\n\treturn <span ref={ anchorRefFallback }>{ content }</span>;\n};\n\n/**\n * `Popover` renders its content in a floating modal. If no explicit anchor is passed via props, it anchors to its parent element by default.\n *\n * ```jsx\n * import { Button, Popover } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyPopover = () => {\n * \tconst [ isVisible, setIsVisible ] = useState( false );\n * \tconst toggleVisible = () => {\n * \t\tsetIsVisible( ( state ) => ! state );\n * \t};\n *\n * \treturn (\n * \t\t<Button variant=\"secondary\" onClick={ toggleVisible }>\n * \t\t\tToggle Popover!\n * \t\t\t{ isVisible && <Popover>Popover is toggled!</Popover> }\n * \t\t</Button>\n * \t);\n * };\n * ```\n *\n */\nexport const Popover = forwardRef( UnforwardedPopover );\n\nfunction PopoverSlot(\n\t{ name = SLOT_NAME }: { name?: string },\n\tref: ForwardedRef< any >\n) {\n\treturn (\n\t\t<Slot\n\t\t\t// @ts-expect-error Need to type `SlotFill`\n\t\t\tbubblesVirtually\n\t\t\tname={ name }\n\t\t\tclassName=\"popover-slot\"\n\t\t\tref={ ref }\n\t\t/>\n\t);\n}\n\n// @ts-expect-error For Legacy Reasons\nPopover.Slot = forwardRef( PopoverSlot );\n// @ts-expect-error For Legacy Reasons\nPopover.__unstableSlotNameProvider = slotNameContext.Provider;\n\nexport default Popover;\n"]}

package/build/private-apis.js

@@ -13,6 +13,8 @@ var _customSelectControl = _interopRequireDefault(require("./custom-select-contr
 
 var _utils = require("./popover/utils");
 
+var _slotFill = require("./slot-fill");
+
 /**
  * WordPress dependencies
  */
@@ -30,6 +32,7 @@ const privateApis = {};
 exports.privateApis = privateApis;
 lock(privateApis, {
   CustomSelectControl: _customSelectControl.default,
-  __experimentalPopoverLegacyPositionToPlacement: _utils.positionToPlacement
+  __experimentalPopoverLegacyPositionToPlacement: _utils.positionToPlacement,
+  createPrivateSlotFill: _slotFill.createPrivateSlotFill
 });
 //# sourceMappingURL=private-apis.js.map

package/build/private-apis.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/private-apis.ts"],"names":["lock","unlock","privateApis","CustomSelectControl","__experimentalPopoverLegacyPositionToPlacement"],"mappings":";;;;;;;;;AAGA;;AAKA;;AACA;;AATA;AACA;AACA;;AAGA;AACA;AACA;AAIO,MAAM;AAAEA,EAAAA,IAAF;AAAQC,EAAAA;AAAR,IACZ,mEACC,8GADD,EAEC,uBAFD,CADM;;;AAMA,MAAMC,WAAW,GAAG,EAApB;;AACPF,IAAI,CAAEE,WAAF,EAAe;AAClBC,EAAAA,mBAAmB,EAAnBA,4BADkB;AAElBC,EAAAA,8CAA8C,EAA9CA;AAFkB,CAAf,CAAJ","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __dangerousOptInToUnstableAPIsOnlyForCoreModules } from '@wordpress/private-apis';\n\n/**\n * Internal dependencies\n */\nimport { default as CustomSelectControl } from './custom-select-control';\nimport { positionToPlacement as __experimentalPopoverLegacyPositionToPlacement } from './popover/utils';\n\nexport const { lock, unlock } =\n\t__dangerousOptInToUnstableAPIsOnlyForCoreModules(\n\t\t'I know using unstable features means my plugin or theme will inevitably break on the next WordPress release.',\n\t\t'@wordpress/components'\n\t);\n\nexport const privateApis = {};\nlock( privateApis, {\n\tCustomSelectControl,\n\t__experimentalPopoverLegacyPositionToPlacement,\n} );\n"]}
+{"version":3,"sources":["@wordpress/components/src/private-apis.ts"],"names":["lock","unlock","privateApis","CustomSelectControl","__experimentalPopoverLegacyPositionToPlacement","createPrivateSlotFill"],"mappings":";;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAKO,MAAM;AAAEA,EAAAA,IAAF;AAAQC,EAAAA;AAAR,IACZ,mEACC,8GADD,EAEC,uBAFD,CADM;;;AAMA,MAAMC,WAAW,GAAG,EAApB;;AACPF,IAAI,CAAEE,WAAF,EAAe;AAClBC,EAAAA,mBAAmB,EAAnBA,4BADkB;AAElBC,EAAAA,8CAA8C,EAA9CA,0BAFkB;AAGlBC,EAAAA,qBAAqB,EAArBA;AAHkB,CAAf,CAAJ","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __dangerousOptInToUnstableAPIsOnlyForCoreModules } from '@wordpress/private-apis';\n\n/**\n * Internal dependencies\n */\nimport { default as CustomSelectControl } from './custom-select-control';\nimport { positionToPlacement as __experimentalPopoverLegacyPositionToPlacement } from './popover/utils';\nimport { createPrivateSlotFill } from './slot-fill';\n\nexport const { lock, unlock } =\n\t__dangerousOptInToUnstableAPIsOnlyForCoreModules(\n\t\t'I know using unstable features means my plugin or theme will inevitably break on the next WordPress release.',\n\t\t'@wordpress/components'\n\t);\n\nexport const privateApis = {};\nlock( privateApis, {\n\tCustomSelectControl,\n\t__experimentalPopoverLegacyPositionToPlacement,\n\tcreatePrivateSlotFill,\n} );\n"]}

package/build/sandbox/index.native.js

@@ -185,7 +185,10 @@ const Sandbox = (0, _element.forwardRef)(function Sandbox(_ref, ref) {
     title = '',
     type,
     url,
-    onWindowEvents = {}
+    onWindowEvents = {},
+    viewportProps = '',
+    onLoadEnd = () => {},
+    testID
   } = _ref;
   const colorScheme = (0, _compose.usePreferredColorScheme)();
   const [height, setHeight] = (0, _element.useState)(0);
@@ -209,11 +212,13 @@ const Sandbox = (0, _element.forwardRef)(function Sandbox(_ref, ref) {
     // we can use this in the future to inject custom styles or scripts.
     // Scripts go into the body rather than the head, to support embedded content such as Instagram
     // that expect the scripts to be part of the body.
+    // Avoid comma issues with props.viewportProps.
+    const addViewportProps = viewportProps.trim().replace(/(^[^,])/, ', $1');
     const htmlDoc = (0, _element.createElement)("html", {
       lang: lang
     }, (0, _element.createElement)("head", null, (0, _element.createElement)("title", null, title), (0, _element.createElement)("meta", {
       name: "viewport",
-      content: "width=device-width, initial-scale=1"
+      content: `width=device-width, initial-scale=1${addViewportProps}`
     }), (0, _element.createElement)("style", {
       dangerouslySetInnerHTML: {
         __html: style
@@ -347,7 +352,9 @@ const Sandbox = (0, _element.forwardRef)(function Sandbox(_ref, ref) {
     setBuiltInZoomControls: false,
     showsHorizontalScrollIndicator: false,
     showsVerticalScrollIndicator: false,
-    mediaPlaybackRequiresUserAction: false
+    mediaPlaybackRequiresUserAction: false,
+    onLoadEnd: onLoadEnd,
+    testID: testID
   });
 });
 

package/build/sandbox/index.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/sandbox/index.native.js"],"names":["observeAndResizeJS","style","EMPTY_ARRAY","Sandbox","ref","containerStyle","customJS","html","lang","providerUrl","scripts","styles","title","type","url","onWindowEvents","colorScheme","height","setHeight","contentHtml","setContentHtml","getHtmlDoc","windowSize","Dimensions","get","isLandscape","setIsLandscape","width","wasLandscape","key","Platform","select","android","ios","htmlDoc","__html","map","rules","i","src","getInjectedJavaScript","injectedJS","Object","keys","forEach","eventType","updateContentHtml","forceRerender","newContentHtml","setImmediate","getSizeStyle","contentHeight","Math","ceil","aspectRatio","onChangeDimensions","dimensions","window","onMessage","message","data","nativeEvent","JSON","parse","e","action","console","warn","dimensionsChangeSubscription","addEventListener","remove","current","sandboxStyles","baseUrl","isAndroid","workaroundStyles","webView","StyleSheet","create","opacity"],"mappings":";;;;;;;;;AASA;;AANA;;AACA;;AAeA;;AAKA;;AAxBA;AACA;AACA;;AAIA;AACA;AACA;;AAaA;AACA;AACA;AAGA,MAAMA,kBAAkB,GAAI;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CA7EA;AA+EA,MAAMC,KAAK,GAAI;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAjEA;AAmEA,MAAMC,WAAW,GAAG,EAApB;AAEA,MAAMC,OAAO,GAAG,yBAAY,SAASA,OAAT,OAc3BC,GAd2B,EAe1B;AAAA,MAdD;AACCC,IAAAA,cADD;AAECC,IAAAA,QAFD;AAGCC,IAAAA,IAAI,GAAG,EAHR;AAICC,IAAAA,IAAI,GAAG,IAJR;AAKCC,IAAAA,WAAW,GAAG,EALf;AAMCC,IAAAA,OAAO,GAAGR,WANX;AAOCS,IAAAA,MAAM,GAAGT,WAPV;AAQCU,IAAAA,KAAK,GAAG,EART;AASCC,IAAAA,IATD;AAUCC,IAAAA,GAVD;AAWCC,IAAAA,cAAc,G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","sourcesContent":["/**\n * External dependencies\n */\nimport { Dimensions, StyleSheet } from 'react-native';\nimport { WebView } from 'react-native-webview';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tPlatform,\n\trenderToString,\n\tmemo,\n\tuseRef,\n\tuseState,\n\tuseEffect,\n\tforwardRef,\n\tuseCallback,\n} from '@wordpress/element';\nimport { usePreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport sandboxStyles from './style.scss';\n\nconst observeAndResizeJS = `\n\t(function() {\n\t\tconst { MutationObserver } = window;\n\n\t\tif ( ! MutationObserver || ! document.body || ! window.parent ) {\n\t\t\treturn;\n\t\t}\n\n\t\tfunction sendResize() {\n\t\t\tconst clientBoundingRect = document.body.getBoundingClientRect();\n\n\t\t\t// The function postMessage is exposed by the react-native-webview library\n\t\t\t// to communicate between React Native and the WebView, in this case,\n\t\t\t// we use it for notifying resize changes.\n\t\t\twindow.ReactNativeWebView.postMessage(\n\t\t\t\tJSON.stringify( {\n\t\t\t\t\taction: 'resize',\n\t\t\t\t\twidth: clientBoundingRect.width,\n\t\t\t\t\theight: clientBoundingRect.height,\n\t\t\t\t} )\n\t\t\t);\n\t\t}\n\n\t\tconst observer = new MutationObserver( sendResize );\n\t\tobserver.observe( document.body, {\n\t\t\tattributes: true,\n\t\t\tattributeOldValue: false,\n\t\t\tcharacterData: true,\n\t\t\tcharacterDataOldValue: false,\n\t\t\tchildList: true,\n\t\t\tsubtree: true,\n\t\t} );\n\n\t\twindow.addEventListener( 'load', sendResize, true );\n\n\t\t// Hack: Remove viewport unit styles, as these are relative\n\t\t// the iframe root and interfere with our mechanism for\n\t\t// determining the unconstrained page bounds.\n\t\tfunction removeViewportStyles( ruleOrNode ) {\n\t\t\tif ( ruleOrNode.style ) {\n\t\t\t\t[ 'width', 'height', 'minHeight', 'maxHeight' ].forEach( function (\n\t\t\t\t\tstyle\n\t\t\t\t) {\n\t\t\t\t\tif (\n\t\t\t\t\t\t/^\\\\d+(vmin|vmax|vh|vw)$/.test( ruleOrNode.style[ style ] )\n\t\t\t\t\t) {\n\t\t\t\t\t\truleOrNode.style[ style ] = '';\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\t\t}\n\n\t\tArray.prototype.forEach.call(\n\t\t\tdocument.querySelectorAll( '[style]' ),\n\t\t\tremoveViewportStyles\n\t\t);\n\t\tArray.prototype.forEach.call(\n\t\t\tdocument.styleSheets,\n\t\t\tfunction ( stylesheet ) {\n\t\t\t\tArray.prototype.forEach.call(\n\t\t\t\t\tstylesheet.cssRules || stylesheet.rules,\n\t\t\t\t\tremoveViewportStyles\n\t\t\t\t);\n\t\t\t}\n\t\t);\n\n\t\tdocument.body.style.position = 'absolute';\n\t\tdocument.body.style.width = '100%';\n\t\tdocument.body.setAttribute( 'data-resizable-iframe-connected', '' );\n\n\t\tsendResize();\n\n\t\t// Resize events can change the width of elements with 100% width, but we don't\n\t\t// get an DOM mutations for that, so do the resize when the window is resized, too.\n\t\twindow.addEventListener( 'resize', sendResize, true );\n\t\twindow.addEventListener( 'orientationchange', sendResize, true );\n\t})();\n`;\n\nconst style = `\n\tbody {\n\t\tmargin: 0;\n\t}\n\thtml,\n\tbody,\n\tbody > div,\n\tbody > div iframe {\n\t\twidth: 100%;\n\t}\n\tbody > div > * {\n\t\tmargin-top: 0 !important; /* Has to have !important to override inline styles. */\n\t\tmargin-bottom: 0 !important;\n\t}\n\n\t.wp-block-embed__wrapper {\n\t\tposition: relative;\n\t}\n\n\tbody.wp-has-aspect-ratio > div iframe {\n\t\theight: 100%;\n\t\toverflow: hidden; /* If it has an aspect ratio, it shouldn't scroll. */\n\t}\n\n\t/**\n\t * Add responsiveness to embeds with aspect ratios.\n\t *\n\t * These styles have been copied from the web version (https://github.com/WordPress/gutenberg/blob/7901895ca20cf61e402925e31571d659dab64721/packages/block-library/src/embed/style.scss#L42-L89) and\n\t * adapted for the native version.\n\t */\n\t.wp-has-aspect-ratio.wp-block-embed__wrapper::before {\n\t\tcontent: \"\";\n\t\tdisplay: block;\n\t\tpadding-top: 50%; // Default to 2:1 aspect ratio.\n\t}\n\t.wp-has-aspect-ratio iframe {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\t.wp-embed-aspect-21-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 42.85%; // 9 / 21 * 100\n\t}\n\t.wp-embed-aspect-18-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 50%; // 9 / 18 * 100\n\t}\n\t.wp-embed-aspect-16-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 56.25%; // 9 / 16 * 100\n\t}\n\t.wp-embed-aspect-4-3.wp-block-embed__wrapper::before {\n\t\tpadding-top: 75%; // 3 / 4 * 100\n\t}\n\t.wp-embed-aspect-1-1.wp-block-embed__wrapper::before {\n\t\tpadding-top: 100%; // 1 / 1 * 100\n\t}\n\t.wp-embed-aspect-9-16.wp-block-embed__wrapper::before {\n\t\tpadding-top: 177.77%; // 16 / 9 * 100\n\t}\n\t.wp-embed-aspect-1-2.wp-block-embed__wrapper::before {\n\t\tpadding-top: 200%; // 2 / 1 * 100\n\t}\n`;\n\nconst EMPTY_ARRAY = [];\n\nconst Sandbox = forwardRef( function Sandbox(\n\t{\n\t\tcontainerStyle,\n\t\tcustomJS,\n\t\thtml = '',\n\t\tlang = 'en',\n\t\tproviderUrl = '',\n\t\tscripts = EMPTY_ARRAY,\n\t\tstyles = EMPTY_ARRAY,\n\t\ttitle = '',\n\t\ttype,\n\t\turl,\n\t\tonWindowEvents = {},\n\t},\n\tref\n) {\n\tconst colorScheme = usePreferredColorScheme();\n\tconst [ height, setHeight ] = useState( 0 );\n\tconst [ contentHtml, setContentHtml ] = useState( getHtmlDoc() );\n\n\tconst windowSize = Dimensions.get( 'window' );\n\tconst [ isLandscape, setIsLandscape ] = useState(\n\t\twindowSize.width >= windowSize.height\n\t);\n\tconst wasLandscape = useRef( isLandscape );\n\t// On Android, we need to recreate the WebView on any of the following actions, otherwise it disappears:\n\t// - Device rotation\n\t// - Light/dark mode changes\n\t// For this purpose, the key prop used in the WebView will be updated with the value of the actions.\n\tconst key = Platform.select( {\n\t\tandroid: `${ url }-${\n\t\t\tisLandscape ? 'landscape' : 'portrait'\n\t\t}-${ colorScheme }`,\n\t\tios: url,\n\t} );\n\n\tfunction getHtmlDoc() {\n\t\t// Put the html snippet into a html document, and update the state to refresh the WebView,\n\t\t// we can use this in the future to inject custom styles or scripts.\n\t\t// Scripts go into the body rather than the head, to support embedded content such as Instagram\n\t\t// that expect the scripts to be part of the body.\n\t\tconst htmlDoc = (\n\t\t\t<html lang={ lang }>\n\t\t\t\t<head>\n\t\t\t\t\t<title>{ title }</title>\n\t\t\t\t\t<meta\n\t\t\t\t\t\tname=\"viewport\"\n\t\t\t\t\t\tcontent=\"width=device-width, initial-scale=1\"\n\t\t\t\t\t></meta>\n\t\t\t\t\t<style dangerouslySetInnerHTML={ { __html: style } } />\n\t\t\t\t\t{ styles.map( ( rules, i ) => (\n\t\t\t\t\t\t<style\n\t\t\t\t\t\t\tkey={ i }\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={ { __html: rules } }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</head>\n\t\t\t\t<body\n\t\t\t\t\tdata-resizable-iframe-connected=\"data-resizable-iframe-connected\"\n\t\t\t\t\tclassName={ type }\n\t\t\t\t>\n\t\t\t\t\t<div dangerouslySetInnerHTML={ { __html: html } } />\n\t\t\t\t\t{ scripts.map( ( src ) => (\n\t\t\t\t\t\t<script key={ src } src={ src } />\n\t\t\t\t\t) ) }\n\t\t\t\t</body>\n\t\t\t</html>\n\t\t);\n\t\treturn '<!DOCTYPE html>' + renderToString( htmlDoc );\n\t}\n\n\tconst getInjectedJavaScript = useCallback( () => {\n\t\t// Allow parent to override the resize observers with prop.customJS (legacy support)\n\t\tlet injectedJS = customJS || observeAndResizeJS;\n\n\t\t// Add any event listeners that were passed in.\n\t\tObject.keys( onWindowEvents ).forEach( ( eventType ) => {\n\t\t\tinjectedJS += `\n\t\t\t\twindow.addEventListener( '${ eventType }', function( event ) {\n\t\t\t\t\twindow.ReactNativeWebView.postMessage( JSON.stringify( { type: '${ eventType }', ...event.data } ) );\n\t\t\t\t});`;\n\t\t} );\n\n\t\treturn injectedJS;\n\t}, [ customJS, onWindowEvents ] );\n\n\tfunction updateContentHtml( forceRerender = false ) {\n\t\tconst newContentHtml = getHtmlDoc();\n\n\t\tif ( forceRerender && contentHtml === newContentHtml ) {\n\t\t\t// The re-render is forced by updating the state with empty HTML,\n\t\t\t// waiting for the JS code to be executed with \"setImmediate\" and then\n\t\t\t// setting the content HTML again.\n\t\t\tsetContentHtml( '' );\n\t\t\tsetImmediate( () => setContentHtml( newContentHtml ) );\n\t\t} else {\n\t\t\tsetContentHtml( newContentHtml );\n\t\t}\n\t}\n\n\tfunction getSizeStyle() {\n\t\tconst contentHeight = Math.ceil( height );\n\n\t\treturn contentHeight ? { height: contentHeight } : { aspectRatio: 1 };\n\t}\n\n\tfunction onChangeDimensions( dimensions ) {\n\t\tsetIsLandscape( dimensions.window.width >= dimensions.window.height );\n\t}\n\n\tconst onMessage = useCallback(\n\t\t( message ) => {\n\t\t\tlet data = message?.nativeEvent?.data;\n\n\t\t\ttry {\n\t\t\t\tdata = JSON.parse( data );\n\t\t\t} catch ( e ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// check for resize event\n\t\t\tif ( 'resize' === data?.action ) {\n\t\t\t\tsetHeight( data.height );\n\t\t\t}\n\n\t\t\t// Forward the event to parent event listeners\n\t\t\tObject.keys( onWindowEvents ).forEach( ( eventType ) => {\n\t\t\t\tif ( data?.type === eventType ) {\n\t\t\t\t\ttry {\n\t\t\t\t\t\tonWindowEvents[ eventType ]( data );\n\t\t\t\t\t} catch ( e ) {\n\t\t\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t\t`Error handling event ${ eventType }`,\n\t\t\t\t\t\t\te\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\t\t[ onWindowEvents ]\n\t);\n\n\tuseEffect( () => {\n\t\tconst dimensionsChangeSubscription = Dimensions.addEventListener(\n\t\t\t'change',\n\t\t\tonChangeDimensions\n\t\t);\n\t\treturn () => {\n\t\t\tdimensionsChangeSubscription.remove();\n\t\t};\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tupdateContentHtml();\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ html, title, type, styles, scripts ] );\n\n\tuseEffect( () => {\n\t\t// When device orientation changes we have to recalculate the size,\n\t\t// for this purpose we reset the current size value.\n\t\tif ( wasLandscape.current !== isLandscape ) {\n\t\t\tsetHeight( 0 );\n\t\t}\n\t\twasLandscape.current = isLandscape;\n\t}, [ isLandscape ] );\n\n\treturn (\n\t\t<WebView\n\t\t\tcontainerStyle={ [\n\t\t\t\tsandboxStyles[ 'sandbox-webview__container' ],\n\t\t\t\tcontainerStyle,\n\t\t\t] }\n\t\t\tinjectedJavaScript={ getInjectedJavaScript() }\n\t\t\tkey={ key }\n\t\t\tref={ ref }\n\t\t\tsource={ { baseUrl: providerUrl, html: contentHtml } }\n\t\t\t// Wildcard value is required for static HTML\n\t\t\t// Reference: https://github.com/react-native-webview/react-native-webview/blob/master/docs/Reference.md#source\n\t\t\toriginWhitelist={ [ '*' ] }\n\t\t\tstyle={ [\n\t\t\t\tsandboxStyles[ 'sandbox-webview__content' ],\n\t\t\t\tgetSizeStyle(),\n\t\t\t\tPlatform.isAndroid && workaroundStyles.webView,\n\t\t\t] }\n\t\t\tonMessage={ onMessage }\n\t\t\tscrollEnabled={ false }\n\t\t\tsetBuiltInZoomControls={ false }\n\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\tshowsVerticalScrollIndicator={ false }\n\t\t\tmediaPlaybackRequiresUserAction={ false }\n\t\t/>\n\t);\n} );\n\nconst workaroundStyles = StyleSheet.create( {\n\twebView: {\n\t\t/**\n\t\t * The slight opacity below is a workaround for an Android crash caused from combining Android\n\t\t * 12's new scroll overflow behavior and webviews.\n\t\t * https://github.com/react-native-webview/react-native-webview/issues/1915#issuecomment-808869253\n\t\t */\n\t\topacity: 0.99,\n\t},\n} );\n\nexport default memo( Sandbox );\n"]}
+{"version":3,"sources":["@wordpress/components/src/sandbox/index.native.js"],"names":["observeAndResizeJS","style","EMPTY_ARRAY","Sandbox","ref","containerStyle","customJS","html","lang","providerUrl","scripts","styles","title","type","url","onWindowEvents","viewportProps","onLoadEnd","testID","colorScheme","height","setHeight","contentHtml","setContentHtml","getHtmlDoc","windowSize","Dimensions","get","isLandscape","setIsLandscape","width","wasLandscape","key","Platform","select","android","ios","addViewportProps","trim","replace","htmlDoc","__html","map","rules","i","src","getInjectedJavaScript","injectedJS","Object","keys","forEach","eventType","updateContentHtml","forceRerender","newContentHtml","setImmediate","getSizeStyle","contentHeight","Math","ceil","aspectRatio","onChangeDimensions","dimensions","window","onMessage","message","data","nativeEvent","JSON","parse","e","action","console","warn","dimensionsChangeSubscription","addEventListener","remove","current","sandboxStyles","baseUrl","isAndroid","workaroundStyles","webView","StyleSheet","create","opacity"],"mappings":";;;;;;;;;AASA;;AANA;;AACA;;AAeA;;AAKA;;AAxBA;AACA;AACA;;AAIA;AACA;AACA;;AAaA;AACA;AACA;AAGA,MAAMA,kBAAkB,GAAI;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CA7EA;AA+EA,MAAMC,KAAK,GAAI;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAjEA;AAmEA,MAAMC,WAAW,GAAG,EAApB;AAEA,MAAMC,OAAO,GAAG,yBAAY,SAASA,OAAT,OAiB3BC,GAjB2B,EAkB1B;AAAA,MAjBD;AACCC,IAAAA,cADD;AAECC,IAAAA,QAFD;AAGCC,IAAAA,IAAI,GAAG,EAHR;AAICC,IAAAA,IAAI,GAAG,IAJR;AAKCC,IAAAA,WAAW,GAAG,EALf;AAMCC,IAAAA,OAAO,GAAGR,WANX;AAOCS,IAAAA,MAAM,GAAGT,WAPV;AAQCU,IAAAA,KAAK,GAAG,EART;AASCC,IAAAA,IATD;AAUCC,IAAAA,GAVD;AAWCC,IAAAA,cA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","sourcesContent":["/**\n * External dependencies\n */\nimport { Dimensions, StyleSheet } from 'react-native';\nimport { WebView } from 'react-native-webview';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tPlatform,\n\trenderToString,\n\tmemo,\n\tuseRef,\n\tuseState,\n\tuseEffect,\n\tforwardRef,\n\tuseCallback,\n} from '@wordpress/element';\nimport { usePreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport sandboxStyles from './style.scss';\n\nconst observeAndResizeJS = `\n\t(function() {\n\t\tconst { MutationObserver } = window;\n\n\t\tif ( ! MutationObserver || ! document.body || ! window.parent ) {\n\t\t\treturn;\n\t\t}\n\n\t\tfunction sendResize() {\n\t\t\tconst clientBoundingRect = document.body.getBoundingClientRect();\n\n\t\t\t// The function postMessage is exposed by the react-native-webview library\n\t\t\t// to communicate between React Native and the WebView, in this case,\n\t\t\t// we use it for notifying resize changes.\n\t\t\twindow.ReactNativeWebView.postMessage(\n\t\t\t\tJSON.stringify( {\n\t\t\t\t\taction: 'resize',\n\t\t\t\t\twidth: clientBoundingRect.width,\n\t\t\t\t\theight: clientBoundingRect.height,\n\t\t\t\t} )\n\t\t\t);\n\t\t}\n\n\t\tconst observer = new MutationObserver( sendResize );\n\t\tobserver.observe( document.body, {\n\t\t\tattributes: true,\n\t\t\tattributeOldValue: false,\n\t\t\tcharacterData: true,\n\t\t\tcharacterDataOldValue: false,\n\t\t\tchildList: true,\n\t\t\tsubtree: true,\n\t\t} );\n\n\t\twindow.addEventListener( 'load', sendResize, true );\n\n\t\t// Hack: Remove viewport unit styles, as these are relative\n\t\t// the iframe root and interfere with our mechanism for\n\t\t// determining the unconstrained page bounds.\n\t\tfunction removeViewportStyles( ruleOrNode ) {\n\t\t\tif ( ruleOrNode.style ) {\n\t\t\t\t[ 'width', 'height', 'minHeight', 'maxHeight' ].forEach( function (\n\t\t\t\t\tstyle\n\t\t\t\t) {\n\t\t\t\t\tif (\n\t\t\t\t\t\t/^\\\\d+(vmin|vmax|vh|vw)$/.test( ruleOrNode.style[ style ] )\n\t\t\t\t\t) {\n\t\t\t\t\t\truleOrNode.style[ style ] = '';\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\t\t}\n\n\t\tArray.prototype.forEach.call(\n\t\t\tdocument.querySelectorAll( '[style]' ),\n\t\t\tremoveViewportStyles\n\t\t);\n\t\tArray.prototype.forEach.call(\n\t\t\tdocument.styleSheets,\n\t\t\tfunction ( stylesheet ) {\n\t\t\t\tArray.prototype.forEach.call(\n\t\t\t\t\tstylesheet.cssRules || stylesheet.rules,\n\t\t\t\t\tremoveViewportStyles\n\t\t\t\t);\n\t\t\t}\n\t\t);\n\n\t\tdocument.body.style.position = 'absolute';\n\t\tdocument.body.style.width = '100%';\n\t\tdocument.body.setAttribute( 'data-resizable-iframe-connected', '' );\n\n\t\tsendResize();\n\n\t\t// Resize events can change the width of elements with 100% width, but we don't\n\t\t// get an DOM mutations for that, so do the resize when the window is resized, too.\n\t\twindow.addEventListener( 'resize', sendResize, true );\n\t\twindow.addEventListener( 'orientationchange', sendResize, true );\n\t})();\n`;\n\nconst style = `\n\tbody {\n\t\tmargin: 0;\n\t}\n\thtml,\n\tbody,\n\tbody > div,\n\tbody > div iframe {\n\t\twidth: 100%;\n\t}\n\tbody > div > * {\n\t\tmargin-top: 0 !important; /* Has to have !important to override inline styles. */\n\t\tmargin-bottom: 0 !important;\n\t}\n\n\t.wp-block-embed__wrapper {\n\t\tposition: relative;\n\t}\n\n\tbody.wp-has-aspect-ratio > div iframe {\n\t\theight: 100%;\n\t\toverflow: hidden; /* If it has an aspect ratio, it shouldn't scroll. */\n\t}\n\n\t/**\n\t * Add responsiveness to embeds with aspect ratios.\n\t *\n\t * These styles have been copied from the web version (https://github.com/WordPress/gutenberg/blob/7901895ca20cf61e402925e31571d659dab64721/packages/block-library/src/embed/style.scss#L42-L89) and\n\t * adapted for the native version.\n\t */\n\t.wp-has-aspect-ratio.wp-block-embed__wrapper::before {\n\t\tcontent: \"\";\n\t\tdisplay: block;\n\t\tpadding-top: 50%; // Default to 2:1 aspect ratio.\n\t}\n\t.wp-has-aspect-ratio iframe {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\t.wp-embed-aspect-21-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 42.85%; // 9 / 21 * 100\n\t}\n\t.wp-embed-aspect-18-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 50%; // 9 / 18 * 100\n\t}\n\t.wp-embed-aspect-16-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 56.25%; // 9 / 16 * 100\n\t}\n\t.wp-embed-aspect-4-3.wp-block-embed__wrapper::before {\n\t\tpadding-top: 75%; // 3 / 4 * 100\n\t}\n\t.wp-embed-aspect-1-1.wp-block-embed__wrapper::before {\n\t\tpadding-top: 100%; // 1 / 1 * 100\n\t}\n\t.wp-embed-aspect-9-16.wp-block-embed__wrapper::before {\n\t\tpadding-top: 177.77%; // 16 / 9 * 100\n\t}\n\t.wp-embed-aspect-1-2.wp-block-embed__wrapper::before {\n\t\tpadding-top: 200%; // 2 / 1 * 100\n\t}\n`;\n\nconst EMPTY_ARRAY = [];\n\nconst Sandbox = forwardRef( function Sandbox(\n\t{\n\t\tcontainerStyle,\n\t\tcustomJS,\n\t\thtml = '',\n\t\tlang = 'en',\n\t\tproviderUrl = '',\n\t\tscripts = EMPTY_ARRAY,\n\t\tstyles = EMPTY_ARRAY,\n\t\ttitle = '',\n\t\ttype,\n\t\turl,\n\t\tonWindowEvents = {},\n\t\tviewportProps = '',\n\t\tonLoadEnd = () => {},\n\t\ttestID,\n\t},\n\tref\n) {\n\tconst colorScheme = usePreferredColorScheme();\n\tconst [ height, setHeight ] = useState( 0 );\n\tconst [ contentHtml, setContentHtml ] = useState( getHtmlDoc() );\n\n\tconst windowSize = Dimensions.get( 'window' );\n\tconst [ isLandscape, setIsLandscape ] = useState(\n\t\twindowSize.width >= windowSize.height\n\t);\n\tconst wasLandscape = useRef( isLandscape );\n\t// On Android, we need to recreate the WebView on any of the following actions, otherwise it disappears:\n\t// - Device rotation\n\t// - Light/dark mode changes\n\t// For this purpose, the key prop used in the WebView will be updated with the value of the actions.\n\tconst key = Platform.select( {\n\t\tandroid: `${ url }-${\n\t\t\tisLandscape ? 'landscape' : 'portrait'\n\t\t}-${ colorScheme }`,\n\t\tios: url,\n\t} );\n\n\tfunction getHtmlDoc() {\n\t\t// Put the html snippet into a html document, and update the state to refresh the WebView,\n\t\t// we can use this in the future to inject custom styles or scripts.\n\t\t// Scripts go into the body rather than the head, to support embedded content such as Instagram\n\t\t// that expect the scripts to be part of the body.\n\n\t\t// Avoid comma issues with props.viewportProps.\n\t\tconst addViewportProps = viewportProps\n\t\t\t.trim()\n\t\t\t.replace( /(^[^,])/, ', $1' );\n\n\t\tconst htmlDoc = (\n\t\t\t<html lang={ lang }>\n\t\t\t\t<head>\n\t\t\t\t\t<title>{ title }</title>\n\t\t\t\t\t<meta\n\t\t\t\t\t\tname=\"viewport\"\n\t\t\t\t\t\tcontent={ `width=device-width, initial-scale=1${ addViewportProps }` }\n\t\t\t\t\t></meta>\n\t\t\t\t\t<style dangerouslySetInnerHTML={ { __html: style } } />\n\t\t\t\t\t{ styles.map( ( rules, i ) => (\n\t\t\t\t\t\t<style\n\t\t\t\t\t\t\tkey={ i }\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={ { __html: rules } }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</head>\n\t\t\t\t<body\n\t\t\t\t\tdata-resizable-iframe-connected=\"data-resizable-iframe-connected\"\n\t\t\t\t\tclassName={ type }\n\t\t\t\t>\n\t\t\t\t\t<div dangerouslySetInnerHTML={ { __html: html } } />\n\t\t\t\t\t{ scripts.map( ( src ) => (\n\t\t\t\t\t\t<script key={ src } src={ src } />\n\t\t\t\t\t) ) }\n\t\t\t\t</body>\n\t\t\t</html>\n\t\t);\n\t\treturn '<!DOCTYPE html>' + renderToString( htmlDoc );\n\t}\n\n\tconst getInjectedJavaScript = useCallback( () => {\n\t\t// Allow parent to override the resize observers with prop.customJS (legacy support)\n\t\tlet injectedJS = customJS || observeAndResizeJS;\n\n\t\t// Add any event listeners that were passed in.\n\t\tObject.keys( onWindowEvents ).forEach( ( eventType ) => {\n\t\t\tinjectedJS += `\n\t\t\t\twindow.addEventListener( '${ eventType }', function( event ) {\n\t\t\t\t\twindow.ReactNativeWebView.postMessage( JSON.stringify( { type: '${ eventType }', ...event.data } ) );\n\t\t\t\t});`;\n\t\t} );\n\n\t\treturn injectedJS;\n\t}, [ customJS, onWindowEvents ] );\n\n\tfunction updateContentHtml( forceRerender = false ) {\n\t\tconst newContentHtml = getHtmlDoc();\n\n\t\tif ( forceRerender && contentHtml === newContentHtml ) {\n\t\t\t// The re-render is forced by updating the state with empty HTML,\n\t\t\t// waiting for the JS code to be executed with \"setImmediate\" and then\n\t\t\t// setting the content HTML again.\n\t\t\tsetContentHtml( '' );\n\t\t\tsetImmediate( () => setContentHtml( newContentHtml ) );\n\t\t} else {\n\t\t\tsetContentHtml( newContentHtml );\n\t\t}\n\t}\n\n\tfunction getSizeStyle() {\n\t\tconst contentHeight = Math.ceil( height );\n\n\t\treturn contentHeight ? { height: contentHeight } : { aspectRatio: 1 };\n\t}\n\n\tfunction onChangeDimensions( dimensions ) {\n\t\tsetIsLandscape( dimensions.window.width >= dimensions.window.height );\n\t}\n\n\tconst onMessage = useCallback(\n\t\t( message ) => {\n\t\t\tlet data = message?.nativeEvent?.data;\n\n\t\t\ttry {\n\t\t\t\tdata = JSON.parse( data );\n\t\t\t} catch ( e ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// check for resize event\n\t\t\tif ( 'resize' === data?.action ) {\n\t\t\t\tsetHeight( data.height );\n\t\t\t}\n\n\t\t\t// Forward the event to parent event listeners\n\t\t\tObject.keys( onWindowEvents ).forEach( ( eventType ) => {\n\t\t\t\tif ( data?.type === eventType ) {\n\t\t\t\t\ttry {\n\t\t\t\t\t\tonWindowEvents[ eventType ]( data );\n\t\t\t\t\t} catch ( e ) {\n\t\t\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t\t`Error handling event ${ eventType }`,\n\t\t\t\t\t\t\te\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\t\t[ onWindowEvents ]\n\t);\n\n\tuseEffect( () => {\n\t\tconst dimensionsChangeSubscription = Dimensions.addEventListener(\n\t\t\t'change',\n\t\t\tonChangeDimensions\n\t\t);\n\t\treturn () => {\n\t\t\tdimensionsChangeSubscription.remove();\n\t\t};\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tupdateContentHtml();\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ html, title, type, styles, scripts ] );\n\n\tuseEffect( () => {\n\t\t// When device orientation changes we have to recalculate the size,\n\t\t// for this purpose we reset the current size value.\n\t\tif ( wasLandscape.current !== isLandscape ) {\n\t\t\tsetHeight( 0 );\n\t\t}\n\t\twasLandscape.current = isLandscape;\n\t}, [ isLandscape ] );\n\n\treturn (\n\t\t<WebView\n\t\t\tcontainerStyle={ [\n\t\t\t\tsandboxStyles[ 'sandbox-webview__container' ],\n\t\t\t\tcontainerStyle,\n\t\t\t] }\n\t\t\tinjectedJavaScript={ getInjectedJavaScript() }\n\t\t\tkey={ key }\n\t\t\tref={ ref }\n\t\t\tsource={ { baseUrl: providerUrl, html: contentHtml } }\n\t\t\t// Wildcard value is required for static HTML\n\t\t\t// Reference: https://github.com/react-native-webview/react-native-webview/blob/master/docs/Reference.md#source\n\t\t\toriginWhitelist={ [ '*' ] }\n\t\t\tstyle={ [\n\t\t\t\tsandboxStyles[ 'sandbox-webview__content' ],\n\t\t\t\tgetSizeStyle(),\n\t\t\t\tPlatform.isAndroid && workaroundStyles.webView,\n\t\t\t] }\n\t\t\tonMessage={ onMessage }\n\t\t\tscrollEnabled={ false }\n\t\t\tsetBuiltInZoomControls={ false }\n\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\tshowsVerticalScrollIndicator={ false }\n\t\t\tmediaPlaybackRequiresUserAction={ false }\n\t\t\tonLoadEnd={ onLoadEnd }\n\t\t\ttestID={ testID }\n\t\t/>\n\t);\n} );\n\nconst workaroundStyles = StyleSheet.create( {\n\twebView: {\n\t\t/**\n\t\t * The slight opacity below is a workaround for an Android crash caused from combining Android\n\t\t * 12's new scroll overflow behavior and webviews.\n\t\t * https://github.com/react-native-webview/react-native-webview/issues/1915#issuecomment-808869253\n\t\t */\n\t\topacity: 0.99,\n\t},\n} );\n\nexport default memo( Sandbox );\n"]}

package/build/slot-fill/bubbles-virtually/fill.js

@@ -48,8 +48,9 @@ function Fill(_ref) {
     unregisterFill,
     ...slot
   } = (0, _useSlot.default)(name);
+  const rerender = useForceUpdate();
   const ref = (0, _element.useRef)({
-    rerender: useForceUpdate()
+    rerender
   });
   (0, _element.useEffect)(() => {
     // We register fills so we can keep track of their existence.

package/build/slot-fill/bubbles-virtually/fill.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/fill.js"],"names":["useForceUpdate","setState","mounted","current","Fill","name","children","registerFill","unregisterFill","slot","ref","rerender","fillProps","wrappedChildren","ownerDocument"],"mappings":";;;;;;;;;AAIA;;AAKA;;AACA;;AAVA;;AACA;AACA;AACA;;AAGA;AACA;AACA;AAIA,SAASA,cAAT,GAA0B;AACzB,QAAM,GAAIC,QAAJ,IAAiB,uBAAU,EAAV,CAAvB;AACA,QAAMC,OAAO,GAAG,qBAAQ,IAAR,CAAhB;AAEA,0BAAW,MAAM;AAChBA,IAAAA,OAAO,CAACC,OAAR,GAAkB,IAAlB;AACA,WAAO,MAAM;AACZD,MAAAA,OAAO,CAACC,OAAR,GAAkB,KAAlB;AACA,KAFD;AAGA,GALD,EAKG,EALH;AAOA,SAAO,MAAM;AACZ,QAAKD,OAAO,CAACC,OAAb,EAAuB;AACtBF,MAAAA,QAAQ,CAAE,EAAF,CAAR;AACA;AACD,GAJD;AAKA;;AAEc,SAASG,IAAT,OAAoC;AAAA,MAArB;AAAEC,IAAAA,IAAF;AAAQC,IAAAA;AAAR,GAAqB;AAClD,QAAM;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA,cAAhB;AAAgC,OAAGC;AAAnC,MAA4C,sBAASJ,IAAT,CAAlD;AACA,QAAMK,GAAG,GAAG,qBAAQ;AAAEC,IAAAA,QAAQ,EAAEX,cAAc;AAA1B,GAAR,CAAZ;AAEA,0BAAW,MAAM;AAChB;AACA;AACA;AACAO,IAAAA,YAAY,CAAEG,GAAF,CAAZ;AACA,WAAO,MAAM;AACZF,MAAAA,cAAc,CAAEE,GAAF,CAAd;AACA,KAFD;AAGA,GARD,EAQG,CAAEH,YAAF,EAAgBC,cAAhB,CARH;;AAUA,MAAK,CAAEC,IAAI,CAACC,GAAP,IAAc,CAAED,IAAI,CAACC,GAAL,CAASP,OAA9B,EAAwC;AACvC,WAAO,IAAP;AACA;;AAED,MAAK,OAAOG,QAAP,KAAoB,UAAzB,EAAsC;AACrCA,IAAAA,QAAQ,GAAGA,QAAQ,CAAEG,IAAI,CAACG,SAAP,CAAnB;AACA,GApBiD,CAsBlD;AACA;AACA;AACA;;;AACA,QAAMC,eAAe,GACpB,4BAAC,sBAAD;AAAe,IAAA,QAAQ,EAAGJ,IAAI,CAACC,GAAL,CAASP,OAAT,CAAiBW;AAA3C,KACGR,QADH,CADD;AAMA,SAAO,2BAAcO,eAAd,EAA+BJ,IAAI,CAACC,GAAL,CAASP,OAAxC,CAAP;AACA","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport { useRef, useState, useEffect, createPortal } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useSlot from './use-slot';\nimport StyleProvider from '../../style-provider';\n\nfunction useForceUpdate() {\n\tconst [ , setState ] = useState( {} );\n\tconst mounted = useRef( true );\n\n\tuseEffect( () => {\n\t\tmounted.current = true;\n\t\treturn () => {\n\t\t\tmounted.current = false;\n\t\t};\n\t}, [] );\n\n\treturn () => {\n\t\tif ( mounted.current ) {\n\t\t\tsetState( {} );\n\t\t}\n\t};\n}\n\nexport default function Fill( { name, children } ) {\n\tconst { registerFill, unregisterFill, ...slot } = useSlot( name );\n\tconst ref = useRef( { rerender: useForceUpdate() } );\n\n\tuseEffect( () => {\n\t\t// We register fills so we can keep track of their existence.\n\t\t// Some Slot implementations need to know if there're already fills\n\t\t// registered so they can choose to render themselves or not.\n\t\tregisterFill( ref );\n\t\treturn () => {\n\t\t\tunregisterFill( ref );\n\t\t};\n\t}, [ registerFill, unregisterFill ] );\n\n\tif ( ! slot.ref || ! slot.ref.current ) {\n\t\treturn null;\n\t}\n\n\tif ( typeof children === 'function' ) {\n\t\tchildren = children( slot.fillProps );\n\t}\n\n\t// When using a `Fill`, the `children` will be rendered in the document of the\n\t// `Slot`. This means that we need to wrap the `children` in a `StyleProvider`\n\t// to make sure we're referencing the right document/iframe (instead of the\n\t// context of the `Fill`'s parent).\n\tconst wrappedChildren = (\n\t\t<StyleProvider document={ slot.ref.current.ownerDocument }>\n\t\t\t{ children }\n\t\t</StyleProvider>\n\t);\n\n\treturn createPortal( wrappedChildren, slot.ref.current );\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/fill.js"],"names":["useForceUpdate","setState","mounted","current","Fill","name","children","registerFill","unregisterFill","slot","rerender","ref","fillProps","wrappedChildren","ownerDocument"],"mappings":";;;;;;;;;AAIA;;AAKA;;AACA;;AAVA;;AACA;AACA;AACA;;AAGA;AACA;AACA;AAIA,SAASA,cAAT,GAA0B;AACzB,QAAM,GAAIC,QAAJ,IAAiB,uBAAU,EAAV,CAAvB;AACA,QAAMC,OAAO,GAAG,qBAAQ,IAAR,CAAhB;AAEA,0BAAW,MAAM;AAChBA,IAAAA,OAAO,CAACC,OAAR,GAAkB,IAAlB;AACA,WAAO,MAAM;AACZD,MAAAA,OAAO,CAACC,OAAR,GAAkB,KAAlB;AACA,KAFD;AAGA,GALD,EAKG,EALH;AAOA,SAAO,MAAM;AACZ,QAAKD,OAAO,CAACC,OAAb,EAAuB;AACtBF,MAAAA,QAAQ,CAAE,EAAF,CAAR;AACA;AACD,GAJD;AAKA;;AAEc,SAASG,IAAT,OAAoC;AAAA,MAArB;AAAEC,IAAAA,IAAF;AAAQC,IAAAA;AAAR,GAAqB;AAClD,QAAM;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA,cAAhB;AAAgC,OAAGC;AAAnC,MAA4C,sBAASJ,IAAT,CAAlD;AACA,QAAMK,QAAQ,GAAGV,cAAc,EAA/B;AACA,QAAMW,GAAG,GAAG,qBAAQ;AAAED,IAAAA;AAAF,GAAR,CAAZ;AAEA,0BAAW,MAAM;AAChB;AACA;AACA;AACAH,IAAAA,YAAY,CAAEI,GAAF,CAAZ;AACA,WAAO,MAAM;AACZH,MAAAA,cAAc,CAAEG,GAAF,CAAd;AACA,KAFD;AAGA,GARD,EAQG,CAAEJ,YAAF,EAAgBC,cAAhB,CARH;;AAUA,MAAK,CAAEC,IAAI,CAACE,GAAP,IAAc,CAAEF,IAAI,CAACE,GAAL,CAASR,OAA9B,EAAwC;AACvC,WAAO,IAAP;AACA;;AAED,MAAK,OAAOG,QAAP,KAAoB,UAAzB,EAAsC;AACrCA,IAAAA,QAAQ,GAAGA,QAAQ,CAAEG,IAAI,CAACG,SAAP,CAAnB;AACA,GArBiD,CAuBlD;AACA;AACA;AACA;;;AACA,QAAMC,eAAe,GACpB,4BAAC,sBAAD;AAAe,IAAA,QAAQ,EAAGJ,IAAI,CAACE,GAAL,CAASR,OAAT,CAAiBW;AAA3C,KACGR,QADH,CADD;AAMA,SAAO,2BAAcO,eAAd,EAA+BJ,IAAI,CAACE,GAAL,CAASR,OAAxC,CAAP;AACA","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport { useRef, useState, useEffect, createPortal } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useSlot from './use-slot';\nimport StyleProvider from '../../style-provider';\n\nfunction useForceUpdate() {\n\tconst [ , setState ] = useState( {} );\n\tconst mounted = useRef( true );\n\n\tuseEffect( () => {\n\t\tmounted.current = true;\n\t\treturn () => {\n\t\t\tmounted.current = false;\n\t\t};\n\t}, [] );\n\n\treturn () => {\n\t\tif ( mounted.current ) {\n\t\t\tsetState( {} );\n\t\t}\n\t};\n}\n\nexport default function Fill( { name, children } ) {\n\tconst { registerFill, unregisterFill, ...slot } = useSlot( name );\n\tconst rerender = useForceUpdate();\n\tconst ref = useRef( { rerender } );\n\n\tuseEffect( () => {\n\t\t// We register fills so we can keep track of their existence.\n\t\t// Some Slot implementations need to know if there're already fills\n\t\t// registered so they can choose to render themselves or not.\n\t\tregisterFill( ref );\n\t\treturn () => {\n\t\t\tunregisterFill( ref );\n\t\t};\n\t}, [ registerFill, unregisterFill ] );\n\n\tif ( ! slot.ref || ! slot.ref.current ) {\n\t\treturn null;\n\t}\n\n\tif ( typeof children === 'function' ) {\n\t\tchildren = children( slot.fillProps );\n\t}\n\n\t// When using a `Fill`, the `children` will be rendered in the document of the\n\t// `Slot`. This means that we need to wrap the `children` in a `StyleProvider`\n\t// to make sure we're referencing the right document/iframe (instead of the\n\t// context of the `Fill`'s parent).\n\tconst wrappedChildren = (\n\t\t<StyleProvider document={ slot.ref.current.ownerDocument }>\n\t\t\t{ children }\n\t\t</StyleProvider>\n\t);\n\n\treturn createPortal( wrappedChildren, slot.ref.current );\n}\n"]}