tembro 1.0.0

package/dist/components/upload/file-upload.js

@@ -0,0 +1,311 @@
+import { cn as e, stopInteractivePropagation as t } from "../../lib/utils.js";
+import { Button as n } from "../ui/button/index.js";
+import * as r from "react";
+import { FileIcon as i, UploadCloudIcon as a, XIcon as o } from "lucide-react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/components/upload/file-upload.tsx
+function l(e) {
+	if (e === 0) return "0 B";
+	let t = [
+		"B",
+		"KB",
+		"MB",
+		"GB"
+	], n = Math.min(Math.floor(Math.log(e) / Math.log(1024)), t.length - 1), r = e / 1024 ** n;
+	return `${r.toFixed(r >= 10 || n === 0 ? 0 : 1)} ${t[n]}`;
+}
+function u(e) {
+	return e?.split(",").map((e) => e.trim().toLowerCase()).filter(Boolean) ?? [];
+}
+function d(e, t) {
+	let n = u(t);
+	if (n.length === 0) return !0;
+	let r = e.name.toLowerCase(), i = e.type.toLowerCase();
+	return n.some((e) => e.startsWith(".") ? r.endsWith(e) : e.endsWith("/*") ? i.startsWith(e.slice(0, -1)) : i === e);
+}
+function f(e) {
+	return `${e.name}-${e.size}-${e.lastModified}`;
+}
+function p(e, t) {
+	return typeof e == "number" ? e : e?.[f(t)] ?? e?.[t.name];
+}
+function m(e, t, n) {
+	let r = n?.[e], i = {
+		...t,
+		reason: e
+	};
+	if (typeof r == "function") return r(i);
+	if (typeof r == "string") return r;
+	switch (e) {
+		case "max-files": return `Maximum ${t.maxFiles} file${t.maxFiles === 1 ? "" : "s"} allowed.`;
+		case "max-size": return `File is larger than ${l(t.maxSize ?? 0)}.`;
+		case "type": return t.accept ? `File type is not allowed. Expected: ${t.accept}.` : "File type is not allowed.";
+	}
+}
+function ee({ currentFiles: e, incomingFiles: t, accept: n, maxFiles: r, maxSize: i, appendFiles: a, rejectionMessages: o }) {
+	let s = [], c = [], l = a ? e : [], u = r ?? (a ? void 0 : t.length);
+	for (let e of t) {
+		if (u !== void 0 && l.length + s.length >= u) {
+			c.push({
+				file: e,
+				reason: "max-files",
+				message: m("max-files", {
+					file: e,
+					maxFiles: u,
+					maxSize: i,
+					accept: n
+				}, o)
+			});
+			continue;
+		}
+		if (i !== void 0 && e.size > i) {
+			c.push({
+				file: e,
+				reason: "max-size",
+				message: m("max-size", {
+					file: e,
+					maxFiles: u,
+					maxSize: i,
+					accept: n
+				}, o)
+			});
+			continue;
+		}
+		if (!d(e, n)) {
+			c.push({
+				file: e,
+				reason: "type",
+				message: m("type", {
+					file: e,
+					maxFiles: u,
+					maxSize: i,
+					accept: n
+				}, o)
+			});
+			continue;
+		}
+		s.push(e);
+	}
+	return {
+		accepted: s,
+		rejected: c,
+		nextFiles: a ? [...e, ...s] : s
+	};
+}
+function h({ file: e, progress: r, remove: a, removeLabel: u = "Remove file" }) {
+	return /* @__PURE__ */ c("div", {
+		className: "flex min-w-0 items-center gap-3",
+		children: [
+			/* @__PURE__ */ s("span", {
+				className: "flex size-9 shrink-0 items-center justify-center rounded-full border border-border/70 bg-background/90 shadow-sm",
+				children: /* @__PURE__ */ s(i, { className: "size-4 text-muted-foreground" })
+			}),
+			/* @__PURE__ */ c("div", {
+				className: "min-w-0 flex-1",
+				children: [
+					/* @__PURE__ */ s("div", {
+						className: "truncate text-sm font-medium text-foreground",
+						children: e.name
+					}),
+					/* @__PURE__ */ s("div", {
+						className: "text-xs text-muted-foreground",
+						children: l(e.size)
+					}),
+					typeof r == "number" && /* @__PURE__ */ s("div", {
+						className: "mt-2 h-1.5 overflow-hidden rounded-full bg-muted/80",
+						children: /* @__PURE__ */ s("div", {
+							className: "h-full rounded-full bg-primary shadow-[0_8px_18px_color-mix(in_oklch,var(--primary),transparent_82%)]",
+							style: { width: `${Math.min(Math.max(r, 0), 100)}%` }
+						})
+					})
+				]
+			}),
+			/* @__PURE__ */ c(n, {
+				type: "button",
+				variant: "ghost",
+				size: "icon-xs",
+				className: "rounded-full",
+				onClick: (e) => {
+					t(e), a();
+				},
+				onMouseDown: t,
+				onDoubleClick: t,
+				children: [/* @__PURE__ */ s(o, {}), /* @__PURE__ */ s("span", {
+					className: "sr-only",
+					children: u
+				})]
+			})
+		]
+	});
+}
+function g({ files: i = [], onFilesChange: o, rejectedFiles: u, onRejectedFilesChange: d, buttonLabel: f = "Choose files", dropzoneLabel: m = "Drop files here or click to upload", dropzoneDescription: g, dragActiveLabel: te = "Drop files to upload", helperText: _, clearLabel: ne = "Clear all", removeLabel: re = "Remove file", dropzoneAriaLabel: ie, rejectionMessages: v, maxFiles: y, maxSize: b, appendFiles: x = !0, showFileList: S = !0, showClearButton: C = !0, loading: w = !1, progress: T, renderFile: ae, renderRejectedFile: oe, renderActions: E, className: D, inputClassName: O, dropzoneClassName: k, fileListClassName: A, fileItemClassName: j, rejectedListClassName: M, accept: N, multiple: P, disabled: F, onDragEnter: I, onDragLeave: L, onDragOver: R, onDrop: z, ...B }) {
+	let V = r.useRef(null), H = r.useRef(0), [U, W] = r.useState(!1), [G, K] = r.useState([]), q = u ?? G, J = F || w, se = P ?? y !== 1;
+	r.useEffect(() => {
+		J && (H.current = 0, W(!1));
+	}, [J]);
+	let Y = r.useCallback((e) => {
+		u === void 0 && K(e), d?.(e);
+	}, [d, u]), X = r.useCallback(() => {
+		J || V.current?.click();
+	}, [J]), Z = r.useCallback(() => {
+		o?.([]), Y([]);
+	}, [o, Y]), Q = r.useCallback((e) => {
+		let t = ee({
+			currentFiles: i,
+			incomingFiles: e,
+			accept: N,
+			maxFiles: y,
+			maxSize: b,
+			appendFiles: x,
+			rejectionMessages: v
+		});
+		o?.(t.nextFiles), Y(t.rejected);
+	}, [
+		N,
+		x,
+		i,
+		y,
+		b,
+		o,
+		v,
+		Y
+	]), ce = r.useCallback((e) => {
+		o?.(i.filter((t, n) => n !== e));
+	}, [i, o]), le = (e) => {
+		J || (Q(Array.from(e.target.files ?? [])), e.target.value = "");
+	}, $ = (e) => J ? (e.preventDefault(), t(e), !0) : !1, ue = (e) => {
+		I?.(e), !(e.defaultPrevented || $(e)) && (e.preventDefault(), H.current += 1, W(!0));
+	}, de = (e) => {
+		L?.(e), !(e.defaultPrevented || $(e)) && (H.current = Math.max(H.current - 1, 0), H.current === 0 && W(!1));
+	}, fe = (e) => {
+		R?.(e), !(e.defaultPrevented || $(e)) && e.preventDefault();
+	}, pe = (e) => {
+		z?.(e), !(e.defaultPrevented || $(e)) && (e.preventDefault(), H.current = 0, W(!1), Q(Array.from(e.dataTransfer.files ?? [])));
+	};
+	return /* @__PURE__ */ c("div", {
+		"data-slot": "file-upload",
+		className: e("grid gap-3", D),
+		children: [
+			/* @__PURE__ */ s("input", {
+				ref: V,
+				type: "file",
+				className: e("sr-only", O),
+				disabled: J,
+				accept: N,
+				multiple: se,
+				onChange: le,
+				...B
+			}),
+			/* @__PURE__ */ c("div", {
+				"data-slot": "file-upload-dropzone",
+				"data-dragging": U || void 0,
+				"data-disabled": J || void 0,
+				role: "button",
+				"aria-disabled": J || void 0,
+				"aria-label": ie,
+				tabIndex: J ? -1 : 0,
+				className: e("grid cursor-pointer gap-4 rounded-[var(--radius-2xl)] border border-dashed border-border/80 bg-[linear-gradient(180deg,color-mix(in_oklch,var(--card),white_12%),var(--card))] p-6 text-center shadow-sm ring-1 ring-foreground/5 outline-none transition-[background-color,border-color,box-shadow,transform] hover:-translate-y-px hover:border-primary/35 hover:bg-muted/25 hover:shadow-[0_14px_36px_rgba(15,23,42,0.08)] focus-visible:ring-2 focus-visible:ring-ring data-[dragging=true]:border-primary data-[dragging=true]:bg-primary/6 data-[dragging=true]:shadow-[0_18px_50px_color-mix(in_oklch,var(--primary),transparent_84%)] data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-60", k),
+				onClick: X,
+				onKeyDown: (e) => {
+					J || (e.key === "Enter" || e.key === " ") && (e.preventDefault(), X());
+				},
+				onDragEnter: ue,
+				onDragLeave: de,
+				onDragOver: fe,
+				onDrop: pe,
+				children: [
+					/* @__PURE__ */ s("div", {
+						className: "mx-auto flex size-13 items-center justify-center rounded-full border border-border/75 bg-[linear-gradient(180deg,color-mix(in_oklch,var(--background),white_14%),var(--background))] text-muted-foreground shadow-[0_1px_0_rgba(255,255,255,0.12),0_10px_24px_rgba(15,23,42,0.06)]",
+						children: /* @__PURE__ */ s(a, { className: "size-5" })
+					}),
+					/* @__PURE__ */ c("div", {
+						className: "grid gap-1",
+						children: [
+							/* @__PURE__ */ s("div", {
+								className: "text-sm font-semibold text-foreground",
+								children: U ? te : m
+							}),
+							g && /* @__PURE__ */ s("div", {
+								className: "text-sm leading-6 text-muted-foreground",
+								children: g
+							}),
+							(N || b || y || _) && /* @__PURE__ */ s("div", {
+								className: "text-xs leading-5 text-muted-foreground",
+								children: _ ?? [
+									N ? `Types: ${N}` : null,
+									b ? `Max size: ${l(b)}` : null,
+									y ? `Max files: ${y}` : null
+								].filter(Boolean).join(" • ")
+							})
+						]
+					}),
+					E?.({
+						openFileDialog: X,
+						clearFiles: Z,
+						files: i
+					}) ?? /* @__PURE__ */ c("div", {
+						className: "flex justify-center gap-2",
+						children: [/* @__PURE__ */ s(n, {
+							type: "button",
+							variant: "outline",
+							size: "sm",
+							disabled: J,
+							onClick: (e) => {
+								t(e), X();
+							},
+							onMouseDown: t,
+							onDoubleClick: t,
+							children: f
+						}), C && i.length > 0 && /* @__PURE__ */ s(n, {
+							type: "button",
+							variant: "ghost",
+							size: "sm",
+							disabled: J,
+							onClick: (e) => {
+								t(e), Z();
+							},
+							onMouseDown: t,
+							onDoubleClick: t,
+							children: ne
+						})]
+					})
+				]
+			}),
+			S && i.length > 0 && /* @__PURE__ */ s("div", {
+				"data-slot": "file-upload-list",
+				className: e("grid gap-2", A),
+				children: i.map((t, n) => {
+					let r = {
+						file: t,
+						index: n,
+						progress: p(T, t),
+						remove: () => ce(n),
+						removeLabel: re
+					};
+					return /* @__PURE__ */ s("div", {
+						"data-slot": "file-upload-item",
+						className: e("rounded-[min(var(--radius-xl),18px)] border border-border/80 bg-[linear-gradient(180deg,color-mix(in_oklch,var(--card),white_10%),var(--card))] p-3.5 shadow-sm ring-1 ring-foreground/5", j),
+						children: ae?.(r) ?? h(r)
+					}, `${t.name}-${t.lastModified}-${n}`);
+				})
+			}),
+			q.length > 0 && /* @__PURE__ */ s("div", {
+				"data-slot": "file-upload-rejected-list",
+				className: e("grid gap-2", M),
+				children: q.map((e, t) => /* @__PURE__ */ s("div", {
+					className: "rounded-[min(var(--radius-lg),12px)] border border-destructive/22 bg-destructive/8 px-3 py-2.5 text-xs leading-5 text-destructive shadow-[inset_0_1px_0_rgba(255,255,255,0.08)]",
+					children: oe?.({
+						rejectedFile: e,
+						index: t
+					}) ?? /* @__PURE__ */ c("span", { children: [
+						e.file.name,
+						": ",
+						e.message
+					] })
+				}, `${e.file.name}-${t}`))
+			})
+		]
+	});
+}
+//#endregion
+export { g as FileUpload, d as fileMatchesAccept, l as formatBytes, f as getFileKey };

package/dist/components/upload/image-upload.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/button/index.cjs"),r=require("./file-upload.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("lucide-react"),o=require("react/jsx-runtime");function s(e,t=!0){let[n,a]=i.useState({});return i.useEffect(()=>{if(!t){a({});return}let n=e.filter(e=>e.type.startsWith(`image/`)).map(e=>[r.getFileKey(e),URL.createObjectURL(e)]);return a(Object.fromEntries(n)),()=>{n.forEach(([,e])=>URL.revokeObjectURL(e))}},[t,e]),n}function c({file:e,previewUrl:i,progress:s,remove:c,previewClassName:l,imageClassName:u}){return(0,o.jsxs)(`div`,{className:`flex min-w-0 items-center gap-3`,children:[(0,o.jsx)(`div`,{className:t.cn(`flex size-14 shrink-0 items-center justify-center overflow-hidden rounded-[min(var(--radius-xl),16px)] border border-border/75 bg-muted/45 text-muted-foreground shadow-[0_1px_0_rgba(255,255,255,0.05)]`,l),children:i?(0,o.jsx)(`img`,{src:i,alt:e.name,className:t.cn(`size-full object-cover`,u)}):(0,o.jsx)(a.ImageIcon,{className:`size-5`})}),(0,o.jsxs)(`div`,{className:`min-w-0 flex-1`,children:[(0,o.jsx)(`div`,{className:`truncate text-sm font-medium text-foreground`,children:e.name}),(0,o.jsx)(`div`,{className:`text-xs text-muted-foreground`,children:r.formatBytes(e.size)}),typeof s==`number`&&(0,o.jsx)(`div`,{className:`mt-2 h-1.5 overflow-hidden rounded-full bg-muted/80`,children:(0,o.jsx)(`div`,{className:`h-full rounded-full bg-primary shadow-[0_8px_18px_color-mix(in_oklch,var(--primary),transparent_82%)]`,style:{width:`${Math.min(Math.max(s,0),100)}%`}})})]}),(0,o.jsxs)(n.Button,{type:`button`,variant:`ghost`,size:`icon-xs`,className:`rounded-full`,onClick:e=>{t.stopInteractivePropagation(e),c()},onMouseDown:t.stopInteractivePropagation,onDoubleClick:t.stopInteractivePropagation,children:[(0,o.jsx)(a.XIcon,{}),(0,o.jsx)(`span`,{className:`sr-only`,children:`Remove image`})]})]})}function l({accept:e=`image/*`,buttonLabel:t=`Choose image`,dropzoneLabel:n=`Drop images here or click to upload`,preview:i=!0,previewClassName:a,imageClassName:l,files:u=[],renderImageFile:d,...f}){let p=s(u,i);return(0,o.jsx)(r.FileUpload,{accept:e,buttonLabel:t,dropzoneLabel:n,files:u,renderFile:e=>{let t=p[r.getFileKey(e.file)];return d?.({...e,previewUrl:t})??c({...e,previewUrl:t,previewClassName:a,imageClassName:l})},...f})}exports.ImageUpload=l,exports.useImagePreviewUrls=s;

package/dist/components/upload/image-upload.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+import { type FileUploadProps, type FileUploadRenderFileState } from "@/components/upload/file-upload";
+export type ImageUploadProps = Omit<FileUploadProps, "accept" | "renderFile"> & {
+    accept?: string;
+    preview?: boolean;
+    previewClassName?: string;
+    imageClassName?: string;
+    renderImageFile?: (state: FileUploadRenderFileState & {
+        previewUrl?: string;
+    }) => React.ReactNode;
+};
+declare function useImagePreviewUrls(files: File[], enabled?: boolean): Record<string, string>;
+declare function ImageUpload({ accept, buttonLabel, dropzoneLabel, preview, previewClassName, imageClassName, files, renderImageFile, ...props }: ImageUploadProps): React.JSX.Element;
+export { ImageUpload, useImagePreviewUrls };

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

@@ -0,0 +1,94 @@
+import { cn as e, stopInteractivePropagation as t } from "../../lib/utils.js";
+import { Button as n } from "../ui/button/index.js";
+import { FileUpload as r, formatBytes as i, getFileKey as a } from "./file-upload.js";
+import * as o from "react";
+import { ImageIcon as s, XIcon as c } from "lucide-react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/upload/image-upload.tsx
+function d(e, t = !0) {
+	let [n, r] = o.useState({});
+	return o.useEffect(() => {
+		if (!t) {
+			r({});
+			return;
+		}
+		let n = e.filter((e) => e.type.startsWith("image/")).map((e) => [a(e), URL.createObjectURL(e)]);
+		return r(Object.fromEntries(n)), () => {
+			n.forEach(([, e]) => URL.revokeObjectURL(e));
+		};
+	}, [t, e]), n;
+}
+function f({ file: r, previewUrl: a, progress: o, remove: d, previewClassName: f, imageClassName: p }) {
+	return /* @__PURE__ */ u("div", {
+		className: "flex min-w-0 items-center gap-3",
+		children: [
+			/* @__PURE__ */ l("div", {
+				className: e("flex size-14 shrink-0 items-center justify-center overflow-hidden rounded-[min(var(--radius-xl),16px)] border border-border/75 bg-muted/45 text-muted-foreground shadow-[0_1px_0_rgba(255,255,255,0.05)]", f),
+				children: a ? /* @__PURE__ */ l("img", {
+					src: a,
+					alt: r.name,
+					className: e("size-full object-cover", p)
+				}) : /* @__PURE__ */ l(s, { className: "size-5" })
+			}),
+			/* @__PURE__ */ u("div", {
+				className: "min-w-0 flex-1",
+				children: [
+					/* @__PURE__ */ l("div", {
+						className: "truncate text-sm font-medium text-foreground",
+						children: r.name
+					}),
+					/* @__PURE__ */ l("div", {
+						className: "text-xs text-muted-foreground",
+						children: i(r.size)
+					}),
+					typeof o == "number" && /* @__PURE__ */ l("div", {
+						className: "mt-2 h-1.5 overflow-hidden rounded-full bg-muted/80",
+						children: /* @__PURE__ */ l("div", {
+							className: "h-full rounded-full bg-primary shadow-[0_8px_18px_color-mix(in_oklch,var(--primary),transparent_82%)]",
+							style: { width: `${Math.min(Math.max(o, 0), 100)}%` }
+						})
+					})
+				]
+			}),
+			/* @__PURE__ */ u(n, {
+				type: "button",
+				variant: "ghost",
+				size: "icon-xs",
+				className: "rounded-full",
+				onClick: (e) => {
+					t(e), d();
+				},
+				onMouseDown: t,
+				onDoubleClick: t,
+				children: [/* @__PURE__ */ l(c, {}), /* @__PURE__ */ l("span", {
+					className: "sr-only",
+					children: "Remove image"
+				})]
+			})
+		]
+	});
+}
+function p({ accept: e = "image/*", buttonLabel: t = "Choose image", dropzoneLabel: n = "Drop images here or click to upload", preview: i = !0, previewClassName: o, imageClassName: s, files: c = [], renderImageFile: u, ...p }) {
+	let m = d(c, i);
+	return /* @__PURE__ */ l(r, {
+		accept: e,
+		buttonLabel: t,
+		dropzoneLabel: n,
+		files: c,
+		renderFile: (e) => {
+			let t = m[a(e.file)];
+			return u?.({
+				...e,
+				previewUrl: t
+			}) ?? f({
+				...e,
+				previewUrl: t,
+				previewClassName: o,
+				imageClassName: s
+			});
+		},
+		...p
+	});
+}
+//#endregion
+export { p as ImageUpload, d as useImagePreviewUrls };

package/dist/components/upload/index.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./file-upload.cjs"),t=require("./image-upload.cjs"),n=require("./file-dropzone.cjs");exports.FileDropzone=n.FileDropzone,exports.FileUpload=e.FileUpload,exports.ImageUpload=t.ImageUpload;

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

@@ -0,0 +1,4 @@
+export { FileUpload } from "./file-upload";
+export { ImageUpload } from "./image-upload";
+export { FileDropzone } from "./file-dropzone";
+export type { FileDropzoneProps } from "./file-dropzone";

package/dist/components/upload/index.js

@@ -0,0 +1,4 @@
+import { FileUpload as e } from "./file-upload.js";
+import { ImageUpload as t } from "./image-upload.js";
+import { FileDropzone as n } from "./file-dropzone.js";
+export { n as FileDropzone, e as FileUpload, t as ImageUpload };

package/dist/components/wizard/demo.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../showcase/create-demo.cjs");var t=e.createShowcaseDemoRegistry([e.component(`stepper`,`Stepper`,`wizard`,`Clickable step navigation for multi-step forms.`),e.component(`wizard`,`Wizard`,`wizard`,`Stepper, content and footer controls combined into one workflow.`)]);exports.wizardShowcaseDemoRegistry=t;

package/dist/components/wizard/demo.d.ts

@@ -0,0 +1,6 @@
+export declare const wizardShowcaseDemoRegistry: {
+    [k: string]: {
+        mock: import("../../showcase").ShowcaseDemoMock;
+        Showcase: (props: import("../../showcase").ShowcaseDemoProps) => import("react").JSX.Element;
+    };
+};

package/dist/components/wizard/demo.js

@@ -0,0 +1,5 @@
+import { component as e, createShowcaseDemoRegistry as t } from "../../showcase/create-demo.js";
+//#region src/components/wizard/demo.tsx
+var n = t([e("stepper", "Stepper", "wizard", "Clickable step navigation for multi-step forms."), e("wizard", "Wizard", "wizard", "Stepper, content and footer controls combined into one workflow.")]);
+//#endregion
+export { n as wizardShowcaseDemoRegistry };

package/dist/components/wizard/index.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./stepper.cjs"),t=require("./wizard.cjs");exports.Stepper=e.Stepper,exports.Wizard=t.Wizard;

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

@@ -0,0 +1,2 @@
+export * from "./stepper";
+export * from "./wizard";

package/dist/components/wizard/index.js

@@ -0,0 +1,3 @@
+import { Stepper as e } from "./stepper.js";
+import { Wizard as t } from "./wizard.js";
+export { e as Stepper, t as Wizard };

package/dist/components/wizard/stepper.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("lucide-react"),i=require("react/jsx-runtime");function a({className:e,steps:n,currentStep:a,onStepChange:o,orientation:s=`horizontal`,...c}){let l=Math.max(n.findIndex(e=>e.id===a),0);return(0,i.jsx)(`div`,{"data-slot":`stepper`,"data-orientation":s,className:t.cn(s===`vertical`?`grid gap-3`:`flex flex-wrap items-start gap-3`,e),...c,children:n.map((e,n)=>{let c=e.id===a,u=e.completed??n<l;return(0,i.jsxs)(`button`,{type:`button`,disabled:!(o&&!e.disabled),className:t.cn(`flex min-w-0 items-start gap-2 text-left disabled:cursor-default`,s===`horizontal`&&`flex-1`),onClick:()=>o?.(e.id),children:[(0,i.jsx)(`span`,{className:t.cn(`flex size-7 shrink-0 items-center justify-center rounded-full border text-xs font-medium`,c&&`border-primary bg-primary text-primary-foreground`,u&&!c&&`border-primary bg-primary/10 text-primary`),children:u&&!c?(0,i.jsx)(r.CheckIcon,{className:`size-4`}):n+1}),(0,i.jsxs)(`span`,{className:`min-w-0 grid gap-0.5`,children:[(0,i.jsx)(`span`,{className:t.cn(`text-sm font-medium`,c?`text-foreground`:`text-muted-foreground`),children:e.title}),e.description&&(0,i.jsx)(`span`,{className:`text-xs text-muted-foreground`,children:e.description})]})]},e.id)})})}exports.Stepper=a;

package/dist/components/wizard/stepper.d.ts

@@ -0,0 +1,16 @@
+import * as React from "react";
+export type StepperStep = {
+    id: string;
+    title: React.ReactNode;
+    description?: React.ReactNode;
+    disabled?: boolean;
+    completed?: boolean;
+};
+export type StepperProps = React.ComponentProps<"div"> & {
+    steps: StepperStep[];
+    currentStep: string;
+    onStepChange?: (stepId: string) => void;
+    orientation?: "horizontal" | "vertical";
+};
+declare function Stepper({ className, steps, currentStep, onStepChange, orientation, ...props }: StepperProps): React.JSX.Element;
+export { Stepper };

package/dist/components/wizard/stepper.js

@@ -0,0 +1,38 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { CheckIcon as t } from "lucide-react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/components/wizard/stepper.tsx
+function i({ className: i, steps: a, currentStep: o, onStepChange: s, orientation: c = "horizontal", ...l }) {
+	let u = Math.max(a.findIndex((e) => e.id === o), 0);
+	return /* @__PURE__ */ n("div", {
+		"data-slot": "stepper",
+		"data-orientation": c,
+		className: e(c === "vertical" ? "grid gap-3" : "flex flex-wrap items-start gap-3", i),
+		...l,
+		children: a.map((i, a) => {
+			let l = i.id === o, d = i.completed ?? a < u;
+			return /* @__PURE__ */ r("button", {
+				type: "button",
+				disabled: !(s && !i.disabled),
+				className: e("flex min-w-0 items-start gap-2 text-left disabled:cursor-default", c === "horizontal" && "flex-1"),
+				onClick: () => s?.(i.id),
+				children: [/* @__PURE__ */ n("span", {
+					className: e("flex size-7 shrink-0 items-center justify-center rounded-full border text-xs font-medium", l && "border-primary bg-primary text-primary-foreground", d && !l && "border-primary bg-primary/10 text-primary"),
+					children: d && !l ? /* @__PURE__ */ n(t, { className: "size-4" }) : a + 1
+				}), /* @__PURE__ */ r("span", {
+					className: "min-w-0 grid gap-0.5",
+					children: [/* @__PURE__ */ n("span", {
+						className: e("text-sm font-medium", l ? "text-foreground" : "text-muted-foreground"),
+						children: i.title
+					}), i.description && /* @__PURE__ */ n("span", {
+						className: "text-xs text-muted-foreground",
+						children: i.description
+					})]
+				})]
+			}, i.id);
+		})
+	});
+}
+//#endregion
+export { i as Stepper };

package/dist/components/wizard/wizard.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/button/index.cjs"),r=require("./stepper.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("react/jsx-runtime");function o({className:e,steps:i,currentStep:o,onStepChange:s,onNext:c,onPrevious:l,onFinish:u,nextLabel:d=`Next`,previousLabel:f=`Previous`,finishLabel:p=`Finish`,children:m,footer:h,...g}){let _=Math.max(i.findIndex(e=>e.id===o),0),v=_===0,y=_===i.length-1;return(0,a.jsxs)(`div`,{"data-slot":`wizard`,className:t.cn(`grid gap-6`,e),...g,children:[(0,a.jsx)(r.Stepper,{steps:i,currentStep:o,onStepChange:s}),(0,a.jsx)(`div`,{"data-slot":`wizard-content`,className:`min-w-0`,children:m}),h??(0,a.jsxs)(`div`,{"data-slot":`wizard-footer`,className:`flex items-center justify-between gap-2 border-t pt-4`,children:[(0,a.jsx)(n.Button,{type:`button`,variant:`outline`,disabled:v,onClick:l,children:f}),(0,a.jsx)(n.Button,{type:`button`,onClick:y?u:c,children:y?p:d})]})]})}exports.Wizard=o;

package/dist/components/wizard/wizard.d.ts

@@ -0,0 +1,17 @@
+import * as React from "react";
+import { type StepperStep } from "@/components/wizard/stepper";
+export type WizardProps = React.ComponentProps<"div"> & {
+    steps: StepperStep[];
+    currentStep: string;
+    onStepChange?: (stepId: string) => void;
+    onNext?: () => void;
+    onPrevious?: () => void;
+    onFinish?: () => void;
+    nextLabel?: React.ReactNode;
+    previousLabel?: React.ReactNode;
+    finishLabel?: React.ReactNode;
+    children?: React.ReactNode;
+    footer?: React.ReactNode;
+};
+declare function Wizard({ className, steps, currentStep, onStepChange, onNext, onPrevious, onFinish, nextLabel, previousLabel, finishLabel, children, footer, ...props }: WizardProps): React.JSX.Element;
+export { Wizard };

package/dist/components/wizard/wizard.js

@@ -0,0 +1,43 @@
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "../ui/button/index.js";
+import { Stepper as n } from "./stepper.js";
+import "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/wizard/wizard.tsx
+function a({ className: a, steps: o, currentStep: s, onStepChange: c, onNext: l, onPrevious: u, onFinish: d, nextLabel: f = "Next", previousLabel: p = "Previous", finishLabel: m = "Finish", children: h, footer: g, ..._ }) {
+	let v = Math.max(o.findIndex((e) => e.id === s), 0), y = v === 0, b = v === o.length - 1;
+	return /* @__PURE__ */ i("div", {
+		"data-slot": "wizard",
+		className: e("grid gap-6", a),
+		..._,
+		children: [
+			/* @__PURE__ */ r(n, {
+				steps: o,
+				currentStep: s,
+				onStepChange: c
+			}),
+			/* @__PURE__ */ r("div", {
+				"data-slot": "wizard-content",
+				className: "min-w-0",
+				children: h
+			}),
+			g ?? /* @__PURE__ */ i("div", {
+				"data-slot": "wizard-footer",
+				className: "flex items-center justify-between gap-2 border-t pt-4",
+				children: [/* @__PURE__ */ r(t, {
+					type: "button",
+					variant: "outline",
+					disabled: y,
+					onClick: u,
+					children: p
+				}), /* @__PURE__ */ r(t, {
+					type: "button",
+					onClick: b ? d : l,
+					children: b ? m : f
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { a as Wizard };

package/dist/families/badge-family.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={Root:require("../components/ui/badge/index.cjs").Badge};exports.BadgeFamily=e;

package/dist/families/badge-family.d.ts

@@ -0,0 +1,5 @@
+import { Badge } from "@/components/ui/badge";
+declare const BadgeFamily: {
+    readonly Root: typeof Badge;
+};
+export { BadgeFamily };

package/dist/families/badge-family.js

@@ -0,0 +1,5 @@
+import { Badge as e } from "../components/ui/badge/index.js";
+//#region src/families/badge-family.ts
+var t = { Root: e };
+//#endregion
+export { t as BadgeFamily };

package/dist/families/card-family.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../components/ui/card/index.cjs"),t=require("../components/display/entity-card.cjs"),n=require("../components/display/file-card.cjs"),r=require("../components/display/statistic.cjs"),i=require("../components/display/smart-card.cjs");var a={Root:e.Card,Header:e.CardHeader,Title:e.CardTitle,Description:e.CardDescription,Action:e.CardAction,Content:e.CardContent,Footer:e.CardFooter,Info:i.SmartCard,Statistic:r.StatisticCard,Entity:t.EntityCard,File:n.FileCard};exports.CardFamily=a;

package/dist/families/card-family.d.ts

@@ -0,0 +1,16 @@
+import { EntityCard, FileCard, InfoCard, StatisticCard } from "@/components/display";
+import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card";
+declare const CardFamily: {
+    readonly Root: typeof Card;
+    readonly Header: typeof CardHeader;
+    readonly Title: typeof CardTitle;
+    readonly Description: typeof CardDescription;
+    readonly Action: typeof CardAction;
+    readonly Content: typeof CardContent;
+    readonly Footer: typeof CardFooter;
+    readonly Info: typeof InfoCard;
+    readonly Statistic: typeof StatisticCard;
+    readonly Entity: typeof EntityCard;
+    readonly File: typeof FileCard;
+};
+export { CardFamily };

package/dist/families/card-family.js

@@ -0,0 +1,21 @@
+import { Card as e, CardAction as t, CardContent as n, CardDescription as r, CardFooter as i, CardHeader as a, CardTitle as o } from "../components/ui/card/index.js";
+import { EntityCard as s } from "../components/display/entity-card.js";
+import { FileCard as c } from "../components/display/file-card.js";
+import { StatisticCard as l } from "../components/display/statistic.js";
+import { SmartCard as u } from "../components/display/smart-card.js";
+//#region src/families/card-family.ts
+var d = {
+	Root: e,
+	Header: a,
+	Title: o,
+	Description: r,
+	Action: t,
+	Content: n,
+	Footer: i,
+	Info: u,
+	Statistic: l,
+	Entity: s,
+	File: c
+};
+//#endregion
+export { d as CardFamily };