tembro 6.1.0 → 6.1.1

package/dist/src/components/modern/map.js

@@ -0,0 +1,158 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "../ui/button/index.js";
+import { Badge as n } from "../ui/badge/index.js";
+import * as r from "react";
+import { ExternalLinkIcon as i, LocateFixedIcon as a, MapPinIcon as o, MinusIcon as s, PlusIcon as c } from "lucide-react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/modern/map.tsx
+function d(e) {
+	return Math.max(1, Math.min(19, e));
+}
+function f(e) {
+	return Number.isFinite(e) ? e : 0;
+}
+function p(e, t, n) {
+	let r = f(n?.latitude ?? e.latitude), i = f(n?.longitude ?? e.longitude), a = .012 * (20 - d(t));
+	return `https://www.openstreetmap.org/export/embed.html?bbox=${[
+		i - a,
+		r - a,
+		i + a,
+		r + a
+	].map((e) => e.toFixed(6)).join("%2C")}&layer=mapnik&marker=${r.toFixed(6)}%2C${i.toFixed(6)}`;
+}
+function m(e, t, n) {
+	let r = f(n?.latitude ?? e.latitude), i = f(n?.longitude ?? e.longitude);
+	return `https://www.openstreetmap.org/?mlat=${r.toFixed(6)}&mlon=${i.toFixed(6)}#map=${d(t)}/${r.toFixed(6)}/${i.toFixed(6)}`;
+}
+function h({ center: f = {
+	latitude: 41.311081,
+	longitude: 69.240562
+}, zoom: h = 13, markers: g = [], title: _ = "Map", description: v, height: y = 420, showMarkerList: b = !0, showControls: x = !0, iframeTitle: S = "Interactive map", mapUrl: C, onMarkerSelect: w, selectedMarkerKey: T, defaultSelectedMarkerKey: E, className: D, ...O }) {
+	let [k, A] = r.useState(d(h)), [j, M] = r.useState(E ?? g[0]?.key), N = T ?? j, P = g.find((e) => e.key === N), F = C ?? p(f, k, P), I = m(f, k, P);
+	r.useEffect(() => {
+		A(d(h));
+	}, [h]);
+	let L = (e) => {
+		T === void 0 && M(e.key), w?.(e);
+	};
+	return /* @__PURE__ */ u("section", {
+		"data-slot": "map-view",
+		className: e("grid min-w-0 gap-3 rounded-lg border bg-card p-3 shadow-sm", D),
+		...O,
+		children: [/* @__PURE__ */ u("div", {
+			className: "flex flex-wrap items-start justify-between gap-3",
+			children: [/* @__PURE__ */ u("div", {
+				className: "min-w-0",
+				children: [_ ? /* @__PURE__ */ l("h3", {
+					className: "text-base font-semibold tracking-tight",
+					children: _
+				}) : null, v ? /* @__PURE__ */ l("p", {
+					className: "mt-1 text-sm text-muted-foreground",
+					children: v
+				}) : null]
+			}), x ? /* @__PURE__ */ u("div", {
+				className: "flex items-center gap-1",
+				children: [
+					/* @__PURE__ */ l(t, {
+						type: "button",
+						size: "icon-sm",
+						variant: "outline",
+						iconOnly: !0,
+						"aria-label": "Zoom out",
+						onClick: () => A((e) => d(e - 1)),
+						children: /* @__PURE__ */ l(s, {})
+					}),
+					/* @__PURE__ */ u(n, {
+						variant: "outline",
+						tone: "muted",
+						children: [k, "x"]
+					}),
+					/* @__PURE__ */ l(t, {
+						type: "button",
+						size: "icon-sm",
+						variant: "outline",
+						iconOnly: !0,
+						"aria-label": "Zoom in",
+						onClick: () => A((e) => d(e + 1)),
+						children: /* @__PURE__ */ l(c, {})
+					}),
+					/* @__PURE__ */ l(t, {
+						type: "button",
+						size: "icon-sm",
+						variant: "outline",
+						iconOnly: !0,
+						"aria-label": "Open in OpenStreetMap",
+						onClick: () => window.open(I, "_blank", "noopener,noreferrer"),
+						children: /* @__PURE__ */ l(i, {})
+					})
+				]
+			}) : null]
+		}), /* @__PURE__ */ u("div", {
+			className: e("grid gap-3", b && g.length ? "lg:grid-cols-[minmax(0,1fr)_18rem]" : ""),
+			children: [/* @__PURE__ */ u("div", {
+				className: "relative overflow-hidden rounded-lg border bg-muted",
+				style: { height: y },
+				children: [/* @__PURE__ */ l("iframe", {
+					title: S,
+					src: F,
+					className: "absolute inset-0 size-full border-0",
+					loading: "lazy",
+					referrerPolicy: "no-referrer-when-downgrade"
+				}), P ? /* @__PURE__ */ u("div", {
+					className: "absolute left-3 top-3 max-w-[calc(100%-1.5rem)] rounded-lg border bg-background/95 p-3 text-sm shadow-lg backdrop-blur",
+					children: [/* @__PURE__ */ u("div", {
+						className: "flex items-center gap-2 font-medium",
+						children: [/* @__PURE__ */ l(a, { className: "size-4 text-primary" }), P.label]
+					}), P.description ? /* @__PURE__ */ l("p", {
+						className: "mt-1 text-xs text-muted-foreground",
+						children: P.description
+					}) : null]
+				}) : null]
+			}), b && g.length ? /* @__PURE__ */ l("div", {
+				"data-slot": "map-marker-list",
+				className: "grid content-start gap-2",
+				children: g.map((e) => {
+					let t = e.key === N;
+					return /* @__PURE__ */ u("button", {
+						type: "button",
+						"aria-pressed": t,
+						className: "grid gap-1 rounded-lg border bg-background p-3 text-left text-sm outline-none transition hover:bg-muted/50 focus-visible:ring-2 focus-visible:ring-ring aria-pressed:border-primary aria-pressed:bg-primary/5",
+						onClick: () => L(e),
+						children: [
+							/* @__PURE__ */ u("span", {
+								className: "flex items-center justify-between gap-2",
+								children: [/* @__PURE__ */ u("span", {
+									className: "flex min-w-0 items-center gap-2 font-medium",
+									children: [/* @__PURE__ */ l(o, { className: "size-4 shrink-0 text-primary" }), /* @__PURE__ */ l("span", {
+										className: "truncate",
+										children: e.label
+									})]
+								}), /* @__PURE__ */ l(n, {
+									size: "sm",
+									tone: e.tone ?? "muted",
+									showDot: !0,
+									children: t ? "selected" : "marker"
+								})]
+							}),
+							e.description ? /* @__PURE__ */ l("span", {
+								className: "text-xs text-muted-foreground",
+								children: e.description
+							}) : null,
+							/* @__PURE__ */ u("span", {
+								className: "text-[11px] text-muted-foreground",
+								children: [
+									e.latitude.toFixed(4),
+									", ",
+									e.longitude.toFixed(4)
+								]
+							})
+						]
+					}, e.key);
+				})
+			}) : null]
+		})]
+	});
+}
+//#endregion
+export { h as MapView };

package/dist/src/components/modern/media-player.cjs

@@ -0,0 +1 @@
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/button/index.cjs"),r=require("../ui/badge/index.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("lucide-react"),o=require("react/jsx-runtime");function s(e){return!Number.isFinite(e)||e<0?`0:00`:`${Math.floor(e/60)}:${Math.floor(e%60).toString().padStart(2,`0`)}`}function c(e){return e===`video`?`aspect-video`:e===`square`?`aspect-square`:e===`wide`?`aspect-[21/9]`:``}function l({src:e,title:l,description:u,tracks:d=[],actions:f,aspectRatio:p=`video`,showMeta:m=!0,poster:h,autoPlay:g,muted:_,loop:v,playsInline:y=!0,preload:b=`metadata`,onTimeChange:x,onVolumeValueChange:S,className:C,...w}){let T=i.useRef(null),[E,D]=i.useState(!!g),[O,k]=i.useState(0),[A,j]=i.useState(0),[M,N]=i.useState(1),[P,F]=i.useState(!!_),[I,L]=i.useState(!1),R=i.useCallback(()=>{let e=T.current;e&&(D(!e.paused),k(e.duration||0),j(e.currentTime||0),N(e.volume),F(e.muted),x?.(e.currentTime||0,e.duration||0))},[x]),z=async()=>{let e=T.current;e&&(e.paused?await e.play():e.pause(),R())},B=e=>{let t=T.current;t&&(t.currentTime=e,j(e),x?.(e,O))},V=e=>{let t=T.current,n=Math.max(0,Math.min(1,e));t&&(t.volume=n,t.muted=n===0?!0:P),N(n);let r=n===0?!0:P;F(r),S?.(n,r)},H=()=>{let e=T.current,t=!P;e&&(e.muted=t),F(t),S?.(M,t)},U=P||M===0?a.VolumeXIcon:M<.6?a.Volume1Icon:a.Volume2Icon;return(0,o.jsxs)(`section`,{"data-slot":`media-player`,className:t.cn(`overflow-hidden rounded-lg border bg-card shadow-sm`,C),children:[(0,o.jsxs)(`div`,{className:t.cn(`relative bg-black`,c(p)),style:[`video`,`square`,`wide`].includes(String(p))?void 0:{aspectRatio:String(p)},children:[(0,o.jsx)(`video`,{ref:T,src:e,poster:h,autoPlay:g,muted:P,loop:v,playsInline:y,preload:b,className:`size-full object-cover`,onLoadedMetadata:()=>{L(!0),R()},onPlay:()=>D(!0),onPause:()=>D(!1),onTimeUpdate:R,onVolumeChange:R,...w,children:d.map(e=>(0,o.jsx)(`track`,{...e},`${e.src}-${e.srcLang??``}`))}),(0,o.jsx)(`button`,{type:`button`,"aria-label":E?`Pause media`:`Play media`,className:`absolute inset-0 grid place-items-center bg-black/0 text-white opacity-0 transition hover:bg-black/20 hover:opacity-100 focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring`,onClick:()=>void z(),children:(0,o.jsx)(`span`,{className:`grid size-14 place-items-center rounded-full bg-black/55 backdrop-blur`,children:E?(0,o.jsx)(a.PauseIcon,{className:`size-6`}):(0,o.jsx)(a.PlayIcon,{className:`size-6 translate-x-0.5`})})})]}),(0,o.jsxs)(`div`,{className:`grid gap-3 p-3`,children:[m&&(l||u||f)?(0,o.jsxs)(`div`,{className:`flex flex-wrap items-start justify-between gap-3`,children:[(0,o.jsxs)(`div`,{className:`min-w-0`,children:[l?(0,o.jsx)(`h3`,{className:`truncate text-sm font-semibold`,children:l}):null,u?(0,o.jsx)(`p`,{className:`mt-1 text-xs text-muted-foreground`,children:u}):null]}),(0,o.jsxs)(`div`,{className:`flex items-center gap-2`,children:[I?null:(0,o.jsx)(r.Badge,{tone:`muted`,variant:`soft`,children:`loading`}),f]})]}):null,(0,o.jsxs)(`div`,{className:`grid gap-2`,children:[(0,o.jsx)(`input`,{"aria-label":`Media progress`,type:`range`,min:0,max:O||0,step:.1,value:Math.min(A,O||A),onChange:e=>B(Number(e.target.value)),className:`h-2 w-full cursor-pointer accent-primary`}),(0,o.jsxs)(`div`,{className:`flex flex-wrap items-center justify-between gap-3`,children:[(0,o.jsxs)(`div`,{className:`flex items-center gap-1`,children:[(0,o.jsx)(n.Button,{type:`button`,size:`icon-sm`,variant:`outline`,iconOnly:!0,"aria-label":E?`Pause`:`Play`,onClick:()=>void z(),children:E?(0,o.jsx)(a.PauseIcon,{}):(0,o.jsx)(a.PlayIcon,{})}),(0,o.jsx)(n.Button,{type:`button`,size:`icon-sm`,variant:`ghost`,iconOnly:!0,"aria-label":`Restart`,onClick:()=>B(0),children:(0,o.jsx)(a.RotateCcwIcon,{})}),(0,o.jsxs)(`span`,{className:`min-w-20 text-xs tabular-nums text-muted-foreground`,children:[s(A),` / `,s(O)]})]}),(0,o.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,o.jsx)(n.Button,{type:`button`,size:`icon-sm`,variant:`ghost`,iconOnly:!0,"aria-label":P?`Unmute`:`Mute`,onClick:H,children:(0,o.jsx)(U,{})}),(0,o.jsx)(`input`,{"aria-label":`Volume`,type:`range`,min:0,max:1,step:.01,value:P?0:M,onChange:e=>V(Number(e.target.value)),className:`h-2 w-24 cursor-pointer accent-primary`}),(0,o.jsx)(n.Button,{type:`button`,size:`icon-sm`,variant:`ghost`,iconOnly:!0,"aria-label":`Fullscreen`,onClick:()=>T.current?.requestFullscreen?.(),children:(0,o.jsx)(a.MaximizeIcon,{})})]})]})]})]})]})}exports.MediaPlayer=l;

package/dist/src/components/modern/media-player.js

@@ -0,0 +1,176 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "../ui/button/index.js";
+import { Badge as n } from "../ui/badge/index.js";
+import * as r from "react";
+import { MaximizeIcon as i, PauseIcon as a, PlayIcon as o, RotateCcwIcon as s, Volume1Icon as c, Volume2Icon as l, VolumeXIcon as u } from "lucide-react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+//#region src/components/modern/media-player.tsx
+function p(e) {
+	return !Number.isFinite(e) || e < 0 ? "0:00" : `${Math.floor(e / 60)}:${Math.floor(e % 60).toString().padStart(2, "0")}`;
+}
+function m(e) {
+	return e === "video" ? "aspect-video" : e === "square" ? "aspect-square" : e === "wide" ? "aspect-[21/9]" : "";
+}
+function h({ src: h, title: g, description: _, tracks: v = [], actions: y, aspectRatio: b = "video", showMeta: x = !0, poster: S, autoPlay: C, muted: w, loop: T, playsInline: E = !0, preload: D = "metadata", onTimeChange: O, onVolumeValueChange: k, className: A, ...j }) {
+	let M = r.useRef(null), [N, P] = r.useState(!!C), [F, I] = r.useState(0), [L, R] = r.useState(0), [z, B] = r.useState(1), [V, H] = r.useState(!!w), [U, W] = r.useState(!1), G = r.useCallback(() => {
+		let e = M.current;
+		e && (P(!e.paused), I(e.duration || 0), R(e.currentTime || 0), B(e.volume), H(e.muted), O?.(e.currentTime || 0, e.duration || 0));
+	}, [O]), K = async () => {
+		let e = M.current;
+		e && (e.paused ? await e.play() : e.pause(), G());
+	}, q = (e) => {
+		let t = M.current;
+		t && (t.currentTime = e, R(e), O?.(e, F));
+	}, J = (e) => {
+		let t = M.current, n = Math.max(0, Math.min(1, e));
+		t && (t.volume = n, t.muted = n === 0 ? !0 : V), B(n);
+		let r = n === 0 ? !0 : V;
+		H(r), k?.(n, r);
+	}, Y = () => {
+		let e = M.current, t = !V;
+		e && (e.muted = t), H(t), k?.(z, t);
+	}, X = V || z === 0 ? u : z < .6 ? c : l;
+	return /* @__PURE__ */ f("section", {
+		"data-slot": "media-player",
+		className: e("overflow-hidden rounded-lg border bg-card shadow-sm", A),
+		children: [/* @__PURE__ */ f("div", {
+			className: e("relative bg-black", m(b)),
+			style: [
+				"video",
+				"square",
+				"wide"
+			].includes(String(b)) ? void 0 : { aspectRatio: String(b) },
+			children: [/* @__PURE__ */ d("video", {
+				ref: M,
+				src: h,
+				poster: S,
+				autoPlay: C,
+				muted: V,
+				loop: T,
+				playsInline: E,
+				preload: D,
+				className: "size-full object-cover",
+				onLoadedMetadata: () => {
+					W(!0), G();
+				},
+				onPlay: () => P(!0),
+				onPause: () => P(!1),
+				onTimeUpdate: G,
+				onVolumeChange: G,
+				...j,
+				children: v.map((e) => /* @__PURE__ */ d("track", { ...e }, `${e.src}-${e.srcLang ?? ""}`))
+			}), /* @__PURE__ */ d("button", {
+				type: "button",
+				"aria-label": N ? "Pause media" : "Play media",
+				className: "absolute inset-0 grid place-items-center bg-black/0 text-white opacity-0 transition hover:bg-black/20 hover:opacity-100 focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+				onClick: () => void K(),
+				children: /* @__PURE__ */ d("span", {
+					className: "grid size-14 place-items-center rounded-full bg-black/55 backdrop-blur",
+					children: N ? /* @__PURE__ */ d(a, { className: "size-6" }) : /* @__PURE__ */ d(o, { className: "size-6 translate-x-0.5" })
+				})
+			})]
+		}), /* @__PURE__ */ f("div", {
+			className: "grid gap-3 p-3",
+			children: [x && (g || _ || y) ? /* @__PURE__ */ f("div", {
+				className: "flex flex-wrap items-start justify-between gap-3",
+				children: [/* @__PURE__ */ f("div", {
+					className: "min-w-0",
+					children: [g ? /* @__PURE__ */ d("h3", {
+						className: "truncate text-sm font-semibold",
+						children: g
+					}) : null, _ ? /* @__PURE__ */ d("p", {
+						className: "mt-1 text-xs text-muted-foreground",
+						children: _
+					}) : null]
+				}), /* @__PURE__ */ f("div", {
+					className: "flex items-center gap-2",
+					children: [U ? null : /* @__PURE__ */ d(n, {
+						tone: "muted",
+						variant: "soft",
+						children: "loading"
+					}), y]
+				})]
+			}) : null, /* @__PURE__ */ f("div", {
+				className: "grid gap-2",
+				children: [/* @__PURE__ */ d("input", {
+					"aria-label": "Media progress",
+					type: "range",
+					min: 0,
+					max: F || 0,
+					step: .1,
+					value: Math.min(L, F || L),
+					onChange: (e) => q(Number(e.target.value)),
+					className: "h-2 w-full cursor-pointer accent-primary"
+				}), /* @__PURE__ */ f("div", {
+					className: "flex flex-wrap items-center justify-between gap-3",
+					children: [/* @__PURE__ */ f("div", {
+						className: "flex items-center gap-1",
+						children: [
+							/* @__PURE__ */ d(t, {
+								type: "button",
+								size: "icon-sm",
+								variant: "outline",
+								iconOnly: !0,
+								"aria-label": N ? "Pause" : "Play",
+								onClick: () => void K(),
+								children: d(N ? a : o, {})
+							}),
+							/* @__PURE__ */ d(t, {
+								type: "button",
+								size: "icon-sm",
+								variant: "ghost",
+								iconOnly: !0,
+								"aria-label": "Restart",
+								onClick: () => q(0),
+								children: /* @__PURE__ */ d(s, {})
+							}),
+							/* @__PURE__ */ f("span", {
+								className: "min-w-20 text-xs tabular-nums text-muted-foreground",
+								children: [
+									p(L),
+									" / ",
+									p(F)
+								]
+							})
+						]
+					}), /* @__PURE__ */ f("div", {
+						className: "flex items-center gap-2",
+						children: [
+							/* @__PURE__ */ d(t, {
+								type: "button",
+								size: "icon-sm",
+								variant: "ghost",
+								iconOnly: !0,
+								"aria-label": V ? "Unmute" : "Mute",
+								onClick: Y,
+								children: /* @__PURE__ */ d(X, {})
+							}),
+							/* @__PURE__ */ d("input", {
+								"aria-label": "Volume",
+								type: "range",
+								min: 0,
+								max: 1,
+								step: .01,
+								value: V ? 0 : z,
+								onChange: (e) => J(Number(e.target.value)),
+								className: "h-2 w-24 cursor-pointer accent-primary"
+							}),
+							/* @__PURE__ */ d(t, {
+								type: "button",
+								size: "icon-sm",
+								variant: "ghost",
+								iconOnly: !0,
+								"aria-label": "Fullscreen",
+								onClick: () => M.current?.requestFullscreen?.(),
+								children: /* @__PURE__ */ d(i, {})
+							})
+						]
+					})]
+				})]
+			})]
+		})]
+	});
+}
+//#endregion
+export { h as MediaPlayer };

package/dist/src/components/modern/resizable-panel.cjs

@@ -1 +1 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("lucide-react"),i=require("react/jsx-runtime");var a=n.createContext(null);function o(e){if(typeof e==`number`)return e;if(typeof e==`string`){let t=Number.parseFloat(e.replace(`%`,``));return Number.isFinite(t)?t:void 0}}function s({direction:e=`horizontal`,className:r,children:s,...u}){let d=n.useRef(null),f=n.Children.toArray(s).filter(e=>n.isValidElement(e)&&e.type===c),p=f.length,m=n.useMemo(()=>{let e=f.map(e=>o(e.props.defaultSize)),t=e.reduce((e,t)=>e+(t??0),0),n=e.filter(e=>e===void 0).length,r=Math.max(100-t,0),i=n>0?r/n:p>0?100/p:100;return e.map(e=>e??i)},[p,f]),h=n.useMemo(()=>f.map(e=>e.props.minSize??15),[f]),[g,_]=n.useState(m);n.useEffect(()=>{_(m)},[m]);let v=n.useCallback((t,n)=>{let r=d.current;if(!r||t<0||t>=p-1)return;let i=e===`horizontal`?r.getBoundingClientRect().width:r.getBoundingClientRect().height;if(!i)return;let a=n/i*100;_(e=>{let n=[...e],r=n[t]??0,i=n[t+1]??0,o=h[t]??15,s=h[t+1]??15,c=r+a,l=Math.min(Math.max(c,o),r+i-s),u=l-r;return n[t]=l,n[t+1]=i-u,n})},[e,h,p]),y=n.Children.map(s,e=>{if(!n.isValidElement(e))return e;if(e.type===c){let t=f.findIndex(t=>t===e);return n.cloneElement(e,{"data-panel-index":t})}if(e.type===l){let t=n.Children.toArray(s).slice(0,n.Children.toArray(s).indexOf(e)).filter(e=>n.isValidElement(e)&&e.type===c).length-1;return n.cloneElement(e,{"data-handle-index":t})}return e});return(0,i.jsx)(a.Provider,{value:{direction:e,getSize:e=>g[e]??100/Math.max(p,1),resizePanels:v},children:(0,i.jsx)(`div`,{ref:d,"data-slot":`resizable-panel-group`,"data-direction":e,className:t.cn(`flex gap-2`,e===`horizontal`?`flex-row items-stretch`:`flex-col`,r),...u,children:y})})}function c({className:e,style:r,defaultSize:s,minSize:c,...l}){let u=n.useContext(a),d=Number(l[`data-panel-index`]??0),f=u?u.getSize(d):o(s)??100;return(0,i.jsx)(`div`,{"data-slot":`resizable-panel`,className:t.cn(`min-h-24 overflow-auto rounded-lg border bg-card p-3`,e),style:{flexBasis:`${f}%`,flexGrow:0,flexShrink:0,...r},...l})}function l({className:e,...o}){let s=n.useContext(a),c=Number(o[`data-handle-index`]??0),l=n.useRef(null);return(0,i.jsx)(`button`,{type:`button`,"data-slot":`resizable-handle`,"aria-label":`Resize panels`,className:t.cn(`relative flex shrink-0 items-center justify-center rounded-full border border-border/70 bg-background/85 text-muted-foreground shadow-sm transition-colors hover:border-ring/45 hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring`,s?.direction===`horizontal`?`w-3 cursor-col-resize`:`h-3 cursor-row-resize`,e),onPointerDown:e=>{s&&(l.current={pointerId:e.pointerId,axis:s.direction===`horizontal`?e.clientX:e.clientY},e.currentTarget.setPointerCapture(e.pointerId))},onPointerMove:e=>{if(!s||!l.current||l.current.pointerId!==e.pointerId)return;let t=s.direction===`horizontal`?e.clientX:e.clientY,n=t-l.current.axis;n!==0&&(l.current.axis=t,s.resizePanels(c,n))},onPointerUp:e=>{l.current?.pointerId===e.pointerId&&(l.current=null)},onPointerCancel:()=>{l.current=null},onKeyDown:e=>{if(!s)return;let t=e.shiftKey?24:12;s.direction===`horizontal`&&e.key===`ArrowLeft`&&(e.preventDefault(),s.resizePanels(c,-t)),s.direction===`horizontal`&&e.key===`ArrowRight`&&(e.preventDefault(),s.resizePanels(c,t)),s.direction===`vertical`&&e.key===`ArrowUp`&&(e.preventDefault(),s.resizePanels(c,-t)),s.direction===`vertical`&&e.key===`ArrowDown`&&(e.preventDefault(),s.resizePanels(c,t))},...o,children:(0,i.jsx)(r.GripVerticalIcon,{className:t.cn(`size-3`,s?.direction===`vertical`&&`rotate-90`)})})}exports.ResizableHandle=l,exports.ResizablePanel=c,exports.ResizablePanelGroup=s;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("lucide-react"),i=require("react/jsx-runtime");var a=n.createContext(null);function o(e){if(typeof e==`number`)return e;if(typeof e==`string`){let t=Number.parseFloat(e.replace(`%`,``));return Number.isFinite(t)?t:void 0}}function s({direction:e=`horizontal`,className:r,children:s,...u}){let d=n.useRef(null),f=n.Children.toArray(s).filter(e=>n.isValidElement(e)&&e.type===c),p=f.length,m=n.useMemo(()=>{let e=f.map(e=>o(e.props.defaultSize)),t=e.reduce((e,t)=>e+(t??0),0),n=e.filter(e=>e===void 0).length,r=Math.max(100-t,0),i=n>0?r/n:p>0?100/p:100;return e.map(e=>e??i)},[p,f]),h=n.useMemo(()=>f.map(e=>e.props.minSize??15),[f]),[g,_]=n.useState(m);n.useEffect(()=>{_(m)},[m]);let v=n.useCallback((t,n)=>{let r=d.current;if(!r||t<0||t>=p-1)return;let i=e===`horizontal`?r.getBoundingClientRect().width:r.getBoundingClientRect().height;if(!i)return;let a=n/i*100;_(e=>{let n=[...e],r=n[t]??0,i=n[t+1]??0,o=h[t]??15,s=h[t+1]??15,c=r+a,l=Math.min(Math.max(c,o),r+i-s),u=l-r;return n[t]=l,n[t+1]=i-u,n})},[e,h,p]),y=n.Children.map(s,e=>{if(!n.isValidElement(e))return e;if(e.type===c){let t=f.findIndex(t=>t===e);return n.cloneElement(e,{"data-panel-index":t})}if(e.type===l){let t=n.Children.toArray(s).slice(0,n.Children.toArray(s).indexOf(e)).filter(e=>n.isValidElement(e)&&e.type===c).length-1;return n.cloneElement(e,{"data-handle-index":t})}return e});return(0,i.jsx)(a.Provider,{value:{direction:e,getSize:e=>g[e]??100/Math.max(p,1),resizePanels:v},children:(0,i.jsx)(`div`,{ref:d,"data-slot":`resizable-panel-group`,"data-direction":e,className:t.cn(`flex`,e===`horizontal`?`flex-row items-stretch`:`flex-col`,r),...u,children:y})})}function c({className:e,style:r,defaultSize:s,minSize:c,...l}){let u=n.useContext(a),d=Number(l[`data-panel-index`]??0),f=u?u.getSize(d):o(s)??100;return(0,i.jsx)(`div`,{"data-slot":`resizable-panel`,className:t.cn(`min-h-24 min-w-0 overflow-auto rounded-[var(--aui-card-radius,var(--radius-lg))] border border-[color:var(--aui-card-border,var(--border))] bg-card p-3 shadow-[var(--aui-card-shadow,0_10px_24px_rgba(15,23,42,0.07))]`,e),style:{flexBasis:`${f}%`,flexGrow:0,flexShrink:0,...r},...l})}function l({className:e,...o}){let s=n.useContext(a),c=Number(o[`data-handle-index`]??0),l=n.useRef(null);return(0,i.jsxs)(`button`,{type:`button`,"data-slot":`resizable-handle`,"aria-label":`Resize panels`,"aria-orientation":s?.direction??`horizontal`,className:t.cn(`group relative flex shrink-0 items-center justify-center text-muted-foreground outline-none transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring`,s?.direction===`horizontal`?`w-4 cursor-col-resize px-1`:`h-4 cursor-row-resize py-1`,e),onPointerDown:e=>{s&&(l.current={pointerId:e.pointerId,axis:s.direction===`horizontal`?e.clientX:e.clientY},e.currentTarget.setPointerCapture(e.pointerId))},onPointerMove:e=>{if(!s||!l.current||l.current.pointerId!==e.pointerId)return;let t=s.direction===`horizontal`?e.clientX:e.clientY,n=t-l.current.axis;n!==0&&(l.current.axis=t,s.resizePanels(c,n))},onPointerUp:e=>{l.current?.pointerId===e.pointerId&&(l.current=null)},onPointerCancel:()=>{l.current=null},onKeyDown:e=>{if(!s)return;let t=e.shiftKey?24:12;s.direction===`horizontal`&&e.key===`ArrowLeft`&&(e.preventDefault(),s.resizePanels(c,-t)),s.direction===`horizontal`&&e.key===`ArrowRight`&&(e.preventDefault(),s.resizePanels(c,t)),s.direction===`vertical`&&e.key===`ArrowUp`&&(e.preventDefault(),s.resizePanels(c,-t)),s.direction===`vertical`&&e.key===`ArrowDown`&&(e.preventDefault(),s.resizePanels(c,t))},...o,children:[(0,i.jsx)(`span`,{"aria-hidden":`true`,className:t.cn(`absolute rounded-full bg-border transition-colors group-hover:bg-ring/55`,s?.direction===`horizontal`?`inset-y-2 left-1/2 w-px -translate-x-1/2`:`inset-x-2 top-1/2 h-px -translate-y-1/2`)}),(0,i.jsx)(`span`,{className:`relative grid size-5 place-items-center rounded-full border border-border/75 bg-background shadow-sm transition-colors group-hover:border-ring/45`,children:(0,i.jsx)(r.GripVerticalIcon,{className:t.cn(`size-3`,s?.direction===`vertical`&&`rotate-90`)})})]})}exports.ResizableHandle=l,exports.ResizablePanel=c,exports.ResizablePanelGroup=s;

package/dist/src/components/modern/resizable-panel.js

@@ -2,19 +2,19 @@
 import { cn as e } from "../../lib/utils.js";
 import * as t from "react";
 import { GripVerticalIcon as n } from "lucide-react";
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/components/modern/resizable-panel.tsx
-var i = t.createContext(null);
-function a(e) {
+var a = t.createContext(null);
+function o(e) {
 	if (typeof e == "number") return e;
 	if (typeof e == "string") {
 		let t = Number.parseFloat(e.replace("%", ""));
 		return Number.isFinite(t) ? t : void 0;
 	}
 }
-function o({ direction: n = "horizontal", className: o, children: l, ...u }) {
-	let d = t.useRef(null), f = t.Children.toArray(l).filter((e) => t.isValidElement(e) && e.type === s), p = f.length, m = t.useMemo(() => {
-		let e = f.map((e) => a(e.props.defaultSize)), t = e.reduce((e, t) => e + (t ?? 0), 0), n = e.filter((e) => e === void 0).length, r = Math.max(100 - t, 0), i = n > 0 ? r / n : p > 0 ? 100 / p : 100;
+function s({ direction: n = "horizontal", className: i, children: s, ...u }) {
+	let d = t.useRef(null), f = t.Children.toArray(s).filter((e) => t.isValidElement(e) && e.type === c), p = f.length, m = t.useMemo(() => {
+		let e = f.map((e) => o(e.props.defaultSize)), t = e.reduce((e, t) => e + (t ?? 0), 0), n = e.filter((e) => e === void 0).length, r = Math.max(100 - t, 0), i = n > 0 ? r / n : p > 0 ? 100 / p : 100;
 		return e.map((e) => e ?? i);
 	}, [p, f]), h = t.useMemo(() => f.map((e) => e.props.minSize ?? 15), [f]), [g, _] = t.useState(m);
 	t.useEffect(() => {
@@ -34,19 +34,19 @@ function o({ direction: n = "horizontal", className: o, children: l, ...u }) {
 		n,
 		h,
 		p
-	]), y = t.Children.map(l, (e) => {
+	]), y = t.Children.map(s, (e) => {
 		if (!t.isValidElement(e)) return e;
-		if (e.type === s) {
+		if (e.type === c) {
 			let n = f.findIndex((t) => t === e);
 			return t.cloneElement(e, { "data-panel-index": n });
 		}
-		if (e.type === c) {
-			let n = t.Children.toArray(l).slice(0, t.Children.toArray(l).indexOf(e)).filter((e) => t.isValidElement(e) && e.type === s).length - 1;
+		if (e.type === l) {
+			let n = t.Children.toArray(s).slice(0, t.Children.toArray(s).indexOf(e)).filter((e) => t.isValidElement(e) && e.type === c).length - 1;
 			return t.cloneElement(e, { "data-handle-index": n });
 		}
 		return e;
 	});
-	return /* @__PURE__ */ r(i.Provider, {
+	return /* @__PURE__ */ r(a.Provider, {
 		value: {
 			direction: n,
 			getSize: (e) => g[e] ?? 100 / Math.max(p, 1),
@@ -56,58 +56,65 @@ function o({ direction: n = "horizontal", className: o, children: l, ...u }) {
 			ref: d,
 			"data-slot": "resizable-panel-group",
 			"data-direction": n,
-			className: e("flex gap-2", n === "horizontal" ? "flex-row items-stretch" : "flex-col", o),
+			className: e("flex", n === "horizontal" ? "flex-row items-stretch" : "flex-col", i),
 			...u,
 			children: y
 		})
 	});
 }
-function s({ className: n, style: o, defaultSize: s, minSize: c, ...l }) {
-	let u = t.useContext(i), d = Number(l["data-panel-index"] ?? 0), f = u ? u.getSize(d) : a(s) ?? 100;
+function c({ className: n, style: i, defaultSize: s, minSize: c, ...l }) {
+	let u = t.useContext(a), d = Number(l["data-panel-index"] ?? 0), f = u ? u.getSize(d) : o(s) ?? 100;
 	return /* @__PURE__ */ r("div", {
 		"data-slot": "resizable-panel",
-		className: e("min-h-24 overflow-auto rounded-lg border bg-card p-3", n),
+		className: e("min-h-24 min-w-0 overflow-auto rounded-[var(--aui-card-radius,var(--radius-lg))] border border-[color:var(--aui-card-border,var(--border))] bg-card p-3 shadow-[var(--aui-card-shadow,0_10px_24px_rgba(15,23,42,0.07))]", n),
 		style: {
 			flexBasis: `${f}%`,
 			flexGrow: 0,
 			flexShrink: 0,
-			...o
+			...i
 		},
 		...l
 	});
 }
-function c({ className: a, ...o }) {
-	let s = t.useContext(i), c = Number(o["data-handle-index"] ?? 0), l = t.useRef(null);
-	return /* @__PURE__ */ r("button", {
+function l({ className: o, ...s }) {
+	let c = t.useContext(a), l = Number(s["data-handle-index"] ?? 0), u = t.useRef(null);
+	return /* @__PURE__ */ i("button", {
 		type: "button",
 		"data-slot": "resizable-handle",
 		"aria-label": "Resize panels",
-		className: e("relative flex shrink-0 items-center justify-center rounded-full border border-border/70 bg-background/85 text-muted-foreground shadow-sm transition-colors hover:border-ring/45 hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", s?.direction === "horizontal" ? "w-3 cursor-col-resize" : "h-3 cursor-row-resize", a),
+		"aria-orientation": c?.direction ?? "horizontal",
+		className: e("group relative flex shrink-0 items-center justify-center text-muted-foreground outline-none transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring", c?.direction === "horizontal" ? "w-4 cursor-col-resize px-1" : "h-4 cursor-row-resize py-1", o),
 		onPointerDown: (e) => {
-			s && (l.current = {
+			c && (u.current = {
 				pointerId: e.pointerId,
-				axis: s.direction === "horizontal" ? e.clientX : e.clientY
+				axis: c.direction === "horizontal" ? e.clientX : e.clientY
 			}, e.currentTarget.setPointerCapture(e.pointerId));
 		},
 		onPointerMove: (e) => {
-			if (!s || !l.current || l.current.pointerId !== e.pointerId) return;
-			let t = s.direction === "horizontal" ? e.clientX : e.clientY, n = t - l.current.axis;
-			n !== 0 && (l.current.axis = t, s.resizePanels(c, n));
+			if (!c || !u.current || u.current.pointerId !== e.pointerId) return;
+			let t = c.direction === "horizontal" ? e.clientX : e.clientY, n = t - u.current.axis;
+			n !== 0 && (u.current.axis = t, c.resizePanels(l, n));
 		},
 		onPointerUp: (e) => {
-			l.current?.pointerId === e.pointerId && (l.current = null);
+			u.current?.pointerId === e.pointerId && (u.current = null);
 		},
 		onPointerCancel: () => {
-			l.current = null;
+			u.current = null;
 		},
 		onKeyDown: (e) => {
-			if (!s) return;
+			if (!c) return;
 			let t = e.shiftKey ? 24 : 12;
-			s.direction === "horizontal" && e.key === "ArrowLeft" && (e.preventDefault(), s.resizePanels(c, -t)), s.direction === "horizontal" && e.key === "ArrowRight" && (e.preventDefault(), s.resizePanels(c, t)), s.direction === "vertical" && e.key === "ArrowUp" && (e.preventDefault(), s.resizePanels(c, -t)), s.direction === "vertical" && e.key === "ArrowDown" && (e.preventDefault(), s.resizePanels(c, t));
+			c.direction === "horizontal" && e.key === "ArrowLeft" && (e.preventDefault(), c.resizePanels(l, -t)), c.direction === "horizontal" && e.key === "ArrowRight" && (e.preventDefault(), c.resizePanels(l, t)), c.direction === "vertical" && e.key === "ArrowUp" && (e.preventDefault(), c.resizePanels(l, -t)), c.direction === "vertical" && e.key === "ArrowDown" && (e.preventDefault(), c.resizePanels(l, t));
 		},
-		...o,
-		children: /* @__PURE__ */ r(n, { className: e("size-3", s?.direction === "vertical" && "rotate-90") })
+		...s,
+		children: [/* @__PURE__ */ r("span", {
+			"aria-hidden": "true",
+			className: e("absolute rounded-full bg-border transition-colors group-hover:bg-ring/55", c?.direction === "horizontal" ? "inset-y-2 left-1/2 w-px -translate-x-1/2" : "inset-x-2 top-1/2 h-px -translate-y-1/2")
+		}), /* @__PURE__ */ r("span", {
+			className: "relative grid size-5 place-items-center rounded-full border border-border/75 bg-background shadow-sm transition-colors group-hover:border-ring/45",
+			children: /* @__PURE__ */ r(n, { className: e("size-3", c?.direction === "vertical" && "rotate-90") })
+		})]
 	});
 }
 //#endregion
-export { c as ResizableHandle, s as ResizablePanel, o as ResizablePanelGroup };
+export { l as ResizableHandle, c as ResizablePanel, s as ResizablePanelGroup };

package/dist/src/components/modern/spreadsheet.cjs

@@ -0,0 +1 @@
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/button/index.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("lucide-react"),a=require("react/jsx-runtime");function o(e){return e===`center`?`text-center`:e===`right`?`text-right`:`text-left`}function s(e,t){return{key:`row-${Date.now()}-${t}`,cells:Object.fromEntries(e.map(e=>[e.key,``]))}}function c({columns:e,rows:c,defaultRows:l=[],onRowsChange:u,onCellChange:d,selectedCell:f,defaultSelectedCell:p,onSelectedCellChange:m,readOnly:h=!1,showRowNumbers:g=!0,showAddRow:_=!0,addRowLabel:v=`Add row`,empty:y=`No rows yet.`,className:b,...x}){let[S,C]=r.useState(l),[w,T]=r.useState(p),E=c??S,D=f??w,O=(e,t)=>{c===void 0&&C(e),u?.(e,t)},k=e=>{f===void 0&&T(e),m?.(e)},A=(e,t)=>{let n=E.map(n=>n.key===e.rowKey?{...n,cells:{...n.cells,[e.columnKey]:t}}:n);O(n,e),d?.(t,e,n)},j=()=>{O([...E,s(e,E.length+1)])};return(0,a.jsxs)(`div`,{"data-slot":`spreadsheet`,className:t.cn(`grid min-w-0 gap-3 rounded-lg border bg-card p-3 shadow-sm`,b),...x,children:[(0,a.jsx)(`div`,{className:`overflow-auto rounded-lg border`,children:(0,a.jsxs)(`table`,{className:`w-full min-w-[48rem] border-collapse text-sm`,children:[(0,a.jsx)(`thead`,{className:`sticky top-0 z-10 bg-muted/80 backdrop-blur`,children:(0,a.jsxs)(`tr`,{children:[g?(0,a.jsx)(`th`,{className:`w-12 border-b border-r px-3 py-2 text-left text-xs font-medium text-muted-foreground`,children:`#`}):null,e.map(e=>(0,a.jsx)(`th`,{className:t.cn(`border-b border-r px-3 py-2 text-xs font-medium uppercase tracking-wide text-muted-foreground last:border-r-0`,o(e.align)),style:{width:e.width},children:e.label},e.key))]})}),(0,a.jsx)(`tbody`,{children:E.length?E.map((n,r)=>(0,a.jsxs)(`tr`,{"data-readonly":n.readOnly||void 0,className:`odd:bg-background even:bg-muted/18`,children:[g?(0,a.jsx)(`th`,{className:`border-r px-3 py-1.5 text-left text-xs font-medium text-muted-foreground`,children:r+1}):null,e.map(e=>{let i={rowKey:n.key,columnKey:e.key},s=D?.rowKey===n.key&&D.columnKey===e.key,c=n.cells[e.key]??``,l=h||n.readOnly||e.readOnly;return(0,a.jsx)(`td`,{"data-selected":s||void 0,className:`border-r border-t p-0 last:border-r-0 data-[selected=true]:ring-2 data-[selected=true]:ring-inset data-[selected=true]:ring-primary/55`,children:l&&e.formatter?(0,a.jsx)(`div`,{className:t.cn(`min-h-10 px-3 py-2`,o(e.align)),children:e.formatter(c,n)}):(0,a.jsx)(`input`,{"aria-label":`${String(e.label)} row ${r+1}`,value:c,readOnly:l,className:t.cn(`h-10 w-full bg-transparent px-3 outline-none transition focus:bg-background read-only:cursor-default`,o(e.align)),onFocus:()=>k(i),onChange:e=>A(i,e.target.value)})},e.key)})]},n.key)):(0,a.jsx)(`tr`,{children:(0,a.jsx)(`td`,{colSpan:e.length+ +!!g,className:`h-32 text-center text-sm text-muted-foreground`,children:y})})})]})}),_&&!h?(0,a.jsx)(n.Button,{type:`button`,className:`w-fit`,variant:`outline`,size:`sm`,leftIcon:(0,a.jsx)(i.PlusIcon,{}),onClick:j,children:v}):null]})}exports.Spreadsheet=c;

package/dist/src/components/modern/spreadsheet.js

@@ -0,0 +1,97 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "../ui/button/index.js";
+import * as n from "react";
+import { PlusIcon as r } from "lucide-react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/components/modern/spreadsheet.tsx
+function o(e) {
+	return e === "center" ? "text-center" : e === "right" ? "text-right" : "text-left";
+}
+function s(e, t) {
+	return {
+		key: `row-${Date.now()}-${t}`,
+		cells: Object.fromEntries(e.map((e) => [e.key, ""]))
+	};
+}
+function c({ columns: c, rows: l, defaultRows: u = [], onRowsChange: d, onCellChange: f, selectedCell: p, defaultSelectedCell: m, onSelectedCellChange: h, readOnly: g = !1, showRowNumbers: _ = !0, showAddRow: v = !0, addRowLabel: y = "Add row", empty: b = "No rows yet.", className: x, ...S }) {
+	let [C, w] = n.useState(u), [T, E] = n.useState(m), D = l ?? C, O = p ?? T, k = (e, t) => {
+		l === void 0 && w(e), d?.(e, t);
+	}, A = (e) => {
+		p === void 0 && E(e), h?.(e);
+	}, j = (e, t) => {
+		let n = D.map((n) => n.key === e.rowKey ? {
+			...n,
+			cells: {
+				...n.cells,
+				[e.columnKey]: t
+			}
+		} : n);
+		k(n, e), f?.(t, e, n);
+	}, M = () => {
+		k([...D, s(c, D.length + 1)]);
+	};
+	return /* @__PURE__ */ a("div", {
+		"data-slot": "spreadsheet",
+		className: e("grid min-w-0 gap-3 rounded-lg border bg-card p-3 shadow-sm", x),
+		...S,
+		children: [/* @__PURE__ */ i("div", {
+			className: "overflow-auto rounded-lg border",
+			children: /* @__PURE__ */ a("table", {
+				className: "w-full min-w-[48rem] border-collapse text-sm",
+				children: [/* @__PURE__ */ i("thead", {
+					className: "sticky top-0 z-10 bg-muted/80 backdrop-blur",
+					children: /* @__PURE__ */ a("tr", { children: [_ ? /* @__PURE__ */ i("th", {
+						className: "w-12 border-b border-r px-3 py-2 text-left text-xs font-medium text-muted-foreground",
+						children: "#"
+					}) : null, c.map((t) => /* @__PURE__ */ i("th", {
+						className: e("border-b border-r px-3 py-2 text-xs font-medium uppercase tracking-wide text-muted-foreground last:border-r-0", o(t.align)),
+						style: { width: t.width },
+						children: t.label
+					}, t.key))] })
+				}), /* @__PURE__ */ i("tbody", { children: D.length ? D.map((t, n) => /* @__PURE__ */ a("tr", {
+					"data-readonly": t.readOnly || void 0,
+					className: "odd:bg-background even:bg-muted/18",
+					children: [_ ? /* @__PURE__ */ i("th", {
+						className: "border-r px-3 py-1.5 text-left text-xs font-medium text-muted-foreground",
+						children: n + 1
+					}) : null, c.map((r) => {
+						let a = {
+							rowKey: t.key,
+							columnKey: r.key
+						}, s = O?.rowKey === t.key && O.columnKey === r.key, c = t.cells[r.key] ?? "", l = g || t.readOnly || r.readOnly;
+						return /* @__PURE__ */ i("td", {
+							"data-selected": s || void 0,
+							className: "border-r border-t p-0 last:border-r-0 data-[selected=true]:ring-2 data-[selected=true]:ring-inset data-[selected=true]:ring-primary/55",
+							children: l && r.formatter ? /* @__PURE__ */ i("div", {
+								className: e("min-h-10 px-3 py-2", o(r.align)),
+								children: r.formatter(c, t)
+							}) : /* @__PURE__ */ i("input", {
+								"aria-label": `${String(r.label)} row ${n + 1}`,
+								value: c,
+								readOnly: l,
+								className: e("h-10 w-full bg-transparent px-3 outline-none transition focus:bg-background read-only:cursor-default", o(r.align)),
+								onFocus: () => A(a),
+								onChange: (e) => j(a, e.target.value)
+							})
+						}, r.key);
+					})]
+				}, t.key)) : /* @__PURE__ */ i("tr", { children: /* @__PURE__ */ i("td", {
+					colSpan: c.length + +!!_,
+					className: "h-32 text-center text-sm text-muted-foreground",
+					children: b
+				}) }) })]
+			})
+		}), v && !g ? /* @__PURE__ */ i(t, {
+			type: "button",
+			className: "w-fit",
+			variant: "outline",
+			size: "sm",
+			leftIcon: /* @__PURE__ */ i(r, {}),
+			onClick: M,
+			children: y
+		}) : null]
+	});
+}
+//#endregion
+export { c as Spreadsheet };

package/dist/src/components/navigation/pagination.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){let n=Math.max(t-e+1,0);return Array.from({length:n},(t,n)=>n+e)}function s(e,t,n=1){if(t<=n*2+5)return o(1,t);let r=Math.max(e-n,1),i=Math.min(e+n,t),a=r>2,s=i<t-1;return!a&&s?[...o(1,n*2+3),`ellipsis`,t]:a&&!s?[1,`ellipsis`,...o(t-(n*2+3)+1,t)]:[1,`ellipsis`,...o(r,i),`ellipsis`,t]}function c({className:e,page:r,pageCount:o,onPageChange:c,siblingCount:l=1,showEdges:u=!0,disabled:d=!1,labels:f,compact:p=!1,totalCount:m,pageSize:h,pageSizeOptions:g,onPageSizeChange:_,showSummary:v=!1,...y}){let b=Math.max(o,1),x=Math.min(Math.max(r,1),b),S=s(x,b,l),C=e=>{let t=Math.min(Math.max(e,1),b);t!==x&&c(t)};return(0,a.jsxs)(`nav`,{"data-slot":`pagination`,"aria-label":`Pagination`,className:t.cn(`flex flex-wrap items-center justify-center gap-1 rounded-full border border-border/70 bg-background/76 p-1 shadow-none backdrop-blur`,e),...y,children:[v&&m!==void 0&&h?(0,a.jsxs)(`div`,{className:`px-2 text-xs text-muted-foreground`,children:[Math.min((x-1)*h+1,m),`-`,Math.min(x*h,m),` of `,m]}):null,u&&(0,a.jsx)(n.Button,{type:`button`,variant:`outline`,size:p?`icon-xs`:`icon-sm`,disabled:d||x<=1,"aria-label":f?.first??`First page`,onClick:()=>C(1),children:(0,a.jsx)(i.ChevronFirstIcon,{})}),(0,a.jsx)(n.Button,{type:`button`,variant:`outline`,size:p?`icon-xs`:`icon-sm`,disabled:d||x<=1,"aria-label":f?.previous??`Previous page`,onClick:()=>C(x-1),children:(0,a.jsx)(i.ChevronLeftIcon,{})}),S.map((e,r)=>e===`ellipsis`?(0,a.jsxs)(`span`,{"data-slot":`pagination-ellipsis`,className:`flex size-8 items-center justify-center text-muted-foreground`,children:[(0,a.jsx)(i.MoreHorizontalIcon,{className:`size-4`}),(0,a.jsx)(`span`,{className:`sr-only`,children:`More pages`})]},`ellipsis-${r}`):(0,a.jsx)(n.Button,{type:`button`,variant:e===x?`default`:`outline`,size:p?`icon-xs`:`icon-sm`,disabled:d,"aria-current":e===x?`page`:void 0,"aria-label":f?.page?.(e)??`Page ${e}`,onClick:()=>C(e),className:t.cn(e!==x&&`border-border/70 bg-background/80 shadow-none`),children:e},e)),(0,a.jsx)(n.Button,{type:`button`,variant:`outline`,size:p?`icon-xs`:`icon-sm`,disabled:d||x>=b,"aria-label":f?.next??`Next page`,onClick:()=>C(x+1),children:(0,a.jsx)(i.ChevronRightIcon,{})}),u&&(0,a.jsx)(n.Button,{type:`button`,variant:`outline`,size:p?`icon-xs`:`icon-sm`,disabled:d||x>=b,"aria-label":f?.last??`Last page`,onClick:()=>C(b),children:(0,a.jsx)(i.ChevronLastIcon,{})}),g&&h&&_?(0,a.jsxs)(`label`,{className:`ml-1 inline-flex items-center gap-2 rounded-full border border-border/70 bg-background/90 px-3 py-1 text-xs text-muted-foreground`,children:[(0,a.jsx)(`span`,{children:`Rows`}),(0,a.jsx)(`select`,{className:`bg-transparent text-foreground outline-none`,value:h,onChange:e=>_(Number(e.target.value)),disabled:d,children:g.map(e=>(0,a.jsx)(`option`,{value:e,children:e},e))})]}):null]})}exports.Pagination=c,exports.getPaginationItems=s;
+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){let n=Math.max(t-e+1,0);return Array.from({length:n},(t,n)=>n+e)}function s(e,t,n=1){if(t<=n*2+5)return o(1,t);let r=Math.max(e-n,1),i=Math.min(e+n,t),a=r>2,s=i<t-1;return!a&&s?[...o(1,n*2+3),`ellipsis`,t]:a&&!s?[1,`ellipsis`,...o(t-(n*2+3)+1,t)]:[1,`ellipsis`,...o(r,i),`ellipsis`,t]}function c({className:e,page:r,pageCount:o,onPageChange:c,siblingCount:l=1,showEdges:u=!0,disabled:d=!1,labels:f,compact:p=!1,totalCount:m,pageSize:h,pageSizeOptions:g,onPageSizeChange:_,showSummary:v=!1,...y}){let b=Math.max(o,1),x=Math.min(Math.max(r,1),b),S=s(x,b,l),C=e=>{let t=Math.min(Math.max(e,1),b);t!==x&&c(t)};return(0,a.jsxs)(`nav`,{"data-slot":`pagination`,"aria-label":`Pagination`,className:t.cn(`flex flex-wrap items-center justify-center gap-1.5 rounded-[var(--radius-lg)] border border-border/72 bg-background/84 p-1.5 shadow-[0_1px_2px_rgba(15,23,42,0.04)] backdrop-blur`,e),...y,children:[v&&m!==void 0&&h?(0,a.jsxs)(`div`,{className:`mr-1 rounded-[var(--radius-md)] bg-muted/55 px-2.5 py-1.5 text-xs font-medium text-muted-foreground`,children:[Math.min((x-1)*h+1,m),`-`,Math.min(x*h,m),` of `,m]}):null,u&&(0,a.jsx)(n.Button,{type:`button`,variant:`outline`,size:p?`icon-xs`:`icon-sm`,disabled:d||x<=1,"aria-label":f?.first??`First page`,onClick:()=>C(1),children:(0,a.jsx)(i.ChevronFirstIcon,{})}),(0,a.jsx)(n.Button,{type:`button`,variant:`outline`,size:p?`icon-xs`:`icon-sm`,disabled:d||x<=1,"aria-label":f?.previous??`Previous page`,onClick:()=>C(x-1),children:(0,a.jsx)(i.ChevronLeftIcon,{})}),S.map((e,r)=>e===`ellipsis`?(0,a.jsxs)(`span`,{"data-slot":`pagination-ellipsis`,className:`flex size-8 items-center justify-center text-muted-foreground`,children:[(0,a.jsx)(i.MoreHorizontalIcon,{className:`size-4`}),(0,a.jsx)(`span`,{className:`sr-only`,children:`More pages`})]},`ellipsis-${r}`):(0,a.jsx)(n.Button,{type:`button`,variant:e===x?`default`:`outline`,size:p?`icon-xs`:`icon-sm`,disabled:d,"aria-current":e===x?`page`:void 0,"aria-label":f?.page?.(e)??`Page ${e}`,onClick:()=>C(e),className:t.cn(`tabular-nums`,e===x&&`shadow-[0_8px_20px_rgba(15,23,42,0.14)]`,e!==x&&`border-border/70 bg-background/80 shadow-none hover:bg-muted/70`),children:e},e)),(0,a.jsx)(n.Button,{type:`button`,variant:`outline`,size:p?`icon-xs`:`icon-sm`,disabled:d||x>=b,"aria-label":f?.next??`Next page`,onClick:()=>C(x+1),children:(0,a.jsx)(i.ChevronRightIcon,{})}),u&&(0,a.jsx)(n.Button,{type:`button`,variant:`outline`,size:p?`icon-xs`:`icon-sm`,disabled:d||x>=b,"aria-label":f?.last??`Last page`,onClick:()=>C(b),children:(0,a.jsx)(i.ChevronLastIcon,{})}),g&&h&&_?(0,a.jsxs)(`label`,{className:`ml-1 inline-flex h-9 items-center gap-2 rounded-[var(--radius-md)] border border-border/70 bg-background/90 px-3 text-xs font-medium text-muted-foreground`,children:[(0,a.jsx)(`span`,{children:`Rows`}),(0,a.jsx)(`select`,{className:`rounded-sm bg-transparent text-foreground outline-none focus-visible:ring-2 focus-visible:ring-ring`,value:h,onChange:e=>_(Number(e.target.value)),disabled:d,children:g.map(e=>(0,a.jsx)(`option`,{value:e,children:e},e))})]}):null]})}exports.Pagination=c,exports.getPaginationItems=s;