@g4rcez/components 0.0.32 → 0.0.34

package/dist/components/core/button.d.ts

@@ -1,6 +1,6 @@
 import { type VariantProps } from "class-variance-authority";
 import React from "react";
-import { Label } from "../../types";
+import { type Label } from "../../types";
 import { PolymorphicProps } from "./polymorph";
 declare const buttonVariants: (props?: ({
     size?: "big" | "small" | "default" | "icon" | null | undefined;

package/dist/components/core/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/core/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,cAAc;;;;mFA6BnB,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,gBAAgB,CAC9E,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC,EAChF,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,GAsB7E,CAAC;AAEZ,KAAK,KAAK,GAAG;IACT,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,WAAW,EAAE,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,WAAW,UAAW,KAAK,4CAkBvC,CAAC"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/core/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,cAAc;;;;mFA6BnB,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,gBAAgB,CAC9E,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC,EAChF,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,GAsB7E,CAAC;AAEZ,KAAK,KAAK,GAAG;IACT,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,WAAW,EAAE,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,WAAW,UAAW,KAAK,4CAkBvC,CAAC"}

package/dist/components/core/button.js

@@ -9,7 +9,7 @@ const buttonVariants = cva("inline-flex duration-700 enabled:hover:bg-opacity-80
         size: {
             default: "h-10 px-4 py-2",
             big: "h-12 px-6 py-4",
-            small: "h-10 p-2 text-sm",
+            small: "h-8 p-2 text-sm",
             icon: "p-1",
         },
         rounded: {

package/dist/components/display/list.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../../src/components/display/list.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAAmD,MAAM,OAAO,CAAC;AAE5G,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,KAAK,iBAAiB,GAAG;IACrB,KAAK,EAAE,KAAK,CAAC;IACb,WAAW,EAAE,KAAK,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,OAAO,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,IAAI,EAAE,MAAM,IAAI,CAAA;KAAE,CAAC,CAAC;CAC5C,CAAC;AAIF,KAAK,iBAAiB,GAAG,EAAE,CAAC;AA0D5B,eAAO,MAAM,YAAY,UAAW,iBAAiB,CAAC,iBAAiB,CAAC,4CA4DvE,CAAC;AAEF,eAAO,MAAM,gBAAgB,UAAW,iBAAiB,CAAC,iBAAiB,CAAC,4CAA0C,CAAC"}
+{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../../src/components/display/list.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAAgC,MAAM,OAAO,CAAC;AACzF,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,KAAK,iBAAiB,GAAG;IACrB,KAAK,EAAE,KAAK,CAAC;IACb,WAAW,EAAE,KAAK,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,OAAO,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,IAAI,EAAE,MAAM,IAAI,CAAA;KAAE,CAAC,CAAC;CAC5C,CAAC;AAIF,KAAK,iBAAiB,GAAG,EAAE,CAAC;AA6D5B,eAAO,MAAM,YAAY,UAAW,iBAAiB,CAAC,iBAAiB,CAAC,4CAoEvE,CAAC;AAEF,eAAO,MAAM,gBAAgB,UAAW,iBAAiB,CAAC,iBAAiB,CAAC,4CAA0C,CAAC"}

package/dist/components/display/list.js

@@ -1,31 +1,29 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { AnimatePresence, motion } from "framer-motion";
+import { FloatingFocusManager, FloatingOverlay, FloatingPortal, useClick, useDismiss, useFloating, useInteractions, useRole, } from "@floating-ui/react";
+import { AnimatePresence, motion, MotionConfig } from "framer-motion";
 import { XIcon } from "lucide-react";
-import React, { Fragment, useCallback, useEffect, useId, useRef, useState } from "react";
-import { useOnClickOutside } from "../../hooks/use-click-outside";
-const FloatItem = ({ item, setter }) => {
-    const ref = useRef(null);
-    useOnClickOutside(ref, setter);
-    useEffect(() => {
-        function onKeyDown(event) {
-            if (event.key === "Escape")
-                setter();
-        }
-        window.addEventListener("keydown", onKeyDown);
-        return () => window.removeEventListener("keydown", onKeyDown);
-    }, []);
-    return (_jsxs(Fragment, { children: [_jsx(AnimatePresence, { children: item ? (_jsx(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, className: "pointer-events-none absolute inset-0 z-floating h-screen w-screen bg-floating-overlay/70" })) : null }), _jsx(AnimatePresence, { children: item ? (_jsx("div", { className: "absolute inset-0 z-tooltip flex items-center justify-center", children: _jsxs(motion.div, { layout: true, ref: ref, layoutId: `item-${item.id}`, className: "relative flex h-min w-min min-w-xs flex-col gap-4 rounded-card border border-card-border bg-card-background p-6 py-4 pb-8 shadow", children: [_jsx("nav", { className: "absolute right-4 top-1 lg:right-2", children: _jsx("button", { type: "button", onClick: setter, className: "p-1 opacity-70 transition-colors hover:text-danger hover:opacity-100 focus:text-danger", children: _jsx(XIcon, {}) }) }), _jsxs("header", { className: "flex w-full flex-wrap items-center justify-between gap-2", children: [_jsx("h3", { className: "min-w-full text-balance text-2xl font-medium", children: item.title }), _jsx("p", { className: "text-sm leading-snug text-secondary", children: item.description })] }), item.children] }) })) : null })] }));
+import React, { Fragment, useCallback, useId, useState } from "react";
+const FloatItem = ({ item, context, setter, get, refs }) => {
+    return (_jsx(FloatingPortal, { children: _jsx(MotionConfig, { reducedMotion: "user", transition: { type: "tween", stiffness: 25, duration: 0.2 }, children: _jsxs(AnimatePresence, { presenceAffectsLayout: true, children: [_jsx(AnimatePresence, { children: item ? (_jsx(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, className: "pointer-events-none fixed inset-0 top-0 z-floating h-screen w-screen bg-floating-overlay/70" })) : null }), _jsx(AnimatePresence, { children: item ? (_jsx(FloatingOverlay, { lockScroll: true, className: "absolute inset-0 z-tooltip flex items-center justify-center", children: _jsx(FloatingFocusManager, { visuallyHiddenDismiss: true, modal: true, closeOnFocusOut: true, context: context, children: _jsxs(motion.div, Object.assign({ layout: true, layoutId: `item-${item.id}`, className: "relative flex h-min w-min min-w-xs flex-col gap-4 rounded-card border border-card-border bg-card-background p-6 py-4 pb-8 shadow", ref: refs.setFloating }, get(), { children: [_jsx("nav", { className: "absolute right-4 top-1 lg:right-2", children: _jsx("button", { type: "button", onClick: setter, className: "p-1 opacity-70 transition-colors hover:text-danger hover:opacity-100 focus:text-danger", children: _jsx(XIcon, {}) }) }), _jsxs("header", { className: "flex w-full flex-wrap items-center justify-between gap-2", children: [_jsx("h3", { className: "min-w-full text-balance text-2xl font-medium", children: item.title }), _jsx("p", { className: "text-sm leading-snug text-secondary", children: item.description })] }), item.children] })) }) })) : null })] }) }) }));
 };
 export const AnimatedList = (props) => {
     const [selected, setSelected] = useState(null);
     const id = useId();
+    const { context, refs } = useFloating({
+        open: selected !== null,
+        transform: true,
+        onOpenChange: (open) => (open ? undefined : setSelected(null)),
+    });
+    const click = useClick(context);
+    const role = useRole(context);
+    const dismiss = useDismiss(context, { escapeKey: true, referencePress: true, outsidePress: true });
+    const { getFloatingProps } = useInteractions([click, role, dismiss]);
     const clear = useCallback(() => {
         setSelected(null);
     }, []);
     const items = React.Children.toArray(props.children);
-    return (_jsxs(Fragment, { children: [_jsx(FloatItem, { item: selected, setter: clear }), _jsx("ul", { role: "list", children: items.map((x, index) => {
+    return (_jsxs(Fragment, { children: [_jsx(FloatItem, { refs: refs, context: context, get: getFloatingProps, item: selected, setter: clear }), _jsx("ul", { role: "list", children: items.map((x, index) => {
                     const item = x.props;
-                    const isLast = index === items.length - 1;
                     const innerId = `${id}-${index}`;
                     const setter = () => setSelected(Object.assign(Object.assign({}, item), { id: innerId }));
                     const Leading = item.leading;

package/dist/components/display/notifications.d.ts

@@ -0,0 +1,25 @@
+import { type VariantProps } from "class-variance-authority";
+import { type PropsWithChildren } from "react";
+import { Label } from "../../types";
+declare const variants: (props?: ({
+    theme?: "default" | "warn" | "danger" | "success" | "info" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+type NotificationOptions = Partial<{
+    title: Label;
+    duration: number;
+    closable: boolean;
+    theme: VariantProps<typeof variants>["theme"];
+}>;
+type NotificationSubscriber = {
+    close: () => void;
+    clear: () => void;
+};
+type ContextFunction = (text: Label, args?: NotificationOptions) => NotificationSubscriber;
+export declare const useNotification: () => ContextFunction;
+export type NotificationProps = Partial<{
+    max: number;
+    duration: number;
+}>;
+export declare function Notifications({ children, max, duration }: PropsWithChildren<NotificationProps>): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=notifications.d.ts.map

package/dist/components/display/notifications.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notifications.d.ts","sourceRoot":"","sources":["../../../src/components/display/notifications.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,OAAO,EAA8C,KAAK,iBAAiB,EAAwD,MAAM,OAAO,CAAC;AAEjJ,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,QAAA,MAAM,QAAQ;;mFAcb,CAAC;AAEF,KAAK,mBAAmB,GAAG,OAAO,CAAC;IAC/B,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC;CACjD,CAAC,CAAC;AAEH,KAAK,sBAAsB,GAAG;IAAE,KAAK,EAAE,MAAM,IAAI,CAAC;IAAC,KAAK,EAAE,MAAM,IAAI,CAAA;CAAE,CAAC;AAEvE,KAAK,eAAe,GAAG,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,mBAAmB,KAAK,sBAAsB,CAAC;AAM3F,eAAO,MAAM,eAAe,uBAAwC,CAAC;AAkErE,MAAM,MAAM,iBAAiB,GAAG,OAAO,CAAC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAE3E,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAO,EAAE,QAAe,EAAE,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,2CAuDzG"}

package/dist/components/display/notifications.js

@@ -0,0 +1,70 @@
+"use client";
+import { createElement as _createElement } from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as RadixToast from "@radix-ui/react-toast";
+import { cva } from "class-variance-authority";
+import { AnimatePresence, motion } from "framer-motion";
+import { XIcon } from "lucide-react";
+import { createContext, forwardRef, useCallback, useContext, useEffect, useRef, useState } from "react";
+import { useHover } from "../../hooks/use-hover";
+const variants = cva("relative isolate z-tooltip flex justify-between overflow-hidden whitespace-nowrap rounded-lg border text-sm shadow-sm supports-[backdrop-filter]:backdrop-blur-xl", {
+    variants: {
+        theme: {
+            warn: "bg-warn-notification/90 text-warn-hover border-warn/50",
+            info: "bg-info-notification supports-[backdrop-filter]:bg-info-notification/50 supports-[backdrop-filter]:bg-info/20 text-info border-info/50",
+            danger: "bg-danger-notification supports-[backdrop-filter]:bg-danger-notification/60 text-danger border-danger/50",
+            success: "bg-success-notification supports-[backdrop-filter]:bg-success-notification/50 text-success border-success/50",
+            default: "border-card-border bg-card-background text-foreground",
+        },
+    },
+    defaultVariants: { theme: "default" },
+});
+const NotificationContext = createContext(() => {
+    throw new Error("Not implemented");
+});
+export const useNotification = () => useContext(NotificationContext);
+const animatedIndex = {
+    0: { opacity: 1, y: [10, 15], scale: [1, 0.98] },
+    1: { opacity: 1, y: [15, 20], scale: [1, 0.97] },
+    2: { opacity: 1, y: [20, 25], scale: [1, 0.96] },
+    default: { opacity: 1, y: [25, 30], scale: [1, 0.95] },
+};
+const Notification = forwardRef(function Toast(props, forwardedRef) {
+    var _a;
+    const closable = (_a = props.closable) !== null && _a !== void 0 ? _a : true;
+    const duration = props.duration;
+    const variant = props.hover ? "hover" : props.isLast ? "isLast" : "other";
+    const className = variants({ theme: props.theme || "default" });
+    return (_jsx(RadixToast.Root, { ref: forwardedRef, asChild: true, forceMount: true, onOpenChange: props.onClose, duration: duration, children: _jsx(motion.li, { layout: true, layoutScroll: true, animate: variant, "data-index": props.index, initial: { y: -100, zIndex: -1 }, className: "text-select pointer-events-auto absolute right-0 top-0 w-80", variants: {
+                isLast: { y: 10, scale: 1, animationDuration: "300ms", opacity: 1 },
+                hover: { y: 0, position: "static", scale: 1, opacity: 1 },
+                other: animatedIndex[props.reversedIndex] || animatedIndex.default,
+            }, transition: { type: "spring", mass: 1.2, damping: 30, stiffness: 200 }, exit: { opacity: [0.9, 0], transition: { opacity: { bounce: 0.25, duration: 0.3 } } }, children: _jsxs("div", { className: className, children: [_jsxs("div", { className: "flex flex-col p-4", children: [props.title ? (_jsx(RadixToast.Title, { className: "select-text truncate text-lg font-medium leading-relaxed", children: "Title" })) : null, _jsxs(RadixToast.Description, { className: "select-text truncate", children: [props.text, props.index] })] }), closable ? (_jsx(RadixToast.Close, { className: "absolute right-2 top-2 rounded-full p-1 text-foreground transition hover:bg-danger/10 hover:text-danger-hover", children: _jsx(XIcon, { className: "h-5 w-5" }) })) : null] }) }) }));
+});
+export function Notifications({ children, max = 5, duration = 5000 }) {
+    const ref = useRef(null);
+    const hover = useHover(ref);
+    const [messages, setMessages] = useState([]);
+    const clear = useCallback(() => setMessages([]), []);
+    useEffect(() => {
+        return () => clear();
+    }, [clear]);
+    const notify = useCallback((text, args) => {
+        const id = window.crypto.randomUUID();
+        setMessages((prev) => {
+            const newItems = [...prev, Object.assign(Object.assign({}, args), { id, text })];
+            if (newItems.length > max)
+                return newItems.slice(newItems.length - max, newItems.length + 1);
+            return newItems;
+        });
+        const close = () => setMessages((prev) => prev.filter((x) => x.id !== id));
+        return { clear, close };
+    }, [max]);
+    return (_jsxs(RadixToast.Provider, { duration: duration, swipeThreshold: 150, children: [_jsx(NotificationContext.Provider, { value: notify, children: children }), _jsx(AnimatePresence, { presenceAffectsLayout: true, mode: "popLayout", children: messages.map((toast, index, list) => {
+                    const close = () => setMessages((prev) => prev.filter((t) => t.id !== toast.id));
+                    return (_createElement(Notification, Object.assign({}, toast, { key: toast.id, hover: hover, index: index, onClose: close, isLast: list.length - 1 === index, reversedIndex: list.length - (index + 1) })));
+                }) }), _jsx(RadixToast.Viewport, { ref: ref, "data-items": messages.length, style: {
+                    justifyContent: "start",
+                    height: `${(hover ? messages.length : Math.min(1, messages.length)) * 7}rem`,
+                }, className: "fixed right-4 top-10 flex w-80 list-none flex-col-reverse items-end gap-4 overflow-y-clip overflow-x-visible data-[items=true]:pb-8 max-sm:top-20" })] }));
+}

package/dist/components/floating/menu.d.ts

@@ -1,17 +1,43 @@
 import { LucideProps } from "lucide-react";
 import React from "react";
-import { Label } from "../../types";
+import { Override } from "../../types";
+export type MenuProps = Partial<{
+    nested: boolean;
+    isParent: boolean;
+    children: React.ReactNode;
+    asChild: boolean;
+} & ({
+    label: string;
+} | {
+    label: React.ReactElement;
+    title: string;
+})>;
 type MenuItemProps = {
     label: string;
     disabled?: boolean;
     Right?: React.FC<LucideProps>;
+} | {
+    label: React.ReactElement;
+    title: string;
+    disabled?: boolean;
+    Right?: React.FC<LucideProps>;
 };
-export declare const MenuItem: React.ForwardRefExoticComponent<MenuItemProps & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
-export declare const Menu: React.ForwardRefExoticComponent<Omit<Partial<{
+export declare const MenuItem: React.ForwardRefExoticComponent<Override<React.ButtonHTMLAttributes<HTMLButtonElement>, MenuItemProps> & React.RefAttributes<HTMLButtonElement>>;
+export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "asChild" | "nested" | "isParent"> & Partial<{
+    nested: boolean;
     isParent: boolean;
-    label: Label;
+    children: React.ReactNode;
+    asChild: boolean;
+} & {
+    label: string;
+}>, "ref"> | Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "asChild" | "nested" | "isParent"> & Partial<{
     nested: boolean;
+    isParent: boolean;
     children: React.ReactNode;
-}> & React.HTMLProps<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    asChild: boolean;
+} & {
+    label: React.ReactElement;
+    title: string;
+}>, "ref">) & React.RefAttributes<HTMLButtonElement>>;
 export {};
 //# sourceMappingURL=menu.d.ts.map

package/dist/components/floating/menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/components/floating/menu.tsx"],"names":[],"mappings":"AAyBA,OAAO,EAAoB,WAAW,EAAE,MAAM,cAAc,CAAC;AAC7D,OAAO,KAAiE,MAAM,OAAO,CAAC;AAEtF,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAkKpC,KAAK,aAAa,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAE1F,eAAO,MAAM,QAAQ,yIAiCpB,CAAC;AAEF,eAAO,MAAM,IAAI;cA7KH,OAAO;WACV,KAAK;YACJ,OAAO;cACL,KAAK,CAAC,SAAS;yFAmL3B,CAAC"}
+{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/components/floating/menu.tsx"],"names":[],"mappings":"AA0BA,OAAO,EAAoB,WAAW,EAAE,MAAM,cAAc,CAAC;AAC7D,OAAO,KAA2E,MAAM,OAAO,CAAC;AAGhG,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAyBvC,MAAM,MAAM,SAAS,GAAG,OAAO,CAC3B;IACI,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,EAAE,OAAO,CAAC;CACpB,GAAG,CAAC;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CACzE,CAAC;AA6JF,KAAK,aAAa,GACZ;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,GACpE;IAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAEtG,eAAO,MAAM,QAAQ,kJAiCpB,CAAC;AAEF,eAAO,MAAM,IAAI;YAzMD,OAAO;cACL,OAAO;cACP,KAAK,CAAC,SAAS;aAChB,OAAO;;WACN,MAAM;;YAJR,OAAO;cACL,OAAO;cACP,KAAK,CAAC,SAAS;aAChB,OAAO;;WACc,KAAK,CAAC,YAAY;WAAS,MAAM;qDA8MrE,CAAC"}

package/dist/components/floating/menu.js

@@ -1,10 +1,12 @@
 import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { autoUpdate, flip, FloatingFocusManager, FloatingList, FloatingNode, FloatingPortal, FloatingTree, offset, safePolygon, shift, useClick, useDismiss, useFloating, useFloatingNodeId, useFloatingParentNodeId, useFloatingTree, useHover, useInteractions, useListItem, useListNavigation, useMergeRefs, useRole, useTypeahead, } from "@floating-ui/react";
+import { Slot } from "@radix-ui/react-slot";
 import { ChevronRightIcon } from "lucide-react";
-import React, { createContext, useContext, useEffect, useRef, useState } from "react";
+import React, { createContext, Fragment, useContext, useEffect, useRef, useState } from "react";
+import { FLOATING_DELAY } from "../../constants";
 import { css } from "../../lib/dom";
-const menuItemClassName = (highlight = "") => css("w-full min-w-36 outline-none px-2 py-1 items-center flex justify-between text-left", "data-[active=true]:bg-primary data-[open]:bg-primary focus:bg-primary aria-expanded:opacity-80", "first-of-type:rounded-t-lg last-of-type:rounded-b-lg", "disabled:opacity-40 disabled:cursor-not-allowed", highlight);
+const menuItemClassName = (highlight = "") => css("w-full min-w-36 outline-none px-2 py-1 items-center flex justify-between text-left", "hover:bg-primary data-[open]:bg-primary focus:bg-primary aria-expanded:opacity-80", "first-of-type:rounded-t-lg last-of-type:rounded-b-lg", "disabled:opacity-40 disabled:cursor-not-allowed", highlight);
 const MenuContext = createContext({
     isOpen: false,
     activeIndex: null,
@@ -38,7 +40,7 @@ const MenuComponent = React.forwardRef((_a, forwardedRef) => {
     const dismiss = useDismiss(context, { bubbles: true });
     const hover = useHover(context, {
         enabled: true,
-        delay: { open: 100 },
+        delay: { open: FLOATING_DELAY },
         handleClose: safePolygon({ blockPointerEvents: true }),
     });
     const click = useClick(context, {
@@ -84,17 +86,22 @@ const MenuComponent = React.forwardRef((_a, forwardedRef) => {
             tree.events.emit("menuopen", { parentId, nodeId });
     }, [tree, isOpen, nodeId, parentId]);
     const className = isParent ? props.className : menuItemClassName(props.className);
-    return (_jsxs(FloatingNode, { id: nodeId, children: [_jsxs("button", Object.assign({ ref: useMergeRefs([refs.setReference, item.ref, forwardedRef]), tabIndex: !isNested ? undefined : parent.activeIndex === item.index ? 0 : -1, "data-open": isOpen ? "" : undefined, "data-nested": isNested ? "" : undefined, role: isNested ? "menuitem" : undefined, "data-focus-inside": hasFocusInside ? "" : undefined, className: className }, getReferenceProps(parent.getItemProps(Object.assign(Object.assign({}, props), { onFocus(event) {
-                    var _a;
-                    (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, event);
-                    setHasFocusInside(false);
-                    parent.setHasFocusInside(true);
-                } }))), { children: [label, isNested && (_jsxs("span", { style: { marginLeft: 10, fontSize: 10 }, children: [_jsx("span", { className: "sr-only", children: "Next menu" }), _jsx(ChevronRightIcon, { size: 14 })] }))] })), _jsx(MenuContext.Provider, { value: { activeIndex, setActiveIndex, getItemProps, setHasFocusInside, isOpen }, children: _jsx(FloatingList, { elementsRef: elementsRef, labelsRef: labelsRef, children: isOpen && (_jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(FloatingFocusManager, { context: context, modal: false, initialFocus: isNested ? -1 : 0, returnFocus: !isNested, children: _jsx("div", Object.assign({ ref: refs.setFloating, style: floatingStyles, className: "bg-floating-background z-tooltip isolate outline-none items-start border text-left shadow-xl border-floating-border flex flex-col rounded-lg" }, getFloatingProps(), { children: children })) }) })) }) })] }));
+    return (_jsxs(FloatingNode, { id: nodeId, children: [_jsx(Fragment, { children: props.asChild ? (_jsx(Slot, Object.assign({ children: label, ref: useMergeRefs([refs.setReference, item.ref, forwardedRef]), tabIndex: !isNested ? undefined : parent.activeIndex === item.index ? 0 : -1, "data-open": isOpen ? "" : undefined, "data-nested": isNested ? "" : undefined, role: isNested ? "menuitem" : undefined, "data-focus-inside": hasFocusInside ? "" : undefined, className: className }, getReferenceProps(parent.getItemProps(Object.assign(Object.assign({}, props), { onFocus(event) {
+                        var _a;
+                        (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, event);
+                        setHasFocusInside(false);
+                        parent.setHasFocusInside(true);
+                    } })))))) : (_jsxs("button", Object.assign({ ref: useMergeRefs([refs.setReference, item.ref, forwardedRef]), tabIndex: !isNested ? undefined : parent.activeIndex === item.index ? 0 : -1, "data-open": isOpen ? "" : undefined, "data-nested": isNested ? "" : undefined, role: isNested ? "menuitem" : undefined, "data-focus-inside": hasFocusInside ? "" : undefined, className: className }, getReferenceProps(parent.getItemProps(Object.assign(Object.assign({}, props), { onFocus(event) {
+                        var _a;
+                        (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, event);
+                        setHasFocusInside(false);
+                        parent.setHasFocusInside(true);
+                    } }))), { children: [label, isNested && (_jsxs("span", { style: { marginLeft: 10, fontSize: 10 }, children: [_jsx("span", { className: "sr-only", children: "Next menu" }), _jsx(ChevronRightIcon, { size: 14 })] }))] }))) }), _jsx(MenuContext.Provider, { value: { activeIndex, setActiveIndex, getItemProps, setHasFocusInside, isOpen }, children: _jsx(FloatingList, { elementsRef: elementsRef, labelsRef: labelsRef, children: isOpen && (_jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(FloatingFocusManager, { context: context, modal: false, initialFocus: isNested ? -1 : 0, returnFocus: !isNested, children: _jsx("div", Object.assign({ ref: refs.setFloating, style: floatingStyles, className: "isolate z-tooltip flex flex-col items-start rounded-lg border border-floating-border bg-floating-background text-left shadow-xl outline-none" }, getFloatingProps(), { children: children })) }) })) }) })] }));
 });
 export const MenuItem = React.forwardRef((_a, forwardedRef) => {
-    var { label, Right, disabled } = _a, props = __rest(_a, ["label", "Right", "disabled"]);
+    var { label, title, Right, disabled } = _a, props = __rest(_a, ["label", "title", "Right", "disabled"]);
     const menu = useContext(MenuContext);
-    const item = useListItem({ label: disabled ? null : label });
+    const item = useListItem({ label: disabled ? null : typeof label === "string" ? label : title });
     const tree = useFloatingTree();
     const isActive = item.index === menu.activeIndex;
     return (_jsxs("button", Object.assign({}, props, { ref: useMergeRefs([item.ref, forwardedRef]), "data-active": isActive, type: "button", role: "menuitem", disabled: disabled, tabIndex: isActive ? 0 : -1, className: menuItemClassName(props.className) }, menu.getItemProps({

package/dist/components/floating/modal.js

@@ -37,7 +37,7 @@ const variants = cva("isolate z-floating border border-card-border ring-0 outlin
     variants: {
         type: {
             drawer: "max-h-screen max-w-[90%] absolute w-fit h-screen min-h-0",
-            dialog: "max-h-[calc(100lvh-10%)] relative container h-min rounded-lg py-8",
+            dialog: "max-h-[calc(100lvh-10%)] relative container h-min rounded-lg py-4",
             sheet: "w-screen absolute bottom-0 h-[85vh] max-h-[85vh] max-h-[85svh] pt-6 pb-4 rounded-t-lg",
         },
         position: {
@@ -96,5 +96,5 @@ export const Modal = (_a) => {
     const Trigger = props.trigger;
     const value = useMotionValue(undefined);
     const onClose = () => props.onChange(false);
-    return (_jsxs(Fragment, { children: [props.trigger ? (_jsx(Fragment, { children: props.asChild ? (_jsx(Slot, Object.assign({ ref: refs.setReference }, getReferenceProps(), { children: Trigger }))) : (_jsx("button", Object.assign({ ref: refs.setReference }, getReferenceProps(), { type: "button", children: Trigger }))) })) : null, _jsx(FloatingPortal, { children: _jsx(AnimatePresence, { presenceAffectsLayout: true, children: props.open ? (_jsx(FloatingOverlay, { lockScroll: true, className: `z-overlay inset-0 isolate h-[100dvh] !overflow-clip bg-floating-overlay/70 ${type === "drawer" ? "" : "grid items-end justify-center lg:items-center"}`, children: _jsx(FloatingFocusManager, { visuallyHiddenDismiss: true, modal: true, closeOnFocusOut: true, context: context, children: _jsxs(motion.div, Object.assign({ animate: "enter", "aria-describedby": descriptionId, "aria-labelledby": headingId, className: variants({ position, type }), exit: "exit", initial: "initial", ref: refs.setFloating, style: type === "drawer" ? { width: value } : { height: value }, variants: animation }, getFloatingProps(), { children: [props.title ? (_jsx("header", { className: "relative w-full", children: props.title ? (_jsx("h2", { className: "border-b border-floating-border px-8 pb-4 text-3xl font-medium leading-relaxed", children: props.title })) : null })) : null, _jsx("section", { className: "py-1 flex-1 overflow-y-auto px-8", children: props.children }), props.footer ? (_jsx("footer", { className: "w-full border-t border-floating-border px-8 pt-4", children: props.footer })) : null, closable ? (_jsx("nav", { className: "absolute right-4 top-1", children: _jsx("button", { type: "button", onClick: onClose, className: "p-1 opacity-70 transition-colors hover:text-danger hover:opacity-100 focus:text-danger", children: _jsx(XIcon, {}) }) })) : null, useResizer && resizer ? (_jsx(Draggable, { onChange: props.onChange, parent: refs.floating, position: position, sheet: type === "sheet", value: value })) : null] })) }) })) : null }) })] }));
+    return (_jsxs(Fragment, { children: [props.trigger ? (_jsx(Fragment, { children: props.asChild ? (_jsx(Slot, Object.assign({ ref: refs.setReference }, getReferenceProps(), { children: Trigger }))) : (_jsx("button", Object.assign({ ref: refs.setReference }, getReferenceProps(), { type: "button", children: Trigger }))) })) : null, _jsx(FloatingPortal, { children: _jsx(AnimatePresence, { presenceAffectsLayout: true, children: props.open ? (_jsx(FloatingOverlay, { lockScroll: true, className: `z-overlay inset-0 isolate h-[100dvh] !overflow-clip bg-floating-overlay/70 ${type === "drawer" ? "" : "grid items-end justify-center lg:items-center"}`, children: _jsx(FloatingFocusManager, { visuallyHiddenDismiss: true, modal: true, closeOnFocusOut: true, context: context, children: _jsxs(motion.div, Object.assign({ animate: "enter", "aria-describedby": descriptionId, "aria-labelledby": headingId, className: variants({ position, type }), exit: "exit", initial: "initial", ref: refs.setFloating, style: type === "drawer" ? { width: value } : { height: value }, variants: animation }, getFloatingProps(), { children: [props.title ? (_jsx("header", { className: "relative w-full", children: props.title ? (_jsx("h2", { className: "border-b border-floating-border px-8 pb-2 text-3xl font-medium leading-relaxed", children: props.title })) : null })) : null, _jsx("section", { className: "py-1 flex-1 overflow-y-auto px-8", children: props.children }), props.footer ? (_jsx("footer", { className: "w-full border-t border-floating-border px-8 pt-4", children: props.footer })) : null, closable ? (_jsx("nav", { className: "absolute right-4 top-1", children: _jsx("button", { type: "button", onClick: onClose, className: "p-1 opacity-70 transition-colors hover:text-danger hover:opacity-100 focus:text-danger", children: _jsx(XIcon, {}) }) })) : null, useResizer && resizer ? (_jsx(Draggable, { onChange: props.onChange, parent: refs.floating, position: position, sheet: type === "sheet", value: value })) : null] })) }) })) : null }) })] }));
 };

package/dist/components/floating/tooltip.d.ts

@@ -1,9 +1,9 @@
 import React from "react";
 import { PolymorphicProps } from "../../components/core/polymorph";
-import { Label, Override } from "../../types";
-type TooltipProps = Override<PolymorphicProps<React.ComponentProps<"button">, "span">, {
+import { ComponentLike, Label, Override } from "../../types";
+export type TooltipProps<T extends ComponentLike = "span"> = Override<PolymorphicProps<React.ComponentProps<T>, T>, {
     title: Label;
+    enabled?: boolean;
 }>;
-export declare const Tooltip: ({ children, as, title, ...props }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
-export {};
+export declare const Tooltip: <T extends ComponentLike = "span">({ children, enabled, as, title, ...props }: TooltipProps<T>) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=tooltip.d.ts.map

package/dist/components/floating/tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/floating/tooltip.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAa,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AAC9E,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE9C,KAAK,YAAY,GAAG,QAAQ,CAAC,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,EAAE;IAAE,KAAK,EAAE,KAAK,CAAA;CAAE,CAAC,CAAC;AAEzG,eAAO,MAAM,OAAO,sCAAuC,YAAY,4CA6CtE,CAAC"}
+{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/floating/tooltip.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAa,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AAE9E,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE7D,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,aAAa,GAAG,MAAM,IAAI,QAAQ,CACjE,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAC5C;IACI,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB,CACJ,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,CAAC,SAAS,aAAa,uDAAuD,YAAY,CAAC,CAAC,CAAC,4CA6CpH,CAAC"}

package/dist/components/floating/tooltip.js

@@ -4,8 +4,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { arrow, autoUpdate, flip, FloatingArrow, FloatingPortal, offset, shift, useDismiss, useFloating, useFocus, useHover, useInteractions, useRole, } from "@floating-ui/react";
 import { Fragment, useRef, useState } from "react";
 import { Polymorph } from "../../components/core/polymorph";
+import { FLOATING_DELAY } from "../../constants";
 export const Tooltip = (_a) => {
-    var { children, as, title } = _a, props = __rest(_a, ["children", "as", "title"]);
+    var { children, enabled, as, title } = _a, props = __rest(_a, ["children", "enabled", "as", "title"]);
     const [isOpen, setIsOpen] = useState(false);
     const arrowRef = useRef(null);
     const Component = as || "span";
@@ -24,10 +25,10 @@ export const Tooltip = (_a) => {
             }),
         ],
     });
-    const hover = useHover(context, { move: true });
-    const focus = useFocus(context);
-    const dismiss = useDismiss(context);
-    const role = useRole(context, { role: "tooltip" });
+    const hover = useHover(context, { move: true, delay: { open: FLOATING_DELAY } });
+    const focus = useFocus(context, { enabled });
+    const dismiss = useDismiss(context, { enabled });
+    const role = useRole(context, { role: "tooltip", enabled });
     const { getReferenceProps, getFloatingProps } = useInteractions([hover, focus, dismiss, role]);
-    return (_jsxs(Fragment, { children: [_jsx(Component, Object.assign({ ref: refs.setReference }, getReferenceProps(props), { children: title })), _jsx(FloatingPortal, { children: isOpen && (_jsxs(Polymorph, Object.assign({}, getFloatingProps(), { ref: refs.setFloating, style: floatingStyles, className: "bg-tooltip-background z-tooltip text-tooltip-foreground border border-tooltip-border p-3 rounded-lg", children: [_jsx(FloatingArrow, { ref: arrowRef, context: context, strokeWidth: 0.1, className: "fill-tooltip-background stroke-tooltip-border" }), children] }))) })] }));
+    return (_jsxs(Fragment, { children: [_jsx(Component, Object.assign({ ref: refs.setReference }, getReferenceProps(props), { children: title })), _jsx(FloatingPortal, { children: isOpen && (_jsxs(Polymorph, Object.assign({}, getFloatingProps(), { ref: refs.setFloating, style: floatingStyles, className: "z-tooltip rounded-lg border border-tooltip-border bg-tooltip-background p-3 text-tooltip-foreground", children: [_jsx(FloatingArrow, { ref: arrowRef, context: context, strokeWidth: 0.1, className: "fill-tooltip-background stroke-tooltip-border" }), children] }))) })] }));
 };

package/dist/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const FLOATING_DELAY = 300;
+//# sourceMappingURL=constants.d.ts.map

package/dist/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,cAAc,MAAM,CAAA"}

package/dist/constants.js

@@ -0,0 +1 @@
+export const FLOATING_DELAY = 300;

package/dist/hooks/use-hover.d.ts

@@ -0,0 +1,3 @@
+import { RefObject } from "react";
+export declare const useHover: (ref: RefObject<HTMLElement>) => boolean;
+//# sourceMappingURL=use-hover.d.ts.map

package/dist/hooks/use-hover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-hover.d.ts","sourceRoot":"","sources":["../../src/hooks/use-hover.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAC;AAEvD,eAAO,MAAM,QAAQ,QAAS,SAAS,CAAC,WAAW,CAAC,YAiBnD,CAAC"}

package/dist/hooks/use-hover.js

@@ -0,0 +1,18 @@
+import { useEffect, useState } from "react";
+export const useHover = (ref) => {
+    const [hovered, setHovered] = useState(false);
+    const enter = () => setHovered(true);
+    const leave = () => setHovered(false);
+    useEffect(() => {
+        const el = ref.current; // cache external ref value for use in cleanup
+        if (el) {
+            el.addEventListener("mouseenter", enter);
+            el.addEventListener("mouseleave", leave);
+            return () => {
+                el.removeEventListener("mouseenter", enter);
+                el.removeEventListener("mouseleave", leave);
+            };
+        }
+    }, []);
+    return hovered;
+};

package/dist/hooks/use-on-event.d.ts

@@ -0,0 +1,4 @@
+type Listener<K extends keyof WindowEventMap> = (event: WindowEventMap[K]) => void;
+export declare const useOnEvent: <K extends keyof WindowEventMap>(event: K, func: Listener<K>) => void;
+export {};
+//# sourceMappingURL=use-on-event.d.ts.map

package/dist/hooks/use-on-event.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-on-event.d.ts","sourceRoot":"","sources":["../../src/hooks/use-on-event.ts"],"names":[],"mappings":"AAEA,KAAK,QAAQ,CAAC,CAAC,SAAS,MAAM,cAAc,IAAI,CAAC,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;AAEnF,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,MAAM,cAAc,SAAS,CAAC,QAAQ,QAAQ,CAAC,CAAC,CAAC,SAKrF,CAAC"}

package/dist/hooks/use-on-event.js

@@ -0,0 +1,7 @@
+import { useEffect } from "react";
+export const useOnEvent = (event, func) => {
+    useEffect(() => {
+        window.addEventListener(event, func);
+        return () => window.removeEventListener(event, func);
+    }, []);
+};