tempest-react-sdk 0.23.0 → 0.24.0

package/dist/components/AppBar/AppBar.js

@@ -1,59 +1,43 @@
-import { jsxs as i, jsx as r, Fragment as g } from "react/jsx-runtime";
-import { ArrowLeft as v } from "lucide-react";
-import { cn as w } from "../../utils/cn.js";
-import e from "./AppBar.module.css.js";
-function C({
-  title: a,
-  leading: s,
-  showBack: t = !1,
-  onBack: c,
-  backLabel: l = "Go back",
-  backIcon: o,
-  brand: n,
-  actions: d,
-  centered: m = !1,
-  sticky: h = !0,
-  tone: f = "surface",
-  bordered: p = !0,
-  safeArea: u = !0,
-  className: b,
-  ...N
-}) {
-  const k = c ?? (() => window.history.back()), y = s ?? /* @__PURE__ */ i(g, { children: [
-    t && /* @__PURE__ */ r(
-      "button",
-      {
-        type: "button",
-        className: e.iconBtn,
-        onClick: k,
-        "aria-label": l,
-        children: o ?? /* @__PURE__ */ r(v, { size: 22, "aria-hidden": "true" })
-      }
-    ),
-    n && /* @__PURE__ */ r("span", { className: e.brand, children: n })
-  ] });
-  return /* @__PURE__ */ i(
-    "header",
-    {
-      className: w(
-        e.bar,
-        e[f],
-        m && e.centered,
-        h && e.sticky,
-        p && e.bordered,
-        u && e.safeArea,
-        b
-      ),
-      ...N,
-      children: [
-        /* @__PURE__ */ r("div", { className: e.leading, children: y }),
-        a != null && a !== "" && /* @__PURE__ */ r("h1", { className: e.title, "aria-live": "polite", children: a }),
-        /* @__PURE__ */ r("div", { className: e.actions, children: d })
-      ]
-    }
-  );
+import { cn as e } from "../../utils/cn.js";
+import t from "./AppBar.module.js";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+import { ArrowLeft as a } from "lucide-react";
+//#region src/components/AppBar/AppBar.tsx
+function o({ title: o, leading: s, showBack: c = !1, onBack: l, backLabel: u = "Go back", backIcon: d, brand: f, actions: p, centered: m = !1, sticky: h = !0, tone: g = "surface", bordered: _ = !0, safeArea: v = !0, className: y, ...b }) {
+	let x = l ?? (() => window.history.back()), S = s ?? /* @__PURE__ */ i(n, { children: [c && /* @__PURE__ */ r("button", {
+		type: "button",
+		className: t.iconBtn,
+		onClick: x,
+		"aria-label": u,
+		children: d ?? /* @__PURE__ */ r(a, {
+			size: 22,
+			"aria-hidden": "true"
+		})
+	}), f && /* @__PURE__ */ r("span", {
+		className: t.brand,
+		children: f
+	})] });
+	return /* @__PURE__ */ i("header", {
+		className: e(t.bar, t[g], m && t.centered, h && t.sticky, _ && t.bordered, v && t.safeArea, y),
+		...b,
+		children: [
+			/* @__PURE__ */ r("div", {
+				className: t.leading,
+				children: S
+			}),
+			o != null && o !== "" && /* @__PURE__ */ r("h1", {
+				className: t.title,
+				"aria-live": "polite",
+				children: o
+			}),
+			/* @__PURE__ */ r("div", {
+				className: t.actions,
+				children: p
+			})
+		]
+	});
 }
-export {
-  C as AppBar
-};
-//# sourceMappingURL=AppBar.js.map
+//#endregion
+export { o as AppBar };
+
+//# sourceMappingURL=AppBar.js.map

package/dist/components/AppBar/AppBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppBar.js","sources":["../../../src/components/AppBar/AppBar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { ArrowLeft } from \"lucide-react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./AppBar.module.css\";\n\nexport type AppBarTone = \"surface\" | \"primary\" | \"transparent\";\n\nexport interface AppBarProps extends Omit<HTMLAttributes<HTMLElement>, \"title\"> {\n    /** Page title — string or any node. Rendered as the bar's `<h1>`. */\n    title?: ReactNode;\n    /**\n     * Replace the whole left slot. When set, the auto back button and `brand`\n     * are ignored — you own the leading content.\n     */\n    leading?: ReactNode;\n    /** Show a back button in the left slot. Ignored when `leading` is set. */\n    showBack?: boolean;\n    /**\n     * Back-button handler. Defaults to `window.history.back()`. With a router,\n     * pass `onBack={() => navigate(-1)}`.\n     */\n    onBack?: () => void;\n    /** Accessible label for the back button. Default `\"Go back\"`. */\n    backLabel?: string;\n    /** Custom back icon. Default a left arrow. */\n    backIcon?: ReactNode;\n    /** Brand / logo node shown in the left slot (after the back button). */\n    brand?: ReactNode;\n    /** Right slot — action buttons / menu. One node or many. */\n    actions?: ReactNode;\n    /** Center the title (three-column grid). Default `false` (left-aligned). */\n    centered?: boolean;\n    /** Stick to the top of the scroll container. Default `true`. */\n    sticky?: boolean;\n    /** Visual tone. Default `\"surface\"`. */\n    tone?: AppBarTone;\n    /** Thin bottom border. Default `true`. */\n    bordered?: boolean;\n    /** Add `env(safe-area-inset-top)` padding (iOS notch / PWA). Default `true`. */\n    safeArea?: boolean;\n}\n\n/**\n * Mobile-first top app bar for PWAs — leading (back / brand) + title +\n * trailing actions, sticky with safe-area padding out of the box.\n *\n * Consumers customise via tokens (`--tempest-*`) and slots; the SDK ships the\n * layout, sticky/safe-area behaviour, and accessible back button so apps don't\n * hand-roll one per screen. For a desktop three-slot nav use [[Navbar]].\n *\n * @example\n * // Detail screen with back + a trailing action\n * <AppBar\n *     title=\"Profile\"\n *     showBack\n *     onBack={() => navigate(-1)}\n *     actions={<IconButton icon={<Settings />} onClick={openSettings} />}\n * />\n *\n * @example\n * // Home screen — brand left, centered title disabled\n * <AppBar brand={<Logo />} actions={<UserMenu />} />\n */\nexport function AppBar({\n    title,\n    leading,\n    showBack = false,\n    onBack,\n    backLabel = \"Go back\",\n    backIcon,\n    brand,\n    actions,\n    centered = false,\n    sticky = true,\n    tone = \"surface\",\n    bordered = true,\n    safeArea = true,\n    className,\n    ...props\n}: AppBarProps) {\n    const handleBack = onBack ?? (() => window.history.back());\n\n    const leadingContent = leading ?? (\n        <>\n            {showBack && (\n                <button\n                    type=\"button\"\n                    className={styles.iconBtn}\n                    onClick={handleBack}\n                    aria-label={backLabel}\n                >\n                    {backIcon ?? <ArrowLeft size={22} aria-hidden=\"true\" />}\n                </button>\n            )}\n            {brand && <span className={styles.brand}>{brand}</span>}\n        </>\n    );\n\n    return (\n        <header\n            className={cn(\n                styles.bar,\n                styles[tone],\n                centered && styles.centered,\n                sticky && styles.sticky,\n                bordered && styles.bordered,\n                safeArea && styles.safeArea,\n                className,\n            )}\n            {...props}\n        >\n            <div className={styles.leading}>{leadingContent}</div>\n            {title != null && title !== \"\" && (\n                <h1 className={styles.title} aria-live=\"polite\">\n                    {title}\n                </h1>\n            )}\n            <div className={styles.actions}>{actions}</div>\n        </header>\n    );\n}\n"],"names":["AppBar","title","leading","showBack","onBack","backLabel","backIcon","brand","actions","centered","sticky","tone","bordered","safeArea","className","props","handleBack","leadingContent","jsxs","Fragment","jsx","styles","ArrowLeft","cn"],"mappings":";;;;AA+DO,SAASA,EAAO;AAAA,EACnB,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,QAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,QAAAC,IAAS;AAAA,EACT,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,UAAAC,IAAW;AAAA,EACX,WAAAC;AAAA,EACA,GAAGC;AACP,GAAgB;AACZ,QAAMC,IAAaZ,MAAW,MAAM,OAAO,QAAQ,KAAA,IAE7Ca,IAAiBf,KACnB,gBAAAgB,EAAAC,GAAA,EACK,UAAA;AAAA,IAAAhB,KACG,gBAAAiB;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,WAAWC,EAAO;AAAA,QAClB,SAASL;AAAA,QACT,cAAYX;AAAA,QAEX,eAAY,gBAAAe,EAACE,GAAA,EAAU,MAAM,IAAI,eAAY,OAAA,CAAO;AAAA,MAAA;AAAA,IAAA;AAAA,IAG5Df,KAAS,gBAAAa,EAAC,QAAA,EAAK,WAAWC,EAAO,OAAQ,UAAAd,EAAA,CAAM;AAAA,EAAA,GACpD;AAGJ,SACI,gBAAAW;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWK;AAAA,QACPF,EAAO;AAAA,QACPA,EAAOV,CAAI;AAAA,QACXF,KAAYY,EAAO;AAAA,QACnBX,KAAUW,EAAO;AAAA,QACjBT,KAAYS,EAAO;AAAA,QACnBR,KAAYQ,EAAO;AAAA,QACnBP;AAAA,MAAA;AAAA,MAEH,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAK,EAAC,OAAA,EAAI,WAAWC,EAAO,SAAU,UAAAJ,GAAe;AAAA,QAC/ChB,KAAS,QAAQA,MAAU,MACxB,gBAAAmB,EAAC,MAAA,EAAG,WAAWC,EAAO,OAAO,aAAU,UAClC,UAAApB,EAAA,CACL;AAAA,QAEJ,gBAAAmB,EAAC,OAAA,EAAI,WAAWC,EAAO,SAAU,UAAAb,EAAA,CAAQ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGrD;"}
+{"version":3,"file":"AppBar.js","names":[],"sources":["../../../src/components/AppBar/AppBar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { ArrowLeft } from \"lucide-react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./AppBar.module.css\";\n\nexport type AppBarTone = \"surface\" | \"primary\" | \"transparent\";\n\nexport interface AppBarProps extends Omit<HTMLAttributes<HTMLElement>, \"title\"> {\n    /** Page title — string or any node. Rendered as the bar's `<h1>`. */\n    title?: ReactNode;\n    /**\n     * Replace the whole left slot. When set, the auto back button and `brand`\n     * are ignored — you own the leading content.\n     */\n    leading?: ReactNode;\n    /** Show a back button in the left slot. Ignored when `leading` is set. */\n    showBack?: boolean;\n    /**\n     * Back-button handler. Defaults to `window.history.back()`. With a router,\n     * pass `onBack={() => navigate(-1)}`.\n     */\n    onBack?: () => void;\n    /** Accessible label for the back button. Default `\"Go back\"`. */\n    backLabel?: string;\n    /** Custom back icon. Default a left arrow. */\n    backIcon?: ReactNode;\n    /** Brand / logo node shown in the left slot (after the back button). */\n    brand?: ReactNode;\n    /** Right slot — action buttons / menu. One node or many. */\n    actions?: ReactNode;\n    /** Center the title (three-column grid). Default `false` (left-aligned). */\n    centered?: boolean;\n    /** Stick to the top of the scroll container. Default `true`. */\n    sticky?: boolean;\n    /** Visual tone. Default `\"surface\"`. */\n    tone?: AppBarTone;\n    /** Thin bottom border. Default `true`. */\n    bordered?: boolean;\n    /** Add `env(safe-area-inset-top)` padding (iOS notch / PWA). Default `true`. */\n    safeArea?: boolean;\n}\n\n/**\n * Mobile-first top app bar for PWAs — leading (back / brand) + title +\n * trailing actions, sticky with safe-area padding out of the box.\n *\n * Consumers customise via tokens (`--tempest-*`) and slots; the SDK ships the\n * layout, sticky/safe-area behaviour, and accessible back button so apps don't\n * hand-roll one per screen. For a desktop three-slot nav use [[Navbar]].\n *\n * @example\n * // Detail screen with back + a trailing action\n * <AppBar\n *     title=\"Profile\"\n *     showBack\n *     onBack={() => navigate(-1)}\n *     actions={<IconButton icon={<Settings />} onClick={openSettings} />}\n * />\n *\n * @example\n * // Home screen — brand left, centered title disabled\n * <AppBar brand={<Logo />} actions={<UserMenu />} />\n */\nexport function AppBar({\n    title,\n    leading,\n    showBack = false,\n    onBack,\n    backLabel = \"Go back\",\n    backIcon,\n    brand,\n    actions,\n    centered = false,\n    sticky = true,\n    tone = \"surface\",\n    bordered = true,\n    safeArea = true,\n    className,\n    ...props\n}: AppBarProps) {\n    const handleBack = onBack ?? (() => window.history.back());\n\n    const leadingContent = leading ?? (\n        <>\n            {showBack && (\n                <button\n                    type=\"button\"\n                    className={styles.iconBtn}\n                    onClick={handleBack}\n                    aria-label={backLabel}\n                >\n                    {backIcon ?? <ArrowLeft size={22} aria-hidden=\"true\" />}\n                </button>\n            )}\n            {brand && <span className={styles.brand}>{brand}</span>}\n        </>\n    );\n\n    return (\n        <header\n            className={cn(\n                styles.bar,\n                styles[tone],\n                centered && styles.centered,\n                sticky && styles.sticky,\n                bordered && styles.bordered,\n                safeArea && styles.safeArea,\n                className,\n            )}\n            {...props}\n        >\n            <div className={styles.leading}>{leadingContent}</div>\n            {title != null && title !== \"\" && (\n                <h1 className={styles.title} aria-live=\"polite\">\n                    {title}\n                </h1>\n            )}\n            <div className={styles.actions}>{actions}</div>\n        </header>\n    );\n}\n"],"mappings":";;;;;AA+DA,SAAgB,EAAO,EACnB,UACA,YACA,cAAW,IACX,WACA,eAAY,WACZ,aACA,UACA,YACA,cAAW,IACX,YAAS,IACT,UAAO,WACP,cAAW,IACX,cAAW,IACX,cACA,GAAG,KACS;CACZ,IAAM,IAAa,YAAiB,OAAO,QAAQ,KAAK,IAElD,IAAiB,KACnB,kBAAA,GAAA,EAAA,UAAA,CACK,KACG,kBAAC,UAAD;EACI,MAAK;EACL,WAAW,EAAO;EAClB,SAAS;EACT,cAAY;YAEX,KAAY,kBAAC,GAAD;GAAW,MAAM;GAAI,eAAY;EAAQ,CAAA;CAClD,CAAA,GAEX,KAAS,kBAAC,QAAD;EAAM,WAAW,EAAO;YAAQ;CAAY,CAAA,CACxD,EAAA,CAAA;CAGN,OACI,kBAAC,UAAD;EACI,WAAW,EACP,EAAO,KACP,EAAO,IACP,KAAY,EAAO,UACnB,KAAU,EAAO,QACjB,KAAY,EAAO,UACnB,KAAY,EAAO,UACnB,CACJ;EACA,GAAI;YAVR;GAYI,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAU;GAAoB,CAAA;GACpD,KAAS,QAAQ,MAAU,MACxB,kBAAC,MAAD;IAAI,WAAW,EAAO;IAAO,aAAU;cAClC;GACD,CAAA;GAER,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAU;GAAa,CAAA;EAC1C;;AAEhB"}

package/dist/components/AppBar/AppBar.module.cjs

@@ -0,0 +1,2 @@
+var e=`tempest_bar_SHqWS`,t=`tempest_centered_S0CCw`,n=`tempest_surface_fusKb`,r=`tempest_primary_QcCyN`,i=`tempest_transparent_uGrsu`,a=`tempest_bordered_5M9FZ`,o=`tempest_sticky_DStUO`,s=`tempest_safeArea_Vo3Bi`,c=`tempest_leading_mXv-d`,l=`tempest_actions_x7tMx`,u=`tempest_title_qaMMQ`,d=`tempest_brand_xKt54`,f=`tempest_iconBtn_S-BTg`,p={bar:e,centered:t,surface:n,primary:r,transparent:i,bordered:a,sticky:o,safeArea:s,leading:c,actions:l,title:u,brand:d,iconBtn:f};exports.actions=l,exports.bar=e,exports.bordered=a,exports.brand=d,exports.centered=t,exports.default=p,exports.iconBtn=f,exports.leading=c,exports.primary=r,exports.safeArea=s,exports.sticky=o,exports.surface=n,exports.title=u,exports.transparent=i;
+//# sourceMappingURL=AppBar.module.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AppBar.module.cjs","names":[],"sources":["../../../src/components/AppBar/AppBar.module.css"],"sourcesContent":[".bar {\n    display: grid;\n    grid-template-columns: auto 1fr auto;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    width: 100%;\n    min-height: 56px;\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    font-family: var(--tempest-font-sans);\n}\n\n/* Symmetric side columns so the title is truly centered. */\n.bar.centered {\n    grid-template-columns: 1fr auto 1fr;\n}\n\n.bar.surface {\n    background: var(--tempest-surface);\n    color: var(--tempest-text);\n}\n\n.bar.primary {\n    background: var(--tempest-primary);\n    color: var(--tempest-text-on-primary);\n}\n\n.bar.transparent {\n    background: transparent;\n    color: inherit;\n}\n\n.bar.bordered {\n    border-bottom: 1px solid var(--tempest-border);\n}\n\n.bar.sticky {\n    position: sticky;\n    top: 0;\n    z-index: 30;\n}\n\n.bar.safeArea {\n    padding-top: max(var(--tempest-space-3), env(safe-area-inset-top, 0px));\n}\n\n.leading {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    min-width: 0;\n}\n\n.actions {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    gap: var(--tempest-space-1);\n    min-width: 0;\n}\n\n.title {\n    margin: 0;\n    min-width: 0;\n    font-size: var(--tempest-text-xl);\n    font-weight: var(--tempest-weight-bold);\n    line-height: 1.2;\n    text-align: left;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n\n.bar.centered .title {\n    text-align: center;\n}\n\n.brand {\n    font-size: var(--tempest-text-lg);\n    font-weight: var(--tempest-weight-bold);\n    color: inherit;\n    white-space: nowrap;\n}\n\n.iconBtn {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: 0 0 auto;\n    width: 36px;\n    height: 36px;\n    padding: 0;\n    border: none;\n    border-radius: var(--tempest-radius-full);\n    background: transparent;\n    color: inherit;\n    cursor: pointer;\n}\n\n.iconBtn:hover {\n    background: var(--tempest-surface-2);\n}\n\n.iconBtn:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: var(--tempest-focus-ring-offset);\n}\n"],"mappings":""}

package/dist/components/AppBar/AppBar.module.js

@@ -0,0 +1,20 @@
+//#region src/components/AppBar/AppBar.module.css
+var e = "tempest_bar_SHqWS", t = "tempest_centered_S0CCw", n = "tempest_surface_fusKb", r = "tempest_primary_QcCyN", i = "tempest_transparent_uGrsu", a = "tempest_bordered_5M9FZ", o = "tempest_sticky_DStUO", s = "tempest_safeArea_Vo3Bi", c = "tempest_leading_mXv-d", l = "tempest_actions_x7tMx", u = "tempest_title_qaMMQ", d = "tempest_brand_xKt54", f = "tempest_iconBtn_S-BTg", p = {
+	bar: e,
+	centered: t,
+	surface: n,
+	primary: r,
+	transparent: i,
+	bordered: a,
+	sticky: o,
+	safeArea: s,
+	leading: c,
+	actions: l,
+	title: u,
+	brand: d,
+	iconBtn: f
+};
+//#endregion
+export { l as actions, e as bar, a as bordered, d as brand, t as centered, p as default, f as iconBtn, c as leading, r as primary, s as safeArea, o as sticky, n as surface, u as title, i as transparent };
+
+//# sourceMappingURL=AppBar.module.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AppBar.module.js","names":[],"sources":["../../../src/components/AppBar/AppBar.module.css"],"sourcesContent":[".bar {\n    display: grid;\n    grid-template-columns: auto 1fr auto;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    width: 100%;\n    min-height: 56px;\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    font-family: var(--tempest-font-sans);\n}\n\n/* Symmetric side columns so the title is truly centered. */\n.bar.centered {\n    grid-template-columns: 1fr auto 1fr;\n}\n\n.bar.surface {\n    background: var(--tempest-surface);\n    color: var(--tempest-text);\n}\n\n.bar.primary {\n    background: var(--tempest-primary);\n    color: var(--tempest-text-on-primary);\n}\n\n.bar.transparent {\n    background: transparent;\n    color: inherit;\n}\n\n.bar.bordered {\n    border-bottom: 1px solid var(--tempest-border);\n}\n\n.bar.sticky {\n    position: sticky;\n    top: 0;\n    z-index: 30;\n}\n\n.bar.safeArea {\n    padding-top: max(var(--tempest-space-3), env(safe-area-inset-top, 0px));\n}\n\n.leading {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    min-width: 0;\n}\n\n.actions {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    gap: var(--tempest-space-1);\n    min-width: 0;\n}\n\n.title {\n    margin: 0;\n    min-width: 0;\n    font-size: var(--tempest-text-xl);\n    font-weight: var(--tempest-weight-bold);\n    line-height: 1.2;\n    text-align: left;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n\n.bar.centered .title {\n    text-align: center;\n}\n\n.brand {\n    font-size: var(--tempest-text-lg);\n    font-weight: var(--tempest-weight-bold);\n    color: inherit;\n    white-space: nowrap;\n}\n\n.iconBtn {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: 0 0 auto;\n    width: 36px;\n    height: 36px;\n    padding: 0;\n    border: none;\n    border-radius: var(--tempest-radius-full);\n    background: transparent;\n    color: inherit;\n    cursor: pointer;\n}\n\n.iconBtn:hover {\n    background: var(--tempest-surface-2);\n}\n\n.iconBtn:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: var(--tempest-focus-ring-offset);\n}\n"],"mappings":""}

package/dist/components/AppShell/AppShell.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../../utils/cn.cjs"),m=require("../../hooks/use-breakpoint.cjs"),s=require("./AppShell.module.css.cjs");function h({navbar:l,sidebar:a,bottomNav:i,footer:c,sidebarBreakpoint:n="md",className:r,children:t,...u}){const d=m.useBreakpoint().above(n);return e.jsxs("div",{className:o.cn(s.default.shell,r),...u,children:[l&&e.jsx("div",{className:s.default.navbar,children:l}),e.jsxs("div",{className:s.default.row,children:[a&&d&&e.jsx("div",{className:s.default.sidebar,children:a}),e.jsx("main",{className:s.default.main,children:t})]}),c&&e.jsx("div",{className:s.default.footer,children:c}),i&&!d&&e.jsx("div",{className:s.default.bottomNav,children:i})]})}exports.AppShell=h;
-//# sourceMappingURL=AppShell.cjs.map
+const e=require("../../utils/cn.cjs"),t=require("../../hooks/use-breakpoint.cjs"),n=require("./AppShell.module.cjs");let r=require("react/jsx-runtime");function i({navbar:i,sidebar:a,bottomNav:o,footer:s,sidebarBreakpoint:c=`md`,className:l,children:u,...d}){let f=t.useBreakpoint().above(c);return(0,r.jsxs)(`div`,{className:e.cn(n.default.shell,l),...d,children:[i&&(0,r.jsx)(`div`,{className:n.default.navbar,children:i}),(0,r.jsxs)(`div`,{className:n.default.row,children:[a&&f&&(0,r.jsx)(`div`,{className:n.default.sidebar,children:a}),(0,r.jsx)(`main`,{className:n.default.main,children:u})]}),s&&(0,r.jsx)(`div`,{className:n.default.footer,children:s}),o&&!f&&(0,r.jsx)(`div`,{className:n.default.bottomNav,children:o})]})}exports.AppShell=i;
+//# sourceMappingURL=AppShell.cjs.map

package/dist/components/AppShell/AppShell.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AppShell.cjs","sources":["../../../src/components/AppShell/AppShell.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport { useBreakpoint } from \"@/hooks/use-breakpoint\";\nimport styles from \"./AppShell.module.css\";\n\nexport interface AppShellProps extends HTMLAttributes<HTMLDivElement> {\n    /** Top navigation bar (Navbar / custom). Renders on every breakpoint. */\n    navbar?: ReactNode;\n    /** Side navigation (Sidebar). Hidden below `md` — pair with `<Drawer>` for mobile. */\n    sidebar?: ReactNode;\n    /** Mobile-only bottom navigation (BottomNavigation). Hidden at `md+`. */\n    bottomNav?: ReactNode;\n    /** Footer rendered after the main content. */\n    footer?: ReactNode;\n    /** Breakpoint at which the sidebar appears. Default `\"md\"`. */\n    sidebarBreakpoint?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n    children?: ReactNode;\n}\n\n/**\n * Full app layout — composes [[Navbar]] + [[Sidebar]] + content +\n * [[BottomNavigation]] + footer with responsive behaviour:\n *\n * - **Desktop (`>= sidebarBreakpoint`)**: navbar + sidebar + main + footer.\n * - **Mobile (`< sidebarBreakpoint`)**: navbar + main + bottom nav + footer\n *   (sidebar hidden — app should expose it via `<Drawer>` from a hamburger).\n *\n * @example\n * <AppShell\n *     navbar={<Navbar logo={<Brand />} actions={<UserMenu />} />}\n *     sidebar={<Sidebar items={...} value={tab} onChange={setTab} />}\n *     bottomNav={<BottomNavigation items={...} value={tab} onChange={setTab} />}\n *     footer={<Footer />}\n * >\n *     <Page title=\"Dashboard\">{content}</Page>\n * </AppShell>\n */\nexport function AppShell({\n    navbar,\n    sidebar,\n    bottomNav,\n    footer,\n    sidebarBreakpoint = \"md\",\n    className,\n    children,\n    ...props\n}: AppShellProps) {\n    const bp = useBreakpoint();\n    const showSidebar = bp.above(sidebarBreakpoint);\n    return (\n        <div className={cn(styles.shell, className)} {...props}>\n            {navbar && <div className={styles.navbar}>{navbar}</div>}\n            <div className={styles.row}>\n                {sidebar && showSidebar && <div className={styles.sidebar}>{sidebar}</div>}\n                <main className={styles.main}>{children}</main>\n            </div>\n            {footer && <div className={styles.footer}>{footer}</div>}\n            {bottomNav && !showSidebar && <div className={styles.bottomNav}>{bottomNav}</div>}\n        </div>\n    );\n}\n"],"names":["AppShell","navbar","sidebar","bottomNav","footer","sidebarBreakpoint","className","children","props","showSidebar","useBreakpoint","jsxs","cn","styles","jsx"],"mappings":"wOAqCO,SAASA,EAAS,CACrB,OAAAC,EACA,QAAAC,EACA,UAAAC,EACA,OAAAC,EACA,kBAAAC,EAAoB,KACpB,UAAAC,EACA,SAAAC,EACA,GAAGC,CACP,EAAkB,CAEd,MAAMC,EADKC,EAAAA,cAAA,EACY,MAAML,CAAiB,EAC9C,OACIM,OAAC,OAAI,UAAWC,EAAAA,GAAGC,UAAO,MAAOP,CAAS,EAAI,GAAGE,EAC5C,SAAA,CAAAP,GAAUa,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,OAAS,SAAAZ,EAAO,EAClDU,EAAAA,KAAC,MAAA,CAAI,UAAWE,EAAAA,QAAO,IAClB,SAAA,CAAAX,GAAWO,GAAeK,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,QAAU,SAAAX,EAAQ,EACpEY,EAAAA,IAAC,OAAA,CAAK,UAAWD,EAAAA,QAAO,KAAO,SAAAN,CAAA,CAAS,CAAA,EAC5C,EACCH,GAAUU,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,OAAS,SAAAT,EAAO,EACjDD,GAAa,CAACM,GAAeK,EAAAA,IAAC,OAAI,UAAWD,UAAO,UAAY,SAAAV,CAAA,CAAU,CAAA,EAC/E,CAER"}
+{"version":3,"file":"AppShell.cjs","names":[],"sources":["../../../src/components/AppShell/AppShell.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport { useBreakpoint } from \"@/hooks/use-breakpoint\";\nimport styles from \"./AppShell.module.css\";\n\nexport interface AppShellProps extends HTMLAttributes<HTMLDivElement> {\n    /** Top navigation bar (Navbar / custom). Renders on every breakpoint. */\n    navbar?: ReactNode;\n    /** Side navigation (Sidebar). Hidden below `md` — pair with `<Drawer>` for mobile. */\n    sidebar?: ReactNode;\n    /** Mobile-only bottom navigation (BottomNavigation). Hidden at `md+`. */\n    bottomNav?: ReactNode;\n    /** Footer rendered after the main content. */\n    footer?: ReactNode;\n    /** Breakpoint at which the sidebar appears. Default `\"md\"`. */\n    sidebarBreakpoint?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n    children?: ReactNode;\n}\n\n/**\n * Full app layout — composes [[Navbar]] + [[Sidebar]] + content +\n * [[BottomNavigation]] + footer with responsive behaviour:\n *\n * - **Desktop (`>= sidebarBreakpoint`)**: navbar + sidebar + main + footer.\n * - **Mobile (`< sidebarBreakpoint`)**: navbar + main + bottom nav + footer\n *   (sidebar hidden — app should expose it via `<Drawer>` from a hamburger).\n *\n * @example\n * <AppShell\n *     navbar={<Navbar logo={<Brand />} actions={<UserMenu />} />}\n *     sidebar={<Sidebar items={...} value={tab} onChange={setTab} />}\n *     bottomNav={<BottomNavigation items={...} value={tab} onChange={setTab} />}\n *     footer={<Footer />}\n * >\n *     <Page title=\"Dashboard\">{content}</Page>\n * </AppShell>\n */\nexport function AppShell({\n    navbar,\n    sidebar,\n    bottomNav,\n    footer,\n    sidebarBreakpoint = \"md\",\n    className,\n    children,\n    ...props\n}: AppShellProps) {\n    const bp = useBreakpoint();\n    const showSidebar = bp.above(sidebarBreakpoint);\n    return (\n        <div className={cn(styles.shell, className)} {...props}>\n            {navbar && <div className={styles.navbar}>{navbar}</div>}\n            <div className={styles.row}>\n                {sidebar && showSidebar && <div className={styles.sidebar}>{sidebar}</div>}\n                <main className={styles.main}>{children}</main>\n            </div>\n            {footer && <div className={styles.footer}>{footer}</div>}\n            {bottomNav && !showSidebar && <div className={styles.bottomNav}>{bottomNav}</div>}\n        </div>\n    );\n}\n"],"mappings":"wJAqCA,SAAgB,EAAS,CACrB,SACA,UACA,YACA,SACA,oBAAoB,KACpB,YACA,WACA,GAAG,GACW,CAEd,IAAM,EADK,EAAA,cACS,CAAA,CAAG,MAAM,CAAiB,EAC9C,OACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,GAAG,EAAA,QAAO,MAAO,CAAS,EAAG,GAAI,WAAjD,CACK,IAAU,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,gBAAS,CAAY,CAAA,GACvD,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,aAAvB,CACK,GAAW,IAAe,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,iBAAU,CAAa,CAAA,GACzE,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,KAAO,UAAe,CAAA,CAC7C,IACJ,IAAU,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,gBAAS,CAAY,CAAA,EACtD,GAAa,CAAC,IAAe,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,mBAAY,CAAe,CAAA,CAC/E,GAEb"}

package/dist/components/AppShell/AppShell.js

@@ -1,29 +1,40 @@
-import { jsxs as c, jsx as e } from "react/jsx-runtime";
-import { cn as p } from "../../utils/cn.js";
-import { useBreakpoint as h } from "../../hooks/use-breakpoint.js";
-import s from "./AppShell.module.css.js";
-function x({
-  navbar: i,
-  sidebar: r,
-  bottomNav: a,
-  footer: l,
-  sidebarBreakpoint: o = "md",
-  className: n,
-  children: d,
-  ...t
-}) {
-  const m = h().above(o);
-  return /* @__PURE__ */ c("div", { className: p(s.shell, n), ...t, children: [
-    i && /* @__PURE__ */ e("div", { className: s.navbar, children: i }),
-    /* @__PURE__ */ c("div", { className: s.row, children: [
-      r && m && /* @__PURE__ */ e("div", { className: s.sidebar, children: r }),
-      /* @__PURE__ */ e("main", { className: s.main, children: d })
-    ] }),
-    l && /* @__PURE__ */ e("div", { className: s.footer, children: l }),
-    a && !m && /* @__PURE__ */ e("div", { className: s.bottomNav, children: a })
-  ] });
+import { cn as e } from "../../utils/cn.js";
+import { useBreakpoint as t } from "../../hooks/use-breakpoint.js";
+import n from "./AppShell.module.js";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/AppShell/AppShell.tsx
+function a({ navbar: a, sidebar: o, bottomNav: s, footer: c, sidebarBreakpoint: l = "md", className: u, children: d, ...f }) {
+	let p = t().above(l);
+	return /* @__PURE__ */ i("div", {
+		className: e(n.shell, u),
+		...f,
+		children: [
+			a && /* @__PURE__ */ r("div", {
+				className: n.navbar,
+				children: a
+			}),
+			/* @__PURE__ */ i("div", {
+				className: n.row,
+				children: [o && p && /* @__PURE__ */ r("div", {
+					className: n.sidebar,
+					children: o
+				}), /* @__PURE__ */ r("main", {
+					className: n.main,
+					children: d
+				})]
+			}),
+			c && /* @__PURE__ */ r("div", {
+				className: n.footer,
+				children: c
+			}),
+			s && !p && /* @__PURE__ */ r("div", {
+				className: n.bottomNav,
+				children: s
+			})
+		]
+	});
 }
-export {
-  x as AppShell
-};
-//# sourceMappingURL=AppShell.js.map
+//#endregion
+export { a as AppShell };
+
+//# sourceMappingURL=AppShell.js.map

package/dist/components/AppShell/AppShell.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppShell.js","sources":["../../../src/components/AppShell/AppShell.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport { useBreakpoint } from \"@/hooks/use-breakpoint\";\nimport styles from \"./AppShell.module.css\";\n\nexport interface AppShellProps extends HTMLAttributes<HTMLDivElement> {\n    /** Top navigation bar (Navbar / custom). Renders on every breakpoint. */\n    navbar?: ReactNode;\n    /** Side navigation (Sidebar). Hidden below `md` — pair with `<Drawer>` for mobile. */\n    sidebar?: ReactNode;\n    /** Mobile-only bottom navigation (BottomNavigation). Hidden at `md+`. */\n    bottomNav?: ReactNode;\n    /** Footer rendered after the main content. */\n    footer?: ReactNode;\n    /** Breakpoint at which the sidebar appears. Default `\"md\"`. */\n    sidebarBreakpoint?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n    children?: ReactNode;\n}\n\n/**\n * Full app layout — composes [[Navbar]] + [[Sidebar]] + content +\n * [[BottomNavigation]] + footer with responsive behaviour:\n *\n * - **Desktop (`>= sidebarBreakpoint`)**: navbar + sidebar + main + footer.\n * - **Mobile (`< sidebarBreakpoint`)**: navbar + main + bottom nav + footer\n *   (sidebar hidden — app should expose it via `<Drawer>` from a hamburger).\n *\n * @example\n * <AppShell\n *     navbar={<Navbar logo={<Brand />} actions={<UserMenu />} />}\n *     sidebar={<Sidebar items={...} value={tab} onChange={setTab} />}\n *     bottomNav={<BottomNavigation items={...} value={tab} onChange={setTab} />}\n *     footer={<Footer />}\n * >\n *     <Page title=\"Dashboard\">{content}</Page>\n * </AppShell>\n */\nexport function AppShell({\n    navbar,\n    sidebar,\n    bottomNav,\n    footer,\n    sidebarBreakpoint = \"md\",\n    className,\n    children,\n    ...props\n}: AppShellProps) {\n    const bp = useBreakpoint();\n    const showSidebar = bp.above(sidebarBreakpoint);\n    return (\n        <div className={cn(styles.shell, className)} {...props}>\n            {navbar && <div className={styles.navbar}>{navbar}</div>}\n            <div className={styles.row}>\n                {sidebar && showSidebar && <div className={styles.sidebar}>{sidebar}</div>}\n                <main className={styles.main}>{children}</main>\n            </div>\n            {footer && <div className={styles.footer}>{footer}</div>}\n            {bottomNav && !showSidebar && <div className={styles.bottomNav}>{bottomNav}</div>}\n        </div>\n    );\n}\n"],"names":["AppShell","navbar","sidebar","bottomNav","footer","sidebarBreakpoint","className","children","props","showSidebar","useBreakpoint","jsxs","cn","styles","jsx"],"mappings":";;;;AAqCO,SAASA,EAAS;AAAA,EACrB,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,mBAAAC,IAAoB;AAAA,EACpB,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACP,GAAkB;AAEd,QAAMC,IADKC,EAAA,EACY,MAAML,CAAiB;AAC9C,SACI,gBAAAM,EAAC,SAAI,WAAWC,EAAGC,EAAO,OAAOP,CAAS,GAAI,GAAGE,GAC5C,UAAA;AAAA,IAAAP,KAAU,gBAAAa,EAAC,OAAA,EAAI,WAAWD,EAAO,QAAS,UAAAZ,GAAO;AAAA,IAClD,gBAAAU,EAAC,OAAA,EAAI,WAAWE,EAAO,KAClB,UAAA;AAAA,MAAAX,KAAWO,KAAe,gBAAAK,EAAC,OAAA,EAAI,WAAWD,EAAO,SAAU,UAAAX,GAAQ;AAAA,MACpE,gBAAAY,EAAC,QAAA,EAAK,WAAWD,EAAO,MAAO,UAAAN,EAAA,CAAS;AAAA,IAAA,GAC5C;AAAA,IACCH,KAAU,gBAAAU,EAAC,OAAA,EAAI,WAAWD,EAAO,QAAS,UAAAT,GAAO;AAAA,IACjDD,KAAa,CAACM,KAAe,gBAAAK,EAAC,SAAI,WAAWD,EAAO,WAAY,UAAAV,EAAA,CAAU;AAAA,EAAA,GAC/E;AAER;"}
+{"version":3,"file":"AppShell.js","names":[],"sources":["../../../src/components/AppShell/AppShell.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport { useBreakpoint } from \"@/hooks/use-breakpoint\";\nimport styles from \"./AppShell.module.css\";\n\nexport interface AppShellProps extends HTMLAttributes<HTMLDivElement> {\n    /** Top navigation bar (Navbar / custom). Renders on every breakpoint. */\n    navbar?: ReactNode;\n    /** Side navigation (Sidebar). Hidden below `md` — pair with `<Drawer>` for mobile. */\n    sidebar?: ReactNode;\n    /** Mobile-only bottom navigation (BottomNavigation). Hidden at `md+`. */\n    bottomNav?: ReactNode;\n    /** Footer rendered after the main content. */\n    footer?: ReactNode;\n    /** Breakpoint at which the sidebar appears. Default `\"md\"`. */\n    sidebarBreakpoint?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n    children?: ReactNode;\n}\n\n/**\n * Full app layout — composes [[Navbar]] + [[Sidebar]] + content +\n * [[BottomNavigation]] + footer with responsive behaviour:\n *\n * - **Desktop (`>= sidebarBreakpoint`)**: navbar + sidebar + main + footer.\n * - **Mobile (`< sidebarBreakpoint`)**: navbar + main + bottom nav + footer\n *   (sidebar hidden — app should expose it via `<Drawer>` from a hamburger).\n *\n * @example\n * <AppShell\n *     navbar={<Navbar logo={<Brand />} actions={<UserMenu />} />}\n *     sidebar={<Sidebar items={...} value={tab} onChange={setTab} />}\n *     bottomNav={<BottomNavigation items={...} value={tab} onChange={setTab} />}\n *     footer={<Footer />}\n * >\n *     <Page title=\"Dashboard\">{content}</Page>\n * </AppShell>\n */\nexport function AppShell({\n    navbar,\n    sidebar,\n    bottomNav,\n    footer,\n    sidebarBreakpoint = \"md\",\n    className,\n    children,\n    ...props\n}: AppShellProps) {\n    const bp = useBreakpoint();\n    const showSidebar = bp.above(sidebarBreakpoint);\n    return (\n        <div className={cn(styles.shell, className)} {...props}>\n            {navbar && <div className={styles.navbar}>{navbar}</div>}\n            <div className={styles.row}>\n                {sidebar && showSidebar && <div className={styles.sidebar}>{sidebar}</div>}\n                <main className={styles.main}>{children}</main>\n            </div>\n            {footer && <div className={styles.footer}>{footer}</div>}\n            {bottomNav && !showSidebar && <div className={styles.bottomNav}>{bottomNav}</div>}\n        </div>\n    );\n}\n"],"mappings":";;;;;AAqCA,SAAgB,EAAS,EACrB,WACA,YACA,cACA,WACA,uBAAoB,MACpB,cACA,aACA,GAAG,KACW;CAEd,IAAM,IADK,EACS,CAAA,CAAG,MAAM,CAAiB;CAC9C,OACI,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAO,OAAO,CAAS;EAAG,GAAI;YAAjD;GACK,KAAU,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAS;GAAY,CAAA;GACvD,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAvB,CACK,KAAW,KAAe,kBAAC,OAAD;KAAK,WAAW,EAAO;eAAU;IAAa,CAAA,GACzE,kBAAC,QAAD;KAAM,WAAW,EAAO;KAAO;IAAe,CAAA,CAC7C;;GACJ,KAAU,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAS;GAAY,CAAA;GACtD,KAAa,CAAC,KAAe,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAY;GAAe,CAAA;EAC/E;;AAEb"}

package/dist/components/AppShell/AppShell.module.cjs

@@ -0,0 +1,2 @@
+var e=`tempest_shell_-xp0O`,t=`tempest_navbar_liTKV`,n=`tempest_row_PE41P`,r=`tempest_sidebar_wyx-V`,i=`tempest_main_O3GFv`,a=`tempest_footer_IFW4q`,o=`tempest_bottomNav_pKJ1v`,s={shell:e,navbar:t,row:n,sidebar:r,main:i,footer:a,bottomNav:o};exports.bottomNav=o,exports.default=s,exports.footer=a,exports.main=i,exports.navbar=t,exports.row=n,exports.shell=e,exports.sidebar=r;
+//# sourceMappingURL=AppShell.module.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AppShell.module.cjs","names":[],"sources":["../../../src/components/AppShell/AppShell.module.css"],"sourcesContent":[".shell {\n    display: flex;\n    flex-direction: column;\n    min-height: 100dvh;\n    width: 100%;\n    background: var(--tempest-bg);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n}\n\n.navbar {\n    flex: 0 0 auto;\n}\n\n.row {\n    flex: 1 1 auto;\n    display: flex;\n    min-height: 0;\n    width: 100%;\n}\n\n.sidebar {\n    flex: 0 0 auto;\n}\n\n.main {\n    flex: 1 1 auto;\n    min-width: 0;\n    overflow-x: auto;\n}\n\n.footer {\n    flex: 0 0 auto;\n}\n\n.bottomNav {\n    position: sticky;\n    bottom: 0;\n    z-index: 30;\n    flex: 0 0 auto;\n}\n"],"mappings":""}

package/dist/components/AppShell/AppShell.module.js

@@ -0,0 +1,14 @@
+//#region src/components/AppShell/AppShell.module.css
+var e = "tempest_shell_-xp0O", t = "tempest_navbar_liTKV", n = "tempest_row_PE41P", r = "tempest_sidebar_wyx-V", i = "tempest_main_O3GFv", a = "tempest_footer_IFW4q", o = "tempest_bottomNav_pKJ1v", s = {
+	shell: e,
+	navbar: t,
+	row: n,
+	sidebar: r,
+	main: i,
+	footer: a,
+	bottomNav: o
+};
+//#endregion
+export { o as bottomNav, s as default, a as footer, i as main, t as navbar, n as row, e as shell, r as sidebar };
+
+//# sourceMappingURL=AppShell.module.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AppShell.module.js","names":[],"sources":["../../../src/components/AppShell/AppShell.module.css"],"sourcesContent":[".shell {\n    display: flex;\n    flex-direction: column;\n    min-height: 100dvh;\n    width: 100%;\n    background: var(--tempest-bg);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n}\n\n.navbar {\n    flex: 0 0 auto;\n}\n\n.row {\n    flex: 1 1 auto;\n    display: flex;\n    min-height: 0;\n    width: 100%;\n}\n\n.sidebar {\n    flex: 0 0 auto;\n}\n\n.main {\n    flex: 1 1 auto;\n    min-width: 0;\n    overflow-x: auto;\n}\n\n.footer {\n    flex: 0 0 auto;\n}\n\n.bottomNav {\n    position: sticky;\n    bottom: 0;\n    z-index: 30;\n    flex: 0 0 auto;\n}\n"],"mappings":""}

package/dist/components/AspectRatio/AspectRatio.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),r=require("../../utils/cn.cjs"),a=require("./AspectRatio.module.css.cjs");function u({ratio:t=16/9,className:e,style:s,children:c,...i}){const n={aspectRatio:String(t),...s};return o.jsx("div",{className:r.cn(a.default.aspect,e),style:n,...i,children:c})}exports.AspectRatio=u;
-//# sourceMappingURL=AspectRatio.cjs.map
+const e=require("../../utils/cn.cjs"),t=require("./AspectRatio.module.cjs");let n=require("react/jsx-runtime");function r({ratio:r=16/9,className:i,style:a,children:o,...s}){let c={aspectRatio:String(r),...a};return(0,n.jsx)(`div`,{className:e.cn(t.default.aspect,i),style:c,...s,children:o})}exports.AspectRatio=r;
+//# sourceMappingURL=AspectRatio.cjs.map

package/dist/components/AspectRatio/AspectRatio.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AspectRatio.cjs","sources":["../../../src/components/AspectRatio/AspectRatio.tsx"],"sourcesContent":["import type { CSSProperties, HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./AspectRatio.module.css\";\n\nexport interface AspectRatioProps extends HTMLAttributes<HTMLDivElement> {\n    /**\n     * Width-to-height ratio. Pass `16/9` for widescreen, `1` for square,\n     * `4/3` for SD video, `3/4` for portrait, etc. Default `16/9`.\n     */\n    ratio?: number;\n    children?: ReactNode;\n}\n\n/**\n * Preserve a constant aspect ratio for media (images, video, embeds). The\n * inner child stretches to fill the box. Uses the native `aspect-ratio`\n * CSS property — works on all modern browsers (Safari 15+, Chrome 88+).\n *\n * @example\n * <AspectRatio ratio={16 / 9}>\n *     <img src=\"/cover.jpg\" alt=\"\" style={{ width: \"100%\", height: \"100%\", objectFit: \"cover\" }} />\n * </AspectRatio>\n */\nexport function AspectRatio({\n    ratio = 16 / 9,\n    className,\n    style,\n    children,\n    ...props\n}: AspectRatioProps) {\n    const finalStyle: CSSProperties = { aspectRatio: String(ratio), ...style };\n    return (\n        <div className={cn(styles.aspect, className)} style={finalStyle} {...props}>\n            {children}\n        </div>\n    );\n}\n"],"names":["AspectRatio","ratio","className","style","children","props","finalStyle","jsx","cn","styles"],"mappings":"+LAuBO,SAASA,EAAY,CACxB,MAAAC,EAAQ,GAAK,EACb,UAAAC,EACA,MAAAC,EACA,SAAAC,EACA,GAAGC,CACP,EAAqB,CACjB,MAAMC,EAA4B,CAAE,YAAa,OAAOL,CAAK,EAAG,GAAGE,CAAA,EACnE,OACII,EAAAA,IAAC,MAAA,CAAI,UAAWC,EAAAA,GAAGC,EAAAA,QAAO,OAAQP,CAAS,EAAG,MAAOI,EAAa,GAAGD,EAChE,SAAAD,CAAA,CACL,CAER"}
+{"version":3,"file":"AspectRatio.cjs","names":[],"sources":["../../../src/components/AspectRatio/AspectRatio.tsx"],"sourcesContent":["import type { CSSProperties, HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./AspectRatio.module.css\";\n\nexport interface AspectRatioProps extends HTMLAttributes<HTMLDivElement> {\n    /**\n     * Width-to-height ratio. Pass `16/9` for widescreen, `1` for square,\n     * `4/3` for SD video, `3/4` for portrait, etc. Default `16/9`.\n     */\n    ratio?: number;\n    children?: ReactNode;\n}\n\n/**\n * Preserve a constant aspect ratio for media (images, video, embeds). The\n * inner child stretches to fill the box. Uses the native `aspect-ratio`\n * CSS property — works on all modern browsers (Safari 15+, Chrome 88+).\n *\n * @example\n * <AspectRatio ratio={16 / 9}>\n *     <img src=\"/cover.jpg\" alt=\"\" style={{ width: \"100%\", height: \"100%\", objectFit: \"cover\" }} />\n * </AspectRatio>\n */\nexport function AspectRatio({\n    ratio = 16 / 9,\n    className,\n    style,\n    children,\n    ...props\n}: AspectRatioProps) {\n    const finalStyle: CSSProperties = { aspectRatio: String(ratio), ...style };\n    return (\n        <div className={cn(styles.aspect, className)} style={finalStyle} {...props}>\n            {children}\n        </div>\n    );\n}\n"],"mappings":"+GAuBA,SAAgB,EAAY,CACxB,QAAQ,GAAK,EACb,YACA,QACA,WACA,GAAG,GACc,CACjB,IAAM,EAA4B,CAAE,YAAa,OAAO,CAAK,EAAG,GAAG,CAAM,EACzE,OACI,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,GAAG,EAAA,QAAO,OAAQ,CAAS,EAAG,MAAO,EAAY,GAAI,EAChE,UACA,CAAA,CAEb"}

package/dist/components/AspectRatio/AspectRatio.js

@@ -1,17 +1,20 @@
-import { jsx as a } from "react/jsx-runtime";
-import { cn as c } from "../../utils/cn.js";
-import m from "./AspectRatio.module.css.js";
-function l({
-  ratio: t = 16 / 9,
-  className: o,
-  style: r,
-  children: s,
-  ...e
-}) {
-  const i = { aspectRatio: String(t), ...r };
-  return /* @__PURE__ */ a("div", { className: c(m.aspect, o), style: i, ...e, children: s });
+import { cn as e } from "../../utils/cn.js";
+import t from "./AspectRatio.module.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/AspectRatio/AspectRatio.tsx
+function r({ ratio: r = 16 / 9, className: i, style: a, children: o, ...s }) {
+	let c = {
+		aspectRatio: String(r),
+		...a
+	};
+	return /* @__PURE__ */ n("div", {
+		className: e(t.aspect, i),
+		style: c,
+		...s,
+		children: o
+	});
 }
-export {
-  l as AspectRatio
-};
-//# sourceMappingURL=AspectRatio.js.map
+//#endregion
+export { r as AspectRatio };
+
+//# sourceMappingURL=AspectRatio.js.map

package/dist/components/AspectRatio/AspectRatio.js.map

@@ -1 +1 @@
-{"version":3,"file":"AspectRatio.js","sources":["../../../src/components/AspectRatio/AspectRatio.tsx"],"sourcesContent":["import type { CSSProperties, HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./AspectRatio.module.css\";\n\nexport interface AspectRatioProps extends HTMLAttributes<HTMLDivElement> {\n    /**\n     * Width-to-height ratio. Pass `16/9` for widescreen, `1` for square,\n     * `4/3` for SD video, `3/4` for portrait, etc. Default `16/9`.\n     */\n    ratio?: number;\n    children?: ReactNode;\n}\n\n/**\n * Preserve a constant aspect ratio for media (images, video, embeds). The\n * inner child stretches to fill the box. Uses the native `aspect-ratio`\n * CSS property — works on all modern browsers (Safari 15+, Chrome 88+).\n *\n * @example\n * <AspectRatio ratio={16 / 9}>\n *     <img src=\"/cover.jpg\" alt=\"\" style={{ width: \"100%\", height: \"100%\", objectFit: \"cover\" }} />\n * </AspectRatio>\n */\nexport function AspectRatio({\n    ratio = 16 / 9,\n    className,\n    style,\n    children,\n    ...props\n}: AspectRatioProps) {\n    const finalStyle: CSSProperties = { aspectRatio: String(ratio), ...style };\n    return (\n        <div className={cn(styles.aspect, className)} style={finalStyle} {...props}>\n            {children}\n        </div>\n    );\n}\n"],"names":["AspectRatio","ratio","className","style","children","props","finalStyle","jsx","cn","styles"],"mappings":";;;AAuBO,SAASA,EAAY;AAAA,EACxB,OAAAC,IAAQ,KAAK;AAAA,EACb,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACP,GAAqB;AACjB,QAAMC,IAA4B,EAAE,aAAa,OAAOL,CAAK,GAAG,GAAGE,EAAA;AACnE,SACI,gBAAAI,EAAC,OAAA,EAAI,WAAWC,EAAGC,EAAO,QAAQP,CAAS,GAAG,OAAOI,GAAa,GAAGD,GAChE,UAAAD,EAAA,CACL;AAER;"}
+{"version":3,"file":"AspectRatio.js","names":[],"sources":["../../../src/components/AspectRatio/AspectRatio.tsx"],"sourcesContent":["import type { CSSProperties, HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./AspectRatio.module.css\";\n\nexport interface AspectRatioProps extends HTMLAttributes<HTMLDivElement> {\n    /**\n     * Width-to-height ratio. Pass `16/9` for widescreen, `1` for square,\n     * `4/3` for SD video, `3/4` for portrait, etc. Default `16/9`.\n     */\n    ratio?: number;\n    children?: ReactNode;\n}\n\n/**\n * Preserve a constant aspect ratio for media (images, video, embeds). The\n * inner child stretches to fill the box. Uses the native `aspect-ratio`\n * CSS property — works on all modern browsers (Safari 15+, Chrome 88+).\n *\n * @example\n * <AspectRatio ratio={16 / 9}>\n *     <img src=\"/cover.jpg\" alt=\"\" style={{ width: \"100%\", height: \"100%\", objectFit: \"cover\" }} />\n * </AspectRatio>\n */\nexport function AspectRatio({\n    ratio = 16 / 9,\n    className,\n    style,\n    children,\n    ...props\n}: AspectRatioProps) {\n    const finalStyle: CSSProperties = { aspectRatio: String(ratio), ...style };\n    return (\n        <div className={cn(styles.aspect, className)} style={finalStyle} {...props}>\n            {children}\n        </div>\n    );\n}\n"],"mappings":";;;;AAuBA,SAAgB,EAAY,EACxB,WAAQ,KAAK,GACb,cACA,UACA,aACA,GAAG,KACc;CACjB,IAAM,IAA4B;EAAE,aAAa,OAAO,CAAK;EAAG,GAAG;CAAM;CACzE,OACI,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAO,QAAQ,CAAS;EAAG,OAAO;EAAY,GAAI;EAChE;CACA,CAAA;AAEb"}

package/dist/components/AspectRatio/AspectRatio.module.cjs

@@ -0,0 +1,2 @@
+var e=`tempest_aspect_GnAJt`,t={aspect:e};exports.aspect=e,exports.default=t;
+//# sourceMappingURL=AspectRatio.module.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AspectRatio.module.cjs","names":[],"sources":["../../../src/components/AspectRatio/AspectRatio.module.css"],"sourcesContent":[".aspect {\n    width: 100%;\n    position: relative;\n}\n\n.aspect > * {\n    width: 100%;\n    height: 100%;\n}\n"],"mappings":""}

package/dist/components/AspectRatio/AspectRatio.module.js

@@ -0,0 +1,6 @@
+//#region src/components/AspectRatio/AspectRatio.module.css
+var e = "tempest_aspect_GnAJt", t = { aspect: e };
+//#endregion
+export { e as aspect, t as default };
+
+//# sourceMappingURL=AspectRatio.module.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AspectRatio.module.js","names":[],"sources":["../../../src/components/AspectRatio/AspectRatio.module.css"],"sourcesContent":[".aspect {\n    width: 100%;\n    position: relative;\n}\n\n.aspect > * {\n    width: 100%;\n    height: 100%;\n}\n"],"mappings":""}

package/dist/components/Avatar/Avatar.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),u=require("react"),l=require("../../utils/cn.cjs"),t=require("./Avatar.module.css.cjs");function j(a){const e=a.trim().split(/\s+/).filter(Boolean);return e.length===0?"?":e.length===1?e[0].slice(0,2):`${e[0].charAt(0)}${e[e.length-1].charAt(0)}`}function x({src:a,alt:e,name:s="",size:c="md",status:o,className:d,onClick:r}){const[f,g]=u.useState(!1),h=u.useMemo(()=>j(s),[s]),m=a&&!f,p=r?"button":void 0,v=r?0:void 0;return n.jsxs("span",{className:l.cn(t.default.avatar,t.default[c],o&&t.default.status,d),role:p,tabIndex:v,onClick:r,onKeyDown:r?i=>{(i.key==="Enter"||i.key===" ")&&(i.preventDefault(),r())}:void 0,children:[m?n.jsx("img",{src:a,alt:e??s,className:t.default.image,onError:()=>g(!0)}):n.jsx("span",{"aria-label":e??s,children:h}),o&&n.jsx("span",{className:l.cn(t.default.dot,t.default[o]),"aria-hidden":!0})]})}exports.Avatar=x;
-//# sourceMappingURL=Avatar.cjs.map
+const e=require("../../utils/cn.cjs"),t=require("./Avatar.module.cjs");let n=require("react"),r=require("react/jsx-runtime");function i(e){let t=e.trim().split(/\s+/).filter(Boolean);return t.length===0?`?`:t.length===1?t[0].slice(0,2):`${t[0].charAt(0)}${t[t.length-1].charAt(0)}`}function a({src:a,alt:o,name:s=``,size:c=`md`,status:l,className:u,onClick:d}){let[f,p]=(0,n.useState)(!1),m=(0,n.useMemo)(()=>i(s),[s]),h=a&&!f,g=d?`button`:void 0,_=d?0:void 0;return(0,r.jsxs)(`span`,{className:e.cn(t.default.avatar,t.default[c],l&&t.default.status,u),role:g,tabIndex:_,onClick:d,onKeyDown:d?e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),d())}:void 0,children:[h?(0,r.jsx)(`img`,{src:a,alt:o??s,className:t.default.image,onError:()=>p(!0)}):(0,r.jsx)(`span`,{"aria-label":o??s,children:m}),l&&(0,r.jsx)(`span`,{className:e.cn(t.default.dot,t.default[l]),"aria-hidden":!0})]})}exports.Avatar=a;
+//# sourceMappingURL=Avatar.cjs.map

package/dist/components/Avatar/Avatar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.cjs","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Avatar.module.css\";\n\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type AvatarStatus = \"online\" | \"offline\" | \"busy\";\n\nexport interface AvatarProps {\n    src?: string;\n    alt?: string;\n    name?: string;\n    size?: AvatarSize;\n    status?: AvatarStatus;\n    className?: string;\n    onClick?: () => void;\n}\n\nfunction getInitials(name: string): string {\n    const parts = name.trim().split(/\\s+/).filter(Boolean);\n    if (parts.length === 0) return \"?\";\n    if (parts.length === 1) return parts[0]!.slice(0, 2);\n    return `${parts[0]!.charAt(0)}${parts[parts.length - 1]!.charAt(0)}`;\n}\n\n/**\n * Round avatar. Falls back to colored initials when the image fails to load\n * or no `src` is provided. Optional status dot in the bottom-right corner.\n */\nexport function Avatar({\n    src,\n    alt,\n    name = \"\",\n    size = \"md\",\n    status,\n    className,\n    onClick,\n}: AvatarProps) {\n    const [errored, setErrored] = useState<boolean>(false);\n    const initials = useMemo(() => getInitials(name), [name]);\n\n    const showImage = src && !errored;\n    const role = onClick ? \"button\" : undefined;\n    const tabIndex = onClick ? 0 : undefined;\n\n    return (\n        <span\n            className={cn(styles.avatar, styles[size], status && styles.status, className)}\n            role={role}\n            tabIndex={tabIndex}\n            onClick={onClick}\n            onKeyDown={\n                onClick\n                    ? (event) => {\n                          if (event.key === \"Enter\" || event.key === \" \") {\n                              event.preventDefault();\n                              onClick();\n                          }\n                      }\n                    : undefined\n            }\n        >\n            {showImage ? (\n                <img\n                    src={src}\n                    alt={alt ?? name}\n                    className={styles.image}\n                    onError={() => setErrored(true)}\n                />\n            ) : (\n                <span aria-label={alt ?? name}>{initials}</span>\n            )}\n            {status && <span className={cn(styles.dot, styles[status])} aria-hidden />}\n        </span>\n    );\n}\n"],"names":["getInitials","name","parts","Avatar","src","alt","size","status","className","onClick","errored","setErrored","useState","initials","useMemo","showImage","role","tabIndex","jsxs","cn","styles","event","jsx"],"mappings":"6MAiBA,SAASA,EAAYC,EAAsB,CACvC,MAAMC,EAAQD,EAAK,KAAA,EAAO,MAAM,KAAK,EAAE,OAAO,OAAO,EACrD,OAAIC,EAAM,SAAW,EAAU,IAC3BA,EAAM,SAAW,EAAUA,EAAM,CAAC,EAAG,MAAM,EAAG,CAAC,EAC5C,GAAGA,EAAM,CAAC,EAAG,OAAO,CAAC,CAAC,GAAGA,EAAMA,EAAM,OAAS,CAAC,EAAG,OAAO,CAAC,CAAC,EACtE,CAMO,SAASC,EAAO,CACnB,IAAAC,EACA,IAAAC,EACA,KAAAJ,EAAO,GACP,KAAAK,EAAO,KACP,OAAAC,EACA,UAAAC,EACA,QAAAC,CACJ,EAAgB,CACZ,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAkB,EAAK,EAC/CC,EAAWC,EAAAA,QAAQ,IAAMd,EAAYC,CAAI,EAAG,CAACA,CAAI,CAAC,EAElDc,EAAYX,GAAO,CAACM,EACpBM,EAAOP,EAAU,SAAW,OAC5BQ,EAAWR,EAAU,EAAI,OAE/B,OACIS,EAAAA,KAAC,OAAA,CACG,UAAWC,EAAAA,GAAGC,UAAO,OAAQA,EAAAA,QAAOd,CAAI,EAAGC,GAAUa,EAAAA,QAAO,OAAQZ,CAAS,EAC7E,KAAAQ,EACA,SAAAC,EACA,QAAAR,EACA,UACIA,EACOY,GAAU,EACHA,EAAM,MAAQ,SAAWA,EAAM,MAAQ,OACvCA,EAAM,eAAA,EACNZ,EAAA,EAER,EACA,OAGT,SAAA,CAAAM,EACGO,EAAAA,IAAC,MAAA,CACG,IAAAlB,EACA,IAAKC,GAAOJ,EACZ,UAAWmB,EAAAA,QAAO,MAClB,QAAS,IAAMT,EAAW,EAAI,CAAA,CAAA,EAGlCW,EAAAA,IAAC,OAAA,CAAK,aAAYjB,GAAOJ,EAAO,SAAAY,EAAS,EAE5CN,GAAUe,EAAAA,IAAC,OAAA,CAAK,UAAWH,EAAAA,GAAGC,EAAAA,QAAO,IAAKA,EAAAA,QAAOb,CAAM,CAAC,EAAG,cAAW,EAAA,CAAC,CAAA,CAAA,CAAA,CAGpF"}
+{"version":3,"file":"Avatar.cjs","names":[],"sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Avatar.module.css\";\n\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type AvatarStatus = \"online\" | \"offline\" | \"busy\";\n\nexport interface AvatarProps {\n    src?: string;\n    alt?: string;\n    name?: string;\n    size?: AvatarSize;\n    status?: AvatarStatus;\n    className?: string;\n    onClick?: () => void;\n}\n\nfunction getInitials(name: string): string {\n    const parts = name.trim().split(/\\s+/).filter(Boolean);\n    if (parts.length === 0) return \"?\";\n    if (parts.length === 1) return parts[0]!.slice(0, 2);\n    return `${parts[0]!.charAt(0)}${parts[parts.length - 1]!.charAt(0)}`;\n}\n\n/**\n * Round avatar. Falls back to colored initials when the image fails to load\n * or no `src` is provided. Optional status dot in the bottom-right corner.\n */\nexport function Avatar({\n    src,\n    alt,\n    name = \"\",\n    size = \"md\",\n    status,\n    className,\n    onClick,\n}: AvatarProps) {\n    const [errored, setErrored] = useState<boolean>(false);\n    const initials = useMemo(() => getInitials(name), [name]);\n\n    const showImage = src && !errored;\n    const role = onClick ? \"button\" : undefined;\n    const tabIndex = onClick ? 0 : undefined;\n\n    return (\n        <span\n            className={cn(styles.avatar, styles[size], status && styles.status, className)}\n            role={role}\n            tabIndex={tabIndex}\n            onClick={onClick}\n            onKeyDown={\n                onClick\n                    ? (event) => {\n                          if (event.key === \"Enter\" || event.key === \" \") {\n                              event.preventDefault();\n                              onClick();\n                          }\n                      }\n                    : undefined\n            }\n        >\n            {showImage ? (\n                <img\n                    src={src}\n                    alt={alt ?? name}\n                    className={styles.image}\n                    onError={() => setErrored(true)}\n                />\n            ) : (\n                <span aria-label={alt ?? name}>{initials}</span>\n            )}\n            {status && <span className={cn(styles.dot, styles[status])} aria-hidden />}\n        </span>\n    );\n}\n"],"mappings":"6HAiBA,SAAS,EAAY,EAAsB,CACvC,IAAM,EAAQ,EAAK,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,OAAO,OAAO,EAGrD,OAFI,EAAM,SAAW,EAAU,IAC3B,EAAM,SAAW,EAAU,EAAM,EAAE,CAAE,MAAM,EAAG,CAAC,EAC5C,GAAG,EAAM,EAAE,CAAE,OAAO,CAAC,IAAI,EAAM,EAAM,OAAS,EAAE,CAAE,OAAO,CAAC,GACrE,CAMA,SAAgB,EAAO,CACnB,MACA,MACA,OAAO,GACP,OAAO,KACP,SACA,YACA,WACY,CACZ,GAAM,CAAC,EAAS,IAAA,EAAA,EAAA,SAAA,CAAgC,EAAK,EAC/C,GAAA,EAAA,EAAA,QAAA,KAAyB,EAAY,CAAI,EAAG,CAAC,CAAI,CAAC,EAElD,EAAY,GAAO,CAAC,EACpB,EAAO,EAAU,SAAW,IAAA,GAC5B,EAAW,EAAU,EAAI,IAAA,GAE/B,OACI,EAAA,EAAA,KAAA,CAAC,OAAD,CACI,UAAW,EAAA,GAAG,EAAA,QAAO,OAAQ,EAAA,QAAO,GAAO,GAAU,EAAA,QAAO,OAAQ,CAAS,EACvE,OACI,WACD,UACT,UACI,EACO,GAAU,EACH,EAAM,MAAQ,SAAW,EAAM,MAAQ,OACvC,EAAM,eAAe,EACrB,EAAQ,EAEhB,EACA,IAAA,YAbd,CAgBK,GACG,EAAA,EAAA,IAAA,CAAC,MAAD,CACS,MACL,IAAK,GAAO,EACZ,UAAW,EAAA,QAAO,MAClB,YAAe,EAAW,EAAI,CACjC,CAAA,GAED,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,aAAY,GAAO,WAAO,CAAe,CAAA,EAElD,IAAU,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,GAAG,EAAA,QAAO,IAAK,EAAA,QAAO,EAAO,EAAG,cAAA,EAAa,CAAA,CACvE,GAEd"}

package/dist/components/Avatar/Avatar.js

@@ -1,47 +1,37 @@
-import { jsxs as v, jsx as i } from "react/jsx-runtime";
-import { useState as x, useMemo as y } from "react";
-import { cn as l } from "../../utils/cn.js";
-import t from "./Avatar.module.css.js";
-function b(o) {
-  const r = o.trim().split(/\s+/).filter(Boolean);
-  return r.length === 0 ? "?" : r.length === 1 ? r[0].slice(0, 2) : `${r[0].charAt(0)}${r[r.length - 1].charAt(0)}`;
+import { cn as e } from "../../utils/cn.js";
+import t from "./Avatar.module.js";
+import { useMemo as n, useState as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/components/Avatar/Avatar.tsx
+function o(e) {
+	let t = e.trim().split(/\s+/).filter(Boolean);
+	return t.length === 0 ? "?" : t.length === 1 ? t[0].slice(0, 2) : `${t[0].charAt(0)}${t[t.length - 1].charAt(0)}`;
 }
-function j({
-  src: o,
-  alt: r,
-  name: s = "",
-  size: m = "md",
-  status: a,
-  className: c,
-  onClick: e
-}) {
-  const [d, f] = x(!1), p = y(() => b(s), [s]), u = o && !d, h = e ? "button" : void 0, g = e ? 0 : void 0;
-  return /* @__PURE__ */ v(
-    "span",
-    {
-      className: l(t.avatar, t[m], a && t.status, c),
-      role: h,
-      tabIndex: g,
-      onClick: e,
-      onKeyDown: e ? (n) => {
-        (n.key === "Enter" || n.key === " ") && (n.preventDefault(), e());
-      } : void 0,
-      children: [
-        u ? /* @__PURE__ */ i(
-          "img",
-          {
-            src: o,
-            alt: r ?? s,
-            className: t.image,
-            onError: () => f(!0)
-          }
-        ) : /* @__PURE__ */ i("span", { "aria-label": r ?? s, children: p }),
-        a && /* @__PURE__ */ i("span", { className: l(t.dot, t[a]), "aria-hidden": !0 })
-      ]
-    }
-  );
+function s({ src: s, alt: c, name: l = "", size: u = "md", status: d, className: f, onClick: p }) {
+	let [m, h] = r(!1), g = n(() => o(l), [l]), _ = s && !m, v = p ? "button" : void 0, y = p ? 0 : void 0;
+	return /* @__PURE__ */ a("span", {
+		className: e(t.avatar, t[u], d && t.status, f),
+		role: v,
+		tabIndex: y,
+		onClick: p,
+		onKeyDown: p ? (e) => {
+			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), p());
+		} : void 0,
+		children: [_ ? /* @__PURE__ */ i("img", {
+			src: s,
+			alt: c ?? l,
+			className: t.image,
+			onError: () => h(!0)
+		}) : /* @__PURE__ */ i("span", {
+			"aria-label": c ?? l,
+			children: g
+		}), d && /* @__PURE__ */ i("span", {
+			className: e(t.dot, t[d]),
+			"aria-hidden": !0
+		})]
+	});
 }
-export {
-  j as Avatar
-};
-//# sourceMappingURL=Avatar.js.map
+//#endregion
+export { s as Avatar };
+
+//# sourceMappingURL=Avatar.js.map

package/dist/components/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Avatar.module.css\";\n\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type AvatarStatus = \"online\" | \"offline\" | \"busy\";\n\nexport interface AvatarProps {\n    src?: string;\n    alt?: string;\n    name?: string;\n    size?: AvatarSize;\n    status?: AvatarStatus;\n    className?: string;\n    onClick?: () => void;\n}\n\nfunction getInitials(name: string): string {\n    const parts = name.trim().split(/\\s+/).filter(Boolean);\n    if (parts.length === 0) return \"?\";\n    if (parts.length === 1) return parts[0]!.slice(0, 2);\n    return `${parts[0]!.charAt(0)}${parts[parts.length - 1]!.charAt(0)}`;\n}\n\n/**\n * Round avatar. Falls back to colored initials when the image fails to load\n * or no `src` is provided. Optional status dot in the bottom-right corner.\n */\nexport function Avatar({\n    src,\n    alt,\n    name = \"\",\n    size = \"md\",\n    status,\n    className,\n    onClick,\n}: AvatarProps) {\n    const [errored, setErrored] = useState<boolean>(false);\n    const initials = useMemo(() => getInitials(name), [name]);\n\n    const showImage = src && !errored;\n    const role = onClick ? \"button\" : undefined;\n    const tabIndex = onClick ? 0 : undefined;\n\n    return (\n        <span\n            className={cn(styles.avatar, styles[size], status && styles.status, className)}\n            role={role}\n            tabIndex={tabIndex}\n            onClick={onClick}\n            onKeyDown={\n                onClick\n                    ? (event) => {\n                          if (event.key === \"Enter\" || event.key === \" \") {\n                              event.preventDefault();\n                              onClick();\n                          }\n                      }\n                    : undefined\n            }\n        >\n            {showImage ? (\n                <img\n                    src={src}\n                    alt={alt ?? name}\n                    className={styles.image}\n                    onError={() => setErrored(true)}\n                />\n            ) : (\n                <span aria-label={alt ?? name}>{initials}</span>\n            )}\n            {status && <span className={cn(styles.dot, styles[status])} aria-hidden />}\n        </span>\n    );\n}\n"],"names":["getInitials","name","parts","Avatar","src","alt","size","status","className","onClick","errored","setErrored","useState","initials","useMemo","showImage","role","tabIndex","jsxs","cn","styles","event","jsx"],"mappings":";;;;AAiBA,SAASA,EAAYC,GAAsB;AACvC,QAAMC,IAAQD,EAAK,KAAA,EAAO,MAAM,KAAK,EAAE,OAAO,OAAO;AACrD,SAAIC,EAAM,WAAW,IAAU,MAC3BA,EAAM,WAAW,IAAUA,EAAM,CAAC,EAAG,MAAM,GAAG,CAAC,IAC5C,GAAGA,EAAM,CAAC,EAAG,OAAO,CAAC,CAAC,GAAGA,EAAMA,EAAM,SAAS,CAAC,EAAG,OAAO,CAAC,CAAC;AACtE;AAMO,SAASC,EAAO;AAAA,EACnB,KAAAC;AAAA,EACA,KAAAC;AAAA,EACA,MAAAJ,IAAO;AAAA,EACP,MAAAK,IAAO;AAAA,EACP,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AACJ,GAAgB;AACZ,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAkB,EAAK,GAC/CC,IAAWC,EAAQ,MAAMd,EAAYC,CAAI,GAAG,CAACA,CAAI,CAAC,GAElDc,IAAYX,KAAO,CAACM,GACpBM,IAAOP,IAAU,WAAW,QAC5BQ,IAAWR,IAAU,IAAI;AAE/B,SACI,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAAGC,EAAO,QAAQA,EAAOd,CAAI,GAAGC,KAAUa,EAAO,QAAQZ,CAAS;AAAA,MAC7E,MAAAQ;AAAA,MACA,UAAAC;AAAA,MACA,SAAAR;AAAA,MACA,WACIA,IACM,CAACY,MAAU;AACP,SAAIA,EAAM,QAAQ,WAAWA,EAAM,QAAQ,SACvCA,EAAM,eAAA,GACNZ,EAAA;AAAA,MAER,IACA;AAAA,MAGT,UAAA;AAAA,QAAAM,IACG,gBAAAO;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,KAAAlB;AAAA,YACA,KAAKC,KAAOJ;AAAA,YACZ,WAAWmB,EAAO;AAAA,YAClB,SAAS,MAAMT,EAAW,EAAI;AAAA,UAAA;AAAA,QAAA,IAGlC,gBAAAW,EAAC,QAAA,EAAK,cAAYjB,KAAOJ,GAAO,UAAAY,GAAS;AAAA,QAE5CN,KAAU,gBAAAe,EAAC,QAAA,EAAK,WAAWH,EAAGC,EAAO,KAAKA,EAAOb,CAAM,CAAC,GAAG,eAAW,GAAA,CAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpF;"}
+{"version":3,"file":"Avatar.js","names":[],"sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Avatar.module.css\";\n\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type AvatarStatus = \"online\" | \"offline\" | \"busy\";\n\nexport interface AvatarProps {\n    src?: string;\n    alt?: string;\n    name?: string;\n    size?: AvatarSize;\n    status?: AvatarStatus;\n    className?: string;\n    onClick?: () => void;\n}\n\nfunction getInitials(name: string): string {\n    const parts = name.trim().split(/\\s+/).filter(Boolean);\n    if (parts.length === 0) return \"?\";\n    if (parts.length === 1) return parts[0]!.slice(0, 2);\n    return `${parts[0]!.charAt(0)}${parts[parts.length - 1]!.charAt(0)}`;\n}\n\n/**\n * Round avatar. Falls back to colored initials when the image fails to load\n * or no `src` is provided. Optional status dot in the bottom-right corner.\n */\nexport function Avatar({\n    src,\n    alt,\n    name = \"\",\n    size = \"md\",\n    status,\n    className,\n    onClick,\n}: AvatarProps) {\n    const [errored, setErrored] = useState<boolean>(false);\n    const initials = useMemo(() => getInitials(name), [name]);\n\n    const showImage = src && !errored;\n    const role = onClick ? \"button\" : undefined;\n    const tabIndex = onClick ? 0 : undefined;\n\n    return (\n        <span\n            className={cn(styles.avatar, styles[size], status && styles.status, className)}\n            role={role}\n            tabIndex={tabIndex}\n            onClick={onClick}\n            onKeyDown={\n                onClick\n                    ? (event) => {\n                          if (event.key === \"Enter\" || event.key === \" \") {\n                              event.preventDefault();\n                              onClick();\n                          }\n                      }\n                    : undefined\n            }\n        >\n            {showImage ? (\n                <img\n                    src={src}\n                    alt={alt ?? name}\n                    className={styles.image}\n                    onError={() => setErrored(true)}\n                />\n            ) : (\n                <span aria-label={alt ?? name}>{initials}</span>\n            )}\n            {status && <span className={cn(styles.dot, styles[status])} aria-hidden />}\n        </span>\n    );\n}\n"],"mappings":";;;;;AAiBA,SAAS,EAAY,GAAsB;CACvC,IAAM,IAAQ,EAAK,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,OAAO,OAAO;CAGrD,OAFI,EAAM,WAAW,IAAU,MAC3B,EAAM,WAAW,IAAU,EAAM,EAAE,CAAE,MAAM,GAAG,CAAC,IAC5C,GAAG,EAAM,EAAE,CAAE,OAAO,CAAC,IAAI,EAAM,EAAM,SAAS,EAAE,CAAE,OAAO,CAAC;AACrE;AAMA,SAAgB,EAAO,EACnB,QACA,QACA,UAAO,IACP,UAAO,MACP,WACA,cACA,cACY;CACZ,IAAM,CAAC,GAAS,KAAc,EAAkB,EAAK,GAC/C,IAAW,QAAc,EAAY,CAAI,GAAG,CAAC,CAAI,CAAC,GAElD,IAAY,KAAO,CAAC,GACpB,IAAO,IAAU,WAAW,KAAA,GAC5B,IAAW,IAAU,IAAI,KAAA;CAE/B,OACI,kBAAC,QAAD;EACI,WAAW,EAAG,EAAO,QAAQ,EAAO,IAAO,KAAU,EAAO,QAAQ,CAAS;EACvE;EACI;EACD;EACT,WACI,KACO,MAAU;GACP,CAAI,EAAM,QAAQ,WAAW,EAAM,QAAQ,SACvC,EAAM,eAAe,GACrB,EAAQ;EAEhB,IACA,KAAA;YAbd,CAgBK,IACG,kBAAC,OAAD;GACS;GACL,KAAK,KAAO;GACZ,WAAW,EAAO;GAClB,eAAe,EAAW,EAAI;EACjC,CAAA,IAED,kBAAC,QAAD;GAAM,cAAY,KAAO;aAAO;EAAe,CAAA,GAElD,KAAU,kBAAC,QAAD;GAAM,WAAW,EAAG,EAAO,KAAK,EAAO,EAAO;GAAG,eAAA;EAAa,CAAA,CACvE;;AAEd"}

package/dist/components/Avatar/Avatar.module.cjs

@@ -0,0 +1,2 @@
+var e=`tempest_avatar_3xMuZ`,t=`tempest_image_ieqGp`,n=`tempest_xs_oSaLL`,r=`tempest_sm_sZ2bk`,i=`tempest_md_Fdkbz`,a=`tempest_lg_pTTUA`,o=`tempest_xl_mW58F`,s=`tempest_status_ISBnL`,c=`tempest_dot_Wgfo-`,l=`tempest_online_-aWoW`,u=`tempest_offline_-StX3`,d=`tempest_busy_TbwuF`,f={avatar:e,image:t,xs:n,sm:r,md:i,lg:a,xl:o,status:s,dot:c,online:l,offline:u,busy:d};exports.avatar=e,exports.busy=d,exports.default=f,exports.dot=c,exports.image=t,exports.lg=a,exports.md=i,exports.offline=u,exports.online=l,exports.sm=r,exports.status=s,exports.xl=o,exports.xs=n;
+//# sourceMappingURL=Avatar.module.cjs.map