@bouko/react 2.5.3 → 2.5.5

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

@@ -1,10 +1,11 @@
-import type { ReactNode } from "react";
-export type ButtonProps = {
-    variant?: "primary" | "outline" | "ghost";
-    size?: "xs" | "sm" | "md" | "lg";
-    style?: string;
-    onClick?: () => void;
-    disabled?: boolean;
-    children: ReactNode;
-};
-export default function LoadButton({ size, variant, style, onClick, children, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+import type { ReactNode } from "react";
+export declare type ButtonProps = {
+    variant?: "primary" | "outline" | "ghost";
+    size?: "xs" | "sm" | "md" | "lg";
+    style?: string;
+    icon?: ReactNode;
+    onClick?: () => void;
+    disabled?: boolean;
+    children: ReactNode;
+};
+export default function LoadButton({ size, variant, style, icon, onClick, children, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/button/load.js

@@ -1,35 +1,35 @@
-"use state";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { cn, tv } from "@bouko/style";
-import CheckCircle from "../../assets/icons/check-circle.svg";
-import Spinner from "../../assets/icons/spinner.svg";
-export default function LoadButton({ size, variant, style, onClick, children, ...props }) {
-    const [isLoading, setLoading] = useState(false);
-    const submit = async () => {
-        setLoading(true);
-        try {
-            await onClick?.();
-        }
-        catch { }
-        setLoading(false);
-    };
-    return (_jsxs("button", { className: cn(styles({ variant, size }), style), onClick: submit, ...props, children: [isLoading ? _jsx(Spinner, { className: "animate-spin" }) : _jsx(CheckCircle, {}), children] }));
-}
-const styles = tv({
-    base: "flex justify-center items-center gap-2 bg-accent hover:bg-accent-dark border border-accent-dark rounded font-semibold text-background-light duration-200 cursor-pointer disabled:cursor-not-allowed",
-    defaultVariants: { size: "md" },
-    variants: {
-        variant: {
-            primary: "bg-primary hover:bg-primary-dark border-primary-dark",
-            outline: "!bg-transparent border-accent hover:border-accent-dark text-primary",
-            ghost: "!bg-transparent border-transparent text-accent hover:text-accent-dark"
-        },
-        size: {
-            xs: "px-3 py-1 text-xs",
-            sm: "px-4 py-2 text-xs sm:text-sm",
-            md: "px-4 py-2",
-            lg: "px-5 py-3 text-lg"
-        }
-    }
-});
+"use state";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { cn, tv } from "@bouko/style";
+import CheckCircle from "../../assets/icons/check-circle.svg";
+import Spinner from "../../assets/icons/spinner.svg";
+export default function LoadButton({ size, variant, style, icon, onClick, children, ...props }) {
+    const [isLoading, setLoading] = useState(false);
+    const submit = async () => {
+        setLoading(true);
+        try {
+            await onClick?.();
+        }
+        catch { }
+        setLoading(false);
+    };
+    return (_jsxs("button", { className: cn(styles({ variant, size }), style), onClick: submit, ...props, children: [isLoading ? _jsx(Spinner, { className: "animate-spin" }, void 0) : (icon || _jsx(CheckCircle, {}, void 0)), children] }, void 0));
+}
+const styles = tv({
+    base: "flex justify-center items-center gap-2 bg-accent hover:bg-accent-dark border border-accent-dark rounded font-semibold text-background-light duration-200 cursor-pointer disabled:cursor-not-allowed",
+    defaultVariants: { size: "md" },
+    variants: {
+        variant: {
+            primary: "bg-primary hover:bg-primary-dark border-primary-dark",
+            outline: "!bg-transparent border-accent hover:border-accent-dark text-primary",
+            ghost: "!bg-transparent border-transparent text-accent hover:text-accent-dark"
+        },
+        size: {
+            xs: "px-3 py-1 text-xs",
+            sm: "px-4 py-2 text-xs sm:text-sm",
+            md: "px-4 py-2",
+            lg: "px-5 py-3 text-lg"
+        }
+    }
+});

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

@@ -1,11 +1,11 @@
-import { ReactNode } from "react";
-import { Component } from "../../core/types";
-export type ButtonProps = Component & {
-    variant?: "primary" | "outline" | "ghost";
-    size?: "xs" | "sm" | "md" | "lg";
-    icon?: ReactNode;
-    action?: () => void;
-    disabled?: boolean;
-};
-export declare function Button({ size, variant, style, icon, action, disabled, children }: ButtonProps): import("react/jsx-runtime").JSX.Element;
-export default Button;
+import { ReactNode } from "react";
+import type { Component } from "../../core/types";
+export declare type ButtonProps = Component & {
+    variant?: "primary" | "outline" | "ghost" | "secondary";
+    size?: "xs" | "sm" | "md" | "lg";
+    icon?: ReactNode;
+    action?: () => void;
+    disabled?: boolean;
+};
+export declare function Button({ size, variant, style, icon, action, disabled, children }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+export default Button;

package/dist/components/button/normal.js

@@ -1,37 +1,38 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { cn, tv } from "@bouko/style";
-import Spinner from "../../assets/icons/spinner.svg";
-export function Button({ size, variant, style, icon, action, disabled, children }) {
-    const [isLoading, setLoading] = useState(false);
-    const submit = async () => {
-        setLoading(true);
-        try {
-            await action?.();
-        }
-        catch { }
-        setLoading(false);
-    };
-    return (_jsxs("button", { className: cn(styles({ variant, size }), variant === "ghost" && "p-0", style), onClick: submit, disabled: disabled || isLoading, children: [icon && isLoading
-                ? _jsx(Spinner, { className: "animate-spin" })
-                : icon, children] }));
-}
-const styles = tv({
-    base: "flex justify-center items-center gap-2 bg-accent hover:bg-accent-dark border border-accent-dark rounded font-semibold text-background-light duration-200 cursor-pointer disabled:cursor-not-allowed",
-    defaultVariants: { size: "md" },
-    variants: {
-        variant: {
-            primary: "bg-primary hover:bg-primary-dark border-primary-dark",
-            outline: "bg-transparent border-accent hover:border-accent-dark text-primary",
-            ghost: "bg-transparent border-transparent text-accent hover:brightness-110"
-        },
-        size: {
-            xs: "px-3 py-1 text-xs",
-            sm: "px-4 py-2 text-xs sm:text-sm",
-            md: "px-4 py-2",
-            lg: "px-5 py-3 text-lg"
-        }
-    }
-});
-export default Button;
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { cn, tv } from "@bouko/style";
+import Spinner from "../../assets/icons/spinner.svg";
+export function Button({ size, variant, style, icon, action, disabled, children }) {
+    const [isLoading, setLoading] = useState(false);
+    const submit = async () => {
+        setLoading(true);
+        try {
+            await action?.();
+        }
+        catch { }
+        setLoading(false);
+    };
+    return (_jsxs("button", { className: cn(styles({ variant, size }), variant === "ghost" && "p-0", style), onClick: submit, disabled: disabled || isLoading, children: [icon && isLoading
+                ? _jsx(Spinner, { className: "animate-spin" }, void 0)
+                : icon, children] }, void 0));
+}
+const styles = tv({
+    base: "flex justify-center items-center gap-2 bg-accent border border-accent-darker rounded font-semibold text-background-light duration-200 cursor-pointer disabled:cursor-not-allowed hover:brightness-110",
+    defaultVariants: { size: "md" },
+    variants: {
+        variant: {
+            primary: "bg-primary border-primary-dark",
+            outline: "bg-transparent border-accent hover:border-accent-dark text-primary",
+            ghost: "bg-transparent border-transparent text-accent hover:brightness-110",
+            secondary: "bg-background-dark dark:bg-background-light border-border-dark dark:border-border-light text-background-darker dark:text-primary"
+        },
+        size: {
+            xs: "px-3 py-1 text-xs",
+            sm: "px-3 py-2 text-xs sm:text-sm",
+            md: "px-4 py-2",
+            lg: "px-5 py-3 text-lg"
+        }
+    }
+});
+export default Button;

package/dist/components/button.d.ts

@@ -1,10 +1,10 @@
-import type { ReactNode } from "react";
-export type ButtonProps = {
-    variant?: "primary" | "outline" | "ghost";
-    size?: "xs" | "sm" | "md" | "lg";
-    style?: string;
-    onClick?: () => void;
-    disabled?: boolean;
-    children: ReactNode;
-};
-export declare function Button({ size, variant, style, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+import type { ReactNode } from "react";
+export declare type ButtonProps = {
+    variant?: "primary" | "outline" | "ghost";
+    size?: "xs" | "sm" | "md" | "lg";
+    style?: string;
+    onClick?: () => void;
+    disabled?: boolean;
+    children: ReactNode;
+};
+export declare function Button({ size, variant, style, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/button.js

@@ -1,22 +1,22 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { cn, tv } from "@bouko/style";
-export function Button({ size, variant, style, ...props }) {
-    return (_jsx("button", { className: cn(styles({ variant, size }), style), ...props }));
-}
-const styles = tv({
-    base: "flex justify-center items-center gap-2 bg-accent hover:bg-accent-dark border border-accent-dark rounded font-semibold text-background-light duration-200 cursor-pointer disabled:cursor-not-allowed",
-    defaultVariants: { size: "md" },
-    variants: {
-        variant: {
-            primary: "bg-primary hover:bg-primary-dark border-primary-dark",
-            outline: "!bg-transparent border-accent hover:border-accent-dark text-primary",
-            ghost: "!bg-transparent border-transparent text-accent hover:text-accent-dark"
-        },
-        size: {
-            xs: "px-3 py-1 text-xs",
-            sm: "px-4 py-2 text-xs sm:text-sm",
-            md: "px-4 py-2",
-            lg: "px-5 py-3 text-lg"
-        }
-    }
-});
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn, tv } from "@bouko/style";
+export function Button({ size, variant, style, ...props }) {
+    return (_jsx("button", { className: cn(styles({ variant, size }), style), ...props }, void 0));
+}
+const styles = tv({
+    base: "flex justify-center items-center gap-2 bg-accent hover:bg-accent-dark border border-accent-dark rounded font-semibold text-background-light duration-200 cursor-pointer disabled:cursor-not-allowed",
+    defaultVariants: { size: "md" },
+    variants: {
+        variant: {
+            primary: "bg-primary hover:bg-primary-dark border-primary-dark",
+            outline: "!bg-transparent border-accent hover:border-accent-dark text-primary",
+            ghost: "!bg-transparent border-transparent text-accent hover:text-accent-dark"
+        },
+        size: {
+            xs: "px-3 py-1 text-xs",
+            sm: "px-4 py-2 text-xs sm:text-sm",
+            md: "px-4 py-2",
+            lg: "px-5 py-3 text-lg"
+        }
+    }
+});

package/dist/components/carousel/index.d.ts

@@ -1,11 +1,11 @@
-import { ReactNode } from "react";
-export type CarouselProps<T = ReactNode> = {
-    container?: string;
-    items: T[];
-    direction?: "horizontal" | "vertical";
-    interval?: number;
-    duration?: number;
-    autoplay?: boolean;
-    style?: string;
-};
-export declare function Carousel({ container, style, items, direction, autoplay, interval, ...props }: CarouselProps): import("react/jsx-runtime").JSX.Element;
+import { ReactNode } from "react";
+export declare type CarouselProps<T = ReactNode> = {
+    container?: string;
+    items: T[];
+    direction?: "horizontal" | "vertical";
+    interval?: number;
+    duration?: number;
+    autoplay?: boolean;
+    style?: string;
+};
+export declare function Carousel({ container, style, items, direction, autoplay, interval, ...props }: CarouselProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/carousel/index.js

@@ -1,19 +1,19 @@
-"use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { AnimatePresence } from "framer-motion";
-import { Animation } from "../animate";
-import { useState, useEffect } from "react";
-import { opacity, slideX, slideY } from "../animate";
-import { cn } from "@bouko/style";
-export function Carousel({ container, style, items, direction = "horizontal", autoplay = true, interval = 3000, ...props }) {
-    const [index, setIndex] = useState(0);
-    useEffect(() => {
-        if (items.length === 0 || !autoplay)
-            return;
-        const intervalTracker = setInterval(() => {
-            setIndex((prev) => (prev + 1) % items.length);
-        }, interval);
-        return () => clearInterval(intervalTracker);
-    }, [items.length, interval, autoplay]);
-    return (_jsx("div", { className: cn("flex items-center", container), children: _jsx(AnimatePresence, { mode: "wait", children: _jsx(Animation, { style: cn("w-full", style), variants: [opacity(), direction === "horizontal" ? slideX() : slideY()], children: items[index], ...props }, index) }) }));
-}
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AnimatePresence } from "framer-motion";
+import { Animation } from "../animate";
+import { useState, useEffect } from "react";
+import { opacity, slideX, slideY } from "../animate";
+import { cn } from "@bouko/style";
+export function Carousel({ container, style, items, direction = "horizontal", autoplay = true, interval = 3000, ...props }) {
+    const [index, setIndex] = useState(0);
+    useEffect(() => {
+        if (items.length === 0 || !autoplay)
+            return;
+        const intervalTracker = setInterval(() => {
+            setIndex((prev) => (prev + 1) % items.length);
+        }, interval);
+        return () => clearInterval(intervalTracker);
+    }, [items.length, interval, autoplay]);
+    return (_jsx("div", { className: cn("flex items-center", container), children: _jsx(AnimatePresence, { mode: "wait", children: _jsx(Animation, { style: cn("w-full", style), variants: [opacity(), direction === "horizontal" ? slideX() : slideY()], children: items[index], ...props }, index) }, void 0) }, void 0));
+}

package/dist/components/checkbox.d.ts

@@ -1,8 +1,8 @@
-type Props = {
-    style?: string;
-    label: string;
-    value: boolean;
-    update: (x: boolean) => void;
-};
-export default function Checkbox({ style, label, value, update }: Props): import("react/jsx-runtime").JSX.Element;
-export {};
+declare type Props = {
+    style?: string;
+    label: string;
+    value: boolean;
+    update: (x: boolean) => void;
+};
+export default function Checkbox({ style, label, value, update }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/checkbox.js

@@ -1,13 +1,13 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Check from "../assets/icons/check.svg";
-import { cn } from "@bouko/style";
-export default function Checkbox({ style, label, value, update }) {
-    const isChecked = !!value;
-    return (_jsxs("div", { className: cn(styles.container, style), children: [_jsx("div", { className: cn(styles.box, isChecked && "bg-accent"), onClick: () => update(!isChecked), children: isChecked && _jsx(Check, { className: styles.check }) }), _jsx("span", { className: styles.label, children: label })] }));
-}
-const styles = {
-    container: "flex gap-3 items-center",
-    box: "flex justify-center items-center size-4 min-w-4 hover:bg-accent border rounded border-border-light duration-200 cursor-pointer",
-    check: "size-2 text-background",
-    label: "text-xs text-primary-dark"
-};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Check from "../assets/icons/check.svg";
+import { cn } from "@bouko/style";
+export default function Checkbox({ style, label, value, update }) {
+    const isChecked = !!value;
+    return (_jsxs("div", { className: cn(styles.container, style), children: [_jsx("div", { className: cn(styles.box, isChecked && "bg-accent"), onClick: () => update(!isChecked), children: isChecked && _jsx(Check, { className: styles.check }, void 0) }, void 0), _jsx("span", { className: styles.label, children: label }, void 0)] }, void 0));
+}
+const styles = {
+    container: "flex gap-3 items-center",
+    box: "flex justify-center items-center size-4 min-w-4 hover:bg-accent border rounded border-border-light duration-200 cursor-pointer",
+    check: "size-2 text-background",
+    label: "text-xs text-primary-dark"
+};

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

@@ -1,10 +1,10 @@
-import { ReactNode } from "react";
-type Option = {
-    label: ReactNode;
-    action: () => void;
-};
-export default function Dropdown({ options, children }: {
-    options: Option[];
-    children: ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
-export {};
+import { ReactNode } from "react";
+declare type Option = {
+    label: ReactNode;
+    action: () => void;
+};
+export default function Dropdown({ options, children }: {
+    options: Option[];
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/dropdown/normal.js

@@ -1,19 +1,19 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { AnimatePresence, motion } from "framer-motion";
-export default function Dropdown({ options, children }) {
-    const [isOpen, setOpen] = useState(false);
-    const boom = (action) => {
-        action();
-        setOpen(false);
-    };
-    return (_jsxs("div", { className: styles.container, children: [_jsx("div", { onClick: () => setOpen(true), children: children }), _jsx(AnimatePresence, { children: isOpen && (_jsx(motion.div, { className: styles.dropdown, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, children: options.map(({ label, action }, i) => (_jsx("div", { className: "cursor-pointer duration-200 hover:brightness-115", onClick: () => boom(action), children: label }, i))) }, "dropdown")) })] }));
-}
-const styles = {
-    container: "relative shrink-0",
-    subcontainer: "flex flex-col gap-1 w-full",
-    label: "text-xs text-slate-600",
-    trigger: "flex justify-between items-center px-3 py-2 bg-slate-200/50 hover:bg-slate-200/80 border border-slate-300 outline-blue-500 rounded text-sm duration-200 cursor-pointer",
-    dropdown: "absolute mt-2 z-50 flex flex-col items-end justify-end gap-1 w-full bg-slate-950 rounded border border-border-dark p-3 pr-4 text-sm max-h-46 overflow-y-auto"
-};
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { AnimatePresence, motion } from "framer-motion";
+export default function Dropdown({ options, children }) {
+    const [isOpen, setOpen] = useState(false);
+    const boom = (action) => {
+        action();
+        setOpen(false);
+    };
+    return (_jsxs("div", { className: styles.container, children: [_jsx("div", { onClick: () => setOpen(true), children: children }, void 0), _jsx(AnimatePresence, { children: isOpen && (_jsx(motion.div, { className: styles.dropdown, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, children: options.map(({ label, action }, i) => (_jsx("div", { className: "cursor-pointer duration-200 hover:brightness-115", onClick: () => boom(action), children: label }, i))) }, "dropdown")) }, void 0)] }, void 0));
+}
+const styles = {
+    container: "relative shrink-0",
+    subcontainer: "flex flex-col gap-1 w-full",
+    label: "text-xs text-slate-600",
+    trigger: "flex justify-between items-center px-3 py-2 bg-slate-200/50 hover:bg-slate-200/80 border border-slate-300 outline-blue-500 rounded text-sm duration-200 cursor-pointer",
+    dropdown: "absolute mt-2 z-50 flex flex-col items-end justify-end gap-1 w-full bg-slate-950 rounded border border-border-dark p-3 pr-4 text-sm max-h-46 overflow-y-auto"
+};

package/dist/components/fade-carousel.d.ts

@@ -1,4 +1,4 @@
-import { type ReactNode } from "react";
-export default function FadeCarousel({ items }: {
-    items: ReactNode[];
-}): import("react/jsx-runtime").JSX.Element;
+import { type ReactNode } from "react";
+export default function FadeCarousel({ items }: {
+    items: ReactNode[];
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/fade-carousel.js

@@ -1,14 +1,14 @@
-"use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useState, useEffect } from "react";
-import { AnimatePresence, motion } from "framer-motion";
-export default function FadeCarousel({ items }) {
-    const [index, setIndex] = useState(0);
-    useEffect(() => {
-        const interval = setInterval(() => {
-            setIndex((prev) => (prev + 1) % items.length);
-        }, 2000);
-        return () => clearInterval(interval);
-    }, []);
-    return (_jsx(AnimatePresence, { mode: "wait", children: _jsx(motion.div, { className: "absolute", transition: { duration: 0.5 }, initial: { opacity: 0, y: 5 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -5 }, children: items[index] }, index) }));
-}
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { AnimatePresence, motion } from "framer-motion";
+export default function FadeCarousel({ items }) {
+    const [index, setIndex] = useState(0);
+    useEffect(() => {
+        const interval = setInterval(() => {
+            setIndex((prev) => (prev + 1) % items.length);
+        }, 2000);
+        return () => clearInterval(interval);
+    }, []);
+    return (_jsx(AnimatePresence, { mode: "wait", children: _jsx(motion.div, { className: "absolute", transition: { duration: 0.5 }, initial: { opacity: 0, y: 5 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -5 }, children: items[index] }, index) }, void 0));
+}

package/dist/components/field.d.ts

@@ -1,10 +1,10 @@
-import type { InputHTMLAttributes, ReactNode } from "react";
-type Props = InputHTMLAttributes<HTMLInputElement> & {
-    label?: string;
-    style?: string;
-    required?: boolean;
-    note?: ReactNode;
-    children: ReactNode;
-};
-export default function Field({ style, label, required, note, children }: Props): import("react/jsx-runtime").JSX.Element;
-export {};
+import type { InputHTMLAttributes, ReactNode } from "react";
+declare type Props = InputHTMLAttributes<HTMLInputElement> & {
+    label?: string;
+    style?: string;
+    required?: boolean;
+    note?: ReactNode;
+    children: ReactNode;
+};
+export default function Field({ style, label, required, note, children }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/field.js

@@ -1,10 +1,10 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from "@bouko/style";
-export default function Field({ style, label, required = true, note, children }) {
-    return (_jsxs("div", { className: cn(styles.container, style), children: [label && _jsxs("span", { className: styles.label, children: [label, " ", !required ? _jsx("span", { className: "italic text-slate-400", children: "(optional)" }) : ""] }), children, note && _jsx("span", { className: styles.note, children: note })] }));
-}
-const styles = {
-    container: "flex flex-col shrink-0 gap-1 w-full overflow-hidden",
-    label: "text-xs text-primary-dark",
-    note: "mt-1 text-xs text-slate-500 whitespace-pre-line"
-};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "@bouko/style";
+export default function Field({ style, label, required = true, note, children }) {
+    return (_jsxs("div", { className: cn(styles.container, style), children: [label && _jsxs("span", { className: styles.label, children: [label, " ", !required ? _jsx("span", { className: "italic text-slate-400", children: "(optional)" }, void 0) : ""] }, void 0), children, note && _jsx("span", { className: styles.note, children: note }, void 0)] }, void 0));
+}
+const styles = {
+    container: "flex flex-col shrink-0 gap-1 w-full overflow-hidden",
+    label: "text-xs text-primary-dark",
+    note: "mt-1 text-xs text-slate-500 whitespace-pre-line"
+};

package/dist/components/form/footer.js

@@ -3,8 +3,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Button } from "../button";
 import { RowBox } from "../layout/flex";
-import CheckCircle from "../../assets/icons/check-circle.svg";
-import Spinner from "../../assets/icons/spinner.svg";
+import CheckCircle from "./assets/check-circle.svg";
+import Spinner from "./assets/spinner.svg";
 export default function FormFooter({ data, validator, submit, clear }) {
     const isValid = validator.safeParse(data).success;
     const [isLoading, setLoading] = useState(false);

package/dist/components/form/functions.d.ts

@@ -1 +1 @@
-export declare const parseData: <T extends Record<string, unknown>>(data: T) => T;
+export declare const parseData: <T extends Record<string, unknown>>(data: T) => T;

package/dist/components/form/functions.js

@@ -1,28 +1,28 @@
-export const parseData = (data) => {
-    const copy = JSON.parse(JSON.stringify(data));
-    for (const [key, value] of Object.entries(data)) {
-        if (key === "created_at")
-            copy[key] = new Date(value);
-        else if (key === "timestamp")
-            copy[key] = new Date(value.replaceAll("'", ""));
-        else if (parseAllowedDate(value))
-            copy[key] = new Date(value);
-    }
-    return copy;
-};
-function parseAllowedDate(input) {
-    // ISO 8601 strict (YYYY-MM-DD or YYYY-MM-DDTHH:mm:ss+hh:mm)
-    const isoStrictRegex = /^\d{4}-\d{2}-\d{2}(T\d{2}:\d{2}(:\d{2}(\.\d{1,3})?)?(Z|[+-]\d{2}:\d{2}))?$/;
-    // MySQL/Postgres style with space + offset without colon (YYYY-MM-DD HH:mm:ss+hhmm)
-    const spaceOffsetRegex = /^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}[+-]\d{4}$/;
-    let normalized = input;
-    if (spaceOffsetRegex.test(input)) {
-        // Convert to ISO by replacing space with T and adding colon in offset
-        normalized = input.replace(" ", "T").replace(/([+-]\d{2})(\d{2})$/, "$1:$2");
-    }
-    else if (!isoStrictRegex.test(input)) {
-        return null; // Not allowed format
-    }
-    const date = new Date(normalized);
-    return !isNaN(date.getTime()) ? date : null;
-}
+export const parseData = (data) => {
+    const copy = JSON.parse(JSON.stringify(data));
+    for (const [key, value] of Object.entries(data)) {
+        if (key === "created_at")
+            copy[key] = new Date(value);
+        else if (key === "timestamp")
+            copy[key] = new Date(value.replaceAll("'", ""));
+        else if (parseAllowedDate(value))
+            copy[key] = new Date(value);
+    }
+    return copy;
+};
+function parseAllowedDate(input) {
+    // ISO 8601 strict (YYYY-MM-DD or YYYY-MM-DDTHH:mm:ss+hh:mm)
+    const isoStrictRegex = /^\d{4}-\d{2}-\d{2}(T\d{2}:\d{2}(:\d{2}(\.\d{1,3})?)?(Z|[+-]\d{2}:\d{2}))?$/;
+    // MySQL/Postgres style with space + offset without colon (YYYY-MM-DD HH:mm:ss+hhmm)
+    const spaceOffsetRegex = /^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}[+-]\d{4}$/;
+    let normalized = input;
+    if (spaceOffsetRegex.test(input)) {
+        // Convert to ISO by replacing space with T and adding colon in offset
+        normalized = input.replace(" ", "T").replace(/([+-]\d{2})(\d{2})$/, "$1:$2");
+    }
+    else if (!isoStrictRegex.test(input)) {
+        return null; // Not allowed format
+    }
+    const date = new Date(normalized);
+    return !isNaN(date.getTime()) ? date : null;
+}