@hirely/ui 0.1.8 → 1.0.0

package/dist/components/ui/image-upload.js

@@ -0,0 +1,121 @@
+"use client";
+import { cn as e } from "../../node_modules/.bun/cnfast@0.0.8/node_modules/cnfast/dist/index.js";
+import { Button as t } from "./button.js";
+import { useDropzone as n } from "../../node_modules/.bun/react-dropzone@15.0.0_e14d3f224186685e/node_modules/react-dropzone/dist/es/index.js";
+import { AlertCircle as r, Loader2 as i, Upload as a, X as o } from "lucide-react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import l, { useCallback as u, useState as d } from "react";
+//#region src/components/ui/image-upload.tsx
+function f({ value: f, onChange: p, onRemove: m, className: h, classNames: g, maxSize: _ = 5 * 1024 * 1024, alt: v = "Upload preview", disabled: y = !1, loading: b = !1 }) {
+	let [x, S] = d(null), [C, w] = d(null);
+	l.useEffect(() => {
+		if (typeof f == "string") S(f);
+		else if (f instanceof File) {
+			let e = URL.createObjectURL(f);
+			return S(e), () => URL.revokeObjectURL(e);
+		} else S(null);
+	}, [f]);
+	let { getRootProps: T, getInputProps: E, isDragActive: D } = n({
+		onDrop: u((e, t) => {
+			if (w(null), t.length > 0) {
+				let e = t[0];
+				e.errors[0]?.code === "file-too-large" ? w(`File is too large. Max size is ${_ / (1024 * 1024)}MB.`) : e.errors[0]?.code === "file-invalid-type" ? w("Invalid file type. Please upload PNG, JPG, WEBP, or JPEG.") : w("Could not upload file. Please try again.");
+				return;
+			}
+			let n = e[0];
+			n && p(n);
+		}, [p, _]),
+		accept: { "image/*": [
+			".jpeg",
+			".jpg",
+			".png",
+			".webp"
+		] },
+		maxFiles: 1,
+		multiple: !1,
+		maxSize: _,
+		disabled: y
+	}), O = (e) => {
+		e.stopPropagation(), w(null), m(), S(null);
+	};
+	return /* @__PURE__ */ c("div", {
+		className: e("w-full", h, g?.root),
+		children: [/* @__PURE__ */ c("div", {
+			...T(),
+			className: e("w-full", g?.dropzone),
+			children: [/* @__PURE__ */ s("input", { ...E() }), b ? /* @__PURE__ */ c("div", {
+				className: e("flex flex-col items-center justify-center gap-3 rounded-lg border-2 border-dashed border-muted-foreground/25 bg-muted/50 py-12 text-center", g?.emptyState),
+				children: [/* @__PURE__ */ s(i, { className: "h-8 w-8 animate-spin text-muted-foreground" }), /* @__PURE__ */ s("p", {
+					className: "text-sm text-muted-foreground",
+					children: "Processing image…"
+				})]
+			}) : x ? /* @__PURE__ */ c("div", {
+				className: e("relative w-full overflow-hidden rounded-lg border border-border", "aspect-square max-w-[400px] mx-auto sm:aspect-video sm:max-h-[200px] sm:max-w-none", "cursor-pointer group/preview", g?.preview),
+				children: [
+					/* @__PURE__ */ s(t, {
+						type: "button",
+						onClick: O,
+						variant: "destructive",
+						size: "icon",
+						"aria-label": "Remove image",
+						className: e("absolute right-2 top-2 z-10 rounded-full h-8 w-8 shadow-lg opacity-0 group-hover/preview:opacity-100 transition-opacity", g?.removeButton),
+						children: /* @__PURE__ */ s(o, { className: "h-4 w-4" })
+					}),
+					/* @__PURE__ */ c("div", {
+						className: e("absolute inset-0 z-5 bg-black/40 flex flex-col items-center justify-center opacity-0 group-hover/preview:opacity-100 transition-opacity", g?.swapOverlay),
+						children: [/* @__PURE__ */ s(a, { className: "w-8 h-8 text-white mb-2" }), /* @__PURE__ */ s("span", {
+							className: "text-sm font-bold text-white uppercase tracking-widest",
+							children: "Swap Image"
+						})]
+					}),
+					/* @__PURE__ */ s("div", {
+						className: "absolute inset-0 w-full h-full scale-110 blur-xl opacity-30",
+						children: /* @__PURE__ */ s("img", {
+							sizes: "(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw",
+							src: x,
+							alt: "",
+							className: "object-cover w-full h-full"
+						})
+					}),
+					/* @__PURE__ */ s("div", { className: "absolute inset-0 bg-neutral-900/40" }),
+					/* @__PURE__ */ s("img", {
+						sizes: "(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw",
+						src: x,
+						alt: v,
+						className: e("size-full object-cover transition-all duration-300 relative z-0", g?.previewImage)
+					})
+				]
+			}) : /* @__PURE__ */ s("div", {
+				className: e("relative flex cursor-pointer flex-col items-center justify-center rounded-lg border-2 border-dashed border-muted-foreground/25 bg-muted/50 p-6 sm:p-12 text-center transition hover:bg-muted/80", D && "border-primary bg-primary/5", y && "opacity-50 cursor-not-allowed", g?.emptyState),
+				children: /* @__PURE__ */ c("div", {
+					className: "flex flex-col items-center gap-2 text-muted-foreground",
+					children: [/* @__PURE__ */ s("div", {
+						className: e("rounded-full bg-background p-4 shadow-sm border border-border", g?.emptyIcon),
+						children: /* @__PURE__ */ s(a, { className: "h-6 w-6" })
+					}), /* @__PURE__ */ c("div", {
+						className: "flex flex-col gap-1",
+						children: [/* @__PURE__ */ s("p", {
+							className: "text-sm font-semibold text-foreground",
+							children: "Click to upload or drag and drop"
+						}), /* @__PURE__ */ c("p", {
+							className: "text-xs",
+							children: [
+								"PNG, JPG, WEBP or JPEG (max. ",
+								_ / (1024 * 1024),
+								"MB)"
+							]
+						})]
+					})]
+				})
+			})]
+		}), C && /* @__PURE__ */ c("div", {
+			role: "alert",
+			className: e("mt-2 flex items-center gap-2 text-sm text-destructive", g?.error),
+			children: [/* @__PURE__ */ s(r, { className: "h-4 w-4 shrink-0" }), /* @__PURE__ */ s("span", { children: C })]
+		})]
+	});
+}
+//#endregion
+export { f as ImageUpload };
+
+//# sourceMappingURL=image-upload.js.map

package/dist/components/ui/image-upload.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-upload.js","names":[],"sources":["../../../src/components/ui/image-upload.tsx"],"sourcesContent":["\"use client\";\n\nimport React, { useCallback, useState } from \"react\";\nimport { useDropzone, type FileRejection } from \"react-dropzone\";\nimport { Upload, X, AlertCircle, Loader2 } from \"lucide-react\";\nimport { Button } from \"./button\";\nimport { cn } from \"../../lib/utils\";\n\nexport interface ImageUploadClassNames {\n    root?: string;\n    dropzone?: string;\n    preview?: string;\n    previewImage?: string;\n    removeButton?: string;\n    swapOverlay?: string;\n    emptyState?: string;\n    emptyIcon?: string;\n    error?: string;\n}\n\ninterface ImageUploadProps {\n    value?: string | File;\n    onChange: (file?: File) => void;\n    onRemove: () => void;\n    className?: string;\n    classNames?: ImageUploadClassNames;\n    /** Max file size in bytes (default: 5MB) */\n    maxSize?: number;\n    /** Custom alt text for the preview image */\n    alt?: string;\n    /** Disable the upload */\n    disabled?: boolean;\n    /** Show loading spinner */\n    loading?: boolean;\n}\n\nexport function ImageUpload({\n    value,\n    onChange,\n    onRemove,\n    className,\n    classNames,\n    maxSize = 5 * 1024 * 1024, // 5MB default\n    alt = \"Upload preview\",\n    disabled = false,\n    loading = false,\n}: ImageUploadProps) {\n    const [preview, setPreview] = useState<string | null>(null);\n    const [error, setError] = useState<string | null>(null);\n\n    // Generate preview from value\n    React.useEffect(() => {\n        if (typeof value === \"string\") {\n            setPreview(value);\n        } else if (value instanceof File) {\n            const objectUrl = URL.createObjectURL(value);\n            setPreview(objectUrl);\n            return () => URL.revokeObjectURL(objectUrl);\n        } else {\n            setPreview(null);\n        }\n    }, [value]);\n\n    const onDrop = useCallback(\n        (acceptedFiles: File[], rejectedFiles: FileRejection[]) => {\n            setError(null);\n\n            if (rejectedFiles.length > 0) {\n                const rejection = rejectedFiles[0];\n                if (rejection.errors[0]?.code === \"file-too-large\") {\n                    setError(`File is too large. Max size is ${maxSize / (1024 * 1024)}MB.`);\n                } else if (rejection.errors[0]?.code === \"file-invalid-type\") {\n                    setError(\"Invalid file type. Please upload PNG, JPG, WEBP, or JPEG.\");\n                } else {\n                    setError(\"Could not upload file. Please try again.\");\n                }\n                return;\n            }\n\n            const file = acceptedFiles[0];\n            if (file) {\n                onChange(file);\n            }\n        },\n        [onChange, maxSize]\n    );\n\n    const { getRootProps, getInputProps, isDragActive } = useDropzone({\n        onDrop,\n        accept: {\n            \"image/*\": [\".jpeg\", \".jpg\", \".png\", \".webp\"],\n        },\n        maxFiles: 1,\n        multiple: false,\n        maxSize,\n        disabled,\n    });\n\n    const handleRemove = (e: React.MouseEvent) => {\n        e.stopPropagation();\n        setError(null);\n        onRemove();\n        setPreview(null);\n    };\n\n    return (\n        <div className={cn(\"w-full\", className, classNames?.root)}>\n            <div\n                {...getRootProps()}\n                className={cn(\"w-full\", classNames?.dropzone)}\n            >\n                <input {...getInputProps()} />\n\n                {loading ? (\n                    // Loading state\n                    <div\n                        className={cn(\n                            \"flex flex-col items-center justify-center gap-3 rounded-lg border-2 border-dashed border-muted-foreground/25 bg-muted/50 py-12 text-center\",\n                            classNames?.emptyState\n                        )}\n                    >\n                        <Loader2 className=\"h-8 w-8 animate-spin text-muted-foreground\" />\n                        <p className=\"text-sm text-muted-foreground\">Processing image…</p>\n                    </div>\n                ) : preview ? (\n                    // Preview state\n                    <div\n                        className={cn(\n                            \"relative w-full overflow-hidden rounded-lg border border-border\",\n                            \"aspect-square max-w-[400px] mx-auto sm:aspect-video sm:max-h-[200px] sm:max-w-none\", // sensible defaults\n                            \"cursor-pointer group/preview\",\n                            classNames?.preview\n                        )}\n                    >\n                        {/* Remove button */}\n                        <Button\n                            type=\"button\"\n                            onClick={handleRemove}\n                            variant=\"destructive\"\n                            size=\"icon\"\n                            aria-label=\"Remove image\"\n                            className={cn(\n                                \"absolute right-2 top-2 z-10 rounded-full h-8 w-8 shadow-lg opacity-0 group-hover/preview:opacity-100 transition-opacity\",\n                                classNames?.removeButton\n                            )}\n                        >\n                            <X className=\"h-4 w-4\" />\n                        </Button>\n\n                        {/* Swap overlay */}\n                        <div\n                            className={cn(\n                                \"absolute inset-0 z-5 bg-black/40 flex flex-col items-center justify-center opacity-0 group-hover/preview:opacity-100 transition-opacity\",\n                                classNames?.swapOverlay\n                            )}\n                        >\n                            <Upload className=\"w-8 h-8 text-white mb-2\" />\n                            <span className=\"text-sm font-bold text-white uppercase tracking-widest\">\n                                Swap Image\n                            </span>\n                        </div>\n\n                        {/* Ambient blurred background */}\n                        <div className=\"absolute inset-0 w-full h-full scale-110 blur-xl opacity-30\">\n                            <img\n                                sizes=\"(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw\"\n                                src={preview}\n                                alt=\"\"\n                                className=\"object-cover w-full h-full\"\n                            />\n                        </div>\n\n                        {/* Dark tint */}\n                        <div className=\"absolute inset-0 bg-neutral-900/40\" />\n\n                        {/* Main image */}\n                        <img\n                            sizes=\"(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw\"\n                            src={preview}\n                            alt={alt}\n                            className={cn(\n                                \"size-full object-cover transition-all duration-300 relative z-0\",\n                                classNames?.previewImage\n                            )}\n                        />\n                    </div>\n                ) : (\n                    // Empty state\n                    <div\n                        className={cn(\n                            \"relative flex cursor-pointer flex-col items-center justify-center rounded-lg border-2 border-dashed border-muted-foreground/25 bg-muted/50 p-6 sm:p-12 text-center transition hover:bg-muted/80\",\n                            isDragActive && \"border-primary bg-primary/5\",\n                            disabled && \"opacity-50 cursor-not-allowed\",\n                            classNames?.emptyState\n                        )}\n                    >\n                        <div className=\"flex flex-col items-center gap-2 text-muted-foreground\">\n                            <div\n                                className={cn(\n                                    \"rounded-full bg-background p-4 shadow-sm border border-border\",\n                                    classNames?.emptyIcon\n                                )}\n                            >\n                                <Upload className=\"h-6 w-6\" />\n                            </div>\n                            <div className=\"flex flex-col gap-1\">\n                                <p className=\"text-sm font-semibold text-foreground\">\n                                    Click to upload or drag and drop\n                                </p>\n                                <p className=\"text-xs\">\n                                    PNG, JPG, WEBP or JPEG (max. {maxSize / (1024 * 1024)}MB)\n                                </p>\n                            </div>\n                        </div>\n                    </div>\n                )}\n            </div>\n\n            {/* Error message */}\n            {error && (\n                <div\n                    role=\"alert\"\n                    className={cn(\n                        \"mt-2 flex items-center gap-2 text-sm text-destructive\",\n                        classNames?.error\n                    )}\n                >\n                    <AlertCircle className=\"h-4 w-4 shrink-0\" />\n                    <span>{error}</span>\n                </div>\n            )}\n        </div>\n    );\n}"],"mappings":"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"}

package/dist/components/ui/input-group.js

@@ -0,0 +1,79 @@
+import { cn as e } from "../../node_modules/.bun/cnfast@0.0.8/node_modules/cnfast/dist/index.js";
+import { cva as t } from "../../node_modules/.bun/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import { Button as n } from "./button.js";
+import { Input as r } from "./input.js";
+import { Textarea as i } from "./textarea.js";
+import { jsx as a } from "react/jsx-runtime";
+import "react";
+//#region src/components/ui/input-group.tsx
+function o({ className: t, ...n }) {
+	return /* @__PURE__ */ a("div", {
+		"data-slot": "input-group",
+		role: "group",
+		className: e("group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-input transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:bg-input/50 has-disabled:opacity-50 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-disabled:bg-input/80 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", t),
+		...n
+	});
+}
+var s = t("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-[-0.3rem] has-[>kbd]:ml-[-0.15rem]",
+		"inline-end": "order-last pr-2 has-[>button]:mr-[-0.3rem] 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 c({ className: t, align: n = "inline-start", ...r }) {
+	return /* @__PURE__ */ a("div", {
+		role: "group",
+		"data-slot": "input-group-addon",
+		"data-align": n,
+		className: e(s({ align: n }), t),
+		onClick: (e) => {
+			e.target.closest("button") || e.currentTarget.parentElement?.querySelector("input")?.focus();
+		},
+		...r
+	});
+}
+var l = t("flex items-center gap-2 text-sm shadow-none", {
+	variants: { size: {
+		xs: "h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
+		sm: "",
+		"icon-xs": "size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0",
+		"icon-sm": "size-8 p-0 has-[>svg]:p-0"
+	} },
+	defaultVariants: { size: "xs" }
+});
+function u({ className: t, type: r = "button", variant: i = "ghost", size: o = "xs", ...s }) {
+	return /* @__PURE__ */ a(n, {
+		type: r,
+		"data-size": o,
+		variant: i,
+		className: e(l({ size: o }), t),
+		...s
+	});
+}
+function d({ className: t, ...n }) {
+	return /* @__PURE__ */ a("span", {
+		className: e("flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", t),
+		...n
+	});
+}
+function f({ className: t, ...n }) {
+	return /* @__PURE__ */ a(r, {
+		"data-slot": "input-group-control",
+		className: e("flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", t),
+		...n
+	});
+}
+function p({ className: t, ...n }) {
+	return /* @__PURE__ */ a(i, {
+		"data-slot": "input-group-control",
+		className: e("flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", t),
+		...n
+	});
+}
+//#endregion
+export { o as InputGroup, c as InputGroupAddon, u as InputGroupButton, f as InputGroupInput, d as InputGroupText, p as InputGroupTextarea };
+
+//# sourceMappingURL=input-group.js.map

package/dist/components/ui/input-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-group.js","names":[],"sources":["../../../src/components/ui/input-group.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"../../lib/utils\"\nimport { Button } from \"./button\"\nimport { Input } from \"./input\"\nimport { Textarea } from \"./textarea\"\n\nfunction InputGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"input-group\"\n      role=\"group\"\n      className={cn(\n        \"group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-input transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:bg-input/50 has-disabled:opacity-50 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-disabled:bg-input/80 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\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nconst inputGroupAddonVariants = cva(\n  \"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\",\n  {\n    variants: {\n      align: {\n        \"inline-start\":\n          \"order-first pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]\",\n        \"inline-end\":\n          \"order-last pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]\",\n        \"block-start\":\n          \"order-first w-full justify-start px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2\",\n        \"block-end\":\n          \"order-last w-full justify-start px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2\",\n      },\n    },\n    defaultVariants: {\n      align: \"inline-start\",\n    },\n  }\n)\n\nfunction InputGroupAddon({\n  className,\n  align = \"inline-start\",\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof inputGroupAddonVariants>) {\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"input-group-addon\"\n      data-align={align}\n      className={cn(inputGroupAddonVariants({ align }), className)}\n      onClick={(e) => {\n        if ((e.target as HTMLElement).closest(\"button\")) {\n          return\n        }\n        e.currentTarget.parentElement?.querySelector(\"input\")?.focus()\n      }}\n      {...props}\n    />\n  )\n}\n\nconst inputGroupButtonVariants = cva(\n  \"flex items-center gap-2 text-sm shadow-none\",\n  {\n    variants: {\n      size: {\n        xs: \"h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5\",\n        sm: \"\",\n        \"icon-xs\":\n          \"size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0\",\n        \"icon-sm\": \"size-8 p-0 has-[>svg]:p-0\",\n      },\n    },\n    defaultVariants: {\n      size: \"xs\",\n    },\n  }\n)\n\nfunction InputGroupButton({\n  className,\n  type = \"button\",\n  variant = \"ghost\",\n  size = \"xs\",\n  ...props\n}: Omit<React.ComponentProps<typeof Button>, \"size\" | \"type\"> &\n  VariantProps<typeof inputGroupButtonVariants> & {\n    type?: \"button\" | \"submit\" | \"reset\"\n  }) {\n  return (\n    <Button\n      type={type}\n      data-size={size}\n      variant={variant}\n      className={cn(inputGroupButtonVariants({ size }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction InputGroupText({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      className={cn(\n        \"flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction InputGroupInput({\n  className,\n  ...props\n}: React.ComponentProps<\"input\">) {\n  return (\n    <Input\n      data-slot=\"input-group-control\"\n      className={cn(\n        \"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction InputGroupTextarea({\n  className,\n  ...props\n}: React.ComponentProps<\"textarea\">) {\n  return (\n    <Textarea\n      data-slot=\"input-group-control\"\n      className={cn(\n        \"flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  InputGroup,\n  InputGroupAddon,\n  InputGroupButton,\n  InputGroupText,\n  InputGroupInput,\n  InputGroupTextarea,\n}\n"],"mappings":";;;;;;;;AAQA,SAAS,EAAW,EAAE,cAAW,GAAG,KAAsC;CACxE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,MAAK;EACL,WAAW,EACT,ylCACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,IAA0B,EAC9B,2PACA;CACE,UAAU,EACR,OAAO;EACL,gBACE;EACF,cACE;EACF,eACE;EACF,aACE;CACJ,EACF;CACA,iBAAiB,EACf,OAAO,eACT;AACF,CACF;AAEA,SAAS,EAAgB,EACvB,cACA,WAAQ,gBACR,GAAG,KAC0E;CAC7E,OACE,kBAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,cAAY;EACZ,WAAW,EAAG,EAAwB,EAAE,SAAM,CAAC,GAAG,CAAS;EAC3D,UAAU,MAAM;GACT,EAAE,OAAuB,QAAQ,QAAQ,KAG9C,EAAE,cAAc,eAAe,cAAc,OAAO,CAAC,EAAE,MAAM;EAC/D;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,IAA2B,EAC/B,+CACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,WACE;EACF,WAAW;CACb,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CACF;AAEA,SAAS,EAAiB,EACxB,cACA,UAAO,UACP,aAAU,SACV,UAAO,MACP,GAAG,KAIA;CACH,OACE,kBAAC,GAAD;EACQ;EACN,aAAW;EACF;EACT,WAAW,EAAG,EAAyB,EAAE,QAAK,CAAC,GAAG,CAAS;EAC3D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAe,EAAE,cAAW,GAAG,KAAuC;CAC7E,OACE,kBAAC,QAAD;EACE,WAAW,EACT,0HACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAgB,EACvB,cACA,GAAG,KAC6B;CAChC,OACE,kBAAC,GAAD;EACE,aAAU;EACV,WAAW,EACT,oLACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAmB,EAC1B,cACA,GAAG,KACgC;CACnC,OACE,kBAAC,GAAD;EACE,aAAU;EACV,WAAW,EACT,qMACA,CACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/components/ui/input-otp.js

@@ -0,0 +1,48 @@
+import { cn as e } from "../../node_modules/.bun/cnfast@0.0.8/node_modules/cnfast/dist/index.js";
+import { OTPInput as t, OTPInputContext as n } from "../../node_modules/.bun/input-otp@1.4.2_7492c01c6988791b/node_modules/input-otp/dist/index.js";
+import { MinusIcon as r } from "lucide-react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import * as o from "react";
+//#region src/components/ui/input-otp.tsx
+function s({ className: n, containerClassName: r, ...a }) {
+	return /* @__PURE__ */ i(t, {
+		"data-slot": "input-otp",
+		containerClassName: e("cn-input-otp flex items-center has-disabled:opacity-50", r),
+		spellCheck: !1,
+		className: e("disabled:cursor-not-allowed", n),
+		...a
+	});
+}
+function c({ className: t, ...n }) {
+	return /* @__PURE__ */ i("div", {
+		"data-slot": "input-otp-group",
+		className: e("flex items-center rounded-lg has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40", t),
+		...n
+	});
+}
+function l({ index: t, className: r, ...s }) {
+	let { char: c, hasFakeCaret: l, isActive: u } = o.useContext(n)?.slots[t] ?? {};
+	return /* @__PURE__ */ a("div", {
+		"data-slot": "input-otp-slot",
+		"data-active": u,
+		className: e("relative flex size-8 items-center justify-center border-y border-r border-input text-sm transition-all outline-none first:rounded-l-lg first:border-l last:rounded-r-lg aria-invalid:border-destructive data-[active=true]:z-10 data-[active=true]:border-ring data-[active=true]:ring-3 data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:data-[active=true]:aria-invalid:ring-destructive/40", r),
+		...s,
+		children: [c, l && /* @__PURE__ */ i("div", {
+			className: "pointer-events-none absolute inset-0 flex items-center justify-center",
+			children: /* @__PURE__ */ i("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000" })
+		})]
+	});
+}
+function u({ ...e }) {
+	return /* @__PURE__ */ i("div", {
+		"data-slot": "input-otp-separator",
+		className: "flex items-center [&_svg:not([class*='size-'])]:size-4",
+		role: "separator",
+		...e,
+		children: /* @__PURE__ */ i(r, {})
+	});
+}
+//#endregion
+export { s as InputOTP, c as InputOTPGroup, u as InputOTPSeparator, l as InputOTPSlot };
+
+//# sourceMappingURL=input-otp.js.map

package/dist/components/ui/input-otp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-otp.js","names":[],"sources":["../../../src/components/ui/input-otp.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { OTPInput, OTPInputContext } from \"input-otp\"\n\nimport { cn } from \"../../lib/utils\"\nimport { MinusIcon } from \"lucide-react\"\n\nfunction InputOTP({\n  className,\n  containerClassName,\n  ...props\n}: React.ComponentProps<typeof OTPInput> & {\n  containerClassName?: string\n}) {\n  return (\n    <OTPInput\n      data-slot=\"input-otp\"\n      containerClassName={cn(\n        \"cn-input-otp flex items-center has-disabled:opacity-50\",\n        containerClassName\n      )}\n      spellCheck={false}\n      className={cn(\"disabled:cursor-not-allowed\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction InputOTPGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"input-otp-group\"\n      className={cn(\n        \"flex items-center rounded-lg has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction InputOTPSlot({\n  index,\n  className,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  index: number\n}) {\n  const inputOTPContext = React.useContext(OTPInputContext)\n  const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {}\n\n  return (\n    <div\n      data-slot=\"input-otp-slot\"\n      data-active={isActive}\n      className={cn(\n        \"relative flex size-8 items-center justify-center border-y border-r border-input text-sm transition-all outline-none first:rounded-l-lg first:border-l last:rounded-r-lg aria-invalid:border-destructive data-[active=true]:z-10 data-[active=true]:border-ring data-[active=true]:ring-3 data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:data-[active=true]:aria-invalid:ring-destructive/40\",\n        className\n      )}\n      {...props}\n    >\n      {char}\n      {hasFakeCaret && (\n        <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n          <div className=\"h-4 w-px animate-caret-blink bg-foreground duration-1000\" />\n        </div>\n      )}\n    </div>\n  )\n}\n\nfunction InputOTPSeparator({ ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"input-otp-separator\"\n      className=\"flex items-center [&_svg:not([class*='size-'])]:size-4\"\n      role=\"separator\"\n      {...props}\n    >\n      <MinusIcon\n      />\n    </div>\n  )\n}\n\nexport { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator }\n"],"mappings":";;;;;;AAMA,SAAS,EAAS,EAChB,cACA,uBACA,GAAG,KAGF;CACD,OACE,kBAAC,GAAD;EACE,aAAU;EACV,oBAAoB,EAClB,0DACA,CACF;EACA,YAAY;EACZ,WAAW,EAAG,+BAA+B,CAAS;EACtD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAc,EAAE,cAAW,GAAG,KAAsC;CAC3E,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,2KACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAa,EACpB,UACA,cACA,GAAG,KAGF;CAED,IAAM,EAAE,SAAM,iBAAc,gBADJ,EAAM,WAAW,CACA,CAAA,EAAiB,MAAM,MAAU,CAAC;CAE3E,OACE,kBAAC,OAAD;EACE,aAAU;EACV,eAAa;EACb,WAAW,EACT,6eACA,CACF;EACA,GAAI;YAPN,CASG,GACA,KACC,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,OAAD,EAAK,WAAU,2DAA4D,CAAA;EACxE,CAAA,CAEJ;;AAET;AAEA,SAAS,EAAkB,EAAE,GAAG,KAAsC;CACpE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAU;EACV,MAAK;EACL,GAAI;YAEJ,kBAAC,GAAD,CACC,CAAA;CACE,CAAA;AAET"}

package/dist/components/ui/input.js

@@ -0,0 +1,17 @@
+import { cn as e } from "../../node_modules/.bun/cnfast@0.0.8/node_modules/cnfast/dist/index.js";
+import { jsx as t } from "react/jsx-runtime";
+import "react";
+import { Input as n } from "@base-ui/react/input";
+//#region src/components/ui/input.tsx
+function r({ className: r, type: i, ...a }) {
+	return /* @__PURE__ */ t(n, {
+		type: i,
+		"data-slot": "input",
+		className: e("h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 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:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40", r),
+		...a
+	});
+}
+//#endregion
+export { r as Input };
+
+//# sourceMappingURL=input.js.map

package/dist/components/ui/input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.js","names":[],"sources":["../../../src/components/ui/input.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { Input as InputPrimitive } from \"@base-ui/react/input\"\n\nimport { cn } from \"../../lib/utils\"\n\nfunction Input({ className, type, ...props }: React.ComponentProps<\"input\">) {\n  return (\n    <InputPrimitive\n      type={type}\n      data-slot=\"input\"\n      className={cn(\n        \"h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 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:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Input }\n"],"mappings":";;;;;AAKA,SAAS,EAAM,EAAE,cAAW,SAAM,GAAG,KAAwC;CAC3E,OACE,kBAAC,GAAD;EACQ;EACN,aAAU;EACV,WAAW,EACT,+oBACA,CACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/components/ui/item.js

@@ -0,0 +1,123 @@
+import { cn as e } from "../../node_modules/.bun/cnfast@0.0.8/node_modules/cnfast/dist/index.js";
+import { cva as t } from "../../node_modules/.bun/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import { Separator as n } from "./separator.js";
+import { jsx as r } from "react/jsx-runtime";
+import "react";
+import { mergeProps as i } from "@base-ui/react/merge-props";
+import { useRender as a } from "@base-ui/react/use-render";
+//#region src/components/ui/item.tsx
+function o({ className: t, ...n }) {
+	return /* @__PURE__ */ r("div", {
+		role: "list",
+		"data-slot": "item-group",
+		className: e("group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2", t),
+		...n
+	});
+}
+function s({ className: t, ...i }) {
+	return /* @__PURE__ */ r(n, {
+		"data-slot": "item-separator",
+		orientation: "horizontal",
+		className: e("my-2", t),
+		...i
+	});
+}
+var c = t("group/item flex w-full flex-wrap items-center rounded-lg 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-2.5 px-3 py-2.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 l({ className: t, variant: n = "default", size: r = "default", render: o, ...s }) {
+	return a({
+		defaultTagName: "div",
+		props: i({ className: e(c({
+			variant: n,
+			size: r,
+			className: t
+		})) }, s),
+		render: o,
+		state: {
+			slot: "item",
+			variant: n,
+			size: r
+		}
+	});
+}
+var u = t("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 d({ className: t, variant: n = "default", ...i }) {
+	return /* @__PURE__ */ r("div", {
+		"data-slot": "item-media",
+		"data-variant": n,
+		className: e(u({
+			variant: n,
+			className: t
+		})),
+		...i
+	});
+}
+function f({ className: t, ...n }) {
+	return /* @__PURE__ */ r("div", {
+		"data-slot": "item-content",
+		className: e("flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none", t),
+		...n
+	});
+}
+function p({ className: t, ...n }) {
+	return /* @__PURE__ */ r("div", {
+		"data-slot": "item-title",
+		className: e("line-clamp-1 flex w-fit items-center gap-2 text-sm leading-snug font-medium underline-offset-4", t),
+		...n
+	});
+}
+function m({ className: t, ...n }) {
+	return /* @__PURE__ */ r("p", {
+		"data-slot": "item-description",
+		className: e("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", t),
+		...n
+	});
+}
+function h({ className: t, ...n }) {
+	return /* @__PURE__ */ r("div", {
+		"data-slot": "item-actions",
+		className: e("flex items-center gap-2", t),
+		...n
+	});
+}
+function g({ className: t, ...n }) {
+	return /* @__PURE__ */ r("div", {
+		"data-slot": "item-header",
+		className: e("flex basis-full items-center justify-between gap-2", t),
+		...n
+	});
+}
+function _({ className: t, ...n }) {
+	return /* @__PURE__ */ r("div", {
+		"data-slot": "item-footer",
+		className: e("flex basis-full items-center justify-between gap-2", t),
+		...n
+	});
+}
+//#endregion
+export { l as Item, h as ItemActions, f as ItemContent, m as ItemDescription, _ as ItemFooter, o as ItemGroup, g as ItemHeader, d as ItemMedia, s as ItemSeparator, p as ItemTitle };
+
+//# sourceMappingURL=item.js.map

package/dist/components/ui/item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"item.js","names":[],"sources":["../../../src/components/ui/item.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { mergeProps } from \"@base-ui/react/merge-props\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"../../lib/utils\"\nimport { Separator } from \"./separator\"\n\nfunction ItemGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      role=\"list\"\n      data-slot=\"item-group\"\n      className={cn(\n        \"group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ItemSeparator({\n  className,\n  ...props\n}: React.ComponentProps<typeof Separator>) {\n  return (\n    <Separator\n      data-slot=\"item-separator\"\n      orientation=\"horizontal\"\n      className={cn(\"my-2\", className)}\n      {...props}\n    />\n  )\n}\n\nconst itemVariants = cva(\n  \"group/item flex w-full flex-wrap items-center rounded-lg 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\",\n  {\n    variants: {\n      variant: {\n        default: \"border-transparent\",\n        outline: \"border-border\",\n        muted: \"border-transparent bg-muted/50\",\n      },\n      size: {\n        default: \"gap-2.5 px-3 py-2.5\",\n        sm: \"gap-2.5 px-3 py-2.5\",\n        xs: \"gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nfunction Item({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  render,\n  ...props\n}: useRender.ComponentProps<\"div\"> & VariantProps<typeof itemVariants>) {\n  return useRender({\n    defaultTagName: \"div\",\n    props: mergeProps<\"div\">(\n      {\n        className: cn(itemVariants({ variant, size, className })),\n      },\n      props\n    ),\n    render,\n    state: {\n      slot: \"item\",\n      variant,\n      size,\n    },\n  })\n}\n\nconst itemMediaVariants = cva(\n  \"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\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-transparent\",\n        icon: \"[&_svg:not([class*='size-'])]:size-4\",\n        image:\n          \"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\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction ItemMedia({\n  className,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof itemMediaVariants>) {\n  return (\n    <div\n      data-slot=\"item-media\"\n      data-variant={variant}\n      className={cn(itemMediaVariants({ variant, className }))}\n      {...props}\n    />\n  )\n}\n\nfunction ItemContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-content\"\n      className={cn(\n        \"flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ItemTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-title\"\n      className={cn(\n        \"line-clamp-1 flex w-fit items-center gap-2 text-sm leading-snug font-medium underline-offset-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ItemDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p\n      data-slot=\"item-description\"\n      className={cn(\n        \"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\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ItemActions({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-actions\"\n      className={cn(\"flex items-center gap-2\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction ItemHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-header\"\n      className={cn(\n        \"flex basis-full items-center justify-between gap-2\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ItemFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-footer\"\n      className={cn(\n        \"flex basis-full items-center justify-between gap-2\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Item,\n  ItemMedia,\n  ItemContent,\n  ItemActions,\n  ItemGroup,\n  ItemSeparator,\n  ItemTitle,\n  ItemDescription,\n  ItemHeader,\n  ItemFooter,\n}\n"],"mappings":";;;;;;;;AAQA,SAAS,EAAU,EAAE,cAAW,GAAG,KAAsC;CACvE,OACE,kBAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,WAAW,EACT,mGACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAc,EACrB,cACA,GAAG,KACsC;CACzC,OACE,kBAAC,GAAD;EACE,aAAU;EACV,aAAY;EACZ,WAAW,EAAG,QAAQ,CAAS;EAC/B,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,IAAe,EACnB,8OACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,SAAS;GACT,OAAO;EACT;EACA,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;EACN;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CACF;AAEA,SAAS,EAAK,EACZ,cACA,aAAU,WACV,UAAO,WACP,WACA,GAAG,KACmE;CACtE,OAAO,EAAU;EACf,gBAAgB;EAChB,OAAO,EACL,EACE,WAAW,EAAG,EAAa;GAAE;GAAS;GAAM;EAAU,CAAC,CAAC,EAC1D,GACA,CACF;EACA;EACA,OAAO;GACL,MAAM;GACN;GACA;EACF;CACF,CAAC;AACH;AAEA,IAAM,IAAoB,EACxB,kMACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,MAAM;EACN,OACE;CACJ,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CACF;AAEA,SAAS,EAAU,EACjB,cACA,aAAU,WACV,GAAG,KACoE;CACvE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,gBAAc;EACd,WAAW,EAAG,EAAkB;GAAE;GAAS;EAAU,CAAC,CAAC;EACvD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAY,EAAE,cAAW,GAAG,KAAsC;CACzE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,qGACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAU,EAAE,cAAW,GAAG,KAAsC;CACvE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,kGACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAgB,EAAE,cAAW,GAAG,KAAoC;CAC3E,OACE,kBAAC,KAAD;EACE,aAAU;EACV,WAAW,EACT,uLACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAY,EAAE,cAAW,GAAG,KAAsC;CACzE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EAAG,2BAA2B,CAAS;EAClD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAW,EAAE,cAAW,GAAG,KAAsC;CACxE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,sDACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAW,EAAE,cAAW,GAAG,KAAsC;CACxE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,sDACA,CACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/components/ui/kbd.js

@@ -0,0 +1,22 @@
+import { cn as e } from "../../node_modules/.bun/cnfast@0.0.8/node_modules/cnfast/dist/index.js";
+import { jsx as t } from "react/jsx-runtime";
+import "react";
+//#region src/components/ui/kbd.tsx
+function n({ className: n, ...r }) {
+	return /* @__PURE__ */ t("kbd", {
+		"data-slot": "kbd",
+		className: e("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", n),
+		...r
+	});
+}
+function r({ className: n, ...r }) {
+	return /* @__PURE__ */ t("kbd", {
+		"data-slot": "kbd-group",
+		className: e("inline-flex items-center gap-1", n),
+		...r
+	});
+}
+//#endregion
+export { n as Kbd, r as KbdGroup };
+
+//# sourceMappingURL=kbd.js.map

package/dist/components/ui/kbd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kbd.js","names":[],"sources":["../../../src/components/ui/kbd.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { cn } from \"../../lib/utils\"\n\nfunction Kbd({ className, ...props }: React.ComponentProps<\"kbd\">) {\n  return (\n    <kbd\n      data-slot=\"kbd\"\n      className={cn(\n        \"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\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction KbdGroup({ className, ...props }: React.ComponentProps<\"kbd\">) {\n  return (\n    <kbd\n      data-slot=\"kbd-group\"\n      className={cn(\"inline-flex items-center gap-1\", className)}\n      {...props}\n    />\n  )\n}\n\nexport { Kbd, KbdGroup }\n"],"mappings":";;;;AAIA,SAAS,EAAI,EAAE,cAAW,GAAG,KAAsC;CACjE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,yWACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAS,EAAE,cAAW,GAAG,KAAsC;CACtE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EAAG,kCAAkC,CAAS;EACzD,GAAI;CACL,CAAA;AAEL"}

package/dist/components/ui/label.js

@@ -0,0 +1,16 @@
+"use client";
+import { cn as e } from "../../node_modules/.bun/cnfast@0.0.8/node_modules/cnfast/dist/index.js";
+import { jsx as t } from "react/jsx-runtime";
+import "react";
+//#region src/components/ui/label.tsx
+function n({ className: n, ...r }) {
+	return /* @__PURE__ */ t("label", {
+		"data-slot": "label",
+		className: e("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", n),
+		...r
+	});
+}
+//#endregion
+export { n as Label };
+
+//# sourceMappingURL=label.js.map

package/dist/components/ui/label.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.js","names":[],"sources":["../../../src/components/ui/label.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { cn } from \"../../lib/utils\"\n\nfunction Label({ className, ...props }: React.ComponentProps<\"label\">) {\n  return (\n    <label\n      data-slot=\"label\"\n      className={cn(\n        \"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\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Label }\n"],"mappings":";;;;;AAMA,SAAS,EAAM,EAAE,cAAW,GAAG,KAAwC;CACrE,OACE,kBAAC,SAAD;EACE,aAAU;EACV,WAAW,EACT,uNACA,CACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/components/ui/marker.js

@@ -0,0 +1,45 @@
+import { cn as e } from "../../node_modules/.bun/cnfast@0.0.8/node_modules/cnfast/dist/index.js";
+import { cva as t } from "../../node_modules/.bun/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import { jsx as n } from "react/jsx-runtime";
+import "react";
+import { mergeProps as r } from "@base-ui/react/merge-props";
+import { useRender as i } from "@base-ui/react/use-render";
+//#region src/components/ui/marker.tsx
+var a = t("group/marker relative flex min-h-4 w-full items-center gap-2 text-left text-sm text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [a]:underline [a]:underline-offset-3 [a]:hover:text-foreground", { variants: { variant: {
+	default: "",
+	separator: "before:mr-1 before:h-px before:min-w-0 before:flex-1 before:bg-border after:ml-1 after:h-px after:min-w-0 after:flex-1 after:bg-border",
+	border: "border-b border-border pb-2"
+} } });
+function o({ className: t, variant: n = "default", render: o, ...s }) {
+	return i({
+		defaultTagName: "div",
+		props: r({ className: e(a({
+			variant: n,
+			className: t
+		})) }, s),
+		render: o,
+		state: {
+			slot: "marker",
+			variant: n
+		}
+	});
+}
+function s({ className: t, ...r }) {
+	return /* @__PURE__ */ n("span", {
+		"data-slot": "marker-icon",
+		"aria-hidden": "true",
+		className: e("size-4 shrink-0 [&_svg:not([class*='size-'])]:size-4", t),
+		...r
+	});
+}
+function c({ className: t, ...r }) {
+	return /* @__PURE__ */ n("span", {
+		"data-slot": "marker-content",
+		className: e("min-w-0 wrap-break-word group-data-[variant=separator]/marker:flex-none group-data-[variant=separator]/marker:text-center *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground", t),
+		...r
+	});
+}
+//#endregion
+export { o as Marker, c as MarkerContent, s as MarkerIcon, a as markerVariants };
+
+//# sourceMappingURL=marker.js.map

package/dist/components/ui/marker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"marker.js","names":[],"sources":["../../../src/components/ui/marker.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { mergeProps } from \"@base-ui/react/merge-props\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"../../lib/utils\"\n\nconst markerVariants = cva(\n  \"group/marker relative flex min-h-4 w-full items-center gap-2 text-left text-sm text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [a]:underline [a]:underline-offset-3 [a]:hover:text-foreground\",\n  {\n    variants: {\n      variant: {\n        default: \"\",\n        separator:\n          \"before:mr-1 before:h-px before:min-w-0 before:flex-1 before:bg-border after:ml-1 after:h-px after:min-w-0 after:flex-1 after:bg-border\",\n        border: \"border-b border-border pb-2\",\n      },\n    },\n  }\n)\n\nfunction Marker({\n  className,\n  variant = \"default\",\n  render,\n  ...props\n}: useRender.ComponentProps<\"div\"> & VariantProps<typeof markerVariants>) {\n  return useRender({\n    defaultTagName: \"div\",\n    props: mergeProps<\"div\">(\n      {\n        className: cn(markerVariants({ variant, className })),\n      },\n      props\n    ),\n    render,\n    state: {\n      slot: \"marker\",\n      variant,\n    },\n  })\n}\n\nfunction MarkerIcon({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"marker-icon\"\n      aria-hidden=\"true\"\n      className={cn(\n        \"size-4 shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MarkerContent({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"marker-content\"\n      className={cn(\n        \"min-w-0 wrap-break-word group-data-[variant=separator]/marker:flex-none group-data-[variant=separator]/marker:text-center *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Marker, MarkerIcon, MarkerContent, markerVariants }\n"],"mappings":";;;;;;;AAOA,IAAM,IAAiB,EACrB,4MACA,EACE,UAAU,EACR,SAAS;CACP,SAAS;CACT,WACE;CACF,QAAQ;AACV,EACF,EACF,CACF;AAEA,SAAS,EAAO,EACd,cACA,aAAU,WACV,WACA,GAAG,KACqE;CACxE,OAAO,EAAU;EACf,gBAAgB;EAChB,OAAO,EACL,EACE,WAAW,EAAG,EAAe;GAAE;GAAS;EAAU,CAAC,CAAC,EACtD,GACA,CACF;EACA;EACA,OAAO;GACL,MAAM;GACN;EACF;CACF,CAAC;AACH;AAEA,SAAS,EAAW,EAAE,cAAW,GAAG,KAAuC;CACzE,OACE,kBAAC,QAAD;EACE,aAAU;EACV,eAAY;EACZ,WAAW,EACT,wDACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAc,EAAE,cAAW,GAAG,KAAuC;CAC5E,OACE,kBAAC,QAAD;EACE,aAAU;EACV,WAAW,EACT,kMACA,CACF;EACA,GAAI;CACL,CAAA;AAEL"}