tembro 1.0.0

package/dist/components/layout/sticky-footer-bar.js

@@ -0,0 +1,20 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/layout/sticky-footer-bar.tsx
+function r({ start: r, end: i, className: a, children: o, ...s }) {
+	return /* @__PURE__ */ n("div", {
+		"data-slot": "sticky-footer-bar",
+		className: e("sticky bottom-0 z-30 flex flex-wrap items-center justify-between gap-3 border-t bg-background px-4 py-3 shadow-lg", a),
+		...s,
+		children: [/* @__PURE__ */ t("div", {
+			className: "min-w-0 flex-1",
+			children: r ?? o
+		}), i && /* @__PURE__ */ t("div", {
+			className: "flex shrink-0 items-center gap-2",
+			children: i
+		})]
+	});
+}
+//#endregion
+export { r as StickyFooterBar };

package/dist/components/modern/affix.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");function i({offsetTop:e=0,zIndex:n=30,className:i,style:a,...o}){return(0,r.jsx)(`div`,{"data-slot":`affix`,className:t.cn(`sticky`,i),style:{top:e,zIndex:n,...a},...o})}exports.Affix=i;

package/dist/components/modern/affix.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+export type AffixProps = React.ComponentProps<"div"> & {
+    offsetTop?: number;
+    zIndex?: number;
+};
+declare function Affix({ offsetTop, zIndex, className, style, ...props }: AffixProps): React.JSX.Element;
+export { Affix };

package/dist/components/modern/affix.js

@@ -0,0 +1,18 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/modern/affix.tsx
+function n({ offsetTop: n = 0, zIndex: r = 30, className: i, style: a, ...o }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "affix",
+		className: e("sticky", i),
+		style: {
+			top: n,
+			zIndex: r,
+			...a
+		},
+		...o
+	});
+}
+//#endregion
+export { n as Affix };

package/dist/components/modern/calendar-scheduler.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");var i={default:`border-border bg-muted`,success:`border-emerald-200 bg-emerald-50 text-emerald-700 dark:border-emerald-900 dark:bg-emerald-950 dark:text-emerald-300`,warning:`border-amber-200 bg-amber-50 text-amber-700 dark:border-amber-900 dark:bg-amber-950 dark:text-amber-300`,danger:`border-red-200 bg-red-50 text-red-700 dark:border-red-900 dark:bg-red-950 dark:text-red-300`};function a({events:e,days:n,className:a,...o}){let s=n??Array.from(new Set(e.map(e=>e.date)));return(0,r.jsx)(`div`,{"data-slot":`calendar-scheduler`,className:t.cn(`grid gap-3`,a),...o,children:s.map(n=>(0,r.jsxs)(`section`,{className:`rounded-xl border bg-card p-3`,children:[(0,r.jsx)(`div`,{className:`mb-2 text-sm font-semibold`,children:n}),(0,r.jsx)(`div`,{className:`grid gap-2`,children:e.filter(e=>e.date===n).map(e=>(0,r.jsxs)(`div`,{className:t.cn(`rounded-md border px-3 py-2 text-sm`,i[e.tone??`default`]),children:[(0,r.jsx)(`div`,{className:`font-medium`,children:e.title}),e.time&&(0,r.jsx)(`div`,{className:`text-xs opacity-70`,children:e.time})]},e.id))})]},n))})}exports.CalendarScheduler=a;

package/dist/components/modern/calendar-scheduler.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+export type CalendarSchedulerEvent = {
+    id: string;
+    title: React.ReactNode;
+    date: string;
+    time?: string;
+    tone?: "default" | "success" | "warning" | "danger";
+};
+export type CalendarSchedulerProps = React.ComponentProps<"div"> & {
+    events: CalendarSchedulerEvent[];
+    days?: string[];
+};
+declare function CalendarScheduler({ events, days, className, ...props }: CalendarSchedulerProps): React.JSX.Element;
+export { CalendarScheduler };

package/dist/components/modern/calendar-scheduler.js

@@ -0,0 +1,39 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/modern/calendar-scheduler.tsx
+var r = {
+	default: "border-border bg-muted",
+	success: "border-emerald-200 bg-emerald-50 text-emerald-700 dark:border-emerald-900 dark:bg-emerald-950 dark:text-emerald-300",
+	warning: "border-amber-200 bg-amber-50 text-amber-700 dark:border-amber-900 dark:bg-amber-950 dark:text-amber-300",
+	danger: "border-red-200 bg-red-50 text-red-700 dark:border-red-900 dark:bg-red-950 dark:text-red-300"
+};
+function i({ events: i, days: a, className: o, ...s }) {
+	let c = a ?? Array.from(new Set(i.map((e) => e.date)));
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "calendar-scheduler",
+		className: e("grid gap-3", o),
+		...s,
+		children: c.map((a) => /* @__PURE__ */ n("section", {
+			className: "rounded-xl border bg-card p-3",
+			children: [/* @__PURE__ */ t("div", {
+				className: "mb-2 text-sm font-semibold",
+				children: a
+			}), /* @__PURE__ */ t("div", {
+				className: "grid gap-2",
+				children: i.filter((e) => e.date === a).map((i) => /* @__PURE__ */ n("div", {
+					className: e("rounded-md border px-3 py-2 text-sm", r[i.tone ?? "default"]),
+					children: [/* @__PURE__ */ t("div", {
+						className: "font-medium",
+						children: i.title
+					}), i.time && /* @__PURE__ */ t("div", {
+						className: "text-xs opacity-70",
+						children: i.time
+					})]
+				}, i.id))
+			})]
+		}, a))
+	});
+}
+//#endregion
+export { i as CalendarScheduler };

package/dist/components/modern/dual-list-picker.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");function i({items:e,picked:n=[],onPickedChange:i,availableTitle:a=`Available`,pickedTitle:o=`Selected`,className:s,...c}){let l=new Set(n),u=e.filter(e=>!l.has(e.value)),d=e.filter(e=>l.has(e.value));function f(e){let t=l.has(e)?n.filter(t=>t!==e):[...n,e];i?.(t)}let p=(e,t)=>(0,r.jsxs)(`div`,{className:`min-h-48 rounded-lg border bg-card`,children:[(0,r.jsx)(`div`,{className:`border-b px-3 py-2 text-sm font-medium`,children:e}),(0,r.jsx)(`div`,{className:`grid gap-1 p-2`,children:t.map(e=>(0,r.jsxs)(`button`,{type:`button`,disabled:e.disabled,className:`flex items-center justify-between rounded-md px-2 py-1.5 text-left text-sm hover:bg-muted disabled:opacity-50`,onClick:()=>f(e.value),children:[(0,r.jsx)(`span`,{children:e.label}),(0,r.jsx)(`span`,{className:`text-muted-foreground`,children:l.has(e.value)?`−`:`+`})]},e.value))})]});return(0,r.jsxs)(`div`,{"data-slot":`dual-list-picker`,className:t.cn(`grid gap-3 md:grid-cols-2`,s),...c,children:[p(a,u),p(o,d)]})}exports.DualListPicker=i;

package/dist/components/modern/dual-list-picker.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+export type DualListItem = {
+    label: React.ReactNode;
+    value: string;
+    disabled?: boolean;
+};
+export type DualListPickerProps = React.ComponentProps<"div"> & {
+    items: DualListItem[];
+    picked?: string[];
+    onPickedChange?: (value: string[]) => void;
+    availableTitle?: React.ReactNode;
+    pickedTitle?: React.ReactNode;
+};
+declare function DualListPicker({ items, picked, onPickedChange, availableTitle, pickedTitle, className, ...props }: DualListPickerProps): React.JSX.Element;
+export { DualListPicker };

package/dist/components/modern/dual-list-picker.js

@@ -0,0 +1,38 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/modern/dual-list-picker.tsx
+function r({ items: r, picked: i = [], onPickedChange: a, availableTitle: o = "Available", pickedTitle: s = "Selected", className: c, ...l }) {
+	let u = new Set(i), d = r.filter((e) => !u.has(e.value)), f = r.filter((e) => u.has(e.value));
+	function p(e) {
+		let t = u.has(e) ? i.filter((t) => t !== e) : [...i, e];
+		a?.(t);
+	}
+	let m = (e, r) => /* @__PURE__ */ n("div", {
+		className: "min-h-48 rounded-lg border bg-card",
+		children: [/* @__PURE__ */ t("div", {
+			className: "border-b px-3 py-2 text-sm font-medium",
+			children: e
+		}), /* @__PURE__ */ t("div", {
+			className: "grid gap-1 p-2",
+			children: r.map((e) => /* @__PURE__ */ n("button", {
+				type: "button",
+				disabled: e.disabled,
+				className: "flex items-center justify-between rounded-md px-2 py-1.5 text-left text-sm hover:bg-muted disabled:opacity-50",
+				onClick: () => p(e.value),
+				children: [/* @__PURE__ */ t("span", { children: e.label }), /* @__PURE__ */ t("span", {
+					className: "text-muted-foreground",
+					children: u.has(e.value) ? "−" : "+"
+				})]
+			}, e.value))
+		})]
+	});
+	return /* @__PURE__ */ n("div", {
+		"data-slot": "dual-list-picker",
+		className: e("grid gap-3 md:grid-cols-2", c),
+		...l,
+		children: [m(o, d), m(s, f)]
+	});
+}
+//#endregion
+export { r as DualListPicker };

package/dist/components/modern/index.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../display/aspect-ratio.cjs"),t=require("../display/carousel.cjs"),n=require("../display/float-button.cjs"),r=require("../display/qr-code.cjs"),i=require("../display/tag.cjs"),a=require("../display/typography.cjs"),o=require("../display/watermark.cjs"),s=require("./affix.cjs"),c=require("./calendar-scheduler.cjs"),l=require("./dual-list-picker.cjs"),u=require("./menubar.cjs"),d=require("./navigation-menu.cjs"),f=require("./resizable-panel.cjs"),p=require("./rich-text-editor.cjs"),m=require("./tour.cjs");exports.Affix=s.Affix,exports.AspectRatio=e.AspectRatio,exports.Blockquote=a.Blockquote,exports.CalendarScheduler=c.CalendarScheduler,exports.Carousel=t.Carousel,exports.CarouselItem=t.CarouselItem,exports.Chip=i.Chip,exports.DualListPicker=l.DualListPicker,exports.FloatButton=n.FloatButton,exports.Heading=a.Heading,exports.Mark=a.Mark,exports.Menubar=u.Menubar,exports.MenubarContent=u.MenubarContent,exports.MenubarItem=u.MenubarItem,exports.MenubarMenu=u.MenubarMenu,exports.MenubarTrigger=u.MenubarTrigger,exports.NavigationMenu=d.NavigationMenu,exports.NavigationMenuItem=d.NavigationMenuItem,exports.NavigationMenuLink=d.NavigationMenuLink,exports.NavigationMenuList=d.NavigationMenuList,exports.QRCode=r.QRCode,exports.QRCodeSvg=r.QRCodeSvg,exports.ResizableHandle=f.ResizableHandle,exports.ResizablePanel=f.ResizablePanel,exports.ResizablePanelGroup=f.ResizablePanelGroup,exports.RichTextEditor=p.RichTextEditor,exports.Spoiler=a.Spoiler,exports.SpoilerSummary=a.SpoilerSummary,exports.Tag=i.Tag,exports.TagGroup=i.TagGroup,exports.Text=a.Text,exports.Tour=m.Tour,exports.Watermark=o.Watermark;

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

@@ -0,0 +1,15 @@
+export * from "../display/aspect-ratio";
+export * from "../display/carousel";
+export * from "../display/float-button";
+export * from "../display/qr-code";
+export * from "../display/tag";
+export * from "../display/typography";
+export * from "../display/watermark";
+export * from "./affix";
+export * from "./calendar-scheduler";
+export * from "./dual-list-picker";
+export * from "./menubar";
+export * from "./navigation-menu";
+export * from "./resizable-panel";
+export * from "./rich-text-editor";
+export * from "./tour";

package/dist/components/modern/index.js

@@ -0,0 +1,16 @@
+import { AspectRatio as e } from "../display/aspect-ratio.js";
+import { Carousel as t, CarouselItem as n } from "../display/carousel.js";
+import { FloatButton as r } from "../display/float-button.js";
+import { QRCode as i, QRCodeSvg as a } from "../display/qr-code.js";
+import { Chip as o, Tag as s, TagGroup as c } from "../display/tag.js";
+import { Blockquote as l, Heading as u, Mark as d, Spoiler as f, SpoilerSummary as p, Text as m } from "../display/typography.js";
+import { Watermark as h } from "../display/watermark.js";
+import { Affix as g } from "./affix.js";
+import { CalendarScheduler as _ } from "./calendar-scheduler.js";
+import { DualListPicker as v } from "./dual-list-picker.js";
+import { Menubar as y, MenubarContent as b, MenubarItem as x, MenubarMenu as S, MenubarTrigger as C } from "./menubar.js";
+import { NavigationMenu as w, NavigationMenuItem as T, NavigationMenuLink as E, NavigationMenuList as D } from "./navigation-menu.js";
+import { ResizableHandle as O, ResizablePanel as k, ResizablePanelGroup as A } from "./resizable-panel.js";
+import { RichTextEditor as j } from "./rich-text-editor.js";
+import { Tour as M } from "./tour.js";
+export { g as Affix, e as AspectRatio, l as Blockquote, _ as CalendarScheduler, t as Carousel, n as CarouselItem, o as Chip, v as DualListPicker, r as FloatButton, u as Heading, d as Mark, y as Menubar, b as MenubarContent, x as MenubarItem, S as MenubarMenu, C as MenubarTrigger, w as NavigationMenu, T as NavigationMenuItem, E as NavigationMenuLink, D as NavigationMenuList, i as QRCode, a as QRCodeSvg, O as ResizableHandle, k as ResizablePanel, A as ResizablePanelGroup, j as RichTextEditor, f as Spoiler, p as SpoilerSummary, s as Tag, c as TagGroup, m as Text, M as Tour, h as Watermark };

package/dist/components/modern/menubar.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");function i({className:e,...n}){return(0,r.jsx)(`nav`,{"data-slot":`menubar`,className:t.cn(`flex items-center gap-1 rounded-md border bg-background p-1`,e),...n})}function a({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`menubar-menu`,className:t.cn(`relative`,e),...n})}function o({className:e,...n}){return(0,r.jsx)(`button`,{type:`button`,"data-slot":`menubar-trigger`,className:t.cn(`rounded-sm px-3 py-1.5 text-sm font-medium hover:bg-muted`,e),...n})}function s({className:e,...n}){return(0,r.jsx)(`div`,{"data-slot":`menubar-content`,className:t.cn(`absolute left-0 top-full z-50 mt-1 min-w-40 rounded-md border bg-popover p-1 text-popover-foreground shadow-md`,e),...n})}function c({className:e,...n}){return(0,r.jsx)(`button`,{type:`button`,"data-slot":`menubar-item`,className:t.cn(`flex w-full items-center rounded-sm px-2 py-1.5 text-left text-sm hover:bg-muted`,e),...n})}exports.Menubar=i,exports.MenubarContent=s,exports.MenubarItem=c,exports.MenubarMenu=a,exports.MenubarTrigger=o;

package/dist/components/modern/menubar.d.ts

@@ -0,0 +1,12 @@
+import * as React from "react";
+export type MenubarProps = React.ComponentProps<"nav">;
+export type MenubarMenuProps = React.ComponentProps<"div">;
+export type MenubarTriggerProps = React.ComponentProps<"button">;
+export type MenubarContentProps = React.ComponentProps<"div">;
+export type MenubarItemProps = React.ComponentProps<"button">;
+declare function Menubar({ className, ...props }: MenubarProps): React.JSX.Element;
+declare function MenubarMenu({ className, ...props }: MenubarMenuProps): React.JSX.Element;
+declare function MenubarTrigger({ className, ...props }: MenubarTriggerProps): React.JSX.Element;
+declare function MenubarContent({ className, ...props }: MenubarContentProps): React.JSX.Element;
+declare function MenubarItem({ className, ...props }: MenubarItemProps): React.JSX.Element;
+export { Menubar, MenubarContent, MenubarItem, MenubarMenu, MenubarTrigger };

package/dist/components/modern/menubar.js

@@ -0,0 +1,43 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/modern/menubar.tsx
+function n({ className: n, ...r }) {
+	return /* @__PURE__ */ t("nav", {
+		"data-slot": "menubar",
+		className: e("flex items-center gap-1 rounded-md border bg-background p-1", n),
+		...r
+	});
+}
+function r({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "menubar-menu",
+		className: e("relative", n),
+		...r
+	});
+}
+function i({ className: n, ...r }) {
+	return /* @__PURE__ */ t("button", {
+		type: "button",
+		"data-slot": "menubar-trigger",
+		className: e("rounded-sm px-3 py-1.5 text-sm font-medium hover:bg-muted", n),
+		...r
+	});
+}
+function a({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "menubar-content",
+		className: e("absolute left-0 top-full z-50 mt-1 min-w-40 rounded-md border bg-popover p-1 text-popover-foreground shadow-md", n),
+		...r
+	});
+}
+function o({ className: n, ...r }) {
+	return /* @__PURE__ */ t("button", {
+		type: "button",
+		"data-slot": "menubar-item",
+		className: e("flex w-full items-center rounded-sm px-2 py-1.5 text-left text-sm hover:bg-muted", n),
+		...r
+	});
+}
+//#endregion
+export { n as Menubar, a as MenubarContent, o as MenubarItem, r as MenubarMenu, i as MenubarTrigger };

package/dist/components/modern/navigation-menu.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");function i({className:e,...n}){return(0,r.jsx)(`nav`,{"data-slot":`navigation-menu`,className:t.cn(`flex items-center`,e),...n})}function a({className:e,...n}){return(0,r.jsx)(`ul`,{"data-slot":`navigation-menu-list`,className:t.cn(`flex items-center gap-1`,e),...n})}function o(e){return(0,r.jsx)(`li`,{"data-slot":`navigation-menu-item`,...e})}function s({active:e,className:n,...i}){return(0,r.jsx)(`a`,{"data-slot":`navigation-menu-link`,"data-active":e?`true`:void 0,className:t.cn(`rounded-md px-3 py-2 text-sm font-medium text-muted-foreground hover:bg-muted hover:text-foreground`,e&&`bg-muted text-foreground`,n),...i})}exports.NavigationMenu=i,exports.NavigationMenuItem=o,exports.NavigationMenuLink=s,exports.NavigationMenuList=a;

package/dist/components/modern/navigation-menu.d.ts

@@ -0,0 +1,12 @@
+import * as React from "react";
+export type NavigationMenuProps = React.ComponentProps<"nav">;
+export type NavigationMenuListProps = React.ComponentProps<"ul">;
+export type NavigationMenuItemProps = React.ComponentProps<"li">;
+export type NavigationMenuLinkProps = React.ComponentProps<"a"> & {
+    active?: boolean;
+};
+declare function NavigationMenu({ className, ...props }: NavigationMenuProps): React.JSX.Element;
+declare function NavigationMenuList({ className, ...props }: NavigationMenuListProps): React.JSX.Element;
+declare function NavigationMenuItem(props: NavigationMenuItemProps): React.JSX.Element;
+declare function NavigationMenuLink({ active, className, ...props }: NavigationMenuLinkProps): React.JSX.Element;
+export { NavigationMenu, NavigationMenuItem, NavigationMenuLink, NavigationMenuList };

package/dist/components/modern/navigation-menu.js

@@ -0,0 +1,34 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/modern/navigation-menu.tsx
+function n({ className: n, ...r }) {
+	return /* @__PURE__ */ t("nav", {
+		"data-slot": "navigation-menu",
+		className: e("flex items-center", n),
+		...r
+	});
+}
+function r({ className: n, ...r }) {
+	return /* @__PURE__ */ t("ul", {
+		"data-slot": "navigation-menu-list",
+		className: e("flex items-center gap-1", n),
+		...r
+	});
+}
+function i(e) {
+	return /* @__PURE__ */ t("li", {
+		"data-slot": "navigation-menu-item",
+		...e
+	});
+}
+function a({ active: n, className: r, ...i }) {
+	return /* @__PURE__ */ t("a", {
+		"data-slot": "navigation-menu-link",
+		"data-active": n ? "true" : void 0,
+		className: e("rounded-md px-3 py-2 text-sm font-medium text-muted-foreground hover:bg-muted hover:text-foreground", n && "bg-muted text-foreground", r),
+		...i
+	});
+}
+//#endregion
+export { n as NavigationMenu, i as NavigationMenuItem, a as NavigationMenuLink, r as NavigationMenuList };

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

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("lucide-react"),i=require("react/jsx-runtime");var a=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,...c}){let l=n.useContext(a),u=Number(c[`data-panel-index`]??0),d=l?l.getSize(u):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:`${d}%`,flexGrow:0,flexShrink:0,...r},...c})}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;

package/dist/components/modern/resizable-panel.d.ts

@@ -0,0 +1,18 @@
+import * as React from "react";
+export type ResizablePanelGroupProps = React.ComponentProps<"div"> & {
+    direction?: "horizontal" | "vertical";
+};
+export type ResizablePanelProps = React.ComponentProps<"div"> & {
+    defaultSize?: number | string;
+    minSize?: number;
+};
+type ResizablePanelInternalProps = ResizablePanelProps & {
+    "data-panel-index"?: number;
+};
+type ResizableHandleProps = React.ComponentProps<"button"> & {
+    "data-handle-index"?: number;
+};
+declare function ResizablePanelGroup({ direction, className, children, ...props }: ResizablePanelGroupProps): React.JSX.Element;
+declare function ResizablePanel({ className, style, defaultSize, ...props }: ResizablePanelInternalProps): React.JSX.Element;
+declare function ResizableHandle({ className, ...props }: ResizableHandleProps): React.JSX.Element;
+export { ResizableHandle, ResizablePanel, ResizablePanelGroup };

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

@@ -0,0 +1,112 @@
+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";
+//#region src/components/modern/resizable-panel.tsx
+var i = t.createContext(null);
+function a(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;
+		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(() => {
+		_(m);
+	}, [m]);
+	let v = t.useCallback((e, t) => {
+		let r = d.current;
+		if (!r || e < 0 || e >= p - 1) return;
+		let i = n === "horizontal" ? r.getBoundingClientRect().width : r.getBoundingClientRect().height;
+		if (!i) return;
+		let a = t / i * 100;
+		_((t) => {
+			let n = [...t], r = n[e] ?? 0, i = n[e + 1] ?? 0, o = h[e] ?? 15, s = h[e + 1] ?? 15, c = r + a, l = Math.min(Math.max(c, o), r + i - s), u = l - r;
+			return n[e] = l, n[e + 1] = i - u, n;
+		});
+	}, [
+		n,
+		h,
+		p
+	]), y = t.Children.map(l, (e) => {
+		if (!t.isValidElement(e)) return e;
+		if (e.type === s) {
+			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;
+			return t.cloneElement(e, { "data-handle-index": n });
+		}
+		return e;
+	});
+	return /* @__PURE__ */ r(i.Provider, {
+		value: {
+			direction: n,
+			getSize: (e) => g[e] ?? 100 / Math.max(p, 1),
+			resizePanels: v
+		},
+		children: /* @__PURE__ */ r("div", {
+			ref: d,
+			"data-slot": "resizable-panel-group",
+			"data-direction": n,
+			className: e("flex gap-2", n === "horizontal" ? "flex-row items-stretch" : "flex-col", o),
+			...u,
+			children: y
+		})
+	});
+}
+function s({ className: n, style: o, defaultSize: s, ...c }) {
+	let l = t.useContext(i), u = Number(c["data-panel-index"] ?? 0), d = l ? l.getSize(u) : a(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),
+		style: {
+			flexBasis: `${d}%`,
+			flexGrow: 0,
+			flexShrink: 0,
+			...o
+		},
+		...c
+	});
+}
+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", {
+		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),
+		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: /* @__PURE__ */ r(n, { className: e("size-3", s?.direction === "vertical" && "rotate-90") })
+	});
+}
+//#endregion
+export { c as ResizableHandle, s as ResizablePanel, o as ResizablePanelGroup };

package/dist/components/modern/rich-text-editor.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");function i({value:e,onValueChange:i,placeholder:a=`Write something...`,className:o,...s}){let c=n.useRef(null);return n.useEffect(()=>{c.current&&e!==void 0&&c.current.innerHTML!==e&&(c.current.innerHTML=e)},[e]),(0,r.jsxs)(`div`,{"data-slot":`rich-text-editor`,className:t.cn(`grid gap-2 rounded-lg border bg-background p-2`,o),...s,children:[(0,r.jsx)(`div`,{className:`flex flex-wrap gap-1 border-b pb-2`,children:[[`bold`,`B`],[`italic`,`I`],[`underline`,`U`]].map(([e,t])=>(0,r.jsx)(`button`,{type:`button`,className:`rounded border px-2 py-1 text-xs font-medium`,onClick:()=>document.execCommand(e),children:t},e))}),(0,r.jsx)(`div`,{ref:c,contentEditable:!0,"data-placeholder":a,className:`min-h-32 rounded-md p-2 text-sm outline-none empty:before:text-muted-foreground empty:before:content-[attr(data-placeholder)]`,onInput:e=>i?.(e.currentTarget.innerHTML)})]})}exports.RichTextEditor=i;

package/dist/components/modern/rich-text-editor.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+export type RichTextEditorProps = Omit<React.ComponentProps<"div">, "onChange"> & {
+    value?: string;
+    onValueChange?: (value: string) => void;
+    placeholder?: string;
+};
+declare function RichTextEditor({ value, onValueChange, placeholder, className, ...props }: RichTextEditorProps): React.JSX.Element;
+export { RichTextEditor };

package/dist/components/modern/rich-text-editor.js

@@ -0,0 +1,35 @@
+import { cn as e } from "../../lib/utils.js";
+import * as t from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/components/modern/rich-text-editor.tsx
+function i({ value: i, onValueChange: a, placeholder: o = "Write something...", className: s, ...c }) {
+	let l = t.useRef(null);
+	return t.useEffect(() => {
+		l.current && i !== void 0 && l.current.innerHTML !== i && (l.current.innerHTML = i);
+	}, [i]), /* @__PURE__ */ r("div", {
+		"data-slot": "rich-text-editor",
+		className: e("grid gap-2 rounded-lg border bg-background p-2", s),
+		...c,
+		children: [/* @__PURE__ */ n("div", {
+			className: "flex flex-wrap gap-1 border-b pb-2",
+			children: [
+				["bold", "B"],
+				["italic", "I"],
+				["underline", "U"]
+			].map(([e, t]) => /* @__PURE__ */ n("button", {
+				type: "button",
+				className: "rounded border px-2 py-1 text-xs font-medium",
+				onClick: () => document.execCommand(e),
+				children: t
+			}, e))
+		}), /* @__PURE__ */ n("div", {
+			ref: l,
+			contentEditable: !0,
+			"data-placeholder": o,
+			className: "min-h-32 rounded-md p-2 text-sm outline-none empty:before:text-muted-foreground empty:before:content-[attr(data-placeholder)]",
+			onInput: (e) => a?.(e.currentTarget.innerHTML)
+		})]
+	});
+}
+//#endregion
+export { i as RichTextEditor };

package/dist/components/modern/tour.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");function i({steps:e,index:n=0,onIndexChange:i,onClose:a,className:o,...s}){let c=e[n];return c?(0,r.jsx)(`div`,{"data-slot":`tour`,className:t.cn(`rounded-xl border bg-popover p-4 text-popover-foreground shadow-lg`,o),...s,children:(0,r.jsxs)(`div`,{className:`grid gap-2`,children:[(0,r.jsx)(`div`,{className:`font-semibold`,children:c.title}),c.description&&(0,r.jsx)(`div`,{className:`text-sm text-muted-foreground`,children:c.description}),(0,r.jsxs)(`div`,{className:`flex items-center justify-between gap-3 pt-2`,children:[(0,r.jsxs)(`span`,{className:`text-xs text-muted-foreground`,children:[n+1,` / `,e.length]}),(0,r.jsxs)(`div`,{className:`flex gap-2`,children:[(0,r.jsx)(`button`,{type:`button`,className:`rounded-md border px-2.5 py-1 text-sm`,disabled:n===0,onClick:()=>i?.(n-1),children:`Back`}),n<e.length-1?(0,r.jsx)(`button`,{type:`button`,className:`rounded-md bg-primary px-2.5 py-1 text-sm text-primary-foreground`,onClick:()=>i?.(n+1),children:`Next`}):(0,r.jsx)(`button`,{type:`button`,className:`rounded-md bg-primary px-2.5 py-1 text-sm text-primary-foreground`,onClick:a,children:`Done`})]})]})]})}):null}exports.Tour=i;

package/dist/components/modern/tour.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+export type TourStep = {
+    title: React.ReactNode;
+    description?: React.ReactNode;
+};
+export type TourProps = React.ComponentProps<"div"> & {
+    steps: TourStep[];
+    index?: number;
+    onIndexChange?: (index: number) => void;
+    onClose?: () => void;
+};
+declare function Tour({ steps, index, onIndexChange, onClose, className, ...props }: TourProps): React.JSX.Element | null;
+export { Tour };

package/dist/components/modern/tour.js

@@ -0,0 +1,57 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/modern/tour.tsx
+function r({ steps: r, index: i = 0, onIndexChange: a, onClose: o, className: s, ...c }) {
+	let l = r[i];
+	return l ? /* @__PURE__ */ t("div", {
+		"data-slot": "tour",
+		className: e("rounded-xl border bg-popover p-4 text-popover-foreground shadow-lg", s),
+		...c,
+		children: /* @__PURE__ */ n("div", {
+			className: "grid gap-2",
+			children: [
+				/* @__PURE__ */ t("div", {
+					className: "font-semibold",
+					children: l.title
+				}),
+				l.description && /* @__PURE__ */ t("div", {
+					className: "text-sm text-muted-foreground",
+					children: l.description
+				}),
+				/* @__PURE__ */ n("div", {
+					className: "flex items-center justify-between gap-3 pt-2",
+					children: [/* @__PURE__ */ n("span", {
+						className: "text-xs text-muted-foreground",
+						children: [
+							i + 1,
+							" / ",
+							r.length
+						]
+					}), /* @__PURE__ */ n("div", {
+						className: "flex gap-2",
+						children: [/* @__PURE__ */ t("button", {
+							type: "button",
+							className: "rounded-md border px-2.5 py-1 text-sm",
+							disabled: i === 0,
+							onClick: () => a?.(i - 1),
+							children: "Back"
+						}), i < r.length - 1 ? /* @__PURE__ */ t("button", {
+							type: "button",
+							className: "rounded-md bg-primary px-2.5 py-1 text-sm text-primary-foreground",
+							onClick: () => a?.(i + 1),
+							children: "Next"
+						}) : /* @__PURE__ */ t("button", {
+							type: "button",
+							className: "rounded-md bg-primary px-2.5 py-1 text-sm text-primary-foreground",
+							onClick: o,
+							children: "Done"
+						})]
+					})]
+				})
+			]
+		})
+	}) : null;
+}
+//#endregion
+export { r as Tour };

package/dist/components/navigation/anchor-nav.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");function i({items:e,orientation:n=`vertical`,title:i,className:a,...o}){return(0,r.jsxs)(`nav`,{"data-slot":`anchor-nav`,className:t.cn(`grid gap-2 text-sm`,n===`horizontal`&&`flex flex-wrap`,a),...o,children:[i&&(0,r.jsx)(`div`,{className:`text-xs font-medium uppercase tracking-wide text-muted-foreground`,children:i}),(0,r.jsx)(`div`,{className:t.cn(`grid gap-1`,n===`horizontal`&&`flex flex-wrap`),children:e.map(e=>(0,r.jsx)(`a`,{href:e.disabled?void 0:e.href,"aria-current":e.active?`location`:void 0,"aria-disabled":e.disabled||void 0,className:t.cn(`rounded-md px-2 py-1.5 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground`,e.active&&`bg-muted text-foreground`,e.disabled&&`pointer-events-none opacity-50`),children:e.label},e.key))})]})}exports.AnchorNav=i;

package/dist/components/navigation/anchor-nav.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+export type AnchorNavItem = {
+    key: string;
+    label: React.ReactNode;
+    href: string;
+    active?: boolean;
+    disabled?: boolean;
+};
+export type AnchorNavProps = React.ComponentProps<"nav"> & {
+    items: AnchorNavItem[];
+    orientation?: "vertical" | "horizontal";
+    title?: React.ReactNode;
+};
+declare function AnchorNav({ items, orientation, title, className, ...props }: AnchorNavProps): React.JSX.Element;
+export { AnchorNav };