[34000] Fix | Delete

[34001] Fix | Delete

[34002] Fix | Delete

[34003] Fix | Delete

[34004] Fix | Delete

/**

[34005] Fix | Delete

* Internal dependencies

[34006] Fix | Delete

*/

[34007] Fix | Delete

[34008] Fix | Delete

[34009] Fix | Delete

[34010] Fix | Delete

[34011] Fix | Delete

[34012] Fix | Delete

[34013] Fix | Delete

[34014] Fix | Delete

[34015] Fix | Delete

/**

[34016] Fix | Delete

* Name of slot in which popover should fill.

[34017] Fix | Delete

*

[34018] Fix | Delete

* @type {string}

[34019] Fix | Delete

*/

[34020] Fix | Delete

[34021] Fix | Delete

[34022] Fix | Delete

[34023] Fix | Delete

const SLOT_NAME = 'Popover';

[34024] Fix | Delete

[34025] Fix | Delete

// An SVG displaying a triangle facing down, filled with a solid

[34026] Fix | Delete

// color and bordered in such a way to create an arrow-like effect.

[34027] Fix | Delete

// Keeping the SVG's viewbox squared simplify the arrow positioning

[34028] Fix | Delete

// calculations.

[34029] Fix | Delete

const ArrowTriangle = () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, {

[34030] Fix | Delete

xmlns: "http://www.w3.org/2000/svg",

[34031] Fix | Delete

viewBox: "0 0 100 100",

[34032] Fix | Delete

className: "components-popover__triangle",

[34033] Fix | Delete

role: "presentation",

[34034] Fix | Delete

children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {

[34035] Fix | Delete

className: "components-popover__triangle-bg",

[34036] Fix | Delete

d: "M 0 0 L 50 50 L 100 0"

[34037] Fix | Delete

}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {

[34038] Fix | Delete

className: "components-popover__triangle-border",

[34039] Fix | Delete

d: "M 0 0 L 50 50 L 100 0",

[34040] Fix | Delete

vectorEffect: "non-scaling-stroke"

[34041] Fix | Delete

})]

[34042] Fix | Delete

});

[34043] Fix | Delete

const slotNameContext = (0,external_wp_element_namespaceObject.createContext)(undefined);

[34044] Fix | Delete

const fallbackContainerClassname = 'components-popover__fallback-container';

[34045] Fix | Delete

const getPopoverFallbackContainer = () => {

[34046] Fix | Delete

let container = document.body.querySelector('.' + fallbackContainerClassname);

[34047] Fix | Delete

if (!container) {

[34048] Fix | Delete

container = document.createElement('div');

[34049] Fix | Delete

container.className = fallbackContainerClassname;

[34050] Fix | Delete

document.body.append(container);

[34051] Fix | Delete

}

[34052] Fix | Delete

return container;

[34053] Fix | Delete

};

[34054] Fix | Delete

const UnforwardedPopover = (props, forwardedRef) => {

[34055] Fix | Delete

const {

[34056] Fix | Delete

animate = true,

[34057] Fix | Delete

headerTitle,

[34058] Fix | Delete

constrainTabbing,

[34059] Fix | Delete

onClose,

[34060] Fix | Delete

children,

[34061] Fix | Delete

className,

[34062] Fix | Delete

noArrow = true,

[34063] Fix | Delete

position,

[34064] Fix | Delete

placement: placementProp = 'bottom-start',

[34065] Fix | Delete

offset: offsetProp = 0,

[34066] Fix | Delete

focusOnMount = 'firstElement',

[34067] Fix | Delete

anchor,

[34068] Fix | Delete

expandOnMobile,

[34069] Fix | Delete

onFocusOutside,

[34070] Fix | Delete

__unstableSlotName = SLOT_NAME,

[34071] Fix | Delete

flip = true,

[34072] Fix | Delete

resize = true,

[34073] Fix | Delete

shift = false,

[34074] Fix | Delete

inline = false,

[34075] Fix | Delete

variant,

[34076] Fix | Delete

// Deprecated props

[34077] Fix | Delete

__unstableForcePosition,

[34078] Fix | Delete

anchorRef,

[34079] Fix | Delete

anchorRect,

[34080] Fix | Delete

getAnchorRect,

[34081] Fix | Delete

isAlternate,

[34082] Fix | Delete

// Rest

[34083] Fix | Delete

...contentProps

[34084] Fix | Delete

} = useContextSystem(props, 'Popover');

[34085] Fix | Delete

let computedFlipProp = flip;

[34086] Fix | Delete

let computedResizeProp = resize;

[34087] Fix | Delete

if (__unstableForcePosition !== undefined) {

[34088] Fix | Delete

external_wp_deprecated_default()('`__unstableForcePosition` prop in wp.components.Popover', {

[34089] Fix | Delete

since: '6.1',

[34090] Fix | Delete

version: '6.3',

[34091] Fix | Delete

alternative: '`flip={ false }` and `resize={ false }`'

[34092] Fix | Delete

});

[34093] Fix | Delete

[34094] Fix | Delete

// Back-compat, set the `flip` and `resize` props

[34095] Fix | Delete

// to `false` to replicate `__unstableForcePosition`.

[34096] Fix | Delete

computedFlipProp = !__unstableForcePosition;

[34097] Fix | Delete

computedResizeProp = !__unstableForcePosition;

[34098] Fix | Delete

}

[34099] Fix | Delete

if (anchorRef !== undefined) {

[34100] Fix | Delete

external_wp_deprecated_default()('`anchorRef` prop in wp.components.Popover', {

[34101] Fix | Delete

since: '6.1',

[34102] Fix | Delete

alternative: '`anchor` prop'

[34103] Fix | Delete

});

[34104] Fix | Delete

}

[34105] Fix | Delete

if (anchorRect !== undefined) {

[34106] Fix | Delete

external_wp_deprecated_default()('`anchorRect` prop in wp.components.Popover', {

[34107] Fix | Delete

since: '6.1',

[34108] Fix | Delete

alternative: '`anchor` prop'

[34109] Fix | Delete

});

[34110] Fix | Delete

}

[34111] Fix | Delete

if (getAnchorRect !== undefined) {

[34112] Fix | Delete

external_wp_deprecated_default()('`getAnchorRect` prop in wp.components.Popover', {

[34113] Fix | Delete

since: '6.1',

[34114] Fix | Delete

alternative: '`anchor` prop'

[34115] Fix | Delete

});

[34116] Fix | Delete

}

[34117] Fix | Delete

const computedVariant = isAlternate ? 'toolbar' : variant;

[34118] Fix | Delete

if (isAlternate !== undefined) {

[34119] Fix | Delete

external_wp_deprecated_default()('`isAlternate` prop in wp.components.Popover', {

[34120] Fix | Delete

since: '6.2',

[34121] Fix | Delete

alternative: "`variant` prop with the `'toolbar'` value"

[34122] Fix | Delete

});

[34123] Fix | Delete

}

[34124] Fix | Delete

const arrowRef = (0,external_wp_element_namespaceObject.useRef)(null);

[34125] Fix | Delete

const [fallbackReferenceElement, setFallbackReferenceElement] = (0,external_wp_element_namespaceObject.useState)(null);

[34126] Fix | Delete

const anchorRefFallback = (0,external_wp_element_namespaceObject.useCallback)(node => {

[34127] Fix | Delete

setFallbackReferenceElement(node);

[34128] Fix | Delete

}, []);

[34129] Fix | Delete

const isMobileViewport = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<');

[34130] Fix | Delete

const isExpanded = expandOnMobile && isMobileViewport;

[34131] Fix | Delete

const hasArrow = !isExpanded && !noArrow;

[34132] Fix | Delete

const normalizedPlacementFromProps = position ? positionToPlacement(position) : placementProp;

[34133] Fix | Delete

const middleware = [...(placementProp === 'overlay' ? overlayMiddlewares() : []), offset(offsetProp), computedFlipProp && floating_ui_dom_flip(), computedResizeProp && floating_ui_dom_size({

[34134] Fix | Delete

apply(sizeProps) {

[34135] Fix | Delete

var _refs$floating$curren;

[34136] Fix | Delete

const {

[34137] Fix | Delete

firstElementChild

[34138] Fix | Delete

} = (_refs$floating$curren = refs.floating.current) !== null && _refs$floating$curren !== void 0 ? _refs$floating$curren : {};

[34139] Fix | Delete

[34140] Fix | Delete

// Only HTMLElement instances have the `style` property.

[34141] Fix | Delete

if (!(firstElementChild instanceof HTMLElement)) {

[34142] Fix | Delete

return;

[34143] Fix | Delete

}

[34144] Fix | Delete

[34145] Fix | Delete

// Reduce the height of the popover to the available space.

[34146] Fix | Delete

Object.assign(firstElementChild.style, {

[34147] Fix | Delete

maxHeight: `${sizeProps.availableHeight}px`,

[34148] Fix | Delete

overflow: 'auto'

[34149] Fix | Delete

});

[34150] Fix | Delete

}

[34151] Fix | Delete

}), shift && floating_ui_dom_shift({

[34152] Fix | Delete

crossAxis: true,

[34153] Fix | Delete

limiter: floating_ui_dom_limitShift(),

[34154] Fix | Delete

padding: 1 // Necessary to avoid flickering at the edge of the viewport.

[34155] Fix | Delete

}), floating_ui_react_dom_arrow({

[34156] Fix | Delete

element: arrowRef

[34157] Fix | Delete

})];

[34158] Fix | Delete

const slotName = (0,external_wp_element_namespaceObject.useContext)(slotNameContext) || __unstableSlotName;

[34159] Fix | Delete

const slot = useSlot(slotName);

[34160] Fix | Delete

let onDialogClose;

[34161] Fix | Delete

if (onClose || onFocusOutside) {

[34162] Fix | Delete

onDialogClose = (type, event) => {

[34163] Fix | Delete

// Ideally the popover should have just a single onClose prop and

[34164] Fix | Delete

// not three props that potentially do the same thing.

[34165] Fix | Delete

if (type === 'focus-outside' && onFocusOutside) {

[34166] Fix | Delete

onFocusOutside(event);

[34167] Fix | Delete

} else if (onClose) {

[34168] Fix | Delete

onClose();

[34169] Fix | Delete

}

[34170] Fix | Delete

};

[34171] Fix | Delete

}

[34172] Fix | Delete

const [dialogRef, dialogProps] = (0,external_wp_compose_namespaceObject.__experimentalUseDialog)({

[34173] Fix | Delete

constrainTabbing,

[34174] Fix | Delete

focusOnMount,

[34175] Fix | Delete

__unstableOnClose: onDialogClose,

[34176] Fix | Delete

// @ts-expect-error The __unstableOnClose property needs to be deprecated first (see https://github.com/WordPress/gutenberg/pull/27675)

[34177] Fix | Delete

onClose: onDialogClose

[34178] Fix | Delete

});

[34179] Fix | Delete

const {

[34180] Fix | Delete

// Positioning coordinates

[34181] Fix | Delete

x,

[34182] Fix | Delete

y,

[34183] Fix | Delete

// Object with "regular" refs to both "reference" and "floating"

[34184] Fix | Delete

refs,

[34185] Fix | Delete

// Type of CSS position property to use (absolute or fixed)

[34186] Fix | Delete

strategy,

[34187] Fix | Delete

update,

[34188] Fix | Delete

placement: computedPlacement,

[34189] Fix | Delete

middlewareData: {

[34190] Fix | Delete

arrow: arrowData

[34191] Fix | Delete

}

[34192] Fix | Delete

} = useFloating({

[34193] Fix | Delete

placement: normalizedPlacementFromProps === 'overlay' ? undefined : normalizedPlacementFromProps,

[34194] Fix | Delete

middleware,

[34195] Fix | Delete

whileElementsMounted: (referenceParam, floatingParam, updateParam) => autoUpdate(referenceParam, floatingParam, updateParam, {

[34196] Fix | Delete

layoutShift: false,

[34197] Fix | Delete

animationFrame: true

[34198] Fix | Delete

})

[34199] Fix | Delete

});

[34200] Fix | Delete

const arrowCallbackRef = (0,external_wp_element_namespaceObject.useCallback)(node => {

[34201] Fix | Delete

arrowRef.current = node;

[34202] Fix | Delete

update();

[34203] Fix | Delete

}, [update]);

[34204] Fix | Delete

[34205] Fix | Delete

// When any of the possible anchor "sources" change,

[34206] Fix | Delete

// recompute the reference element (real or virtual) and its owner document.

[34207] Fix | Delete

[34208] Fix | Delete

const anchorRefTop = anchorRef?.top;

[34209] Fix | Delete

const anchorRefBottom = anchorRef?.bottom;

[34210] Fix | Delete

const anchorRefStartContainer = anchorRef?.startContainer;

[34211] Fix | Delete

const anchorRefCurrent = anchorRef?.current;

[34212] Fix | Delete

(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {

[34213] Fix | Delete

const resultingReferenceElement = getReferenceElement({

[34214] Fix | Delete

anchor,

[34215] Fix | Delete

anchorRef,

[34216] Fix | Delete

anchorRect,

[34217] Fix | Delete

getAnchorRect,

[34218] Fix | Delete

fallbackReferenceElement

[34219] Fix | Delete

});

[34220] Fix | Delete

refs.setReference(resultingReferenceElement);

[34221] Fix | Delete

}, [anchor, anchorRef, anchorRefTop, anchorRefBottom, anchorRefStartContainer, anchorRefCurrent, anchorRect, getAnchorRect, fallbackReferenceElement, refs]);

[34222] Fix | Delete

const mergedFloatingRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([refs.setFloating, dialogRef, forwardedRef]);

[34223] Fix | Delete

const style = isExpanded ? undefined : {

[34224] Fix | Delete

position: strategy,

[34225] Fix | Delete

top: 0,

[34226] Fix | Delete

left: 0,

[34227] Fix | Delete

// `x` and `y` are framer-motion specific props and are shorthands

[34228] Fix | Delete

// for `translateX` and `translateY`. Currently it is not possible

[34229] Fix | Delete

// to use `translateX` and `translateY` because those values would

[34230] Fix | Delete

// be overridden by the return value of the

[34231] Fix | Delete

// `placementToMotionAnimationProps` function.

[34232] Fix | Delete

x: computePopoverPosition(x),

[34233] Fix | Delete

y: computePopoverPosition(y)

[34234] Fix | Delete

};

[34235] Fix | Delete

const shouldReduceMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)();

[34236] Fix | Delete

const shouldAnimate = animate && !isExpanded && !shouldReduceMotion;

[34237] Fix | Delete

const [animationFinished, setAnimationFinished] = (0,external_wp_element_namespaceObject.useState)(false);

[34238] Fix | Delete

const {

[34239] Fix | Delete

style: motionInlineStyles,

[34240] Fix | Delete

...otherMotionProps

[34241] Fix | Delete

} = (0,external_wp_element_namespaceObject.useMemo)(() => placementToMotionAnimationProps(computedPlacement), [computedPlacement]);

[34242] Fix | Delete

const animationProps = shouldAnimate ? {

[34243] Fix | Delete

style: {

[34244] Fix | Delete

...motionInlineStyles,

[34245] Fix | Delete

...style

[34246] Fix | Delete

},

[34247] Fix | Delete

onAnimationComplete: () => setAnimationFinished(true),

[34248] Fix | Delete

...otherMotionProps

[34249] Fix | Delete

} : {

[34250] Fix | Delete

animate: false,

[34251] Fix | Delete

style

[34252] Fix | Delete

};

[34253] Fix | Delete

[34254] Fix | Delete

// When Floating UI has finished positioning and Framer Motion has finished animating

[34255] Fix | Delete

// the popover, add the `is-positioned` class to signal that all transitions have finished.

[34256] Fix | Delete

const isPositioned = (!shouldAnimate || animationFinished) && x !== null && y !== null;

[34257] Fix | Delete

let content = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(motion.div, {

[34258] Fix | Delete

className: dist_clsx(className, {

[34259] Fix | Delete

'is-expanded': isExpanded,

[34260] Fix | Delete

'is-positioned': isPositioned,

[34261] Fix | Delete

// Use the 'alternate' classname for 'toolbar' variant for back compat.

[34262] Fix | Delete

[`is-${computedVariant === 'toolbar' ? 'alternate' : computedVariant}`]: computedVariant

[34263] Fix | Delete

}),

[34264] Fix | Delete

...animationProps,

[34265] Fix | Delete

...contentProps,

[34266] Fix | Delete

ref: mergedFloatingRef,

[34267] Fix | Delete

...dialogProps,

[34268] Fix | Delete

tabIndex: -1,

[34269] Fix | Delete

children: [isExpanded && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(scroll_lock, {}), isExpanded && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {

[34270] Fix | Delete

className: "components-popover__header",

[34271] Fix | Delete

children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {

[34272] Fix | Delete

className: "components-popover__header-title",

[34273] Fix | Delete

children: headerTitle

[34274] Fix | Delete

}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {

[34275] Fix | Delete

className: "components-popover__close",

[34276] Fix | Delete

icon: library_close,

[34277] Fix | Delete

onClick: onClose

[34278] Fix | Delete

})]

[34279] Fix | Delete

}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {

[34280] Fix | Delete

className: "components-popover__content",

[34281] Fix | Delete

children: children

[34282] Fix | Delete

}), hasArrow && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {

[34283] Fix | Delete

ref: arrowCallbackRef,

[34284] Fix | Delete

className: ['components-popover__arrow', `is-${computedPlacement.split('-')[0]}`].join(' '),

[34285] Fix | Delete

style: {

[34286] Fix | Delete

left: typeof arrowData?.x !== 'undefined' && Number.isFinite(arrowData.x) ? `${arrowData.x}px` : '',

[34287] Fix | Delete

top: typeof arrowData?.y !== 'undefined' && Number.isFinite(arrowData.y) ? `${arrowData.y}px` : ''

[34288] Fix | Delete

},

[34289] Fix | Delete

children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ArrowTriangle, {})

[34290] Fix | Delete

})]

[34291] Fix | Delete

});

[34292] Fix | Delete

const shouldRenderWithinSlot = slot.ref && !inline;

[34293] Fix | Delete

const hasAnchor = anchorRef || anchorRect || anchor;

[34294] Fix | Delete

if (shouldRenderWithinSlot) {

[34295] Fix | Delete

content = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(slot_fill_Fill, {

[34296] Fix | Delete

name: slotName,

[34297] Fix | Delete

children: content

[34298] Fix | Delete

});

[34299] Fix | Delete

} else if (!inline) {

[34300] Fix | Delete

content = (0,external_wp_element_namespaceObject.createPortal)( /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyleProvider, {

[34301] Fix | Delete

document: document,

[34302] Fix | Delete

children: content

[34303] Fix | Delete

}), getPopoverFallbackContainer());

[34304] Fix | Delete

}

[34305] Fix | Delete

if (hasAnchor) {

[34306] Fix | Delete

return content;

[34307] Fix | Delete

}

[34308] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {

[34309] Fix | Delete

children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {

[34310] Fix | Delete

ref: anchorRefFallback

[34311] Fix | Delete

}), content]

[34312] Fix | Delete

});

[34313] Fix | Delete

};

[34314] Fix | Delete

[34315] Fix | Delete

/**

[34316] Fix | Delete

* `Popover` renders its content in a floating modal. If no explicit anchor is passed via props, it anchors to its parent element by default.

[34317] Fix | Delete

*

[34318] Fix | Delete

* ```jsx

[34319] Fix | Delete

* import { Button, Popover } from '@wordpress/components';

[34320] Fix | Delete

* import { useState } from '@wordpress/element';

[34321] Fix | Delete

*

[34322] Fix | Delete

* const MyPopover = () => {

[34323] Fix | Delete

* const [ isVisible, setIsVisible ] = useState( false );

[34324] Fix | Delete

* const toggleVisible = () => {

[34325] Fix | Delete

* setIsVisible( ( state ) => ! state );

[34326] Fix | Delete

* };

[34327] Fix | Delete

*

[34328] Fix | Delete

* return (

[34329] Fix | Delete

* <Button variant="secondary" onClick={ toggleVisible }>

[34330] Fix | Delete

* Toggle Popover!

[34331] Fix | Delete

* { isVisible && <Popover>Popover is toggled!</Popover> }

[34332] Fix | Delete

* </Button>

[34333] Fix | Delete

* );

[34334] Fix | Delete

* };

[34335] Fix | Delete

* ```

[34336] Fix | Delete

*

[34337] Fix | Delete

*/

[34338] Fix | Delete

const popover_Popover = contextConnect(UnforwardedPopover, 'Popover');

[34339] Fix | Delete

function PopoverSlot({

[34340] Fix | Delete

name = SLOT_NAME

[34341] Fix | Delete

}, ref) {

[34342] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(slot_fill_Slot, {

[34343] Fix | Delete

bubblesVirtually: true,

[34344] Fix | Delete

name: name,

[34345] Fix | Delete

className: "popover-slot",

[34346] Fix | Delete

ref: ref

[34347] Fix | Delete

});

[34348] Fix | Delete

}

[34349] Fix | Delete

[34350] Fix | Delete

// @ts-expect-error For Legacy Reasons

[34351] Fix | Delete

popover_Popover.Slot = (0,external_wp_element_namespaceObject.forwardRef)(PopoverSlot);

[34352] Fix | Delete

// @ts-expect-error For Legacy Reasons

[34353] Fix | Delete

popover_Popover.__unstableSlotNameProvider = slotNameContext.Provider;

[34354] Fix | Delete

/* harmony default export */ const popover = (popover_Popover);

[34355] Fix | Delete

[34356] Fix | Delete

;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/autocomplete/autocompleter-ui.js

[34357] Fix | Delete

/**

[34358] Fix | Delete

* External dependencies

[34359] Fix | Delete

*/

[34360] Fix | Delete

[34361] Fix | Delete

[34362] Fix | Delete

/**

[34363] Fix | Delete

* WordPress dependencies

[34364] Fix | Delete

*/

[34365] Fix | Delete

[34366] Fix | Delete

[34367] Fix | Delete

[34368] Fix | Delete

[34369] Fix | Delete

[34370] Fix | Delete

[34371] Fix | Delete

/**

[34372] Fix | Delete

* Internal dependencies

[34373] Fix | Delete

*/

[34374] Fix | Delete

[34375] Fix | Delete

[34376] Fix | Delete

[34377] Fix | Delete

[34378] Fix | Delete

[34379] Fix | Delete

[34380] Fix | Delete

[34381] Fix | Delete

[34382] Fix | Delete

function ListBox({

[34383] Fix | Delete

items,

[34384] Fix | Delete

onSelect,

[34385] Fix | Delete

selectedIndex,

[34386] Fix | Delete

instanceId,

[34387] Fix | Delete

listBoxId,

[34388] Fix | Delete

className,

[34389] Fix | Delete

Component = 'div'

[34390] Fix | Delete

}) {

[34391] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {

[34392] Fix | Delete

id: listBoxId,

[34393] Fix | Delete

role: "listbox",

[34394] Fix | Delete

className: "components-autocomplete__results",

[34395] Fix | Delete

children: items.map((option, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {

[34396] Fix | Delete

id: `components-autocomplete-item-${instanceId}-${option.key}`,

[34397] Fix | Delete

role: "option",

[34398] Fix | Delete

"aria-selected": index === selectedIndex,

[34399] Fix | Delete

disabled: option.isDisabled,

[34400] Fix | Delete

className: dist_clsx('components-autocomplete__result', className, {

[34401] Fix | Delete

'is-selected': index === selectedIndex

[34402] Fix | Delete

}),

[34403] Fix | Delete

onClick: () => onSelect(option),

[34404] Fix | Delete

children: option.label

[34405] Fix | Delete

}, option.key))

[34406] Fix | Delete

});

[34407] Fix | Delete

}

[34408] Fix | Delete

function getAutoCompleterUI(autocompleter) {

[34409] Fix | Delete

var _autocompleter$useIte;

[34410] Fix | Delete

const useItems = (_autocompleter$useIte = autocompleter.useItems) !== null && _autocompleter$useIte !== void 0 ? _autocompleter$useIte : getDefaultUseItems(autocompleter);

[34411] Fix | Delete

function AutocompleterUI({

[34412] Fix | Delete

filterValue,

[34413] Fix | Delete

instanceId,

[34414] Fix | Delete

listBoxId,

[34415] Fix | Delete

className,

[34416] Fix | Delete

selectedIndex,

[34417] Fix | Delete

onChangeOptions,

[34418] Fix | Delete

onSelect,

[34419] Fix | Delete

onReset,

[34420] Fix | Delete

reset,

[34421] Fix | Delete

contentRef

[34422] Fix | Delete

}) {

[34423] Fix | Delete

const [items] = useItems(filterValue);

[34424] Fix | Delete

const popoverAnchor = (0,external_wp_richText_namespaceObject.useAnchor)({

[34425] Fix | Delete

editableContentElement: contentRef.current

[34426] Fix | Delete

});

[34427] Fix | Delete

const [needsA11yCompat, setNeedsA11yCompat] = (0,external_wp_element_namespaceObject.useState)(false);

[34428] Fix | Delete

const popoverRef = (0,external_wp_element_namespaceObject.useRef)(null);

[34429] Fix | Delete

const popoverRefs = (0,external_wp_compose_namespaceObject.useMergeRefs)([popoverRef, (0,external_wp_compose_namespaceObject.useRefEffect)(node => {

[34430] Fix | Delete

if (!contentRef.current) {

[34431] Fix | Delete

return;

[34432] Fix | Delete

}

[34433] Fix | Delete

[34434] Fix | Delete

// If the popover is rendered in a different document than

[34435] Fix | Delete

// the content, we need to duplicate the options list in the

[34436] Fix | Delete

// content document so that it's available to the screen

[34437] Fix | Delete

// readers, which check the DOM ID based aria-* attributes.

[34438] Fix | Delete

setNeedsA11yCompat(node.ownerDocument !== contentRef.current.ownerDocument);

[34439] Fix | Delete

}, [contentRef])]);

[34440] Fix | Delete

useOnClickOutside(popoverRef, reset);

[34441] Fix | Delete

const debouncedSpeak = (0,external_wp_compose_namespaceObject.useDebounce)(external_wp_a11y_namespaceObject.speak, 500);

[34442] Fix | Delete

function announce(options) {

[34443] Fix | Delete

if (!debouncedSpeak) {

[34444] Fix | Delete

return;

[34445] Fix | Delete

}

[34446] Fix | Delete

if (!!options.length) {

[34447] Fix | Delete

if (filterValue) {

[34448] Fix | Delete

debouncedSpeak((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */

[34449] Fix | Delete

(0,external_wp_i18n_namespaceObject._n)('%d result found, use up and down arrow keys to navigate.', '%d results found, use up and down arrow keys to navigate.', options.length), options.length), 'assertive');

[34450] Fix | Delete

} else {

[34451] Fix | Delete

debouncedSpeak((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */

[34452] Fix | Delete

(0,external_wp_i18n_namespaceObject._n)('Initial %d result loaded. Type to filter all available results. Use up and down arrow keys to navigate.', 'Initial %d results loaded. Type to filter all available results. Use up and down arrow keys to navigate.', options.length), options.length), 'assertive');

[34453] Fix | Delete

}

[34454] Fix | Delete

} else {

[34455] Fix | Delete

debouncedSpeak((0,external_wp_i18n_namespaceObject.__)('No results.'), 'assertive');

[34456] Fix | Delete

}

[34457] Fix | Delete

}

[34458] Fix | Delete

(0,external_wp_element_namespaceObject.useLayoutEffect)(() => {

[34459] Fix | Delete

onChangeOptions(items);

[34460] Fix | Delete

announce(items);

[34461] Fix | Delete

// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.

[34462] Fix | Delete

// See https://github.com/WordPress/gutenberg/pull/41820

[34463] Fix | Delete

// eslint-disable-next-line react-hooks/exhaustive-deps

[34464] Fix | Delete

}, [items]);

[34465] Fix | Delete

if (items.length === 0) {

[34466] Fix | Delete

return null;

[34467] Fix | Delete

}

[34468] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {

[34469] Fix | Delete

children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(popover, {

[34470] Fix | Delete

focusOnMount: false,

[34471] Fix | Delete

onClose: onReset,

[34472] Fix | Delete

placement: "top-start",

[34473] Fix | Delete

className: "components-autocomplete__popover",

[34474] Fix | Delete

anchor: popoverAnchor,

[34475] Fix | Delete

ref: popoverRefs,

[34476] Fix | Delete

children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ListBox, {

[34477] Fix | Delete

items: items,

[34478] Fix | Delete

onSelect: onSelect,

[34479] Fix | Delete

selectedIndex: selectedIndex,

[34480] Fix | Delete

instanceId: instanceId,

[34481] Fix | Delete

listBoxId: listBoxId,

[34482] Fix | Delete

className: className

[34483] Fix | Delete

})

[34484] Fix | Delete

}), contentRef.current && needsA11yCompat && (0,external_ReactDOM_namespaceObject.createPortal)( /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ListBox, {

[34485] Fix | Delete

items: items,

[34486] Fix | Delete

onSelect: onSelect,

[34487] Fix | Delete

selectedIndex: selectedIndex,

[34488] Fix | Delete

instanceId: instanceId,

[34489] Fix | Delete

listBoxId: listBoxId,

[34490] Fix | Delete

className: className,

[34491] Fix | Delete

Component: visually_hidden_component

[34492] Fix | Delete

}), contentRef.current.ownerDocument.body)]

[34493] Fix | Delete

});

[34494] Fix | Delete

}

[34495] Fix | Delete

return AutocompleterUI;

[34496] Fix | Delete

}

[34497] Fix | Delete

function useOnClickOutside(ref, handler) {

[34498] Fix | Delete

(0,external_wp_element_namespaceObject.useEffect)(() => {

[34499] Fix | Delete