tempest-react-sdk 0.23.0 → 0.24.0

package/dist/components/Layout/Layout.js

@@ -1,72 +1,56 @@
-import { jsx as m } from "react/jsx-runtime";
-import { cn as b } from "../../utils/cn.js";
-import { useBreakpoint as k } from "../../hooks/use-breakpoint.js";
-import e from "./Layout.module.css.js";
-function R({ size: t = "lg", className: i, children: r, ...n }) {
-  return /* @__PURE__ */ m("div", { className: b(e.container, e[t], i), ...n, children: r });
-}
-function x(t) {
-  return typeof t == "object" && t !== null && ("mobile" in t || "tablet" in t || "desktop" in t);
-}
-function s(t, i) {
-  if (t !== void 0)
-    return x(t) ? i === "desktop" ? t.desktop ?? t.tablet ?? t.mobile : i === "tablet" ? t.tablet ?? t.mobile ?? t.desktop : t.mobile ?? t.tablet ?? t.desktop : t;
-}
-function y(t) {
-  if (t !== void 0)
-    return typeof t == "number" ? `${t * 4}px` : t;
-}
-function C(t, i) {
-  return t ? "mobile" : i ? "tablet" : "desktop";
-}
-function $({
-  direction: t = "vertical",
-  gap: i = 2,
-  align: r,
-  justify: n,
-  wrap: c = !1,
-  className: f,
-  style: p,
-  children: a,
-  ...o
-}) {
-  const { isMobile: l, isTablet: d } = k(), u = C(l, d), j = s(t, u) ?? "vertical", v = { gap: y(s(i, u)), ...p }, G = n === "between" ? e.justifyBetween : n === "center" ? e.justifyCenter : n === "end" ? e.justifyEnd : n === "start" ? e.justifyStart : void 0;
-  return /* @__PURE__ */ m(
-    "div",
-    {
-      className: b(
-        e.stack,
-        j === "vertical" ? e.vertical : e.horizontal,
-        r && e[r],
-        G,
-        c && e.wrap,
-        f
-      ),
-      style: v,
-      ...o,
-      children: a
-    }
-  );
-}
-function w(t) {
-  if (t !== void 0)
-    return typeof t == "number" ? `repeat(${t}, minmax(0, 1fr))` : t;
-}
-function g({ columns: t = 2, gap: i = 4, className: r, style: n, children: c, ...f }) {
-  const { isMobile: p, isTablet: a } = k(), o = C(p, a), l = w(s(t, o)), d = y(s(i, o));
-  return /* @__PURE__ */ m(
-    "div",
-    {
-      className: b(e.grid, r),
-      style: { gridTemplateColumns: l, gap: d, ...n },
-      ...f,
-      children: c
-    }
-  );
-}
-export {
-  R as Container,
-  g as Grid,
-  $ as Stack
-};
-//# sourceMappingURL=Layout.js.map
+import { cn as e } from "../../utils/cn.js";
+import { useBreakpoint as t } from "../../hooks/use-breakpoint.js";
+import n from "./Layout.module.js";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/Layout/Layout.tsx
+function i({ size: t = "lg", className: i, children: a, ...o }) {
+	return /* @__PURE__ */ r("div", {
+		className: e(n.container, n[t], i),
+		...o,
+		children: a
+	});
+}
+function a(e) {
+	return typeof e == "object" && !!e && ("mobile" in e || "tablet" in e || "desktop" in e);
+}
+function o(e, t) {
+	if (e !== void 0) return a(e) ? t === "desktop" ? e.desktop ?? e.tablet ?? e.mobile : t === "tablet" ? e.tablet ?? e.mobile ?? e.desktop : e.mobile ?? e.tablet ?? e.desktop : e;
+}
+function s(e) {
+	if (e !== void 0) return typeof e == "number" ? `${e * 4}px` : e;
+}
+function c(e, t) {
+	return e ? "mobile" : t ? "tablet" : "desktop";
+}
+function l({ direction: i = "vertical", gap: a = 2, align: l, justify: u, wrap: d = !1, className: f, style: p, children: m, ...h }) {
+	let { isMobile: g, isTablet: _ } = t(), v = c(g, _), y = o(i, v) ?? "vertical", b = {
+		gap: s(o(a, v)),
+		...p
+	}, x = u === "between" ? n.justifyBetween : u === "center" ? n.justifyCenter : u === "end" ? n.justifyEnd : u === "start" ? n.justifyStart : void 0;
+	return /* @__PURE__ */ r("div", {
+		className: e(n.stack, y === "vertical" ? n.vertical : n.horizontal, l && n[l], x, d && n.wrap, f),
+		style: b,
+		...h,
+		children: m
+	});
+}
+function u(e) {
+	if (e !== void 0) return typeof e == "number" ? `repeat(${e}, minmax(0, 1fr))` : e;
+}
+function d({ columns: i = 2, gap: a = 4, className: l, style: d, children: f, ...p }) {
+	let { isMobile: m, isTablet: h } = t(), g = c(m, h), _ = u(o(i, g)), v = s(o(a, g));
+	return /* @__PURE__ */ r("div", {
+		className: e(n.grid, l),
+		style: {
+			gridTemplateColumns: _,
+			gap: v,
+			...d
+		},
+		...p,
+		children: f
+	});
+}
+//#endregion
+export { i as Container, d as Grid, l as Stack };
+
+//# sourceMappingURL=Layout.js.map

package/dist/components/Layout/Layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"Layout.js","sources":["../../../src/components/Layout/Layout.tsx"],"sourcesContent":["import type { CSSProperties, HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport { useBreakpoint } from \"@/hooks/use-breakpoint\";\nimport styles from \"./Layout.module.css\";\n\nexport type ContainerSize = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"full\";\n\nexport interface ContainerProps extends HTMLAttributes<HTMLDivElement> {\n    size?: ContainerSize;\n}\n\n/**\n * Page-level horizontal container with a max-width preset and responsive\n * side padding (`space-4` mobile / `space-6` tablet / `space-8` desktop).\n */\nexport function Container({ size = \"lg\", className, children, ...props }: ContainerProps) {\n    return (\n        <div className={cn(styles.container, styles[size], className)} {...props}>\n            {children}\n        </div>\n    );\n}\n\n/**\n * Responsive value — either a single value applied at all breakpoints, or\n * an object with `mobile` / `tablet` / `desktop` overrides. Apps can mix\n * any combination; `mobile` is the base, `tablet` / `desktop` cascade up.\n */\nexport type ResponsiveValue<T> =\n    | T\n    | {\n          mobile?: T;\n          tablet?: T;\n          desktop?: T;\n      };\n\nfunction isResponsiveObject<T>(value: ResponsiveValue<T>): value is {\n    mobile?: T;\n    tablet?: T;\n    desktop?: T;\n} {\n    return (\n        typeof value === \"object\" &&\n        value !== null &&\n        (\"mobile\" in value || \"tablet\" in value || \"desktop\" in value)\n    );\n}\n\nfunction pickResponsive<T>(\n    value: ResponsiveValue<T> | undefined,\n    device: \"mobile\" | \"tablet\" | \"desktop\",\n): T | undefined {\n    if (value === undefined) return undefined;\n    if (!isResponsiveObject(value)) return value;\n    if (device === \"desktop\") return value.desktop ?? value.tablet ?? value.mobile;\n    if (device === \"tablet\") return value.tablet ?? value.mobile ?? value.desktop;\n    return value.mobile ?? value.tablet ?? value.desktop;\n}\n\nexport type StackAlign = \"start\" | \"center\" | \"end\" | \"stretch\";\nexport type StackJustify = \"start\" | \"center\" | \"end\" | \"between\";\nexport type StackDirection = \"vertical\" | \"horizontal\";\n\nexport interface StackProps extends HTMLAttributes<HTMLDivElement> {\n    /** Direction. Accepts responsive object — e.g. `{ mobile: \"vertical\", desktop: \"horizontal\" }`. */\n    direction?: ResponsiveValue<StackDirection>;\n    /** Gap as a CSS length. Numbers map to a multiple of the 4px scale. Accepts responsive object. */\n    gap?: ResponsiveValue<number | string>;\n    align?: StackAlign;\n    justify?: StackJustify;\n    wrap?: boolean;\n    children?: ReactNode;\n}\n\nfunction resolveGap(gap: number | string | undefined): string | undefined {\n    if (gap === undefined) return undefined;\n    return typeof gap === \"number\" ? `${gap * 4}px` : gap;\n}\n\nfunction deviceFromBreakpoint(\n    isMobile: boolean,\n    isTablet: boolean,\n): \"mobile\" | \"tablet\" | \"desktop\" {\n    if (isMobile) return \"mobile\";\n    if (isTablet) return \"tablet\";\n    return \"desktop\";\n}\n\n/** Flex-based vertical or horizontal stack with a numeric `gap`. */\nexport function Stack({\n    direction = \"vertical\",\n    gap = 2,\n    align,\n    justify,\n    wrap = false,\n    className,\n    style,\n    children,\n    ...props\n}: StackProps) {\n    const { isMobile, isTablet } = useBreakpoint();\n    const device = deviceFromBreakpoint(isMobile, isTablet);\n    const finalDirection: StackDirection = pickResponsive(direction, device) ?? \"vertical\";\n    const finalGap = resolveGap(pickResponsive(gap, device));\n    const finalStyle: CSSProperties = { gap: finalGap, ...style };\n    const justifyClass =\n        justify === \"between\"\n            ? styles.justifyBetween\n            : justify === \"center\"\n              ? styles.justifyCenter\n              : justify === \"end\"\n                ? styles.justifyEnd\n                : justify === \"start\"\n                  ? styles.justifyStart\n                  : undefined;\n    return (\n        <div\n            className={cn(\n                styles.stack,\n                finalDirection === \"vertical\" ? styles.vertical : styles.horizontal,\n                align && styles[align],\n                justifyClass,\n                wrap && styles.wrap,\n                className,\n            )}\n            style={finalStyle}\n            {...props}\n        >\n            {children}\n        </div>\n    );\n}\n\nexport interface GridProps extends HTMLAttributes<HTMLDivElement> {\n    /** Number of columns or a custom `grid-template-columns` value. Accepts responsive object. */\n    columns?: ResponsiveValue<number | string>;\n    /** Gap as a CSS length. Numbers map to a multiple of the 4px scale. Accepts responsive object. */\n    gap?: ResponsiveValue<number | string>;\n    children?: ReactNode;\n}\n\nfunction resolveColumns(columns: number | string | undefined): string | undefined {\n    if (columns === undefined) return undefined;\n    return typeof columns === \"number\" ? `repeat(${columns}, minmax(0, 1fr))` : columns;\n}\n\n/** Simple CSS-Grid wrapper for equal-width or custom column layouts. */\nexport function Grid({ columns = 2, gap = 4, className, style, children, ...props }: GridProps) {\n    const { isMobile, isTablet } = useBreakpoint();\n    const device = deviceFromBreakpoint(isMobile, isTablet);\n    const templateColumns = resolveColumns(pickResponsive(columns, device));\n    const finalGap = resolveGap(pickResponsive(gap, device));\n    return (\n        <div\n            className={cn(styles.grid, className)}\n            style={{ gridTemplateColumns: templateColumns, gap: finalGap, ...style }}\n            {...props}\n        >\n            {children}\n        </div>\n    );\n}\n"],"names":["Container","size","className","children","props","jsx","cn","styles","isResponsiveObject","value","pickResponsive","device","resolveGap","gap","deviceFromBreakpoint","isMobile","isTablet","Stack","direction","align","justify","wrap","style","useBreakpoint","finalDirection","finalStyle","justifyClass","resolveColumns","columns","Grid","templateColumns","finalGap"],"mappings":";;;;AAeO,SAASA,EAAU,EAAE,MAAAC,IAAO,MAAM,WAAAC,GAAW,UAAAC,GAAU,GAAGC,KAAyB;AACtF,SACI,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAGC,EAAO,WAAWA,EAAON,CAAI,GAAGC,CAAS,GAAI,GAAGE,GAC9D,UAAAD,EAAA,CACL;AAER;AAeA,SAASK,EAAsBC,GAI7B;AACE,SACI,OAAOA,KAAU,YACjBA,MAAU,SACT,YAAYA,KAAS,YAAYA,KAAS,aAAaA;AAEhE;AAEA,SAASC,EACLD,GACAE,GACa;AACb,MAAIF,MAAU;AACd,WAAKD,EAAmBC,CAAK,IACzBE,MAAW,YAAkBF,EAAM,WAAWA,EAAM,UAAUA,EAAM,SACpEE,MAAW,WAAiBF,EAAM,UAAUA,EAAM,UAAUA,EAAM,UAC/DA,EAAM,UAAUA,EAAM,UAAUA,EAAM,UAHNA;AAI3C;AAiBA,SAASG,EAAWC,GAAsD;AACtE,MAAIA,MAAQ;AACZ,WAAO,OAAOA,KAAQ,WAAW,GAAGA,IAAM,CAAC,OAAOA;AACtD;AAEA,SAASC,EACLC,GACAC,GAC+B;AAC/B,SAAID,IAAiB,WACjBC,IAAiB,WACd;AACX;AAGO,SAASC,EAAM;AAAA,EAClB,WAAAC,IAAY;AAAA,EACZ,KAAAL,IAAM;AAAA,EACN,OAAAM;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,WAAAnB;AAAA,EACA,OAAAoB;AAAA,EACA,UAAAnB;AAAA,EACA,GAAGC;AACP,GAAe;AACX,QAAM,EAAE,UAAAW,GAAU,UAAAC,EAAA,IAAaO,EAAA,GACzBZ,IAASG,EAAqBC,GAAUC,CAAQ,GAChDQ,IAAiCd,EAAeQ,GAAWP,CAAM,KAAK,YAEtEc,IAA4B,EAAE,KADnBb,EAAWF,EAAeG,GAAKF,CAAM,CAAC,GACJ,GAAGW,EAAA,GAChDI,IACFN,MAAY,YACNb,EAAO,iBACPa,MAAY,WACVb,EAAO,gBACPa,MAAY,QACVb,EAAO,aACPa,MAAY,UACVb,EAAO,eACP;AAChB,SACI,gBAAAF;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC;AAAA,QACPC,EAAO;AAAA,QACPiB,MAAmB,aAAajB,EAAO,WAAWA,EAAO;AAAA,QACzDY,KAASZ,EAAOY,CAAK;AAAA,QACrBO;AAAA,QACAL,KAAQd,EAAO;AAAA,QACfL;AAAA,MAAA;AAAA,MAEJ,OAAOuB;AAAA,MACN,GAAGrB;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGb;AAUA,SAASwB,EAAeC,GAA0D;AAC9E,MAAIA,MAAY;AAChB,WAAO,OAAOA,KAAY,WAAW,UAAUA,CAAO,sBAAsBA;AAChF;AAGO,SAASC,EAAK,EAAE,SAAAD,IAAU,GAAG,KAAAf,IAAM,GAAG,WAAAX,GAAW,OAAAoB,GAAO,UAAAnB,GAAU,GAAGC,KAAoB;AAC5F,QAAM,EAAE,UAAAW,GAAU,UAAAC,EAAA,IAAaO,EAAA,GACzBZ,IAASG,EAAqBC,GAAUC,CAAQ,GAChDc,IAAkBH,EAAejB,EAAekB,GAASjB,CAAM,CAAC,GAChEoB,IAAWnB,EAAWF,EAAeG,GAAKF,CAAM,CAAC;AACvD,SACI,gBAAAN;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAAGC,EAAO,MAAML,CAAS;AAAA,MACpC,OAAO,EAAE,qBAAqB4B,GAAiB,KAAKC,GAAU,GAAGT,EAAA;AAAA,MAChE,GAAGlB;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGb;"}
+{"version":3,"file":"Layout.js","names":[],"sources":["../../../src/components/Layout/Layout.tsx"],"sourcesContent":["import type { CSSProperties, HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport { useBreakpoint } from \"@/hooks/use-breakpoint\";\nimport styles from \"./Layout.module.css\";\n\nexport type ContainerSize = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"full\";\n\nexport interface ContainerProps extends HTMLAttributes<HTMLDivElement> {\n    size?: ContainerSize;\n}\n\n/**\n * Page-level horizontal container with a max-width preset and responsive\n * side padding (`space-4` mobile / `space-6` tablet / `space-8` desktop).\n */\nexport function Container({ size = \"lg\", className, children, ...props }: ContainerProps) {\n    return (\n        <div className={cn(styles.container, styles[size], className)} {...props}>\n            {children}\n        </div>\n    );\n}\n\n/**\n * Responsive value — either a single value applied at all breakpoints, or\n * an object with `mobile` / `tablet` / `desktop` overrides. Apps can mix\n * any combination; `mobile` is the base, `tablet` / `desktop` cascade up.\n */\nexport type ResponsiveValue<T> =\n    | T\n    | {\n          mobile?: T;\n          tablet?: T;\n          desktop?: T;\n      };\n\nfunction isResponsiveObject<T>(value: ResponsiveValue<T>): value is {\n    mobile?: T;\n    tablet?: T;\n    desktop?: T;\n} {\n    return (\n        typeof value === \"object\" &&\n        value !== null &&\n        (\"mobile\" in value || \"tablet\" in value || \"desktop\" in value)\n    );\n}\n\nfunction pickResponsive<T>(\n    value: ResponsiveValue<T> | undefined,\n    device: \"mobile\" | \"tablet\" | \"desktop\",\n): T | undefined {\n    if (value === undefined) return undefined;\n    if (!isResponsiveObject(value)) return value;\n    if (device === \"desktop\") return value.desktop ?? value.tablet ?? value.mobile;\n    if (device === \"tablet\") return value.tablet ?? value.mobile ?? value.desktop;\n    return value.mobile ?? value.tablet ?? value.desktop;\n}\n\nexport type StackAlign = \"start\" | \"center\" | \"end\" | \"stretch\";\nexport type StackJustify = \"start\" | \"center\" | \"end\" | \"between\";\nexport type StackDirection = \"vertical\" | \"horizontal\";\n\nexport interface StackProps extends HTMLAttributes<HTMLDivElement> {\n    /** Direction. Accepts responsive object — e.g. `{ mobile: \"vertical\", desktop: \"horizontal\" }`. */\n    direction?: ResponsiveValue<StackDirection>;\n    /** Gap as a CSS length. Numbers map to a multiple of the 4px scale. Accepts responsive object. */\n    gap?: ResponsiveValue<number | string>;\n    align?: StackAlign;\n    justify?: StackJustify;\n    wrap?: boolean;\n    children?: ReactNode;\n}\n\nfunction resolveGap(gap: number | string | undefined): string | undefined {\n    if (gap === undefined) return undefined;\n    return typeof gap === \"number\" ? `${gap * 4}px` : gap;\n}\n\nfunction deviceFromBreakpoint(\n    isMobile: boolean,\n    isTablet: boolean,\n): \"mobile\" | \"tablet\" | \"desktop\" {\n    if (isMobile) return \"mobile\";\n    if (isTablet) return \"tablet\";\n    return \"desktop\";\n}\n\n/** Flex-based vertical or horizontal stack with a numeric `gap`. */\nexport function Stack({\n    direction = \"vertical\",\n    gap = 2,\n    align,\n    justify,\n    wrap = false,\n    className,\n    style,\n    children,\n    ...props\n}: StackProps) {\n    const { isMobile, isTablet } = useBreakpoint();\n    const device = deviceFromBreakpoint(isMobile, isTablet);\n    const finalDirection: StackDirection = pickResponsive(direction, device) ?? \"vertical\";\n    const finalGap = resolveGap(pickResponsive(gap, device));\n    const finalStyle: CSSProperties = { gap: finalGap, ...style };\n    const justifyClass =\n        justify === \"between\"\n            ? styles.justifyBetween\n            : justify === \"center\"\n              ? styles.justifyCenter\n              : justify === \"end\"\n                ? styles.justifyEnd\n                : justify === \"start\"\n                  ? styles.justifyStart\n                  : undefined;\n    return (\n        <div\n            className={cn(\n                styles.stack,\n                finalDirection === \"vertical\" ? styles.vertical : styles.horizontal,\n                align && styles[align],\n                justifyClass,\n                wrap && styles.wrap,\n                className,\n            )}\n            style={finalStyle}\n            {...props}\n        >\n            {children}\n        </div>\n    );\n}\n\nexport interface GridProps extends HTMLAttributes<HTMLDivElement> {\n    /** Number of columns or a custom `grid-template-columns` value. Accepts responsive object. */\n    columns?: ResponsiveValue<number | string>;\n    /** Gap as a CSS length. Numbers map to a multiple of the 4px scale. Accepts responsive object. */\n    gap?: ResponsiveValue<number | string>;\n    children?: ReactNode;\n}\n\nfunction resolveColumns(columns: number | string | undefined): string | undefined {\n    if (columns === undefined) return undefined;\n    return typeof columns === \"number\" ? `repeat(${columns}, minmax(0, 1fr))` : columns;\n}\n\n/** Simple CSS-Grid wrapper for equal-width or custom column layouts. */\nexport function Grid({ columns = 2, gap = 4, className, style, children, ...props }: GridProps) {\n    const { isMobile, isTablet } = useBreakpoint();\n    const device = deviceFromBreakpoint(isMobile, isTablet);\n    const templateColumns = resolveColumns(pickResponsive(columns, device));\n    const finalGap = resolveGap(pickResponsive(gap, device));\n    return (\n        <div\n            className={cn(styles.grid, className)}\n            style={{ gridTemplateColumns: templateColumns, gap: finalGap, ...style }}\n            {...props}\n        >\n            {children}\n        </div>\n    );\n}\n"],"mappings":";;;;;AAeA,SAAgB,EAAU,EAAE,UAAO,MAAM,cAAW,aAAU,GAAG,KAAyB;CACtF,OACI,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAO,WAAW,EAAO,IAAO,CAAS;EAAG,GAAI;EAC9D;CACA,CAAA;AAEb;AAeA,SAAS,EAAsB,GAI7B;CACE,OACI,OAAO,KAAU,cACjB,MACC,YAAY,KAAS,YAAY,KAAS,aAAa;AAEhE;AAEA,SAAS,EACL,GACA,GACa;CACT,UAAU,KAAA,GAId,OAHK,EAAmB,CAAK,IACzB,MAAW,YAAkB,EAAM,WAAW,EAAM,UAAU,EAAM,SACpE,MAAW,WAAiB,EAAM,UAAU,EAAM,UAAU,EAAM,UAC/D,EAAM,UAAU,EAAM,UAAU,EAAM,UAHN;AAI3C;AAiBA,SAAS,EAAW,GAAsD;CAClE,UAAQ,KAAA,GACZ,OAAO,OAAO,KAAQ,WAAW,GAAG,IAAM,EAAE,MAAM;AACtD;AAEA,SAAS,EACL,GACA,GAC+B;CAG/B,OAFI,IAAiB,WACjB,IAAiB,WACd;AACX;AAGA,SAAgB,EAAM,EAClB,eAAY,YACZ,SAAM,GACN,UACA,YACA,UAAO,IACP,cACA,UACA,aACA,GAAG,KACQ;CACX,IAAM,EAAE,aAAU,gBAAa,EAAc,GACvC,IAAS,EAAqB,GAAU,CAAQ,GAChD,IAAiC,EAAe,GAAW,CAAM,KAAK,YAEtE,IAA4B;EAAE,KADnB,EAAW,EAAe,GAAK,CAAM,CACb;EAAU,GAAG;CAAM,GACtD,IACF,MAAY,YACN,EAAO,iBACP,MAAY,WACV,EAAO,gBACP,MAAY,QACV,EAAO,aACP,MAAY,UACV,EAAO,eACP,KAAA;CAChB,OACI,kBAAC,OAAD;EACI,WAAW,EACP,EAAO,OACP,MAAmB,aAAa,EAAO,WAAW,EAAO,YACzD,KAAS,EAAO,IAChB,GACA,KAAQ,EAAO,MACf,CACJ;EACA,OAAO;EACP,GAAI;EAEH;CACA,CAAA;AAEb;AAUA,SAAS,EAAe,GAA0D;CAC1E,UAAY,KAAA,GAChB,OAAO,OAAO,KAAY,WAAW,UAAU,EAAQ,qBAAqB;AAChF;AAGA,SAAgB,EAAK,EAAE,aAAU,GAAG,SAAM,GAAG,cAAW,UAAO,aAAU,GAAG,KAAoB;CAC5F,IAAM,EAAE,aAAU,gBAAa,EAAc,GACvC,IAAS,EAAqB,GAAU,CAAQ,GAChD,IAAkB,EAAe,EAAe,GAAS,CAAM,CAAC,GAChE,IAAW,EAAW,EAAe,GAAK,CAAM,CAAC;CACvD,OACI,kBAAC,OAAD;EACI,WAAW,EAAG,EAAO,MAAM,CAAS;EACpC,OAAO;GAAE,qBAAqB;GAAiB,KAAK;GAAU,GAAG;EAAM;EACvE,GAAI;EAEH;CACA,CAAA;AAEb"}

package/dist/components/Layout/Layout.module.cjs

@@ -0,0 +1,2 @@
+var e=`tempest_container_fJfOt`,t=`tempest_sm_k8D4-`,n=`tempest_md_EnpYy`,r=`tempest_lg_UU-Ig`,i=`tempest_xl_2TEWj`,a=`tempest_full_l8bvG`,o=`tempest_stack_sxR8u`,s=`tempest_vertical_2TMf5`,c=`tempest_horizontal_r7-c-`,l=`tempest_center_EDSAh`,u=`tempest_start_ucQ-K`,d=`tempest_end_pnKlF`,f=`tempest_stretch_pX6l7`,p=`tempest_justifyStart_lHYsS`,m=`tempest_justifyCenter_JH2m6`,h=`tempest_justifyEnd_EBisT`,g=`tempest_justifyBetween_mAJwT`,_=`tempest_wrap_-xxOh`,v=`tempest_grid_o-JIX`,y={container:e,sm:t,md:n,lg:r,xl:i,full:a,stack:o,vertical:s,horizontal:c,center:l,start:u,end:d,stretch:f,justifyStart:p,justifyCenter:m,justifyEnd:h,justifyBetween:g,wrap:_,grid:v};exports.center=l,exports.container=e,exports.default=y,exports.end=d,exports.full=a,exports.grid=v,exports.horizontal=c,exports.justifyBetween=g,exports.justifyCenter=m,exports.justifyEnd=h,exports.justifyStart=p,exports.lg=r,exports.md=n,exports.sm=t,exports.stack=o,exports.start=u,exports.stretch=f,exports.vertical=s,exports.wrap=_,exports.xl=i;
+//# sourceMappingURL=Layout.module.cjs.map

package/dist/components/Layout/Layout.module.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Layout.module.cjs","names":[],"sources":["../../../src/components/Layout/Layout.module.css"],"sourcesContent":[".container {\n    margin-left: auto;\n    margin-right: auto;\n    padding-left: var(--tempest-space-4);\n    padding-right: var(--tempest-space-4);\n    width: 100%;\n}\n\n/* Responsive horizontal padding — wider on larger viewports. */\n@media (min-width: 768px) {\n    .container {\n        padding-left: var(--tempest-space-6);\n        padding-right: var(--tempest-space-6);\n    }\n}\n\n@media (min-width: 1024px) {\n    .container {\n        padding-left: var(--tempest-space-8);\n        padding-right: var(--tempest-space-8);\n    }\n}\n\n.container.sm {\n    max-width: 640px;\n}\n.container.md {\n    max-width: 768px;\n}\n.container.lg {\n    max-width: 1024px;\n}\n.container.xl {\n    max-width: 1280px;\n}\n.container.full {\n    max-width: 100%;\n}\n\n.stack {\n    display: flex;\n}\n\n.stack.vertical {\n    flex-direction: column;\n}\n.stack.horizontal {\n    flex-direction: row;\n}\n.stack.center {\n    align-items: center;\n}\n.stack.start {\n    align-items: flex-start;\n}\n.stack.end {\n    align-items: flex-end;\n}\n.stack.stretch {\n    align-items: stretch;\n}\n.stack.justifyStart {\n    justify-content: flex-start;\n}\n.stack.justifyCenter {\n    justify-content: center;\n}\n.stack.justifyEnd {\n    justify-content: flex-end;\n}\n.stack.justifyBetween {\n    justify-content: space-between;\n}\n.stack.wrap {\n    flex-wrap: wrap;\n}\n\n.grid {\n    display: grid;\n    width: 100%;\n}\n"],"mappings":""}

package/dist/components/Layout/Layout.module.js

@@ -0,0 +1,26 @@
+//#region src/components/Layout/Layout.module.css
+var e = "tempest_container_fJfOt", t = "tempest_sm_k8D4-", n = "tempest_md_EnpYy", r = "tempest_lg_UU-Ig", i = "tempest_xl_2TEWj", a = "tempest_full_l8bvG", o = "tempest_stack_sxR8u", s = "tempest_vertical_2TMf5", c = "tempest_horizontal_r7-c-", l = "tempest_center_EDSAh", u = "tempest_start_ucQ-K", d = "tempest_end_pnKlF", f = "tempest_stretch_pX6l7", p = "tempest_justifyStart_lHYsS", m = "tempest_justifyCenter_JH2m6", h = "tempest_justifyEnd_EBisT", g = "tempest_justifyBetween_mAJwT", _ = "tempest_wrap_-xxOh", v = "tempest_grid_o-JIX", y = {
+	container: e,
+	sm: t,
+	md: n,
+	lg: r,
+	xl: i,
+	full: a,
+	stack: o,
+	vertical: s,
+	horizontal: c,
+	center: l,
+	start: u,
+	end: d,
+	stretch: f,
+	justifyStart: p,
+	justifyCenter: m,
+	justifyEnd: h,
+	justifyBetween: g,
+	wrap: _,
+	grid: v
+};
+//#endregion
+export { l as center, e as container, y as default, d as end, a as full, v as grid, c as horizontal, g as justifyBetween, m as justifyCenter, h as justifyEnd, p as justifyStart, r as lg, n as md, t as sm, o as stack, u as start, f as stretch, s as vertical, _ as wrap, i as xl };
+
+//# sourceMappingURL=Layout.module.js.map

package/dist/components/Layout/Layout.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Layout.module.js","names":[],"sources":["../../../src/components/Layout/Layout.module.css"],"sourcesContent":[".container {\n    margin-left: auto;\n    margin-right: auto;\n    padding-left: var(--tempest-space-4);\n    padding-right: var(--tempest-space-4);\n    width: 100%;\n}\n\n/* Responsive horizontal padding — wider on larger viewports. */\n@media (min-width: 768px) {\n    .container {\n        padding-left: var(--tempest-space-6);\n        padding-right: var(--tempest-space-6);\n    }\n}\n\n@media (min-width: 1024px) {\n    .container {\n        padding-left: var(--tempest-space-8);\n        padding-right: var(--tempest-space-8);\n    }\n}\n\n.container.sm {\n    max-width: 640px;\n}\n.container.md {\n    max-width: 768px;\n}\n.container.lg {\n    max-width: 1024px;\n}\n.container.xl {\n    max-width: 1280px;\n}\n.container.full {\n    max-width: 100%;\n}\n\n.stack {\n    display: flex;\n}\n\n.stack.vertical {\n    flex-direction: column;\n}\n.stack.horizontal {\n    flex-direction: row;\n}\n.stack.center {\n    align-items: center;\n}\n.stack.start {\n    align-items: flex-start;\n}\n.stack.end {\n    align-items: flex-end;\n}\n.stack.stretch {\n    align-items: stretch;\n}\n.stack.justifyStart {\n    justify-content: flex-start;\n}\n.stack.justifyCenter {\n    justify-content: center;\n}\n.stack.justifyEnd {\n    justify-content: flex-end;\n}\n.stack.justifyBetween {\n    justify-content: space-between;\n}\n.stack.wrap {\n    flex-wrap: wrap;\n}\n\n.grid {\n    display: grid;\n    width: 100%;\n}\n"],"mappings":""}

package/dist/components/ListTile/ListTile.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("../../utils/cn.cjs"),s=require("./ListTile.module.css.cjs");function m({leading:t,title:o,subtitle:a,trailing:l,onClick:n,disabled:i=!1,selected:r=!1,className:f}){const c=e.jsxs(e.Fragment,{children:[t!==void 0&&e.jsx("span",{className:s.default.leading,children:t}),e.jsxs("span",{className:s.default.body,children:[e.jsx("span",{className:s.default.title,children:o}),a!==void 0&&e.jsx("span",{className:s.default.subtitle,children:a})]}),l!==void 0&&e.jsx("span",{className:s.default.trailing,children:l})]}),d=u.cn(s.default.tile,r&&s.default.selected,i&&s.default.disabled,f);return n?e.jsx("button",{type:"button",className:u.cn(d,s.default.interactive),"aria-pressed":r?!0:void 0,disabled:i,onClick:n,children:c}):e.jsx("div",{className:d,children:c})}exports.ListTile=m;
-//# sourceMappingURL=ListTile.cjs.map
+const e=require("../../utils/cn.cjs"),t=require("./ListTile.module.cjs");let n=require("react/jsx-runtime");function r({leading:r,title:i,subtitle:a,trailing:o,onClick:s,disabled:c=!1,selected:l=!1,className:u}){let d=(0,n.jsxs)(n.Fragment,{children:[r!==void 0&&(0,n.jsx)(`span`,{className:t.default.leading,children:r}),(0,n.jsxs)(`span`,{className:t.default.body,children:[(0,n.jsx)(`span`,{className:t.default.title,children:i}),a!==void 0&&(0,n.jsx)(`span`,{className:t.default.subtitle,children:a})]}),o!==void 0&&(0,n.jsx)(`span`,{className:t.default.trailing,children:o})]}),f=e.cn(t.default.tile,l&&t.default.selected,c&&t.default.disabled,u);return s?(0,n.jsx)(`button`,{type:`button`,className:e.cn(f,t.default.interactive),"aria-pressed":l?!0:void 0,disabled:c,onClick:s,children:d}):(0,n.jsx)(`div`,{className:f,children:d})}exports.ListTile=r;
+//# sourceMappingURL=ListTile.cjs.map

package/dist/components/ListTile/ListTile.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ListTile.cjs","sources":["../../../src/components/ListTile/ListTile.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ListTile.module.css\";\n\nexport interface ListTileProps {\n    /** Left slot — typically an icon or avatar. */\n    leading?: ReactNode;\n    /** Primary line. Required. */\n    title: ReactNode;\n    /** Secondary line rendered under the title. */\n    subtitle?: ReactNode;\n    /** Right slot — typically an icon, switch or meta text. */\n    trailing?: ReactNode;\n    /** When provided, the tile becomes an interactive button. */\n    onClick?: () => void;\n    /** When true, the tile is dimmed and non-interactive. */\n    disabled?: boolean;\n    /** When true, the tile is highlighted as the active row. */\n    selected?: boolean;\n    /** Extra class names merged onto the root. */\n    className?: string;\n}\n\n/**\n * The canonical Material list row: an optional leading slot, a title with an\n * optional subtitle, and an optional trailing slot. When `onClick` is supplied\n * the tile renders as a full-width, keyboard-accessible `<button>`; otherwise it\n * renders as a static `<div>`.\n *\n * @example\n * <ListTile\n *     leading={<User />}\n *     title=\"Maria Silva\"\n *     subtitle=\"maria@example.com\"\n *     trailing={<ChevronRight />}\n *     onClick={() => open(user)}\n * />\n */\nexport function ListTile({\n    leading,\n    title,\n    subtitle,\n    trailing,\n    onClick,\n    disabled = false,\n    selected = false,\n    className,\n}: ListTileProps) {\n    const content = (\n        <>\n            {leading !== undefined && <span className={styles.leading}>{leading}</span>}\n            <span className={styles.body}>\n                <span className={styles.title}>{title}</span>\n                {subtitle !== undefined && <span className={styles.subtitle}>{subtitle}</span>}\n            </span>\n            {trailing !== undefined && <span className={styles.trailing}>{trailing}</span>}\n        </>\n    );\n\n    const rootClassName = cn(\n        styles.tile,\n        selected && styles.selected,\n        disabled && styles.disabled,\n        className,\n    );\n\n    if (onClick) {\n        return (\n            <button\n                type=\"button\"\n                className={cn(rootClassName, styles.interactive)}\n                aria-pressed={selected ? true : undefined}\n                disabled={disabled}\n                onClick={onClick}\n            >\n                {content}\n            </button>\n        );\n    }\n\n    return <div className={rootClassName}>{content}</div>;\n}\n"],"names":["ListTile","leading","title","subtitle","trailing","onClick","disabled","selected","className","content","jsxs","Fragment","jsx","styles","rootClassName","cn"],"mappings":"4LAsCO,SAASA,EAAS,CACrB,QAAAC,EACA,MAAAC,EACA,SAAAC,EACA,SAAAC,EACA,QAAAC,EACA,SAAAC,EAAW,GACX,SAAAC,EAAW,GACX,UAAAC,CACJ,EAAkB,CACd,MAAMC,EACFC,EAAAA,KAAAC,EAAAA,SAAA,CACK,SAAA,CAAAV,IAAY,QAAaW,EAAAA,IAAC,OAAA,CAAK,UAAWC,EAAAA,QAAO,QAAU,SAAAZ,EAAQ,EACpES,EAAAA,KAAC,OAAA,CAAK,UAAWG,EAAAA,QAAO,KACpB,SAAA,CAAAD,EAAAA,IAAC,OAAA,CAAK,UAAWC,EAAAA,QAAO,MAAQ,SAAAX,EAAM,EACrCC,IAAa,QAAaS,EAAAA,IAAC,QAAK,UAAWC,UAAO,SAAW,SAAAV,CAAA,CAAS,CAAA,EAC3E,EACCC,IAAa,QAAaQ,EAAAA,IAAC,QAAK,UAAWC,UAAO,SAAW,SAAAT,CAAA,CAAS,CAAA,EAC3E,EAGEU,EAAgBC,EAAAA,GAClBF,EAAAA,QAAO,KACPN,GAAYM,EAAAA,QAAO,SACnBP,GAAYO,EAAAA,QAAO,SACnBL,CAAA,EAGJ,OAAIH,EAEIO,EAAAA,IAAC,SAAA,CACG,KAAK,SACL,UAAWG,EAAAA,GAAGD,EAAeD,EAAAA,QAAO,WAAW,EAC/C,eAAcN,EAAW,GAAO,OAChC,SAAAD,EACA,QAAAD,EAEC,SAAAI,CAAA,CAAA,EAKNG,EAAAA,IAAC,MAAA,CAAI,UAAWE,EAAgB,SAAAL,EAAQ,CACnD"}
+{"version":3,"file":"ListTile.cjs","names":[],"sources":["../../../src/components/ListTile/ListTile.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ListTile.module.css\";\n\nexport interface ListTileProps {\n    /** Left slot — typically an icon or avatar. */\n    leading?: ReactNode;\n    /** Primary line. Required. */\n    title: ReactNode;\n    /** Secondary line rendered under the title. */\n    subtitle?: ReactNode;\n    /** Right slot — typically an icon, switch or meta text. */\n    trailing?: ReactNode;\n    /** When provided, the tile becomes an interactive button. */\n    onClick?: () => void;\n    /** When true, the tile is dimmed and non-interactive. */\n    disabled?: boolean;\n    /** When true, the tile is highlighted as the active row. */\n    selected?: boolean;\n    /** Extra class names merged onto the root. */\n    className?: string;\n}\n\n/**\n * The canonical Material list row: an optional leading slot, a title with an\n * optional subtitle, and an optional trailing slot. When `onClick` is supplied\n * the tile renders as a full-width, keyboard-accessible `<button>`; otherwise it\n * renders as a static `<div>`.\n *\n * @example\n * <ListTile\n *     leading={<User />}\n *     title=\"Maria Silva\"\n *     subtitle=\"maria@example.com\"\n *     trailing={<ChevronRight />}\n *     onClick={() => open(user)}\n * />\n */\nexport function ListTile({\n    leading,\n    title,\n    subtitle,\n    trailing,\n    onClick,\n    disabled = false,\n    selected = false,\n    className,\n}: ListTileProps) {\n    const content = (\n        <>\n            {leading !== undefined && <span className={styles.leading}>{leading}</span>}\n            <span className={styles.body}>\n                <span className={styles.title}>{title}</span>\n                {subtitle !== undefined && <span className={styles.subtitle}>{subtitle}</span>}\n            </span>\n            {trailing !== undefined && <span className={styles.trailing}>{trailing}</span>}\n        </>\n    );\n\n    const rootClassName = cn(\n        styles.tile,\n        selected && styles.selected,\n        disabled && styles.disabled,\n        className,\n    );\n\n    if (onClick) {\n        return (\n            <button\n                type=\"button\"\n                className={cn(rootClassName, styles.interactive)}\n                aria-pressed={selected ? true : undefined}\n                disabled={disabled}\n                onClick={onClick}\n            >\n                {content}\n            </button>\n        );\n    }\n\n    return <div className={rootClassName}>{content}</div>;\n}\n"],"mappings":"4GAsCA,SAAgB,EAAS,CACrB,UACA,QACA,WACA,WACA,UACA,WAAW,GACX,WAAW,GACX,aACc,CACd,IAAM,GACF,EAAA,EAAA,KAAA,CAAA,EAAA,SAAA,CAAA,SAAA,CACK,IAAY,IAAA,KAAa,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,iBAAU,CAAc,CAAA,GAC1E,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,cAAxB,EACI,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,eAAQ,CAAY,CAAA,EAC3C,IAAa,IAAA,KAAa,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBAAW,CAAe,CAAA,CAC3E,IACL,IAAa,IAAA,KAAa,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBAAW,CAAe,CAAA,CAC/E,CAAA,CAAA,EAGA,EAAgB,EAAA,GAClB,EAAA,QAAO,KACP,GAAY,EAAA,QAAO,SACnB,GAAY,EAAA,QAAO,SACnB,CACJ,EAgBA,OAdI,GAEI,EAAA,EAAA,IAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAW,EAAA,GAAG,EAAe,EAAA,QAAO,WAAW,EAC/C,eAAc,EAAW,GAAO,IAAA,GACtB,WACD,mBAER,CACG,CAAA,GAIT,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,WAAgB,CAAa,CAAA,CACxD"}

package/dist/components/ListTile/ListTile.js

@@ -1,42 +1,41 @@
-import { jsx as s, jsxs as d, Fragment as N } from "react/jsx-runtime";
-import { cn as m } from "../../utils/cn.js";
-import e from "./ListTile.module.css.js";
-function b({
-  leading: a,
-  title: p,
-  subtitle: t,
-  trailing: n,
-  onClick: r,
-  disabled: i = !1,
-  selected: l = !1,
-  className: h
-}) {
-  const c = /* @__PURE__ */ d(N, { children: [
-    a !== void 0 && /* @__PURE__ */ s("span", { className: e.leading, children: a }),
-    /* @__PURE__ */ d("span", { className: e.body, children: [
-      /* @__PURE__ */ s("span", { className: e.title, children: p }),
-      t !== void 0 && /* @__PURE__ */ s("span", { className: e.subtitle, children: t })
-    ] }),
-    n !== void 0 && /* @__PURE__ */ s("span", { className: e.trailing, children: n })
-  ] }), o = m(
-    e.tile,
-    l && e.selected,
-    i && e.disabled,
-    h
-  );
-  return r ? /* @__PURE__ */ s(
-    "button",
-    {
-      type: "button",
-      className: m(o, e.interactive),
-      "aria-pressed": l ? !0 : void 0,
-      disabled: i,
-      onClick: r,
-      children: c
-    }
-  ) : /* @__PURE__ */ s("div", { className: o, children: c });
+import { cn as e } from "../../utils/cn.js";
+import t from "./ListTile.module.js";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/ListTile/ListTile.tsx
+function a({ leading: a, title: o, subtitle: s, trailing: c, onClick: l, disabled: u = !1, selected: d = !1, className: f }) {
+	let p = /* @__PURE__ */ i(n, { children: [
+		a !== void 0 && /* @__PURE__ */ r("span", {
+			className: t.leading,
+			children: a
+		}),
+		/* @__PURE__ */ i("span", {
+			className: t.body,
+			children: [/* @__PURE__ */ r("span", {
+				className: t.title,
+				children: o
+			}), s !== void 0 && /* @__PURE__ */ r("span", {
+				className: t.subtitle,
+				children: s
+			})]
+		}),
+		c !== void 0 && /* @__PURE__ */ r("span", {
+			className: t.trailing,
+			children: c
+		})
+	] }), m = e(t.tile, d && t.selected, u && t.disabled, f);
+	return l ? /* @__PURE__ */ r("button", {
+		type: "button",
+		className: e(m, t.interactive),
+		"aria-pressed": d ? !0 : void 0,
+		disabled: u,
+		onClick: l,
+		children: p
+	}) : /* @__PURE__ */ r("div", {
+		className: m,
+		children: p
+	});
 }
-export {
-  b as ListTile
-};
-//# sourceMappingURL=ListTile.js.map
+//#endregion
+export { a as ListTile };
+
+//# sourceMappingURL=ListTile.js.map

package/dist/components/ListTile/ListTile.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListTile.js","sources":["../../../src/components/ListTile/ListTile.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ListTile.module.css\";\n\nexport interface ListTileProps {\n    /** Left slot — typically an icon or avatar. */\n    leading?: ReactNode;\n    /** Primary line. Required. */\n    title: ReactNode;\n    /** Secondary line rendered under the title. */\n    subtitle?: ReactNode;\n    /** Right slot — typically an icon, switch or meta text. */\n    trailing?: ReactNode;\n    /** When provided, the tile becomes an interactive button. */\n    onClick?: () => void;\n    /** When true, the tile is dimmed and non-interactive. */\n    disabled?: boolean;\n    /** When true, the tile is highlighted as the active row. */\n    selected?: boolean;\n    /** Extra class names merged onto the root. */\n    className?: string;\n}\n\n/**\n * The canonical Material list row: an optional leading slot, a title with an\n * optional subtitle, and an optional trailing slot. When `onClick` is supplied\n * the tile renders as a full-width, keyboard-accessible `<button>`; otherwise it\n * renders as a static `<div>`.\n *\n * @example\n * <ListTile\n *     leading={<User />}\n *     title=\"Maria Silva\"\n *     subtitle=\"maria@example.com\"\n *     trailing={<ChevronRight />}\n *     onClick={() => open(user)}\n * />\n */\nexport function ListTile({\n    leading,\n    title,\n    subtitle,\n    trailing,\n    onClick,\n    disabled = false,\n    selected = false,\n    className,\n}: ListTileProps) {\n    const content = (\n        <>\n            {leading !== undefined && <span className={styles.leading}>{leading}</span>}\n            <span className={styles.body}>\n                <span className={styles.title}>{title}</span>\n                {subtitle !== undefined && <span className={styles.subtitle}>{subtitle}</span>}\n            </span>\n            {trailing !== undefined && <span className={styles.trailing}>{trailing}</span>}\n        </>\n    );\n\n    const rootClassName = cn(\n        styles.tile,\n        selected && styles.selected,\n        disabled && styles.disabled,\n        className,\n    );\n\n    if (onClick) {\n        return (\n            <button\n                type=\"button\"\n                className={cn(rootClassName, styles.interactive)}\n                aria-pressed={selected ? true : undefined}\n                disabled={disabled}\n                onClick={onClick}\n            >\n                {content}\n            </button>\n        );\n    }\n\n    return <div className={rootClassName}>{content}</div>;\n}\n"],"names":["ListTile","leading","title","subtitle","trailing","onClick","disabled","selected","className","content","jsxs","Fragment","jsx","styles","rootClassName","cn"],"mappings":";;;AAsCO,SAASA,EAAS;AAAA,EACrB,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,UAAAC,IAAW;AAAA,EACX,WAAAC;AACJ,GAAkB;AACd,QAAMC,IACF,gBAAAC,EAAAC,GAAA,EACK,UAAA;AAAA,IAAAV,MAAY,UAAa,gBAAAW,EAAC,QAAA,EAAK,WAAWC,EAAO,SAAU,UAAAZ,GAAQ;AAAA,IACpE,gBAAAS,EAAC,QAAA,EAAK,WAAWG,EAAO,MACpB,UAAA;AAAA,MAAA,gBAAAD,EAAC,QAAA,EAAK,WAAWC,EAAO,OAAQ,UAAAX,GAAM;AAAA,MACrCC,MAAa,UAAa,gBAAAS,EAAC,UAAK,WAAWC,EAAO,UAAW,UAAAV,EAAA,CAAS;AAAA,IAAA,GAC3E;AAAA,IACCC,MAAa,UAAa,gBAAAQ,EAAC,UAAK,WAAWC,EAAO,UAAW,UAAAT,EAAA,CAAS;AAAA,EAAA,GAC3E,GAGEU,IAAgBC;AAAA,IAClBF,EAAO;AAAA,IACPN,KAAYM,EAAO;AAAA,IACnBP,KAAYO,EAAO;AAAA,IACnBL;AAAA,EAAA;AAGJ,SAAIH,IAEI,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,MAAK;AAAA,MACL,WAAWG,EAAGD,GAAeD,EAAO,WAAW;AAAA,MAC/C,gBAAcN,IAAW,KAAO;AAAA,MAChC,UAAAD;AAAA,MACA,SAAAD;AAAA,MAEC,UAAAI;AAAA,IAAA;AAAA,EAAA,IAKN,gBAAAG,EAAC,OAAA,EAAI,WAAWE,GAAgB,UAAAL,GAAQ;AACnD;"}
+{"version":3,"file":"ListTile.js","names":[],"sources":["../../../src/components/ListTile/ListTile.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ListTile.module.css\";\n\nexport interface ListTileProps {\n    /** Left slot — typically an icon or avatar. */\n    leading?: ReactNode;\n    /** Primary line. Required. */\n    title: ReactNode;\n    /** Secondary line rendered under the title. */\n    subtitle?: ReactNode;\n    /** Right slot — typically an icon, switch or meta text. */\n    trailing?: ReactNode;\n    /** When provided, the tile becomes an interactive button. */\n    onClick?: () => void;\n    /** When true, the tile is dimmed and non-interactive. */\n    disabled?: boolean;\n    /** When true, the tile is highlighted as the active row. */\n    selected?: boolean;\n    /** Extra class names merged onto the root. */\n    className?: string;\n}\n\n/**\n * The canonical Material list row: an optional leading slot, a title with an\n * optional subtitle, and an optional trailing slot. When `onClick` is supplied\n * the tile renders as a full-width, keyboard-accessible `<button>`; otherwise it\n * renders as a static `<div>`.\n *\n * @example\n * <ListTile\n *     leading={<User />}\n *     title=\"Maria Silva\"\n *     subtitle=\"maria@example.com\"\n *     trailing={<ChevronRight />}\n *     onClick={() => open(user)}\n * />\n */\nexport function ListTile({\n    leading,\n    title,\n    subtitle,\n    trailing,\n    onClick,\n    disabled = false,\n    selected = false,\n    className,\n}: ListTileProps) {\n    const content = (\n        <>\n            {leading !== undefined && <span className={styles.leading}>{leading}</span>}\n            <span className={styles.body}>\n                <span className={styles.title}>{title}</span>\n                {subtitle !== undefined && <span className={styles.subtitle}>{subtitle}</span>}\n            </span>\n            {trailing !== undefined && <span className={styles.trailing}>{trailing}</span>}\n        </>\n    );\n\n    const rootClassName = cn(\n        styles.tile,\n        selected && styles.selected,\n        disabled && styles.disabled,\n        className,\n    );\n\n    if (onClick) {\n        return (\n            <button\n                type=\"button\"\n                className={cn(rootClassName, styles.interactive)}\n                aria-pressed={selected ? true : undefined}\n                disabled={disabled}\n                onClick={onClick}\n            >\n                {content}\n            </button>\n        );\n    }\n\n    return <div className={rootClassName}>{content}</div>;\n}\n"],"mappings":";;;;AAsCA,SAAgB,EAAS,EACrB,YACA,UACA,aACA,aACA,YACA,cAAW,IACX,cAAW,IACX,gBACc;CACd,IAAM,IACF,kBAAA,GAAA,EAAA,UAAA;EACK,MAAY,KAAA,KAAa,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAU;EAAc,CAAA;EAC1E,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAxB,CACI,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAQ;GAAY,CAAA,GAC3C,MAAa,KAAA,KAAa,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAW;GAAe,CAAA,CAC3E;;EACL,MAAa,KAAA,KAAa,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAW;EAAe,CAAA;CAC/E,EAAA,CAAA,GAGA,IAAgB,EAClB,EAAO,MACP,KAAY,EAAO,UACnB,KAAY,EAAO,UACnB,CACJ;CAgBA,OAdI,IAEI,kBAAC,UAAD;EACI,MAAK;EACL,WAAW,EAAG,GAAe,EAAO,WAAW;EAC/C,gBAAc,IAAW,KAAO,KAAA;EACtB;EACD;YAER;CACG,CAAA,IAIT,kBAAC,OAAD;EAAK,WAAW;YAAgB;CAAa,CAAA;AACxD"}

package/dist/components/ListTile/ListTile.module.cjs

@@ -0,0 +1,2 @@
+var e=`tempest_tile_ZpED6`,t=`tempest_interactive_3ICXQ`,n=`tempest_selected_dMY11`,r=`tempest_disabled_HnXxf`,i=`tempest_leading_gSuBb`,a=`tempest_trailing_cVd1n`,o=`tempest_body_gyEl2`,s=`tempest_title_jWFBN`,c=`tempest_subtitle_GUtn7`,l={tile:e,interactive:t,selected:n,disabled:r,leading:i,trailing:a,body:o,title:s,subtitle:c};exports.body=o,exports.default=l,exports.disabled=r,exports.interactive=t,exports.leading=i,exports.selected=n,exports.subtitle=c,exports.tile=e,exports.title=s,exports.trailing=a;
+//# sourceMappingURL=ListTile.module.cjs.map

package/dist/components/ListTile/ListTile.module.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListTile.module.cjs","names":[],"sources":["../../../src/components/ListTile/ListTile.module.css"],"sourcesContent":[".tile {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-3);\n    width: 100%;\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    background: var(--tempest-surface);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-sm);\n    text-align: left;\n    border: 0;\n    border-radius: var(--tempest-radius-md);\n}\n\n.interactive {\n    cursor: pointer;\n    transition: background var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out);\n}\n\n.interactive:hover {\n    background: var(--tempest-surface-2);\n}\n\n.interactive:focus-visible {\n    outline: var(--tempest-focus-ring-width, 2px) solid\n        var(--tempest-focus-ring-color, var(--tempest-primary));\n    outline-offset: var(--tempest-focus-ring-offset, 2px);\n}\n\n.selected {\n    background: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n}\n\n.interactive.selected:hover {\n    background: var(--tempest-primary-soft-hover, var(--tempest-primary-soft));\n}\n\n.disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n    pointer-events: none;\n}\n\n.leading,\n.trailing {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: 0 0 auto;\n    line-height: 1;\n}\n\n.trailing {\n    margin-left: auto;\n    color: var(--tempest-text-muted);\n}\n\n.body {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n    min-width: 0;\n    flex: 1 1 auto;\n}\n\n.title {\n    line-height: var(--tempest-leading-snug, 1.3);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n.subtitle {\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n    line-height: var(--tempest-leading-snug, 1.3);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n.selected .subtitle {\n    color: var(--tempest-primary);\n    opacity: 0.8;\n}\n"],"mappings":""}

package/dist/components/ListTile/ListTile.module.js

@@ -0,0 +1,16 @@
+//#region src/components/ListTile/ListTile.module.css
+var e = "tempest_tile_ZpED6", t = "tempest_interactive_3ICXQ", n = "tempest_selected_dMY11", r = "tempest_disabled_HnXxf", i = "tempest_leading_gSuBb", a = "tempest_trailing_cVd1n", o = "tempest_body_gyEl2", s = "tempest_title_jWFBN", c = "tempest_subtitle_GUtn7", l = {
+	tile: e,
+	interactive: t,
+	selected: n,
+	disabled: r,
+	leading: i,
+	trailing: a,
+	body: o,
+	title: s,
+	subtitle: c
+};
+//#endregion
+export { o as body, l as default, r as disabled, t as interactive, i as leading, n as selected, c as subtitle, e as tile, s as title, a as trailing };
+
+//# sourceMappingURL=ListTile.module.js.map

package/dist/components/ListTile/ListTile.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListTile.module.js","names":[],"sources":["../../../src/components/ListTile/ListTile.module.css"],"sourcesContent":[".tile {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-3);\n    width: 100%;\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    background: var(--tempest-surface);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-sm);\n    text-align: left;\n    border: 0;\n    border-radius: var(--tempest-radius-md);\n}\n\n.interactive {\n    cursor: pointer;\n    transition: background var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out);\n}\n\n.interactive:hover {\n    background: var(--tempest-surface-2);\n}\n\n.interactive:focus-visible {\n    outline: var(--tempest-focus-ring-width, 2px) solid\n        var(--tempest-focus-ring-color, var(--tempest-primary));\n    outline-offset: var(--tempest-focus-ring-offset, 2px);\n}\n\n.selected {\n    background: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n}\n\n.interactive.selected:hover {\n    background: var(--tempest-primary-soft-hover, var(--tempest-primary-soft));\n}\n\n.disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n    pointer-events: none;\n}\n\n.leading,\n.trailing {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: 0 0 auto;\n    line-height: 1;\n}\n\n.trailing {\n    margin-left: auto;\n    color: var(--tempest-text-muted);\n}\n\n.body {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n    min-width: 0;\n    flex: 1 1 auto;\n}\n\n.title {\n    line-height: var(--tempest-leading-snug, 1.3);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n.subtitle {\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n    line-height: var(--tempest-leading-snug, 1.3);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n.selected .subtitle {\n    color: var(--tempest-primary);\n    opacity: 0.8;\n}\n"],"mappings":""}

package/dist/components/Menubar/Menubar.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),u=require("react"),b=require("../../utils/cn.cjs"),s=require("./Menubar.module.css.cjs");function j(a){return"separator"in a}function y({menus:a,className:m,...w}){const[l,i]=u.useState(-1),g=u.useId(),p=u.useRef(null),d=u.useRef([]),f=u.useCallback(()=>{i(-1)},[]);return u.useEffect(()=>{if(l===-1)return;const c=e=>{if(e.key==="Escape"){f(),d.current[l]?.focus();return}if(e.key==="ArrowRight"){e.preventDefault();const o=(l+1)%a.length;i(o),d.current[o]?.focus()}if(e.key==="ArrowLeft"){e.preventDefault();const o=(l-1+a.length)%a.length;i(o),d.current[o]?.focus()}},t=e=>{p.current&&!p.current.contains(e.target)&&f()};return window.addEventListener("keydown",c),window.addEventListener("mousedown",t),()=>{window.removeEventListener("keydown",c),window.removeEventListener("mousedown",t)}},[l,a.length,f]),n.jsx("div",{ref:p,role:"menubar",className:b.cn(s.default.root,m),...w,children:a.map((c,t)=>{const e=l===t,o=`${g}-panel-${t}`;return n.jsxs("div",{className:s.default.menu,children:[n.jsx("button",{ref:r=>{d.current[t]=r},type:"button",role:"menuitem","aria-haspopup":"menu","aria-expanded":e,"aria-controls":e?o:void 0,className:b.cn(s.default.trigger,e&&s.default.triggerOpen),onClick:()=>i(r=>r===t?-1:t),children:c.label}),e&&n.jsx("ul",{id:o,role:"menu",className:s.default.panel,children:c.items.map((r,h)=>j(r)?n.jsx("li",{role:"separator",className:s.default.separator,"aria-hidden":!0},h):n.jsx("li",{role:"none",children:n.jsxs("button",{type:"button",role:"menuitem",className:s.default.item,disabled:r.disabled,onClick:()=>{r.onSelect?.(),f()},children:[n.jsx("span",{className:s.default.itemLabel,children:r.label}),r.shortcut&&n.jsx("span",{className:s.default.shortcut,children:r.shortcut})]})},h))})]},t)})})}exports.Menubar=y;
-//# sourceMappingURL=Menubar.cjs.map
+const e=require("../../utils/cn.cjs"),t=require("./Menubar.module.cjs");let n=require("react"),r=require("react/jsx-runtime");function i(e){return`separator`in e}function a({menus:a,className:o,...s}){let[c,l]=(0,n.useState)(-1),u=(0,n.useId)(),d=(0,n.useRef)(null),f=(0,n.useRef)([]),p=(0,n.useCallback)(()=>{l(-1)},[]);return(0,n.useEffect)(()=>{if(c===-1)return;let e=e=>{if(e.key===`Escape`){p(),f.current[c]?.focus();return}if(e.key===`ArrowRight`){e.preventDefault();let t=(c+1)%a.length;l(t),f.current[t]?.focus()}if(e.key===`ArrowLeft`){e.preventDefault();let t=(c-1+a.length)%a.length;l(t),f.current[t]?.focus()}},t=e=>{d.current&&!d.current.contains(e.target)&&p()};return window.addEventListener(`keydown`,e),window.addEventListener(`mousedown`,t),()=>{window.removeEventListener(`keydown`,e),window.removeEventListener(`mousedown`,t)}},[c,a.length,p]),(0,r.jsx)(`div`,{ref:d,role:`menubar`,className:e.cn(t.default.root,o),...s,children:a.map((n,a)=>{let o=c===a,s=`${u}-panel-${a}`;return(0,r.jsxs)(`div`,{className:t.default.menu,children:[(0,r.jsx)(`button`,{ref:e=>{f.current[a]=e},type:`button`,role:`menuitem`,"aria-haspopup":`menu`,"aria-expanded":o,"aria-controls":o?s:void 0,className:e.cn(t.default.trigger,o&&t.default.triggerOpen),onClick:()=>l(e=>e===a?-1:a),children:n.label}),o&&(0,r.jsx)(`ul`,{id:s,role:`menu`,className:t.default.panel,children:n.items.map((e,n)=>i(e)?(0,r.jsx)(`li`,{role:`separator`,className:t.default.separator,"aria-hidden":!0},n):(0,r.jsx)(`li`,{role:`none`,children:(0,r.jsxs)(`button`,{type:`button`,role:`menuitem`,className:t.default.item,disabled:e.disabled,onClick:()=>{e.onSelect?.(),p()},children:[(0,r.jsx)(`span`,{className:t.default.itemLabel,children:e.label}),e.shortcut&&(0,r.jsx)(`span`,{className:t.default.shortcut,children:e.shortcut})]})},n))})]},a)})})}exports.Menubar=a;
+//# sourceMappingURL=Menubar.cjs.map

package/dist/components/Menubar/Menubar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Menubar.cjs","sources":["../../../src/components/Menubar/Menubar.tsx"],"sourcesContent":["import { useCallback, useEffect, useId, useRef, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Menubar.module.css\";\n\nexport type MenubarItem =\n    | {\n          /** Visible label for the action. */\n          label: ReactNode;\n          /** Invoked when the action is selected. */\n          onSelect?: () => void;\n          /** Disable the action. */\n          disabled?: boolean;\n          /** Optional shortcut hint rendered right-aligned (e.g. `\"⌘S\"`). */\n          shortcut?: string;\n      }\n    | { separator: true };\n\nexport interface MenubarMenu {\n    /** Top-level menu label (e.g. `\"File\"`). */\n    label: ReactNode;\n    /** Items shown in the menu's dropdown. */\n    items: MenubarItem[];\n}\n\nexport interface MenubarProps extends HTMLAttributes<HTMLDivElement> {\n    /** Top-level menus rendered left-to-right. */\n    menus: MenubarMenu[];\n}\n\nfunction isSeparator(item: MenubarItem): item is { separator: true } {\n    return \"separator\" in item;\n}\n\n/**\n * Application menubar (File / Edit-style).\n *\n * - `role=\"menubar\"`; each menu is a button that opens a dropdown.\n * - Arrow Left/Right moves between menus (wrapping); opening one closes others.\n * - Closes on outside click, Escape, or selecting an item.\n * - Items may carry a `shortcut` (right-aligned) or be a `{ separator: true }`.\n *\n * @example\n * <Menubar\n *     menus={[\n *         {\n *             label: \"File\",\n *             items: [\n *                 { label: \"New\", shortcut: \"⌘N\", onSelect: () => create() },\n *                 { separator: true },\n *                 { label: \"Quit\", onSelect: () => quit() },\n *             ],\n *         },\n *     ]}\n * />\n */\nexport function Menubar({ menus, className, ...props }: MenubarProps) {\n    const [openIndex, setOpenIndex] = useState<number>(-1);\n    const baseId = useId();\n    const rootRef = useRef<HTMLDivElement>(null);\n    const triggerRefs = useRef<Array<HTMLButtonElement | null>>([]);\n\n    const close = useCallback((): void => {\n        setOpenIndex(-1);\n    }, []);\n\n    useEffect(() => {\n        if (openIndex === -1) return;\n        const onKey = (event: KeyboardEvent): void => {\n            if (event.key === \"Escape\") {\n                close();\n                triggerRefs.current[openIndex]?.focus();\n                return;\n            }\n            if (event.key === \"ArrowRight\") {\n                event.preventDefault();\n                const next = (openIndex + 1) % menus.length;\n                setOpenIndex(next);\n                triggerRefs.current[next]?.focus();\n            }\n            if (event.key === \"ArrowLeft\") {\n                event.preventDefault();\n                const prev = (openIndex - 1 + menus.length) % menus.length;\n                setOpenIndex(prev);\n                triggerRefs.current[prev]?.focus();\n            }\n        };\n        const onDown = (event: MouseEvent): void => {\n            if (rootRef.current && !rootRef.current.contains(event.target as Node)) close();\n        };\n        window.addEventListener(\"keydown\", onKey);\n        window.addEventListener(\"mousedown\", onDown);\n        return () => {\n            window.removeEventListener(\"keydown\", onKey);\n            window.removeEventListener(\"mousedown\", onDown);\n        };\n    }, [openIndex, menus.length, close]);\n\n    return (\n        <div ref={rootRef} role=\"menubar\" className={cn(styles.root, className)} {...props}>\n            {menus.map((menu, index) => {\n                const open = openIndex === index;\n                const panelId = `${baseId}-panel-${index}`;\n                return (\n                    <div key={index} className={styles.menu}>\n                        <button\n                            ref={(el) => {\n                                triggerRefs.current[index] = el;\n                            }}\n                            type=\"button\"\n                            role=\"menuitem\"\n                            aria-haspopup=\"menu\"\n                            aria-expanded={open}\n                            aria-controls={open ? panelId : undefined}\n                            className={cn(styles.trigger, open && styles.triggerOpen)}\n                            onClick={() => setOpenIndex((prev) => (prev === index ? -1 : index))}\n                        >\n                            {menu.label}\n                        </button>\n                        {open && (\n                            <ul id={panelId} role=\"menu\" className={styles.panel}>\n                                {menu.items.map((item, itemIndex) => {\n                                    if (isSeparator(item)) {\n                                        return (\n                                            <li\n                                                key={itemIndex}\n                                                role=\"separator\"\n                                                className={styles.separator}\n                                                aria-hidden\n                                            />\n                                        );\n                                    }\n                                    return (\n                                        <li key={itemIndex} role=\"none\">\n                                            <button\n                                                type=\"button\"\n                                                role=\"menuitem\"\n                                                className={styles.item}\n                                                disabled={item.disabled}\n                                                onClick={() => {\n                                                    item.onSelect?.();\n                                                    close();\n                                                }}\n                                            >\n                                                <span className={styles.itemLabel}>\n                                                    {item.label}\n                                                </span>\n                                                {item.shortcut && (\n                                                    <span className={styles.shortcut}>\n                                                        {item.shortcut}\n                                                    </span>\n                                                )}\n                                            </button>\n                                        </li>\n                                    );\n                                })}\n                            </ul>\n                        )}\n                    </div>\n                );\n            })}\n        </div>\n    );\n}\n"],"names":["isSeparator","item","Menubar","menus","className","props","openIndex","setOpenIndex","useState","baseId","useId","rootRef","useRef","triggerRefs","close","useCallback","useEffect","onKey","event","next","prev","onDown","cn","styles","menu","index","open","panelId","jsxs","jsx","el","itemIndex"],"mappings":"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"}
+{"version":3,"file":"Menubar.cjs","names":[],"sources":["../../../src/components/Menubar/Menubar.tsx"],"sourcesContent":["import { useCallback, useEffect, useId, useRef, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Menubar.module.css\";\n\nexport type MenubarItem =\n    | {\n          /** Visible label for the action. */\n          label: ReactNode;\n          /** Invoked when the action is selected. */\n          onSelect?: () => void;\n          /** Disable the action. */\n          disabled?: boolean;\n          /** Optional shortcut hint rendered right-aligned (e.g. `\"⌘S\"`). */\n          shortcut?: string;\n      }\n    | { separator: true };\n\nexport interface MenubarMenu {\n    /** Top-level menu label (e.g. `\"File\"`). */\n    label: ReactNode;\n    /** Items shown in the menu's dropdown. */\n    items: MenubarItem[];\n}\n\nexport interface MenubarProps extends HTMLAttributes<HTMLDivElement> {\n    /** Top-level menus rendered left-to-right. */\n    menus: MenubarMenu[];\n}\n\nfunction isSeparator(item: MenubarItem): item is { separator: true } {\n    return \"separator\" in item;\n}\n\n/**\n * Application menubar (File / Edit-style).\n *\n * - `role=\"menubar\"`; each menu is a button that opens a dropdown.\n * - Arrow Left/Right moves between menus (wrapping); opening one closes others.\n * - Closes on outside click, Escape, or selecting an item.\n * - Items may carry a `shortcut` (right-aligned) or be a `{ separator: true }`.\n *\n * @example\n * <Menubar\n *     menus={[\n *         {\n *             label: \"File\",\n *             items: [\n *                 { label: \"New\", shortcut: \"⌘N\", onSelect: () => create() },\n *                 { separator: true },\n *                 { label: \"Quit\", onSelect: () => quit() },\n *             ],\n *         },\n *     ]}\n * />\n */\nexport function Menubar({ menus, className, ...props }: MenubarProps) {\n    const [openIndex, setOpenIndex] = useState<number>(-1);\n    const baseId = useId();\n    const rootRef = useRef<HTMLDivElement>(null);\n    const triggerRefs = useRef<Array<HTMLButtonElement | null>>([]);\n\n    const close = useCallback((): void => {\n        setOpenIndex(-1);\n    }, []);\n\n    useEffect(() => {\n        if (openIndex === -1) return;\n        const onKey = (event: KeyboardEvent): void => {\n            if (event.key === \"Escape\") {\n                close();\n                triggerRefs.current[openIndex]?.focus();\n                return;\n            }\n            if (event.key === \"ArrowRight\") {\n                event.preventDefault();\n                const next = (openIndex + 1) % menus.length;\n                setOpenIndex(next);\n                triggerRefs.current[next]?.focus();\n            }\n            if (event.key === \"ArrowLeft\") {\n                event.preventDefault();\n                const prev = (openIndex - 1 + menus.length) % menus.length;\n                setOpenIndex(prev);\n                triggerRefs.current[prev]?.focus();\n            }\n        };\n        const onDown = (event: MouseEvent): void => {\n            if (rootRef.current && !rootRef.current.contains(event.target as Node)) close();\n        };\n        window.addEventListener(\"keydown\", onKey);\n        window.addEventListener(\"mousedown\", onDown);\n        return () => {\n            window.removeEventListener(\"keydown\", onKey);\n            window.removeEventListener(\"mousedown\", onDown);\n        };\n    }, [openIndex, menus.length, close]);\n\n    return (\n        <div ref={rootRef} role=\"menubar\" className={cn(styles.root, className)} {...props}>\n            {menus.map((menu, index) => {\n                const open = openIndex === index;\n                const panelId = `${baseId}-panel-${index}`;\n                return (\n                    <div key={index} className={styles.menu}>\n                        <button\n                            ref={(el) => {\n                                triggerRefs.current[index] = el;\n                            }}\n                            type=\"button\"\n                            role=\"menuitem\"\n                            aria-haspopup=\"menu\"\n                            aria-expanded={open}\n                            aria-controls={open ? panelId : undefined}\n                            className={cn(styles.trigger, open && styles.triggerOpen)}\n                            onClick={() => setOpenIndex((prev) => (prev === index ? -1 : index))}\n                        >\n                            {menu.label}\n                        </button>\n                        {open && (\n                            <ul id={panelId} role=\"menu\" className={styles.panel}>\n                                {menu.items.map((item, itemIndex) => {\n                                    if (isSeparator(item)) {\n                                        return (\n                                            <li\n                                                key={itemIndex}\n                                                role=\"separator\"\n                                                className={styles.separator}\n                                                aria-hidden\n                                            />\n                                        );\n                                    }\n                                    return (\n                                        <li key={itemIndex} role=\"none\">\n                                            <button\n                                                type=\"button\"\n                                                role=\"menuitem\"\n                                                className={styles.item}\n                                                disabled={item.disabled}\n                                                onClick={() => {\n                                                    item.onSelect?.();\n                                                    close();\n                                                }}\n                                            >\n                                                <span className={styles.itemLabel}>\n                                                    {item.label}\n                                                </span>\n                                                {item.shortcut && (\n                                                    <span className={styles.shortcut}>\n                                                        {item.shortcut}\n                                                    </span>\n                                                )}\n                                            </button>\n                                        </li>\n                                    );\n                                })}\n                            </ul>\n                        )}\n                    </div>\n                );\n            })}\n        </div>\n    );\n}\n"],"mappings":"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"}