@g4rcez/components 2.0.29 → 2.0.30

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

@@ -0,0 +1,16 @@
+import * as React from 'react';
+export type Usable<T> = PromiseLike<T> | React.Context<T>;
+interface SlotProps extends React.HTMLAttributes<HTMLElement> {
+    children?: React.ReactNode;
+}
+export declare function createSlot(ownerName: string): React.ForwardRefExoticComponent<SlotProps & React.RefAttributes<HTMLElement>>;
+export declare const Slot: React.ForwardRefExoticComponent<SlotProps & React.RefAttributes<HTMLElement>>;
+interface SlottableProps {
+    children: React.ReactNode;
+}
+interface SlottableComponent extends React.FC<SlottableProps> {
+    __radixId: symbol;
+}
+export declare function createSlottable(ownerName: string): SlottableComponent;
+export {};
+//# sourceMappingURL=slot.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"slot.d.ts","sourceRoot":"","sources":["../../../src/components/core/slot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAiD/B,MAAM,MAAM,MAAM,CAAC,CAAC,IAAI,WAAW,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;AAI1D,UAAU,SAAU,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC3D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAiBD,wBAAgB,UAAU,CAAC,SAAS,EAAE,MAAM,iFA6C3C;AAED,eAAO,MAAM,IAAI,+EAAqB,CAAC;AAgCvC,UAAU,cAAc;IACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,UAAU,kBAAmB,SAAQ,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC;IAC3D,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,wBAAgB,eAAe,CAAC,SAAS,EAAE,MAAM,sBAOhD"}

package/dist/components/core/slot.js

@@ -0,0 +1,160 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import * as React from 'react';
+const REACT_LAZY_TYPE = Symbol.for('react.lazy');
+function setRef(ref, value) {
+    if (typeof ref === 'function') {
+        return ref(value);
+    }
+    else if (ref !== null && ref !== undefined) {
+        ref.current = value;
+    }
+}
+function composeRefs(...refs) {
+    return (node) => {
+        let hasCleanup = false;
+        const cleanups = refs.map((ref) => {
+            const cleanup = setRef(ref, node);
+            if (!hasCleanup && typeof cleanup == 'function') {
+                hasCleanup = true;
+            }
+            return cleanup;
+        });
+        if (hasCleanup) {
+            return () => {
+                for (let i = 0; i < cleanups.length; i++) {
+                    const cleanup = cleanups[i];
+                    if (typeof cleanup == 'function') {
+                        cleanup();
+                    }
+                    else {
+                        setRef(refs[i], null);
+                    }
+                }
+            };
+        }
+    };
+}
+const use = React[' use '.trim().toString()];
+function isPromiseLike(value) {
+    return typeof value === 'object' && value !== null && 'then' in value;
+}
+function isLazyComponent(element) {
+    return (element != null &&
+        typeof element === 'object' &&
+        '$$typeof' in element &&
+        element.$$typeof === REACT_LAZY_TYPE &&
+        '_payload' in element &&
+        isPromiseLike(element._payload));
+}
+export function createSlot(ownerName) {
+    const SlotClone = createSlotClone(ownerName);
+    const Slot = React.forwardRef((props, forwardedRef) => {
+        let { children, ...slotProps } = props;
+        if (isLazyComponent(children) && typeof use === 'function') {
+            children = use(children._payload);
+        }
+        const childrenArray = React.Children.toArray(children);
+        const slottable = childrenArray.find(isSlottable);
+        if (slottable) {
+            // the new element to render is the one passed as a child of `Slottable`
+            const newElement = slottable.props.children;
+            const newChildren = childrenArray.map((child) => {
+                if (child === slottable) {
+                    // because the new element will be the one rendered, we are only interested
+                    // in grabbing its children (`newElement.props.children`)
+                    if (React.Children.count(newElement) > 1)
+                        return React.Children.only(null);
+                    return React.isValidElement(newElement)
+                        ? newElement.props.children
+                        : null;
+                }
+                else {
+                    return child;
+                }
+            });
+            return (_jsx(SlotClone, { ...slotProps, ref: forwardedRef, children: React.isValidElement(newElement)
+                    ? React.cloneElement(newElement, undefined, newChildren)
+                    : null }));
+        }
+        return (_jsx(SlotClone, { ...slotProps, ref: forwardedRef, children: children }));
+    });
+    Slot.displayName = `${ownerName}.Slot`;
+    return Slot;
+}
+export const Slot = createSlot('Slot');
+function createSlotClone(ownerName) {
+    const SlotClone = React.forwardRef((props, forwardedRef) => {
+        let { children, ...slotProps } = props;
+        if (isLazyComponent(children) && typeof use === 'function') {
+            children = use(children._payload);
+        }
+        if (React.isValidElement(children)) {
+            const childrenRef = getElementRef(children);
+            const props = mergeProps(slotProps, children.props);
+            // do not pass ref to React.Fragment for React 19 compatibility
+            if (children.type !== React.Fragment) {
+                props.ref = forwardedRef ? composeRefs(forwardedRef, childrenRef) : childrenRef;
+            }
+            return React.cloneElement(children, props);
+        }
+        return React.Children.count(children) > 1 ? React.Children.only(null) : null;
+    });
+    SlotClone.displayName = `${ownerName}.SlotClone`;
+    return SlotClone;
+}
+const SLOTTABLE_IDENTIFIER = Symbol('radix.slottable');
+export function createSlottable(ownerName) {
+    const Slottable = ({ children }) => {
+        return _jsx(_Fragment, { children: children });
+    };
+    Slottable.displayName = `${ownerName}.Slottable`;
+    Slottable.__radixId = SLOTTABLE_IDENTIFIER;
+    return Slottable;
+}
+const Slottable = createSlottable('Slottable');
+function isSlottable(child) {
+    return (React.isValidElement(child) &&
+        typeof child.type === 'function' &&
+        '__radixId' in child.type &&
+        child.type.__radixId === SLOTTABLE_IDENTIFIER);
+}
+function mergeProps(slotProps, childProps) {
+    const overrideProps = { ...childProps };
+    for (const propName in childProps) {
+        const slotPropValue = slotProps[propName];
+        const childPropValue = childProps[propName];
+        const isHandler = /^on[A-Z]/.test(propName);
+        if (isHandler) {
+            if (slotPropValue && childPropValue) {
+                overrideProps[propName] = (...args) => {
+                    const result = childPropValue(...args);
+                    slotPropValue(...args);
+                    return result;
+                };
+            }
+            else if (slotPropValue) {
+                overrideProps[propName] = slotPropValue;
+            }
+        }
+        else if (propName === 'style') {
+            overrideProps[propName] = { ...slotPropValue, ...childPropValue };
+        }
+        else if (propName === 'className') {
+            overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(' ');
+        }
+    }
+    return { ...slotProps, ...overrideProps };
+}
+function getElementRef(element) {
+    let getter = Object.getOwnPropertyDescriptor(element.props, 'ref')?.get;
+    let mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning;
+    if (mayWarn) {
+        return element.ref;
+    }
+    getter = Object.getOwnPropertyDescriptor(element, 'ref')?.get;
+    mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning;
+    if (mayWarn) {
+        return element.props.ref;
+    }
+    return element.props.ref || element.ref;
+}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"notifications.d.ts","sourceRoot":"","sources":["../../../src/components/display/notifications.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE,OAAO,EAAgD,KAAK,iBAAiB,EAAwD,MAAM,OAAO,CAAC;AAEnJ,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,QAAA,MAAM,QAAQ;;mFAgBb,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;AA+DrE,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,2CAyDzG"}
+{"version":3,"file":"notifications.d.ts","sourceRoot":"","sources":["../../../src/components/display/notifications.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE,OAAO,EAAiB,KAAK,iBAAiB,EAAmC,MAAM,OAAO,CAAC;AAE/F,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,QAAA,MAAM,QAAQ;;mFAgBb,CAAC;AAEF,KAAK,mBAAmB,GAAG,OAAO,CAAC;IACjC,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC;CAC/C,CAAC,CAAC;AAIH,KAAK,sBAAsB,GAAG;IAAE,KAAK,EAAE,MAAM,IAAI,CAAC;IAAC,KAAK,EAAE,MAAM,IAAI,CAAA;CAAE,CAAC;AAEvE,KAAK,eAAe,GAAG,CAAC,WAAW,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,mBAAmB,KAAK,sBAAsB,CAAC;AAMlG,eAAO,MAAM,eAAe,uBAAwC,CAAC;AAwDrE,MAAM,MAAM,iBAAiB,GAAG,OAAO,CAAC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAqE1E,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAO,EAAE,OAAc,EAAE,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,2CAMxG"}

package/dist/components/display/notifications.js

@@ -1,11 +1,10 @@
 "use client";
-import { createElement as _createElement } from "react";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import { XIcon } from "lucide-react";
 import { AnimatePresence, motion } from "motion/react";
-import { Toast as RadixToast } from "radix-ui";
-import { createContext, forwardRef, useCallback, useContext, useEffect, useRef, useState } from "react";
+import { Toast as Base } from "@base-ui/react/toast";
+import { createContext, useCallback, useContext, useRef } 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-shadow-notification", {
     variants: {
@@ -31,41 +30,45 @@ const animatedIndex = {
     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) {
-    const closable = props.closable ?? true;
-    const duration = props.duration;
+function Notification(props) {
+    const closable = props.toast.data?.closable ?? true;
     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: {
+    const className = variants({ theme: props.toast.data?.theme || "default" });
+    return (_jsx(Base.Root, { toast: props.toast, swipeDirection: ["down", "right"], children: _jsx(motion.li, { layout: true, layoutScroll: true, animate: variant, "data-index": props.index, initial: { y: -100, zIndex: -1 }, className: "absolute top-0 right-0 w-80 pointer-events-auto text-select", 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: props.title })) : null, _jsx(RadixToast.Description, { className: "select-text truncate", children: props.text })] }), 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: "size-5" }) })) : null] }) }) }));
-});
-export function Notifications({ children, max = 5, duration = 5000 }) {
+            }, 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(Base.Content, { className: className, children: [_jsxs("div", { className: "flex flex-col p-4", children: [props.toast.title ? (_jsx(Base.Title, { className: "text-lg font-medium leading-relaxed select-text truncate" })) : null, _jsx(Base.Description, { className: "select-text truncate" })] }), closable ? (_jsx(Base.Close, { className: "absolute top-2 right-2 p-1 rounded-full transition text-foreground hover:bg-danger/10 hover:text-danger-hover", children: _jsx(XIcon, { className: "size-5" }) })) : null] }) }) }));
+}
+function NotificationsViewport({ max = 5 }) {
     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, { ...args, id, text }];
-            if (newItems.length > max)
-                return newItems.slice(newItems.length - max, newItems.length + 1);
-            return newItems;
+    const toastManager = Base.useToastManager();
+    const toasts = toastManager.toasts.slice(-max);
+    return (_jsx(Base.Viewport, { ref: ref, "data-items": toasts.length, style: {
+            justifyContent: "start",
+            height: `${(hover ? toasts.length : Math.min(1, toasts.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", children: _jsx(motion.ol, { className: "flex flex-col gap-4", children: _jsx(AnimatePresence, { presenceAffectsLayout: true, mode: "popLayout", children: toasts.reverse().map((toast, index, list) => (_jsx(Notification, { toast: toast, hover: hover, index: index, isLast: list.length - 1 === index, reversedIndex: list.length - (index + 1) }, toast.id))) }) }) }));
+}
+function NotificationsInner({ children, max = 5 }) {
+    const toastManager = Base.useToastManager();
+    const clear = useCallback(() => {
+        toastManager.toasts.forEach((t) => toastManager.close(t.id));
+    }, [toastManager]);
+    const notify = useCallback((description, args) => {
+        const id = toastManager.add({
+            description,
+            title: args?.title,
+            timeout: args?.timeout,
+            data: { theme: args?.theme, closable: args?.closable },
         });
-        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(motion.ol, { 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, { ...toast, hover: hover, index: index, key: toast.id, 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" })] }));
+        return {
+            close: () => toastManager.close(id),
+            clear,
+        };
+    }, [toastManager, clear]);
+    return (_jsxs(NotificationContext.Provider, { value: notify, children: [children, _jsx(Base.Portal, { children: _jsx(NotificationsViewport, { max: max }) })] }));
+}
+export function Notifications({ children, max = 5, timeout = 5000 }) {
+    return (_jsx(Base.Provider, { limit: max, timeout: timeout, children: _jsx(NotificationsInner, { max: max, children: children }) }));
 }

package/dist/components/display/progress.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Is } from "sidekicker";
-import { Progress as RadixProgress } from "radix-ui";
+import { Progress as RadixProgress } from "@base-ui/react/progress";
 import { css } from "../../lib/dom";
 export const Progress = (props) => {
-    return (_jsxs(RadixProgress.Root, { max: props.max, value: props.percent, style: { transform: "translateZ(0)", }, className: css("overflow-hidden relative w-full rounded-full h-6 bg-background", props.container), children: [_jsx(RadixProgress.Indicator, { style: { transform: Is.number(props.percent) ? `translateX(-${100 - props.percent}%)` : undefined }, className: css("bg-primary transition-transform ease-in-out size-full duration-500", props.className) }), Is.number(props.percent)
+    return (_jsxs(RadixProgress.Root, { max: props.max, value: props.percent ?? null, style: { transform: "translateZ(0)", }, className: css("overflow-hidden relative w-full rounded-full h-6 bg-background", props.container), children: [_jsx(RadixProgress.Indicator, { style: { transform: Is.number(props.percent) ? `translateX(-${100 - props.percent}%)` : undefined }, className: css("bg-primary transition-transform ease-in-out size-full duration-500", props.className) }), Is.number(props.percent)
                 ? _jsx("p", { className: css("flex absolute inset-0 justify-center items-center w-full font-semibold tabular-nums text-primary-foreground", props.textClassName), children: props.label ? props.label : `${props.percent} %` })
                 : null] }));
 };

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

@@ -2,12 +2,12 @@ import React, { PropsWithChildren } from "react";
 type DropdownProps = {
     open?: boolean;
     arrow?: boolean;
-    restoreFocus?: boolean;
     returnFocus?: boolean;
+    restoreFocus?: boolean;
+    buttonProps?: React.HTMLProps<"button">;
     onChange?: (nextValue: boolean) => void;
     trigger: React.ReactElement | React.ReactNode;
     title?: React.ReactNode | React.ReactElement | string;
-    buttonProps?: React.ComponentProps<"button">;
 };
 export declare const Dropdown: (props: PropsWithChildren<DropdownProps>) => import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1 +1 @@
-{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/floating/dropdown.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAA+C,MAAM,OAAO,CAAC;AAExG,KAAK,aAAa,GAAG;IACjB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,SAAS,CAAC;IAC9C,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,YAAY,GAAG,MAAM,CAAC;IACtD,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;CAChD,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,OAAO,iBAAiB,CAAC,aAAa,CAAC,4CAqE/D,CAAC"}
+{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/floating/dropdown.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAA+C,MAAM,OAAO,CAAC;AAExG,KAAK,aAAa,GAAG;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;IACxC,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,SAAS,CAAC;IAC9C,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,YAAY,GAAG,MAAM,CAAC;CACvD,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,OAAO,iBAAiB,CAAC,aAAa,CAAC,4CAqE/D,CAAC"}

package/dist/components/floating/dropdown.js

@@ -35,5 +35,5 @@ export const Dropdown = (props) => {
     const dismiss = useDismiss(context);
     const role = useRole(context, { role: "tooltip" });
     const { getReferenceProps, getFloatingProps } = useInteractions([click, dismiss, role]);
-    return (_jsxs(Fragment, { children: [_jsx("button", { ref: refs.setReference, ...getReferenceProps(props.buttonProps), type: "button", children: props.trigger }), open && (_jsx(FloatingPortal, { preserveTabOrder: true, id: `${headingId}-portal`, children: _jsx(FloatingFocusManager, { guards: true, restoreFocus: true, returnFocus: true, visuallyHiddenDismiss: true, context: context, modal: false, children: _jsxs("div", { className: "relative isolate z-floating min-w-96 rounded-lg border border-floating-border bg-floating-background p-4 shadow-shadow-floating", ref: refs.setFloating, style: floatingStyles, "aria-labelledby": headingId, ...getFloatingProps(), children: [_jsx(FloatingArrow, { ref: arrowRef, context: context, strokeWidth: 0.1, className: "fill-floating-background stroke-floating-border" }), _jsx("header", { className: "mb-2", children: _jsx("h3", { className: "text-left text-2xl font-medium leading-snug tracking-wide", children: props.title }) }), props.children] }) }) }))] }));
+    return (_jsxs(Fragment, { children: [_jsx("button", { ref: refs.setReference, ...getReferenceProps(props.buttonProps), type: "button", children: props.trigger }), open && (_jsx(FloatingPortal, { preserveTabOrder: true, id: `${headingId}-portal`, children: _jsx(FloatingFocusManager, { guards: true, restoreFocus: true, returnFocus: true, visuallyHiddenDismiss: true, context: context, modal: false, children: _jsxs("div", { className: "relative p-4 rounded-lg border isolate z-floating min-w-96 border-floating-border bg-floating-background shadow-shadow-floating", ref: refs.setFloating, "aria-labelledby": headingId, style: floatingStyles, ...getFloatingProps(), children: [_jsx(FloatingArrow, { ref: arrowRef, context: context, strokeWidth: 0.1, className: "fill-floating-background stroke-floating-border" }), _jsx("header", { className: "mb-2", children: _jsx("h3", { className: "text-2xl font-medium tracking-wide leading-snug text-left", children: props.title }) }), props.children] }) }) }))] }));
 };

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

@@ -22,7 +22,7 @@ type MenuItemProps = {
     Right?: React.FC<LucideProps>;
 };
 export declare const MenuItem: React.ForwardRefExoticComponent<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, keyof MenuItemProps> & MenuItemProps & React.RefAttributes<HTMLButtonElement>>;
-export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "open" | "asChild" | "restoreFocus" | "nested" | "isParent" | "floatingClassName" | "FloatingComponent"> & Partial<{
+export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "open" | "restoreFocus" | "nested" | "asChild" | "isParent" | "floatingClassName" | "FloatingComponent"> & Partial<{
     hover: boolean;
     open?: boolean;
     nested: boolean;
@@ -34,7 +34,7 @@ export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.Deta
     FloatingComponent: React.ElementType;
 } & {
     label: string;
-}>, "ref"> | Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "open" | "asChild" | "restoreFocus" | "nested" | "isParent" | "floatingClassName" | "FloatingComponent"> & Partial<{
+}>, "ref"> | Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "open" | "restoreFocus" | "nested" | "asChild" | "isParent" | "floatingClassName" | "FloatingComponent"> & Partial<{
     hover: boolean;
     open?: boolean;
     nested: boolean;

package/dist/components/floating/menu.js

@@ -1,7 +1,7 @@
 "use client";
 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, useRole, useTypeahead, } from "@floating-ui/react";
-import { Slot } from "radix-ui";
+import { Slot } from "../core/slot";
 import { ChevronRightIcon } from "lucide-react";
 import React, { createContext, Fragment, useContext, useEffect, useRef, useState } from "react";
 import { FLOATING_DELAY, TYPEAHEAD_RESET_DELAY } from "../../constants";
@@ -84,7 +84,7 @@ const MenuComponent = React.forwardRef(({ children, FloatingComponent = "div", h
             tree.events.emit("menuopen", { parentId, nodeId });
     }, [tree, isOpen, nodeId, parentId]);
     const className = isParent ? props.className : css(menuItemClassName(props.className));
-    return (_jsxs(FloatingNode, { id: nodeId, children: [_jsx(Fragment, { children: props.asChild ? (_jsx(Slot.Root, { ...getReferenceProps(parent.getItemProps({
+    return (_jsxs(FloatingNode, { id: nodeId, children: [_jsx(Fragment, { children: props.asChild ? (_jsx(Slot, { ...getReferenceProps(parent.getItemProps({
                         ...props,
                         onFocus(event) {
                             props.onFocus?.(event);

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

@@ -31,7 +31,7 @@ export type ModalProps = Override<HTMLMotionProps<"div">, ({
 type ModalRef = {
     floating: HTMLElement | null;
 };
-export declare const Modal: React.ForwardRefExoticComponent<(Omit<Omit<HTMLMotionProps<"div">, "footer" | "title" | "className" | "onChange" | "position" | "open" | "resizer" | "type" | "asChild" | "layoutId" | "trigger" | "animated" | "closable" | "forceType" | "bodyClassName" | "overlayClassName" | "overlayClickClose" | "ariaTitle"> & {
+export declare const Modal: React.ForwardRefExoticComponent<(Omit<Omit<HTMLMotionProps<"div">, "footer" | "title" | "className" | "onChange" | "position" | "open" | "resizer" | "type" | "layoutId" | "trigger" | "asChild" | "animated" | "closable" | "forceType" | "bodyClassName" | "overlayClassName" | "overlayClickClose" | "ariaTitle"> & {
     title: Label;
     ariaTitle?: string;
 } & {
@@ -54,7 +54,7 @@ export declare const Modal: React.ForwardRefExoticComponent<(Omit<Omit<HTMLMotio
     trigger: Label | React.FC<any>;
 }> & {
     children?: React.ReactNode | undefined;
-}, "ref"> | Omit<Omit<HTMLMotionProps<"div">, "footer" | "title" | "className" | "onChange" | "position" | "open" | "resizer" | "type" | "asChild" | "layoutId" | "trigger" | "animated" | "closable" | "forceType" | "bodyClassName" | "overlayClassName" | "overlayClickClose" | "ariaTitle"> & {
+}, "ref"> | Omit<Omit<HTMLMotionProps<"div">, "footer" | "title" | "className" | "onChange" | "position" | "open" | "resizer" | "type" | "layoutId" | "trigger" | "asChild" | "animated" | "closable" | "forceType" | "bodyClassName" | "overlayClassName" | "overlayClickClose" | "ariaTitle"> & {
     ariaTitle: string;
     title?: Label;
 } & {

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

@@ -1 +1 @@
-{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/floating/modal.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAmB,eAAe,EAAmF,MAAM,cAAc,CAAC;AAEjJ,OAAO,KAA+G,MAAM,OAAO,CAAC;AAGpI,OAAO,EAAE,KAAK,EAAO,QAAQ,EAAE,MAAM,aAAa,CAAC;AAMnD,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEtD,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,OAAO,CAAC;AAuD9C,MAAM,MAAM,UAAU,GAAG,QAAQ,CAC/B,eAAe,CAAC,KAAK,CAAC,EACtB,CAAC;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC,GAAG;IAC9E,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC,GAAG,OAAO,CAAC;IACV,MAAM,EAAE,KAAK,CAAC;IACd,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,gBAAgB,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,cAAc,CAAC;IACzB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,OAAO,EAAE,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CAChC,CAAC,CACH,CAAC;AAgFF,KAAK,QAAQ,GAAG;IAAE,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAA;CAAE,CAAC;AAEjD,eAAO,MAAM,KAAK;WArGN,KAAK;gBAAc,MAAM;;UAC3B,OAAO;cACH,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI;;YAE9B,KAAK;UACP,SAAS;cACL,OAAO;aACR,OAAO;cACN,MAAM;aACP,OAAO;eACL,MAAM;cACP,OAAO;eACN,OAAO;mBACH,MAAM;sBACH,MAAM;cACd,cAAc;uBACL,OAAO;aACjB,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC;;;;eAjBqB,MAAM;YAAU,KAAK;;UAClE,OAAO;cACH,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI;;YAE9B,KAAK;UACP,SAAS;cACL,OAAO;aACR,OAAO;cACN,MAAM;aACP,OAAO;eACL,MAAM;cACP,OAAO;eACN,OAAO;mBACH,MAAM;sBACH,MAAM;cACd,cAAc;uBACL,OAAO;aACjB,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC;;;2CAwUjC,CAAC"}
+{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/floating/modal.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAmB,eAAe,EAAmF,MAAM,cAAc,CAAC;AACjJ,OAAO,KAA+G,MAAM,OAAO,CAAC;AAGpI,OAAO,EAAE,KAAK,EAAO,QAAQ,EAAE,MAAM,aAAa,CAAC;AAKnD,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEtD,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,OAAO,CAAC;AAuD9C,MAAM,MAAM,UAAU,GAAG,QAAQ,CAC/B,eAAe,CAAC,KAAK,CAAC,EACtB,CAAC;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC,GAAG;IAC9E,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC,GAAG,OAAO,CAAC;IACV,MAAM,EAAE,KAAK,CAAC;IACd,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,gBAAgB,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,cAAc,CAAC;IACzB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,OAAO,EAAE,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CAChC,CAAC,CACH,CAAC;AAgFF,KAAK,QAAQ,GAAG;IAAE,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAA;CAAE,CAAC;AAEjD,eAAO,MAAM,KAAK;WArGN,KAAK;gBAAc,MAAM;;UAC3B,OAAO;cACH,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI;;YAE9B,KAAK;UACP,SAAS;cACL,OAAO;aACR,OAAO;cACN,MAAM;aACP,OAAO;eACL,MAAM;cACP,OAAO;eACN,OAAO;mBACH,MAAM;sBACH,MAAM;cACd,cAAc;uBACL,OAAO;aACjB,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC;;;;eAjBqB,MAAM;YAAU,KAAK;;UAClE,OAAO;cACH,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI;;YAE9B,KAAK;UACP,SAAS;cACL,OAAO;aACR,OAAO;cACN,MAAM;aACP,OAAO;eACL,MAAM;cACP,OAAO;eACN,OAAO;mBACH,MAAM;sBACH,MAAM;cACd,cAAc;uBACL,OAAO;aACjB,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC;;;2CA+UjC,CAAC"}

package/dist/components/floating/modal.js

@@ -4,11 +4,10 @@ import { Dialog } from "@base-ui/react/dialog";
 import { cva } from "class-variance-authority";
 import { XIcon } from "lucide-react";
 import { AnimatePresence, motion, MotionConfig, useMotionValue } from "motion/react";
-import { Slot as RadixSlot } from "radix-ui";
 import { forwardRef, Fragment, useEffect, useId, useImperativeHandle, useRef } from "react";
 import { useMediaQuery } from "../../hooks/use-media-query";
 import { css, mergeRefs } from "../../lib/dom";
-const Slot = RadixSlot.Slot;
+import { Slot } from "../core/slot";
 const animationDuration = "500ms";
 const drawerLeft = {
     exit: { x: ["0%", "-30%"], opacity: 0, animationDuration },
@@ -160,37 +159,37 @@ export const Modal = forwardRef(({ open, title, footer, asChild, trigger, childr
         : { animate: animated, initial: false };
     const scrollInitial = useMotionValue(undefined);
     const scroll = useMotionValue(undefined);
-    return (_jsxs(Dialog.Root, { open: open, onOpenChange: onChange, children: [trigger ? (_jsx(Fragment, { children: asChild ? (_jsx(Dialog.Trigger, { render: _jsx(Slot, {}), children: Trigger })) : (_jsx(Dialog.Trigger, { render: _jsx(motion.button, { layoutId: layoutId, type: "button" }), children: Trigger })) })) : null, _jsx(AnimatePresence, { mode: "wait", initial: false, children: open ? (_jsxs(Dialog.Portal, { keepMounted: false, children: [_jsx(Dialog.Backdrop, { className: css("fixed inset-0 flex isolate bg-floating-overlay/70 z-overlay h-[100dvh] !overflow-clip", type === "drawer" ? "" : "items-start justify-center p-10", overlayClassName) }), _jsx(MotionConfig, { reducedMotion: animated ? "user" : "always", children: _jsxs(Dialog.Popup, { render: _jsx(motion.div, { ...props, ...(title
-                                        ? {
-                                            "aria-labelledby": headingId,
-                                            "aria-describedby": descriptionId,
-                                        }
-                                        : { "aria-label": ariaTitle }), ref: mergeRefs(floatingRef, removeScrollRef), className: css(variants({ position, type }), className, "isolate overscroll-contain fixed", type === "dialog" ? "top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2" : ""), exit: "exit", layout: true, animate: "enter", initial: "initial", layoutId: layoutId, variants: animation, "data-component": "modal", style: type === "drawer" ? { width: floatingSize } : { height: floatingSize } }), children: [useResizer && resizer ? (_jsx(Draggable, { onChange: onChange, value: floatingSize, sheet: type === "sheet", position: position, parent: floatingRef })) : null, title ? (_jsx(motion.header, { ...draggableMotionProps, className: "relative w-full isolate", children: _jsx(Dialog.Title, { render: _jsx("h2", { id: headingId, className: "block px-8 pb-2 text-3xl font-medium leading-relaxed border-b select-text border-floating-border" }), children: title }) })) : null, _jsx(motion.section, { ref: innerContent, "data-component": "modal-body", dragConstraints: dragConstraints, drag: isDesktop ? undefined : "y", onDrag: type === "sheet" ? (isDesktop ? undefined : onDragBody) : undefined, className: css("flex-1 select-text overflow-y-auto px-8 py-1", bodyClassName), onTouchEnd: () => {
-                                            scroll.set(undefined);
-                                            scrollInitial.set(undefined);
-                                        }, onTouchStart: (e) => {
-                                            const touch = e.changedTouches[0];
-                                            scrollInitial.set(touch.pageY);
-                                            scroll.set(touch.pageY);
-                                        }, onTouchMove: (e) => {
-                                            const touch = e.changedTouches[0];
-                                            const y = touch.pageY;
-                                            const initial = scrollInitial.get();
-                                            if (initial !== undefined && initial < y) {
-                                                const distanceFromTop = innerContent.current?.scrollTop;
-                                                if (distanceFromTop === 0) {
-                                                    const div = floatingRef.current;
-                                                    const rect = div.getBoundingClientRect();
-                                                    const v = floatingSize.get() || rect.height;
-                                                    const diff = (initial - y) / 10;
-                                                    const down = v + diff;
-                                                    const max = window.outerHeight;
-                                                    const screenHeightToClose = calculateClose(max);
-                                                    if (down < screenHeightToClose)
-                                                        onChange?.(false);
-                                                    floatingSize.set(down);
-                                                }
+    return (_jsxs(Dialog.Root, { open: open, onOpenChange: onChange, disablePointerDismissal: !overlayClickClose, children: [trigger ? (_jsx(Fragment, { children: asChild ? (_jsx(Dialog.Trigger, { render: _jsx(Slot, {}), children: Trigger })) : (_jsx(Dialog.Trigger, { render: _jsx(motion.button, { layoutId: layoutId, type: "button" }), children: Trigger })) })) : null, _jsx(AnimatePresence, { mode: "wait", initial: false, children: open ? (_jsxs(Dialog.Portal, { keepMounted: false, children: [_jsx(Dialog.Backdrop, { className: css("fixed inset-0 flex isolate bg-floating-overlay/70 z-overlay h-[100dvh]", type === "drawer" ? "" : "items-start justify-center p-10", overlayClassName) }), _jsx(Dialog.Viewport, { className: css("fixed inset-0 flex isolate z-overlay h-[100dvh]", type === "drawer" ? "" : "items-start justify-center p-10", overlayClassName), children: _jsx(MotionConfig, { reducedMotion: animated ? "user" : "always", children: _jsxs(Dialog.Popup, { render: _jsx(motion.div, { ...props, ...(title
+                                            ? {
+                                                "aria-labelledby": headingId,
+                                                "aria-describedby": descriptionId,
                                             }
-                                            scroll.set(touch.pageY);
-                                        }, children: children }), footer ? _jsx("footer", { className: "px-8 pt-4 w-full border-t select-text border-floating-border", children: footer }) : null, closable ? (_jsx("nav", { className: "absolute top-1 right-4 z-floating", children: _jsx(Dialog.Close, { render: _jsx("button", { type: "button", onClick: onClose, className: "p-1 opacity-70 transition-colors hover:opacity-100 hover:text-danger focus:text-danger" }), children: _jsx(XIcon, {}) }) })) : null] }) })] })) : null })] }));
+                                            : { "aria-label": ariaTitle }), exit: "exit", layout: true, animate: "enter", initial: "initial", layoutId: layoutId, variants: animation, "data-component": "modal", ref: mergeRefs(floatingRef, removeScrollRef), style: type === "drawer" ? { width: floatingSize } : { height: floatingSize }, className: css(variants({ position, type }), className, "isolate overscroll-contain fixed", type === "dialog" ? "max-w-[calc(100vw-3rem)]" : "") }), children: [useResizer && resizer ? (_jsx(Draggable, { onChange: onChange, value: floatingSize, sheet: type === "sheet", position: position, parent: floatingRef })) : null, title ? (_jsx(motion.header, { ...draggableMotionProps, className: "relative w-full isolate", children: _jsx(Dialog.Title, { render: _jsx("h2", { id: headingId, className: "block px-8 pb-2 text-3xl font-medium leading-relaxed border-b select-text border-floating-border" }), children: title }) })) : null, _jsx(motion.section, { ref: innerContent, "data-component": "modal-body", dragConstraints: dragConstraints, drag: isDesktop ? undefined : "y", onDrag: type === "sheet" ? (isDesktop ? undefined : onDragBody) : undefined, className: css("flex-1 select-text overflow-y-auto px-8 py-1", bodyClassName), onTouchEnd: () => {
+                                                scroll.set(undefined);
+                                                scrollInitial.set(undefined);
+                                            }, onTouchStart: (e) => {
+                                                const touch = e.changedTouches[0];
+                                                scrollInitial.set(touch.pageY);
+                                                scroll.set(touch.pageY);
+                                            }, onTouchMove: (e) => {
+                                                const touch = e.changedTouches[0];
+                                                const y = touch.pageY;
+                                                const initial = scrollInitial.get();
+                                                if (initial !== undefined && initial < y) {
+                                                    const distanceFromTop = innerContent.current?.scrollTop;
+                                                    if (distanceFromTop === 0) {
+                                                        const div = floatingRef.current;
+                                                        const rect = div.getBoundingClientRect();
+                                                        const v = floatingSize.get() || rect.height;
+                                                        const diff = (initial - y) / 10;
+                                                        const down = v + diff;
+                                                        const max = window.outerHeight;
+                                                        const screenHeightToClose = calculateClose(max);
+                                                        if (down < screenHeightToClose)
+                                                            onChange?.(false);
+                                                        floatingSize.set(down);
+                                                    }
+                                                }
+                                                scroll.set(touch.pageY);
+                                            }, children: children }), footer ? _jsx("footer", { className: "px-8 pt-4 w-full border-t select-text border-floating-border", children: footer }) : null, closable ? (_jsx("nav", { className: "absolute top-1 right-4 z-floating", children: _jsx(Dialog.Close, { render: _jsx("button", { type: "button", onClick: onClose, className: "p-1 opacity-70 transition-colors hover:opacity-100 hover:text-danger focus:text-danger" }), children: _jsx(XIcon, {}) }) })) : null] }) }) })] })) : null })] }));
 });

package/dist/components/form/autocomplete.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"autocomplete.d.ts","sourceRoot":"","sources":["../../../src/components/form/autocomplete.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAoF,MAAM,OAAO,CAAC;AASzG,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,MAAM,MAAM,qBAAqB,GAAG,WAAW,GAAG;IAAE,MAAM,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAErF,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,GAAG;IACtE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,qBAAqB,EAAE,CAAC;CACpC,CAAC;AAiCF,eAAO,MAAM,YAAY,yGAsWxB,CAAC"}
+{"version":3,"file":"autocomplete.d.ts","sourceRoot":"","sources":["../../../src/components/form/autocomplete.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAoF,MAAM,OAAO,CAAC;AASzG,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,MAAM,MAAM,qBAAqB,GAAG,WAAW,GAAG;IAAE,MAAM,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAErF,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,GAAG;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,qBAAqB,EAAE,CAAC;CAClC,CAAC;AAiCF,eAAO,MAAM,YAAY,yGAsWxB,CAAC"}

package/dist/components/form/autocomplete.js

@@ -22,7 +22,7 @@ const transitionStyles = {
 };
 const emptyRef = [];
 const List = forwardRef(function VirtualList(props, ref) {
-    return (_jsx(motion.ul, { ...props, ref: ref, className: "w-full overscroll-contain rounded-lg", children: _jsx(AnimatePresence, { children: props.children }) }));
+    return (_jsx(motion.ul, { ...props, ref: ref, className: "overscroll-contain w-full rounded-lg", children: _jsx(AnimatePresence, { children: props.children }) }));
 });
 const Item = forwardRef(function VirtualItem({ item, context, ...props }, ref) {
     return _jsx(motion.li, { ...props, ref: ref, className: "first:rounded-t-lg last:rounded-t-lg" });
@@ -174,7 +174,7 @@ export const Autocomplete = forwardRef(({ left, error, right, loading, options,
     const id = props.id || props.name;
     const shadowId = `${id}-shadow`;
     const isEmpty = displayList.length === 0;
-    return (_jsxs(InputField, { ...props, left: left, error: error, ref: fieldset, form: props.form, loading: loading, name: props.name, feedback: feedback, hideLeft: hideLeft, required: required, title: props.title, container: container, rightLabel: rightLabel, interactive: interactive, id: shadowId, optionalText: optionalText, componentName: "autocomplete", labelClassName: labelClassName, placeholder: props.placeholder, right: _jsxs("span", { className: "flex items-center gap-0.5", children: [right, _jsxs("button", { type: "button", className: "p-2 transition-colors link:text-primary md:p-1", onClick: onCaretDownClick, children: [_jsx(ChevronDown, { size: 20 }), _jsx("span", { className: "sr-only", children: translation.inputCaretDown })] }), value ? (_jsx("button", { type: "button", onClick: onClose, className: "p-2 transition-colors link:text-danger md:p-1", children: _jsx("svg", { width: "15", height: "15", viewBox: "0 0 15 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z", fill: "currentColor", fillRule: "evenodd", clipRule: "evenodd" }) }) })) : null] }), children: [_jsx("input", { "data-shadow": "true", ...getReferenceProps({
+    return (_jsxs(InputField, { ...props, left: left, error: error, ref: fieldset, form: props.form, loading: loading, name: props.name, feedback: feedback, hideLeft: hideLeft, required: required, title: props.title, container: container, rightLabel: rightLabel, interactive: interactive, id: shadowId, optionalText: optionalText, componentName: "autocomplete", labelClassName: labelClassName, placeholder: props.placeholder, right: _jsxs("span", { className: "flex gap-0.5 items-center", children: [right, _jsxs("button", { type: "button", className: "p-2 transition-colors md:p-1 link:text-primary", onClick: onCaretDownClick, children: [_jsx(ChevronDown, { size: 20 }), _jsx("span", { className: "sr-only", children: translation.inputCaretDown })] }), value ? (_jsx("button", { type: "button", onClick: onClose, className: "p-2 transition-colors md:p-1 link:text-danger", children: _jsx("svg", { width: "15", height: "15", viewBox: "0 0 15 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z", fill: "currentColor", fillRule: "evenodd", clipRule: "evenodd" }) }) })) : null] }), children: [_jsx("input", { "data-shadow": "true", ...getReferenceProps({
                     ...props,
                     onFocus,
                     pattern,
@@ -218,16 +218,16 @@ export const Autocomplete = forwardRef(({ left, error, right, loading, options,
                 }), "data-value": value, "data-error": !!error, "data-name": id, "data-target": id, required: required, value: open ? shadow : options.length === 0 ? "" : label || value, "aria-autocomplete": "list", autoComplete: "off", className: css("input placeholder-input-mask group h-input-height w-full flex-1", "rounded-md bg-transparent px-input-x py-input-y text-foreground", "outline-none transition-colors focus:ring-2 focus:ring-inset focus:ring-primary", "group-error:text-danger group-error:placeholder-input-mask-error", "text-base group-focus-within:border-primary group-hover:border-primary", props.className) }), _jsx("input", { id: id, name: id, type: "hidden", "data-origin": id, ref: externalRef, required: required, defaultValue: props.value || value || undefined }), _jsx(FloatingPortal, { preserveTabOrder: true, children: open ? (_jsx(FloatingFocusManager, { modal: true, guards: true, returnFocus: false, context: context, initialFocus: -1, visuallyHiddenDismiss: true, children: _jsxs(motion.div, { ...getFloatingProps({
                             ref: mergeRefs(removeScrollRef, refs.setFloating),
                             style: { ...transitions.styles, left: x, top: y ?? 0, position: strategy, height: "auto" },
-                        }), initial: false, "data-floating": "true", animate: { height: isEmpty ? "auto" : h }, className: "isolate z-floating m-0 max-h-80 origin-[top_center] list-none overscroll-contain rounded-b-lg rounded-t-lg border border-floating-border bg-floating-background p-0 text-foreground shadow-floating ease-in-out", onAnimationComplete: () => {
+                        }), initial: false, "data-floating": "true", animate: { height: isEmpty ? "auto" : h }, className: "overscroll-contain p-0 m-0 max-h-80 list-none rounded-t-lg rounded-b-lg border ease-in-out isolate z-floating origin-[top_center] border-floating-border bg-floating-background text-foreground shadow-floating", onAnimationComplete: () => {
                             if (!open)
                                 return setH(0);
                             const ul = refs.floating.current;
                             const li = ul.querySelectorAll("li").item(0);
                             const sum = (li ? li.getBoundingClientRect().height : MIN_SIZE) * displayList.length;
                             return flushSync(() => setH(sum + 10));
-                        }, children: [isEmpty ? (_jsx("div", { role: "option", className: "w-full border-b border-tooltip-border", children: _jsx("span", { className: "flex w-full justify-between p-2 text-left text-disabled", children: emptyMessage || translation.autocompleteEmpty }) })) : null, _jsx(Virtuoso, { overscan: 40, ref: virtuoso, hidden: isEmpty, data: displayList, 
+                        }, children: [isEmpty ? (_jsx("div", { role: "option", className: "w-full border-b border-tooltip-border", children: _jsx("span", { className: "flex justify-between p-2 w-full text-left text-disabled", children: emptyMessage || translation.autocompleteEmpty }) })) : null, _jsx(Virtuoso, { overscan: 40, ref: virtuoso, hidden: isEmpty, data: displayList, 
                                 // style={{ height: h - 10 }}
-                                defaultItemHeight: MIN_SIZE, components: components, scrollerRef: (e) => void (scroller.current = e), className: "max-h-full overscroll-contain rounded-lg border-floating bg-floating-background p-0 text-foreground", itemContent: (i, option) => {
+                                defaultItemHeight: MIN_SIZE, components: components, scrollerRef: (e) => void (scroller.current = e), className: "overscroll-contain p-0 max-h-full rounded-lg border-floating bg-floating-background text-foreground", itemContent: (i, option) => {
                                     const Label = option.Render ?? Frag;
                                     const active = value === option.value || value === option.label;
                                     const selected = index === i;

package/dist/components/form/multi-select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"multi-select.d.ts","sourceRoot":"","sources":["../../../src/components/form/multi-select.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAA6F,MAAM,OAAO,CAAC;AASlH,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAG9C,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,MAAM,MAAM,oBAAoB,GAAG,WAAW,GAAG;IAAE,MAAM,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAEpF,MAAM,MAAM,gBAAgB,GAAG,QAAQ,CACnC,eAAe,CAAC,OAAO,CAAC,EACxB;IACI,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,oBAAoB,EAAE,CAAC;IAChC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACjD,CACJ,CAAC;AA0DF,eAAO,MAAM,WAAW,wGAuavB,CAAC"}
+{"version":3,"file":"multi-select.d.ts","sourceRoot":"","sources":["../../../src/components/form/multi-select.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAA6F,MAAM,OAAO,CAAC;AASlH,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAG9C,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,MAAM,MAAM,oBAAoB,GAAG,WAAW,GAAG;IAAE,MAAM,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAEpF,MAAM,MAAM,gBAAgB,GAAG,QAAQ,CACrC,eAAe,CAAC,OAAO,CAAC,EACxB;IACE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,oBAAoB,EAAE,CAAC;IAChC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CAC/C,CACF,CAAC;AA0DF,eAAO,MAAM,WAAW,wGAuavB,CAAC"}