@g4rcez/components 2.0.13 → 2.0.14

package/dist/components/display/calendar.js

@@ -44,12 +44,12 @@ const focusDate = (origin, root, next, delay = 0) => {
     const select = () => {
         if (origin?.dataset.focustrap) {
             const el = root.current?.querySelector(`button[data-focustrap="${origin?.dataset.focustrap}"]`);
-            return setTimeout(() => el?.focus({ preventScroll: false }), delay);
+            return setTimeout(() => el?.focus({ preventScroll: true }), delay);
         }
         if (root.current) {
             const element = root.current.querySelector(`button[data-date="${d}"]`);
             if (element)
-                return element.focus({ preventScroll: false });
+                return element.focus({ preventScroll: true });
         }
     };
     if (delay === 0)

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":"AACA,OAAO,EASH,KAAK,YAAY,EACpB,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAAmB,eAAe,EAAqE,MAAM,cAAc,CAAC;AAEnI,OAAO,KAA+G,MAAM,OAAO,CAAC;AAIpI,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,CAC7B,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;IAC5E,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,GAAG,OAAO,CAAC;IACR,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,IAAI,EAAE,QAAQ,GAAG,SAAS,CAAC;IAC3B,YAAY,EAAE,YAAY,EAAE,CAAC;IAC7B,OAAO,EAAE,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CAClC,CAAC,CACL,CAAC;AAgFF,KAAK,QAAQ,GAAG;IAAE,OAAO,EAAE,GAAG,CAAC;IAAC,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAA;CAAE,CAAC;AAI/D,eAAO,MAAM,KAAK;WAzGJ,KAAK;gBAAc,MAAM;;UACzB,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;UACpB,QAAQ,GAAG,SAAS;kBACZ,YAAY,EAAE;aACnB,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC;;;;eAnBmB,MAAM;YAAU,KAAK;;UAChE,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;UACpB,QAAQ,GAAG,SAAS;kBACZ,YAAY,EAAE;aACnB,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC;;;2CA4UrC,CAAC"}
+{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/floating/modal.tsx"],"names":[],"mappings":"AACA,OAAO,EASH,KAAK,YAAY,EACpB,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAAmB,eAAe,EAAmF,MAAM,cAAc,CAAC;AAEjJ,OAAO,KAA+G,MAAM,OAAO,CAAC;AAIpI,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,CAC7B,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;IAC5E,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,GAAG,OAAO,CAAC;IACR,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,IAAI,EAAE,QAAQ,GAAG,SAAS,CAAC;IAC3B,YAAY,EAAE,YAAY,EAAE,CAAC;IAC7B,OAAO,EAAE,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CAClC,CAAC,CACL,CAAC;AAgFF,KAAK,QAAQ,GAAG;IAAE,OAAO,EAAE,GAAG,CAAC;IAAC,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAA;CAAE,CAAC;AAI/D,eAAO,MAAM,KAAK;WAzGJ,KAAK;gBAAc,MAAM;;UACzB,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;UACpB,QAAQ,GAAG,SAAS;kBACZ,YAAY,EAAE;aACnB,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC;;;;eAnBmB,MAAM;YAAU,KAAK;;UAChE,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;UACpB,QAAQ,GAAG,SAAS;kBACZ,YAAY,EAAE;aACnB,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC;;;2CA8UrC,CAAC"}

package/dist/components/floating/modal.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { FloatingFocusManager, FloatingOverlay, FloatingPortal, useClick, useDismiss, useFloating, useInteractions, useRole, } from "@floating-ui/react";
 import { cva } from "class-variance-authority";
 import { XIcon } from "lucide-react";
-import { AnimatePresence, motion, useMotionValue } from "motion/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";
@@ -82,7 +82,7 @@ const Draggable = (props) => {
             ? "top-1 flex h-3 w-full justify-center py-2"
             : props.position === "left"
                 ? "right-5 top-1/2 h-10 w-2"
-                : "left-2 top-1/2 h-10 w-2"), children: props.sheet ? _jsx("div", { className: "h-2 w-1/4 rounded-lg bg-floating-border" }) : null }));
+                : "left-2 top-1/2 h-10 w-2"), children: props.sheet ? _jsx("div", { className: "w-1/4 h-2 rounded-lg bg-floating-border" }) : null }));
 };
 const positions = { drawer: "right", sheet: "none", dialog: "none" };
 const fetchPosition = (isDesktop, forceType, propsType, propsPosition) => {
@@ -168,41 +168,41 @@ export const Modal = forwardRef(({ open, title, footer, asChild, trigger, childr
     } : { animate: animated, initial: false };
     const scrollInitial = useMotionValue(undefined);
     const scroll = useMotionValue(undefined);
-    return (_jsxs(Fragment, { children: [trigger ? (_jsx(Fragment, { children: asChild ? (_jsx(Slot, { ref: floating.refs.setReference, ...interactions.getReferenceProps({ layoutId: layoutId }), children: Trigger })) : (_jsx(motion.button, { ref: floating.refs.setReference, ...interactions.getReferenceProps(), layoutId: layoutId, type: "button", children: Trigger })) })) : null, _jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(AnimatePresence, { propagate: true, mode: "wait", initial: false, children: open ? (_jsx(FloatingOverlay, { lockScroll: true, className: css("inset-0 isolate z-overlay h-[100dvh] !overflow-clip bg-floating-overlay/70", type === "drawer" ? "" : "flex items-start justify-center p-10", overlayClassName), children: _jsx(FloatingFocusManager, { guards: true, visuallyHiddenDismiss: true, modal: true, closeOnFocusOut: true, context: floating.context, children: _jsxs(motion.div, { ...props, ...(title
-                                    ? {
-                                        "aria-labelledby": headingId,
-                                        "aria-describedby": descriptionId,
-                                    }
-                                    : { "aria-label": ariaTitle }), ...interactions.getFloatingProps({
-                                    "aria-modal": open,
-                                    ref: mergeRefs(floating.refs.setFloating, removeScrollRef),
-                                    className: css(variants({ position, type }), className, "isolate overscroll-contain"),
-                                }), 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: floating.refs.floating })) : null, title ? (_jsx(motion.header, { ...draggableMotionProps, className: "relative isolate w-full", children: title ? (_jsx("h2", { id: headingId, className: "select-text border-b border-floating-border px-8 pb-2 text-3xl font-medium leading-relaxed block", children: title })) : null })) : null, _jsx(motion.section, { ref: innerContent, "data-component": "modal-body", dragConstraints: dragConstraints, drag: isDesktop ? "y" : undefined, onDrag: type === "sheet" ? (isDesktop ? onDragBody : undefined) : 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 < y) {
-                                                const distanceFromTop = innerContent.current?.scrollTop;
-                                                if (distanceFromTop === 0) {
-                                                    const div = floating.refs.floating.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(Fragment, { children: [trigger ? (_jsx(Fragment, { children: asChild ? (_jsx(Slot, { ref: floating.refs.setReference, ...interactions.getReferenceProps({ layoutId: layoutId }), children: Trigger })) : (_jsx(motion.button, { ref: floating.refs.setReference, ...interactions.getReferenceProps(), layoutId: layoutId, type: "button", children: Trigger })) })) : null, _jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(AnimatePresence, { propagate: true, mode: "wait", initial: false, children: open ? (_jsx(FloatingOverlay, { lockScroll: true, className: css("inset-0 isolate z-overlay h-[100dvh] !overflow-clip bg-floating-overlay/70", type === "drawer" ? "" : "flex items-start justify-center p-10", overlayClassName), children: _jsx(MotionConfig, { reducedMotion: animated ? "user" : "always", children: _jsx(FloatingFocusManager, { guards: true, visuallyHiddenDismiss: true, modal: true, closeOnFocusOut: true, context: floating.context, children: _jsxs(motion.div, { ...props, ...(title
+                                        ? {
+                                            "aria-labelledby": headingId,
+                                            "aria-describedby": descriptionId,
+                                        }
+                                        : { "aria-label": ariaTitle }), ...interactions.getFloatingProps({
+                                        "aria-modal": open,
+                                        ref: mergeRefs(floating.refs.setFloating, removeScrollRef),
+                                        className: css(variants({ position, type }), className, "isolate overscroll-contain"),
+                                    }), 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: floating.refs.floating })) : null, title ? (_jsx(motion.header, { ...draggableMotionProps, className: "relative w-full isolate", children: title ? (_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 })) : null, _jsx(motion.section, { ref: innerContent, "data-component": "modal-body", dragConstraints: dragConstraints, drag: isDesktop ? "y" : undefined, onDrag: type === "sheet" ? (isDesktop ? onDragBody : undefined) : 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 < y) {
+                                                    const distanceFromTop = innerContent.current?.scrollTop;
+                                                    if (distanceFromTop === 0) {
+                                                        const div = floating.refs.floating.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: "w-full select-text border-t border-floating-border px-8 pt-4", children: footer })) : null, closable ? (_jsx("nav", { className: "absolute right-4 top-1 z-floating", 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] }) }) })) : null }, headingId) })] }));
+                                                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("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 }, headingId) })] }));
 });