: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
// src/menu/menu-button.tsx
function getInitialFocus(event, dir) {
ArrowDown: dir === "bottom" || dir === "top" ? "first" : false,
ArrowUp: dir === "bottom" || dir === "top" ? "last" : false,
ArrowRight: dir === "right" ? "first" : false,
ArrowLeft: dir === "left" ? "first" : false
return keyMap[event.key];
function hasActiveItem(items, excludeElement) {
return !!(items == null ? void 0 : items.some((item) => {
if (item.element === excludeElement)
return item.element.getAttribute("aria-expanded") === "true";
var useMenuButton = createHook(
var _b = _a, { store, focusable, accessibleWhenDisabled, showOnHover } = _b, props = __objRest(_b, ["store", "focusable", "accessibleWhenDisabled", "showOnHover"]);
const context = useMenuProviderContext();
store = store || context;
const ref = (0,external_React_.useRef)(null);
const parentMenu = store.parent;
const parentMenubar = store.menubar;
const hasParentMenu = !!parentMenu;
const parentIsMenubar = !!parentMenubar && !hasParentMenu;
const disabled = disabledFromProps(props);
const trigger = ref.current;
store == null ? void 0 : store.setDisclosureElement(trigger);
store == null ? void 0 : store.setAnchorElement(trigger);
store == null ? void 0 : store.show();
const onFocusProp = props.onFocus;
const onFocus = useEvent((event) => {
onFocusProp == null ? void 0 : onFocusProp(event);
if (event.defaultPrevented)
store == null ? void 0 : store.setAutoFocusOnShow(false);
store == null ? void 0 : store.setActiveId(null);
const { items } = parentMenubar.getState();
if (hasActiveItem(items, event.currentTarget)) {
const dir = store.useState(
(state) => state.placement.split("-")[0]
const onKeyDownProp = props.onKeyDown;
const onKeyDown = useEvent((event) => {
onKeyDownProp == null ? void 0 : onKeyDownProp(event);
if (event.defaultPrevented)
const initialFocus = getInitialFocus(event, dir);
store == null ? void 0 : store.setAutoFocusOnShow(true);
store == null ? void 0 : store.setInitialFocus(initialFocus);
const onClickProp = props.onClick;
const onClick = useEvent((event) => {
onClickProp == null ? void 0 : onClickProp(event);
if (event.defaultPrevented)
const isKeyboardClick = !event.detail;
const { open } = store.getState();
if (!open || isKeyboardClick) {
if (!hasParentMenu || isKeyboardClick) {
store.setAutoFocusOnShow(true);
store.setInitialFocus(isKeyboardClick ? "first" : "container");
(element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuContextProvider, { value: store, children: element }),
props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), {
render: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Role.div, { render: props.render })
const id = useId(props.id);
const parentContentElement = useStoreState(
(parentMenu == null ? void 0 : parentMenu.combobox) || parentMenu,
const role = hasParentMenu || parentIsMenubar ? getPopupItemRole(parentContentElement, "menuitem") : void 0;
const contentElement = store.useState("contentElement");
props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({
"aria-haspopup": getPopupRole(contentElement, "menu")
ref: useMergeRefs(ref, props.ref),
props = useHovercardAnchor(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({
showOnHover: (event) => {
const getShowOnHover = () => {
if (typeof showOnHover === "function")
return showOnHover(event);
const { items } = parentMenubar.getState();
return parentIsMenubar && hasActiveItem(items);
const canShowOnHover = getShowOnHover();
const parent = parentIsMenubar ? parentMenubar : parentMenu;
parent.setActiveId(event.currentTarget.id);
props = usePopoverDisclosure(_4R3V3JGP_spreadValues({
toggleOnClick: !hasParentMenu,
props = useCompositeTypeahead(_4R3V3JGP_spreadValues({
typeahead: parentIsMenubar
var MenuButton = createComponent((props) => {
const htmlProps = useMenuButton(props);
return _3ORBWXWF_createElement("button", htmlProps);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-right-small.js
const chevronRightSmall = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
d: "M10.8622 8.04053L14.2805 12.0286L10.8622 16.0167L9.72327 15.0405L12.3049 12.0286L9.72327 9.01672L10.8622 8.04053Z"
/* harmony default export */ const chevron_right_small = (chevronRightSmall);
;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/HHNFDKU2.js
// src/menu/menu-list.tsx
function useAriaLabelledBy(_a) {
var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
const [id, setId] = (0,external_React_.useState)(void 0);
const label = props["aria-label"];
const disclosureElement = useStoreState(store, "disclosureElement");
const contentElement = useStoreState(store, "contentElement");
(0,external_React_.useEffect)(() => {
const disclosure = disclosureElement;
const menu = contentElement;
const menuLabel = label || menu.hasAttribute("aria-label");
} else if (disclosure.id) {
}, [label, disclosureElement, contentElement]);
var useMenuList = createHook(
var _b = _a, { store, alwaysVisible, composite } = _b, props = __objRest(_b, ["store", "alwaysVisible", "composite"]);
const context = useMenuProviderContext();
store = store || context;
const parentMenu = store.parent;
const parentMenubar = store.menubar;
const hasParentMenu = !!parentMenu;
const id = useId(props.id);
const onKeyDownProp = props.onKeyDown;
const dir = store.useState(
(state) => state.placement.split("-")[0]
const orientation = store.useState(
(state) => state.orientation === "both" ? void 0 : state.orientation
const isHorizontal = orientation !== "vertical";
const isMenubarHorizontal = useStoreState(
(state) => !!state && state.orientation !== "vertical"
const onKeyDown = useEvent((event) => {
onKeyDownProp == null ? void 0 : onKeyDownProp(event);
if (event.defaultPrevented)
if (hasParentMenu || parentMenubar && !isHorizontal) {
ArrowRight: () => dir === "left" && !isHorizontal,
ArrowLeft: () => dir === "right" && !isHorizontal,
ArrowUp: () => dir === "bottom" && isHorizontal,
ArrowDown: () => dir === "top" && isHorizontal
const action = hideMap[event.key];
if (action == null ? void 0 : action()) {
return store == null ? void 0 : store.hide();
if (!isMenubarHorizontal)
return parentMenubar.next();
if (!isMenubarHorizontal)
return parentMenubar.previous();
return parentMenubar.next();
return parentMenubar.previous();
const action = keyMap[event.key];
const id2 = action == null ? void 0 : action();
(element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuScopedContextProvider, { value: store, children: element }),
const ariaLabelledBy = useAriaLabelledBy(_4R3V3JGP_spreadValues({ store }, props));
const mounted = store.useState("mounted");
const hidden = isHidden(mounted, props.hidden, alwaysVisible);
const style = hidden ? _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props.style), { display: "none" }) : props.style;
props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({
"aria-labelledby": ariaLabelledBy,
ref: useMergeRefs(id ? store.setContentElement : null, props.ref),
const hasCombobox = !!store.combobox;
composite = composite != null ? composite : !hasCombobox;
props = _4R3V3JGP_spreadValues({
"aria-orientation": orientation
props = useComposite(_4R3V3JGP_spreadValues({ store, composite }, props));
props = useCompositeTypeahead(_4R3V3JGP_spreadValues({ store, typeahead: !hasCombobox }, props));
var MenuList = createComponent((props) => {
const htmlProps = useMenuList(props);
return _3ORBWXWF_createElement("div", htmlProps);
;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu.js
var useMenu = createHook(
modal: modalProp = false,
} = _b, props = __objRest(_b, [
const context = useMenuProviderContext();
store = store || context;
const ref = (0,external_React_.useRef)(null);
const parentMenu = store.parent;
const parentMenubar = store.menubar;
const hasParentMenu = !!parentMenu;
const parentIsMenubar = !!parentMenubar && !hasParentMenu;
props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), {
ref: useMergeRefs(ref, props.ref)
_4R3V3JGP_spreadValues({ store, alwaysVisible }, props)
), { "aria-labelledby": ariaLabelledBy } = _a2, menuListProps = __objRest(_a2, ["aria-labelledby"]);
const [initialFocusRef, setInitialFocusRef] = (0,external_React_.useState)();
const autoFocusOnShowState = store.useState("autoFocusOnShow");
const initialFocus = store.useState("initialFocus");
const baseElement = store.useState("baseElement");
const items = store.useState("renderedItems");
(0,external_React_.useEffect)(() => {
setInitialFocusRef((prevInitialFocusRef) => {
if (!autoFocusOnShowState)
if ((_a3 = prevInitialFocusRef == null ? void 0 : prevInitialFocusRef.current) == null ? void 0 : _a3.isConnected)
return prevInitialFocusRef;
const ref2 = (0,external_React_.createRef)();
ref2.current = ((_b2 = items.find((item) => !item.disabled && item.element)) == null ? void 0 : _b2.element) || null;
ref2.current = ((_c = [...items].reverse().find((item) => !item.disabled && item.element)) == null ? void 0 : _c.element) || null;
ref2.current = baseElement;
}, [store, autoFocusOnShowState, initialFocus, items, baseElement]);
const modal = hasParentMenu ? false : modalProp;
const mayAutoFocusOnShow = !!autoFocusOnShow;
const canAutoFocusOnShow = !!initialFocusRef || !!props.initialFocus || !!modal;
const contentElement = useStoreState(
const parentContentElement = useStoreState(
(parentMenu == null ? void 0 : parentMenu.combobox) || parentMenu,
const preserveTabOrderAnchor = (0,external_React_.useMemo)(() => {
if (!parentContentElement)