tembro 2.0.6 → 2.1.1

package/dist/components/data-table/data-table-column-visibility-menu.js

@@ -8,27 +8,55 @@ import { jsx as l, jsxs as u } from "react/jsx-runtime";
 function d(e) {
 	return e.replace(/_/g, " ").replace(/-/g, " ").replace(/\b\w/g, (e) => e.toUpperCase());
 }
-function f({ table: f, label: p = "Columns", triggerLabel: m, align: h = "end", side: g = "bottom", triggerClassName: _, contentClassName: v, getColumnLabel: y = d }) {
-	let b = f.getAllLeafColumns().filter((e) => e.getCanHide());
+function f({ table: f, label: p = "Columns", triggerLabel: m, align: h = "end", side: g = "bottom", triggerClassName: _, contentClassName: v, emptyLabel: y = "No hideable columns", showCount: b = !0, triggerAriaLabel: x, getColumnLabel: S = d }) {
+	let C = f.getAllLeafColumns().filter((e) => e.getCanHide()), w = C.filter((e) => e.getIsVisible()).length;
 	return /* @__PURE__ */ u(n, { children: [/* @__PURE__ */ u(s, {
 		render: /* @__PURE__ */ l(t, {
 			type: "button",
 			variant: "outline",
 			size: "sm",
-			className: e("border-border/80 bg-background/94 shadow-[0_1px_0_rgba(255,255,255,0.06)]", _)
+			"aria-label": x ?? "Choose visible columns",
+			className: e("min-w-0 border-border/80 bg-background/94 px-2.5 shadow-[0_1px_0_rgba(255,255,255,0.06)] hover:border-border hover:bg-accent/70", _)
 		}),
-		children: [/* @__PURE__ */ l(c, { "data-icon": "inline-start" }), m ?? p]
+		children: [
+			/* @__PURE__ */ l(c, {
+				"data-icon": "inline-start",
+				className: "size-4 shrink-0"
+			}),
+			/* @__PURE__ */ l("span", {
+				className: "truncate",
+				children: m ?? p
+			}),
+			b && C.length > 0 ? /* @__PURE__ */ u("span", {
+				className: "ml-0.5 rounded-[var(--radius-sm)] bg-muted px-1.5 py-0.5 text-[11px] font-medium text-muted-foreground",
+				children: [
+					w,
+					"/",
+					C.length
+				]
+			}) : null
+		]
 	}), /* @__PURE__ */ u(i, {
 		align: h,
 		side: g,
-		className: e("min-w-48 rounded-[var(--radius-2xl)] border-border/80 bg-popover/98 shadow-[0_24px_80px_rgba(15,23,42,0.18)] backdrop-blur", v),
+		className: e("max-h-[min(24rem,var(--radix-dropdown-menu-content-available-height,24rem))] min-w-56 overflow-y-auto rounded-[var(--radius-lg)] border-border/80 bg-popover/98 p-1 shadow-[0_24px_80px_rgba(15,23,42,0.18)] backdrop-blur", v),
 		children: [
-			/* @__PURE__ */ l(a, { children: p }),
+			/* @__PURE__ */ u(a, {
+				className: "flex items-center justify-between gap-3",
+				children: [/* @__PURE__ */ l("span", { children: p }), b ? /* @__PURE__ */ u("span", {
+					className: "text-xs font-normal text-muted-foreground",
+					children: [w, " visible"]
+				}) : null]
+			}),
 			/* @__PURE__ */ l(o, {}),
-			b.map((e) => /* @__PURE__ */ l(r, {
+			C.length === 0 ? /* @__PURE__ */ l(a, {
+				className: "py-3 text-sm font-normal text-muted-foreground",
+				children: y
+			}) : null,
+			C.map((e) => /* @__PURE__ */ l(r, {
 				checked: e.getIsVisible(),
 				onCheckedChange: (t) => e.toggleVisibility(!!t),
-				children: y(e.id)
+				children: S(e.id)
 			}, e.id))
 		]
 	})] });

package/dist/components/data-table/data-table-toolbar.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)(`flex flex-col`,{variants:{variant:{default:``,plain:`border-transparent bg-transparent shadow-none`,soft:`rounded-[var(--aui-card-radius,var(--radius-lg))] border border-[color:var(--aui-card-border,var(--border))] bg-[color:color-mix(in_oklch,var(--card),var(--background)_16%)] shadow-[var(--aui-card-shadow,var(--aui-control-shadow,none))]`},density:{compact:`gap-3 p-3`,default:`gap-4 p-4 md:p-5`,comfortable:`gap-5 p-5 md:p-6`}},defaultVariants:{variant:`plain`,density:`default`}});function o({className:e,variant:n,density:r,title:o,description:s,search:c,filters:l,summary:u,actions:d,selectionActions:f,selectedCount:p=0,totalCount:m,selectedLabel:h=(e,t)=>t===void 0?`${e} selected`:`${e} of ${t} selected`,titleClassName:g,descriptionClassName:_,searchClassName:v,filtersClassName:y,summaryClassName:b,actionsClassName:x,children:S,...C}){let w=!!(o||s),T=p>0&&!!f,E=!!(c||l||S);return(0,i.jsxs)(`div`,{"data-slot":`data-table-toolbar`,"data-variant":n??`plain`,"data-density":r??`default`,className:t.cn(a({variant:n,density:r}),e),...C,children:[(w||d)&&(0,i.jsxs)(`div`,{className:`flex flex-col gap-3 xl:flex-row xl:items-start xl:justify-between`,children:[w&&(0,i.jsxs)(`div`,{className:`grid gap-1`,children:[o&&(0,i.jsx)(`h2`,{className:t.cn(`text-lg font-semibold tracking-tight text-foreground`,g),children:o}),s&&(0,i.jsx)(`p`,{className:t.cn(`text-sm leading-6 text-muted-foreground`,_),children:s})]}),d&&(0,i.jsx)(`div`,{className:t.cn(`flex min-w-0 shrink-0 flex-wrap items-center gap-2 xl:justify-end`,x),children:d})]}),(E||u||T)&&(0,i.jsxs)(`div`,{className:`flex flex-col gap-3 xl:flex-row xl:items-start xl:justify-between`,children:[(0,i.jsxs)(`div`,{className:`flex min-w-0 flex-1 flex-col gap-3`,children:[E&&(0,i.jsxs)(`div`,{className:`flex min-w-0 flex-1 flex-col gap-2 lg:flex-row lg:flex-wrap lg:items-center`,children:[c?(0,i.jsx)(`div`,{className:t.cn(`min-w-[16rem] max-w-xl flex-1`,v),children:c}):null,l?(0,i.jsx)(`div`,{className:t.cn(`flex min-w-0 flex-1 flex-wrap items-center gap-2`,y),children:l}):null,S]}),u?(0,i.jsx)(`div`,{"data-slot":`data-table-summary`,className:t.cn(`flex flex-wrap items-center gap-2 text-sm text-muted-foreground`,b),children:u}):null]}),T&&(0,i.jsxs)(`div`,{"data-slot":`data-table-selection-bar`,className:`flex shrink-0 flex-wrap items-center gap-2 rounded-[var(--radius-md)] border border-[color:var(--aui-control-border-strong,var(--border))] bg-[color:var(--aui-control-surface,var(--background))] px-2.5 py-1.5 text-sm shadow-[var(--aui-control-shadow,none)] backdrop-blur`,children:[(0,i.jsx)(`span`,{className:`text-muted-foreground`,children:h(p,m)}),f]})]})]})}exports.DataTableToolbar=o,exports.dataTableToolbarVariants=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)(`flex flex-col`,{variants:{variant:{default:``,plain:`border-transparent bg-transparent shadow-none`,soft:`rounded-[var(--aui-card-radius,var(--radius-lg))] border border-[color:var(--aui-card-border,var(--border))] bg-[color:color-mix(in_oklch,var(--card),var(--background)_16%)] shadow-[var(--aui-card-shadow,var(--aui-control-shadow,none))]`},density:{compact:`gap-3 p-3`,default:`gap-4 p-4 md:p-5`,comfortable:`gap-5 p-5 md:p-6`}},defaultVariants:{variant:`plain`,density:`default`}});function o({className:e,variant:n,density:r,title:o,description:s,search:c,filters:l,summary:u,actions:d,selectionActions:f,selectedCount:p=0,totalCount:m,selectedLabel:h=(e,t)=>t===void 0?`${e} selected`:`${e} of ${t} selected`,titleClassName:g,descriptionClassName:_,searchClassName:v,filtersClassName:y,summaryClassName:b,actionsClassName:x,children:S,...C}){let w=!!(o||s),T=p>0&&!!f,E=!!(c||l||S);return(0,i.jsxs)(`div`,{"data-slot":`data-table-toolbar`,"data-variant":n??`plain`,"data-density":r??`default`,className:t.cn(a({variant:n,density:r}),e),...C,children:[(w||d)&&(0,i.jsxs)(`div`,{className:`flex flex-col gap-3 xl:flex-row xl:items-start xl:justify-between`,children:[w&&(0,i.jsxs)(`div`,{className:`grid gap-1`,children:[o&&(0,i.jsx)(`h2`,{className:t.cn(`text-lg font-semibold tracking-tight text-foreground`,g),children:o}),s&&(0,i.jsx)(`p`,{className:t.cn(`text-sm leading-6 text-muted-foreground`,_),children:s})]}),d&&(0,i.jsx)(`div`,{className:t.cn(`flex w-full min-w-0 flex-wrap items-center gap-2 sm:w-auto xl:shrink-0 xl:justify-end`,x),children:d})]}),(E||u||T)&&(0,i.jsxs)(`div`,{className:`flex flex-col gap-3 xl:flex-row xl:items-start xl:justify-between`,children:[(0,i.jsxs)(`div`,{className:`flex min-w-0 flex-1 flex-col gap-3`,children:[E&&(0,i.jsxs)(`div`,{className:`grid min-w-0 flex-1 gap-2 lg:grid-cols-[minmax(14rem,24rem)_minmax(0,1fr)] lg:items-start`,children:[c?(0,i.jsx)(`div`,{className:t.cn(`min-w-0 max-w-full`,v),children:c}):null,(0,i.jsxs)(`div`,{className:`flex min-w-0 flex-wrap items-center gap-2`,children:[l?(0,i.jsx)(`div`,{className:t.cn(`flex min-w-0 flex-1 flex-wrap items-center gap-2 [&>*]:min-w-0`,y),children:l}):null,S]})]}),u?(0,i.jsx)(`div`,{"data-slot":`data-table-summary`,className:t.cn(`flex flex-wrap items-center gap-2 text-sm text-muted-foreground`,b),children:u}):null]}),T&&(0,i.jsxs)(`div`,{"data-slot":`data-table-selection-bar`,className:`flex w-full shrink-0 flex-wrap items-center gap-2 rounded-[var(--radius-md)] border border-[color:var(--aui-control-border-strong,var(--border))] bg-[color:var(--aui-control-surface,var(--background))] px-2.5 py-1.5 text-sm shadow-[var(--aui-control-shadow,none)] backdrop-blur sm:w-auto`,children:[(0,i.jsx)(`span`,{className:`text-muted-foreground`,children:h(p,m)}),f]})]})]})}exports.DataTableToolbar=o,exports.dataTableToolbarVariants=a;

package/dist/components/data-table/data-table-toolbar.js

@@ -44,7 +44,7 @@ function a({ className: t, variant: a, density: o, title: s, description: c, sea
 					children: c
 				})]
 			}), f && /* @__PURE__ */ n("div", {
-				className: e("flex min-w-0 shrink-0 flex-wrap items-center gap-2 xl:justify-end", S),
+				className: e("flex w-full min-w-0 flex-wrap items-center gap-2 sm:w-auto xl:shrink-0 xl:justify-end", S),
 				children: f
 			})]
 		}), (D || d || E) && /* @__PURE__ */ r("div", {
@@ -52,18 +52,17 @@ function a({ className: t, variant: a, density: o, title: s, description: c, sea
 			children: [/* @__PURE__ */ r("div", {
 				className: "flex min-w-0 flex-1 flex-col gap-3",
 				children: [D && /* @__PURE__ */ r("div", {
-					className: "flex min-w-0 flex-1 flex-col gap-2 lg:flex-row lg:flex-wrap lg:items-center",
-					children: [
-						l ? /* @__PURE__ */ n("div", {
-							className: e("min-w-[16rem] max-w-xl flex-1", y),
-							children: l
-						}) : null,
-						u ? /* @__PURE__ */ n("div", {
-							className: e("flex min-w-0 flex-1 flex-wrap items-center gap-2", b),
+					className: "grid min-w-0 flex-1 gap-2 lg:grid-cols-[minmax(14rem,24rem)_minmax(0,1fr)] lg:items-start",
+					children: [l ? /* @__PURE__ */ n("div", {
+						className: e("min-w-0 max-w-full", y),
+						children: l
+					}) : null, /* @__PURE__ */ r("div", {
+						className: "flex min-w-0 flex-wrap items-center gap-2",
+						children: [u ? /* @__PURE__ */ n("div", {
+							className: e("flex min-w-0 flex-1 flex-wrap items-center gap-2 [&>*]:min-w-0", b),
 							children: u
-						}) : null,
-						C
-					]
+						}) : null, C]
+					})]
 				}), d ? /* @__PURE__ */ n("div", {
 					"data-slot": "data-table-summary",
 					className: e("flex flex-wrap items-center gap-2 text-sm text-muted-foreground", x),
@@ -71,7 +70,7 @@ function a({ className: t, variant: a, density: o, title: s, description: c, sea
 				}) : null]
 			}), E && /* @__PURE__ */ r("div", {
 				"data-slot": "data-table-selection-bar",
-				className: "flex shrink-0 flex-wrap items-center gap-2 rounded-[var(--radius-md)] border border-[color:var(--aui-control-border-strong,var(--border))] bg-[color:var(--aui-control-surface,var(--background))] px-2.5 py-1.5 text-sm shadow-[var(--aui-control-shadow,none)] backdrop-blur",
+				className: "flex w-full shrink-0 flex-wrap items-center gap-2 rounded-[var(--radius-md)] border border-[color:var(--aui-control-border-strong,var(--border))] bg-[color:var(--aui-control-surface,var(--background))] px-2.5 py-1.5 text-sm shadow-[var(--aui-control-shadow,none)] backdrop-blur sm:w-auto",
 				children: [/* @__PURE__ */ n("span", {
 					className: "text-muted-foreground",
 					children: g(m, h)

package/dist/components/display/carousel.cjs

@@ -1 +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");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:S=!1,playLabel:C=`Start autoplay`,pauseLabel:w=`Pause autoplay`,onAutoplayChange:T,viewportClassName:E,controlsClassName:D,dotsClassName:O,arrowClassName:k,dotClassName:A,activeDotClassName:j,className:M,children:N,...P}){let F=r.Children.toArray(N),[I,L]=r.useState(s),R=r.useRef(null),[z,B]=r.useState(!1),[V,H]=r.useState(!1),[U,W]=r.useState(v),G=e!==void 0,K=o(G?e:I,F.length,l);r.useEffect(()=>{W(v)},[v]);function q(e,t=`manual`){let n=o(e,F.length,l);G||L(n),t===`manual`&&x&&(H(!0),U&&(W(!1),T?.(!1))),c?.(n)}let J=l||K>0,Y=l||K<F.length-1;return r.useEffect(()=>{if(!U||F.length<=1||V||b&&z)return;let e=window.setInterval(()=>{if(!l&&K>=F.length-1){q(0,`autoplay`);return}q(K+1,`autoplay`)},y);return()=>{window.clearInterval(e)}},[K,U,y,V,z,F.length,l,b]),(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`,M),onKeyDown:e=>{!p||F.length<=1||(e.key===`ArrowLeft`&&J&&(e.preventDefault(),q(K-1)),e.key===`ArrowRight`&&Y&&(e.preventDefault(),q(K+1)))},onTouchStart:e=>{R.current=e.touches[0]?.clientX??null},onTouchEnd:e=>{if(R.current==null||F.length<=1)return;let t=(e.changedTouches[0]?.clientX??R.current)-R.current;R.current=null,!(Math.abs(t)<_)&&(t>0&&J&&q(K-1),t<0&&Y&&q(K+1))},onMouseEnter:()=>B(!0),onMouseLeave:()=>B(!1),...P,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`,E),children:[(0,a.jsx)(`div`,{className:`transition-transform duration-300 ease-out`,"aria-live":`polite`,children:F[K]}),f&&F.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`,k),disabled:!J,"aria-label":h,onClick:()=>q(K-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`,k),disabled:!Y,"aria-label":g,onClick:()=>q(K+1),children:(0,a.jsx)(i.ChevronRightIcon,{})})]}):null]}),d&&F.length>1&&(0,a.jsxs)(`div`,{className:t.cn(`flex flex-wrap items-center justify-center gap-2`,O),role:`tablist`,"aria-label":`${m} slides`,children:[F.map((e,n)=>(0,a.jsx)(`button`,{type:`button`,role:`tab`,"aria-label":`Go to slide ${n+1}`,"aria-selected":n===K,className:t.cn(`h-2.5 rounded-full bg-muted-foreground/30 transition-[width,background-color,opacity] hover:bg-muted-foreground/55`,n===K?t.cn(`w-7 bg-primary`,j):t.cn(`w-2.5`,A)),onClick:()=>q(n)},n)),S?(0,a.jsx)(n.Button,{type:`button`,variant:`ghost`,size:`sm`,className:t.cn(`ml-2 rounded-full`,D),onClick:()=>{let e=!U;H(!1),W(e),T?.(e)},children:U?w:C}):null]})]})}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;
+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:ee=`Previous slide`,nextLabel:te=`Next slide`,swipeThreshold:h=44,autoplay:g=!1,autoplayInterval:_=4500,pauseOnHover:v=!0,stopAutoplayOnInteraction:ne=!0,showPlaybackControl:y=!1,showStatus:b=!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:re,arrowClassName:M,dotClassName:ie,activeDotClassName:N,thumbnailsClassName:P,className:F,children:I,...L}){let R=r.Children.toArray(I),[z,B]=r.useState(s),V=r.useRef(null),H=r.useRef(null),[U,W]=r.useState(!1),[G,K]=r.useState(!1),[q,J]=r.useState(g),Y=e!==void 0,X=o(Y?e:z,R.length,l),ae=R[X];r.useEffect(()=>{J(g)},[g]);function Z(e,t=`manual`){let n=o(e,R.length,l);Y||B(n),t===`manual`&&ne&&(K(!0),q&&(J(!1),k?.(!1))),c?.(n)}let Q=l||X>0,$=l||X<R.length-1;return r.useEffect(()=>{if(!q||R.length<=1||G||v&&U)return;let e=window.setInterval(()=>{if(!l&&X>=R.length-1){Z(0,`autoplay`);return}Z(X+1,`autoplay`)},_);return()=>{window.clearInterval(e)}},[X,q,_,G,U,R.length,l,v]),(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`,F),onKeyDown:e=>{!p||R.length<=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(R.length-1)))},onTouchStart:e=>{V.current=e.touches[0]?.clientX??null},onTouchEnd:e=>{if(V.current==null||R.length<=1)return;let t=(e.changedTouches[0]?.clientX??V.current)-V.current;V.current=null,!(Math.abs(t)<h)&&(t>0&&Q&&Z(X-1),t<0&&$&&Z(X+1))},onPointerDown:e=>{!O||e.pointerType===`touch`||(H.current=e.clientX)},onPointerUp:e=>{if(!O||H.current==null||R.length<=1)return;let t=e.clientX-H.current;H.current=null,!(Math.abs(t)<h)&&(t>0&&Q&&Z(X-1),t<0&&$&&Z(X+1))},onMouseEnter:()=>W(!0),onMouseLeave:()=>W(!1),...L,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`,A),children:[b?(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:w?.(X,R.length)??`Slide ${X+1} / ${R.length}`}):null,(0,a.jsx)(`div`,{className:`transition-transform duration-300 ease-out`,"aria-live":`polite`,style:D?{aspectRatio:D}:void 0,children:R[X]}),f&&R.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`,M),disabled:!Q,"aria-label":ee,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`,M),disabled:!$,"aria-label":te,onClick:()=>Z(X+1),children:(0,a.jsx)(i.ChevronRightIcon,{})})]}):null]}),d&&R.length>1&&(0,a.jsxs)(`div`,{className:t.cn(`flex flex-wrap items-center justify-center gap-2`,re),role:`tablist`,"aria-label":`${m} slides`,children:[R.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`,N):t.cn(`w-2.5`,ie)),onClick:()=>Z(n)},n)),y?(0,a.jsx)(n.Button,{type:`button`,variant:`ghost`,size:`sm`,className:t.cn(`ml-2 rounded-full`,j),onClick:()=>{let e=!q;K(!1),J(e),k?.(e)},children:q?C:S}):null]}),x&&R.length>1?(0,a.jsx)(`div`,{className:t.cn(`grid grid-cols-2 gap-2 sm:grid-cols-4`,P),children:R.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:T?T(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,E?E(ae,X):null,(0,a.jsx)(`span`,{className:`sr-only`,"aria-live":`polite`,children:w?.(X,R.length)??`${m}: slide ${X+1} of ${R.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/components/display/carousel.d.ts

@@ -17,8 +17,15 @@ export type CarouselProps = React.ComponentProps<"div"> & {
     pauseOnHover?: boolean;
     stopAutoplayOnInteraction?: boolean;
     showPlaybackControl?: boolean;
+    showStatus?: boolean;
+    showThumbnails?: boolean;
     playLabel?: string;
     pauseLabel?: string;
+    statusLabel?: (index: number, total: number) => string;
+    renderThumbnail?: (item: React.ReactNode, index: number, active: boolean) => React.ReactNode;
+    renderActiveDetail?: (item: React.ReactNode, index: number) => React.ReactNode;
+    aspectRatio?: string;
+    mouseDrag?: boolean;
     onAutoplayChange?: (playing: boolean) => void;
     viewportClassName?: string;
     controlsClassName?: string;
@@ -26,8 +33,9 @@ export type CarouselProps = React.ComponentProps<"div"> & {
     arrowClassName?: string;
     dotClassName?: string;
     activeDotClassName?: string;
+    thumbnailsClassName?: string;
 };
 export type CarouselItemProps = React.ComponentProps<"div">;
-declare function Carousel({ index, defaultIndex, onIndexChange, loop, variant, showDots, showArrows, keyboard, ariaLabel, previousLabel, nextLabel, swipeThreshold, autoplay, autoplayInterval, pauseOnHover, stopAutoplayOnInteraction, showPlaybackControl, playLabel, pauseLabel, onAutoplayChange, viewportClassName, controlsClassName, dotsClassName, arrowClassName, dotClassName, activeDotClassName, className, children, ...props }: CarouselProps): React.JSX.Element;
+declare function Carousel({ index, defaultIndex, onIndexChange, loop, variant, showDots, showArrows, keyboard, ariaLabel, previousLabel, nextLabel, swipeThreshold, autoplay, autoplayInterval, pauseOnHover, stopAutoplayOnInteraction, showPlaybackControl, showStatus, showThumbnails, playLabel, pauseLabel, statusLabel, renderThumbnail, renderActiveDetail, aspectRatio, mouseDrag, onAutoplayChange, viewportClassName, controlsClassName, dotsClassName, arrowClassName, dotClassName, activeDotClassName, thumbnailsClassName, className, children, ...props }: CarouselProps): React.JSX.Element;
 declare function CarouselItem({ className, ...props }: CarouselItemProps): React.JSX.Element;
 export { Carousel, CarouselItem };

package/dist/components/display/carousel.js

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

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

@@ -1,2 +1,2 @@
-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,maxHeight:u,className:d,...f}){let p=r.useMemo(()=>e.split(`
-`),[e]);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`,d),...f,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:u?{maxHeight:u,overflowY:`auto`}:void 0,children:l?(0,i.jsx)(`code`,{className:`grid`,children:p.map((e,t)=>(0,i.jsxs)(`span`,{className:`grid grid-cols-[auto_1fr] gap-4`,children:[(0,i.jsx)(`span`,{className:`select-none text-right text-xs text-muted-foreground/75`,children:t+1}),(0,i.jsx)(`span`,{children:e||` `})]},`${t}-${e}`))}):(0,i.jsx)(`code`,{children:e})})]})}exports.CodeBlock=a;
+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/components/display/code-block.d.ts

@@ -6,7 +6,8 @@ export type CodeBlockProps = React.ComponentProps<"div"> & {
     showCopy?: boolean;
     wrap?: boolean;
     lineNumbers?: boolean;
+    highlightLines?: number[] | readonly number[];
     maxHeight?: number | string;
 };
-declare function CodeBlock({ code, language, title, showCopy, wrap, lineNumbers, maxHeight, className, ...props }: CodeBlockProps): React.JSX.Element;
+declare function CodeBlock({ code, language, title, showCopy, wrap, lineNumbers, highlightLines, maxHeight, className, ...props }: CodeBlockProps): React.JSX.Element;
 export { CodeBlock };

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

@@ -3,12 +3,12 @@ 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, maxHeight: d, className: f, ...p }) {
-	let m = n.useMemo(() => a.split("\n"), [a]);
+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", f),
-		...p,
+		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", {
@@ -29,20 +29,25 @@ function a({ code: a, language: o, title: s, showCopy: c = !0, wrap: l = !1, lin
 			})]
 		}), /* @__PURE__ */ r("pre", {
 			className: e("overflow-x-auto p-3 text-sm leading-6", l && "whitespace-pre-wrap break-words"),
-			style: d ? {
-				maxHeight: d,
+			style: f ? {
+				maxHeight: f,
 				overflowY: "auto"
 			} : void 0,
 			children: u ? /* @__PURE__ */ r("code", {
 				className: "grid",
-				children: m.map((e, t) => /* @__PURE__ */ i("span", {
-					className: "grid grid-cols-[auto_1fr] gap-4",
+				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: t + 1
-					}), /* @__PURE__ */ r("span", { children: e || " " })]
-				}, `${t}-${e}`))
-			}) : /* @__PURE__ */ r("code", { children: a })
+						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}`)) })
 		})]
 	});
 }

package/dist/components/display/delta-badge.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({value:e,trend:n=`neutral`,size:a=`default`,icon:o=!0,className:s,...c}){let l=n===`up`?r.ArrowUpIcon:n===`down`?r.ArrowDownIcon:r.MinusIcon;return(0,i.jsxs)(`span`,{"data-slot":`delta-badge`,className:t.cn(`inline-flex items-center justify-center font-medium`,a===`sm`?`gap-0.5 rounded px-1 py-0.5 text-[10px]`:`gap-1 rounded-full px-1.5 py-0.5 text-xs`,n===`up`&&`bg-emerald-500/10 text-emerald-600 dark:text-emerald-400`,n===`down`&&`bg-destructive/10 text-destructive`,n===`neutral`&&`bg-muted text-muted-foreground`,s),...c,children:[o&&(0,i.jsx)(l,{className:t.cn(`shrink-0`,a===`sm`?`size-2.5`:`size-3`)}),e]})}exports.DeltaBadge=a;
+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/components/display/delta-badge.d.ts

@@ -1,5 +1,6 @@
 import * as React from "react";
-export type DeltaBadgeProps = React.ComponentProps<"span"> & {
+import { type BadgeProps } from "@/components/ui/badge";
+export type DeltaBadgeProps = Omit<BadgeProps, "children" | "label" | "tone" | "status" | "leftIcon" | "variant" | "size"> & {
     value: React.ReactNode;
     trend?: "up" | "down" | "neutral";
     size?: "sm" | "default";

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

@@ -1,15 +1,19 @@
 import { cn as e } from "../../lib/utils.js";
+import { Badge as t } from "../ui/badge/index.js";
 import "react";
-import { ArrowDownIcon as t, ArrowUpIcon as n, MinusIcon as r } from "lucide-react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+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 }) {
-	let f = s === "up" ? n : s === "down" ? t : r;
-	return /* @__PURE__ */ a("span", {
+	return /* @__PURE__ */ a(t, {
 		"data-slot": "delta-badge",
-		className: e("inline-flex items-center justify-center font-medium", c === "sm" ? "gap-0.5 rounded px-1 py-0.5 text-[10px]" : "gap-1 rounded-full px-1.5 py-0.5 text-xs", s === "up" && "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400", s === "down" && "bg-destructive/10 text-destructive", s === "neutral" && "bg-muted text-muted-foreground", u),
-		...d,
-		children: [l && /* @__PURE__ */ i(f, { className: e("shrink-0", c === "sm" ? "size-2.5" : "size-3") }), o]
+		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

package/dist/components/display/kanban.cjs

@@ -1 +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");function a({columns:e,renderCard:n,onCardClick:r,columnClassName:a,cardClassName:s,className:c,...l}){return(0,i.jsx)(`div`,{"data-slot":`kanban-board`,className:t.cn(`grid auto-cols-[minmax(280px,1fr)] grid-flow-col gap-4 overflow-x-auto pb-2`,c),...l,children:e.map(e=>(0,i.jsx)(o,{column:e,renderCard:n,onCardClick:r,columnClassName:a,cardClassName:s},e.key))})}function o({column:e,renderCard:r,onCardClick:a,columnClassName:o,cardClassName:s}){return(0,i.jsxs)(`section`,{"data-slot":`kanban-column`,className:t.cn(`grid min-h-40 content-start gap-3 rounded-lg border bg-muted/35 p-3`,o),children:[(0,i.jsxs)(`div`,{className:`flex items-start justify-between gap-3`,children:[(0,i.jsxs)(`div`,{className:`grid gap-0.5`,children:[(0,i.jsx)(`h3`,{className:`text-sm font-semibold text-foreground`,children:e.title}),e.description&&(0,i.jsx)(`p`,{className:`text-xs text-muted-foreground`,children:e.description})]}),(0,i.jsx)(`div`,{className:`rounded-full bg-background px-2 py-0.5 text-xs text-muted-foreground`,children:e.count??e.cards.length})]}),(0,i.jsx)(`div`,{className:`grid gap-2`,children:e.cards.map(o=>r?.(o,e)??(0,i.jsxs)(n.Card,{"data-slot":`kanban-card`,className:t.cn(`transition-colors hover:bg-muted/40`,a&&!o.disabled&&`cursor-pointer`,o.disabled&&`pointer-events-none opacity-55`,s),onClick:()=>a?.(o,e),children:[(0,i.jsx)(n.CardHeader,{className:`p-3 pb-1`,children:(0,i.jsxs)(`div`,{className:`flex items-start justify-between gap-2`,children:[(0,i.jsx)(n.CardTitle,{className:`text-sm`,children:o.title}),o.extra]})}),(o.description||o.meta)&&(0,i.jsxs)(n.CardContent,{className:`grid gap-2 p-3 pt-0 text-xs text-muted-foreground`,children:[o.description,o.meta&&(0,i.jsx)(`div`,{children:o.meta})]})]},o.key))})]})}exports.KanbanBoard=a;
+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");function a({columns:e,renderCard:n,onCardClick:a,onCardMove:s,emptyColumn:c=`No cards yet.`,columnClassName:l,cardClassName:u,className:d,...f}){let p=r.useMemo(()=>new Map(e.map(e=>[e.key,e])),[e]);return(0,i.jsx)(`div`,{"data-slot":`kanban-board`,className:t.cn(`grid auto-cols-[minmax(280px,1fr)] grid-flow-col gap-4 overflow-x-auto pb-2`,d),...f,children:e.map(e=>(0,i.jsx)(o,{column:e,renderCard:n,onCardClick:a,onCardMove:s,columnByKey:p,emptyColumn:c,columnClassName:l,cardClassName:u},e.key))})}function o({column:e,renderCard:r,onCardClick:a,onCardMove:o,columnByKey:s,emptyColumn:c,columnClassName:l,cardClassName:u}){return(0,i.jsxs)(`section`,{"data-slot":`kanban-column`,className:t.cn(`grid min-h-40 content-start gap-3 rounded-lg border bg-muted/35 p-3`,l),onDragOver:e=>{o&&e.preventDefault()},onDrop:t=>{let n=t.dataTransfer.getData(`application/x-tembro-kanban-card`),r=t.dataTransfer.getData(`application/x-tembro-kanban-column`),i=s.get(r),a=i?.cards.find(e=>e.key===n);a&&i&&i.key!==e.key&&o?.(a,i,e)},children:[(0,i.jsxs)(`div`,{className:`flex items-start justify-between gap-3`,children:[(0,i.jsxs)(`div`,{className:`grid gap-0.5`,children:[(0,i.jsx)(`h3`,{className:`text-sm font-semibold text-foreground`,children:e.title}),e.description&&(0,i.jsx)(`p`,{className:`text-xs text-muted-foreground`,children:e.description})]}),(0,i.jsx)(`div`,{className:`rounded-full bg-background px-2 py-0.5 text-xs text-muted-foreground`,children:e.count??e.cards.length})]}),(0,i.jsx)(`div`,{className:`grid gap-2`,children:e.cards.length===0?(0,i.jsx)(`div`,{"data-slot":`kanban-column-empty`,className:`rounded-md border border-dashed bg-background/60 px-3 py-6 text-center text-sm text-muted-foreground`,children:typeof c==`function`?c(e):c}):e.cards.map(s=>r?.(s,e)??(0,i.jsxs)(n.Card,{"data-slot":`kanban-card`,role:a?`button`:void 0,tabIndex:a&&!s.disabled?0:void 0,draggable:!!(o&&!s.disabled),className:t.cn(`transition-colors hover:bg-muted/40`,a&&!s.disabled&&`cursor-pointer`,o&&!s.disabled&&`cursor-grab active:cursor-grabbing`,s.disabled&&`pointer-events-none opacity-55`,u),onDragStart:t=>{t.dataTransfer.setData(`application/x-tembro-kanban-card`,s.key),t.dataTransfer.setData(`application/x-tembro-kanban-column`,e.key),t.dataTransfer.effectAllowed=`move`},onClick:()=>a?.(s,e),onKeyDown:t=>{(t.key===`Enter`||t.key===` `)&&a&&!s.disabled&&(t.preventDefault(),a(s,e))},children:[(0,i.jsx)(n.CardHeader,{className:`p-3 pb-1`,children:(0,i.jsxs)(`div`,{className:`flex items-start justify-between gap-2`,children:[(0,i.jsx)(n.CardTitle,{className:`text-sm`,children:s.title}),(s.extra||s.actions)&&(0,i.jsxs)(`div`,{className:`flex shrink-0 items-center gap-1`,children:[s.extra,s.actions]})]})}),(s.description||s.meta)&&(0,i.jsxs)(n.CardContent,{className:`grid gap-2 p-3 pt-0 text-xs text-muted-foreground`,children:[s.description,s.meta&&(0,i.jsx)(`div`,{children:s.meta})]})]},s.key))})]})}exports.KanbanBoard=a;

package/dist/components/display/kanban.d.ts

@@ -5,6 +5,7 @@ export type KanbanCard = {
     description?: React.ReactNode;
     meta?: React.ReactNode;
     extra?: React.ReactNode;
+    actions?: React.ReactNode;
     disabled?: boolean;
 };
 export type KanbanColumn = {
@@ -18,8 +19,10 @@ export type KanbanBoardProps = React.ComponentProps<"div"> & {
     columns: KanbanColumn[];
     renderCard?: (card: KanbanCard, column: KanbanColumn) => React.ReactNode;
     onCardClick?: (card: KanbanCard, column: KanbanColumn) => void;
+    onCardMove?: (card: KanbanCard, fromColumn: KanbanColumn, toColumn: KanbanColumn) => void;
+    emptyColumn?: React.ReactNode | ((column: KanbanColumn) => React.ReactNode);
     columnClassName?: string;
     cardClassName?: string;
 };
-declare function KanbanBoard({ columns, renderCard, onCardClick, columnClassName, cardClassName, className, ...props }: KanbanBoardProps): React.JSX.Element;
+declare function KanbanBoard({ columns, renderCard, onCardClick, onCardMove, emptyColumn, columnClassName, cardClassName, className, ...props }: KanbanBoardProps): React.JSX.Element;
 export { KanbanBoard };