@wordpress/components
Version:
UI components for WordPress.
68 lines (67 loc) • 1.98 kB
JavaScript
// packages/components/src/menu-item/index.tsx
import clsx from "clsx";
import { cloneElement, forwardRef } from "@wordpress/element";
import Shortcut from "../shortcut";
import Button from "../button";
import Icon from "../icon";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
function UnforwardedMenuItem(props, ref) {
let {
children,
info,
className,
icon,
iconPosition = "right",
shortcut,
isSelected,
role = "menuitem",
suffix,
...buttonProps
} = props;
className = clsx("components-menu-item__button", className);
if (info) {
children = /* @__PURE__ */ _jsxs("span", {
className: "components-menu-item__info-wrapper",
children: [/* @__PURE__ */ _jsx("span", {
className: "components-menu-item__item",
children
}), /* @__PURE__ */ _jsx("span", {
className: "components-menu-item__info",
children: info
})]
});
}
if (icon && typeof icon !== "string") {
icon = cloneElement(icon, {
className: clsx("components-menu-items__item-icon", {
"has-icon-right": iconPosition === "right"
})
});
}
return /* @__PURE__ */ _jsxs(Button, {
__next40pxDefaultSize: true,
ref,
"aria-checked": role === "menuitemcheckbox" || role === "menuitemradio" ? isSelected : void 0,
role,
icon: iconPosition === "left" ? icon : void 0,
className,
accessibleWhenDisabled: true,
...buttonProps,
children: [/* @__PURE__ */ _jsx("span", {
className: "components-menu-item__item",
children
}), !suffix && /* @__PURE__ */ _jsx(Shortcut, {
className: "components-menu-item__shortcut",
shortcut
}), !suffix && icon && iconPosition === "right" && /* @__PURE__ */ _jsx(Icon, {
icon
}), suffix]
});
}
var MenuItem = forwardRef(UnforwardedMenuItem);
var menu_item_default = MenuItem;
export {
MenuItem,
menu_item_default as default
};
//# sourceMappingURL=index.js.map