@stevederico/skateboard-ui 3.11.0 → 4.0.0

package/dist/ui/empty.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cva } from "../shadcn/lib/cva.js";
+import { cn } from "../shadcn/lib/utils.js";
+function Empty({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "empty", className: cn("flex w-full min-w-0 flex-1 flex-col items-center justify-center gap-4 rounded-lg border-dashed p-12 text-center text-balance", className), ...props }));
+}
+function EmptyHeader({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "empty-header", className: cn("flex max-w-sm flex-col items-center gap-2", className), ...props }));
+}
+const emptyMediaVariants = cva("mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0", {
+    variants: {
+        variant: {
+            default: "bg-transparent",
+            icon: "flex size-10 shrink-0 items-center justify-center rounded-lg bg-muted text-foreground [&_svg:not([class*='size-'])]:size-6",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+function EmptyMedia({ className, variant = "default", ...props }) {
+    return (_jsx("div", { "data-slot": "empty-icon", "data-variant": variant, className: cn(emptyMediaVariants({ variant, className })), ...props }));
+}
+function EmptyTitle({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "empty-title", className: cn("text-lg font-medium tracking-tight", className), ...props }));
+}
+function EmptyDescription({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "empty-description", className: cn("text-sm/relaxed text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className), ...props }));
+}
+function EmptyContent({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "empty-content", className: cn("flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance", className), ...props }));
+}
+export { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia, };

package/dist/ui/field.d.ts

@@ -0,0 +1,28 @@
+import { type VariantProps } from "../shadcn/lib/cva.js";
+import { Label } from "./label.js";
+declare function FieldSet({ className, ...props }: React.ComponentProps<"fieldset">): import("react").JSX.Element;
+declare function FieldLegend({ className, variant, ...props }: React.ComponentProps<"legend"> & {
+    variant?: "legend" | "label";
+}): import("react").JSX.Element;
+declare function FieldGroup({ className, ...props }: React.ComponentProps<"div">): import("react").JSX.Element;
+declare const fieldVariants: (props?: import("../shadcn/lib/cva.js").CvaProps<{
+    orientation: {
+        vertical: string;
+        horizontal: string;
+        responsive: string;
+    };
+}> | undefined) => string;
+declare function Field({ className, orientation, ...props }: React.ComponentProps<"div"> & VariantProps<typeof fieldVariants>): import("react").JSX.Element;
+declare function FieldContent({ className, ...props }: React.ComponentProps<"div">): import("react").JSX.Element;
+declare function FieldLabel({ className, ...props }: React.ComponentProps<typeof Label>): import("react").JSX.Element;
+declare function FieldTitle({ className, ...props }: React.ComponentProps<"div">): import("react").JSX.Element;
+declare function FieldDescription({ className, ...props }: React.ComponentProps<"p">): import("react").JSX.Element;
+declare function FieldSeparator({ children, className, ...props }: React.ComponentProps<"div"> & {
+    children?: React.ReactNode;
+}): import("react").JSX.Element;
+declare function FieldError({ className, children, errors, ...props }: React.ComponentProps<"div"> & {
+    errors?: Array<{
+        message?: string;
+    } | undefined>;
+}): import("react").JSX.Element | null;
+export { Field, FieldLabel, FieldDescription, FieldError, FieldGroup, FieldLegend, FieldSeparator, FieldSet, FieldContent, FieldTitle, };

package/dist/ui/field.js

@@ -0,0 +1,68 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { cva } from "../shadcn/lib/cva.js";
+import { cn } from "../shadcn/lib/utils.js";
+import { Label } from "./label.js";
+import { Separator } from "./separator.js";
+function FieldSet({ className, ...props }) {
+    return (_jsx("fieldset", { "data-slot": "field-set", className: cn("flex flex-col gap-6 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3", className), ...props }));
+}
+function FieldLegend({ className, variant = "legend", ...props }) {
+    return (_jsx("legend", { "data-slot": "field-legend", "data-variant": variant, className: cn("mb-3 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base", className), ...props }));
+}
+function FieldGroup({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "field-group", className: cn("group/field-group @container/field-group flex w-full flex-col gap-7 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4", className), ...props }));
+}
+const fieldVariants = cva("group/field flex w-full gap-3 data-[invalid=true]:text-destructive", {
+    variants: {
+        orientation: {
+            vertical: "flex-col *:w-full [&>.sr-only]:w-auto",
+            horizontal: "flex-row items-center has-[>[data-slot=field-content]]:items-start *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px",
+            responsive: "flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:*:data-[slot=field-label]:flex-auto [&>.sr-only]:w-auto @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px",
+        },
+    },
+    defaultVariants: {
+        orientation: "vertical",
+    },
+});
+function Field({ className, orientation = "vertical", ...props }) {
+    return (_jsx("div", { role: "group", "data-slot": "field", "data-orientation": orientation, className: cn(fieldVariants({ orientation }), className), ...props }));
+}
+function FieldContent({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "field-content", className: cn("group/field-content flex flex-1 flex-col gap-1 leading-snug", className), ...props }));
+}
+function FieldLabel({ className, ...props }) {
+    return (_jsx(Label, { "data-slot": "field-label", className: cn("group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50 has-data-checked:border-primary/30 has-data-checked:bg-primary/5 has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border *:data-[slot=field]:p-3 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10", "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col", className), ...props }));
+}
+function FieldTitle({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "field-label", className: cn("flex w-fit items-center gap-2 text-sm font-medium group-data-[disabled=true]/field:opacity-50", className), ...props }));
+}
+function FieldDescription({ className, ...props }) {
+    return (_jsx("p", { "data-slot": "field-description", className: cn("text-left text-sm leading-normal font-normal text-muted-foreground group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5", "last:mt-0 nth-last-2:-mt-1", "[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className), ...props }));
+}
+function FieldSeparator({ children, className, ...props }) {
+    return (_jsxs("div", { "data-slot": "field-separator", "data-content": !!children, className: cn("relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2", className), ...props, children: [_jsx(Separator, { className: "absolute inset-0 top-1/2" }), children && (_jsx("span", { className: "relative mx-auto block w-fit bg-background px-2 text-muted-foreground", "data-slot": "field-separator-content", children: children }))] }));
+}
+function FieldError({ className, children, errors, ...props }) {
+    const content = useMemo(() => {
+        if (children) {
+            return children;
+        }
+        if (!errors?.length) {
+            return null;
+        }
+        const uniqueErrors = [
+            ...new Map(errors.map((error) => [error?.message, error])).values(),
+        ];
+        if (uniqueErrors?.length == 1) {
+            return uniqueErrors[0]?.message;
+        }
+        return (_jsx("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: uniqueErrors.map((error, index) => error?.message && _jsx("li", { children: error.message }, index)) }));
+    }, [children, errors]);
+    if (!content) {
+        return null;
+    }
+    return (_jsx("div", { role: "alert", "data-slot": "field-error", className: cn("text-sm font-normal text-destructive", className), ...props, children: content }));
+}
+export { Field, FieldLabel, FieldDescription, FieldError, FieldGroup, FieldLegend, FieldSeparator, FieldSet, FieldContent, FieldTitle, };

package/dist/ui/hover-card.d.ts

@@ -0,0 +1,32 @@
+import * as React from "react";
+import { type Side, type Align } from "./use-floating.js";
+export interface HoverCardProps {
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Delay before the card opens on hover/focus. */
+    openDelay?: number;
+    /** Delay before the card closes after the pointer leaves. */
+    closeDelay?: number;
+    children?: React.ReactNode;
+}
+/**
+ * Self-contained hover card: a popover that opens on trigger hover/focus after
+ * `openDelay` and closes `closeDelay` after the pointer leaves both the
+ * trigger and the content. One shared timer means re-entering the content
+ * cancels a pending close.
+ */
+declare function HoverCard({ open, defaultOpen, onOpenChange, openDelay, closeDelay, children, }: HoverCardProps): React.JSX.Element;
+declare function HoverCardTrigger({ asChild, render, nativeButton: _nativeButton, children, onMouseEnter, onMouseLeave, onFocus, onBlur, ...props }: React.ComponentProps<"a"> & {
+    asChild?: boolean;
+    render?: React.ReactElement;
+    nativeButton?: boolean;
+}): React.JSX.Element;
+export interface HoverCardContentProps extends React.ComponentProps<"div"> {
+    side?: Side;
+    align?: Align;
+    sideOffset?: number;
+    alignOffset?: number;
+}
+declare function HoverCardContent({ className, style, ref, side, sideOffset, align, alignOffset, onMouseEnter, onMouseLeave, ...props }: HoverCardContentProps): React.JSX.Element | null;
+export { HoverCard, HoverCardTrigger, HoverCardContent };

package/dist/ui/hover-card.js

@@ -0,0 +1,119 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../shadcn/lib/utils.js";
+import { Slot, mergeRefs, resolveRender } from "./slot.js";
+import { Portal } from "./portal.js";
+import { useFloating } from "./use-floating.js";
+import { usePresence } from "./use-presence.js";
+import { useControllableState } from "./use-controllable-state.js";
+const HoverCardContext = React.createContext(null);
+function useHoverCard() {
+    const ctx = React.useContext(HoverCardContext);
+    if (!ctx)
+        throw new Error("HoverCard parts must be used within <HoverCard>");
+    return ctx;
+}
+/**
+ * Self-contained hover card: a popover that opens on trigger hover/focus after
+ * `openDelay` and closes `closeDelay` after the pointer leaves both the
+ * trigger and the content. One shared timer means re-entering the content
+ * cancels a pending close.
+ */
+function HoverCard({ open, defaultOpen = false, onOpenChange, openDelay = 700, closeDelay = 300, children, }) {
+    const [isOpen, setOpen] = useControllableState({
+        value: open,
+        defaultValue: defaultOpen,
+        onChange: onOpenChange,
+    });
+    const triggerRef = React.useRef(null);
+    const contentId = React.useId();
+    const timer = React.useRef(undefined);
+    const scheduleOpen = React.useCallback(() => {
+        window.clearTimeout(timer.current);
+        if (openDelay > 0) {
+            timer.current = window.setTimeout(() => setOpen(true), openDelay);
+        }
+        else {
+            setOpen(true);
+        }
+    }, [openDelay, setOpen]);
+    const scheduleClose = React.useCallback(() => {
+        window.clearTimeout(timer.current);
+        if (closeDelay > 0) {
+            timer.current = window.setTimeout(() => setOpen(false), closeDelay);
+        }
+        else {
+            setOpen(false);
+        }
+    }, [closeDelay, setOpen]);
+    const cancelClose = React.useCallback(() => {
+        window.clearTimeout(timer.current);
+    }, []);
+    React.useEffect(() => () => window.clearTimeout(timer.current), []);
+    React.useEffect(() => {
+        if (!isOpen)
+            return;
+        const onKey = (e) => {
+            if (e.key === "Escape") {
+                window.clearTimeout(timer.current);
+                setOpen(false);
+            }
+        };
+        document.addEventListener("keydown", onKey);
+        return () => document.removeEventListener("keydown", onKey);
+    }, [isOpen, setOpen]);
+    return (_jsx(HoverCardContext.Provider, { value: {
+            open: isOpen,
+            scheduleOpen,
+            scheduleClose,
+            cancelClose,
+            triggerRef,
+            contentId,
+        }, children: children }));
+}
+function HoverCardTrigger({ asChild = false, render, nativeButton: _nativeButton, children, onMouseEnter, onMouseLeave, onFocus, onBlur, ...props }) {
+    const { open, scheduleOpen, scheduleClose, triggerRef, contentId } = useHoverCard();
+    const { useSlot, slotChild } = resolveRender(asChild, render, children);
+    const Comp = useSlot ? Slot : "a";
+    return (_jsx(Comp, { ref: triggerRef, "data-slot": "hover-card-trigger", "aria-describedby": open ? contentId : undefined, "data-state": open ? "open" : "closed", onMouseEnter: (e) => {
+            onMouseEnter?.(e);
+            scheduleOpen();
+        }, onMouseLeave: (e) => {
+            onMouseLeave?.(e);
+            scheduleClose();
+        }, onFocus: (e) => {
+            onFocus?.(e);
+            scheduleOpen();
+        }, onBlur: (e) => {
+            onBlur?.(e);
+            scheduleClose();
+        }, ...props, children: slotChild }));
+}
+function HoverCardContent({ className, style, ref, side = "bottom", sideOffset = 4, align = "center", alignOffset = 4, onMouseEnter, onMouseLeave, ...props }) {
+    const { open, cancelClose, scheduleClose, triggerRef, contentId } = useHoverCard();
+    const [mounted, presenceRef] = usePresence(open);
+    const { floatingRef, pos } = useFloating(triggerRef, mounted, {
+        side,
+        align,
+        sideOffset,
+        alignOffset,
+    });
+    if (!mounted)
+        return null;
+    return (_jsx(Portal, { children: _jsx("div", { ref: mergeRefs(floatingRef, presenceRef, ref), id: contentId, "data-slot": "hover-card-content", "data-state": open ? "open" : "closed", "data-open": open ? "" : undefined, "data-closed": open ? undefined : "", "data-side": pos?.side ?? side, style: {
+                ...style,
+                position: "fixed",
+                left: pos?.x ?? 0,
+                top: pos?.y ?? 0,
+                visibility: pos ? "visible" : "hidden",
+                ["--transform-origin"]: pos?.transformOrigin ?? "center",
+            }, onMouseEnter: (e) => {
+                onMouseEnter?.(e);
+                cancelClose();
+            }, onMouseLeave: (e) => {
+                onMouseLeave?.(e);
+                scheduleClose();
+            }, className: cn("isolate z-50 w-64 origin-(--transform-origin) rounded-lg bg-popover p-4 text-sm text-popover-foreground shadow-md ring-1 ring-foreground/10 outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className), ...props }) }));
+}
+export { HoverCard, HoverCardTrigger, HoverCardContent };

package/dist/ui/input-group.d.ts

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { type VariantProps } from "../shadcn/lib/cva.js";
+import { Button } from "./button.js";
+declare function InputGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare const inputGroupAddonVariants: (props?: import("../shadcn/lib/cva.js").CvaProps<{
+    align: {
+        "inline-start": string;
+        "inline-end": string;
+        "block-start": string;
+        "block-end": string;
+    };
+}> | undefined) => string;
+declare function InputGroupAddon({ className, align, ...props }: React.ComponentProps<"div"> & VariantProps<typeof inputGroupAddonVariants>): React.JSX.Element;
+declare const inputGroupButtonVariants: (props?: import("../shadcn/lib/cva.js").CvaProps<{
+    size: {
+        xs: string;
+        sm: string;
+        "icon-xs": string;
+        "icon-sm": string;
+    };
+}> | undefined) => string;
+declare function InputGroupButton({ className, type, variant, size, ...props }: Omit<React.ComponentProps<typeof Button>, "size" | "type"> & VariantProps<typeof inputGroupButtonVariants> & {
+    type?: "button" | "submit" | "reset";
+}): React.JSX.Element;
+declare function InputGroupText({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
+declare function InputGroupInput({ className, ...props }: React.ComponentProps<"input">): React.JSX.Element;
+declare function InputGroupTextarea({ className, ...props }: React.ComponentProps<"textarea">): React.JSX.Element;
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InputGroupInput, InputGroupTextarea, };

package/dist/ui/input-group.js

@@ -0,0 +1,58 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cva } from "../shadcn/lib/cva.js";
+import { cn } from "../shadcn/lib/utils.js";
+import { Button } from "./button.js";
+import { Input } from "./input.js";
+import { Textarea } from "./textarea.js";
+function InputGroup({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "input-group", role: "group", className: cn("group/input-group relative flex h-9 w-full min-w-0 items-center rounded-md border border-input shadow-xs transition-[color,box-shadow] outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto dark:bg-input/30 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5", className), ...props }));
+}
+const inputGroupAddonVariants = cva("flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4", {
+    variants: {
+        align: {
+            "inline-start": "order-first pl-2 has-[>button]:-ml-1 has-[>kbd]:ml-[-0.15rem]",
+            "inline-end": "order-last pr-2 has-[>button]:-mr-1 has-[>kbd]:mr-[-0.15rem]",
+            "block-start": "order-first w-full justify-start px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2",
+            "block-end": "order-last w-full justify-start px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2",
+        },
+    },
+    defaultVariants: {
+        align: "inline-start",
+    },
+});
+function InputGroupAddon({ className, align = "inline-start", ...props }) {
+    return (_jsx("div", { role: "group", "data-slot": "input-group-addon", "data-align": align, className: cn(inputGroupAddonVariants({ align }), className), onClick: (e) => {
+            if (e.target.closest("button")) {
+                return;
+            }
+            e.currentTarget.parentElement?.querySelector("input")?.focus();
+        }, ...props }));
+}
+const inputGroupButtonVariants = cva("flex items-center gap-2 text-sm shadow-none", {
+    variants: {
+        size: {
+            xs: "h-6 gap-1 rounded-[calc(var(--radius)-5px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
+            sm: "",
+            "icon-xs": "size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0",
+            "icon-sm": "size-8 p-0 has-[>svg]:p-0",
+        },
+    },
+    defaultVariants: {
+        size: "xs",
+    },
+});
+function InputGroupButton({ className, type = "button", variant = "ghost", size = "xs", ...props }) {
+    return (_jsx(Button, { type: type, "data-size": size, variant: variant, className: cn(inputGroupButtonVariants({ size }), className), ...props }));
+}
+function InputGroupText({ className, ...props }) {
+    return (_jsx("span", { className: cn("flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className), ...props }));
+}
+function InputGroupInput({ className, ...props }) {
+    return (_jsx(Input, { "data-slot": "input-group-control", className: cn("flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 aria-invalid:ring-0 dark:bg-transparent", className), ...props }));
+}
+function InputGroupTextarea({ className, ...props }) {
+    return (_jsx(Textarea, { "data-slot": "input-group-control", className: cn("flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 aria-invalid:ring-0 dark:bg-transparent", className), ...props }));
+}
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InputGroupInput, InputGroupTextarea, };

package/dist/ui/input.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+declare function Input({ className, type, ...props }: React.ComponentProps<"input">): React.JSX.Element;
+export { Input };

package/dist/ui/input.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../shadcn/lib/utils.js";
+function Input({ className, type, ...props }) {
+    return (_jsx("input", { type: type, "data-slot": "input", className: cn("h-9 w-full min-w-0 rounded-md border border-input bg-transparent px-2.5 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40", className), ...props }));
+}
+export { Input };

package/dist/ui/item.d.ts

@@ -0,0 +1,41 @@
+import * as React from "react";
+import { type VariantProps } from "../shadcn/lib/cva.js";
+import { Separator } from "./separator.js";
+declare function ItemGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function ItemSeparator({ className, ...props }: React.ComponentProps<typeof Separator>): React.JSX.Element;
+declare const itemVariants: (props?: import("../shadcn/lib/cva.js").CvaProps<{
+    variant: {
+        default: string;
+        outline: string;
+        muted: string;
+    };
+    size: {
+        default: string;
+        sm: string;
+        xs: string;
+    };
+}> | undefined) => string;
+export interface ItemProps extends React.ComponentProps<"div">, VariantProps<typeof itemVariants> {
+    /** Render the single child element styled as an item (e.g. an `<a>`). */
+    asChild?: boolean;
+    /** Base UI compat: a React element rendered in place of the item. */
+    render?: React.ReactElement;
+    /** Base UI compat: ignored (the element is inferred from `render`/`asChild`). */
+    nativeButton?: boolean;
+}
+declare function Item({ className, variant, size, asChild, render, nativeButton: _nativeButton, children, ...props }: ItemProps): React.JSX.Element;
+declare const itemMediaVariants: (props?: import("../shadcn/lib/cva.js").CvaProps<{
+    variant: {
+        default: string;
+        icon: string;
+        image: string;
+    };
+}> | undefined) => string;
+declare function ItemMedia({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof itemMediaVariants>): React.JSX.Element;
+declare function ItemContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function ItemTitle({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function ItemDescription({ className, ...props }: React.ComponentProps<"p">): React.JSX.Element;
+declare function ItemActions({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function ItemHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function ItemFooter({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+export { Item, ItemMedia, ItemContent, ItemActions, ItemGroup, ItemSeparator, ItemTitle, ItemDescription, ItemHeader, ItemFooter, };

package/dist/ui/item.js

@@ -0,0 +1,69 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cva } from "../shadcn/lib/cva.js";
+import { cn } from "../shadcn/lib/utils.js";
+import { Slot, resolveRender } from "./slot.js";
+import { Separator } from "./separator.js";
+function ItemGroup({ className, ...props }) {
+    return (_jsx("div", { role: "list", "data-slot": "item-group", className: cn("group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2", className), ...props }));
+}
+function ItemSeparator({ className, ...props }) {
+    return (_jsx(Separator, { "data-slot": "item-separator", orientation: "horizontal", className: cn("my-2", className), ...props }));
+}
+const itemVariants = cva("group/item flex w-full flex-wrap items-center rounded-md border text-sm transition-colors duration-100 outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 [a]:transition-colors [a]:hover:bg-muted", {
+    variants: {
+        variant: {
+            default: "border-transparent",
+            outline: "border-border",
+            muted: "border-transparent bg-muted/50",
+        },
+        size: {
+            default: "gap-3.5 px-4 py-3.5",
+            sm: "gap-2.5 px-3 py-2.5",
+            xs: "gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default",
+    },
+});
+function Item({ className, variant = "default", size = "default", asChild = false, render, nativeButton: _nativeButton, children, ...props }) {
+    const { useSlot, slotChild } = resolveRender(asChild, render, children);
+    const Comp = useSlot ? Slot : "div";
+    return (_jsx(Comp, { "data-slot": "item", "data-variant": variant, "data-size": size, className: cn(itemVariants({ variant, size, className })), ...props, children: slotChild }));
+}
+const itemMediaVariants = cva("flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none", {
+    variants: {
+        variant: {
+            default: "bg-transparent",
+            icon: "[&_svg:not([class*='size-'])]:size-4",
+            image: "size-10 overflow-hidden rounded-sm group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+function ItemMedia({ className, variant = "default", ...props }) {
+    return (_jsx("div", { "data-slot": "item-media", "data-variant": variant, className: cn(itemMediaVariants({ variant, className })), ...props }));
+}
+function ItemContent({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "item-content", className: cn("flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none", className), ...props }));
+}
+function ItemTitle({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "item-title", className: cn("line-clamp-1 flex w-fit items-center gap-2 text-sm leading-snug font-medium underline-offset-4", className), ...props }));
+}
+function ItemDescription({ className, ...props }) {
+    return (_jsx("p", { "data-slot": "item-description", className: cn("line-clamp-2 text-left text-sm leading-normal font-normal text-muted-foreground group-data-[size=xs]/item:text-xs [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className), ...props }));
+}
+function ItemActions({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "item-actions", className: cn("flex items-center gap-2", className), ...props }));
+}
+function ItemHeader({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "item-header", className: cn("flex basis-full items-center justify-between gap-2", className), ...props }));
+}
+function ItemFooter({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "item-footer", className: cn("flex basis-full items-center justify-between gap-2", className), ...props }));
+}
+export { Item, ItemMedia, ItemContent, ItemActions, ItemGroup, ItemSeparator, ItemTitle, ItemDescription, ItemHeader, ItemFooter, };

package/dist/ui/kbd.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+declare function Kbd({ className, ...props }: React.ComponentProps<"kbd">): React.JSX.Element;
+declare function KbdGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+export { Kbd, KbdGroup };

package/dist/ui/kbd.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../shadcn/lib/utils.js";
+function Kbd({ className, ...props }) {
+    return (_jsx("kbd", { "data-slot": "kbd", className: cn("pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-sm bg-muted px-1 font-sans text-xs font-medium text-muted-foreground select-none in-data-[slot=tooltip-content]:bg-background/20 in-data-[slot=tooltip-content]:text-background dark:in-data-[slot=tooltip-content]:bg-background/10 [&_svg:not([class*='size-'])]:size-3", className), ...props }));
+}
+function KbdGroup({ className, ...props }) {
+    return (_jsx("kbd", { "data-slot": "kbd-group", className: cn("inline-flex items-center gap-1", className), ...props }));
+}
+export { Kbd, KbdGroup };

package/dist/ui/label.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+declare function Label({ className, ...props }: React.ComponentProps<"label">): React.JSX.Element;
+export { Label };

package/dist/ui/label.js

@@ -0,0 +1,8 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../shadcn/lib/utils.js";
+function Label({ className, ...props }) {
+    return (_jsx("label", { "data-slot": "label", className: cn("flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50", className), ...props }));
+}
+export { Label };

package/dist/ui/menubar.d.ts

@@ -0,0 +1,59 @@
+import * as React from "react";
+import { type Side, type Align } from "./use-floating.js";
+declare function Menubar({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function MenubarMenu({ value: valueProp, children, }: {
+    value?: string;
+    children?: React.ReactNode;
+}): React.JSX.Element;
+declare function MenubarPortal({ children }: {
+    children?: React.ReactNode;
+}): React.JSX.Element;
+declare function MenubarGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function MenubarTrigger({ asChild, render, nativeButton: _nativeButton, children, className, onClick, onKeyDown, onMouseEnter, ...props }: React.ComponentProps<"button"> & {
+    asChild?: boolean;
+    render?: React.ReactElement;
+    nativeButton?: boolean;
+}): React.JSX.Element;
+export interface MenubarContentProps extends React.ComponentProps<"div"> {
+    side?: Side;
+    align?: Align;
+    sideOffset?: number;
+    alignOffset?: number;
+}
+declare function MenubarContent({ align, alignOffset, side, sideOffset, className, children, onKeyDown, ...props }: MenubarContentProps): React.JSX.Element | null;
+declare function MenubarLabel({ className, inset, ...props }: React.ComponentProps<"div"> & {
+    inset?: boolean;
+}): React.JSX.Element;
+export interface MenubarItemProps extends React.ComponentProps<"div"> {
+    inset?: boolean;
+    variant?: "default" | "destructive";
+    disabled?: boolean;
+    onSelect?: () => void;
+}
+declare function MenubarItem({ className, inset, variant, disabled, onSelect, onClick, ...props }: MenubarItemProps): React.JSX.Element;
+declare function MenubarCheckboxItem({ className, children, checked, onCheckedChange, disabled, inset, onClick, ...props }: Omit<React.ComponentProps<"div">, "onChange"> & {
+    checked?: boolean;
+    onCheckedChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    inset?: boolean;
+}): React.JSX.Element;
+declare function MenubarRadioGroup({ value, onValueChange, ...props }: React.ComponentProps<"div"> & {
+    value?: string;
+    onValueChange?: (value: string) => void;
+}): React.JSX.Element;
+declare function MenubarRadioItem({ className, children, value, disabled, inset, onClick, ...props }: Omit<React.ComponentProps<"div">, "value"> & {
+    value: string;
+    disabled?: boolean;
+    inset?: boolean;
+}): React.JSX.Element;
+declare function MenubarSeparator({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function MenubarShortcut({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
+declare function MenubarSub({ defaultOpen, children, }: {
+    defaultOpen?: boolean;
+    children?: React.ReactNode;
+}): React.JSX.Element;
+declare function MenubarSubTrigger({ className, inset, children, onClick, onKeyDown, onMouseEnter, ...props }: React.ComponentProps<"div"> & {
+    inset?: boolean;
+}): React.JSX.Element;
+declare function MenubarSubContent({ className, children, onKeyDown, ...props }: React.ComponentProps<"div">): React.JSX.Element | null;
+export { Menubar, MenubarPortal, MenubarMenu, MenubarTrigger, MenubarContent, MenubarGroup, MenubarSeparator, MenubarLabel, MenubarItem, MenubarShortcut, MenubarCheckboxItem, MenubarRadioGroup, MenubarRadioItem, MenubarSub, MenubarSubTrigger, MenubarSubContent, };