@koine/react 1.1.11 → 1.1.12

package/Menu/MenuMui.js

@@ -1,78 +1,165 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Menu = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var utils_1 = require("@mui/utils");
-var framer_motion_1 = require("framer-motion");
-var MenuUnstyled_1 = require("@mui/base/MenuUnstyled");
-var ModalUnstyled_1 = tslib_1.__importDefault(require("@mui/base/ModalUnstyled"));
-var ClickAwayListener_1 = tslib_1.__importDefault(require("@mui/base/ClickAwayListener"));
-var react_popper_1 = require("react-popper");
-var clsx_1 = tslib_1.__importDefault(require("@koine/utils/clsx"));
-var MenuRoot = framer_motion_1.motion.div;
-var MenuBackdrop = function () { return (0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0" }); };
-exports.Menu = (0, react_1.forwardRef)(function Menu(props, ref) {
-    var Button = props.Button, placement = props.placement, children = props.children, className = props.className, htmlAttributes = tslib_1.__rest(props, ["Button", "placement", "children", "className"]);
-    var id = (0, react_1.useId)();
-    var buttonRef = (0, react_1.useRef)(null);
-    var menuActions = (0, react_1.useRef)(null);
-    var _a = (0, react_1.useState)(null), popperElement = _a[0], setPopperElement = _a[1];
-    var _b = (0, react_1.useState)(null), anchorEl = _b[0], setAnchorEl = _b[1];
-    var open = Boolean(anchorEl);
-    var styles = (0, react_popper_1.usePopper)(anchorEl, popperElement, {
-        placement: placement,
-        // strategy: "absolute",
-    }).styles;
-    var _c = (0, MenuUnstyled_1.useMenu)({
-        listboxId: id,
-        listboxRef: setPopperElement,
-        // these two make the Tab key behaviour correct, closing the menu on Tab
-        // press and re-focusing the Button trigger element
-        open: open,
-        onClose: function () { return setAnchorEl(null); },
-    }), registerItem = _c.registerItem, unregisterItem = _c.unregisterItem, getListboxProps = _c.getListboxProps, getItemProps = _c.getItemProps, getItemState = _c.getItemState;
-    var contextValue = {
-        registerItem: registerItem,
-        unregisterItem: unregisterItem,
-        getItemState: getItemState,
-        getItemProps: getItemProps,
-        open: open,
-    };
-    var handleButtonClick = function (event) {
-        if (open) {
-            setAnchorEl(null);
-        }
-        else {
-            setAnchorEl(event.currentTarget);
-        }
-    };
-    var handleButtonKeyDown = function (event) {
-        var _a;
-        if (event.key === "ArrowDown" || event.key === "ArrowUp") {
-            event.preventDefault();
-            setAnchorEl(event.currentTarget);
-            if (event.key === "ArrowUp") {
-                (_a = menuActions.current) === null || _a === void 0 ? void 0 : _a.highlightLastItem();
-            }
-        }
-    };
-    var close = (0, utils_1.unstable_useEventCallback)(function () {
-        var _a;
-        setAnchorEl(null);
-        (_a = buttonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-    });
-    var renderChildren = (0, react_1.useMemo)(function () {
-        var childrenProps = { close: close };
-        return children(childrenProps);
-    }, [children, close]);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Button, { ref: buttonRef, id: id, "aria-haspopup": "true", "aria-controls": open ? id : undefined, "aria-expanded": open ? "true" : undefined, onClick: handleButtonClick, onKeyDown: handleButtonKeyDown }), (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: open && ((0, jsx_runtime_1.jsx)(ModalUnstyled_1.default, tslib_1.__assign({ slots: { backdrop: MenuBackdrop }, onClose: close, onBackdropClick: close, open: open }, { children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ClickAwayListener_1.default, tslib_1.__assign({ onClickAway: close }, { children: (0, jsx_runtime_1.jsx)(MenuRoot, tslib_1.__assign({ initial: {
-                                    opacity: 0,
-                                }, animate: {
-                                    opacity: 1,
-                                }, exit: {
-                                    opacity: 0,
-                                }, className: (0, clsx_1.default)(className), style: styles["popper"] }, htmlAttributes, getListboxProps(), { "aria-labelledby": id }, { children: (0, jsx_runtime_1.jsx)(MenuUnstyled_1.MenuUnstyledContext.Provider, tslib_1.__assign({ value: contextValue }, { children: renderChildren })) })) })) }) }))) })] }));
-});
-exports.default = exports.Menu;
+// import React, { forwardRef, useId, useMemo, useRef, useState } from "react";
+// import { unstable_useEventCallback as useEventCallback } from "@mui/utils";
+// import {
+//   motion as m,
+//   AnimatePresence,
+//   type HTMLMotionProps,
+// } from "framer-motion";
+// import {
+//   useMenu,
+//   MenuUnstyledContext,
+//   type MenuUnstyledContextType,
+//   type MenuUnstyledActions,
+// } from "@mui/base/MenuUnstyled";
+// import ModalUnstyled from "@mui/base/ModalUnstyled";
+// import ClickAwayListener from "@mui/base/ClickAwayListener";
+// import { usePopper, type PopperChildrenProps } from "react-popper";
+// import clsx from "@koine/utils/clsx";
+// const MenuRoot = m.div;
+// const MenuBackdrop = () => <div className="fixed inset-0" />;
+// /**
+//  * Props we control, cannot be overriden from implementers
+//  */
+// type MenuButtonOwnProps = {
+//   "aria-controls"?: string;
+//   "aria-haspopup": true | "true";
+//   "aria-expanded"?: true | "true";
+//   onClick: (event: React.MouseEvent<HTMLButtonElement>) => unknown;
+//   onKeyDown: (event: React.KeyboardEvent<HTMLButtonElement>) => unknown;
+// };
+// type MenuButtonProps = Omit<
+//   React.ComponentPropsWithRef<"button">,
+//   keyof MenuButtonOwnProps
+// > &
+//   MenuButtonOwnProps;
+// export type MenuItemsProps = {
+//   /**
+//    * Closes the parent menu
+//    */
+//   close: () => unknown;
+// };
+// /**
+//  * Props we control, cannot be overriden from implementers
+//  */
+// type MenuOwnProps = ReturnType<typeof useMenu>["getListboxProps"] & {
+//   onKeyDown: (event: React.KeyboardEvent) => unknown;
+//   style: React.StyleHTMLAttributes<HTMLDivElement>;
+// };
+// export type MenuProps = Omit<
+//   Omit<HTMLMotionProps<"div">, "children"> & {
+//     placement?: PopperChildrenProps["placement"];
+//     Button: (props: MenuButtonProps) => JSX.Element;
+//     children: (props: MenuItemsProps) => React.ReactNode;
+//   },
+//   keyof MenuOwnProps
+// >;
+// export const Menu = forwardRef(function Menu(props: MenuProps, ref) {
+//   const { Button, placement, children, className, ...htmlAttributes } = props;
+//   const id = useId();
+//   const buttonRef = useRef<HTMLButtonElement>(null);
+//   const menuActions = useRef<MenuUnstyledActions>(null);
+//   const [popperElement, setPopperElement] = useState(null);
+//   const [anchorEl, setAnchorEl] = useState<HTMLButtonElement | null>(null);
+//   const open = Boolean(anchorEl);
+//   const { styles } = usePopper(anchorEl, popperElement, {
+//     placement,
+//     // strategy: "absolute",
+//   });
+//   const {
+//     registerItem,
+//     unregisterItem,
+//     getListboxProps,
+//     getItemProps,
+//     getItemState,
+//   } = useMenu({
+//     listboxId: id,
+//     listboxRef: setPopperElement,
+//     // these two make the Tab key behaviour correct, closing the menu on Tab
+//     // press and re-focusing the Button trigger element
+//     open,
+//     onClose: () => setAnchorEl(null),
+//   });
+//   const contextValue: MenuUnstyledContextType = {
+//     registerItem,
+//     unregisterItem,
+//     getItemState,
+//     getItemProps,
+//     open,
+//   };
+//   const handleButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {
+//     if (open) {
+//       setAnchorEl(null);
+//     } else {
+//       setAnchorEl(event.currentTarget);
+//     }
+//   };
+//   const handleButtonKeyDown = (
+//     event: React.KeyboardEvent<HTMLButtonElement>
+//   ) => {
+//     if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+//       event.preventDefault();
+//       setAnchorEl(event.currentTarget);
+//       if (event.key === "ArrowUp") {
+//         menuActions.current?.highlightLastItem();
+//       }
+//     }
+//   };
+//   const close = useEventCallback(() => {
+//     setAnchorEl(null);
+//     buttonRef.current?.focus();
+//   });
+//   const renderChildren = useMemo(() => {
+//     const childrenProps: MenuItemsProps = { close };
+//     return children(childrenProps);
+//   }, [children, close]);
+//   return (
+//     <>
+//       <Button
+//         ref={buttonRef}
+//         id={id}
+//         aria-haspopup="true"
+//         aria-controls={open ? id : undefined}
+//         aria-expanded={open ? "true" : undefined}
+//         onClick={handleButtonClick}
+//         onKeyDown={handleButtonKeyDown}
+//       />
+//       <AnimatePresence>
+//         {open && (
+//           <ModalUnstyled
+//             slots={{ backdrop: MenuBackdrop }}
+//             onClose={close}
+//             onBackdropClick={close}
+//             open={open}
+//           >
+//             <div>
+//               <ClickAwayListener onClickAway={close}>
+//                 <MenuRoot
+//                   initial={{
+//                     opacity: 0,
+//                   }}
+//                   animate={{
+//                     opacity: 1,
+//                   }}
+//                   exit={{
+//                     opacity: 0,
+//                   }}
+//                   className={clsx(className)}
+//                   style={styles["popper"]}
+//                   {...htmlAttributes}
+//                   {...getListboxProps()}
+//                   aria-labelledby={id}
+//                 >
+//                   <MenuUnstyledContext.Provider value={contextValue}>
+//                     {renderChildren}
+//                   </MenuUnstyledContext.Provider>
+//                 </MenuRoot>
+//               </ClickAwayListener>
+//             </div>
+//           </ModalUnstyled>
+//         )}
+//       </AnimatePresence>
+//     </>
+//   );
+// });
+// export default Menu;

package/Menu/MenuMui.mjs

@@ -1,75 +1,165 @@
-import { __assign, __rest } from "tslib";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useId, useMemo, useRef, useState } from "react";
-import { unstable_useEventCallback as useEventCallback } from "@mui/utils";
-import { motion as m, AnimatePresence, } from "framer-motion";
-import { useMenu, MenuUnstyledContext, } from "@mui/base/MenuUnstyled";
-import ModalUnstyled from "@mui/base/ModalUnstyled";
-import ClickAwayListener from "@mui/base/ClickAwayListener";
-import { usePopper } from "react-popper";
-import clsx from "@koine/utils/clsx";
-var MenuRoot = m.div;
-var MenuBackdrop = function () { return _jsx("div", { className: "fixed inset-0" }); };
-export var Menu = forwardRef(function Menu(props, ref) {
-    var Button = props.Button, placement = props.placement, children = props.children, className = props.className, htmlAttributes = __rest(props, ["Button", "placement", "children", "className"]);
-    var id = useId();
-    var buttonRef = useRef(null);
-    var menuActions = useRef(null);
-    var _a = useState(null), popperElement = _a[0], setPopperElement = _a[1];
-    var _b = useState(null), anchorEl = _b[0], setAnchorEl = _b[1];
-    var open = Boolean(anchorEl);
-    var styles = usePopper(anchorEl, popperElement, {
-        placement: placement,
-        // strategy: "absolute",
-    }).styles;
-    var _c = useMenu({
-        listboxId: id,
-        listboxRef: setPopperElement,
-        // these two make the Tab key behaviour correct, closing the menu on Tab
-        // press and re-focusing the Button trigger element
-        open: open,
-        onClose: function () { return setAnchorEl(null); },
-    }), registerItem = _c.registerItem, unregisterItem = _c.unregisterItem, getListboxProps = _c.getListboxProps, getItemProps = _c.getItemProps, getItemState = _c.getItemState;
-    var contextValue = {
-        registerItem: registerItem,
-        unregisterItem: unregisterItem,
-        getItemState: getItemState,
-        getItemProps: getItemProps,
-        open: open,
-    };
-    var handleButtonClick = function (event) {
-        if (open) {
-            setAnchorEl(null);
-        }
-        else {
-            setAnchorEl(event.currentTarget);
-        }
-    };
-    var handleButtonKeyDown = function (event) {
-        var _a;
-        if (event.key === "ArrowDown" || event.key === "ArrowUp") {
-            event.preventDefault();
-            setAnchorEl(event.currentTarget);
-            if (event.key === "ArrowUp") {
-                (_a = menuActions.current) === null || _a === void 0 ? void 0 : _a.highlightLastItem();
-            }
-        }
-    };
-    var close = useEventCallback(function () {
-        var _a;
-        setAnchorEl(null);
-        (_a = buttonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-    });
-    var renderChildren = useMemo(function () {
-        var childrenProps = { close: close };
-        return children(childrenProps);
-    }, [children, close]);
-    return (_jsxs(_Fragment, { children: [_jsx(Button, { ref: buttonRef, id: id, "aria-haspopup": "true", "aria-controls": open ? id : undefined, "aria-expanded": open ? "true" : undefined, onClick: handleButtonClick, onKeyDown: handleButtonKeyDown }), _jsx(AnimatePresence, { children: open && (_jsx(ModalUnstyled, __assign({ slots: { backdrop: MenuBackdrop }, onClose: close, onBackdropClick: close, open: open }, { children: _jsx("div", { children: _jsx(ClickAwayListener, __assign({ onClickAway: close }, { children: _jsx(MenuRoot, __assign({ initial: {
-                                    opacity: 0,
-                                }, animate: {
-                                    opacity: 1,
-                                }, exit: {
-                                    opacity: 0,
-                                }, className: clsx(className), style: styles["popper"] }, htmlAttributes, getListboxProps(), { "aria-labelledby": id }, { children: _jsx(MenuUnstyledContext.Provider, __assign({ value: contextValue }, { children: renderChildren })) })) })) }) }))) })] }));
-});
-export default Menu;
+"use strict";
+// import React, { forwardRef, useId, useMemo, useRef, useState } from "react";
+// import { unstable_useEventCallback as useEventCallback } from "@mui/utils";
+// import {
+//   motion as m,
+//   AnimatePresence,
+//   type HTMLMotionProps,
+// } from "framer-motion";
+// import {
+//   useMenu,
+//   MenuUnstyledContext,
+//   type MenuUnstyledContextType,
+//   type MenuUnstyledActions,
+// } from "@mui/base/MenuUnstyled";
+// import ModalUnstyled from "@mui/base/ModalUnstyled";
+// import ClickAwayListener from "@mui/base/ClickAwayListener";
+// import { usePopper, type PopperChildrenProps } from "react-popper";
+// import clsx from "@koine/utils/clsx";
+// const MenuRoot = m.div;
+// const MenuBackdrop = () => <div className="fixed inset-0" />;
+// /**
+//  * Props we control, cannot be overriden from implementers
+//  */
+// type MenuButtonOwnProps = {
+//   "aria-controls"?: string;
+//   "aria-haspopup": true | "true";
+//   "aria-expanded"?: true | "true";
+//   onClick: (event: React.MouseEvent<HTMLButtonElement>) => unknown;
+//   onKeyDown: (event: React.KeyboardEvent<HTMLButtonElement>) => unknown;
+// };
+// type MenuButtonProps = Omit<
+//   React.ComponentPropsWithRef<"button">,
+//   keyof MenuButtonOwnProps
+// > &
+//   MenuButtonOwnProps;
+// export type MenuItemsProps = {
+//   /**
+//    * Closes the parent menu
+//    */
+//   close: () => unknown;
+// };
+// /**
+//  * Props we control, cannot be overriden from implementers
+//  */
+// type MenuOwnProps = ReturnType<typeof useMenu>["getListboxProps"] & {
+//   onKeyDown: (event: React.KeyboardEvent) => unknown;
+//   style: React.StyleHTMLAttributes<HTMLDivElement>;
+// };
+// export type MenuProps = Omit<
+//   Omit<HTMLMotionProps<"div">, "children"> & {
+//     placement?: PopperChildrenProps["placement"];
+//     Button: (props: MenuButtonProps) => JSX.Element;
+//     children: (props: MenuItemsProps) => React.ReactNode;
+//   },
+//   keyof MenuOwnProps
+// >;
+// export const Menu = forwardRef(function Menu(props: MenuProps, ref) {
+//   const { Button, placement, children, className, ...htmlAttributes } = props;
+//   const id = useId();
+//   const buttonRef = useRef<HTMLButtonElement>(null);
+//   const menuActions = useRef<MenuUnstyledActions>(null);
+//   const [popperElement, setPopperElement] = useState(null);
+//   const [anchorEl, setAnchorEl] = useState<HTMLButtonElement | null>(null);
+//   const open = Boolean(anchorEl);
+//   const { styles } = usePopper(anchorEl, popperElement, {
+//     placement,
+//     // strategy: "absolute",
+//   });
+//   const {
+//     registerItem,
+//     unregisterItem,
+//     getListboxProps,
+//     getItemProps,
+//     getItemState,
+//   } = useMenu({
+//     listboxId: id,
+//     listboxRef: setPopperElement,
+//     // these two make the Tab key behaviour correct, closing the menu on Tab
+//     // press and re-focusing the Button trigger element
+//     open,
+//     onClose: () => setAnchorEl(null),
+//   });
+//   const contextValue: MenuUnstyledContextType = {
+//     registerItem,
+//     unregisterItem,
+//     getItemState,
+//     getItemProps,
+//     open,
+//   };
+//   const handleButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {
+//     if (open) {
+//       setAnchorEl(null);
+//     } else {
+//       setAnchorEl(event.currentTarget);
+//     }
+//   };
+//   const handleButtonKeyDown = (
+//     event: React.KeyboardEvent<HTMLButtonElement>
+//   ) => {
+//     if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+//       event.preventDefault();
+//       setAnchorEl(event.currentTarget);
+//       if (event.key === "ArrowUp") {
+//         menuActions.current?.highlightLastItem();
+//       }
+//     }
+//   };
+//   const close = useEventCallback(() => {
+//     setAnchorEl(null);
+//     buttonRef.current?.focus();
+//   });
+//   const renderChildren = useMemo(() => {
+//     const childrenProps: MenuItemsProps = { close };
+//     return children(childrenProps);
+//   }, [children, close]);
+//   return (
+//     <>
+//       <Button
+//         ref={buttonRef}
+//         id={id}
+//         aria-haspopup="true"
+//         aria-controls={open ? id : undefined}
+//         aria-expanded={open ? "true" : undefined}
+//         onClick={handleButtonClick}
+//         onKeyDown={handleButtonKeyDown}
+//       />
+//       <AnimatePresence>
+//         {open && (
+//           <ModalUnstyled
+//             slots={{ backdrop: MenuBackdrop }}
+//             onClose={close}
+//             onBackdropClick={close}
+//             open={open}
+//           >
+//             <div>
+//               <ClickAwayListener onClickAway={close}>
+//                 <MenuRoot
+//                   initial={{
+//                     opacity: 0,
+//                   }}
+//                   animate={{
+//                     opacity: 1,
+//                   }}
+//                   exit={{
+//                     opacity: 0,
+//                   }}
+//                   className={clsx(className)}
+//                   style={styles["popper"]}
+//                   {...htmlAttributes}
+//                   {...getListboxProps()}
+//                   aria-labelledby={id}
+//                 >
+//                   <MenuUnstyledContext.Provider value={contextValue}>
+//                     {renderChildren}
+//                   </MenuUnstyledContext.Provider>
+//                 </MenuRoot>
+//               </ClickAwayListener>
+//             </div>
+//           </ModalUnstyled>
+//         )}
+//       </AnimatePresence>
+//     </>
+//   );
+// });
+// export default Menu;

package/MenuItem/MenuItemMui.d.ts

@@ -1,6 +0,0 @@
-import React from "react";
-import { type MenuItemsProps } from "../Menu/MenuMui";
-import { Polymorphic } from "../typings";
-export type MenuItemProps = React.PropsWithChildren<Partial<MenuItemsProps>>;
-export declare const MenuItem: Polymorphic.ComponentForwarded<"button", MenuItemProps>;
-export default MenuItem;

package/MenuItem/MenuItemMui.js

@@ -1,18 +1,32 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MenuItem = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var MenuItemUnstyled_1 = require("@mui/base/MenuItemUnstyled");
-// import { useMenuItem } from "./useMenuItem";
-var clsx_1 = tslib_1.__importDefault(require("@koine/utils/clsx"));
-exports.MenuItem = (0, react_1.forwardRef)(function MenuItem(props, ref) {
-    var _a = props.as, As = _a === void 0 ? "button" : _a, children = props.children, className = props.className, disabledProp = props.disabled, other = tslib_1.__rest(props, ["as", "children", "className", "disabled"]);
-    var _b = (0, MenuItemUnstyled_1.useMenuItem)({
-        ref: ref,
-        disabled: disabledProp,
-    }), getRootProps = _b.getRootProps, disabled = _b.disabled, focusVisible = _b.focusVisible;
-    return ((0, jsx_runtime_1.jsx)(As, tslib_1.__assign({ className: (0, clsx_1.default)(focusVisible && "", disabled && "", className) }, getRootProps(other), { children: children })));
-});
-exports.default = exports.MenuItem;
+// import React, { forwardRef } from "react";
+// import { useMenuItem } from "@mui/base/MenuItemUnstyled";
+// // import { useMenuItem } from "./useMenuItem";
+// import clsx from "@koine/utils/clsx";
+// import { type MenuItemsProps } from "../Menu/MenuMui";
+// import { Polymorphic } from "../typings";
+// export type MenuItemProps = React.PropsWithChildren<Partial<MenuItemsProps>>;
+// export const MenuItem = forwardRef(function MenuItem<
+//   T extends React.ElementType = "button"
+// >(props: Polymorphic.Props<T, MenuItemProps>, ref: Polymorphic.Ref<T>) {
+//   const {
+//     as: As = "button",
+//     children,
+//     className,
+//     disabled: disabledProp,
+//     ...other
+//   } = props;
+//   const { getRootProps, disabled, focusVisible } = useMenuItem({
+//     ref,
+//     disabled: disabledProp,
+//   });
+//   return (
+//     <As
+//       className={clsx(focusVisible && "", disabled && "", className)}
+//       {...getRootProps(other)}
+//     >
+//       {children}
+//     </As>
+//   );
+// }) as Polymorphic.ComponentForwarded<"button", MenuItemProps>;
+// export default MenuItem;

package/MenuItem/MenuItemMui.mjs

@@ -1,15 +1,32 @@
-import { __assign, __rest } from "tslib";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { useMenuItem } from "@mui/base/MenuItemUnstyled";
-// import { useMenuItem } from "./useMenuItem";
-import clsx from "@koine/utils/clsx";
-export var MenuItem = forwardRef(function MenuItem(props, ref) {
-    var _a = props.as, As = _a === void 0 ? "button" : _a, children = props.children, className = props.className, disabledProp = props.disabled, other = __rest(props, ["as", "children", "className", "disabled"]);
-    var _b = useMenuItem({
-        ref: ref,
-        disabled: disabledProp,
-    }), getRootProps = _b.getRootProps, disabled = _b.disabled, focusVisible = _b.focusVisible;
-    return (_jsx(As, __assign({ className: clsx(focusVisible && "", disabled && "", className) }, getRootProps(other), { children: children })));
-});
-export default MenuItem;
+"use strict";
+// import React, { forwardRef } from "react";
+// import { useMenuItem } from "@mui/base/MenuItemUnstyled";
+// // import { useMenuItem } from "./useMenuItem";
+// import clsx from "@koine/utils/clsx";
+// import { type MenuItemsProps } from "../Menu/MenuMui";
+// import { Polymorphic } from "../typings";
+// export type MenuItemProps = React.PropsWithChildren<Partial<MenuItemsProps>>;
+// export const MenuItem = forwardRef(function MenuItem<
+//   T extends React.ElementType = "button"
+// >(props: Polymorphic.Props<T, MenuItemProps>, ref: Polymorphic.Ref<T>) {
+//   const {
+//     as: As = "button",
+//     children,
+//     className,
+//     disabled: disabledProp,
+//     ...other
+//   } = props;
+//   const { getRootProps, disabled, focusVisible } = useMenuItem({
+//     ref,
+//     disabled: disabledProp,
+//   });
+//   return (
+//     <As
+//       className={clsx(focusVisible && "", disabled && "", className)}
+//       {...getRootProps(other)}
+//     >
+//       {children}
+//     </As>
+//   );
+// }) as Polymorphic.ComponentForwarded<"button", MenuItemProps>;
+// export default MenuItem;