tembro 2.0.4 → 2.0.6

package/dist/components/ui/card/index.cjs

@@ -1 +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("class-variance-authority"),i=require("react/jsx-runtime");var a=(0,r.cva)(`group/card flex flex-col gap-(--card-spacing) overflow-hidden rounded-[var(--aui-card-radius,var(--radius-xl))] border py-(--card-spacing) text-sm text-card-foreground transition-[background-color,border-color,box-shadow,transform,opacity] [--card-spacing:--spacing(5)] has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 *:[img:first-child]:rounded-t-[var(--aui-card-radius,var(--radius-xl))] *:[img:last-child]:rounded-b-[var(--aui-card-radius,var(--radius-xl))]`,{variants:{variant:{default:``,elevated:``,outline:``,soft:``,ghost:`border-transparent bg-transparent shadow-none ring-0`},size:{sm:`[--card-spacing:--spacing(4)] data-[has-footer=true]:pb-0`,default:`[--card-spacing:--spacing(5)]`,lg:`[--card-spacing:--spacing(6)]`},density:{compact:`text-xs`,default:`text-sm`,comfortable:`text-base`},tone:{neutral:``,info:``,success:``,warning:``,danger:``},interactive:{true:`cursor-pointer focus-visible:outline-none focus-visible:ring-0`,false:``},selected:{true:``,false:``},disabled:{true:`pointer-events-none opacity-55`,false:``}},defaultVariants:{variant:`default`,size:`default`,density:`default`,tone:`neutral`,interactive:!1,selected:!1,disabled:!1}});function o(e){return e.eyebrow!=null||e.title!=null||e.description!=null||e.badge!=null||e.action!=null||e.media!=null||e.content!=null||e.footer!=null}function s({className:e,variant:n,size:r,density:s,tone:m,interactive:h,selected:g,disabled:_,tabIndex:v,eyebrow:y,title:b,description:x,badge:S,action:C,media:w,content:T,footer:E,headerClassName:D,titleClassName:O,descriptionClassName:k,contentClassName:A,footerClassName:j,children:M,...N}){let P=o({eyebrow:y,title:b,description:x,badge:S,action:C,media:w,content:T,footer:E}),F=T??M,I=y!=null||b!=null||x!=null||S!=null||C!=null,L=E!=null;return(0,i.jsx)(`div`,{"data-slot":`card`,"data-surface":P||void 0,"data-size":r??`default`,"data-variant":n??`default`,"data-tone":m??`neutral`,"data-density":s??`default`,"data-interactive":h||void 0,"data-selected":g||void 0,"data-disabled":_||void 0,"data-has-footer":L||void 0,"aria-disabled":_||void 0,tabIndex:h&&!_?v??0:v,className:t.cn(a({variant:n,size:r,density:s,tone:m,interactive:h,selected:g,disabled:_}),e),...N,children:P?(0,i.jsxs)(i.Fragment,{children:[w,I?(0,i.jsxs)(c,{className:D,children:[(0,i.jsxs)(`div`,{className:`min-w-0 space-y-1`,children:[y==null?null:(0,i.jsx)(`div`,{className:`text-[11px] font-semibold uppercase tracking-[0.18em] text-muted-foreground/80`,children:y}),b==null?null:(0,i.jsx)(l,{className:O,children:b}),x==null?null:(0,i.jsx)(u,{className:k,children:x})]}),S!=null||C!=null?(0,i.jsxs)(d,{className:`flex items-center gap-2`,children:[S,C]}):null]}):null,F==null?null:(0,i.jsx)(f,{className:A,children:F}),L?(0,i.jsx)(p,{className:j,children:E}):null]}):M})}function c({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`card-header`,className:t.cn(`group/card-header @container/card-header grid auto-rows-min items-start gap-1.5 rounded-t-[var(--aui-card-radius,var(--radius-xl))] px-(--card-spacing) has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-(--card-spacing)`,e),...n})}function l({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`card-title`,className:t.cn(`font-heading text-[1.05rem] leading-snug font-semibold tracking-tight group-data-[size=sm]/card:text-sm group-data-[size=lg]/card:text-xl`,e),...n})}function u({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`card-description`,className:t.cn(`text-sm leading-6 text-muted-foreground`,e),...n})}function d({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`card-action`,className:t.cn(`col-start-2 row-span-2 row-start-1 self-start justify-self-end`,e),...n})}function f({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`card-content`,className:t.cn(`px-(--card-spacing)`,e),...n})}function p({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`card-footer`,className:t.cn(`flex items-center rounded-b-[var(--aui-card-radius,var(--radius-xl))] border-t border-border/60 bg-muted/22 p-(--card-spacing)`,e),...n})}exports.Card=s,exports.CardAction=d,exports.CardContent=f,exports.CardDescription=u,exports.CardFooter=p,exports.CardHeader=c,exports.CardTitle=l,exports.cardVariants=a;
+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("class-variance-authority"),i=require("react/jsx-runtime");var a=(0,r.cva)(`group/card flex flex-col gap-(--card-spacing) overflow-hidden rounded-[var(--aui-card-radius,var(--radius-xl))] border py-(--card-spacing) text-sm text-card-foreground transition-[background-color,border-color,box-shadow,transform,opacity] [--card-spacing:--spacing(5)] has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 *:[img:first-child]:rounded-t-[var(--aui-card-radius,var(--radius-xl))] *:[img:last-child]:rounded-b-[var(--aui-card-radius,var(--radius-xl))]`,{variants:{variant:{default:``,elevated:``,outline:``,soft:``,ghost:`border-transparent bg-transparent shadow-none ring-0`},size:{sm:`[--card-spacing:--spacing(4)] data-[has-footer=true]:pb-0`,default:`[--card-spacing:--spacing(5)]`,lg:`[--card-spacing:--spacing(6)]`},density:{compact:`text-xs`,default:`text-sm`,comfortable:`text-base`},tone:{neutral:``,info:``,success:``,warning:``,danger:``},interactive:{true:`cursor-pointer focus-visible:outline-none focus-visible:ring-0`,false:``},selected:{true:``,false:``},disabled:{true:`pointer-events-none opacity-55`,false:``}},defaultVariants:{variant:`default`,size:`default`,density:`default`,tone:`neutral`,interactive:!1,selected:!1,disabled:!1}});function o(e){return e.eyebrow!=null||e.title!=null||e.description!=null||e.badge!=null||e.action!=null||e.media!=null||e.content!=null||e.footer!=null}function s({className:e,variant:n,size:r,density:s,tone:m,interactive:h,selected:g,disabled:_,orientation:v=`vertical`,mediaPosition:y=`start`,mediaAspect:b=`auto`,padding:x=`default`,tabIndex:S,eyebrow:C,title:w,description:T,badge:E,action:D,media:O,content:k,footer:A,mediaClassName:j,bodyClassName:M,headerClassName:N,eyebrowClassName:P,titleClassName:F,descriptionClassName:I,contentClassName:L,footerClassName:R,children:z,...B}){let V=o({eyebrow:C,title:w,description:T,badge:E,action:D,media:O,content:k,footer:A}),H=k??z,U=C!=null||w!=null||T!=null||E!=null||D!=null,W=A!=null,G=O?(0,i.jsx)(`div`,{"data-slot":`card-media`,"data-media-position":y,"data-media-aspect":b,className:t.cn(`overflow-hidden`,v===`horizontal`?`shrink-0 self-stretch`:``,b===`square`&&(v===`horizontal`?`w-40`:`aspect-square`),b===`video`&&(v===`horizontal`?`w-56`:`aspect-video`),b===`poster`&&(v===`horizontal`?`w-36`:`aspect-[3/4]`),b===`wide`&&(v===`horizontal`?`w-72`:`aspect-[16/7]`),j),children:O}):null,K={none:``,sm:`px-4`,default:`px-(--card-spacing)`,lg:`px-6`},q={none:``,sm:`pb-4`,default:``,lg:`pb-6`};return(0,i.jsx)(`div`,{"data-slot":`card`,"data-surface":V||void 0,"data-size":r??`default`,"data-variant":n??`default`,"data-tone":m??`neutral`,"data-density":s??`default`,"data-interactive":h||void 0,"data-selected":g||void 0,"data-disabled":_||void 0,"data-has-footer":W||void 0,"data-orientation":v,"data-padding":x,"aria-disabled":_||void 0,tabIndex:h&&!_?S??0:S,className:t.cn(a({variant:n,size:r,density:s,tone:m,interactive:h,selected:g,disabled:_}),v===`horizontal`&&`flex-row py-0`,h&&`hover:border-[color:var(--aui-control-hover-border,var(--ring))] hover:shadow-[var(--aui-card-shadow-hover,var(--aui-card-shadow,0_12px_32px_rgba(15,23,42,0.08)))]`,g&&`border-[color:var(--aui-control-border-strong,var(--ring))] shadow-[var(--aui-card-shadow-hover,var(--aui-card-shadow,0_12px_32px_rgba(15,23,42,0.08)))]`,e),...B,children:V?(0,i.jsxs)(i.Fragment,{children:[y===`start`?G:null,(0,i.jsxs)(`div`,{"data-slot":`card-body`,className:t.cn(`flex min-w-0 flex-1 flex-col`,v===`horizontal`?`py-(--card-spacing)`:``,q[x],M),children:[U?(0,i.jsxs)(c,{className:t.cn(K[x],N),children:[(0,i.jsxs)(`div`,{className:`min-w-0 space-y-1`,children:[C==null?null:(0,i.jsx)(`div`,{className:t.cn(`text-[11px] font-semibold uppercase tracking-[0.18em] text-muted-foreground/80`,P),children:C}),w==null?null:(0,i.jsx)(l,{className:F,children:w}),T==null?null:(0,i.jsx)(u,{className:I,children:T})]}),E!=null||D!=null?(0,i.jsxs)(d,{className:`flex items-center gap-2`,children:[E,D]}):null]}):null,H==null?null:(0,i.jsx)(f,{className:t.cn(K[x],L),children:H}),W?(0,i.jsx)(p,{className:t.cn(K[x],R),children:A}):null]}),y===`end`?G:null]}):z})}function c({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`card-header`,className:t.cn(`group/card-header @container/card-header grid auto-rows-min items-start gap-1.5 rounded-t-[var(--aui-card-radius,var(--radius-xl))] px-(--card-spacing) has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-(--card-spacing)`,e),...n})}function l({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`card-title`,className:t.cn(`font-heading text-[1.05rem] leading-snug font-semibold tracking-tight group-data-[size=sm]/card:text-sm group-data-[size=lg]/card:text-xl`,e),...n})}function u({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`card-description`,className:t.cn(`text-sm leading-6 text-muted-foreground`,e),...n})}function d({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`card-action`,className:t.cn(`col-start-2 row-span-2 row-start-1 self-start justify-self-end`,e),...n})}function f({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`card-content`,className:t.cn(`px-(--card-spacing)`,e),...n})}function p({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`card-footer`,className:t.cn(`flex items-center rounded-b-[var(--aui-card-radius,var(--radius-xl))] border-t border-border/60 bg-muted/22 p-(--card-spacing)`,e),...n})}exports.Card=s,exports.CardAction=d,exports.CardContent=f,exports.CardDescription=u,exports.CardFooter=p,exports.CardHeader=c,exports.CardTitle=l,exports.cardVariants=a;

package/dist/components/ui/card/index.d.ts

@@ -18,14 +18,25 @@ type CardSurfaceSlots = {
     media?: React.ReactNode;
     content?: React.ReactNode;
     footer?: React.ReactNode;
+    mediaClassName?: string;
+    bodyClassName?: string;
     headerClassName?: string;
+    eyebrowClassName?: string;
     titleClassName?: string;
     descriptionClassName?: string;
     contentClassName?: string;
     footerClassName?: string;
 };
-export type CardProps = Omit<React.ComponentProps<"div">, keyof CardSurfaceSlots> & VariantProps<typeof cardVariants> & CardSurfaceSlots;
-declare function Card({ className, variant, size, density, tone, interactive, selected, disabled, tabIndex, eyebrow, title, description, badge, action, media, content, footer, headerClassName, titleClassName, descriptionClassName, contentClassName, footerClassName, children, ...props }: CardProps): React.JSX.Element;
+export type CardOrientation = "vertical" | "horizontal";
+export type CardMediaAspect = "auto" | "square" | "video" | "poster" | "wide";
+export type CardPadding = "none" | "sm" | "default" | "lg";
+export type CardProps = Omit<React.ComponentProps<"div">, keyof CardSurfaceSlots> & VariantProps<typeof cardVariants> & CardSurfaceSlots & {
+    orientation?: CardOrientation;
+    mediaPosition?: "start" | "end";
+    mediaAspect?: CardMediaAspect;
+    padding?: CardPadding;
+};
+declare function Card({ className, variant, size, density, tone, interactive, selected, disabled, orientation, mediaPosition, mediaAspect, padding, tabIndex, eyebrow, title, description, badge, action, media, content, footer, mediaClassName, bodyClassName, headerClassName, eyebrowClassName, titleClassName, descriptionClassName, contentClassName, footerClassName, children, ...props }: CardProps): React.JSX.Element;
 declare function CardHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
 declare function CardTitle({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
 declare function CardDescription({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;

package/dist/components/ui/card/index.js

@@ -55,20 +55,36 @@ var a = t("group/card flex flex-col gap-(--card-spacing) overflow-hidden rounded
 function o(e) {
 	return e.eyebrow != null || e.title != null || e.description != null || e.badge != null || e.action != null || e.media != null || e.content != null || e.footer != null;
 }
-function s({ className: t, variant: s, size: m, density: h, tone: g, interactive: _, selected: v, disabled: y, tabIndex: b, eyebrow: x, title: S, description: C, badge: w, action: T, media: E, content: D, footer: O, headerClassName: k, titleClassName: A, descriptionClassName: j, contentClassName: M, footerClassName: N, children: P, ...F }) {
-	let I = o({
-		eyebrow: x,
-		title: S,
-		description: C,
-		badge: w,
-		action: T,
-		media: E,
-		content: D,
-		footer: O
-	}), L = D ?? P, R = x != null || S != null || C != null || w != null || T != null, z = O != null;
+function s({ className: t, variant: s, size: m, density: h, tone: g, interactive: _, selected: v, disabled: y, orientation: b = "vertical", mediaPosition: x = "start", mediaAspect: S = "auto", padding: C = "default", tabIndex: w, eyebrow: T, title: E, description: D, badge: O, action: k, media: A, content: j, footer: M, mediaClassName: N, bodyClassName: P, headerClassName: F, eyebrowClassName: I, titleClassName: L, descriptionClassName: R, contentClassName: z, footerClassName: B, children: V, ...H }) {
+	let U = o({
+		eyebrow: T,
+		title: E,
+		description: D,
+		badge: O,
+		action: k,
+		media: A,
+		content: j,
+		footer: M
+	}), W = j ?? V, G = T != null || E != null || D != null || O != null || k != null, K = M != null, q = A ? /* @__PURE__ */ r("div", {
+		"data-slot": "card-media",
+		"data-media-position": x,
+		"data-media-aspect": S,
+		className: e("overflow-hidden", b === "horizontal" ? "shrink-0 self-stretch" : "", S === "square" && (b === "horizontal" ? "w-40" : "aspect-square"), S === "video" && (b === "horizontal" ? "w-56" : "aspect-video"), S === "poster" && (b === "horizontal" ? "w-36" : "aspect-[3/4]"), S === "wide" && (b === "horizontal" ? "w-72" : "aspect-[16/7]"), N),
+		children: A
+	}) : null, J = {
+		none: "",
+		sm: "px-4",
+		default: "px-(--card-spacing)",
+		lg: "px-6"
+	}, Y = {
+		none: "",
+		sm: "pb-4",
+		default: "",
+		lg: "pb-6"
+	};
 	return /* @__PURE__ */ r("div", {
 		"data-slot": "card",
-		"data-surface": I || void 0,
+		"data-surface": U || void 0,
 		"data-size": m ?? "default",
 		"data-variant": s ?? "default",
 		"data-tone": g ?? "neutral",
@@ -76,9 +92,11 @@ function s({ className: t, variant: s, size: m, density: h, tone: g, interactive
 		"data-interactive": _ || void 0,
 		"data-selected": v || void 0,
 		"data-disabled": y || void 0,
-		"data-has-footer": z || void 0,
+		"data-has-footer": K || void 0,
+		"data-orientation": b,
+		"data-padding": C,
 		"aria-disabled": y || void 0,
-		tabIndex: _ && !y ? b ?? 0 : b,
+		tabIndex: _ && !y ? w ?? 0 : w,
 		className: e(a({
 			variant: s,
 			size: m,
@@ -87,42 +105,49 @@ function s({ className: t, variant: s, size: m, density: h, tone: g, interactive
 			interactive: _,
 			selected: v,
 			disabled: y
-		}), t),
-		...F,
-		children: I ? /* @__PURE__ */ i(n, { children: [
-			E,
-			R ? /* @__PURE__ */ i(c, {
-				className: k,
-				children: [/* @__PURE__ */ i("div", {
-					className: "min-w-0 space-y-1",
-					children: [
-						x == null ? null : /* @__PURE__ */ r("div", {
-							className: "text-[11px] font-semibold uppercase tracking-[0.18em] text-muted-foreground/80",
-							children: x
-						}),
-						S == null ? null : /* @__PURE__ */ r(l, {
-							className: A,
-							children: S
-						}),
-						C == null ? null : /* @__PURE__ */ r(u, {
-							className: j,
-							children: C
-						})
-					]
-				}), w != null || T != null ? /* @__PURE__ */ i(d, {
-					className: "flex items-center gap-2",
-					children: [w, T]
-				}) : null]
-			}) : null,
-			L == null ? null : /* @__PURE__ */ r(f, {
-				className: M,
-				children: L
+		}), b === "horizontal" && "flex-row py-0", _ && "hover:border-[color:var(--aui-control-hover-border,var(--ring))] hover:shadow-[var(--aui-card-shadow-hover,var(--aui-card-shadow,0_12px_32px_rgba(15,23,42,0.08)))]", v && "border-[color:var(--aui-control-border-strong,var(--ring))] shadow-[var(--aui-card-shadow-hover,var(--aui-card-shadow,0_12px_32px_rgba(15,23,42,0.08)))]", t),
+		...H,
+		children: U ? /* @__PURE__ */ i(n, { children: [
+			x === "start" ? q : null,
+			/* @__PURE__ */ i("div", {
+				"data-slot": "card-body",
+				className: e("flex min-w-0 flex-1 flex-col", b === "horizontal" ? "py-(--card-spacing)" : "", Y[C], P),
+				children: [
+					G ? /* @__PURE__ */ i(c, {
+						className: e(J[C], F),
+						children: [/* @__PURE__ */ i("div", {
+							className: "min-w-0 space-y-1",
+							children: [
+								T == null ? null : /* @__PURE__ */ r("div", {
+									className: e("text-[11px] font-semibold uppercase tracking-[0.18em] text-muted-foreground/80", I),
+									children: T
+								}),
+								E == null ? null : /* @__PURE__ */ r(l, {
+									className: L,
+									children: E
+								}),
+								D == null ? null : /* @__PURE__ */ r(u, {
+									className: R,
+									children: D
+								})
+							]
+						}), O != null || k != null ? /* @__PURE__ */ i(d, {
+							className: "flex items-center gap-2",
+							children: [O, k]
+						}) : null]
+					}) : null,
+					W == null ? null : /* @__PURE__ */ r(f, {
+						className: e(J[C], z),
+						children: W
+					}),
+					K ? /* @__PURE__ */ r(p, {
+						className: e(J[C], B),
+						children: M
+					}) : null
+				]
 			}),
-			z ? /* @__PURE__ */ r(p, {
-				className: N,
-				children: O
-			}) : null
-		] }) : P
+			x === "end" ? q : null
+		] }) : V
 	});
 }
 function c({ className: t, ...n }) {

package/dist/components/ui/checkbox/index.cjs

@@ -1 +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(e){return e!==!0}var o=n.forwardRef(({className:e,checked:o,defaultChecked:s=!1,onCheckedChange:c,disabled:l,onClick:u,children:d,...f},p)=>{let m=o!==void 0,[h,g]=n.useState(s),_=m?o:h,v=_===`indeterminate`?`indeterminate`:_?`checked`:`unchecked`;return(0,i.jsx)(`button`,{ref:p,type:`button`,role:`checkbox`,"aria-checked":_===`indeterminate`?`mixed`:_,"data-state":v,"data-slot":`checkbox`,disabled:l,className:t.cn(`peer flex size-5 shrink-0 items-center justify-center rounded-[10px] border border-input/88 bg-background text-primary-foreground shadow-[inset_0_1px_0_rgba(255,255,255,0.10)] outline-none transition-[background-color,border-color,box-shadow,color,transform] hover:border-ring/30 hover:bg-background focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/45 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-primary/28 data-[state=checked]:bg-primary data-[state=checked]:shadow-[0_10px_24px_color-mix(in_oklch,var(--primary),transparent_82%)] data-[state=indeterminate]:border-primary/28 data-[state=indeterminate]:bg-primary data-[state=indeterminate]:shadow-[0_10px_24px_color-mix(in_oklch,var(--primary),transparent_82%)] dark:border-white/12 dark:bg-white/[0.04] dark:hover:bg-white/[0.08]`,e),onClick:e=>{let t=a(_);m||g(t),c?.(t),u?.(e)},...f,children:d??(0,i.jsx)(`span`,{className:`flex items-center justify-center`,children:_===`indeterminate`?(0,i.jsx)(r.MinusIcon,{className:`size-3.5`}):_?(0,i.jsx)(r.CheckIcon,{className:`size-3.5`}):null})})});o.displayName=`Checkbox`,exports.Checkbox=o;
+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(e,t){return t?e===!1?`indeterminate`:e===`indeterminate`:e!==!0}var o=n.forwardRef(({className:e,checked:o,defaultChecked:s=!1,onCheckedChange:c,onCheckedStateChange:l,size:u=`md`,invalid:d=!1,allowIndeterminate:f=!1,disabled:p,onClick:m,children:h,...g},_)=>{let v=o!==void 0,[y,b]=n.useState(s),x=v?o:y,S=x===`indeterminate`?`indeterminate`:x?`checked`:`unchecked`;return(0,i.jsx)(`button`,{ref:_,type:`button`,role:`checkbox`,"aria-checked":x===`indeterminate`?`mixed`:x,"data-state":S,"data-size":u,"data-slot":`checkbox`,disabled:p,"aria-invalid":d||void 0,className:t.cn(`peer flex shrink-0 items-center justify-center rounded-[10px] border border-input/88 bg-background text-primary-foreground shadow-[inset_0_1px_0_rgba(255,255,255,0.10)] outline-none transition-[background-color,border-color,box-shadow,color,transform] hover:border-ring/30 hover:bg-background focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/45 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/25 data-[size=sm]:size-4 data-[size=md]:size-5 data-[size=lg]:size-6 data-[state=checked]:border-primary/28 data-[state=checked]:bg-primary data-[state=checked]:shadow-[0_10px_24px_color-mix(in_oklch,var(--primary),transparent_82%)] data-[state=indeterminate]:border-primary/28 data-[state=indeterminate]:bg-primary data-[state=indeterminate]:shadow-[0_10px_24px_color-mix(in_oklch,var(--primary),transparent_82%)] dark:border-white/12 dark:bg-white/[0.04] dark:hover:bg-white/[0.08]`,e),onClick:e=>{let t=a(x,f);v||b(t),l?.(t),c?.(t===!0),m?.(e)},...g,children:h??(0,i.jsx)(`span`,{className:`flex items-center justify-center`,children:x===`indeterminate`?(0,i.jsx)(r.MinusIcon,{className:`size-3.5`}):x?(0,i.jsx)(r.CheckIcon,{className:`size-3.5`}):null})})});o.displayName=`Checkbox`,exports.Checkbox=o;

package/dist/components/ui/checkbox/index.d.ts

@@ -4,10 +4,18 @@ export type CheckboxProps = Omit<React.ComponentPropsWithoutRef<"button">, "chec
     checked?: CheckboxCheckedState;
     defaultChecked?: CheckboxCheckedState;
     onCheckedChange?: (checked: boolean) => void;
+    onCheckedStateChange?: (checked: CheckboxCheckedState) => void;
+    size?: "sm" | "md" | "lg";
+    invalid?: boolean;
+    allowIndeterminate?: boolean;
 };
 declare const Checkbox: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "defaultChecked" | "value" | "onChange" | "checked"> & {
     checked?: CheckboxCheckedState;
     defaultChecked?: CheckboxCheckedState;
     onCheckedChange?: (checked: boolean) => void;
+    onCheckedStateChange?: (checked: CheckboxCheckedState) => void;
+    size?: "sm" | "md" | "lg";
+    invalid?: boolean;
+    allowIndeterminate?: boolean;
 } & React.RefAttributes<HTMLButtonElement>>;
 export { Checkbox };

package/dist/components/ui/checkbox/index.js

@@ -3,28 +3,30 @@ import * as t from "react";
 import { CheckIcon as n, MinusIcon as r } from "lucide-react";
 import { jsx as i } from "react/jsx-runtime";
 //#region src/components/ui/checkbox/index.tsx
-function a(e) {
-	return e !== !0;
+function a(e, t) {
+	return t ? e === !1 ? "indeterminate" : e === "indeterminate" : e !== !0;
 }
-var o = t.forwardRef(({ className: o, checked: s, defaultChecked: c = !1, onCheckedChange: l, disabled: u, onClick: d, children: f, ...p }, m) => {
-	let h = s !== void 0, [g, _] = t.useState(c), v = h ? s : g;
+var o = t.forwardRef(({ className: o, checked: s, defaultChecked: c = !1, onCheckedChange: l, onCheckedStateChange: u, size: d = "md", invalid: f = !1, allowIndeterminate: p = !1, disabled: m, onClick: h, children: g, ..._ }, v) => {
+	let y = s !== void 0, [b, x] = t.useState(c), S = y ? s : b;
 	return /* @__PURE__ */ i("button", {
-		ref: m,
+		ref: v,
 		type: "button",
 		role: "checkbox",
-		"aria-checked": v === "indeterminate" ? "mixed" : v,
-		"data-state": v === "indeterminate" ? "indeterminate" : v ? "checked" : "unchecked",
+		"aria-checked": S === "indeterminate" ? "mixed" : S,
+		"data-state": S === "indeterminate" ? "indeterminate" : S ? "checked" : "unchecked",
+		"data-size": d,
 		"data-slot": "checkbox",
-		disabled: u,
-		className: e("peer flex size-5 shrink-0 items-center justify-center rounded-[10px] border border-input/88 bg-background text-primary-foreground shadow-[inset_0_1px_0_rgba(255,255,255,0.10)] outline-none transition-[background-color,border-color,box-shadow,color,transform] hover:border-ring/30 hover:bg-background focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/45 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-primary/28 data-[state=checked]:bg-primary data-[state=checked]:shadow-[0_10px_24px_color-mix(in_oklch,var(--primary),transparent_82%)] data-[state=indeterminate]:border-primary/28 data-[state=indeterminate]:bg-primary data-[state=indeterminate]:shadow-[0_10px_24px_color-mix(in_oklch,var(--primary),transparent_82%)] dark:border-white/12 dark:bg-white/[0.04] dark:hover:bg-white/[0.08]", o),
+		disabled: m,
+		"aria-invalid": f || void 0,
+		className: e("peer flex shrink-0 items-center justify-center rounded-[10px] border border-input/88 bg-background text-primary-foreground shadow-[inset_0_1px_0_rgba(255,255,255,0.10)] outline-none transition-[background-color,border-color,box-shadow,color,transform] hover:border-ring/30 hover:bg-background focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/45 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/25 data-[size=sm]:size-4 data-[size=md]:size-5 data-[size=lg]:size-6 data-[state=checked]:border-primary/28 data-[state=checked]:bg-primary data-[state=checked]:shadow-[0_10px_24px_color-mix(in_oklch,var(--primary),transparent_82%)] data-[state=indeterminate]:border-primary/28 data-[state=indeterminate]:bg-primary data-[state=indeterminate]:shadow-[0_10px_24px_color-mix(in_oklch,var(--primary),transparent_82%)] dark:border-white/12 dark:bg-white/[0.04] dark:hover:bg-white/[0.08]", o),
 		onClick: (e) => {
-			let t = a(v);
-			h || _(t), l?.(t), d?.(e);
+			let t = a(S, p);
+			y || x(t), u?.(t), l?.(t === !0), h?.(e);
 		},
-		...p,
-		children: f ?? /* @__PURE__ */ i("span", {
+		..._,
+		children: g ?? /* @__PURE__ */ i("span", {
 			className: "flex items-center justify-center",
-			children: v === "indeterminate" ? /* @__PURE__ */ i(r, { className: "size-3.5" }) : v ? /* @__PURE__ */ i(n, { className: "size-3.5" }) : null
+			children: S === "indeterminate" ? /* @__PURE__ */ i(r, { className: "size-3.5" }) : S ? /* @__PURE__ */ i(n, { className: "size-3.5" }) : null
 		})
 	});
 });

package/dist/components/ui/collapse/index.cjs

@@ -1 +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({open:e,defaultOpen:r,onOpenChange:a,onToggle:o,className:s,children:c,...l}){let u=e!==void 0,[d,f]=n.useState(r??!1),p=u?e:d;return(0,i.jsx)(`details`,{"data-slot":`collapse`,className:t.cn(`group rounded-[var(--aui-card-radius,var(--radius-xl))] border border-[color:var(--aui-card-border,var(--border))] bg-card text-card-foreground shadow-[var(--aui-card-shadow,var(--aui-control-shadow,none))] transition-[background-color,border-color,box-shadow] open:border-[color:var(--aui-control-hover-border,var(--ring))]`,s),onToggle:e=>{o?.(e);let t=e.currentTarget.open;u||f(t),a?.(t)},open:p,...l,children:c})}function o({icon:e,hideIcon:n=!1,className:a,children:o,...s}){return(0,i.jsxs)(`summary`,{"data-slot":`collapse-trigger`,className:t.cn(`flex cursor-pointer list-none items-center justify-between gap-3 rounded-[calc(var(--aui-card-radius,var(--radius-xl))-1px)] px-4 py-3 text-sm font-semibold outline-none transition-[background-color,color,box-shadow] hover:bg-[color:var(--aui-control-surface-hover,var(--muted))] focus-visible:shadow-[0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] group-open:text-foreground [&::-webkit-details-marker]:hidden`,a),...s,children:[(0,i.jsx)(`span`,{className:`min-w-0 flex-1`,children:o}),!n&&(0,i.jsx)(`span`,{className:`shrink-0 rounded-md text-muted-foreground transition-[color,transform] group-open:rotate-180 group-open:text-foreground`,children:e??(0,i.jsx)(r.ChevronDownIcon,{className:`size-4`})})]})}function s({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`collapse-content`,className:t.cn(`border-t border-[color:var(--aui-card-border,var(--border))] px-4 py-3 text-sm leading-6 text-muted-foreground`,e),...n})}function c({items:e,type:r=`multiple`,value:c,defaultValue:l,onValueChange:u,className:d,...f}){let p=n.useMemo(()=>c===void 0?l===void 0?r===`single`?``:[]:l:c,[l,r,c]),[m,h]=n.useState(p),g=c??m,_=e=>Array.isArray(g)?g.includes(e):g===e,v=(e,t)=>{let n=r===`single`?t?e:``:t?Array.from(new Set([...Array.isArray(g)?g:[],e])):Array.isArray(g)?g.filter(t=>t!==e):[];c===void 0&&h(n),u?.(n)};return(0,i.jsx)(`div`,{"data-slot":`collapse-group`,className:t.cn(`grid gap-2.5`,d),...f,children:e.map(e=>(0,i.jsxs)(a,{open:_(e.key),onOpenChange:t=>v(e.key,t),className:t.cn(e.disabled&&`pointer-events-none opacity-60`),children:[(0,i.jsx)(o,{children:(0,i.jsxs)(`span`,{className:`grid gap-0.5`,children:[(0,i.jsx)(`span`,{children:e.title}),e.description&&(0,i.jsx)(`span`,{className:`text-xs font-normal text-muted-foreground`,children:e.description})]})}),(0,i.jsx)(s,{children:e.content})]},e.key))})}exports.Collapse=a,exports.CollapseContent=s,exports.CollapseGroup=c,exports.CollapseTrigger=o;
+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({open:e,defaultOpen:r,onOpenChange:a,onToggle:o,className:s,children:c,variant:l=`default`,size:u=`md`,...d}){let f=e!==void 0,[p,m]=n.useState(r??!1),h=f?e:p;return(0,i.jsx)(`details`,{"data-slot":`collapse`,"data-variant":l,"data-size":u,className:t.cn(`group overflow-hidden rounded-[var(--aui-card-radius,var(--radius-xl))] border border-[color:var(--aui-card-border,var(--border))] bg-card text-card-foreground shadow-[var(--aui-card-shadow,var(--aui-control-shadow,none))] transition-[background-color,border-color,box-shadow] hover:border-[color:var(--aui-control-hover-border,var(--ring))] open:border-[color:var(--aui-control-hover-border,var(--ring))] data-[variant=soft]:bg-[color:color-mix(in_oklch,var(--muted),transparent_58%)] data-[variant=soft]:shadow-none data-[variant=ghost]:border-transparent data-[variant=ghost]:bg-transparent data-[variant=ghost]:shadow-none`,s),onToggle:e=>{o?.(e);let t=e.currentTarget.open;f?t!==h&&(e.currentTarget.open=h):m(t),a?.(t)},open:h,...d,children:c})}function o({icon:e,hideIcon:n=!1,size:a=`md`,inset:o=!1,indicatorPosition:s=`end`,className:c,children:l,onClick:u,...d}){let f=n?null:(0,i.jsx)(`span`,{className:`shrink-0 rounded-md text-muted-foreground transition-[color,transform] group-open:rotate-180 group-open:text-foreground`,children:e??(0,i.jsx)(r.ChevronDownIcon,{className:`size-4`})});return(0,i.jsxs)(`summary`,{"data-slot":`collapse-trigger`,"data-size":a,"data-inset":o||void 0,"data-indicator-position":s,className:t.cn(`rounded-[calc(var(--aui-card-radius,var(--radius-xl))-1px)] group-open:rounded-b-none flex cursor-pointer list-none items-start gap-3 px-4 text-sm font-semibold outline-none transition-[background-color,color,box-shadow,border-radius] hover:bg-[color:var(--aui-control-surface-hover,var(--muted))] focus-visible:bg-[color:var(--aui-control-surface-hover,var(--muted))] focus-visible:shadow-[0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] group-open:text-foreground data-[indicator-position=end]:justify-between data-[indicator-position=start]:justify-start data-[size=sm]:py-2.5 data-[size=md]:py-3.5 data-[size=lg]:py-4.5 data-[inset=true]:px-5 [&::-webkit-details-marker]:hidden`,d[`aria-disabled`]&&`cursor-not-allowed opacity-75 hover:bg-transparent`,c),onClick:e=>{if(d[`aria-disabled`]){e.preventDefault();return}u?.(e)},...d,children:[s===`start`?f:null,(0,i.jsx)(`span`,{className:`min-w-0 flex-1`,children:l}),s===`end`?f:null]})}function s({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`collapse-content`,className:t.cn(`border-t border-[color:var(--aui-card-border,var(--border))] bg-[color:color-mix(in_oklch,var(--muted),transparent_70%)] px-4 py-3.5 text-sm leading-6 text-muted-foreground`,e),...n})}function c({items:e,type:r=`multiple`,value:c,defaultValue:l,onValueChange:u,variant:d=`default`,size:f=`md`,className:p,...m}){let h=n.useMemo(()=>c===void 0?l===void 0?r===`single`?``:[]:l:c,[l,r,c]),[g,_]=n.useState(h),v=c??g,y=e=>Array.isArray(v)?v.includes(e):v===e,b=(e,t)=>{let n=r===`single`?t?e:``:t?Array.from(new Set([...Array.isArray(v)?v:[],e])):Array.isArray(v)?v.filter(t=>t!==e):[];c===void 0&&_(n),u?.(n)};return(0,i.jsx)(`div`,{"data-slot":`collapse-group`,className:t.cn(`grid gap-2.5`,p),...m,children:e.map(e=>(0,i.jsxs)(a,{open:y(e.key),onOpenChange:t=>{e.disabled||b(e.key,t)},variant:d,size:f,className:t.cn(e.disabled&&`pointer-events-none opacity-60`),children:[(0,i.jsx)(o,{size:f,icon:e.icon,indicatorPosition:e.indicatorPosition,className:e.triggerClassName,"aria-disabled":e.disabled||void 0,title:typeof e.disabledReason==`string`?e.disabledReason:void 0,children:(0,i.jsxs)(`span`,{className:`grid min-w-0 gap-0.5`,children:[(0,i.jsxs)(`span`,{className:`flex min-w-0 items-center gap-2`,children:[(0,i.jsx)(`span`,{className:`truncate`,children:e.title}),e.badge?(0,i.jsx)(`span`,{className:`shrink-0`,children:e.badge}):null,e.meta?(0,i.jsx)(`span`,{className:`ml-auto shrink-0 text-[11px] font-medium text-muted-foreground`,children:e.meta}):null]}),e.description&&(0,i.jsx)(`span`,{className:`text-xs font-normal text-muted-foreground`,children:e.description}),e.disabled&&e.disabledReason?(0,i.jsx)(`span`,{className:`text-[11px] font-medium text-muted-foreground`,children:e.disabledReason}):null]})}),(0,i.jsx)(s,{className:e.contentClassName,children:e.content})]},e.key))})}exports.Collapse=a,exports.CollapseContent=s,exports.CollapseGroup=c,exports.CollapseTrigger=o;

package/dist/components/ui/collapse/index.d.ts

@@ -3,20 +3,32 @@ export type CollapseProps = React.ComponentProps<"details"> & {
     defaultOpen?: boolean;
     open?: boolean;
     onOpenChange?: (open: boolean) => void;
+    variant?: "default" | "soft" | "ghost";
+    size?: "sm" | "md" | "lg";
 };
-declare function Collapse({ open, defaultOpen, onOpenChange, onToggle, className, children, ...props }: CollapseProps): React.JSX.Element;
+declare function Collapse({ open, defaultOpen, onOpenChange, onToggle, className, children, variant, size, ...props }: CollapseProps): React.JSX.Element;
 export type CollapseTriggerProps = React.ComponentProps<"summary"> & {
     icon?: React.ReactNode;
     hideIcon?: boolean;
+    size?: "sm" | "md" | "lg";
+    inset?: boolean;
+    indicatorPosition?: "start" | "end";
 };
-declare function CollapseTrigger({ icon, hideIcon, className, children, ...props }: CollapseTriggerProps): React.JSX.Element;
+declare function CollapseTrigger({ icon, hideIcon, size, inset, indicatorPosition, className, children, onClick, ...props }: CollapseTriggerProps): React.JSX.Element;
 declare function CollapseContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
 export type CollapseItem = {
     key: string;
     title: React.ReactNode;
     content: React.ReactNode;
     description?: React.ReactNode;
+    meta?: React.ReactNode;
+    badge?: React.ReactNode;
     disabled?: boolean;
+    disabledReason?: React.ReactNode;
+    icon?: React.ReactNode;
+    indicatorPosition?: CollapseTriggerProps["indicatorPosition"];
+    triggerClassName?: string;
+    contentClassName?: string;
 };
 export type CollapseGroupProps = React.ComponentProps<"div"> & {
     items: CollapseItem[];
@@ -24,6 +36,8 @@ export type CollapseGroupProps = React.ComponentProps<"div"> & {
     value?: string | string[];
     defaultValue?: string | string[];
     onValueChange?: (value: string | string[]) => void;
+    variant?: CollapseProps["variant"];
+    size?: CollapseTriggerProps["size"];
 };
-declare function CollapseGroup({ items, type, value, defaultValue, onValueChange, className, ...props }: CollapseGroupProps): React.JSX.Element;
+declare function CollapseGroup({ items, type, value, defaultValue, onValueChange, variant, size, className, ...props }: CollapseGroupProps): React.JSX.Element;
 export { Collapse, CollapseContent, CollapseGroup, CollapseTrigger };

package/dist/components/ui/collapse/index.js

@@ -3,66 +3,121 @@ import * as t from "react";
 import { ChevronDownIcon as n } from "lucide-react";
 import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/components/ui/collapse/index.tsx
-function a({ open: n, defaultOpen: i, onOpenChange: a, onToggle: o, className: s, children: c, ...l }) {
-	let u = n !== void 0, [d, f] = t.useState(i ?? !1), p = u ? n : d;
+function a({ open: n, defaultOpen: i, onOpenChange: a, onToggle: o, className: s, children: c, variant: l = "default", size: u = "md", ...d }) {
+	let f = n !== void 0, [p, m] = t.useState(i ?? !1), h = f ? n : p;
 	return /* @__PURE__ */ r("details", {
 		"data-slot": "collapse",
-		className: e("group rounded-[var(--aui-card-radius,var(--radius-xl))] border border-[color:var(--aui-card-border,var(--border))] bg-card text-card-foreground shadow-[var(--aui-card-shadow,var(--aui-control-shadow,none))] transition-[background-color,border-color,box-shadow] open:border-[color:var(--aui-control-hover-border,var(--ring))]", s),
+		"data-variant": l,
+		"data-size": u,
+		className: e("group overflow-hidden rounded-[var(--aui-card-radius,var(--radius-xl))] border border-[color:var(--aui-card-border,var(--border))] bg-card text-card-foreground shadow-[var(--aui-card-shadow,var(--aui-control-shadow,none))] transition-[background-color,border-color,box-shadow] hover:border-[color:var(--aui-control-hover-border,var(--ring))] open:border-[color:var(--aui-control-hover-border,var(--ring))] data-[variant=soft]:bg-[color:color-mix(in_oklch,var(--muted),transparent_58%)] data-[variant=soft]:shadow-none data-[variant=ghost]:border-transparent data-[variant=ghost]:bg-transparent data-[variant=ghost]:shadow-none", s),
 		onToggle: (e) => {
 			o?.(e);
 			let t = e.currentTarget.open;
-			u || f(t), a?.(t);
+			f ? t !== h && (e.currentTarget.open = h) : m(t), a?.(t);
 		},
-		open: p,
-		...l,
+		open: h,
+		...d,
 		children: c
 	});
 }
-function o({ icon: t, hideIcon: a = !1, className: o, children: s, ...c }) {
+function o({ icon: t, hideIcon: a = !1, size: o = "md", inset: s = !1, indicatorPosition: c = "end", className: l, children: u, onClick: d, ...f }) {
+	let p = a ? null : /* @__PURE__ */ r("span", {
+		className: "shrink-0 rounded-md text-muted-foreground transition-[color,transform] group-open:rotate-180 group-open:text-foreground",
+		children: t ?? /* @__PURE__ */ r(n, { className: "size-4" })
+	});
 	return /* @__PURE__ */ i("summary", {
 		"data-slot": "collapse-trigger",
-		className: e("flex cursor-pointer list-none items-center justify-between gap-3 rounded-[calc(var(--aui-card-radius,var(--radius-xl))-1px)] px-4 py-3 text-sm font-semibold outline-none transition-[background-color,color,box-shadow] hover:bg-[color:var(--aui-control-surface-hover,var(--muted))] focus-visible:shadow-[0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] group-open:text-foreground [&::-webkit-details-marker]:hidden", o),
-		...c,
-		children: [/* @__PURE__ */ r("span", {
-			className: "min-w-0 flex-1",
-			children: s
-		}), !a && /* @__PURE__ */ r("span", {
-			className: "shrink-0 rounded-md text-muted-foreground transition-[color,transform] group-open:rotate-180 group-open:text-foreground",
-			children: t ?? /* @__PURE__ */ r(n, { className: "size-4" })
-		})]
+		"data-size": o,
+		"data-inset": s || void 0,
+		"data-indicator-position": c,
+		className: e("rounded-[calc(var(--aui-card-radius,var(--radius-xl))-1px)] group-open:rounded-b-none flex cursor-pointer list-none items-start gap-3 px-4 text-sm font-semibold outline-none transition-[background-color,color,box-shadow,border-radius] hover:bg-[color:var(--aui-control-surface-hover,var(--muted))] focus-visible:bg-[color:var(--aui-control-surface-hover,var(--muted))] focus-visible:shadow-[0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] group-open:text-foreground data-[indicator-position=end]:justify-between data-[indicator-position=start]:justify-start data-[size=sm]:py-2.5 data-[size=md]:py-3.5 data-[size=lg]:py-4.5 data-[inset=true]:px-5 [&::-webkit-details-marker]:hidden", f["aria-disabled"] && "cursor-not-allowed opacity-75 hover:bg-transparent", l),
+		onClick: (e) => {
+			if (f["aria-disabled"]) {
+				e.preventDefault();
+				return;
+			}
+			d?.(e);
+		},
+		...f,
+		children: [
+			c === "start" ? p : null,
+			/* @__PURE__ */ r("span", {
+				className: "min-w-0 flex-1",
+				children: u
+			}),
+			c === "end" ? p : null
+		]
 	});
 }
 function s({ className: t, ...n }) {
 	return /* @__PURE__ */ r("div", {
 		"data-slot": "collapse-content",
-		className: e("border-t border-[color:var(--aui-card-border,var(--border))] px-4 py-3 text-sm leading-6 text-muted-foreground", t),
+		className: e("border-t border-[color:var(--aui-card-border,var(--border))] bg-[color:color-mix(in_oklch,var(--muted),transparent_70%)] px-4 py-3.5 text-sm leading-6 text-muted-foreground", t),
 		...n
 	});
 }
-function c({ items: n, type: c = "multiple", value: l, defaultValue: u, onValueChange: d, className: f, ...p }) {
-	let m = t.useMemo(() => l === void 0 ? u === void 0 ? c === "single" ? "" : [] : u : l, [
+function c({ items: n, type: c = "multiple", value: l, defaultValue: u, onValueChange: d, variant: f = "default", size: p = "md", className: m, ...h }) {
+	let g = t.useMemo(() => l === void 0 ? u === void 0 ? c === "single" ? "" : [] : u : l, [
 		u,
 		c,
 		l
-	]), [h, g] = t.useState(m), _ = l ?? h, v = (e) => Array.isArray(_) ? _.includes(e) : _ === e, y = (e, t) => {
-		let n = c === "single" ? t ? e : "" : t ? Array.from(new Set([...Array.isArray(_) ? _ : [], e])) : Array.isArray(_) ? _.filter((t) => t !== e) : [];
-		l === void 0 && g(n), d?.(n);
+	]), [_, v] = t.useState(g), y = l ?? _, b = (e) => Array.isArray(y) ? y.includes(e) : y === e, x = (e, t) => {
+		let n = c === "single" ? t ? e : "" : t ? Array.from(new Set([...Array.isArray(y) ? y : [], e])) : Array.isArray(y) ? y.filter((t) => t !== e) : [];
+		l === void 0 && v(n), d?.(n);
 	};
 	return /* @__PURE__ */ r("div", {
 		"data-slot": "collapse-group",
-		className: e("grid gap-2.5", f),
-		...p,
+		className: e("grid gap-2.5", m),
+		...h,
 		children: n.map((t) => /* @__PURE__ */ i(a, {
-			open: v(t.key),
-			onOpenChange: (e) => y(t.key, e),
+			open: b(t.key),
+			onOpenChange: (e) => {
+				t.disabled || x(t.key, e);
+			},
+			variant: f,
+			size: p,
 			className: e(t.disabled && "pointer-events-none opacity-60"),
-			children: [/* @__PURE__ */ r(o, { children: /* @__PURE__ */ i("span", {
-				className: "grid gap-0.5",
-				children: [/* @__PURE__ */ r("span", { children: t.title }), t.description && /* @__PURE__ */ r("span", {
-					className: "text-xs font-normal text-muted-foreground",
-					children: t.description
-				})]
-			}) }), /* @__PURE__ */ r(s, { children: t.content })]
+			children: [/* @__PURE__ */ r(o, {
+				size: p,
+				icon: t.icon,
+				indicatorPosition: t.indicatorPosition,
+				className: t.triggerClassName,
+				"aria-disabled": t.disabled || void 0,
+				title: typeof t.disabledReason == "string" ? t.disabledReason : void 0,
+				children: /* @__PURE__ */ i("span", {
+					className: "grid min-w-0 gap-0.5",
+					children: [
+						/* @__PURE__ */ i("span", {
+							className: "flex min-w-0 items-center gap-2",
+							children: [
+								/* @__PURE__ */ r("span", {
+									className: "truncate",
+									children: t.title
+								}),
+								t.badge ? /* @__PURE__ */ r("span", {
+									className: "shrink-0",
+									children: t.badge
+								}) : null,
+								t.meta ? /* @__PURE__ */ r("span", {
+									className: "ml-auto shrink-0 text-[11px] font-medium text-muted-foreground",
+									children: t.meta
+								}) : null
+							]
+						}),
+						t.description && /* @__PURE__ */ r("span", {
+							className: "text-xs font-normal text-muted-foreground",
+							children: t.description
+						}),
+						t.disabled && t.disabledReason ? /* @__PURE__ */ r("span", {
+							className: "text-[11px] font-medium text-muted-foreground",
+							children: t.disabledReason
+						}) : null
+					]
+				})
+			}), /* @__PURE__ */ r(s, {
+				className: t.contentClassName,
+				children: t.content
+			})]
 		}, t.key))
 	});
 }

package/dist/components/ui/dialog/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../lib/utils.cjs"),n=require("../button/index.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("lucide-react"),a=require("react/jsx-runtime"),o=require("@base-ui/react/dialog");function s({...e}){return(0,a.jsx)(o.Dialog.Root,{"data-slot":`dialog`,...e})}function c({...e}){return(0,a.jsx)(o.Dialog.Trigger,{"data-slot":`dialog-trigger`,...e})}function l({...e}){return(0,a.jsx)(o.Dialog.Portal,{"data-slot":`dialog-portal`,...e})}function u({...e}){return(0,a.jsx)(o.Dialog.Close,{"data-slot":`dialog-close`,...e})}function d({className:e,...n}){return(0,a.jsx)(o.Dialog.Backdrop,{"data-slot":`dialog-overlay`,className:t.cn(`fixed inset-0 isolate z-50 bg-[color-mix(in_oklch,var(--foreground),transparent_80%)] duration-100 supports-backdrop-filter:backdrop-blur-md data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0`,e),...n})}function f({className:e,children:r,showCloseButton:s=!0,size:c=`md`,...u}){return(0,a.jsxs)(l,{children:[(0,a.jsx)(d,{}),(0,a.jsxs)(o.Dialog.Popup,{"data-slot":`dialog-content`,"data-size":c,className:t.cn(`fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-5 rounded-[var(--radius-3xl)] border p-6 text-sm text-popover-foreground backdrop-blur duration-100 outline-none data-[size=xs]:sm:max-w-sm data-[size=sm]:sm:max-w-md data-[size=md]:sm:max-w-lg data-[size=lg]:sm:max-w-2xl data-[size=xl]:sm:max-w-4xl data-[size=full]:h-[min(92vh,56rem)] data-[size=full]:max-w-[min(96vw,84rem)] data-[size=full]:grid-rows-[auto_1fr] data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95`,e),...u,children:[r,s&&(0,a.jsxs)(o.Dialog.Close,{"data-slot":`dialog-close`,render:(0,a.jsx)(n.Button,{variant:`ghost`,className:`absolute top-3 right-3 rounded-full border border-transparent hover:border-border/50 hover:bg-muted/50`,size:`icon-sm`}),children:[(0,a.jsx)(i.XIcon,{}),(0,a.jsx)(`span`,{className:`sr-only`,children:`Close`})]})]})]})}function p({className:e,...n}){return(0,a.jsx)(`div`,{"data-slot":`dialog-header`,className:t.cn(`flex flex-col gap-2.5`,e),...n})}function m({className:e,showCloseButton:r=!1,children:i,...s}){return(0,a.jsxs)(`div`,{"data-slot":`dialog-footer`,className:t.cn(`-mx-6 -mb-6 flex flex-col-reverse gap-2 rounded-b-[var(--radius-3xl)] border-t p-5 sm:flex-row sm:justify-end`,e),...s,children:[i,r&&(0,a.jsx)(o.Dialog.Close,{render:(0,a.jsx)(n.Button,{variant:`outline`}),children:`Close`})]})}function h({className:e,...n}){return(0,a.jsx)(o.Dialog.Title,{"data-slot":`dialog-title`,className:t.cn(`font-heading text-xl leading-tight font-semibold tracking-tight`,e),...n})}function g({className:e,...n}){return(0,a.jsx)(o.Dialog.Description,{"data-slot":`dialog-description`,className:t.cn(`text-sm leading-6 text-muted-foreground *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground`,e),...n})}exports.Dialog=s,exports.DialogClose=u,exports.DialogContent=f,exports.DialogDescription=g,exports.DialogFooter=m,exports.DialogHeader=p,exports.DialogOverlay=d,exports.DialogPortal=l,exports.DialogTitle=h,exports.DialogTrigger=c;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../lib/utils.cjs"),n=require("../button/index.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("lucide-react"),a=require("react/jsx-runtime"),o=require("@base-ui/react/dialog");function s({...e}){return(0,a.jsx)(o.Dialog.Root,{"data-slot":`dialog`,...e})}function c({...e}){return(0,a.jsx)(o.Dialog.Trigger,{"data-slot":`dialog-trigger`,...e})}function l({...e}){return(0,a.jsx)(o.Dialog.Portal,{"data-slot":`dialog-portal`,...e})}function u({...e}){return(0,a.jsx)(o.Dialog.Close,{"data-slot":`dialog-close`,...e})}function d({className:e,...n}){return(0,a.jsx)(o.Dialog.Backdrop,{"data-slot":`dialog-overlay`,className:t.cn(`fixed inset-0 isolate z-50 bg-[color-mix(in_oklch,var(--foreground),transparent_80%)] duration-100 supports-backdrop-filter:backdrop-blur-md data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0`,e),...n})}function f({className:e,children:r,showCloseButton:s=!0,size:c=`md`,surface:u=`default`,...f}){return(0,a.jsxs)(l,{children:[(0,a.jsx)(d,{}),(0,a.jsxs)(o.Dialog.Popup,{"data-slot":`dialog-content`,"data-size":c,"data-surface":u,role:`dialog`,className:t.cn(`fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-5 overflow-hidden rounded-[var(--radius-3xl)] border border-[color:var(--aui-card-border,var(--border))] bg-[color:var(--aui-overlay-surface,var(--popover))] p-6 text-sm text-popover-foreground shadow-[var(--aui-control-panel-shadow,0_24px_70px_rgba(15,23,42,0.22))] backdrop-blur duration-100 outline-none data-[surface=plain]:overflow-visible data-[surface=plain]:border-transparent data-[surface=plain]:bg-transparent data-[surface=plain]:p-0 data-[surface=plain]:shadow-none data-[size=xs]:sm:max-w-sm data-[size=sm]:sm:max-w-md data-[size=md]:sm:max-w-lg data-[size=lg]:sm:max-w-2xl data-[size=xl]:sm:max-w-4xl data-[size=full]:h-[min(92vh,56rem)] data-[size=full]:max-w-[min(96vw,84rem)] data-[size=full]:grid-rows-[auto_minmax(0,1fr)] data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95`,e),...f,children:[r,s&&(0,a.jsxs)(o.Dialog.Close,{"data-slot":`dialog-close`,render:(0,a.jsx)(n.Button,{variant:`ghost`,className:`absolute top-3 right-3 rounded-full border border-transparent hover:border-border/50 hover:bg-muted/50`,size:`icon-sm`}),children:[(0,a.jsx)(i.XIcon,{}),(0,a.jsx)(`span`,{className:`sr-only`,children:`Close`})]})]})]})}function p({className:e,...n}){return(0,a.jsx)(`div`,{"data-slot":`dialog-header`,className:t.cn(`flex flex-col gap-2.5`,e),...n})}function m({className:e,showCloseButton:r=!1,children:i,...s}){return(0,a.jsxs)(`div`,{"data-slot":`dialog-footer`,className:t.cn(`-mx-6 -mb-6 flex flex-col-reverse gap-2 border-t border-border/70 bg-muted/20 p-5 sm:flex-row sm:justify-end`,e),...s,children:[i,r&&(0,a.jsx)(o.Dialog.Close,{render:(0,a.jsx)(n.Button,{variant:`outline`}),children:`Close`})]})}function h({className:e,...n}){return(0,a.jsx)(o.Dialog.Title,{"data-slot":`dialog-title`,className:t.cn(`font-heading text-xl leading-tight font-semibold tracking-tight`,e),...n})}function g({className:e,...n}){return(0,a.jsx)(o.Dialog.Description,{"data-slot":`dialog-description`,className:t.cn(`text-sm leading-6 text-muted-foreground *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground`,e),...n})}exports.Dialog=s,exports.DialogClose=u,exports.DialogContent=f,exports.DialogDescription=g,exports.DialogFooter=m,exports.DialogHeader=p,exports.DialogOverlay=d,exports.DialogPortal=l,exports.DialogTitle=h,exports.DialogTrigger=c;

package/dist/components/ui/dialog/index.d.ts

@@ -8,6 +8,7 @@ export type DialogOverlayProps = DialogPrimitive.Backdrop.Props;
 export type DialogPopupProps = DialogPrimitive.Popup.Props & {
     showCloseButton?: boolean;
     size?: "xs" | "sm" | "md" | "lg" | "xl" | "full";
+    surface?: "default" | "plain";
 };
 export type DialogHeaderProps = React.ComponentProps<"div">;
 export type DialogFooterProps = React.ComponentProps<"div"> & {
@@ -20,7 +21,7 @@ declare function DialogTrigger({ ...props }: DialogTriggerProps): React.JSX.Elem
 declare function DialogPortal({ ...props }: DialogPortalProps): React.JSX.Element;
 declare function DialogClose({ ...props }: DialogCloseProps): React.JSX.Element;
 declare function DialogOverlay({ className, ...props }: DialogOverlayProps): React.JSX.Element;
-declare function DialogContent({ className, children, showCloseButton, size, ...props }: DialogPopupProps): React.JSX.Element;
+declare function DialogContent({ className, children, showCloseButton, size, surface, ...props }: DialogPopupProps): React.JSX.Element;
 declare function DialogHeader({ className, ...props }: DialogHeaderProps): React.JSX.Element;
 declare function DialogFooter({ className, showCloseButton, children, ...props }: DialogFooterProps): React.JSX.Element;
 declare function DialogTitle({ className, ...props }: DialogTitleProps): React.JSX.Element;

package/dist/components/ui/dialog/index.js

@@ -36,12 +36,14 @@ function u({ className: t, ...n }) {
 		...n
 	});
 }
-function d({ className: o, children: s, showCloseButton: l = !0, size: d = "md", ...f }) {
+function d({ className: o, children: s, showCloseButton: l = !0, size: d = "md", surface: f = "default", ...p }) {
 	return /* @__PURE__ */ i(c, { children: [/* @__PURE__ */ r(u, {}), /* @__PURE__ */ i(a.Popup, {
 		"data-slot": "dialog-content",
 		"data-size": d,
-		className: e("fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-5 rounded-[var(--radius-3xl)] border p-6 text-sm text-popover-foreground backdrop-blur duration-100 outline-none data-[size=xs]:sm:max-w-sm data-[size=sm]:sm:max-w-md data-[size=md]:sm:max-w-lg data-[size=lg]:sm:max-w-2xl data-[size=xl]:sm:max-w-4xl data-[size=full]:h-[min(92vh,56rem)] data-[size=full]:max-w-[min(96vw,84rem)] data-[size=full]:grid-rows-[auto_1fr] data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", o),
-		...f,
+		"data-surface": f,
+		role: "dialog",
+		className: e("fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-5 overflow-hidden rounded-[var(--radius-3xl)] border border-[color:var(--aui-card-border,var(--border))] bg-[color:var(--aui-overlay-surface,var(--popover))] p-6 text-sm text-popover-foreground shadow-[var(--aui-control-panel-shadow,0_24px_70px_rgba(15,23,42,0.22))] backdrop-blur duration-100 outline-none data-[surface=plain]:overflow-visible data-[surface=plain]:border-transparent data-[surface=plain]:bg-transparent data-[surface=plain]:p-0 data-[surface=plain]:shadow-none data-[size=xs]:sm:max-w-sm data-[size=sm]:sm:max-w-md data-[size=md]:sm:max-w-lg data-[size=lg]:sm:max-w-2xl data-[size=xl]:sm:max-w-4xl data-[size=full]:h-[min(92vh,56rem)] data-[size=full]:max-w-[min(96vw,84rem)] data-[size=full]:grid-rows-[auto_minmax(0,1fr)] data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", o),
+		...p,
 		children: [s, l && /* @__PURE__ */ i(a.Close, {
 			"data-slot": "dialog-close",
 			render: /* @__PURE__ */ r(t, {
@@ -66,7 +68,7 @@ function f({ className: t, ...n }) {
 function p({ className: n, showCloseButton: o = !1, children: s, ...c }) {
 	return /* @__PURE__ */ i("div", {
 		"data-slot": "dialog-footer",
-		className: e("-mx-6 -mb-6 flex flex-col-reverse gap-2 rounded-b-[var(--radius-3xl)] border-t p-5 sm:flex-row sm:justify-end", n),
+		className: e("-mx-6 -mb-6 flex flex-col-reverse gap-2 border-t border-border/70 bg-muted/20 p-5 sm:flex-row sm:justify-end", n),
 		...c,
 		children: [s, o && /* @__PURE__ */ r(a.Close, {
 			render: /* @__PURE__ */ r(t, { variant: "outline" }),