@g4rcez/components 0.0.45 → 0.0.46

package/dist/preset.tailwind.js

@@ -18,7 +18,7 @@ const config = {
             fill: COLORS,
             colors: COLORS,
             placeholderColor: COLORS,
-            borderColors: Object.assign(Object.assign({}, COLORS), { DEFAULT: COLORS.card.border }),
+            borderColors: { ...COLORS, DEFAULT: COLORS.card.border },
             zIndex: {
                 normal: "1",
                 tooltip: "13",

package/dist/src/components/core/button.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import { forwardRef } from "react";
@@ -41,9 +40,7 @@ const buttonVariants = cva("relative overflow-hidden inline-flex duration-500 en
     },
     defaultVariants: { theme: "main", size: "default", rounded: "default" },
 });
-export const Button = forwardRef(function Button(_a, ref) {
-    var _b;
-    var { className, icon, loading, theme, type = "button", size, rounded } = _a, props = __rest(_a, ["className", "icon", "loading", "theme", "type", "size", "rounded"]);
+export const Button = forwardRef(function Button({ className, icon, loading, theme, type = "button", size, rounded, ...props }, ref) {
     const disabled = loading || props.disabled;
-    return (_jsxs(Polymorph, Object.assign({}, props, { ref: ref, type: type, "data-theme": theme, "data-loading": loading, disabled: disabled, "aria-busy": disabled || loading, as: (_b = props.as) !== null && _b !== void 0 ? _b : "button", onClick: disabled ? undefined : props.onClick, className: css(buttonVariants({ size, rounded, theme }), className), children: [icon, props.children] })));
+    return (_jsxs(Polymorph, { ...props, ref: ref, type: type, "data-theme": theme, "data-loading": loading, disabled: disabled, "aria-busy": disabled || loading, as: props.as ?? "button", onClick: disabled ? undefined : props.onClick, className: css(buttonVariants({ size, rounded, theme }), className), children: [icon, props.children] }));
 });

package/dist/src/components/core/polymorph.js

@@ -1,8 +1,6 @@
-import { __rest } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-export const Polymorph = forwardRef(function Polymorph(_a, ref) {
-    var { as } = _a, props = __rest(_a, ["as"]);
+export const Polymorph = forwardRef(function Polymorph({ as, ...props }, ref) {
     const Component = as || "span";
-    return _jsx(Component, Object.assign({}, props, { ref: ref }));
+    return _jsx(Component, { ...props, ref: ref });
 });

package/dist/src/components/core/tag.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import { forwardRef } from "react";
@@ -38,8 +37,6 @@ const tagVariants = cva("inline-flex rounded-pill gap-1.5 border-2 border-transp
     },
     defaultVariants: { theme: "primary", size: "default" },
 });
-export const Tag = forwardRef(function Tag(_a, ref) {
-    var _b;
-    var { className, indicator = undefined, icon, loading, theme, size } = _a, props = __rest(_a, ["className", "indicator", "icon", "loading", "theme", "size"]);
-    return (_jsxs(Polymorph, Object.assign({}, props, { ref: ref, "data-theme": theme, as: (_b = props.as) !== null && _b !== void 0 ? _b : "span", className: css(tagVariants({ size, theme }), className), children: [indicator ? _jsx("span", { className: indicatorVariant({ theme: indicator }) }) : null, icon, props.children] })));
+export const Tag = forwardRef(function Tag({ className, indicator = undefined, icon, loading, theme, size, ...props }, ref) {
+    return (_jsxs(Polymorph, { ...props, ref: ref, "data-theme": theme, as: props.as ?? "span", className: css(tagVariants({ size, theme }), className), children: [indicator ? _jsx("span", { className: indicatorVariant({ theme: indicator }) }) : null, icon, props.children] }));
 });

package/dist/src/components/display/alert.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import { motion } from "framer-motion";
@@ -15,7 +14,7 @@ const transition = {
     duration: 0.7,
     ease: [0.04, 0.62, 0.23, 0.98],
 };
-export const Collapse = (props) => (_jsx(motion.div, Object.assign({}, props, { layout: true, layoutRoot: true, layoutScroll: true, initial: false, animate: props.open.toString(), "aria-hidden": !props.open, className: props.className, exit: variants.false, transition: transition, variants: variants, children: props.children })));
+export const Collapse = (props) => (_jsx(motion.div, { ...props, layout: true, layoutRoot: true, layoutScroll: true, initial: false, animate: props.open.toString(), "aria-hidden": !props.open, className: props.className, exit: variants.false, transition: transition, variants: variants, children: props.children }));
 const alertVariants = cva("p-4 w-full block border relative rounded-lg text-sm", {
     variants: {
         theme: {
@@ -30,8 +29,6 @@ const alertVariants = cva("p-4 w-full block border relative rounded-lg text-sm",
     },
     defaultVariants: { theme: "neutral" },
 });
-export const Alert = forwardRef(function Alert(_a, ref) {
-    var _b;
-    var { className, theme, Icon, onClose, open = true } = _a, props = __rest(_a, ["className", "theme", "Icon", "onClose", "open"]);
-    return (_jsx("div", { "data-open": !!open, "aria-hidden": !open, className: "pointer-events-none w-full isolate data-[open=true]:pointer-events-auto data-[open=true]:mb-4", children: _jsx(Collapse, { "data-open": !!open, open: !!open, children: _jsxs(Polymorph, Object.assign({}, props, { className: css(alertVariants({ theme }), className), ref: ref, "data-theme": theme, role: "alert", as: (_b = props.as) !== null && _b !== void 0 ? _b : "div", children: [_jsxs("h4", { className: "mb-2 flex items-center gap-2", children: [!Icon && theme === "success" ? _jsx(CheckCircleIcon, { size: 20 }) : null, !Icon && theme === "info" ? _jsx(InfoIcon, { size: 20 }) : null, !Icon && theme === "danger" ? _jsx(TriangleAlertIcon, { size: 20 }) : null, Icon, _jsx("span", { className: "tracking-3 text-balance text-lg font-semibold", children: props.title })] }), props.children, onClose !== undefined ? (_jsx("button", { type: "button", onClick: () => onClose(false), className: "absolute right-3 top-3 text-foreground transition-colors duration-300 ease-in-out hover:text-danger", children: _jsx(XIcon, { size: 20 }) })) : null] })) }) }));
+export const Alert = forwardRef(function Alert({ className, theme, Icon, onClose, open = true, ...props }, ref) {
+    return (_jsx("div", { "data-open": !!open, "aria-hidden": !open, className: "pointer-events-none w-full isolate data-[open=true]:pointer-events-auto data-[open=true]:mb-4", children: _jsx(Collapse, { "data-open": !!open, open: !!open, children: _jsxs(Polymorph, { ...props, className: css(alertVariants({ theme }), className), ref: ref, "data-theme": theme, role: "alert", as: props.as ?? "div", children: [_jsxs("h4", { className: "mb-2 flex items-center gap-2", children: [!Icon && theme === "success" ? _jsx(CheckCircleIcon, { size: 20 }) : null, !Icon && theme === "info" ? _jsx(InfoIcon, { size: 20 }) : null, !Icon && theme === "danger" ? _jsx(TriangleAlertIcon, { size: 20 }) : null, Icon, _jsx("span", { className: "tracking-3 text-balance text-lg font-semibold", children: props.title })] }), props.children, onClose !== undefined ? (_jsx("button", { type: "button", onClick: () => onClose(false), className: "absolute right-3 top-3 text-foreground transition-colors duration-300 ease-in-out hover:text-danger", children: _jsx(XIcon, { size: 20 }) })) : null] }) }) }));
 });

package/dist/src/components/display/calendar.js

@@ -1,5 +1,4 @@
 "use client";
-import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { addDays, addMonths, addWeeks, addYears, eachDayOfInterval, endOfWeek, isAfter, isBefore, isSameMonth, isToday, startOfDay, startOfMonth, startOfWeek, subDays, subMonths, subWeeks, subYears, } from "date-fns";
 import { AnimatePresence, motion, MotionConfig } from "framer-motion";
@@ -39,10 +38,9 @@ const onChangeUsingKeyboard = {
 const focusDate = (origin, root, next, delay = 0) => {
     const d = next.toISOString();
     const select = () => {
-        var _a;
-        if (!!(origin === null || origin === void 0 ? void 0 : origin.dataset.focustrap)) {
-            const el = (_a = root.current) === null || _a === void 0 ? void 0 : _a.querySelector(`button[data-focustrap="${origin === null || origin === void 0 ? void 0 : origin.dataset.focustrap}"]`);
-            return setTimeout(() => el === null || el === void 0 ? void 0 : el.focus({ preventScroll: false }), delay);
+        if (!!origin?.dataset.focustrap) {
+            const el = root.current?.querySelector(`button[data-focustrap="${origin?.dataset.focustrap}"]`);
+            return setTimeout(() => el?.focus({ preventScroll: false }), delay);
         }
         if (root.current) {
             const element = root.current.querySelector(`button[data-date="${d}"]`);
@@ -60,8 +58,7 @@ const inRange = (start, middle, end) => {
         return false;
     return isAfter(middle, start) && isBefore(middle, end);
 };
-export const Calendar = (_a) => {
-    var { RenderOnDay, changeOnlyOnClick = false, disabledDate, locale, markToday = true, onChangeMonth, onChangeYear, rangeMode = false, onChange, styles } = _a, props = __rest(_a, ["RenderOnDay", "changeOnlyOnClick", "disabledDate", "locale", "markToday", "onChangeMonth", "onChangeYear", "rangeMode", "onChange", "styles"]);
+export const Calendar = ({ RenderOnDay, changeOnlyOnClick = false, disabledDate, locale, markToday = true, onChangeMonth, onChangeYear, rangeMode = false, onChange, styles, ...props }) => {
     const translate = useTranslations();
     const root = useRef(null);
     const { date, range } = props;
@@ -73,7 +70,7 @@ export const Calendar = (_a) => {
         year: formatYear(now),
         months: getOptionsMonth(now, locale),
         direction: undefined,
-        range: { from: range === null || range === void 0 ? void 0 : range.from, to: range === null || range === void 0 ? void 0 : range.to },
+        range: { from: range?.from, to: range?.to },
         selectMode: (rangeMode ? "from" : undefined),
         week: eachDayOfInterval({ start: startOfWeek(now), end: endOfWeek(now) }),
     }, (get) => ({
@@ -130,7 +127,7 @@ export const Calendar = (_a) => {
                 const i = month.dataset.index || "";
                 const d = new Date(get.state().date);
                 d.setMonth(+i);
-                return Object.assign(Object.assign({}, state), { date: d, year: formatYear(d) });
+                return { ...state, date: d, year: formatYear(d) };
             }
             return state;
         },
@@ -144,7 +141,7 @@ export const Calendar = (_a) => {
                 const date = Is.keyof(onChangeUsingKeyboard, key) ? onChangeUsingKeyboard[key](prev, e.shiftKey ? "month" : "days") : null;
                 if (date !== null) {
                     focusDate(e.target, root, date);
-                    return Object.assign(Object.assign({}, state), { date, year: formatYear(date) });
+                    return { ...state, date, year: formatYear(date) };
                 }
             }
             return get.state();
@@ -153,27 +150,25 @@ export const Calendar = (_a) => {
         props: { onChangeMonth, onChangeYear },
         postMiddleware: [
             (state, _, args) => {
-                var _a, _b;
                 const isValidMethod = args.method === "onChangeMonth" || args.method === "previousMonth" || args.method === "nextMonth";
                 if (isValidMethod)
-                    (_b = (_a = args.props).onChangeMonth) === null || _b === void 0 ? void 0 : _b.call(_a, state.date);
+                    args.props.onChangeMonth?.(state.date);
                 return state;
             },
             (state, _, args) => {
-                var _a, _b;
                 const isValidMethod = args.method === "onChangeYear";
                 if (isValidMethod)
-                    (_b = (_a = args.props).onChangeYear) === null || _b === void 0 ? void 0 : _b.call(_a, state.date);
+                    args.props.onChangeYear?.(state.date);
                 return state;
             },
             (state, _, args) => {
                 const isValidMethod = args.method === "onSelectDate" || args.method === "setToday" || args.method === "onKeyDown";
                 if (rangeMode && isValidMethod && changeOnlyOnClick) {
-                    onChange === null || onChange === void 0 ? void 0 : onChange(state.range);
+                    onChange?.(state.range);
                     return state;
                 }
                 if (isValidMethod && changeOnlyOnClick)
-                    onChange === null || onChange === void 0 ? void 0 : onChange(state.date);
+                    onChange?.(state.date);
                 return state;
             },
         ],
@@ -183,7 +178,7 @@ export const Calendar = (_a) => {
     const monthString = formatMonth(state.date, locale);
     useEffect(() => {
         if (!changeOnlyOnClick)
-            onChange === null || onChange === void 0 ? void 0 : onChange(state.date);
+            onChange?.(state.date);
     }, [currentAsString]);
     const defer = useDebounce((y) => {
         dispatch.date((prev) => {
@@ -195,21 +190,20 @@ export const Calendar = (_a) => {
     const internalOnChangeYear = (e) => {
         const value = e.currentTarget.value;
         dispatch.onChangeYear(value);
-        onChangeYear === null || onChangeYear === void 0 ? void 0 : onChangeYear(new Date(value));
+        onChangeYear?.(new Date(value));
         defer(value);
     };
-    return (_jsx(MotionConfig, { transition: transition, children: _jsxs("div", { ref: root, className: css("relative overflow-hidden", styles === null || styles === void 0 ? void 0 : styles.calendar), children: [_jsx("div", { className: "flex flex-col justify-center rounded text-center", children: _jsx(AnimatePresence, { initial: false, mode: "popLayout", custom: state.direction, onExitComplete: dispatch.onExitComplete, children: _jsxs(motion.div, { initial: "enter", animate: "middle", exit: "exit", children: [_jsxs("header", { className: "relative flex justify-between", children: [_jsx(motion.button, { layout: true, "data-focustrap": "prev", variants: removeImmediately, onClick: dispatch.previousMonth, className: "z-calendar rounded-full p-1.5 hover:bg-primary", children: _jsx(ChevronLeftIcon, { className: "h-4 w-4" }) }), _jsx(motion.span, { layout: true, variants: variants, custom: state.direction, className: "absolute inset-0 isolate z-normal flex items-center justify-center font-semibold", children: _jsxs("span", { className: "flex w-fit items-center justify-center gap-0.5 py-1", children: [_jsx("select", { style: { width: `${monthString.length}ch` }, value: monthString, onChange: dispatch.onChangeMonth, className: "w-fit cursor-pointer appearance-none bg-transparent capitalize proportional-nums hover:text-primary", children: state.months }), _jsx(TheMaskInput, { mask: "int", value: state.year, maxLength: 4, placeholder: "YYYY", onChange: internalOnChangeYear, style: { width: `${state.year.length}ch` }, className: "w-16 cursor-pointer appearance-none bg-transparent hover:text-primary" })] }) }), _jsx(motion.button, { layout: true, "data-focustrap": "next", variants: removeImmediately, className: "z-calendar rounded-full p-1.5 hover:bg-primary", onClick: dispatch.nextMonth, children: _jsx(ChevronRightIcon, { className: "h-4 w-4" }) }), _jsx("div", { className: "absolute inset-0", style: {
+    return (_jsx(MotionConfig, { transition: transition, children: _jsxs("div", { ref: root, className: css("relative overflow-hidden", styles?.calendar), children: [_jsx("div", { className: "flex flex-col justify-center rounded text-center", children: _jsx(AnimatePresence, { initial: false, mode: "popLayout", custom: state.direction, onExitComplete: dispatch.onExitComplete, children: _jsxs(motion.div, { initial: "enter", animate: "middle", exit: "exit", children: [_jsxs("header", { className: "relative flex justify-between", children: [_jsx(motion.button, { layout: true, "data-focustrap": "prev", variants: removeImmediately, onClick: dispatch.previousMonth, className: "z-calendar rounded-full p-1.5 hover:bg-primary", children: _jsx(ChevronLeftIcon, { className: "h-4 w-4" }) }), _jsx(motion.span, { layout: true, variants: variants, custom: state.direction, className: "absolute inset-0 isolate z-normal flex items-center justify-center font-semibold", children: _jsxs("span", { className: "flex w-fit items-center justify-center gap-0.5 py-1", children: [_jsx("select", { style: { width: `${monthString.length}ch` }, value: monthString, onChange: dispatch.onChangeMonth, className: "w-fit cursor-pointer appearance-none bg-transparent capitalize proportional-nums hover:text-primary", children: state.months }), _jsx(TheMaskInput, { mask: "int", value: state.year, maxLength: 4, placeholder: "YYYY", onChange: internalOnChangeYear, style: { width: `${state.year.length}ch` }, className: "w-16 cursor-pointer appearance-none bg-transparent hover:text-primary" })] }) }), _jsx(motion.button, { layout: true, "data-focustrap": "next", variants: removeImmediately, className: "z-calendar rounded-full p-1.5 hover:bg-primary", onClick: dispatch.nextMonth, children: _jsx(ChevronRightIcon, { className: "h-4 w-4" }) }), _jsx("div", { className: "absolute inset-0", style: {
                                                 backgroundImage: "linear-gradient(to right, hsla(var(--card-background)) 15%, transparent 30%, transparent 70%, hsla(var(--card-background)) 85%)",
-                                            } })] }), _jsxs(motion.table, { className: "mt-2 table min-w-full table-auto border-0", children: [_jsx("thead", { children: _jsx("tr", { children: state.week.map((dayOfWeek) => (_jsx("th", { className: css("py-2 text-sm font-medium capitalize", styles === null || styles === void 0 ? void 0 : styles.weekDay), children: dayOfWeek.toLocaleDateString(locale, { weekday: "short" }) }, dayOfWeek.toString()))) }) }), _jsx(motion.tbody, { layout: true, variants: variants, custom: state.direction, onKeyDown: dispatch.onKeyDown, className: css(styles === null || styles === void 0 ? void 0 : styles.week), children: zip.map((week, index) => (_jsx("tr", { className: styles === null || styles === void 0 ? void 0 : styles.week, children: week.map((day) => {
-                                                    var _a, _b, _c, _d;
+                                            } })] }), _jsxs(motion.table, { className: "mt-2 table min-w-full table-auto border-0", children: [_jsx("thead", { children: _jsx("tr", { children: state.week.map((dayOfWeek) => (_jsx("th", { className: css("py-2 text-sm font-medium capitalize", styles?.weekDay), children: dayOfWeek.toLocaleDateString(locale, { weekday: "short" }) }, dayOfWeek.toString()))) }) }), _jsx(motion.tbody, { layout: true, variants: variants, custom: state.direction, onKeyDown: dispatch.onKeyDown, className: css(styles?.week), children: zip.map((week, index) => (_jsx("tr", { className: styles?.week, children: week.map((day) => {
                                                     const key = day.toISOString();
                                                     const isSelected = rangeMode
-                                                        ? key === ((_a = range === null || range === void 0 ? void 0 : range.to) === null || _a === void 0 ? void 0 : _a.toISOString()) || key === ((_b = range === null || range === void 0 ? void 0 : range.from) === null || _b === void 0 ? void 0 : _b.toISOString())
-                                                        : key === (date === null || date === void 0 ? void 0 : date.toISOString());
+                                                        ? key === range?.to?.toISOString() || key === range?.from?.toISOString()
+                                                        : key === date?.toISOString();
                                                     const today = isToday(day) && markToday;
-                                                    const disabledByFn = (disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(day)) || false;
+                                                    const disabledByFn = disabledDate?.(day) || false;
                                                     const disableDate = !isSameMonth(day, state.date) || disabledByFn;
-                                                    const isInRange = rangeMode ? inRange(range === null || range === void 0 ? void 0 : range.from, day, range === null || range === void 0 ? void 0 : range.to) : false;
-                                                    return (_jsxs("td", { align: "center", className: css("relative", styles === null || styles === void 0 ? void 0 : styles.dayFrame), children: [_jsxs("button", { type: "button", "data-date": key, disabled: disabledByFn, "data-range": rangeMode, onClick: dispatch.onSelectDate, "data-view": state.date.getMonth().toString(), className: css(`flex size-10 items-center justify-center rounded-full font-semibold proportional-nums disabled:cursor-not-allowed ${today ? "text-primary" : ""} ${disableDate ? "text-disabled" : ""} ${isSelected ? "bg-primary text-primary-foreground" : ""}`, styles === null || styles === void 0 ? void 0 : styles.day, isInRange ? "size-10 border border-dashed border-card-border" : ""), children: [day.getDate(), isSelected && ((_c = state.range.from) === null || _c === void 0 ? void 0 : _c.toISOString()) === key ? (_jsx("span", { className: "absolute -top-2 left-0 h-full w-full", children: _jsx("span", { className: "text-xs", children: translate.calendarFromDate }) })) : null, isSelected && ((_d = state.range.to) === null || _d === void 0 ? void 0 : _d.toISOString()) === key ? (_jsx("span", { className: "absolute -top-2 left-0 h-full w-full", children: _jsx("span", { className: "text-xs", children: translate.calendarToDate }) })) : null] }), RenderOnDay ? _jsx(RenderOnDay, { date: day }) : null] }, key));
+                                                    const isInRange = rangeMode ? inRange(range?.from, day, range?.to) : false;
+                                                    return (_jsxs("td", { align: "center", className: css("relative", styles?.dayFrame), children: [_jsxs("button", { type: "button", "data-date": key, disabled: disabledByFn, "data-range": rangeMode, onClick: dispatch.onSelectDate, "data-view": state.date.getMonth().toString(), className: css(`flex size-10 items-center justify-center rounded-full font-semibold proportional-nums disabled:cursor-not-allowed ${today ? "text-primary" : ""} ${disableDate ? "text-disabled" : ""} ${isSelected ? "bg-primary text-primary-foreground" : ""}`, styles?.day, isInRange ? "size-10 border border-dashed border-card-border" : ""), children: [day.getDate(), isSelected && state.range.from?.toISOString() === key ? (_jsx("span", { className: "absolute -top-2 left-0 h-full w-full", children: _jsx("span", { className: "text-xs", children: translate.calendarFromDate }) })) : null, isSelected && state.range.to?.toISOString() === key ? (_jsx("span", { className: "absolute -top-2 left-0 h-full w-full", children: _jsx("span", { className: "text-xs", children: translate.calendarToDate }) })) : null] }), RenderOnDay ? _jsx(RenderOnDay, { date: day }) : null] }, key));
                                                 }) }, `week-${week.length}-${index}`))) })] })] }, monthString) }) }), _jsx("footer", { className: "mt-2 text-center text-primary", children: _jsx("button", { className: "duration-300 transition-transform hover:scale-105", type: "button", onClick: dispatch.setToday, children: "Today" }) })] }) }));
 };

package/dist/src/components/display/card.js

@@ -1,8 +1,4 @@
-import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { css } from "../../lib/dom";
 import { Polymorph } from "../core/polymorph";
-export const Card = (_a) => {
-    var { children, title, as = "div", container = "", header = null, className = "" } = _a, props = __rest(_a, ["children", "title", "as", "container", "header", "className"]);
-    return (_jsxs(Polymorph, Object.assign({}, props, { as: as, className: css("flex flex-col gap-4 rounded-card border border-card-border bg-card-background py-4 pb-8 shadow", container), children: [title ? _jsx("header", { className: "mb-2 w-full border-b border-card-border px-8 pb-4 text-xl font-medium", children: title }) : header, _jsx("div", { className: css("min-w-full px-8", className), children: children })] })));
-};
+export const Card = ({ children, title, as = "div", container = "", header = null, className = "", ...props }) => (_jsxs(Polymorph, { ...props, as: as, className: css("flex flex-col gap-4 rounded-card border border-card-border bg-card-background py-4 pb-8 shadow", container), children: [title ? _jsx("header", { className: "mb-2 w-full border-b border-card-border px-8 pb-4 text-xl font-medium", children: title }) : header, _jsx("div", { className: css("min-w-full px-8", className), children: children })] }));

package/dist/src/components/display/list.js

@@ -3,7 +3,7 @@ import { FloatingFocusManager, FloatingOverlay, FloatingPortal, useClick, useDis
 import { AnimatePresence, motion, MotionConfig } from "framer-motion";
 import { XIcon } from "lucide-react";
 import React, { Fragment, useCallback, useId, useState } from "react";
-const FloatItem = ({ item, context, setter, get, refs }) => (_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 })] }) }) }));
+const FloatItem = ({ item, context, setter, get, refs }) => (_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, { 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();
@@ -23,7 +23,7 @@ export const AnimatedList = (props) => {
     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 innerId = `${id}-${index}`;
-                    const setter = () => setSelected(Object.assign(Object.assign({}, item), { id: innerId }));
+                    const setter = () => setSelected({ ...item, id: innerId });
                     const Leading = item.leading;
                     return (_jsx(motion.li, { layout: true, layoutId: `item-${innerId}`, className: `border-b border-card-border py-2 last:border-transparent`, children: _jsx(motion.div, { layoutId: `toast-${innerId}`, className: "relative", children: _jsx("div", { className: "relative flex items-start space-x-3", children: _jsxs(Fragment, { children: [item.avatar ? (_jsx("div", { children: _jsx("div", { className: "relative px-1", children: _jsx("button", { onClick: setter, className: "flex size-10 items-center justify-center ring-primary", children: item.avatar }) }) })) : null, _jsx("div", { className: "min-w-0 flex-1 py-1 text-foreground", children: _jsxs("div", { className: "flex flex-row flex-nowrap justify-between gap-4", children: [_jsxs("button", { onClick: setter, className: "ease-out cursor-pointer text-left transition-all hover:scale-105 hover:text-primary", children: [_jsx("h3", { children: item.title }), _jsx("p", { className: "text-sm leading-snug text-secondary", children: item.description })] }), Leading ? _jsx(Leading, { open: setter }) : null] }) })] }) }) }) }, innerId));
                 }) })] }));

package/dist/src/components/display/notifications.js

@@ -30,8 +30,7 @@ const animatedIndex = {
     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 closable = props.closable ?? true;
     const duration = props.duration;
     const variant = props.hover ? "hover" : props.isLast ? "isLast" : "other";
     const className = variants({ theme: props.theme || "default" });
@@ -52,7 +51,7 @@ export function Notifications({ children, max = 5, duration = 5000 }) {
     const notify = useCallback((text, args) => {
         const id = window.crypto.randomUUID();
         setMessages((prev) => {
-            const newItems = [...prev, Object.assign(Object.assign({}, args), { id, text })];
+            const newItems = [...prev, { ...args, id, text }];
             if (newItems.length > max)
                 return newItems.slice(newItems.length - max, newItems.length + 1);
             return newItems;
@@ -62,7 +61,7 @@ export function Notifications({ children, max = 5, duration = 5000 }) {
     }, [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) })));
+                    return (_createElement(Notification, { ...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`,

package/dist/src/components/display/step.js

@@ -12,8 +12,8 @@ const states = {
     initial: { pathLength: 0, opacity: 0 },
     animate: { pathLength: 1, opacity: 1 },
 };
-const ErrorIcon = (props) => (_jsxs("svg", Object.assign({}, props, { viewBox: "0 0 24 24", fill: "currentColor", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx(motion.path, { className: "currentColor", initial: states.initial, animate: states.animate, transition: iconTransitions, d: "M18 6 6 18" }), _jsx(motion.path, { className: "currentColor", initial: states.initial, animate: states.animate, transition: iconTransitions, d: "m6 6 12 12" })] })));
-const CheckIcon = (props) => (_jsx("svg", Object.assign({}, props, { fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 3, children: _jsx(motion.path, { initial: states.initial, animate: states.animate, transition: iconTransitions, strokeLinecap: "round", strokeLinejoin: "round", d: "M5 13l4 4L19 7" }) })));
+const ErrorIcon = (props) => (_jsxs("svg", { ...props, viewBox: "0 0 24 24", fill: "currentColor", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx(motion.path, { className: "currentColor", initial: states.initial, animate: states.animate, transition: iconTransitions, d: "M18 6 6 18" }), _jsx(motion.path, { className: "currentColor", initial: states.initial, animate: states.animate, transition: iconTransitions, d: "m6 6 12 12" })] }));
+const CheckIcon = (props) => (_jsx("svg", { ...props, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 3, children: _jsx(motion.path, { initial: states.initial, animate: states.animate, transition: iconTransitions, strokeLinecap: "round", strokeLinejoin: "round", d: "M5 13l4 4L19 7" }) }));
 const variants = { complete: { scale: 1.25 }, active: { scale: 1, transition: { delay: 0, duration: 0.2 } } };
 const transitions = {
     duration: 0.6,

package/dist/src/components/display/timeline.js

@@ -4,15 +4,11 @@ import { Fragment } from "react";
 const typeMap = {
     tag: () => null,
     custom: () => null,
-    record: ({ item }) => {
-        var _a, _b, _c, _d;
-        return (_jsxs(Fragment, { children: [_jsxs("div", { className: "relative", children: [_jsx("img", { src: (_a = item.avatar) === null || _a === void 0 ? void 0 : _a.img, alt: (_b = item.avatar) === null || _b === void 0 ? void 0 : _b.name, className: "flex aspect-square size-12 items-center justify-center rounded-full bg-primary-hover" }), _jsx("span", { className: "absolute -bottom-0.5 -right-1 rounded-full rounded-tl bg-card-background px-0.5 py-px", children: _jsx(MessagesSquareIcon, { "aria-hidden": "true", className: "aspect-square size-5" }) })] }), _jsxs("div", { className: "min-w-0 flex-1 text-foreground", children: [_jsxs("div", { children: [_jsx("a", { href: (_c = item.avatar) === null || _c === void 0 ? void 0 : _c.profile, className: "text-base font-medium text-primary", children: (_d = item.avatar) === null || _d === void 0 ? void 0 : _d.name }), _jsxs("p", { className: "mt-0.5 text-sm", children: ["Commented ", item.date.toISOString()] })] }), _jsx("div", { className: "mt-2 text-wrap text-sm", children: _jsx("p", { children: item.text }) })] })] }));
-    },
+    record: ({ item }) => (_jsxs(Fragment, { children: [_jsxs("div", { className: "relative", children: [_jsx("img", { src: item.avatar?.img, alt: item.avatar?.name, className: "flex aspect-square size-12 items-center justify-center rounded-full bg-primary-hover" }), _jsx("span", { className: "absolute -bottom-0.5 -right-1 rounded-full rounded-tl bg-card-background px-0.5 py-px", children: _jsx(MessagesSquareIcon, { "aria-hidden": "true", className: "aspect-square size-5" }) })] }), _jsxs("div", { className: "min-w-0 flex-1 text-foreground", children: [_jsxs("div", { children: [_jsx("a", { href: item.avatar?.profile, className: "text-base font-medium text-primary", children: item.avatar?.name }), _jsxs("p", { className: "mt-0.5 text-sm", children: ["Commented ", item.date.toISOString()] })] }), _jsx("div", { className: "mt-2 text-wrap text-sm", children: _jsx("p", { children: item.text }) })] })] })),
 };
 export const Timeline = (props) => {
     return (_jsx("div", { className: "flow-root", children: _jsx("ul", { role: "list", className: "-mb-8", children: props.items.map((item, index) => {
-                var _a;
-                const Render = (_a = typeMap[item.type]) !== null && _a !== void 0 ? _a : null;
+                const Render = typeMap[item.type] ?? null;
                 if (Render === null && props.Custom) {
                     return _jsx(props.Custom, { item: item });
                 }

package/dist/src/components/floating/dropdown.js

@@ -21,19 +21,18 @@ export const Dropdown = (props) => {
         transform: true,
         whileElementsMounted: autoUpdate,
         onOpenChange: (nextValue, event) => {
-            var _a;
-            const element = event === null || event === void 0 ? void 0 : event.relatedTarget;
+            const element = event?.relatedTarget;
             if (element) {
                 if (element.dataset.floating === "true" && !nextValue)
                     return;
             }
             setOpen(nextValue);
-            (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, nextValue);
+            props.onChange?.(nextValue);
         },
     });
     const click = useClick(context);
     const dismiss = useDismiss(context);
     const role = useRole(context);
     const { getReferenceProps, getFloatingProps } = useInteractions([click, dismiss, role]);
-    return (_jsxs(Fragment, { children: [_jsx("button", Object.assign({ 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", Object.assign({ className: "relative isolate z-floating min-w-96 rounded-lg border border-floating-border bg-floating-background p-6 shadow-2xl", 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 isolate z-floating min-w-96 rounded-lg border border-floating-border bg-floating-background p-6 shadow-2xl", 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] }) }) }))] }));
 };

package/dist/src/components/floating/expand.js

@@ -21,5 +21,5 @@ export const Expand = (props) => {
     const role = useRole(context);
     const dismiss = useDismiss(context, { escapeKey: true, referencePress: true, outsidePress: true });
     const { getFloatingProps, getReferenceProps } = useInteractions([click, role, dismiss]);
-    return (_jsxs("div", { className: "relative inline-flex items-center justify-center", ref: root, children: [_jsx(Button, Object.assign({}, getReferenceProps(props), { as: motion.button, layoutId: wrapperId, ref: refs.setReference, size: "small", onClick: () => setOpen(true), children: _jsx(motion.span, { layoutId: titleId, children: props.trigger }) })), _jsx(AnimatePresence, { children: open ? (_jsx(FloatingPortal, { root: root, children: _jsx(FloatingFocusManager, { visuallyHiddenDismiss: true, modal: true, closeOnFocusOut: true, context: context, children: _jsx(motion.div, Object.assign({}, getFloatingProps(), { ref: refs.setFloating, layoutId: wrapperId, className: "absolute -left-1/4 -top-3/4", children: props.children })) }) })) : null })] }));
+    return (_jsxs("div", { className: "relative inline-flex items-center justify-center", ref: root, children: [_jsx(Button, { ...getReferenceProps(props), as: motion.button, layoutId: wrapperId, ref: refs.setReference, size: "small", onClick: () => setOpen(true), children: _jsx(motion.span, { layoutId: titleId, children: props.trigger }) }), _jsx(AnimatePresence, { children: open ? (_jsx(FloatingPortal, { root: root, children: _jsx(FloatingFocusManager, { visuallyHiddenDismiss: true, modal: true, closeOnFocusOut: true, context: context, children: _jsx(motion.div, { ...getFloatingProps(), ref: refs.setFloating, layoutId: wrapperId, className: "absolute -left-1/4 -top-3/4", children: props.children }) }) })) : null })] }));
 };

package/dist/src/components/floating/menu.js

@@ -1,5 +1,4 @@
 "use client";
-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";
@@ -15,8 +14,7 @@ const MenuContext = createContext({
     setActiveIndex: () => { },
     setHasFocusInside: () => { },
 });
-const MenuComponent = React.forwardRef((_a, forwardedRef) => {
-    var { children, FloatingComponent = "div", hover = true, isParent, floatingClassName = "", label } = _a, props = __rest(_a, ["children", "FloatingComponent", "hover", "isParent", "floatingClassName", "label"]);
+const MenuComponent = React.forwardRef(({ children, FloatingComponent = "div", hover = true, isParent, floatingClassName = "", label, ...props }, forwardedRef) => {
     const parentId = useFloatingParentNodeId();
     const isNested = parentId !== null;
     const [isOpen, setIsOpen] = useState(false);
@@ -89,38 +87,39 @@ const MenuComponent = React.forwardRef((_a, forwardedRef) => {
             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, 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({ type: "button", 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(FloatingComponent, Object.assign({}, getFloatingProps(), { ref: refs.setFloating, style: Object.assign(Object.assign({}, props.style), floatingStyles), className: css("isolate z-tooltip flex flex-col items-start rounded-lg border border-floating-border bg-floating-background text-left shadow-xl outline-none", floatingClassName), children: children })) }) })) }) })] }));
+    return (_jsxs(FloatingNode, { id: nodeId, children: [_jsx(Fragment, { children: props.asChild ? (_jsx(Slot, { 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({
+                        ...props,
+                        onFocus(event) {
+                            props.onFocus?.(event);
+                            setHasFocusInside(false);
+                            parent.setHasFocusInside(true);
+                        },
+                    })) })) : (_jsxs("button", { type: "button", 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({
+                        ...props,
+                        onFocus(event) {
+                            props.onFocus?.(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(FloatingComponent, { ...getFloatingProps(), ref: refs.setFloating, style: { ...props.style, ...floatingStyles }, className: css("isolate z-tooltip flex flex-col items-start rounded-lg border border-floating-border bg-floating-background text-left shadow-xl outline-none", floatingClassName), children: children }) }) })) }) })] }));
 });
-export const MenuItem = React.forwardRef((_a, forwardedRef) => {
-    var { label, title, Right, disabled } = _a, props = __rest(_a, ["label", "title", "Right", "disabled"]);
+export const MenuItem = React.forwardRef(({ label, title, Right, disabled, ...props }, forwardedRef) => {
     const menu = useContext(MenuContext);
     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({
-        onClick(event) {
-            var _a;
-            (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, event);
-            tree === null || tree === void 0 ? void 0 : tree.events.emit("click");
-        },
-        onFocus(event) {
-            var _a;
-            (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, event);
-            menu.setHasFocusInside(true);
-        },
-    }), { children: [label, Right ? _jsx(Right, { size: 16 }) : null] })));
+    return (_jsxs("button", { ...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({
+            onClick(event) {
+                props.onClick?.(event);
+                tree?.events.emit("click");
+            },
+            onFocus(event) {
+                props.onFocus?.(event);
+                menu.setHasFocusInside(true);
+            },
+        }), children: [label, Right ? _jsx(Right, { size: 16 }) : null] }));
 });
 export const Menu = React.forwardRef((props, ref) => {
     const parentId = useFloatingParentNodeId();
-    return parentId !== null ? (_jsx(MenuComponent, Object.assign({}, props, { isParent: false, ref: ref }))) : (_jsx(FloatingTree, { children: _jsx(MenuComponent, Object.assign({}, props, { isParent: true, ref: ref })) }));
+    return parentId !== null ? (_jsx(MenuComponent, { ...props, isParent: false, ref: ref })) : (_jsx(FloatingTree, { children: _jsx(MenuComponent, { ...props, isParent: true, ref: ref }) }));
 });

package/dist/src/components/floating/modal.js

@@ -1,5 +1,4 @@
 "use client";
-import { __rest } from "tslib";
 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 { Slot } from "@radix-ui/react-slot";
@@ -78,8 +77,7 @@ const Draggable = (props) => {
                 : "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 }));
 };
 const positions = { drawer: "right", sheet: "none", dialog: "none" };
-export const Modal = (_a) => {
-    var { type: _type = "dialog", resizer = true, overlayClickClose = false, forceType = false, closable = true } = _a, props = __rest(_a, ["type", "resizer", "overlayClickClose", "forceType", "closable"]);
+export const Modal = ({ type: _type = "dialog", resizer = true, overlayClickClose = false, forceType = false, closable = true, ...props }) => {
     const headingId = useId();
     const descriptionId = useId();
     const isDesktop = useMediaQuery("(min-width: 64rem)");
@@ -96,7 +94,7 @@ 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({
-                    layoutId: props.layoutId,
-                }), { children: Trigger }))) : (_jsx(motion.button, Object.assign({ ref: refs.setReference }, getReferenceProps(), { layoutId: props.layoutId, type: "button", children: Trigger }))) })) : null, _jsx(FloatingPortal, { children: _jsx(AnimatePresence, { presenceAffectsLayout: true, children: props.open ? (_jsx(FloatingOverlay, { lockScroll: true, className: `inset-0 isolate z-overlay 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", layoutId: props.layoutId, 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: "flex-1 overflow-y-auto px-8 py-1", 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 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, 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, { ref: refs.setReference, ...getReferenceProps({
+                        layoutId: props.layoutId,
+                    }), children: Trigger })) : (_jsx(motion.button, { ref: refs.setReference, ...getReferenceProps(), layoutId: props.layoutId, type: "button", children: Trigger })) })) : null, _jsx(FloatingPortal, { children: _jsx(AnimatePresence, { presenceAffectsLayout: true, children: props.open ? (_jsx(FloatingOverlay, { lockScroll: true, className: `inset-0 isolate z-overlay 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, { animate: "enter", "aria-describedby": descriptionId, "aria-labelledby": headingId, className: variants({ position, type }), exit: "exit", layoutId: props.layoutId, 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: "flex-1 overflow-y-auto px-8 py-1", 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 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, useResizer && resizer ? (_jsx(Draggable, { onChange: props.onChange, parent: refs.floating, position: position, sheet: type === "sheet", value: value })) : null] }) }) })) : null }) })] }));
 };

package/dist/src/components/floating/tooltip.js

@@ -1,12 +1,10 @@
 "use client";
-import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { arrow, autoUpdate, flip, FloatingArrow, FloatingPortal, offset, shift, useClientPoint, 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, followCursor = false, placement, enabled, as, title } = _a, props = __rest(_a, ["children", "followCursor", "placement", "enabled", "as", "title"]);
+export const Tooltip = ({ children, followCursor = false, placement, enabled, as, title, ...props }) => {
     const [open, setOpen] = useState(false);
     const arrowRef = useRef(null);
     const Component = as || "span";
@@ -24,5 +22,5 @@ export const Tooltip = (_a) => {
     const role = useRole(context, { role: "tooltip", enabled });
     const clientPoint = useClientPoint(context, { enabled: !!enabled && !!followCursor });
     const { getReferenceProps, getFloatingProps } = useInteractions([hover, focus, dismiss, role, clientPoint]);
-    return (_jsxs(Fragment, { children: [_jsx(Component, Object.assign({ ref: refs.setReference }, getReferenceProps(props), { children: title })), _jsx(FloatingPortal, { children: open && (_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 shadow-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, { ref: refs.setReference, ...getReferenceProps(props), children: title }), _jsx(FloatingPortal, { children: open && (_jsxs(Polymorph, { ...getFloatingProps(), ref: refs.setFloating, style: floatingStyles, className: "z-tooltip rounded-lg border border-tooltip-border bg-tooltip-background p-3 text-tooltip-foreground shadow-lg", children: [_jsx(FloatingArrow, { ref: arrowRef, context: context, strokeWidth: 0.1, className: "fill-tooltip-background stroke-tooltip-border" }), children] })) })] }));
 };