@comfyorg/design-system 1.1.0 → 1.3.0-alpha.0

package/dist/menu/Menu.vue.js

@@ -0,0 +1,77 @@
+import { t as MenuContent_default } from "../shared/MenuContent--tKCqaIO.js";
+import { t as MenuItems_default } from "../shared/MenuItems-BZTlERd6.js";
+import { createBlock, createCommentVNode, createSlots, createTextVNode, createVNode, defineComponent, guardReactiveProps, mergeModels, mergeProps, normalizeProps, openBlock, renderSlot, toDisplayString, unref, useModel, withCtx } from "vue";
+import { DropdownMenuLabel, DropdownMenuRoot, DropdownMenuTrigger } from "reka-ui";
+// src/components/menu/Menu.vue
+var Menu_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Menu",
+	props: /*@__PURE__*/ mergeModels({
+		items: { default: () => [] },
+		label: {},
+		modal: {
+			type: Boolean,
+			default: true
+		},
+		to: {},
+		align: { default: "start" },
+		collisionPadding: {},
+		side: {},
+		sideOffset: { default: 2 }
+	}, {
+		"open": {
+			type: Boolean,
+			default: false
+		},
+		"openModifiers": {}
+	}),
+	emits: /*@__PURE__*/ mergeModels(["activate"], ["update:open"]),
+	setup(__props, { emit: __emit }) {
+		const open = useModel(__props, "open");
+		const emit = __emit;
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(DropdownMenuRoot), {
+				open: open.value,
+				"onUpdate:open": _cache[2] || (_cache[2] = ($event) => open.value = $event),
+				modal: __props.modal
+			}, {
+				default: withCtx(() => [createVNode(unref(DropdownMenuTrigger), { "as-child": "" }, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "trigger", { open: open.value })]),
+					_: 3
+				}), createVNode(MenuContent_default, mergeProps({
+					to: __props.to,
+					align: __props.align,
+					"collision-padding": __props.collisionPadding,
+					side: __props.side,
+					"side-offset": __props.sideOffset
+				}, _ctx.$attrs, { class: _ctx.$attrs.class }), {
+					default: withCtx(() => [__props.label ? (openBlock(), createBlock(unref(DropdownMenuLabel), {
+						key: 0,
+						class: "px-3 py-1.5 text-xs font-semibold text-muted-foreground"
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(__props.label), 1)]),
+						_: 1
+					})) : createCommentVNode("", true), renderSlot(_ctx.$slots, "default", {}, () => [createVNode(MenuItems_default, {
+						items: __props.items,
+						onSelect: _cache[0] || (_cache[0] = ($event) => open.value = false),
+						onActivate: _cache[1] || (_cache[1] = ($event) => emit("activate", $event))
+					}, createSlots({ _: 2 }, [_ctx.$slots.item ? {
+						name: "item",
+						fn: withCtx((slotProps) => [renderSlot(_ctx.$slots, "item", normalizeProps(guardReactiveProps(slotProps)))]),
+						key: "0"
+					} : void 0]), 1032, ["items"])])]),
+					_: 3
+				}, 16, [
+					"to",
+					"align",
+					"collision-padding",
+					"side",
+					"side-offset",
+					"class"
+				])]),
+				_: 3
+			}, 8, ["open", "modal"]);
+		};
+	}
+});
+export { Menu_default as default };

package/dist/menu/MenuAction.vue.d.ts

@@ -0,0 +1,26 @@
+import { MenuItemAction } from './types';
+type __VLS_Props = {
+    allowCommandless?: boolean;
+    item: MenuItemAction;
+};
+declare var __VLS_17: {}, __VLS_19: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_17) => any;
+} & {
+    default?: (props: typeof __VLS_19) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    select: () => any;
+    activate: (item: MenuItemAction) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: (() => any) | undefined;
+    onActivate?: ((item: MenuItemAction) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/menu/MenuAction.vue.js

@@ -0,0 +1 @@
+export { t as default } from "../shared/MenuAction-0z8BSoX9.js";

package/dist/menu/MenuContent.vue.d.ts

@@ -0,0 +1,35 @@
+import { DropdownMenuContentProps } from 'reka-ui';
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = DropdownMenuContentProps & {
+    class?: HTMLAttributes['class'];
+    to?: string | HTMLElement;
+    width?: 'default' | 'trigger' | 'compact';
+    maxHeight?: 'available' | 'compact' | 'viewport';
+};
+declare var __VLS_14: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_14) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    escapeKeyDown: (event: KeyboardEvent) => any;
+    pointerDownOutside: (event: import('reka-ui').PointerDownOutsideEvent) => any;
+    focusOutside: (event: import('reka-ui').FocusOutsideEvent) => any;
+    interactOutside: (event: import('reka-ui').PointerDownOutsideEvent | import('reka-ui').FocusOutsideEvent) => any;
+    closeAutoFocus: (event: Event) => any;
+    openAutoFocus: (event: Event) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onEscapeKeyDown?: ((event: KeyboardEvent) => any) | undefined;
+    onPointerDownOutside?: ((event: import('reka-ui').PointerDownOutsideEvent) => any) | undefined;
+    onFocusOutside?: ((event: import('reka-ui').FocusOutsideEvent) => any) | undefined;
+    onInteractOutside?: ((event: import('reka-ui').PointerDownOutsideEvent | import('reka-ui').FocusOutsideEvent) => any) | undefined;
+    onCloseAutoFocus?: ((event: Event) => any) | undefined;
+    onOpenAutoFocus?: ((event: Event) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/menu/MenuContent.vue.js

@@ -0,0 +1 @@
+export { t as default } from "../shared/MenuContent--tKCqaIO.js";

package/dist/menu/MenuItem.vue.d.ts

@@ -0,0 +1,22 @@
+import { DropdownMenuItemProps } from 'reka-ui';
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = DropdownMenuItemProps & {
+    class?: HTMLAttributes['class'];
+};
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    select: (event: Event) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: ((event: Event) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/menu/MenuItem.vue.js

@@ -0,0 +1,33 @@
+import { t as cn } from "../shared/src-DTwuqov4.js";
+import { menuItemClass } from "./menuStyles.js";
+import { createBlock, createPropsRestProxy, defineComponent, mergeProps, openBlock, renderSlot, unref, withCtx } from "vue";
+import { DropdownMenuItem, useForwardPropsEmits } from "reka-ui";
+// src/components/menu/MenuItem.vue
+var MenuItem_default = /* @__PURE__ */ defineComponent({
+	__name: "MenuItem",
+	props: {
+		disabled: { type: Boolean },
+		textValue: {},
+		asChild: { type: Boolean },
+		as: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	emits: ["select"],
+	setup(__props, { emit: __emit }) {
+		const restProps = createPropsRestProxy(__props, ["class"]);
+		const forwarded = useForwardPropsEmits(restProps, __emit);
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(DropdownMenuItem), mergeProps(unref(forwarded), { class: unref(cn)(unref(menuItemClass), __props.class) }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["class"]);
+		};
+	}
+});
+export { MenuItem_default as default };

package/dist/menu/MenuItemContent.vue.d.ts

@@ -0,0 +1,8 @@
+import { MenuItem } from './types';
+type __VLS_Props = {
+    hasSubmenu: boolean;
+    item: MenuItem;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/menu/MenuItemContent.vue.js

@@ -0,0 +1 @@
+export { t as default } from "../shared/MenuItemContent-Be658c7e.js";

package/dist/menu/MenuItems.vue.d.ts

@@ -0,0 +1,32 @@
+import { Slot } from 'vue';
+import { MenuItem, MenuItemAction } from './types';
+type MenuItemSlotProps = {
+    item: MenuItem;
+    hasSubmenu: boolean;
+};
+type __VLS_Props = {
+    items: MenuItem[];
+    itemContent?: Slot<MenuItemSlotProps>;
+};
+declare var __VLS_12: {
+    item: MenuItem;
+    hasSubmenu: boolean;
+};
+type __VLS_Slots = {} & {
+    item?: (props: typeof __VLS_12) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    select: () => any;
+    activate: (item: MenuItemAction) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: (() => any) | undefined;
+    onActivate?: ((item: MenuItemAction) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/menu/MenuItems.vue.js

@@ -0,0 +1 @@
+export { t as default } from "../shared/MenuItems-BZTlERd6.js";

package/dist/menu/MenuRadioGroup.vue.d.ts

@@ -0,0 +1,26 @@
+import { MenuRadioOption } from './types';
+declare const __VLS_export: <T extends string>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import('vue').PublicProps & __VLS_PrettifyLocal<({
+        options: MenuRadioOption<T>[];
+    } & {
+        modelValue: T;
+    }) & {
+        onSelect?: ((event: Event) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: T) => any) | undefined;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: {};
+    emit: ((evt: "select", event: Event) => void) & ((event: "update:modelValue", value: T) => void);
+}>) => import('vue').VNode & {
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/menu/MenuRadioGroup.vue.js

@@ -0,0 +1 @@
+export { t as default } from "../shared/MenuRadioGroup-B28YS1p1.js";

package/dist/menu/MenuRadioItem.vue.d.ts

@@ -0,0 +1,22 @@
+import { DropdownMenuRadioItemProps } from 'reka-ui';
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = DropdownMenuRadioItemProps & {
+    class?: HTMLAttributes['class'];
+};
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    select: (event: Event) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: ((event: Event) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/menu/MenuRadioItem.vue.js

@@ -0,0 +1 @@
+export { t as default } from "../shared/MenuRadioItem-D8DFu-KU.js";

package/dist/menu/MenuSeparator.vue.d.ts

@@ -0,0 +1,8 @@
+import { DropdownMenuSeparatorProps } from 'reka-ui';
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = DropdownMenuSeparatorProps & {
+    class?: HTMLAttributes['class'];
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/menu/MenuSeparator.vue.js

@@ -0,0 +1 @@
+export { t as default } from "../shared/MenuSeparator-DrAiObmE.js";

package/dist/menu/MenuSub.vue.d.ts

@@ -0,0 +1,20 @@
+import { DropdownMenuSubProps } from 'reka-ui';
+declare var __VLS_8: {
+    open: boolean;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<DropdownMenuSubProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:open": (payload: boolean) => any;
+}, string, import('vue').PublicProps, Readonly<DropdownMenuSubProps> & Readonly<{
+    "onUpdate:open"?: ((payload: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/menu/MenuSub.vue.js

@@ -0,0 +1 @@
+export { t as default } from "../shared/MenuSub-DSizq_fV.js";

package/dist/menu/MenuSubContent.vue.d.ts

@@ -0,0 +1,36 @@
+import { DropdownMenuSubContentProps } from 'reka-ui';
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = DropdownMenuSubContentProps & {
+    class?: HTMLAttributes['class'];
+    width?: 'default' | 'compact';
+    maxHeight?: 'available' | 'compact';
+};
+declare var __VLS_10: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_10) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    escapeKeyDown: (event: KeyboardEvent) => any;
+    pointerDownOutside: (event: import('reka-ui').PointerDownOutsideEvent) => any;
+    focusOutside: (event: import('reka-ui').FocusOutsideEvent) => any;
+    interactOutside: (event: import('reka-ui').PointerDownOutsideEvent | import('reka-ui').FocusOutsideEvent) => any;
+    closeAutoFocus: (event: Event) => any;
+    openAutoFocus: (event: Event) => any;
+    entryFocus: (event: Event) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onEscapeKeyDown?: ((event: KeyboardEvent) => any) | undefined;
+    onPointerDownOutside?: ((event: import('reka-ui').PointerDownOutsideEvent) => any) | undefined;
+    onFocusOutside?: ((event: import('reka-ui').FocusOutsideEvent) => any) | undefined;
+    onInteractOutside?: ((event: import('reka-ui').PointerDownOutsideEvent | import('reka-ui').FocusOutsideEvent) => any) | undefined;
+    onCloseAutoFocus?: ((event: Event) => any) | undefined;
+    onOpenAutoFocus?: ((event: Event) => any) | undefined;
+    onEntryFocus?: ((event: Event) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/menu/MenuSubContent.vue.js

@@ -0,0 +1 @@
+export { t as default } from "../shared/MenuSubContent-ghzkX4hX.js";

package/dist/menu/MenuSubTrigger.vue.d.ts

@@ -0,0 +1,18 @@
+import { DropdownMenuSubTriggerProps } from 'reka-ui';
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = DropdownMenuSubTriggerProps & {
+    class?: HTMLAttributes['class'];
+};
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/menu/MenuSubTrigger.vue.js

@@ -0,0 +1 @@
+export { t as default } from "../shared/MenuSubTrigger-BGRIm_Bf.js";

package/dist/menu/MenuSubmenu.vue.d.ts

@@ -0,0 +1,21 @@
+import { MenuItemRadioGroup, MenuItemSubmenu } from './types';
+type __VLS_Props = {
+    item: MenuItemSubmenu | MenuItemRadioGroup;
+};
+declare var __VLS_14: {}, __VLS_22: {
+    items: import('./types').MenuItem[];
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_14) => any;
+} & {
+    content?: (props: typeof __VLS_22) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/menu/MenuSubmenu.vue.js

@@ -0,0 +1 @@
+export { t as default } from "../shared/MenuSubmenu-CjPf8DXl.js";

package/dist/menu/menuAnchor.d.ts

@@ -0,0 +1,4 @@
+export declare function getMenuAnchorPosition(event: Event): {
+    x: number;
+    y: number;
+};

package/dist/menu/menuAnchor.js

@@ -0,0 +1,14 @@
+// src/components/menu/menuAnchor.ts
+function getMenuAnchorPosition(event) {
+	if (event instanceof MouseEvent && !(event.type === "click" && event.detail === 0)) return {
+		x: event.clientX,
+		y: event.clientY
+	};
+	const target = event.currentTarget ?? event.target;
+	const rect = target instanceof Element ? target.getBoundingClientRect() : null;
+	return {
+		x: rect?.left ?? 0,
+		y: rect?.top ?? 0
+	};
+}
+export { getMenuAnchorPosition };

package/dist/menu/menuStyles.d.ts

@@ -0,0 +1,4 @@
+export declare const menuContentClass = "z-overlay min-w-48 overflow-y-auto rounded-lg border bg-background p-1 text-foreground shadow-lg outline-none";
+export declare const menuItemClass = "flex min-h-8 cursor-default items-center gap-2 rounded-md px-3 py-1.5 text-sm outline-none data-disabled:opacity-50 data-highlighted:bg-accent";
+export declare const menuButtonClass = "flex min-h-8 cursor-default items-center gap-2 rounded-md px-3 py-1.5 text-sm outline-none data-disabled:opacity-50 data-highlighted:bg-accent w-full justify-start border-0 bg-transparent text-left hover:bg-accent focus-visible:bg-accent disabled:pointer-events-none disabled:opacity-50";
+export declare const selectedMenuButtonClass = "bg-muted hover:bg-muted focus-visible:bg-muted";

package/dist/menu/menuStyles.js

@@ -0,0 +1,6 @@
+// src/components/menu/menuStyles.ts
+var menuContentClass = "z-overlay min-w-48 overflow-y-auto rounded-lg border bg-background p-1 text-foreground shadow-lg outline-none";
+var menuItemClass = "flex min-h-8 cursor-default items-center gap-2 rounded-md px-3 py-1.5 text-sm outline-none data-disabled:opacity-50 data-highlighted:bg-accent";
+var menuButtonClass = `${menuItemClass} w-full justify-start border-0 bg-transparent text-left hover:bg-accent focus-visible:bg-accent disabled:pointer-events-none disabled:opacity-50`;
+var selectedMenuButtonClass = "bg-muted hover:bg-muted focus-visible:bg-muted";
+export { menuButtonClass, menuContentClass, menuItemClass, selectedMenuButtonClass };

package/dist/menu/mouseDownUtil.d.ts

@@ -0,0 +1,3 @@
+export declare const whileMouseDown: (elementOrEvent: HTMLElement | Event, callback: (iteration: number) => void, interval?: number) => {
+    dispose: () => void;
+};

package/dist/menu/types.d.ts

@@ -0,0 +1,69 @@
+import { OverlayIconProps } from '@comfyorg/design-system/common/OverlayIcon';
+export interface MenuItemCommandEvent {
+    originalEvent: Event;
+    item: MenuItem;
+}
+interface MenuItemMetadata {
+    label?: string | (() => string);
+    description?: string | (() => string);
+    icon?: string;
+    disabled?: boolean | (() => boolean);
+    visible?: boolean | (() => boolean);
+    key?: string;
+    class?: string | (() => string);
+    tooltip?: string;
+    shortcut?: string | (() => string | undefined);
+    badge?: string;
+    overlayIcon?: OverlayIconProps;
+    trailingIcon?: string;
+    presentation?: 'switch';
+}
+export interface MenuItemSeparator extends MenuItemMetadata {
+    separator: true;
+    command?: never;
+    items?: never;
+    checked?: never;
+    radioGroup?: never;
+}
+export interface MenuItemSubmenu extends MenuItemMetadata {
+    separator?: false;
+    items: MenuItem[];
+    command?: never;
+    checked?: never;
+    radioGroup?: never;
+}
+export interface MenuItemRadioGroup extends MenuItemMetadata {
+    separator?: false;
+    items?: never;
+    command?: never;
+    checked?: never;
+    radioGroup: {
+        value: string | (() => string);
+        options: {
+            value: string;
+            label: string;
+            icon?: string;
+            command: () => unknown;
+        }[];
+    };
+}
+export interface MenuItemAction extends MenuItemMetadata {
+    separator?: false;
+    items?: never;
+    radioGroup?: never;
+    command?: (event: MenuItemCommandEvent) => unknown;
+    checked?: boolean | (() => boolean);
+    pressAndHoldInterval?: number;
+    variant?: 'destructive';
+    /** Keeps a disabled item in keyboard focus order, marked `aria-disabled`, so its tooltip stays reachable. */
+    focusableWhenDisabled?: boolean;
+}
+export interface MenuRadioOption<T extends string = string> {
+    label: string;
+    value: T;
+    command?: () => unknown;
+    icon?: string;
+    tooltip?: string;
+}
+export type MenuItem = MenuItemSeparator | MenuItemSubmenu | MenuItemRadioGroup | MenuItemAction;
+export {};

package/dist/menu/usePointMenu.d.ts

@@ -0,0 +1,19 @@
+/**
+ * State for a non-modal menu opened from code at the event's pointer or element.
+ * Bind `menuProps` to a `Menu`; any outside press closes it, even one stopped before reaching the document.
+ */
+export declare function usePointMenu(onShow?: (event: Event) => void): {
+    open: import('vue').Ref<boolean, boolean>;
+    menuProps: import('vue').ComputedRef<{
+        open: boolean;
+        'onUpdate:open': (value: boolean) => void;
+        reference: {
+            getBoundingClientRect: () => DOMRect;
+        } | undefined;
+        modal: boolean;
+        onFocusOutside: (event: Event) => void;
+    }>;
+    show: (event: Event) => void;
+    hide: () => void;
+    toggle: (event: Event) => void;
+};

package/dist/menu/usePointMenu.js

@@ -0,0 +1,55 @@
+import { getMenuAnchorPosition } from "./menuAnchor.js";
+import { computed, ref, shallowRef } from "vue";
+import { useEventListener } from "@vueuse/core";
+// src/components/menu/usePointMenu.ts
+/**
+* State for a non-modal menu opened from code at the event's pointer or element.
+* Bind `menuProps` to a `Menu`; any outside press closes it, even one stopped before reaching the document.
+*/
+function usePointMenu(onShow) {
+	const open = ref(false);
+	const reference = shallowRef();
+	let shownFrom = null;
+	let dismissingPress = null;
+	function show(event) {
+		dismissingPress = null;
+		shownFrom = event.currentTarget;
+		onShow?.(event);
+		const { x, y } = getMenuAnchorPosition(event);
+		reference.value = { getBoundingClientRect: () => new DOMRect(x, y, 1, 1) };
+		open.value = true;
+	}
+	function hide() {
+		dismissingPress = null;
+		open.value = false;
+	}
+	function toggle(event) {
+		const control = event.currentTarget;
+		const pressDismissedMenu = event instanceof MouseEvent && event.detail > 0 && control instanceof Node && control === shownFrom && dismissingPress !== null && control.contains(dismissingPress);
+		if (open.value || pressDismissedMenu) hide();
+		else show(event);
+	}
+	useEventListener(document, "pointerdown", ({ target }) => {
+		dismissingPress = null;
+		if (!open.value) return;
+		if (target instanceof Element && target.closest("[role=\"menu\"]")) return;
+		dismissingPress = target instanceof Node ? target : null;
+		open.value = false;
+	}, { capture: true });
+	return {
+		open,
+		menuProps: computed(() => ({
+			open: open.value,
+			"onUpdate:open": (value) => {
+				open.value = value;
+			},
+			reference: reference.value,
+			modal: false,
+			onFocusOutside: (event) => event.preventDefault()
+		})),
+		show,
+		hide,
+		toggle
+	};
+}
+export { usePointMenu };