moduix 0.11.0 → 0.11.2

package/dist/components/Menu/Menu.d.ts

@@ -1,44 +1,144 @@
-import { ComponentProps } from 'react';
-import { Menu as MenuPrimitive } from '@base-ui/react/menu';
-export type MenuPositionerProps = Pick<MenuPrimitive.Positioner.Props, 'side' | 'sideOffset' | 'align' | 'alignOffset' | 'arrowPadding' | 'collisionAvoidance' | 'collisionBoundary' | 'collisionPadding'>;
-export type MenuIndicatorPosition = 'start' | 'end';
-export type MenuContentProps = MenuPrimitive.Popup.Props & MenuPositionerProps & {
-    showArrow?: boolean;
+import { ComponentProps } from "react";
+import { Menu } from "@base-ui/react/menu";
+
+//#region src/components/Menu/Menu.d.ts
+type MenuPositionerProps = Pick<Menu.Positioner.Props, 'side' | 'sideOffset' | 'align' | 'alignOffset' | 'arrowPadding' | 'collisionAvoidance' | 'collisionBoundary' | 'collisionPadding'>;
+type MenuIndicatorPosition = 'start' | 'end';
+type MenuContentProps = Menu.Popup.Props & MenuPositionerProps & {
+  showArrow?: boolean;
 };
-export type MenuRadioItemProps = MenuPrimitive.RadioItem.Props & {
-    indicator?: MenuIndicatorPosition;
+type MenuRadioItemProps = Menu.RadioItem.Props & {
+  indicator?: MenuIndicatorPosition;
 };
-export type MenuCheckboxItemProps = MenuPrimitive.CheckboxItem.Props & {
-    indicator?: MenuIndicatorPosition;
+type MenuCheckboxItemProps = Menu.CheckboxItem.Props & {
+  indicator?: MenuIndicatorPosition;
 };
-declare const Menu: <Payload>(props: MenuPrimitive.Root.Props<Payload>) => import("react").JSX.Element;
-declare const MenuSubmenu: typeof MenuPrimitive.SubmenuRoot;
-declare const createMenuHandle: typeof MenuPrimitive.createHandle;
-declare function MenuTrigger({ className, render, ...props }: MenuPrimitive.Trigger.Props): import("react").JSX.Element;
-declare function MenuTriggerIcon({ className, children, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
-declare function MenuPortal(props: MenuPrimitive.Portal.Props): import("react").JSX.Element;
-declare function MenuBackdrop({ className, ...props }: MenuPrimitive.Backdrop.Props): import("react").JSX.Element;
-declare function MenuPositioner({ className, ...props }: MenuPrimitive.Positioner.Props): import("react").JSX.Element;
-declare function MenuPopup({ className, ...props }: MenuPrimitive.Popup.Props): import("react").JSX.Element;
-declare function MenuArrow({ className, children, ...props }: MenuPrimitive.Arrow.Props): import("react").JSX.Element;
-declare function MenuViewport({ className, ...props }: MenuPrimitive.Viewport.Props): import("react").JSX.Element;
-declare function MenuContent({ className, children, showArrow, side, sideOffset, align, alignOffset, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, ...props }: MenuContentProps): import("react").JSX.Element;
-declare function MenuSubmenuContent({ sideOffset, alignOffset, ...props }: MenuContentProps): import("react").JSX.Element;
-declare function MenuItem({ className, ...props }: MenuPrimitive.Item.Props): import("react").JSX.Element;
-declare function MenuLinkItem({ className, ...props }: MenuPrimitive.LinkItem.Props): import("react").JSX.Element;
-declare function MenuSeparator({ className, ...props }: MenuPrimitive.Separator.Props): import("react").JSX.Element;
-declare function MenuGroup({ className, ...props }: MenuPrimitive.Group.Props): import("react").JSX.Element;
-declare function MenuGroupLabel({ className, ...props }: MenuPrimitive.GroupLabel.Props): import("react").JSX.Element;
-declare function MenuSubmenuTrigger({ className, ...props }: MenuPrimitive.SubmenuTrigger.Props): import("react").JSX.Element;
-declare function MenuSubmenuTriggerIcon({ className, children, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
-declare function MenuRadioGroup({ className, ...props }: MenuPrimitive.RadioGroup.Props): import("react").JSX.Element;
-declare function MenuRadioItem({ className, indicator, ...props }: MenuRadioItemProps): import("react").JSX.Element;
-declare function MenuRadioItemIndicator({ className, children, ...props }: MenuPrimitive.RadioItemIndicator.Props): import("react").JSX.Element;
-declare function MenuCheckboxItem({ className, indicator, ...props }: MenuCheckboxItemProps): import("react").JSX.Element;
-declare function MenuCheckboxItemIndicator({ className, children, ...props }: MenuPrimitive.CheckboxItemIndicator.Props): import("react").JSX.Element;
-declare function MenuItemText({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
-declare function MenuItemTextContent({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
-declare function MenuItemTextIcon({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
-declare function MenuItemTextLabel({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
-declare function MenuItemShortcut({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
-export { Menu, MenuSubmenu, createMenuHandle, MenuTrigger, MenuTriggerIcon, MenuPortal, MenuBackdrop, MenuPositioner, MenuPopup, MenuArrow, MenuViewport, MenuContent, MenuSubmenuContent, MenuItem, MenuLinkItem, MenuSeparator, MenuGroup, MenuGroupLabel, MenuSubmenuTrigger, MenuSubmenuTriggerIcon, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuItemText, MenuItemTextContent, MenuItemTextIcon, MenuItemTextLabel, MenuItemShortcut, };
+declare const Menu$1: <Payload>(props: Menu.Root.Props<Payload>) => import("react").JSX.Element;
+declare const MenuSubmenu: typeof Menu.SubmenuRoot;
+declare const createMenuHandle: typeof Menu.createHandle;
+declare function MenuTrigger({
+  className,
+  render,
+  ...props
+}: Menu.Trigger.Props): import("react").JSX.Element;
+declare function MenuTriggerIcon({
+  className,
+  children,
+  ...props
+}: ComponentProps<'span'>): import("react").JSX.Element;
+declare function MenuPortal(props: Menu.Portal.Props): import("react").JSX.Element;
+declare function MenuBackdrop({
+  className,
+  ...props
+}: Menu.Backdrop.Props): import("react").JSX.Element;
+declare function MenuPositioner({
+  className,
+  ...props
+}: Menu.Positioner.Props): import("react").JSX.Element;
+declare function MenuPopup({
+  className,
+  ...props
+}: Menu.Popup.Props): import("react").JSX.Element;
+declare function MenuArrow({
+  className,
+  children,
+  ...props
+}: Menu.Arrow.Props): import("react").JSX.Element;
+declare function MenuViewport({
+  className,
+  ...props
+}: Menu.Viewport.Props): import("react").JSX.Element;
+declare function MenuContent({
+  className,
+  children,
+  showArrow,
+  side,
+  sideOffset,
+  align,
+  alignOffset,
+  arrowPadding,
+  collisionAvoidance,
+  collisionBoundary,
+  collisionPadding,
+  ...props
+}: MenuContentProps): import("react").JSX.Element;
+declare function MenuSubmenuContent({
+  sideOffset,
+  alignOffset,
+  ...props
+}: MenuContentProps): import("react").JSX.Element;
+declare function MenuItem({
+  className,
+  ...props
+}: Menu.Item.Props): import("react").JSX.Element;
+declare function MenuLinkItem({
+  className,
+  ...props
+}: Menu.LinkItem.Props): import("react").JSX.Element;
+declare function MenuSeparator({
+  className,
+  ...props
+}: Menu.Separator.Props): import("react").JSX.Element;
+declare function MenuGroup({
+  className,
+  ...props
+}: Menu.Group.Props): import("react").JSX.Element;
+declare function MenuGroupLabel({
+  className,
+  ...props
+}: Menu.GroupLabel.Props): import("react").JSX.Element;
+declare function MenuSubmenuTrigger({
+  className,
+  ...props
+}: Menu.SubmenuTrigger.Props): import("react").JSX.Element;
+declare function MenuSubmenuTriggerIcon({
+  className,
+  children,
+  ...props
+}: ComponentProps<'span'>): import("react").JSX.Element;
+declare function MenuRadioGroup({
+  className,
+  ...props
+}: Menu.RadioGroup.Props): import("react").JSX.Element;
+declare function MenuRadioItem({
+  className,
+  indicator,
+  ...props
+}: MenuRadioItemProps): import("react").JSX.Element;
+declare function MenuRadioItemIndicator({
+  className,
+  children,
+  ...props
+}: Menu.RadioItemIndicator.Props): import("react").JSX.Element;
+declare function MenuCheckboxItem({
+  className,
+  indicator,
+  ...props
+}: MenuCheckboxItemProps): import("react").JSX.Element;
+declare function MenuCheckboxItemIndicator({
+  className,
+  children,
+  ...props
+}: Menu.CheckboxItemIndicator.Props): import("react").JSX.Element;
+declare function MenuItemText({
+  className,
+  ...props
+}: ComponentProps<'span'>): import("react").JSX.Element;
+declare function MenuItemTextContent({
+  className,
+  ...props
+}: ComponentProps<'span'>): import("react").JSX.Element;
+declare function MenuItemTextIcon({
+  className,
+  ...props
+}: ComponentProps<'span'>): import("react").JSX.Element;
+declare function MenuItemTextLabel({
+  className,
+  ...props
+}: ComponentProps<'span'>): import("react").JSX.Element;
+declare function MenuItemShortcut({
+  className,
+  ...props
+}: ComponentProps<'span'>): import("react").JSX.Element;
+//#endregion
+export { Menu$1 as Menu, MenuArrow, MenuBackdrop, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuCheckboxItemProps, MenuContent, MenuContentProps, MenuGroup, MenuGroupLabel, MenuIndicatorPosition, MenuItem, MenuItemShortcut, MenuItemText, MenuItemTextContent, MenuItemTextIcon, MenuItemTextLabel, MenuLinkItem, MenuPopup, MenuPortal, MenuPositioner, MenuPositionerProps, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuRadioItemProps, MenuSeparator, MenuSubmenu, MenuSubmenuContent, MenuSubmenuTrigger, MenuSubmenuTriggerIcon, MenuTrigger, MenuTriggerIcon, MenuViewport, createMenuHandle };

package/dist/components/Menu/Menu.js

@@ -0,0 +1,231 @@
+import { CheckIcon, ChevronDownIcon, ChevronRightIcon, PopupArrowIcon } from "../../icons/ui/Icons.js";
+import { mergeClassName } from "../../utils/mergeClassName.js";
+import Menu_module_default from "./Menu.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { Menu } from "@base-ui/react/menu";
+//#region src/components/Menu/Menu.tsx
+const MENU_CONTENT_SIDE_OFFSET = 8;
+const Menu$1 = Menu.Root;
+const MenuSubmenu = Menu.SubmenuRoot;
+const createMenuHandle = Menu.createHandle;
+function MenuTrigger({ className, render, ...props }) {
+	const triggerClassName = render ? className : mergeClassName(className, Menu_module_default.trigger);
+	return /* @__PURE__ */ jsx(Menu.Trigger, {
+		"data-slot": "menu-trigger",
+		render,
+		className: triggerClassName,
+		...props
+	});
+}
+function MenuTriggerIcon({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "menu-trigger-icon",
+		className: clsx(Menu_module_default.triggerIcon, className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(ChevronDownIcon, { className: Menu_module_default.iconSvg })
+	});
+}
+function MenuPortal(props) {
+	return /* @__PURE__ */ jsx(Menu.Portal, {
+		"data-slot": "menu-portal",
+		...props
+	});
+}
+function MenuBackdrop({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Backdrop, {
+		"data-slot": "menu-backdrop",
+		className: mergeClassName(className, Menu_module_default.backdrop),
+		...props
+	});
+}
+function MenuPositioner({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Positioner, {
+		"data-slot": "menu-positioner",
+		className: mergeClassName(className, Menu_module_default.positioner),
+		...props
+	});
+}
+function MenuPopup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Popup, {
+		"data-slot": "menu-popup",
+		className: mergeClassName(className, Menu_module_default.popup),
+		...props
+	});
+}
+function MenuArrow({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Arrow, {
+		"data-slot": "menu-arrow",
+		className: mergeClassName(className, Menu_module_default.arrow),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(ArrowSvg, { className: Menu_module_default.arrowSvg })
+	});
+}
+function MenuViewport({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Viewport, {
+		"data-slot": "menu-viewport",
+		className: mergeClassName(className, Menu_module_default.viewport),
+		...props
+	});
+}
+function MenuContent({ className, children, showArrow = false, side, sideOffset = MENU_CONTENT_SIDE_OFFSET, align, alignOffset, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, ...props }) {
+	return /* @__PURE__ */ jsx(MenuPortal, { children: /* @__PURE__ */ jsx(MenuPositioner, {
+		side,
+		sideOffset,
+		align,
+		alignOffset,
+		arrowPadding,
+		collisionAvoidance,
+		collisionBoundary,
+		collisionPadding,
+		children: /* @__PURE__ */ jsxs(MenuPopup, {
+			className,
+			...props,
+			children: [showArrow ? /* @__PURE__ */ jsx(MenuArrow, {}) : null, children]
+		})
+	}) });
+}
+function MenuSubmenuContent({ sideOffset = getSubmenuOffset, alignOffset = getSubmenuOffset, ...props }) {
+	return /* @__PURE__ */ jsx(MenuContent, {
+		sideOffset,
+		alignOffset,
+		...props
+	});
+}
+function MenuItem({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Item, {
+		"data-slot": "menu-item",
+		className: mergeClassName(className, Menu_module_default.item),
+		...props
+	});
+}
+function MenuLinkItem({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.LinkItem, {
+		"data-slot": "menu-link-item",
+		className: mergeClassName(className, Menu_module_default.linkItem),
+		...props
+	});
+}
+function MenuSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Separator, {
+		"data-slot": "menu-separator",
+		className: mergeClassName(className, Menu_module_default.separator),
+		...props
+	});
+}
+function MenuGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Group, {
+		"data-slot": "menu-group",
+		className: mergeClassName(className, Menu_module_default.group),
+		...props
+	});
+}
+function MenuGroupLabel({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.GroupLabel, {
+		"data-slot": "menu-group-label",
+		className: mergeClassName(className, Menu_module_default.groupLabel),
+		...props
+	});
+}
+function MenuSubmenuTrigger({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.SubmenuTrigger, {
+		"data-slot": "menu-submenu-trigger",
+		className: mergeClassName(className, Menu_module_default.submenuTrigger),
+		...props
+	});
+}
+function MenuSubmenuTriggerIcon({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "menu-submenu-trigger-icon",
+		className: clsx(Menu_module_default.submenuTriggerIcon, className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(ChevronRightIcon, { className: Menu_module_default.iconSvg })
+	});
+}
+function MenuRadioGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.RadioGroup, {
+		"data-slot": "menu-radio-group",
+		className: mergeClassName(className, Menu_module_default.radioGroup),
+		...props
+	});
+}
+function MenuRadioItem({ className, indicator, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.RadioItem, {
+		"data-slot": "menu-radio-item",
+		"data-indicator-position": indicator,
+		className: mergeClassName(className, Menu_module_default.radioItem),
+		...props
+	});
+}
+function MenuRadioItemIndicator({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.RadioItemIndicator, {
+		"data-slot": "menu-radio-item-indicator",
+		className: mergeClassName(className, Menu_module_default.radioItemIndicator),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(CheckIcon, { className: Menu_module_default.itemIndicatorIcon })
+	});
+}
+function MenuCheckboxItem({ className, indicator, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.CheckboxItem, {
+		"data-slot": "menu-checkbox-item",
+		"data-indicator-position": indicator,
+		className: mergeClassName(className, Menu_module_default.checkboxItem),
+		...props
+	});
+}
+function MenuCheckboxItemIndicator({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.CheckboxItemIndicator, {
+		"data-slot": "menu-checkbox-item-indicator",
+		className: mergeClassName(className, Menu_module_default.checkboxItemIndicator),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(CheckIcon, { className: Menu_module_default.itemIndicatorIcon })
+	});
+}
+function MenuItemText({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "menu-item-text",
+		className: clsx(Menu_module_default.itemText, className),
+		...props
+	});
+}
+function MenuItemTextContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "menu-item-text-content",
+		className: clsx(Menu_module_default.itemTextContent, className),
+		...props
+	});
+}
+function MenuItemTextIcon({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "menu-item-text-icon",
+		className: clsx(Menu_module_default.itemTextIcon, className),
+		...props
+	});
+}
+function MenuItemTextLabel({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "menu-item-text-label",
+		className: clsx(Menu_module_default.itemTextLabel, className),
+		...props
+	});
+}
+function MenuItemShortcut({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "menu-item-shortcut",
+		className: clsx(Menu_module_default.itemShortcut, className),
+		...props
+	});
+}
+function getSubmenuOffset({ side }) {
+	return side === "top" || side === "bottom" ? 4 : -4;
+}
+function ArrowSvg(props) {
+	return /* @__PURE__ */ jsx(PopupArrowIcon, {
+		fillClassName: Menu_module_default.arrowFill,
+		outerStrokeClassName: Menu_module_default.arrowOuterStroke,
+		innerStrokeClassName: Menu_module_default.arrowInnerStroke,
+		...props
+	});
+}
+//#endregion
+export { Menu$1 as Menu, MenuArrow, MenuBackdrop, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuContent, MenuGroup, MenuGroupLabel, MenuItem, MenuItemShortcut, MenuItemText, MenuItemTextContent, MenuItemTextIcon, MenuItemTextLabel, MenuLinkItem, MenuPopup, MenuPortal, MenuPositioner, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuSeparator, MenuSubmenu, MenuSubmenuContent, MenuSubmenuTrigger, MenuSubmenuTriggerIcon, MenuTrigger, MenuTriggerIcon, MenuViewport, createMenuHandle };

package/dist/components/Menu/Menu.module.js

@@ -0,0 +1,36 @@
+import './Menu.css';
+//#region src/components/Menu/Menu.module.css
+var Menu_module_default = {
+	"arrow": "kmkoza_arrow",
+	"arrowFill": "kmkoza_arrowFill",
+	"arrowInnerStroke": "kmkoza_arrowInnerStroke",
+	"arrowOuterStroke": "kmkoza_arrowOuterStroke",
+	"arrowSvg": "kmkoza_arrowSvg",
+	"backdrop": "kmkoza_backdrop",
+	"checkboxItem": "kmkoza_checkboxItem",
+	"checkboxItemIndicator": "kmkoza_checkboxItemIndicator",
+	"group": "kmkoza_group",
+	"groupLabel": "kmkoza_groupLabel",
+	"iconSvg": "kmkoza_iconSvg",
+	"item": "kmkoza_item",
+	"itemIndicatorIcon": "kmkoza_itemIndicatorIcon",
+	"itemShortcut": "kmkoza_itemShortcut",
+	"itemText": "kmkoza_itemText",
+	"itemTextContent": "kmkoza_itemTextContent",
+	"itemTextIcon": "kmkoza_itemTextIcon",
+	"itemTextLabel": "kmkoza_itemTextLabel",
+	"linkItem": "kmkoza_linkItem",
+	"popup": "kmkoza_popup",
+	"positioner": "kmkoza_positioner",
+	"radioGroup": "kmkoza_radioGroup",
+	"radioItem": "kmkoza_radioItem",
+	"radioItemIndicator": "kmkoza_radioItemIndicator",
+	"separator": "kmkoza_separator",
+	"submenuTrigger": "kmkoza_submenuTrigger",
+	"submenuTriggerIcon": "kmkoza_submenuTriggerIcon",
+	"trigger": "kmkoza_trigger",
+	"triggerIcon": "kmkoza_triggerIcon",
+	"viewport": "kmkoza_viewport"
+};
+//#endregion
+export { Menu_module_default as default };

package/dist/components/Menu/index.d.ts

@@ -1,2 +1 @@
-export { Menu, MenuSubmenu, createMenuHandle, MenuTrigger, MenuTriggerIcon, MenuPortal, MenuBackdrop, MenuPositioner, MenuPopup, MenuArrow, MenuViewport, MenuContent, MenuSubmenuContent, MenuItem, MenuLinkItem, MenuSeparator, MenuGroup, MenuGroupLabel, MenuSubmenuTrigger, MenuSubmenuTriggerIcon, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuItemText, MenuItemTextContent, MenuItemTextIcon, MenuItemTextLabel, MenuItemShortcut, } from './Menu';
-export type { MenuCheckboxItemProps, MenuContentProps, MenuIndicatorPosition, MenuPositionerProps, MenuRadioItemProps, } from './Menu';
+import { Menu, MenuArrow, MenuBackdrop, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuCheckboxItemProps, MenuContent, MenuContentProps, MenuGroup, MenuGroupLabel, MenuIndicatorPosition, MenuItem, MenuItemShortcut, MenuItemText, MenuItemTextContent, MenuItemTextIcon, MenuItemTextLabel, MenuLinkItem, MenuPopup, MenuPortal, MenuPositioner, MenuPositionerProps, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuRadioItemProps, MenuSeparator, MenuSubmenu, MenuSubmenuContent, MenuSubmenuTrigger, MenuSubmenuTriggerIcon, MenuTrigger, MenuTriggerIcon, MenuViewport, createMenuHandle } from "./Menu.js";