tembro 3.0.0 → 3.1.1

package/dist/src/components/display/carousel.cjs

@@ -0,0 +1 @@
+"use client";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");let r=require("react");r=e.__toESM(r,1);let i=require("lucide-react"),a=require("react/jsx-runtime");function o(e,t,n){return t<=0?0:n?(e%t+t)%t:Math.min(Math.max(e,0),t-1)}function s({index:e,defaultIndex:s=0,onIndexChange:c,loop:l=!1,variant:u=`default`,showDots:d=!0,showArrows:f=!0,keyboard:p=!0,ariaLabel:m=`Carousel`,previousLabel:h=`Previous slide`,nextLabel:g=`Next slide`,swipeThreshold:_=44,autoplay:v=!1,autoplayInterval:y=4500,pauseOnHover:b=!0,stopAutoplayOnInteraction:x=!0,showPlaybackControl:ee=!1,showStatus:te=!1,showThumbnails:S=!1,playLabel:C=`Start autoplay`,pauseLabel:w=`Pause autoplay`,statusLabel:T,renderThumbnail:E,renderActiveDetail:D,aspectRatio:O,mouseDrag:k=!0,onAutoplayChange:A,viewportClassName:j,controlsClassName:M,dotsClassName:N,arrowClassName:P,dotClassName:ne,activeDotClassName:re,thumbnailsClassName:F,className:ie,children:ae,...I}){let L=r.Children.toArray(ae),[R,z]=r.useState(s),B=r.useRef(null),V=r.useRef(null),[H,U]=r.useState(!1),[W,G]=r.useState(!1),[K,q]=r.useState(v),J=e!==void 0,Y=L.length,X=o(J?e:R,Y,l),oe=L[X];r.useEffect(()=>{q(v)},[v]);let Z=r.useCallback((e,t=`manual`)=>{let n=o(e,Y,l);J||z(n),t===`manual`&&x&&(G(!0),K&&(q(!1),A?.(!1))),c?.(n)},[K,J,Y,l,A,c,x]),Q=l||X>0,$=l||X<Y-1;return r.useEffect(()=>{if(!K||Y<=1||W||b&&H)return;let e=window.setInterval(()=>{if(!l&&X>=Y-1){Z(0,`autoplay`);return}Z(X+1,`autoplay`)},y);return()=>{window.clearInterval(e)}},[X,K,y,W,H,Y,l,b,Z]),(0,a.jsxs)(`div`,{"data-slot":`carousel`,"data-variant":u,role:`region`,"aria-roledescription":`carousel`,"aria-label":m,tabIndex:p?0:void 0,className:t.cn(`grid gap-3`,ie),onKeyDown:e=>{!p||Y<=1||(e.key===`ArrowLeft`&&Q&&(e.preventDefault(),Z(X-1)),e.key===`ArrowRight`&&$&&(e.preventDefault(),Z(X+1)),e.key===`Home`&&(e.preventDefault(),Z(0)),e.key===`End`&&(e.preventDefault(),Z(Y-1)))},onTouchStart:e=>{B.current=e.touches[0]?.clientX??null},onTouchEnd:e=>{if(B.current==null||L.length<=1)return;let t=(e.changedTouches[0]?.clientX??B.current)-B.current;B.current=null,!(Math.abs(t)<_)&&(t>0&&Q&&Z(X-1),t<0&&$&&Z(X+1))},onPointerDown:e=>{!k||e.pointerType===`touch`||(V.current=e.clientX)},onPointerUp:e=>{if(!k||V.current==null||L.length<=1)return;let t=e.clientX-V.current;V.current=null,!(Math.abs(t)<_)&&(t>0&&Q&&Z(X-1),t<0&&$&&Z(X+1))},onMouseEnter:()=>U(!0),onMouseLeave:()=>U(!1),...I,children:[(0,a.jsxs)(`div`,{className:t.cn(`relative overflow-hidden rounded-[var(--aui-card-radius,var(--radius-lg))] border border-[color:var(--aui-card-border,var(--border))] bg-card shadow-[var(--aui-card-shadow,0_12px_32px_rgba(15,23,42,0.08))]`,u===`hero`&&`min-h-72`,u===`minimal`&&`rounded-[var(--radius-md)] shadow-none`,j),children:[te?(0,a.jsx)(`div`,{className:`pointer-events-none absolute right-3 top-3 z-10 rounded-full border border-border/70 bg-background/92 px-2.5 py-1 text-[11px] font-medium text-muted-foreground shadow-sm`,children:T?.(X,L.length)??`Slide ${X+1} / ${L.length}`}):null,(0,a.jsx)(`div`,{className:`transition-transform duration-300 ease-out`,"aria-live":`polite`,style:O?{aspectRatio:O}:void 0,children:L[X]}),f&&L.length>1?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(n.Button,{type:`button`,variant:u===`hero`?`default`:`secondary`,size:`icon-sm`,className:t.cn(`absolute left-3 top-1/2 -translate-y-1/2 rounded-full shadow-lg`,P),disabled:!Q,"aria-label":h,onClick:()=>Z(X-1),children:(0,a.jsx)(i.ChevronLeftIcon,{})}),(0,a.jsx)(n.Button,{type:`button`,variant:u===`hero`?`default`:`secondary`,size:`icon-sm`,className:t.cn(`absolute right-3 top-1/2 -translate-y-1/2 rounded-full shadow-lg`,P),disabled:!$,"aria-label":g,onClick:()=>Z(X+1),children:(0,a.jsx)(i.ChevronRightIcon,{})})]}):null]}),d&&L.length>1&&(0,a.jsxs)(`div`,{className:t.cn(`flex flex-wrap items-center justify-center gap-2`,N),role:`tablist`,"aria-label":`${m} slides`,children:[L.map((e,n)=>(0,a.jsx)(`button`,{type:`button`,role:`tab`,"aria-label":`Go to slide ${n+1}`,"aria-selected":n===X,className:t.cn(`h-2.5 rounded-full bg-muted-foreground/30 transition-[width,background-color,opacity] hover:bg-muted-foreground/55`,n===X?t.cn(`w-7 bg-primary`,re):t.cn(`w-2.5`,ne)),onClick:()=>Z(n)},n)),ee?(0,a.jsx)(n.Button,{type:`button`,variant:`ghost`,size:`sm`,className:t.cn(`ml-2 rounded-full`,M),onClick:()=>{let e=!K;G(!1),q(e),A?.(e)},children:K?w:C}):null]}),S&&L.length>1?(0,a.jsx)(`div`,{className:t.cn(`grid grid-cols-2 gap-2 sm:grid-cols-4`,F),children:L.map((e,n)=>{let r=n===X;return(0,a.jsx)(`button`,{type:`button`,"aria-current":r?`true`:void 0,"aria-label":`Open slide ${n+1}`,className:t.cn(`overflow-hidden rounded-[min(var(--radius-xl),16px)] border bg-card text-left transition hover:border-primary/35 hover:shadow-sm`,r?`border-primary/35 ring-2 ring-primary/15`:`border-border/70`),onClick:()=>Z(n),children:E?E(e,n,r):(0,a.jsxs)(`div`,{className:`line-clamp-2 min-h-16 p-3 text-xs text-muted-foreground`,children:[`Slide `,n+1]})},n)})}):null,D?D(oe,X):null,(0,a.jsx)(`span`,{className:`sr-only`,"aria-live":`polite`,children:T?.(X,L.length)??`${m}: slide ${X+1} of ${L.length}`})]})}function c({className:e,...n}){return(0,a.jsx)(`div`,{"data-slot":`carousel-item`,className:t.cn(`min-h-40 p-5 sm:p-6`,e),...n})}exports.Carousel=s,exports.CarouselItem=c;

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

@@ -0,0 +1,172 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "../ui/button/index.js";
+import * as n from "react";
+import { ChevronLeftIcon as r, ChevronRightIcon as ee } from "lucide-react";
+import { Fragment as te, jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/components/display/carousel.tsx
+function o(e, t, n) {
+	return t <= 0 ? 0 : n ? (e % t + t) % t : Math.min(Math.max(e, 0), t - 1);
+}
+function s({ index: s, defaultIndex: c = 0, onIndexChange: l, loop: u = !1, variant: d = "default", showDots: ne = !0, showArrows: re = !0, keyboard: f = !0, ariaLabel: p = "Carousel", previousLabel: ie = "Previous slide", nextLabel: m = "Next slide", swipeThreshold: h = 44, autoplay: g = !1, autoplayInterval: _ = 4500, pauseOnHover: v = !0, stopAutoplayOnInteraction: y = !0, showPlaybackControl: b = !1, showStatus: ae = !1, showThumbnails: x = !1, playLabel: S = "Start autoplay", pauseLabel: C = "Pause autoplay", statusLabel: w, renderThumbnail: T, renderActiveDetail: E, aspectRatio: D, mouseDrag: O = !0, onAutoplayChange: k, viewportClassName: A, controlsClassName: j, dotsClassName: M, arrowClassName: N, dotClassName: oe, activeDotClassName: se, thumbnailsClassName: ce, className: P, children: F, ...I }) {
+	let L = n.Children.toArray(F), [R, z] = n.useState(c), B = n.useRef(null), V = n.useRef(null), [H, U] = n.useState(!1), [W, G] = n.useState(!1), [K, q] = n.useState(g), J = s !== void 0, Y = L.length, X = o(J ? s : R, Y, u), le = L[X];
+	n.useEffect(() => {
+		q(g);
+	}, [g]);
+	let Z = n.useCallback((e, t = "manual") => {
+		let n = o(e, Y, u);
+		J || z(n), t === "manual" && y && (G(!0), K && (q(!1), k?.(!1))), l?.(n);
+	}, [
+		K,
+		J,
+		Y,
+		u,
+		k,
+		l,
+		y
+	]), Q = u || X > 0, $ = u || X < Y - 1;
+	return n.useEffect(() => {
+		if (!K || Y <= 1 || W || v && H) return;
+		let e = window.setInterval(() => {
+			if (!u && X >= Y - 1) {
+				Z(0, "autoplay");
+				return;
+			}
+			Z(X + 1, "autoplay");
+		}, _);
+		return () => {
+			window.clearInterval(e);
+		};
+	}, [
+		X,
+		K,
+		_,
+		W,
+		H,
+		Y,
+		u,
+		v,
+		Z
+	]), /* @__PURE__ */ a("div", {
+		"data-slot": "carousel",
+		"data-variant": d,
+		role: "region",
+		"aria-roledescription": "carousel",
+		"aria-label": p,
+		tabIndex: f ? 0 : void 0,
+		className: e("grid gap-3", P),
+		onKeyDown: (e) => {
+			!f || Y <= 1 || (e.key === "ArrowLeft" && Q && (e.preventDefault(), Z(X - 1)), e.key === "ArrowRight" && $ && (e.preventDefault(), Z(X + 1)), e.key === "Home" && (e.preventDefault(), Z(0)), e.key === "End" && (e.preventDefault(), Z(Y - 1)));
+		},
+		onTouchStart: (e) => {
+			B.current = e.touches[0]?.clientX ?? null;
+		},
+		onTouchEnd: (e) => {
+			if (B.current == null || L.length <= 1) return;
+			let t = (e.changedTouches[0]?.clientX ?? B.current) - B.current;
+			B.current = null, !(Math.abs(t) < h) && (t > 0 && Q && Z(X - 1), t < 0 && $ && Z(X + 1));
+		},
+		onPointerDown: (e) => {
+			!O || e.pointerType === "touch" || (V.current = e.clientX);
+		},
+		onPointerUp: (e) => {
+			if (!O || V.current == null || L.length <= 1) return;
+			let t = e.clientX - V.current;
+			V.current = null, !(Math.abs(t) < h) && (t > 0 && Q && Z(X - 1), t < 0 && $ && Z(X + 1));
+		},
+		onMouseEnter: () => U(!0),
+		onMouseLeave: () => U(!1),
+		...I,
+		children: [
+			/* @__PURE__ */ a("div", {
+				className: e("relative overflow-hidden rounded-[var(--aui-card-radius,var(--radius-lg))] border border-[color:var(--aui-card-border,var(--border))] bg-card shadow-[var(--aui-card-shadow,0_12px_32px_rgba(15,23,42,0.08))]", d === "hero" && "min-h-72", d === "minimal" && "rounded-[var(--radius-md)] shadow-none", A),
+				children: [
+					ae ? /* @__PURE__ */ i("div", {
+						className: "pointer-events-none absolute right-3 top-3 z-10 rounded-full border border-border/70 bg-background/92 px-2.5 py-1 text-[11px] font-medium text-muted-foreground shadow-sm",
+						children: w?.(X, L.length) ?? `Slide ${X + 1} / ${L.length}`
+					}) : null,
+					/* @__PURE__ */ i("div", {
+						className: "transition-transform duration-300 ease-out",
+						"aria-live": "polite",
+						style: D ? { aspectRatio: D } : void 0,
+						children: L[X]
+					}),
+					re && L.length > 1 ? /* @__PURE__ */ a(te, { children: [/* @__PURE__ */ i(t, {
+						type: "button",
+						variant: d === "hero" ? "default" : "secondary",
+						size: "icon-sm",
+						className: e("absolute left-3 top-1/2 -translate-y-1/2 rounded-full shadow-lg", N),
+						disabled: !Q,
+						"aria-label": ie,
+						onClick: () => Z(X - 1),
+						children: /* @__PURE__ */ i(r, {})
+					}), /* @__PURE__ */ i(t, {
+						type: "button",
+						variant: d === "hero" ? "default" : "secondary",
+						size: "icon-sm",
+						className: e("absolute right-3 top-1/2 -translate-y-1/2 rounded-full shadow-lg", N),
+						disabled: !$,
+						"aria-label": m,
+						onClick: () => Z(X + 1),
+						children: /* @__PURE__ */ i(ee, {})
+					})] }) : null
+				]
+			}),
+			ne && L.length > 1 && /* @__PURE__ */ a("div", {
+				className: e("flex flex-wrap items-center justify-center gap-2", M),
+				role: "tablist",
+				"aria-label": `${p} slides`,
+				children: [L.map((t, n) => /* @__PURE__ */ i("button", {
+					type: "button",
+					role: "tab",
+					"aria-label": `Go to slide ${n + 1}`,
+					"aria-selected": n === X,
+					className: e("h-2.5 rounded-full bg-muted-foreground/30 transition-[width,background-color,opacity] hover:bg-muted-foreground/55", n === X ? e("w-7 bg-primary", se) : e("w-2.5", oe)),
+					onClick: () => Z(n)
+				}, n)), b ? /* @__PURE__ */ i(t, {
+					type: "button",
+					variant: "ghost",
+					size: "sm",
+					className: e("ml-2 rounded-full", j),
+					onClick: () => {
+						let e = !K;
+						G(!1), q(e), k?.(e);
+					},
+					children: K ? C : S
+				}) : null]
+			}),
+			x && L.length > 1 ? /* @__PURE__ */ i("div", {
+				className: e("grid grid-cols-2 gap-2 sm:grid-cols-4", ce),
+				children: L.map((t, n) => {
+					let r = n === X;
+					return /* @__PURE__ */ i("button", {
+						type: "button",
+						"aria-current": r ? "true" : void 0,
+						"aria-label": `Open slide ${n + 1}`,
+						className: e("overflow-hidden rounded-[min(var(--radius-xl),16px)] border bg-card text-left transition hover:border-primary/35 hover:shadow-sm", r ? "border-primary/35 ring-2 ring-primary/15" : "border-border/70"),
+						onClick: () => Z(n),
+						children: T ? T(t, n, r) : /* @__PURE__ */ a("div", {
+							className: "line-clamp-2 min-h-16 p-3 text-xs text-muted-foreground",
+							children: ["Slide ", n + 1]
+						})
+					}, n);
+				})
+			}) : null,
+			E ? E(le, X) : null,
+			/* @__PURE__ */ i("span", {
+				className: "sr-only",
+				"aria-live": "polite",
+				children: w?.(X, L.length) ?? `${p}: slide ${X + 1} of ${L.length}`
+			})
+		]
+	});
+}
+function c({ className: t, ...n }) {
+	return /* @__PURE__ */ i("div", {
+		"data-slot": "carousel-item",
+		className: e("min-h-40 p-5 sm:p-6", t),
+		...n
+	});
+}
+//#endregion
+export { s as Carousel, c as CarouselItem };

package/dist/src/components/display/code-block.cjs

@@ -0,0 +1,2 @@
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../actions/copy-button.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("react/jsx-runtime");function a({code:e,language:a,title:o,showCopy:s=!0,wrap:c=!1,lineNumbers:l=!1,highlightLines:u=[],maxHeight:d,className:f,...p}){let m=r.useMemo(()=>e.split(`
+`),[e]),h=r.useMemo(()=>new Set(u),[u]);return(0,i.jsxs)(`div`,{"data-slot":`code-block`,className:t.cn(`overflow-hidden rounded-[var(--aui-card-radius,var(--radius-xl))] border border-[color:var(--aui-card-border,var(--border))] bg-card`,f),...p,children:[(o||a||s)&&(0,i.jsxs)(`div`,{className:`flex items-center justify-between gap-3 border-b border-[color:var(--aui-card-border,var(--border))] bg-[color:color-mix(in_oklch,var(--muted),transparent_72%)] px-3 py-2 text-xs text-muted-foreground`,children:[(0,i.jsxs)(`div`,{className:`flex min-w-0 items-center gap-2`,children:[o&&(0,i.jsx)(`span`,{className:`truncate font-medium text-foreground`,children:o}),a&&(0,i.jsx)(`span`,{className:`rounded bg-muted px-1.5 py-0.5 font-mono`,children:a})]}),s&&(0,i.jsx)(n.CopyButton,{value:e,size:`sm`,variant:`ghost`,copyLabel:`Copy`,copiedLabel:`Copied`})]}),(0,i.jsx)(`pre`,{className:t.cn(`overflow-x-auto p-3 text-sm leading-6`,c&&`whitespace-pre-wrap break-words`),style:d?{maxHeight:d,overflowY:`auto`}:void 0,children:l?(0,i.jsx)(`code`,{className:`grid`,children:m.map((e,n)=>(0,i.jsxs)(`span`,{"data-highlighted":h.has(n+1)||void 0,className:t.cn(`grid grid-cols-[auto_1fr] gap-4 rounded px-1`,h.has(n+1)&&`bg-primary/10 text-foreground`),children:[(0,i.jsx)(`span`,{className:`select-none text-right text-xs text-muted-foreground/75`,children:n+1}),(0,i.jsx)(`span`,{children:e||` `})]},`${n}-${e}`))}):(0,i.jsx)(`code`,{children:m.map((e,n)=>(0,i.jsx)(`span`,{"data-highlighted":h.has(n+1)||void 0,className:t.cn(`block rounded px-1`,h.has(n+1)&&`bg-primary/10 text-foreground`),children:e||` `},`${n}-${e}`))})})]})}exports.CodeBlock=a;

package/dist/src/components/display/code-block.js

@@ -0,0 +1,56 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { CopyButton as t } from "../actions/copy-button.js";
+import * as n from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/display/code-block.tsx
+function a({ code: a, language: o, title: s, showCopy: c = !0, wrap: l = !1, lineNumbers: u = !1, highlightLines: d = [], maxHeight: f, className: p, ...m }) {
+	let h = n.useMemo(() => a.split("\n"), [a]), g = n.useMemo(() => new Set(d), [d]);
+	return /* @__PURE__ */ i("div", {
+		"data-slot": "code-block",
+		className: e("overflow-hidden rounded-[var(--aui-card-radius,var(--radius-xl))] border border-[color:var(--aui-card-border,var(--border))] bg-card", p),
+		...m,
+		children: [(s || o || c) && /* @__PURE__ */ i("div", {
+			className: "flex items-center justify-between gap-3 border-b border-[color:var(--aui-card-border,var(--border))] bg-[color:color-mix(in_oklch,var(--muted),transparent_72%)] px-3 py-2 text-xs text-muted-foreground",
+			children: [/* @__PURE__ */ i("div", {
+				className: "flex min-w-0 items-center gap-2",
+				children: [s && /* @__PURE__ */ r("span", {
+					className: "truncate font-medium text-foreground",
+					children: s
+				}), o && /* @__PURE__ */ r("span", {
+					className: "rounded bg-muted px-1.5 py-0.5 font-mono",
+					children: o
+				})]
+			}), c && /* @__PURE__ */ r(t, {
+				value: a,
+				size: "sm",
+				variant: "ghost",
+				copyLabel: "Copy",
+				copiedLabel: "Copied"
+			})]
+		}), /* @__PURE__ */ r("pre", {
+			className: e("overflow-x-auto p-3 text-sm leading-6", l && "whitespace-pre-wrap break-words"),
+			style: f ? {
+				maxHeight: f,
+				overflowY: "auto"
+			} : void 0,
+			children: u ? /* @__PURE__ */ r("code", {
+				className: "grid",
+				children: h.map((t, n) => /* @__PURE__ */ i("span", {
+					"data-highlighted": g.has(n + 1) || void 0,
+					className: e("grid grid-cols-[auto_1fr] gap-4 rounded px-1", g.has(n + 1) && "bg-primary/10 text-foreground"),
+					children: [/* @__PURE__ */ r("span", {
+						className: "select-none text-right text-xs text-muted-foreground/75",
+						children: n + 1
+					}), /* @__PURE__ */ r("span", { children: t || " " })]
+				}, `${n}-${t}`))
+			}) : /* @__PURE__ */ r("code", { children: h.map((t, n) => /* @__PURE__ */ r("span", {
+				"data-highlighted": g.has(n + 1) || void 0,
+				className: e("block rounded px-1", g.has(n + 1) && "bg-primary/10 text-foreground"),
+				children: t || " "
+			}, `${n}-${t}`)) })
+		})]
+	});
+}
+//#endregion
+export { a as CodeBlock };

package/dist/src/components/display/comparison-card.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../layout/stat-card.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");function i({title:e,items:n,columns:i=2,...a}){return(0,r.jsx)(t.StatCard,{"data-slot":`comparison-card`,title:e,comparisonColumns:i,comparisonItems:n.map(e=>({label:e.label,value:e.value,change:e.change,trend:e.trend===`up`?`success`:e.trend===`down`?`danger`:`neutral`})),...a})}exports.ComparisonCard=i;

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

@@ -0,0 +1,20 @@
+import { StatCard as e } from "../layout/stat-card.js";
+import "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/display/comparison-card.tsx
+function n({ title: n, items: r, columns: i = 2, ...a }) {
+	return /* @__PURE__ */ t(e, {
+		"data-slot": "comparison-card",
+		title: n,
+		comparisonColumns: i,
+		comparisonItems: r.map((e) => ({
+			label: e.label,
+			value: e.value,
+			change: e.change,
+			trend: e.trend === "up" ? "success" : e.trend === "down" ? "danger" : "neutral"
+		})),
+		...a
+	});
+}
+//#endregion
+export { n as ComparisonCard };

package/dist/src/components/display/data-list.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");var a={compact:`px-3 py-2`,default:`px-4 py-3`,comfortable:`px-5 py-4`};function o({items:e,density:n=`default`,showDividers:r=!0,className:a,...o}){return(0,i.jsx)(`div`,{"data-slot":`data-list`,className:t.cn(`overflow-hidden rounded-[var(--aui-card-radius,var(--radius-xl))] border bg-card text-card-foreground`,a),...o,children:e.map(e=>(0,i.jsx)(s,{item:e,density:n,showDivider:r},e.key))})}function s({item:e,density:n=`default`,showDivider:o=!0,className:s,...c}){let l=!!(e.href||e.onClick),u=t.cn(`group flex min-w-0 items-center gap-3 bg-card text-sm transition-colors`,a[n],o&&`border-b last:border-b-0`,l&&!e.disabled&&`cursor-pointer hover:bg-muted/55`,e.disabled&&`pointer-events-none opacity-55`,s),d=(0,i.jsxs)(i.Fragment,{children:[e.icon&&(0,i.jsx)(`div`,{className:`flex size-9 shrink-0 items-center justify-center rounded-lg bg-muted text-muted-foreground`,children:e.icon}),(0,i.jsxs)(`div`,{className:`min-w-0 flex-1`,children:[(0,i.jsxs)(`div`,{className:`flex min-w-0 items-center gap-2`,children:[(0,i.jsx)(`div`,{className:`truncate font-medium text-foreground`,children:e.label}),e.meta&&(0,i.jsx)(`div`,{className:`shrink-0 text-xs text-muted-foreground`,children:e.meta})]}),e.description&&(0,i.jsx)(`div`,{className:`mt-0.5 line-clamp-2 text-xs leading-5 text-muted-foreground`,children:e.description})]}),e.value&&(0,i.jsx)(`div`,{className:`shrink-0 text-right font-medium text-foreground`,children:e.value}),l&&(0,i.jsx)(r.ChevronRightIcon,{className:`size-4 shrink-0 text-muted-foreground transition-transform group-hover:translate-x-0.5`})]});return e.href?(0,i.jsx)(`a`,{"data-slot":`data-list-row`,href:e.href,className:u,...c,children:d}):(0,i.jsx)(`div`,{"data-slot":`data-list-row`,role:l?`button`:void 0,tabIndex:l&&!e.disabled?0:void 0,className:u,onClick:e.onClick,...c,children:d})}exports.DataList=o,exports.DataListRow=s;

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

@@ -0,0 +1,68 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { ChevronRightIcon as t } from "lucide-react";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/display/data-list.tsx
+var a = {
+	compact: "px-3 py-2",
+	default: "px-4 py-3",
+	comfortable: "px-5 py-4"
+};
+function o({ items: t, density: n = "default", showDividers: i = !0, className: a, ...o }) {
+	return /* @__PURE__ */ r("div", {
+		"data-slot": "data-list",
+		className: e("overflow-hidden rounded-[var(--aui-card-radius,var(--radius-xl))] border bg-card text-card-foreground", a),
+		...o,
+		children: t.map((e) => /* @__PURE__ */ r(s, {
+			item: e,
+			density: n,
+			showDivider: i
+		}, e.key))
+	});
+}
+function s({ item: o, density: s = "default", showDivider: c = !0, className: l, ...u }) {
+	let d = !!(o.href || o.onClick), f = e("group flex min-w-0 items-center gap-3 bg-card text-sm transition-colors", a[s], c && "border-b last:border-b-0", d && !o.disabled && "cursor-pointer hover:bg-muted/55", o.disabled && "pointer-events-none opacity-55", l), p = /* @__PURE__ */ i(n, { children: [
+		o.icon && /* @__PURE__ */ r("div", {
+			className: "flex size-9 shrink-0 items-center justify-center rounded-lg bg-muted text-muted-foreground",
+			children: o.icon
+		}),
+		/* @__PURE__ */ i("div", {
+			className: "min-w-0 flex-1",
+			children: [/* @__PURE__ */ i("div", {
+				className: "flex min-w-0 items-center gap-2",
+				children: [/* @__PURE__ */ r("div", {
+					className: "truncate font-medium text-foreground",
+					children: o.label
+				}), o.meta && /* @__PURE__ */ r("div", {
+					className: "shrink-0 text-xs text-muted-foreground",
+					children: o.meta
+				})]
+			}), o.description && /* @__PURE__ */ r("div", {
+				className: "mt-0.5 line-clamp-2 text-xs leading-5 text-muted-foreground",
+				children: o.description
+			})]
+		}),
+		o.value && /* @__PURE__ */ r("div", {
+			className: "shrink-0 text-right font-medium text-foreground",
+			children: o.value
+		}),
+		d && /* @__PURE__ */ r(t, { className: "size-4 shrink-0 text-muted-foreground transition-transform group-hover:translate-x-0.5" })
+	] });
+	return o.href ? /* @__PURE__ */ r("a", {
+		"data-slot": "data-list-row",
+		href: o.href,
+		className: f,
+		...u,
+		children: p
+	}) : /* @__PURE__ */ r("div", {
+		"data-slot": "data-list-row",
+		role: d ? "button" : void 0,
+		tabIndex: d && !o.disabled ? 0 : void 0,
+		className: f,
+		onClick: o.onClick,
+		...u,
+		children: p
+	});
+}
+//#endregion
+export { o as DataList, s as DataListRow };

package/dist/src/components/display/data-state.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("../ui/card/index.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("lucide-react"),o=require("react/jsx-runtime");var s={idle:{title:`Ready`,description:`No action has started yet.`,icon:(0,o.jsx)(a.CheckCircle2Icon,{})},loading:{title:`Loading`,description:`Please wait while data is being prepared.`,icon:(0,o.jsx)(a.Loader2Icon,{className:`animate-spin`})},empty:{title:`No data`,description:`There is nothing to show yet.`,icon:(0,o.jsx)(a.SearchXIcon,{})},error:{title:`Something went wrong`,description:`Try again or check the request.`,icon:(0,o.jsx)(a.AlertTriangleIcon,{})},success:{title:`Ready`,description:`Data loaded successfully.`,icon:(0,o.jsx)(a.CheckCircle2Icon,{})}},c={default:`text-muted-foreground`,muted:`text-muted-foreground`,success:`text-emerald-600 dark:text-emerald-400`,warning:`text-amber-600 dark:text-amber-400`,danger:`text-destructive`,info:`text-blue-600 dark:text-blue-400`};function l({status:e,title:i,description:l,badge:u,actions:d,footer:f,icon:p,tone:m,variant:h=`card`,compact:g=!1,align:_=`center`,query:v,children:y,retryLabel:b=`Retry`,onRetry:x,clearLabel:S=`Clear`,onClear:C,className:w,...T}){let E=s[e],D=m??(e===`error`?`danger`:e===`success`?`success`:`default`),O=h===`plain`||h===`inline`,k=(0,o.jsxs)(`div`,{className:t.cn(`flex flex-col justify-center`,_===`center`?`items-center text-center`:`items-start text-left`,g||h===`inline`?`p-4`:`min-h-52 p-8`),children:[(0,o.jsx)(`div`,{className:t.cn(`mb-3 flex items-center justify-center rounded-full border border-border/70 bg-muted/45 shadow-[0_1px_0_rgba(255,255,255,0.05)] [&_svg]:size-5`,c[D],g||h===`inline`?`size-9`:`size-12`),children:p??E.icon}),(0,o.jsxs)(`div`,{className:t.cn(`flex flex-wrap items-center gap-2`,_===`center`?`justify-center`:`justify-start`),children:[(0,o.jsx)(`div`,{className:t.cn(`font-semibold tracking-tight text-foreground`,g?`text-sm`:`text-base`),children:i??E.title}),u]}),(0,o.jsx)(`p`,{className:`mt-1 max-w-md text-sm text-muted-foreground`,children:l??E.description}),v&&(0,o.jsx)(`div`,{className:`mt-3 max-w-full rounded-md border border-border/70 bg-muted/45 px-2.5 py-1 text-sm text-muted-foreground`,children:v}),y&&(0,o.jsx)(`div`,{className:`mt-4 w-full`,children:y}),(d||x||C)&&(0,o.jsxs)(`div`,{className:t.cn(`mt-4 flex flex-wrap gap-2`,_===`center`?`justify-center`:`justify-start`),children:[x&&(0,o.jsx)(n.Button,{size:`sm`,variant:e===`error`?`default`:`outline`,onClick:x,children:b}),C&&(0,o.jsxs)(n.Button,{size:`sm`,variant:`ghost`,onClick:C,children:[(0,o.jsx)(a.XIcon,{"data-icon":`inline-start`}),S]}),d]}),f?(0,o.jsx)(`div`,{className:`mt-4 w-full`,children:f}):null]});return O?(0,o.jsx)(`div`,{"data-slot":`data-state`,"data-status":e,"data-variant":h,className:t.cn(h===`inline`?`rounded-lg border border-border/70 bg-muted/20`:`min-w-0`,w),...T,children:k}):(0,o.jsx)(r.Card,{"data-slot":`data-state`,"data-status":e,"data-variant":h,className:t.cn(`min-w-0 border-border/75 bg-card/96 shadow-sm ring-1 ring-foreground/4`,w),...T,children:(0,o.jsx)(r.CardContent,{className:`p-0`,children:k})})}exports.DataState=l;

package/dist/src/components/display/data-state.js

@@ -0,0 +1,113 @@
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "../ui/button/index.js";
+import { Card as n, CardContent as r } from "../ui/card/index.js";
+import "react";
+import { AlertTriangleIcon as i, CheckCircle2Icon as a, Loader2Icon as o, SearchXIcon as s, XIcon as c } from "lucide-react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/display/data-state.tsx
+var d = {
+	idle: {
+		title: "Ready",
+		description: "No action has started yet.",
+		icon: /* @__PURE__ */ l(a, {})
+	},
+	loading: {
+		title: "Loading",
+		description: "Please wait while data is being prepared.",
+		icon: /* @__PURE__ */ l(o, { className: "animate-spin" })
+	},
+	empty: {
+		title: "No data",
+		description: "There is nothing to show yet.",
+		icon: /* @__PURE__ */ l(s, {})
+	},
+	error: {
+		title: "Something went wrong",
+		description: "Try again or check the request.",
+		icon: /* @__PURE__ */ l(i, {})
+	},
+	success: {
+		title: "Ready",
+		description: "Data loaded successfully.",
+		icon: /* @__PURE__ */ l(a, {})
+	}
+}, f = {
+	default: "text-muted-foreground",
+	muted: "text-muted-foreground",
+	success: "text-emerald-600 dark:text-emerald-400",
+	warning: "text-amber-600 dark:text-amber-400",
+	danger: "text-destructive",
+	info: "text-blue-600 dark:text-blue-400"
+};
+function p({ status: i, title: a, description: o, badge: s, actions: p, footer: m, icon: h, tone: g, variant: _ = "card", compact: v = !1, align: y = "center", query: b, children: x, retryLabel: S = "Retry", onRetry: C, clearLabel: w = "Clear", onClear: T, className: E, ...D }) {
+	let O = d[i], k = g ?? (i === "error" ? "danger" : i === "success" ? "success" : "default"), A = _ === "plain" || _ === "inline", j = /* @__PURE__ */ u("div", {
+		className: e("flex flex-col justify-center", y === "center" ? "items-center text-center" : "items-start text-left", v || _ === "inline" ? "p-4" : "min-h-52 p-8"),
+		children: [
+			/* @__PURE__ */ l("div", {
+				className: e("mb-3 flex items-center justify-center rounded-full border border-border/70 bg-muted/45 shadow-[0_1px_0_rgba(255,255,255,0.05)] [&_svg]:size-5", f[k], v || _ === "inline" ? "size-9" : "size-12"),
+				children: h ?? O.icon
+			}),
+			/* @__PURE__ */ u("div", {
+				className: e("flex flex-wrap items-center gap-2", y === "center" ? "justify-center" : "justify-start"),
+				children: [/* @__PURE__ */ l("div", {
+					className: e("font-semibold tracking-tight text-foreground", v ? "text-sm" : "text-base"),
+					children: a ?? O.title
+				}), s]
+			}),
+			/* @__PURE__ */ l("p", {
+				className: "mt-1 max-w-md text-sm text-muted-foreground",
+				children: o ?? O.description
+			}),
+			b && /* @__PURE__ */ l("div", {
+				className: "mt-3 max-w-full rounded-md border border-border/70 bg-muted/45 px-2.5 py-1 text-sm text-muted-foreground",
+				children: b
+			}),
+			x && /* @__PURE__ */ l("div", {
+				className: "mt-4 w-full",
+				children: x
+			}),
+			(p || C || T) && /* @__PURE__ */ u("div", {
+				className: e("mt-4 flex flex-wrap gap-2", y === "center" ? "justify-center" : "justify-start"),
+				children: [
+					C && /* @__PURE__ */ l(t, {
+						size: "sm",
+						variant: i === "error" ? "default" : "outline",
+						onClick: C,
+						children: S
+					}),
+					T && /* @__PURE__ */ u(t, {
+						size: "sm",
+						variant: "ghost",
+						onClick: T,
+						children: [/* @__PURE__ */ l(c, { "data-icon": "inline-start" }), w]
+					}),
+					p
+				]
+			}),
+			m ? /* @__PURE__ */ l("div", {
+				className: "mt-4 w-full",
+				children: m
+			}) : null
+		]
+	});
+	return A ? /* @__PURE__ */ l("div", {
+		"data-slot": "data-state",
+		"data-status": i,
+		"data-variant": _,
+		className: e(_ === "inline" ? "rounded-lg border border-border/70 bg-muted/20" : "min-w-0", E),
+		...D,
+		children: j
+	}) : /* @__PURE__ */ l(n, {
+		"data-slot": "data-state",
+		"data-status": i,
+		"data-variant": _,
+		className: e("min-w-0 border-border/75 bg-card/96 shadow-sm ring-1 ring-foreground/4", E),
+		...D,
+		children: /* @__PURE__ */ l(r, {
+			className: "p-0",
+			children: j
+		})
+	});
+}
+//#endregion
+export { p as DataState };

package/dist/src/components/display/delta-badge.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/badge/index.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("lucide-react"),a=require("react/jsx-runtime");function o({value:e,trend:r=`neutral`,size:o=`default`,icon:s=!0,className:c,...l}){return(0,a.jsx)(n.Badge,{"data-slot":`delta-badge`,variant:`soft`,tone:r===`up`?`success`:r===`down`?`danger`:`muted`,size:o,leftIcon:s?(0,a.jsx)(r===`up`?i.ArrowUpIcon:r===`down`?i.ArrowDownIcon:i.MinusIcon,{className:t.cn(`shrink-0`,o===`sm`?`size-2.5`:`size-3`)}):void 0,label:e,className:t.cn(o===`sm`&&`min-h-5 px-1.5 text-[10px]`,c),...l})}exports.DeltaBadge=o;

package/dist/src/components/display/delta-badge.js

@@ -0,0 +1,20 @@
+import { cn as e } from "../../lib/utils.js";
+import { Badge as t } from "../ui/badge/index.js";
+import "react";
+import { ArrowDownIcon as n, ArrowUpIcon as r, MinusIcon as i } from "lucide-react";
+import { jsx as a } from "react/jsx-runtime";
+//#region src/components/display/delta-badge.tsx
+function o({ value: o, trend: s = "neutral", size: c = "default", icon: l = !0, className: u, ...d }) {
+	return /* @__PURE__ */ a(t, {
+		"data-slot": "delta-badge",
+		variant: "soft",
+		tone: s === "up" ? "success" : s === "down" ? "danger" : "muted",
+		size: c,
+		leftIcon: l ? /* @__PURE__ */ a(s === "up" ? r : s === "down" ? n : i, { className: e("shrink-0", c === "sm" ? "size-2.5" : "size-3") }) : void 0,
+		label: o,
+		className: e(c === "sm" && "min-h-5 px-1.5 text-[10px]", u),
+		...d
+	});
+}
+//#endregion
+export { o as DeltaBadge };

package/dist/src/components/display/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(`description-list`,`DescriptionList`,`display`,`Structured key-value details for entity, invoice and profile pages.`),e.component(`progress`,`Progress`,`display`,`Linear progress with label, value formatter, tone and indeterminate state.`),e.component(`progress-circle`,`ProgressCircle`,`display`,`Compact circular progress for sidebars and status cards.`),e.component(`timeline`,`Timeline`,`display`,`Vertical or horizontal event stream for workflow history.`),e.component(`status-dot`,`StatusDot`,`display`,`Tiny live status indicator with optional pulse animation.`),e.component(`user-card`,`UserCard`,`display`,`User summary row with avatar, metadata and actions.`),e.component(`delta-badge`,`DeltaBadge`,`display`,`Compact positive, negative, and risk deltas for metric summaries.`),e.component(`notification-center`,`NotificationCenter`,`display`,`Compact activity and notifications stream.`),e.component(`data-list`,`DataList`,`display`,`Readable title and description rows for compact operational lists.`),e.component(`status-legend`,`StatusLegend`,`display`,`Explain status meaning and counts in a compact legend.`),e.component(`trend-card`,`TrendCard`,`display`,`Metric summary card with trend context.`)]);exports.displayShowcaseDemoRegistry=t;

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

@@ -0,0 +1,17 @@
+import { component as e, createShowcaseDemoRegistry as t } from "../../showcase/create-demo.js";
+//#region src/components/display/demo.tsx
+var n = t([
+	e("description-list", "DescriptionList", "display", "Structured key-value details for entity, invoice and profile pages."),
+	e("progress", "Progress", "display", "Linear progress with label, value formatter, tone and indeterminate state."),
+	e("progress-circle", "ProgressCircle", "display", "Compact circular progress for sidebars and status cards."),
+	e("timeline", "Timeline", "display", "Vertical or horizontal event stream for workflow history."),
+	e("status-dot", "StatusDot", "display", "Tiny live status indicator with optional pulse animation."),
+	e("user-card", "UserCard", "display", "User summary row with avatar, metadata and actions."),
+	e("delta-badge", "DeltaBadge", "display", "Compact positive, negative, and risk deltas for metric summaries."),
+	e("notification-center", "NotificationCenter", "display", "Compact activity and notifications stream."),
+	e("data-list", "DataList", "display", "Readable title and description rows for compact operational lists."),
+	e("status-legend", "StatusLegend", "display", "Explain status meaning and counts in a compact legend."),
+	e("trend-card", "TrendCard", "display", "Metric summary card with trend context.")
+]);
+//#endregion
+export { n as displayShowcaseDemoRegistry };

package/dist/src/components/display/description-list.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/card/index.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("react/jsx-runtime");var a={1:`grid-cols-1`,2:`grid-cols-1 md:grid-cols-2`,3:`grid-cols-1 md:grid-cols-2 xl:grid-cols-3`,4:`grid-cols-1 md:grid-cols-2 xl:grid-cols-4`},o={1:`col-span-1`,2:`md:col-span-2`,3:`xl:col-span-3`,4:`xl:col-span-4`};function s(e){return e==null||e===``}function c({title:e,description:r,actions:c,items:l,columns:u=2,bordered:d=!0,compact:f=!1,emptyValue:p=`-`,itemClassName:m,labelClassName:h,valueClassName:g,contentClassName:_,className:v,...y}){let b=l.filter(e=>!e.hidden),x=!!(e||r||c);return(0,i.jsxs)(n.Card,{"data-slot":`description-list`,className:t.cn(`min-w-0`,v),...y,children:[x&&(0,i.jsx)(n.CardHeader,{children:(0,i.jsxs)(`div`,{className:`flex min-w-0 items-start justify-between gap-3`,children:[(0,i.jsxs)(`div`,{className:`min-w-0 space-y-1`,children:[e&&(0,i.jsx)(n.CardTitle,{children:e}),r&&(0,i.jsx)(n.CardDescription,{children:r})]}),c&&(0,i.jsx)(`div`,{className:`shrink-0`,children:c})]})}),(0,i.jsx)(n.CardContent,{className:t.cn(`grid gap-2`,a[u],_),children:b.map(e=>(0,i.jsx)(`div`,{"data-slot":`description-list-item`,className:t.cn(`min-w-0 rounded-lg`,d&&`border bg-muted/20`,f?`p-2`:`p-3`,e.span&&e.span>1&&o[e.span],m,e.className),children:(0,i.jsxs)(`div`,{className:`flex min-w-0 items-start gap-2`,children:[e.icon&&(0,i.jsx)(`span`,{className:`mt-0.5 shrink-0 text-muted-foreground [&_svg]:size-4`,children:e.icon}),(0,i.jsxs)(`div`,{className:`min-w-0 flex-1 space-y-1`,children:[(0,i.jsx)(`div`,{className:t.cn(`text-xs font-medium uppercase tracking-wide text-muted-foreground`,h,e.labelClassName),children:e.label}),(0,i.jsx)(`div`,{className:t.cn(`min-w-0 break-words text-sm font-medium text-foreground`,g,e.valueClassName),children:s(e.value)?p:e.value}),e.description&&(0,i.jsx)(`div`,{className:`text-xs leading-5 text-muted-foreground`,children:e.description})]})]})},e.key))})]})}exports.DescriptionList=c;

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

@@ -0,0 +1,68 @@
+import { cn as e } from "../../lib/utils.js";
+import { Card as t, CardContent as n, CardDescription as r, CardHeader as i, CardTitle as a } from "../ui/card/index.js";
+import "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/display/description-list.tsx
+var c = {
+	1: "grid-cols-1",
+	2: "grid-cols-1 md:grid-cols-2",
+	3: "grid-cols-1 md:grid-cols-2 xl:grid-cols-3",
+	4: "grid-cols-1 md:grid-cols-2 xl:grid-cols-4"
+}, l = {
+	1: "col-span-1",
+	2: "md:col-span-2",
+	3: "xl:col-span-3",
+	4: "xl:col-span-4"
+};
+function u(e) {
+	return e == null || e === "";
+}
+function d({ title: d, description: f, actions: p, items: m, columns: h = 2, bordered: g = !0, compact: _ = !1, emptyValue: v = "-", itemClassName: y, labelClassName: b, valueClassName: x, contentClassName: S, className: C, ...w }) {
+	let T = m.filter((e) => !e.hidden), E = !!(d || f || p);
+	return /* @__PURE__ */ s(t, {
+		"data-slot": "description-list",
+		className: e("min-w-0", C),
+		...w,
+		children: [E && /* @__PURE__ */ o(i, { children: /* @__PURE__ */ s("div", {
+			className: "flex min-w-0 items-start justify-between gap-3",
+			children: [/* @__PURE__ */ s("div", {
+				className: "min-w-0 space-y-1",
+				children: [d && /* @__PURE__ */ o(a, { children: d }), f && /* @__PURE__ */ o(r, { children: f })]
+			}), p && /* @__PURE__ */ o("div", {
+				className: "shrink-0",
+				children: p
+			})]
+		}) }), /* @__PURE__ */ o(n, {
+			className: e("grid gap-2", c[h], S),
+			children: T.map((t) => /* @__PURE__ */ o("div", {
+				"data-slot": "description-list-item",
+				className: e("min-w-0 rounded-lg", g && "border bg-muted/20", _ ? "p-2" : "p-3", t.span && t.span > 1 && l[t.span], y, t.className),
+				children: /* @__PURE__ */ s("div", {
+					className: "flex min-w-0 items-start gap-2",
+					children: [t.icon && /* @__PURE__ */ o("span", {
+						className: "mt-0.5 shrink-0 text-muted-foreground [&_svg]:size-4",
+						children: t.icon
+					}), /* @__PURE__ */ s("div", {
+						className: "min-w-0 flex-1 space-y-1",
+						children: [
+							/* @__PURE__ */ o("div", {
+								className: e("text-xs font-medium uppercase tracking-wide text-muted-foreground", b, t.labelClassName),
+								children: t.label
+							}),
+							/* @__PURE__ */ o("div", {
+								className: e("min-w-0 break-words text-sm font-medium text-foreground", x, t.valueClassName),
+								children: u(t.value) ? v : t.value
+							}),
+							t.description && /* @__PURE__ */ o("div", {
+								className: "text-xs leading-5 text-muted-foreground",
+								children: t.description
+							})
+						]
+					})]
+				})
+			}, t.key))
+		})]
+	});
+}
+//#endregion
+export { d as DescriptionList };

package/dist/src/components/display/descriptions.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("react/jsx-runtime");var i={sm:`gap-2 text-sm`,md:`gap-3 text-sm`,lg:`gap-4 text-base`};function a({items:e,title:n,extra:a,bordered:o=!0,columns:s=3,size:c=`md`,labelClassName:l,valueClassName:u,className:d,...f}){return(0,r.jsxs)(`div`,{"data-slot":`descriptions`,className:t.cn(`grid gap-3`,d),...f,children:[(n||a)&&(0,r.jsxs)(`div`,{className:`flex items-center justify-between gap-3`,children:[n&&(0,r.jsx)(`div`,{className:`text-base font-semibold text-foreground`,children:n}),a]}),(0,r.jsx)(`div`,{className:t.cn(`grid overflow-hidden`,o&&`rounded-lg border bg-card`,!o&&i[c],s===1&&`grid-cols-1`,s===2&&`grid-cols-1 sm:grid-cols-2`,s===3&&`grid-cols-1 sm:grid-cols-2 lg:grid-cols-3`,s===4&&`grid-cols-1 sm:grid-cols-2 lg:grid-cols-4`),children:e.map(e=>(0,r.jsxs)(`div`,{"data-slot":`descriptions-item`,className:t.cn(`min-w-0`,o?`border-b border-r p-3 last:border-b-0`:`grid gap-1`,e.span===2&&`sm:col-span-2`,e.span===3&&`lg:col-span-3`,e.span===4&&`lg:col-span-4`),children:[(0,r.jsx)(`div`,{className:t.cn(`text-xs font-medium uppercase tracking-wide text-muted-foreground`,l),children:e.label}),(0,r.jsx)(`div`,{className:t.cn(`mt-1 min-w-0 break-words text-sm text-foreground`,u),children:e.value})]},e.key))})]})}exports.Descriptions=a;

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

@@ -0,0 +1,38 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/display/descriptions.tsx
+var r = {
+	sm: "gap-2 text-sm",
+	md: "gap-3 text-sm",
+	lg: "gap-4 text-base"
+};
+function i({ items: i, title: a, extra: o, bordered: s = !0, columns: c = 3, size: l = "md", labelClassName: u, valueClassName: d, className: f, ...p }) {
+	return /* @__PURE__ */ n("div", {
+		"data-slot": "descriptions",
+		className: e("grid gap-3", f),
+		...p,
+		children: [(a || o) && /* @__PURE__ */ n("div", {
+			className: "flex items-center justify-between gap-3",
+			children: [a && /* @__PURE__ */ t("div", {
+				className: "text-base font-semibold text-foreground",
+				children: a
+			}), o]
+		}), /* @__PURE__ */ t("div", {
+			className: e("grid overflow-hidden", s && "rounded-lg border bg-card", !s && r[l], c === 1 && "grid-cols-1", c === 2 && "grid-cols-1 sm:grid-cols-2", c === 3 && "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3", c === 4 && "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4"),
+			children: i.map((r) => /* @__PURE__ */ n("div", {
+				"data-slot": "descriptions-item",
+				className: e("min-w-0", s ? "border-b border-r p-3 last:border-b-0" : "grid gap-1", r.span === 2 && "sm:col-span-2", r.span === 3 && "lg:col-span-3", r.span === 4 && "lg:col-span-4"),
+				children: [/* @__PURE__ */ t("div", {
+					className: e("text-xs font-medium uppercase tracking-wide text-muted-foreground", u),
+					children: r.label
+				}), /* @__PURE__ */ t("div", {
+					className: e("mt-1 min-w-0 break-words text-sm text-foreground", d),
+					children: r.value
+				})]
+			}, r.key))
+		})]
+	});
+}
+//#endregion
+export { i as Descriptions };