tempest-react-sdk 0.23.0 → 0.25.0

package/dist/components/Resizable/Resizable.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Resizable.cjs","sources":["../../../src/components/Resizable/Resizable.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from \"react\";\nimport type { HTMLAttributes, KeyboardEvent, PointerEvent, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Resizable.module.css\";\n\nexport type ResizableDirection = \"horizontal\" | \"vertical\";\n\nexport interface ResizableProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n    /** Split orientation. `horizontal` (default) places panes side by side. */\n    direction?: ResizableDirection;\n    /** Initial size of the first pane, as a percentage. Defaults to `50`. */\n    defaultSize?: number;\n    /** Lower clamp for the first pane size, in percent. Defaults to `10`. */\n    min?: number;\n    /** Upper clamp for the first pane size, in percent. Defaults to `90`. */\n    max?: number;\n    /** Exactly two panes — `[paneA, paneB]`. */\n    children: [ReactNode, ReactNode];\n}\n\nconst KEY_STEP = 2;\n\n/**\n * Clamp a number into the inclusive `[min, max]` range.\n *\n * @param value - The value to clamp.\n * @param min - Lower bound.\n * @param max - Upper bound.\n * @returns The clamped value.\n */\nfunction clamp(value: number, min: number, max: number): number {\n    return Math.min(max, Math.max(min, value));\n}\n\n/**\n * A two-pane split layout with a draggable divider. The first pane is sized via\n * `flex-basis` as a percentage; the second pane fills the rest. Drag the divider\n * with a pointer, or focus it and use the arrow keys to adjust by 2% steps.\n *\n * The size is clamped to `[min, max]` at all times.\n */\nexport function Resizable({\n    direction = \"horizontal\",\n    defaultSize = 50,\n    min = 10,\n    max = 90,\n    children,\n    className,\n    ...props\n}: ResizableProps) {\n    const [size, setSize] = useState<number>(() => clamp(defaultSize, min, max));\n    const containerRef = useRef<HTMLDivElement | null>(null);\n    const [paneA, paneB] = children;\n    const isHorizontal = direction === \"horizontal\";\n\n    const updateFromPointer = useCallback(\n        (clientX: number, clientY: number): void => {\n            const container = containerRef.current;\n            if (!container) return;\n            const rect = container.getBoundingClientRect();\n            const total = isHorizontal ? rect.width : rect.height;\n            if (total <= 0) return;\n            const offset = isHorizontal ? clientX - rect.left : clientY - rect.top;\n            const percent = (offset / total) * 100;\n            setSize(clamp(percent, min, max));\n        },\n        [isHorizontal, min, max],\n    );\n\n    const handlePointerDown = useCallback(\n        (event: PointerEvent<HTMLDivElement>): void => {\n            event.preventDefault();\n            const divider = event.currentTarget;\n            divider.setPointerCapture(event.pointerId);\n\n            const handleMove = (moveEvent: globalThis.PointerEvent): void => {\n                updateFromPointer(moveEvent.clientX, moveEvent.clientY);\n            };\n            const handleUp = (): void => {\n                window.removeEventListener(\"pointermove\", handleMove);\n                window.removeEventListener(\"pointerup\", handleUp);\n            };\n\n            window.addEventListener(\"pointermove\", handleMove);\n            window.addEventListener(\"pointerup\", handleUp);\n        },\n        [updateFromPointer],\n    );\n\n    const handleKeyDown = useCallback(\n        (event: KeyboardEvent<HTMLDivElement>): void => {\n            let delta = 0;\n            if (isHorizontal) {\n                if (event.key === \"ArrowRight\") delta = KEY_STEP;\n                else if (event.key === \"ArrowLeft\") delta = -KEY_STEP;\n            } else {\n                if (event.key === \"ArrowDown\") delta = KEY_STEP;\n                else if (event.key === \"ArrowUp\") delta = -KEY_STEP;\n            }\n            if (event.key === \"Home\") {\n                event.preventDefault();\n                setSize(min);\n                return;\n            }\n            if (event.key === \"End\") {\n                event.preventDefault();\n                setSize(max);\n                return;\n            }\n            if (delta === 0) return;\n            event.preventDefault();\n            setSize((current) => clamp(current + delta, min, max));\n        },\n        [isHorizontal, min, max],\n    );\n\n    return (\n        <div\n            ref={containerRef}\n            className={cn(\n                styles.root,\n                isHorizontal ? styles.horizontal : styles.vertical,\n                className,\n            )}\n            {...props}\n        >\n            <div className={styles.pane} style={{ flexBasis: `${size}%` }}>\n                {paneA}\n            </div>\n            <div\n                role=\"separator\"\n                aria-orientation={isHorizontal ? \"vertical\" : \"horizontal\"}\n                aria-valuenow={Math.round(size)}\n                aria-valuemin={min}\n                aria-valuemax={max}\n                tabIndex={0}\n                className={styles.divider}\n                onPointerDown={handlePointerDown}\n                onKeyDown={handleKeyDown}\n            >\n                <span className={styles.handle} aria-hidden=\"true\" />\n            </div>\n            <div className={styles.pane} style={{ flexBasis: `${100 - size}%` }}>\n                {paneB}\n            </div>\n        </div>\n    );\n}\n"],"names":["KEY_STEP","clamp","value","min","max","Resizable","direction","defaultSize","children","className","props","size","setSize","useState","containerRef","useRef","paneA","paneB","isHorizontal","updateFromPointer","useCallback","clientX","clientY","container","rect","total","percent","handlePointerDown","event","handleMove","moveEvent","handleUp","handleKeyDown","delta","current","jsxs","cn","styles","jsx"],"mappings":"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"}
+{"version":3,"file":"Resizable.cjs","names":[],"sources":["../../../src/components/Resizable/Resizable.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from \"react\";\nimport type { HTMLAttributes, KeyboardEvent, PointerEvent, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Resizable.module.css\";\n\nexport type ResizableDirection = \"horizontal\" | \"vertical\";\n\nexport interface ResizableProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n    /** Split orientation. `horizontal` (default) places panes side by side. */\n    direction?: ResizableDirection;\n    /** Initial size of the first pane, as a percentage. Defaults to `50`. */\n    defaultSize?: number;\n    /** Lower clamp for the first pane size, in percent. Defaults to `10`. */\n    min?: number;\n    /** Upper clamp for the first pane size, in percent. Defaults to `90`. */\n    max?: number;\n    /** Exactly two panes — `[paneA, paneB]`. */\n    children: [ReactNode, ReactNode];\n}\n\nconst KEY_STEP = 2;\n\n/**\n * Clamp a number into the inclusive `[min, max]` range.\n *\n * @param value - The value to clamp.\n * @param min - Lower bound.\n * @param max - Upper bound.\n * @returns The clamped value.\n */\nfunction clamp(value: number, min: number, max: number): number {\n    return Math.min(max, Math.max(min, value));\n}\n\n/**\n * A two-pane split layout with a draggable divider. The first pane is sized via\n * `flex-basis` as a percentage; the second pane fills the rest. Drag the divider\n * with a pointer, or focus it and use the arrow keys to adjust by 2% steps.\n *\n * The size is clamped to `[min, max]` at all times.\n */\nexport function Resizable({\n    direction = \"horizontal\",\n    defaultSize = 50,\n    min = 10,\n    max = 90,\n    children,\n    className,\n    ...props\n}: ResizableProps) {\n    const [size, setSize] = useState<number>(() => clamp(defaultSize, min, max));\n    const containerRef = useRef<HTMLDivElement | null>(null);\n    const [paneA, paneB] = children;\n    const isHorizontal = direction === \"horizontal\";\n\n    const updateFromPointer = useCallback(\n        (clientX: number, clientY: number): void => {\n            const container = containerRef.current;\n            if (!container) return;\n            const rect = container.getBoundingClientRect();\n            const total = isHorizontal ? rect.width : rect.height;\n            if (total <= 0) return;\n            const offset = isHorizontal ? clientX - rect.left : clientY - rect.top;\n            const percent = (offset / total) * 100;\n            setSize(clamp(percent, min, max));\n        },\n        [isHorizontal, min, max],\n    );\n\n    const handlePointerDown = useCallback(\n        (event: PointerEvent<HTMLDivElement>): void => {\n            event.preventDefault();\n            const divider = event.currentTarget;\n            divider.setPointerCapture(event.pointerId);\n\n            const handleMove = (moveEvent: globalThis.PointerEvent): void => {\n                updateFromPointer(moveEvent.clientX, moveEvent.clientY);\n            };\n            const handleUp = (): void => {\n                window.removeEventListener(\"pointermove\", handleMove);\n                window.removeEventListener(\"pointerup\", handleUp);\n            };\n\n            window.addEventListener(\"pointermove\", handleMove);\n            window.addEventListener(\"pointerup\", handleUp);\n        },\n        [updateFromPointer],\n    );\n\n    const handleKeyDown = useCallback(\n        (event: KeyboardEvent<HTMLDivElement>): void => {\n            let delta = 0;\n            if (isHorizontal) {\n                if (event.key === \"ArrowRight\") delta = KEY_STEP;\n                else if (event.key === \"ArrowLeft\") delta = -KEY_STEP;\n            } else {\n                if (event.key === \"ArrowDown\") delta = KEY_STEP;\n                else if (event.key === \"ArrowUp\") delta = -KEY_STEP;\n            }\n            if (event.key === \"Home\") {\n                event.preventDefault();\n                setSize(min);\n                return;\n            }\n            if (event.key === \"End\") {\n                event.preventDefault();\n                setSize(max);\n                return;\n            }\n            if (delta === 0) return;\n            event.preventDefault();\n            setSize((current) => clamp(current + delta, min, max));\n        },\n        [isHorizontal, min, max],\n    );\n\n    return (\n        <div\n            ref={containerRef}\n            className={cn(\n                styles.root,\n                isHorizontal ? styles.horizontal : styles.vertical,\n                className,\n            )}\n            {...props}\n        >\n            <div className={styles.pane} style={{ flexBasis: `${size}%` }}>\n                {paneA}\n            </div>\n            <div\n                role=\"separator\"\n                aria-orientation={isHorizontal ? \"vertical\" : \"horizontal\"}\n                aria-valuenow={Math.round(size)}\n                aria-valuemin={min}\n                aria-valuemax={max}\n                tabIndex={0}\n                className={styles.divider}\n                onPointerDown={handlePointerDown}\n                onKeyDown={handleKeyDown}\n            >\n                <span className={styles.handle} aria-hidden=\"true\" />\n            </div>\n            <div className={styles.pane} style={{ flexBasis: `${100 - size}%` }}>\n                {paneB}\n            </div>\n        </div>\n    );\n}\n"],"mappings":"gIAoBA,IAAM,EAAW,EAUjB,SAAS,EAAM,EAAe,EAAa,EAAqB,CAC5D,OAAO,KAAK,IAAI,EAAK,KAAK,IAAI,EAAK,CAAK,CAAC,CAC7C,CASA,SAAgB,EAAU,CACtB,YAAY,aACZ,cAAc,GACd,MAAM,GACN,MAAM,GACN,WACA,YACA,GAAG,GACY,CACf,GAAM,CAAC,EAAM,IAAA,EAAA,EAAA,SAAA,KAAkC,EAAM,EAAa,EAAK,CAAG,CAAC,EACrE,GAAA,EAAA,EAAA,OAAA,CAA6C,IAAI,EACjD,CAAC,EAAO,GAAS,EACjB,EAAe,IAAc,aAE7B,GAAA,EAAA,EAAA,YAAA,EACD,EAAiB,IAA0B,CACxC,IAAM,EAAY,EAAa,QAC/B,GAAI,CAAC,EAAW,OAChB,IAAM,EAAO,EAAU,sBAAsB,EACvC,EAAQ,EAAe,EAAK,MAAQ,EAAK,OAC/C,GAAI,GAAS,EAAG,OAEhB,IAAM,GADS,EAAe,EAAU,EAAK,KAAO,EAAU,EAAK,KACzC,EAAS,IACnC,EAAQ,EAAM,EAAS,EAAK,CAAG,CAAC,CACpC,EACA,CAAC,EAAc,EAAK,CAAG,CAC3B,EAEM,GAAA,EAAA,EAAA,YAAA,CACD,GAA8C,CAC3C,EAAM,eAAe,EAErB,EADsB,cACd,kBAAkB,EAAM,SAAS,EAEzC,IAAM,EAAc,GAA6C,CAC7D,EAAkB,EAAU,QAAS,EAAU,OAAO,CAC1D,EACM,MAAuB,CACzB,OAAO,oBAAoB,cAAe,CAAU,EACpD,OAAO,oBAAoB,YAAa,CAAQ,CACpD,EAEA,OAAO,iBAAiB,cAAe,CAAU,EACjD,OAAO,iBAAiB,YAAa,CAAQ,CACjD,EACA,CAAC,CAAiB,CACtB,EAEM,GAAA,EAAA,EAAA,YAAA,CACD,GAA+C,CAC5C,IAAI,EAAQ,EAQZ,GAPI,EACI,EAAM,MAAQ,aAAc,EAAQ,EAC/B,EAAM,MAAQ,cAAa,EAAQ,IAExC,EAAM,MAAQ,YAAa,EAAQ,EAC9B,EAAM,MAAQ,YAAW,EAAQ,IAE1C,EAAM,MAAQ,OAAQ,CACtB,EAAM,eAAe,EACrB,EAAQ,CAAG,EACX,MACJ,CACA,GAAI,EAAM,MAAQ,MAAO,CACrB,EAAM,eAAe,EACrB,EAAQ,CAAG,EACX,MACJ,CACI,IAAU,IACd,EAAM,eAAe,EACrB,EAAS,GAAY,EAAM,EAAU,EAAO,EAAK,CAAG,CAAC,EACzD,EACA,CAAC,EAAc,EAAK,CAAG,CAC3B,EAEA,OACI,EAAA,EAAA,KAAA,CAAC,MAAD,CACI,IAAK,EACL,UAAW,EAAA,GACP,EAAA,QAAO,KACP,EAAe,EAAA,QAAO,WAAa,EAAA,QAAO,SAC1C,CACJ,EACA,GAAI,WAPR,EASI,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,KAAM,MAAO,CAAE,UAAW,GAAG,EAAK,EAAG,WACvD,CACA,CAAA,GACL,EAAA,EAAA,IAAA,CAAC,MAAD,CACI,KAAK,YACL,mBAAkB,EAAe,WAAa,aAC9C,gBAAe,KAAK,MAAM,CAAI,EAC9B,gBAAe,EACf,gBAAe,EACf,SAAU,EACV,UAAW,EAAA,QAAO,QAClB,cAAe,EACf,UAAW,YAEX,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,OAAQ,cAAY,MAAQ,CAAA,CACnD,CAAA,GACL,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,KAAM,MAAO,CAAE,UAAW,GAAG,IAAM,EAAK,EAAG,WAC7D,CACA,CAAA,CACJ,GAEb"}

package/dist/components/Resizable/Resizable.js

@@ -1,89 +1,82 @@
-import { jsxs as P, jsx as d } from "react/jsx-runtime";
-import { useState as R, useRef as B, useCallback as w } from "react";
-import { cn as M } from "../../utils/cn.js";
-import s from "./Resizable.module.css.js";
-const f = 2;
-function v(p, u, t) {
-  return Math.min(t, Math.max(u, p));
+import { cn as e } from "../../utils/cn.js";
+import t from "./Resizable.module.js";
+import { useCallback as n, useRef as r, useState as i } from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/components/Resizable/Resizable.tsx
+var s = 2;
+function c(e, t, n) {
+	return Math.min(n, Math.max(t, e));
 }
-function x({
-  direction: p = "horizontal",
-  defaultSize: u = 50,
-  min: t = 10,
-  max: n = 90,
-  children: D,
-  className: z,
-  ...k
-}) {
-  const [h, c] = R(() => v(u, t, n)), m = B(null), [E, g] = D, o = p === "horizontal", y = w(
-    (e, r) => {
-      const i = m.current;
-      if (!i) return;
-      const a = i.getBoundingClientRect(), l = o ? a.width : a.height;
-      if (l <= 0) return;
-      const N = (o ? e - a.left : r - a.top) / l * 100;
-      c(v(N, t, n));
-    },
-    [o, t, n]
-  ), A = w(
-    (e) => {
-      e.preventDefault(), e.currentTarget.setPointerCapture(e.pointerId);
-      const i = (l) => {
-        y(l.clientX, l.clientY);
-      }, a = () => {
-        window.removeEventListener("pointermove", i), window.removeEventListener("pointerup", a);
-      };
-      window.addEventListener("pointermove", i), window.addEventListener("pointerup", a);
-    },
-    [y]
-  ), L = w(
-    (e) => {
-      let r = 0;
-      if (o ? e.key === "ArrowRight" ? r = f : e.key === "ArrowLeft" && (r = -f) : e.key === "ArrowDown" ? r = f : e.key === "ArrowUp" && (r = -f), e.key === "Home") {
-        e.preventDefault(), c(t);
-        return;
-      }
-      if (e.key === "End") {
-        e.preventDefault(), c(n);
-        return;
-      }
-      r !== 0 && (e.preventDefault(), c((i) => v(i + r, t, n)));
-    },
-    [o, t, n]
-  );
-  return /* @__PURE__ */ P(
-    "div",
-    {
-      ref: m,
-      className: M(
-        s.root,
-        o ? s.horizontal : s.vertical,
-        z
-      ),
-      ...k,
-      children: [
-        /* @__PURE__ */ d("div", { className: s.pane, style: { flexBasis: `${h}%` }, children: E }),
-        /* @__PURE__ */ d(
-          "div",
-          {
-            role: "separator",
-            "aria-orientation": o ? "vertical" : "horizontal",
-            "aria-valuenow": Math.round(h),
-            "aria-valuemin": t,
-            "aria-valuemax": n,
-            tabIndex: 0,
-            className: s.divider,
-            onPointerDown: A,
-            onKeyDown: L,
-            children: /* @__PURE__ */ d("span", { className: s.handle, "aria-hidden": "true" })
-          }
-        ),
-        /* @__PURE__ */ d("div", { className: s.pane, style: { flexBasis: `${100 - h}%` }, children: g })
-      ]
-    }
-  );
+function l({ direction: l = "horizontal", defaultSize: u = 50, min: d = 10, max: f = 90, children: p, className: m, ...h }) {
+	let [g, _] = i(() => c(u, d, f)), v = r(null), [y, b] = p, x = l === "horizontal", S = n((e, t) => {
+		let n = v.current;
+		if (!n) return;
+		let r = n.getBoundingClientRect(), i = x ? r.width : r.height;
+		if (i <= 0) return;
+		let a = (x ? e - r.left : t - r.top) / i * 100;
+		_(c(a, d, f));
+	}, [
+		x,
+		d,
+		f
+	]), C = n((e) => {
+		e.preventDefault(), e.currentTarget.setPointerCapture(e.pointerId);
+		let t = (e) => {
+			S(e.clientX, e.clientY);
+		}, n = () => {
+			window.removeEventListener("pointermove", t), window.removeEventListener("pointerup", n);
+		};
+		window.addEventListener("pointermove", t), window.addEventListener("pointerup", n);
+	}, [S]), w = n((e) => {
+		let t = 0;
+		if (x ? e.key === "ArrowRight" ? t = s : e.key === "ArrowLeft" && (t = -2) : e.key === "ArrowDown" ? t = s : e.key === "ArrowUp" && (t = -2), e.key === "Home") {
+			e.preventDefault(), _(d);
+			return;
+		}
+		if (e.key === "End") {
+			e.preventDefault(), _(f);
+			return;
+		}
+		t !== 0 && (e.preventDefault(), _((e) => c(e + t, d, f)));
+	}, [
+		x,
+		d,
+		f
+	]);
+	return /* @__PURE__ */ o("div", {
+		ref: v,
+		className: e(t.root, x ? t.horizontal : t.vertical, m),
+		...h,
+		children: [
+			/* @__PURE__ */ a("div", {
+				className: t.pane,
+				style: { flexBasis: `${g}%` },
+				children: y
+			}),
+			/* @__PURE__ */ a("div", {
+				role: "separator",
+				"aria-orientation": x ? "vertical" : "horizontal",
+				"aria-valuenow": Math.round(g),
+				"aria-valuemin": d,
+				"aria-valuemax": f,
+				tabIndex: 0,
+				className: t.divider,
+				onPointerDown: C,
+				onKeyDown: w,
+				children: /* @__PURE__ */ a("span", {
+					className: t.handle,
+					"aria-hidden": "true"
+				})
+			}),
+			/* @__PURE__ */ a("div", {
+				className: t.pane,
+				style: { flexBasis: `${100 - g}%` },
+				children: b
+			})
+		]
+	});
 }
-export {
-  x as Resizable
-};
-//# sourceMappingURL=Resizable.js.map
+//#endregion
+export { l as Resizable };
+
+//# sourceMappingURL=Resizable.js.map

package/dist/components/Resizable/Resizable.js.map

@@ -1 +1 @@
-{"version":3,"file":"Resizable.js","sources":["../../../src/components/Resizable/Resizable.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from \"react\";\nimport type { HTMLAttributes, KeyboardEvent, PointerEvent, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Resizable.module.css\";\n\nexport type ResizableDirection = \"horizontal\" | \"vertical\";\n\nexport interface ResizableProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n    /** Split orientation. `horizontal` (default) places panes side by side. */\n    direction?: ResizableDirection;\n    /** Initial size of the first pane, as a percentage. Defaults to `50`. */\n    defaultSize?: number;\n    /** Lower clamp for the first pane size, in percent. Defaults to `10`. */\n    min?: number;\n    /** Upper clamp for the first pane size, in percent. Defaults to `90`. */\n    max?: number;\n    /** Exactly two panes — `[paneA, paneB]`. */\n    children: [ReactNode, ReactNode];\n}\n\nconst KEY_STEP = 2;\n\n/**\n * Clamp a number into the inclusive `[min, max]` range.\n *\n * @param value - The value to clamp.\n * @param min - Lower bound.\n * @param max - Upper bound.\n * @returns The clamped value.\n */\nfunction clamp(value: number, min: number, max: number): number {\n    return Math.min(max, Math.max(min, value));\n}\n\n/**\n * A two-pane split layout with a draggable divider. The first pane is sized via\n * `flex-basis` as a percentage; the second pane fills the rest. Drag the divider\n * with a pointer, or focus it and use the arrow keys to adjust by 2% steps.\n *\n * The size is clamped to `[min, max]` at all times.\n */\nexport function Resizable({\n    direction = \"horizontal\",\n    defaultSize = 50,\n    min = 10,\n    max = 90,\n    children,\n    className,\n    ...props\n}: ResizableProps) {\n    const [size, setSize] = useState<number>(() => clamp(defaultSize, min, max));\n    const containerRef = useRef<HTMLDivElement | null>(null);\n    const [paneA, paneB] = children;\n    const isHorizontal = direction === \"horizontal\";\n\n    const updateFromPointer = useCallback(\n        (clientX: number, clientY: number): void => {\n            const container = containerRef.current;\n            if (!container) return;\n            const rect = container.getBoundingClientRect();\n            const total = isHorizontal ? rect.width : rect.height;\n            if (total <= 0) return;\n            const offset = isHorizontal ? clientX - rect.left : clientY - rect.top;\n            const percent = (offset / total) * 100;\n            setSize(clamp(percent, min, max));\n        },\n        [isHorizontal, min, max],\n    );\n\n    const handlePointerDown = useCallback(\n        (event: PointerEvent<HTMLDivElement>): void => {\n            event.preventDefault();\n            const divider = event.currentTarget;\n            divider.setPointerCapture(event.pointerId);\n\n            const handleMove = (moveEvent: globalThis.PointerEvent): void => {\n                updateFromPointer(moveEvent.clientX, moveEvent.clientY);\n            };\n            const handleUp = (): void => {\n                window.removeEventListener(\"pointermove\", handleMove);\n                window.removeEventListener(\"pointerup\", handleUp);\n            };\n\n            window.addEventListener(\"pointermove\", handleMove);\n            window.addEventListener(\"pointerup\", handleUp);\n        },\n        [updateFromPointer],\n    );\n\n    const handleKeyDown = useCallback(\n        (event: KeyboardEvent<HTMLDivElement>): void => {\n            let delta = 0;\n            if (isHorizontal) {\n                if (event.key === \"ArrowRight\") delta = KEY_STEP;\n                else if (event.key === \"ArrowLeft\") delta = -KEY_STEP;\n            } else {\n                if (event.key === \"ArrowDown\") delta = KEY_STEP;\n                else if (event.key === \"ArrowUp\") delta = -KEY_STEP;\n            }\n            if (event.key === \"Home\") {\n                event.preventDefault();\n                setSize(min);\n                return;\n            }\n            if (event.key === \"End\") {\n                event.preventDefault();\n                setSize(max);\n                return;\n            }\n            if (delta === 0) return;\n            event.preventDefault();\n            setSize((current) => clamp(current + delta, min, max));\n        },\n        [isHorizontal, min, max],\n    );\n\n    return (\n        <div\n            ref={containerRef}\n            className={cn(\n                styles.root,\n                isHorizontal ? styles.horizontal : styles.vertical,\n                className,\n            )}\n            {...props}\n        >\n            <div className={styles.pane} style={{ flexBasis: `${size}%` }}>\n                {paneA}\n            </div>\n            <div\n                role=\"separator\"\n                aria-orientation={isHorizontal ? \"vertical\" : \"horizontal\"}\n                aria-valuenow={Math.round(size)}\n                aria-valuemin={min}\n                aria-valuemax={max}\n                tabIndex={0}\n                className={styles.divider}\n                onPointerDown={handlePointerDown}\n                onKeyDown={handleKeyDown}\n            >\n                <span className={styles.handle} aria-hidden=\"true\" />\n            </div>\n            <div className={styles.pane} style={{ flexBasis: `${100 - size}%` }}>\n                {paneB}\n            </div>\n        </div>\n    );\n}\n"],"names":["KEY_STEP","clamp","value","min","max","Resizable","direction","defaultSize","children","className","props","size","setSize","useState","containerRef","useRef","paneA","paneB","isHorizontal","updateFromPointer","useCallback","clientX","clientY","container","rect","total","percent","handlePointerDown","event","handleMove","moveEvent","handleUp","handleKeyDown","delta","current","jsxs","cn","styles","jsx"],"mappings":"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"}
+{"version":3,"file":"Resizable.js","names":[],"sources":["../../../src/components/Resizable/Resizable.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from \"react\";\nimport type { HTMLAttributes, KeyboardEvent, PointerEvent, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Resizable.module.css\";\n\nexport type ResizableDirection = \"horizontal\" | \"vertical\";\n\nexport interface ResizableProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n    /** Split orientation. `horizontal` (default) places panes side by side. */\n    direction?: ResizableDirection;\n    /** Initial size of the first pane, as a percentage. Defaults to `50`. */\n    defaultSize?: number;\n    /** Lower clamp for the first pane size, in percent. Defaults to `10`. */\n    min?: number;\n    /** Upper clamp for the first pane size, in percent. Defaults to `90`. */\n    max?: number;\n    /** Exactly two panes — `[paneA, paneB]`. */\n    children: [ReactNode, ReactNode];\n}\n\nconst KEY_STEP = 2;\n\n/**\n * Clamp a number into the inclusive `[min, max]` range.\n *\n * @param value - The value to clamp.\n * @param min - Lower bound.\n * @param max - Upper bound.\n * @returns The clamped value.\n */\nfunction clamp(value: number, min: number, max: number): number {\n    return Math.min(max, Math.max(min, value));\n}\n\n/**\n * A two-pane split layout with a draggable divider. The first pane is sized via\n * `flex-basis` as a percentage; the second pane fills the rest. Drag the divider\n * with a pointer, or focus it and use the arrow keys to adjust by 2% steps.\n *\n * The size is clamped to `[min, max]` at all times.\n */\nexport function Resizable({\n    direction = \"horizontal\",\n    defaultSize = 50,\n    min = 10,\n    max = 90,\n    children,\n    className,\n    ...props\n}: ResizableProps) {\n    const [size, setSize] = useState<number>(() => clamp(defaultSize, min, max));\n    const containerRef = useRef<HTMLDivElement | null>(null);\n    const [paneA, paneB] = children;\n    const isHorizontal = direction === \"horizontal\";\n\n    const updateFromPointer = useCallback(\n        (clientX: number, clientY: number): void => {\n            const container = containerRef.current;\n            if (!container) return;\n            const rect = container.getBoundingClientRect();\n            const total = isHorizontal ? rect.width : rect.height;\n            if (total <= 0) return;\n            const offset = isHorizontal ? clientX - rect.left : clientY - rect.top;\n            const percent = (offset / total) * 100;\n            setSize(clamp(percent, min, max));\n        },\n        [isHorizontal, min, max],\n    );\n\n    const handlePointerDown = useCallback(\n        (event: PointerEvent<HTMLDivElement>): void => {\n            event.preventDefault();\n            const divider = event.currentTarget;\n            divider.setPointerCapture(event.pointerId);\n\n            const handleMove = (moveEvent: globalThis.PointerEvent): void => {\n                updateFromPointer(moveEvent.clientX, moveEvent.clientY);\n            };\n            const handleUp = (): void => {\n                window.removeEventListener(\"pointermove\", handleMove);\n                window.removeEventListener(\"pointerup\", handleUp);\n            };\n\n            window.addEventListener(\"pointermove\", handleMove);\n            window.addEventListener(\"pointerup\", handleUp);\n        },\n        [updateFromPointer],\n    );\n\n    const handleKeyDown = useCallback(\n        (event: KeyboardEvent<HTMLDivElement>): void => {\n            let delta = 0;\n            if (isHorizontal) {\n                if (event.key === \"ArrowRight\") delta = KEY_STEP;\n                else if (event.key === \"ArrowLeft\") delta = -KEY_STEP;\n            } else {\n                if (event.key === \"ArrowDown\") delta = KEY_STEP;\n                else if (event.key === \"ArrowUp\") delta = -KEY_STEP;\n            }\n            if (event.key === \"Home\") {\n                event.preventDefault();\n                setSize(min);\n                return;\n            }\n            if (event.key === \"End\") {\n                event.preventDefault();\n                setSize(max);\n                return;\n            }\n            if (delta === 0) return;\n            event.preventDefault();\n            setSize((current) => clamp(current + delta, min, max));\n        },\n        [isHorizontal, min, max],\n    );\n\n    return (\n        <div\n            ref={containerRef}\n            className={cn(\n                styles.root,\n                isHorizontal ? styles.horizontal : styles.vertical,\n                className,\n            )}\n            {...props}\n        >\n            <div className={styles.pane} style={{ flexBasis: `${size}%` }}>\n                {paneA}\n            </div>\n            <div\n                role=\"separator\"\n                aria-orientation={isHorizontal ? \"vertical\" : \"horizontal\"}\n                aria-valuenow={Math.round(size)}\n                aria-valuemin={min}\n                aria-valuemax={max}\n                tabIndex={0}\n                className={styles.divider}\n                onPointerDown={handlePointerDown}\n                onKeyDown={handleKeyDown}\n            >\n                <span className={styles.handle} aria-hidden=\"true\" />\n            </div>\n            <div className={styles.pane} style={{ flexBasis: `${100 - size}%` }}>\n                {paneB}\n            </div>\n        </div>\n    );\n}\n"],"mappings":";;;;;AAoBA,IAAM,IAAW;AAUjB,SAAS,EAAM,GAAe,GAAa,GAAqB;CAC5D,OAAO,KAAK,IAAI,GAAK,KAAK,IAAI,GAAK,CAAK,CAAC;AAC7C;AASA,SAAgB,EAAU,EACtB,eAAY,cACZ,iBAAc,IACd,SAAM,IACN,SAAM,IACN,aACA,cACA,GAAG,KACY;CACf,IAAM,CAAC,GAAM,KAAW,QAAuB,EAAM,GAAa,GAAK,CAAG,CAAC,GACrE,IAAe,EAA8B,IAAI,GACjD,CAAC,GAAO,KAAS,GACjB,IAAe,MAAc,cAE7B,IAAoB,GACrB,GAAiB,MAA0B;EACxC,IAAM,IAAY,EAAa;EAC/B,IAAI,CAAC,GAAW;EAChB,IAAM,IAAO,EAAU,sBAAsB,GACvC,IAAQ,IAAe,EAAK,QAAQ,EAAK;EAC/C,IAAI,KAAS,GAAG;EAEhB,IAAM,KADS,IAAe,IAAU,EAAK,OAAO,IAAU,EAAK,OACzC,IAAS;EACnC,EAAQ,EAAM,GAAS,GAAK,CAAG,CAAC;CACpC,GACA;EAAC;EAAc;EAAK;CAAG,CAC3B,GAEM,IAAoB,GACrB,MAA8C;EAG3C,AAFA,EAAM,eAAe,GAErB,EADsB,cACd,kBAAkB,EAAM,SAAS;EAEzC,IAAM,KAAc,MAA6C;GAC7D,EAAkB,EAAU,SAAS,EAAU,OAAO;EAC1D,GACM,UAAuB;GAEzB,AADA,OAAO,oBAAoB,eAAe,CAAU,GACpD,OAAO,oBAAoB,aAAa,CAAQ;EACpD;EAGA,AADA,OAAO,iBAAiB,eAAe,CAAU,GACjD,OAAO,iBAAiB,aAAa,CAAQ;CACjD,GACA,CAAC,CAAiB,CACtB,GAEM,IAAgB,GACjB,MAA+C;EAC5C,IAAI,IAAQ;EAQZ,IAPI,IACI,EAAM,QAAQ,eAAc,IAAQ,IAC/B,EAAM,QAAQ,gBAAa,IAAQ,MAExC,EAAM,QAAQ,cAAa,IAAQ,IAC9B,EAAM,QAAQ,cAAW,IAAQ,KAE1C,EAAM,QAAQ,QAAQ;GAEtB,AADA,EAAM,eAAe,GACrB,EAAQ,CAAG;GACX;EACJ;EACA,IAAI,EAAM,QAAQ,OAAO;GAErB,AADA,EAAM,eAAe,GACrB,EAAQ,CAAG;GACX;EACJ;EACI,MAAU,MACd,EAAM,eAAe,GACrB,GAAS,MAAY,EAAM,IAAU,GAAO,GAAK,CAAG,CAAC;CACzD,GACA;EAAC;EAAc;EAAK;CAAG,CAC3B;CAEA,OACI,kBAAC,OAAD;EACI,KAAK;EACL,WAAW,EACP,EAAO,MACP,IAAe,EAAO,aAAa,EAAO,UAC1C,CACJ;EACA,GAAI;YAPR;GASI,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAM,OAAO,EAAE,WAAW,GAAG,EAAK,GAAG;cACvD;GACA,CAAA;GACL,kBAAC,OAAD;IACI,MAAK;IACL,oBAAkB,IAAe,aAAa;IAC9C,iBAAe,KAAK,MAAM,CAAI;IAC9B,iBAAe;IACf,iBAAe;IACf,UAAU;IACV,WAAW,EAAO;IAClB,eAAe;IACf,WAAW;cAEX,kBAAC,QAAD;KAAM,WAAW,EAAO;KAAQ,eAAY;IAAQ,CAAA;GACnD,CAAA;GACL,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAM,OAAO,EAAE,WAAW,GAAG,MAAM,EAAK,GAAG;cAC7D;GACA,CAAA;EACJ;;AAEb"}

package/dist/components/Resizable/Resizable.module.cjs

@@ -0,0 +1,2 @@
+var e=`tempest_root_-Xerf`,t=`tempest_horizontal_3QOMV`,n=`tempest_vertical_6A7lb`,r=`tempest_pane_x6yUG`,i=`tempest_divider_fhaTB`,a=`tempest_handle_eCe1B`,o={root:e,horizontal:t,vertical:n,pane:r,divider:i,handle:a};exports.default=o,exports.divider=i,exports.handle=a,exports.horizontal=t,exports.pane=r,exports.root=e,exports.vertical=n;
+//# sourceMappingURL=Resizable.module.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Resizable.module.cjs","names":[],"sources":["../../../src/components/Resizable/Resizable.module.css"],"sourcesContent":[".root {\n    display: flex;\n    width: 100%;\n    height: 100%;\n    overflow: hidden;\n}\n\n.horizontal {\n    flex-direction: row;\n}\n\n.vertical {\n    flex-direction: column;\n}\n\n.pane {\n    flex-grow: 0;\n    flex-shrink: 0;\n    min-width: 0;\n    min-height: 0;\n    overflow: auto;\n}\n\n.divider {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: var(--tempest-border);\n    transition: background-color var(--tempest-duration-fast) var(--tempest-ease-out);\n    touch-action: none;\n    user-select: none;\n}\n\n.divider:hover,\n.divider:focus-visible {\n    background-color: var(--tempest-primary);\n}\n\n.divider: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\n.horizontal > .divider {\n    width: 6px;\n    height: 100%;\n    cursor: col-resize;\n}\n\n.vertical > .divider {\n    width: 100%;\n    height: 6px;\n    cursor: row-resize;\n}\n\n.handle {\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-surface);\n    opacity: 0.7;\n}\n\n.horizontal > .divider .handle {\n    width: 2px;\n    height: 24px;\n}\n\n.vertical > .divider .handle {\n    width: 24px;\n    height: 2px;\n}\n"],"mappings":""}

package/dist/components/Resizable/Resizable.module.js

@@ -0,0 +1,13 @@
+//#region src/components/Resizable/Resizable.module.css
+var e = "tempest_root_-Xerf", t = "tempest_horizontal_3QOMV", n = "tempest_vertical_6A7lb", r = "tempest_pane_x6yUG", i = "tempest_divider_fhaTB", a = "tempest_handle_eCe1B", o = {
+	root: e,
+	horizontal: t,
+	vertical: n,
+	pane: r,
+	divider: i,
+	handle: a
+};
+//#endregion
+export { o as default, i as divider, a as handle, t as horizontal, r as pane, e as root, n as vertical };
+
+//# sourceMappingURL=Resizable.module.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Resizable.module.js","names":[],"sources":["../../../src/components/Resizable/Resizable.module.css"],"sourcesContent":[".root {\n    display: flex;\n    width: 100%;\n    height: 100%;\n    overflow: hidden;\n}\n\n.horizontal {\n    flex-direction: row;\n}\n\n.vertical {\n    flex-direction: column;\n}\n\n.pane {\n    flex-grow: 0;\n    flex-shrink: 0;\n    min-width: 0;\n    min-height: 0;\n    overflow: auto;\n}\n\n.divider {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: var(--tempest-border);\n    transition: background-color var(--tempest-duration-fast) var(--tempest-ease-out);\n    touch-action: none;\n    user-select: none;\n}\n\n.divider:hover,\n.divider:focus-visible {\n    background-color: var(--tempest-primary);\n}\n\n.divider: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\n.horizontal > .divider {\n    width: 6px;\n    height: 100%;\n    cursor: col-resize;\n}\n\n.vertical > .divider {\n    width: 100%;\n    height: 6px;\n    cursor: row-resize;\n}\n\n.handle {\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-surface);\n    opacity: 0.7;\n}\n\n.horizontal > .divider .handle {\n    width: 2px;\n    height: 24px;\n}\n\n.vertical > .divider .handle {\n    width: 24px;\n    height: 2px;\n}\n"],"mappings":""}

package/dist/components/Responsive/Responsive.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../../hooks/use-breakpoint.cjs");function s(u,t,n,r,e){return r?(Array.isArray(r)?r:[r]).includes(u):!(t&&!e.above(t)||n&&!e.below(n))}function o({above:u,below:t,only:n,children:r}){const e=i.useBreakpoint();return s(e.current,u,t,n,e)?r:null}function c({above:u,below:t,only:n,children:r}){const e=i.useBreakpoint();return s(e.current,u,t,n,e)?null:r}exports.Hide=c;exports.Show=o;
-//# sourceMappingURL=Responsive.cjs.map
+const e=require("../../hooks/use-breakpoint.cjs");function t(e,t,n,r,i){return r?(Array.isArray(r)?r:[r]).includes(e):!(t&&!i.above(t)||n&&!i.below(n))}function n({above:n,below:r,only:i,children:a}){let o=e.useBreakpoint();return t(o.current,n,r,i,o)?a:null}function r({above:n,below:r,only:i,children:a}){let o=e.useBreakpoint();return t(o.current,n,r,i,o)?null:a}exports.Hide=r,exports.Show=n;
+//# sourceMappingURL=Responsive.cjs.map

package/dist/components/Responsive/Responsive.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Responsive.cjs","sources":["../../../src/components/Responsive/Responsive.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { useBreakpoint, type Breakpoint } from \"@/hooks/use-breakpoint\";\n\nexport interface ShowProps {\n    /** Render children only when viewport width is `>=` this breakpoint. */\n    above?: Breakpoint;\n    /** Render children only when viewport width is `<` this breakpoint. */\n    below?: Breakpoint;\n    /** Render only on specific breakpoints. Wins over `above`/`below` when set. */\n    only?: Breakpoint | Breakpoint[];\n    children: ReactNode;\n}\n\nfunction shouldRender(\n    current: Breakpoint,\n    above: Breakpoint | undefined,\n    below: Breakpoint | undefined,\n    only: Breakpoint | Breakpoint[] | undefined,\n    helpers: { above: (bp: Breakpoint) => boolean; below: (bp: Breakpoint) => boolean },\n): boolean {\n    if (only) {\n        const list = Array.isArray(only) ? only : [only];\n        return list.includes(current);\n    }\n    if (above && !helpers.above(above)) return false;\n    if (below && !helpers.below(below)) return false;\n    return true;\n}\n\n/**\n * Conditionally render children based on the viewport breakpoint.\n *\n * - `above` — render when viewport width is `>=` the given breakpoint.\n * - `below` — render when viewport width is `<` the given breakpoint.\n * - `only` — render only on the listed breakpoint(s).\n *\n * SSR-safe: first render uses `xs` (renders mobile content first); the\n * component re-renders once `useBreakpoint` has the real viewport width.\n */\nexport function Show({ above, below, only, children }: ShowProps): ReactNode {\n    const bp = useBreakpoint();\n    if (!shouldRender(bp.current, above, below, only, bp)) return null;\n    return children;\n}\n\nexport interface HideProps {\n    /** Hide children when viewport width is `>=` this breakpoint. */\n    above?: Breakpoint;\n    /** Hide children when viewport width is `<` this breakpoint. */\n    below?: Breakpoint;\n    /** Hide on specific breakpoints. */\n    only?: Breakpoint | Breakpoint[];\n    children: ReactNode;\n}\n\n/** Inverse of `<Show>` — hides children when the condition matches. */\nexport function Hide({ above, below, only, children }: HideProps): ReactNode {\n    const bp = useBreakpoint();\n    if (shouldRender(bp.current, above, below, only, bp)) return null;\n    return children;\n}\n"],"names":["shouldRender","current","above","below","only","helpers","Show","children","bp","useBreakpoint","Hide"],"mappings":"kIAaA,SAASA,EACLC,EACAC,EACAC,EACAC,EACAC,EACO,CACP,OAAID,GACa,MAAM,QAAQA,CAAI,EAAIA,EAAO,CAACA,CAAI,GACnC,SAASH,CAAO,EAE5B,EAAAC,GAAS,CAACG,EAAQ,MAAMH,CAAK,GAC7BC,GAAS,CAACE,EAAQ,MAAMF,CAAK,EAErC,CAYO,SAASG,EAAK,CAAE,MAAAJ,EAAO,MAAAC,EAAO,KAAAC,EAAM,SAAAG,GAAkC,CACzE,MAAMC,EAAKC,EAAAA,cAAA,EACX,OAAKT,EAAaQ,EAAG,QAASN,EAAOC,EAAOC,EAAMI,CAAE,EAC7CD,EADuD,IAElE,CAaO,SAASG,EAAK,CAAE,MAAAR,EAAO,MAAAC,EAAO,KAAAC,EAAM,SAAAG,GAAkC,CACzE,MAAMC,EAAKC,EAAAA,cAAA,EACX,OAAIT,EAAaQ,EAAG,QAASN,EAAOC,EAAOC,EAAMI,CAAE,EAAU,KACtDD,CACX"}
+{"version":3,"file":"Responsive.cjs","names":[],"sources":["../../../src/components/Responsive/Responsive.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { useBreakpoint, type Breakpoint } from \"@/hooks/use-breakpoint\";\n\nexport interface ShowProps {\n    /** Render children only when viewport width is `>=` this breakpoint. */\n    above?: Breakpoint;\n    /** Render children only when viewport width is `<` this breakpoint. */\n    below?: Breakpoint;\n    /** Render only on specific breakpoints. Wins over `above`/`below` when set. */\n    only?: Breakpoint | Breakpoint[];\n    children: ReactNode;\n}\n\nfunction shouldRender(\n    current: Breakpoint,\n    above: Breakpoint | undefined,\n    below: Breakpoint | undefined,\n    only: Breakpoint | Breakpoint[] | undefined,\n    helpers: { above: (bp: Breakpoint) => boolean; below: (bp: Breakpoint) => boolean },\n): boolean {\n    if (only) {\n        const list = Array.isArray(only) ? only : [only];\n        return list.includes(current);\n    }\n    if (above && !helpers.above(above)) return false;\n    if (below && !helpers.below(below)) return false;\n    return true;\n}\n\n/**\n * Conditionally render children based on the viewport breakpoint.\n *\n * - `above` — render when viewport width is `>=` the given breakpoint.\n * - `below` — render when viewport width is `<` the given breakpoint.\n * - `only` — render only on the listed breakpoint(s).\n *\n * SSR-safe: first render uses `xs` (renders mobile content first); the\n * component re-renders once `useBreakpoint` has the real viewport width.\n */\nexport function Show({ above, below, only, children }: ShowProps): ReactNode {\n    const bp = useBreakpoint();\n    if (!shouldRender(bp.current, above, below, only, bp)) return null;\n    return children;\n}\n\nexport interface HideProps {\n    /** Hide children when viewport width is `>=` this breakpoint. */\n    above?: Breakpoint;\n    /** Hide children when viewport width is `<` this breakpoint. */\n    below?: Breakpoint;\n    /** Hide on specific breakpoints. */\n    only?: Breakpoint | Breakpoint[];\n    children: ReactNode;\n}\n\n/** Inverse of `<Show>` — hides children when the condition matches. */\nexport function Hide({ above, below, only, children }: HideProps): ReactNode {\n    const bp = useBreakpoint();\n    if (shouldRender(bp.current, above, below, only, bp)) return null;\n    return children;\n}\n"],"mappings":"kDAaA,SAAS,EACL,EACA,EACA,EACA,EACA,EACO,CAOP,OANI,GACa,MAAM,QAAQ,CAAI,EAAI,EAAO,CAAC,CAAI,EAAA,CACnC,SAAS,CAAO,EAGhC,EADI,GAAS,CAAC,EAAQ,MAAM,CAAK,GAC7B,GAAS,CAAC,EAAQ,MAAM,CAAK,EAErC,CAYA,SAAgB,EAAK,CAAE,QAAO,QAAO,OAAM,YAAkC,CACzE,IAAM,EAAK,EAAA,cAAc,EAEzB,OADK,EAAa,EAAG,QAAS,EAAO,EAAO,EAAM,CAAE,EAC7C,EADuD,IAElE,CAaA,SAAgB,EAAK,CAAE,QAAO,QAAO,OAAM,YAAkC,CACzE,IAAM,EAAK,EAAA,cAAc,EAEzB,OADI,EAAa,EAAG,QAAS,EAAO,EAAO,EAAM,CAAE,EAAU,KACtD,CACX"}

package/dist/components/Responsive/Responsive.js

@@ -1,17 +1,17 @@
-import { useBreakpoint as i } from "../../hooks/use-breakpoint.js";
-function f(e, n, u, r, t) {
-  return r ? (Array.isArray(r) ? r : [r]).includes(e) : !(n && !t.above(n) || u && !t.below(u));
+import { useBreakpoint as e } from "../../hooks/use-breakpoint.js";
+//#region src/components/Responsive/Responsive.tsx
+function t(e, t, n, r, i) {
+	return r ? (Array.isArray(r) ? r : [r]).includes(e) : !(t && !i.above(t) || n && !i.below(n));
 }
-function o({ above: e, below: n, only: u, children: r }) {
-  const t = i();
-  return f(t.current, e, n, u, t) ? r : null;
+function n({ above: n, below: r, only: i, children: a }) {
+	let o = e();
+	return t(o.current, n, r, i, o) ? a : null;
 }
-function l({ above: e, below: n, only: u, children: r }) {
-  const t = i();
-  return f(t.current, e, n, u, t) ? null : r;
+function r({ above: n, below: r, only: i, children: a }) {
+	let o = e();
+	return t(o.current, n, r, i, o) ? null : a;
 }
-export {
-  l as Hide,
-  o as Show
-};
-//# sourceMappingURL=Responsive.js.map
+//#endregion
+export { r as Hide, n as Show };
+
+//# sourceMappingURL=Responsive.js.map

package/dist/components/Responsive/Responsive.js.map

@@ -1 +1 @@
-{"version":3,"file":"Responsive.js","sources":["../../../src/components/Responsive/Responsive.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { useBreakpoint, type Breakpoint } from \"@/hooks/use-breakpoint\";\n\nexport interface ShowProps {\n    /** Render children only when viewport width is `>=` this breakpoint. */\n    above?: Breakpoint;\n    /** Render children only when viewport width is `<` this breakpoint. */\n    below?: Breakpoint;\n    /** Render only on specific breakpoints. Wins over `above`/`below` when set. */\n    only?: Breakpoint | Breakpoint[];\n    children: ReactNode;\n}\n\nfunction shouldRender(\n    current: Breakpoint,\n    above: Breakpoint | undefined,\n    below: Breakpoint | undefined,\n    only: Breakpoint | Breakpoint[] | undefined,\n    helpers: { above: (bp: Breakpoint) => boolean; below: (bp: Breakpoint) => boolean },\n): boolean {\n    if (only) {\n        const list = Array.isArray(only) ? only : [only];\n        return list.includes(current);\n    }\n    if (above && !helpers.above(above)) return false;\n    if (below && !helpers.below(below)) return false;\n    return true;\n}\n\n/**\n * Conditionally render children based on the viewport breakpoint.\n *\n * - `above` — render when viewport width is `>=` the given breakpoint.\n * - `below` — render when viewport width is `<` the given breakpoint.\n * - `only` — render only on the listed breakpoint(s).\n *\n * SSR-safe: first render uses `xs` (renders mobile content first); the\n * component re-renders once `useBreakpoint` has the real viewport width.\n */\nexport function Show({ above, below, only, children }: ShowProps): ReactNode {\n    const bp = useBreakpoint();\n    if (!shouldRender(bp.current, above, below, only, bp)) return null;\n    return children;\n}\n\nexport interface HideProps {\n    /** Hide children when viewport width is `>=` this breakpoint. */\n    above?: Breakpoint;\n    /** Hide children when viewport width is `<` this breakpoint. */\n    below?: Breakpoint;\n    /** Hide on specific breakpoints. */\n    only?: Breakpoint | Breakpoint[];\n    children: ReactNode;\n}\n\n/** Inverse of `<Show>` — hides children when the condition matches. */\nexport function Hide({ above, below, only, children }: HideProps): ReactNode {\n    const bp = useBreakpoint();\n    if (shouldRender(bp.current, above, below, only, bp)) return null;\n    return children;\n}\n"],"names":["shouldRender","current","above","below","only","helpers","Show","children","bp","useBreakpoint","Hide"],"mappings":";AAaA,SAASA,EACLC,GACAC,GACAC,GACAC,GACAC,GACO;AACP,SAAID,KACa,MAAM,QAAQA,CAAI,IAAIA,IAAO,CAACA,CAAI,GACnC,SAASH,CAAO,IAE5B,EAAAC,KAAS,CAACG,EAAQ,MAAMH,CAAK,KAC7BC,KAAS,CAACE,EAAQ,MAAMF,CAAK;AAErC;AAYO,SAASG,EAAK,EAAE,OAAAJ,GAAO,OAAAC,GAAO,MAAAC,GAAM,UAAAG,KAAkC;AACzE,QAAMC,IAAKC,EAAA;AACX,SAAKT,EAAaQ,EAAG,SAASN,GAAOC,GAAOC,GAAMI,CAAE,IAC7CD,IADuD;AAElE;AAaO,SAASG,EAAK,EAAE,OAAAR,GAAO,OAAAC,GAAO,MAAAC,GAAM,UAAAG,KAAkC;AACzE,QAAMC,IAAKC,EAAA;AACX,SAAIT,EAAaQ,EAAG,SAASN,GAAOC,GAAOC,GAAMI,CAAE,IAAU,OACtDD;AACX;"}
+{"version":3,"file":"Responsive.js","names":[],"sources":["../../../src/components/Responsive/Responsive.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { useBreakpoint, type Breakpoint } from \"@/hooks/use-breakpoint\";\n\nexport interface ShowProps {\n    /** Render children only when viewport width is `>=` this breakpoint. */\n    above?: Breakpoint;\n    /** Render children only when viewport width is `<` this breakpoint. */\n    below?: Breakpoint;\n    /** Render only on specific breakpoints. Wins over `above`/`below` when set. */\n    only?: Breakpoint | Breakpoint[];\n    children: ReactNode;\n}\n\nfunction shouldRender(\n    current: Breakpoint,\n    above: Breakpoint | undefined,\n    below: Breakpoint | undefined,\n    only: Breakpoint | Breakpoint[] | undefined,\n    helpers: { above: (bp: Breakpoint) => boolean; below: (bp: Breakpoint) => boolean },\n): boolean {\n    if (only) {\n        const list = Array.isArray(only) ? only : [only];\n        return list.includes(current);\n    }\n    if (above && !helpers.above(above)) return false;\n    if (below && !helpers.below(below)) return false;\n    return true;\n}\n\n/**\n * Conditionally render children based on the viewport breakpoint.\n *\n * - `above` — render when viewport width is `>=` the given breakpoint.\n * - `below` — render when viewport width is `<` the given breakpoint.\n * - `only` — render only on the listed breakpoint(s).\n *\n * SSR-safe: first render uses `xs` (renders mobile content first); the\n * component re-renders once `useBreakpoint` has the real viewport width.\n */\nexport function Show({ above, below, only, children }: ShowProps): ReactNode {\n    const bp = useBreakpoint();\n    if (!shouldRender(bp.current, above, below, only, bp)) return null;\n    return children;\n}\n\nexport interface HideProps {\n    /** Hide children when viewport width is `>=` this breakpoint. */\n    above?: Breakpoint;\n    /** Hide children when viewport width is `<` this breakpoint. */\n    below?: Breakpoint;\n    /** Hide on specific breakpoints. */\n    only?: Breakpoint | Breakpoint[];\n    children: ReactNode;\n}\n\n/** Inverse of `<Show>` — hides children when the condition matches. */\nexport function Hide({ above, below, only, children }: HideProps): ReactNode {\n    const bp = useBreakpoint();\n    if (shouldRender(bp.current, above, below, only, bp)) return null;\n    return children;\n}\n"],"mappings":";;AAaA,SAAS,EACL,GACA,GACA,GACA,GACA,GACO;CAOP,OANI,KACa,MAAM,QAAQ,CAAI,IAAI,IAAO,CAAC,CAAI,EAAA,CACnC,SAAS,CAAO,IAGhC,EADI,KAAS,CAAC,EAAQ,MAAM,CAAK,KAC7B,KAAS,CAAC,EAAQ,MAAM,CAAK;AAErC;AAYA,SAAgB,EAAK,EAAE,UAAO,UAAO,SAAM,eAAkC;CACzE,IAAM,IAAK,EAAc;CAEzB,OADK,EAAa,EAAG,SAAS,GAAO,GAAO,GAAM,CAAE,IAC7C,IADuD;AAElE;AAaA,SAAgB,EAAK,EAAE,UAAO,UAAO,SAAM,eAAkC;CACzE,IAAM,IAAK,EAAc;CAEzB,OADI,EAAa,EAAG,SAAS,GAAO,GAAO,GAAM,CAAE,IAAU,OACtD;AACX"}

package/dist/components/SafeArea/SafeArea.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),n=require("../../utils/cn.cjs"),t=require("./SafeArea.module.css.cjs"),r=["top","right","bottom","left"];function f({edges:e=r,inline:a=!1,className:l,children:o,...u}){return i.jsx("div",{className:n.cn(t.default.safe,a&&t.default.inline,e.includes("top")&&t.default.top,e.includes("right")&&t.default.right,e.includes("bottom")&&t.default.bottom,e.includes("left")&&t.default.left,l),"data-edges":e.join(" "),...u,children:o})}exports.SafeArea=f;
-//# sourceMappingURL=SafeArea.cjs.map
+const e=require("../../utils/cn.cjs"),t=require("./SafeArea.module.cjs");let n=require("react/jsx-runtime");var r=[`top`,`right`,`bottom`,`left`];function i({edges:i=r,inline:a=!1,className:o,children:s,...c}){return(0,n.jsx)(`div`,{className:e.cn(t.default.safe,a&&t.default.inline,i.includes(`top`)&&t.default.top,i.includes(`right`)&&t.default.right,i.includes(`bottom`)&&t.default.bottom,i.includes(`left`)&&t.default.left,o),"data-edges":i.join(` `),...c,children:s})}exports.SafeArea=i;
+//# sourceMappingURL=SafeArea.cjs.map

package/dist/components/SafeArea/SafeArea.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SafeArea.cjs","sources":["../../../src/components/SafeArea/SafeArea.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./SafeArea.module.css\";\n\nexport type SafeAreaEdge = \"top\" | \"right\" | \"bottom\" | \"left\";\n\nexport interface SafeAreaProps extends HTMLAttributes<HTMLDivElement> {\n    /** Edges to pad. Default `[\"top\",\"right\",\"bottom\",\"left\"]` (all). */\n    edges?: SafeAreaEdge[];\n    /** Render as inline (use `display: contents`). */\n    inline?: boolean;\n    children?: ReactNode;\n}\n\nconst ALL_EDGES: SafeAreaEdge[] = [\"top\", \"right\", \"bottom\", \"left\"];\n\n/**\n * Apply `env(safe-area-inset-*)` padding so content avoids iOS notch /\n * Android navbar / device chrome. Wrap the outermost container of pages\n * with sticky headers/footers.\n *\n * @example\n * <SafeArea edges={[\"top\"]}>\n *     <Navbar />\n * </SafeArea>\n */\nexport function SafeArea({\n    edges = ALL_EDGES,\n    inline = false,\n    className,\n    children,\n    ...props\n}: SafeAreaProps) {\n    return (\n        <div\n            className={cn(\n                styles.safe,\n                inline && styles.inline,\n                edges.includes(\"top\") && styles.top,\n                edges.includes(\"right\") && styles.right,\n                edges.includes(\"bottom\") && styles.bottom,\n                edges.includes(\"left\") && styles.left,\n                className,\n            )}\n            data-edges={edges.join(\" \")}\n            {...props}\n        >\n            {children}\n        </div>\n    );\n}\n"],"names":["ALL_EDGES","SafeArea","edges","inline","className","children","props","jsx","cn","styles"],"mappings":"4LAcMA,EAA4B,CAAC,MAAO,QAAS,SAAU,MAAM,EAY5D,SAASC,EAAS,CACrB,MAAAC,EAAQF,EACR,OAAAG,EAAS,GACT,UAAAC,EACA,SAAAC,EACA,GAAGC,CACP,EAAkB,CACd,OACIC,EAAAA,IAAC,MAAA,CACG,UAAWC,EAAAA,GACPC,EAAAA,QAAO,KACPN,GAAUM,EAAAA,QAAO,OACjBP,EAAM,SAAS,KAAK,GAAKO,EAAAA,QAAO,IAChCP,EAAM,SAAS,OAAO,GAAKO,EAAAA,QAAO,MAClCP,EAAM,SAAS,QAAQ,GAAKO,EAAAA,QAAO,OACnCP,EAAM,SAAS,MAAM,GAAKO,EAAAA,QAAO,KACjCL,CAAA,EAEJ,aAAYF,EAAM,KAAK,GAAG,EACzB,GAAGI,EAEH,SAAAD,CAAA,CAAA,CAGb"}
+{"version":3,"file":"SafeArea.cjs","names":[],"sources":["../../../src/components/SafeArea/SafeArea.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./SafeArea.module.css\";\n\nexport type SafeAreaEdge = \"top\" | \"right\" | \"bottom\" | \"left\";\n\nexport interface SafeAreaProps extends HTMLAttributes<HTMLDivElement> {\n    /** Edges to pad. Default `[\"top\",\"right\",\"bottom\",\"left\"]` (all). */\n    edges?: SafeAreaEdge[];\n    /** Render as inline (use `display: contents`). */\n    inline?: boolean;\n    children?: ReactNode;\n}\n\nconst ALL_EDGES: SafeAreaEdge[] = [\"top\", \"right\", \"bottom\", \"left\"];\n\n/**\n * Apply `env(safe-area-inset-*)` padding so content avoids iOS notch /\n * Android navbar / device chrome. Wrap the outermost container of pages\n * with sticky headers/footers.\n *\n * @example\n * <SafeArea edges={[\"top\"]}>\n *     <Navbar />\n * </SafeArea>\n */\nexport function SafeArea({\n    edges = ALL_EDGES,\n    inline = false,\n    className,\n    children,\n    ...props\n}: SafeAreaProps) {\n    return (\n        <div\n            className={cn(\n                styles.safe,\n                inline && styles.inline,\n                edges.includes(\"top\") && styles.top,\n                edges.includes(\"right\") && styles.right,\n                edges.includes(\"bottom\") && styles.bottom,\n                edges.includes(\"left\") && styles.left,\n                className,\n            )}\n            data-edges={edges.join(\" \")}\n            {...props}\n        >\n            {children}\n        </div>\n    );\n}\n"],"mappings":"4GAcA,IAAM,EAA4B,CAAC,MAAO,QAAS,SAAU,MAAM,EAYnE,SAAgB,EAAS,CACrB,QAAQ,EACR,SAAS,GACT,YACA,WACA,GAAG,GACW,CACd,OACI,EAAA,EAAA,IAAA,CAAC,MAAD,CACI,UAAW,EAAA,GACP,EAAA,QAAO,KACP,GAAU,EAAA,QAAO,OACjB,EAAM,SAAS,KAAK,GAAK,EAAA,QAAO,IAChC,EAAM,SAAS,OAAO,GAAK,EAAA,QAAO,MAClC,EAAM,SAAS,QAAQ,GAAK,EAAA,QAAO,OACnC,EAAM,SAAS,MAAM,GAAK,EAAA,QAAO,KACjC,CACJ,EACA,aAAY,EAAM,KAAK,GAAG,EAC1B,GAAI,EAEH,UACA,CAAA,CAEb"}

package/dist/components/SafeArea/SafeArea.js

@@ -1,33 +1,22 @@
-import { jsx as e } from "react/jsx-runtime";
-import { cn as f } from "../../utils/cn.js";
-import t from "./SafeArea.module.css.js";
-const m = ["top", "right", "bottom", "left"];
-function p({
-  edges: o = m,
-  inline: i = !1,
-  className: r,
-  children: n,
-  ...l
-}) {
-  return /* @__PURE__ */ e(
-    "div",
-    {
-      className: f(
-        t.safe,
-        i && t.inline,
-        o.includes("top") && t.top,
-        o.includes("right") && t.right,
-        o.includes("bottom") && t.bottom,
-        o.includes("left") && t.left,
-        r
-      ),
-      "data-edges": o.join(" "),
-      ...l,
-      children: n
-    }
-  );
+import { cn as e } from "../../utils/cn.js";
+import t from "./SafeArea.module.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/SafeArea/SafeArea.tsx
+var r = [
+	"top",
+	"right",
+	"bottom",
+	"left"
+];
+function i({ edges: i = r, inline: a = !1, className: o, children: s, ...c }) {
+	return /* @__PURE__ */ n("div", {
+		className: e(t.safe, a && t.inline, i.includes("top") && t.top, i.includes("right") && t.right, i.includes("bottom") && t.bottom, i.includes("left") && t.left, o),
+		"data-edges": i.join(" "),
+		...c,
+		children: s
+	});
 }
-export {
-  p as SafeArea
-};
-//# sourceMappingURL=SafeArea.js.map
+//#endregion
+export { i as SafeArea };
+
+//# sourceMappingURL=SafeArea.js.map

package/dist/components/SafeArea/SafeArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"SafeArea.js","sources":["../../../src/components/SafeArea/SafeArea.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./SafeArea.module.css\";\n\nexport type SafeAreaEdge = \"top\" | \"right\" | \"bottom\" | \"left\";\n\nexport interface SafeAreaProps extends HTMLAttributes<HTMLDivElement> {\n    /** Edges to pad. Default `[\"top\",\"right\",\"bottom\",\"left\"]` (all). */\n    edges?: SafeAreaEdge[];\n    /** Render as inline (use `display: contents`). */\n    inline?: boolean;\n    children?: ReactNode;\n}\n\nconst ALL_EDGES: SafeAreaEdge[] = [\"top\", \"right\", \"bottom\", \"left\"];\n\n/**\n * Apply `env(safe-area-inset-*)` padding so content avoids iOS notch /\n * Android navbar / device chrome. Wrap the outermost container of pages\n * with sticky headers/footers.\n *\n * @example\n * <SafeArea edges={[\"top\"]}>\n *     <Navbar />\n * </SafeArea>\n */\nexport function SafeArea({\n    edges = ALL_EDGES,\n    inline = false,\n    className,\n    children,\n    ...props\n}: SafeAreaProps) {\n    return (\n        <div\n            className={cn(\n                styles.safe,\n                inline && styles.inline,\n                edges.includes(\"top\") && styles.top,\n                edges.includes(\"right\") && styles.right,\n                edges.includes(\"bottom\") && styles.bottom,\n                edges.includes(\"left\") && styles.left,\n                className,\n            )}\n            data-edges={edges.join(\" \")}\n            {...props}\n        >\n            {children}\n        </div>\n    );\n}\n"],"names":["ALL_EDGES","SafeArea","edges","inline","className","children","props","jsx","cn","styles"],"mappings":";;;AAcA,MAAMA,IAA4B,CAAC,OAAO,SAAS,UAAU,MAAM;AAY5D,SAASC,EAAS;AAAA,EACrB,OAAAC,IAAQF;AAAA,EACR,QAAAG,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACP,GAAkB;AACd,SACI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC;AAAA,QACPC,EAAO;AAAA,QACPN,KAAUM,EAAO;AAAA,QACjBP,EAAM,SAAS,KAAK,KAAKO,EAAO;AAAA,QAChCP,EAAM,SAAS,OAAO,KAAKO,EAAO;AAAA,QAClCP,EAAM,SAAS,QAAQ,KAAKO,EAAO;AAAA,QACnCP,EAAM,SAAS,MAAM,KAAKO,EAAO;AAAA,QACjCL;AAAA,MAAA;AAAA,MAEJ,cAAYF,EAAM,KAAK,GAAG;AAAA,MACzB,GAAGI;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGb;"}
+{"version":3,"file":"SafeArea.js","names":[],"sources":["../../../src/components/SafeArea/SafeArea.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./SafeArea.module.css\";\n\nexport type SafeAreaEdge = \"top\" | \"right\" | \"bottom\" | \"left\";\n\nexport interface SafeAreaProps extends HTMLAttributes<HTMLDivElement> {\n    /** Edges to pad. Default `[\"top\",\"right\",\"bottom\",\"left\"]` (all). */\n    edges?: SafeAreaEdge[];\n    /** Render as inline (use `display: contents`). */\n    inline?: boolean;\n    children?: ReactNode;\n}\n\nconst ALL_EDGES: SafeAreaEdge[] = [\"top\", \"right\", \"bottom\", \"left\"];\n\n/**\n * Apply `env(safe-area-inset-*)` padding so content avoids iOS notch /\n * Android navbar / device chrome. Wrap the outermost container of pages\n * with sticky headers/footers.\n *\n * @example\n * <SafeArea edges={[\"top\"]}>\n *     <Navbar />\n * </SafeArea>\n */\nexport function SafeArea({\n    edges = ALL_EDGES,\n    inline = false,\n    className,\n    children,\n    ...props\n}: SafeAreaProps) {\n    return (\n        <div\n            className={cn(\n                styles.safe,\n                inline && styles.inline,\n                edges.includes(\"top\") && styles.top,\n                edges.includes(\"right\") && styles.right,\n                edges.includes(\"bottom\") && styles.bottom,\n                edges.includes(\"left\") && styles.left,\n                className,\n            )}\n            data-edges={edges.join(\" \")}\n            {...props}\n        >\n            {children}\n        </div>\n    );\n}\n"],"mappings":";;;;AAcA,IAAM,IAA4B;CAAC;CAAO;CAAS;CAAU;AAAM;AAYnE,SAAgB,EAAS,EACrB,WAAQ,GACR,YAAS,IACT,cACA,aACA,GAAG,KACW;CACd,OACI,kBAAC,OAAD;EACI,WAAW,EACP,EAAO,MACP,KAAU,EAAO,QACjB,EAAM,SAAS,KAAK,KAAK,EAAO,KAChC,EAAM,SAAS,OAAO,KAAK,EAAO,OAClC,EAAM,SAAS,QAAQ,KAAK,EAAO,QACnC,EAAM,SAAS,MAAM,KAAK,EAAO,MACjC,CACJ;EACA,cAAY,EAAM,KAAK,GAAG;EAC1B,GAAI;EAEH;CACA,CAAA;AAEb"}

package/dist/components/SafeArea/SafeArea.module.cjs

@@ -0,0 +1,2 @@
+var e=`tempest_safe_iqDFY`,t=`tempest_inline_V9eMG`,n=`tempest_top_Xse9E`,r=`tempest_right_GZm9b`,i=`tempest_bottom_kkyD7`,a=`tempest_left_Z4Q72`,o={safe:e,inline:t,top:n,right:r,bottom:i,left:a};exports.bottom=i,exports.default=o,exports.inline=t,exports.left=a,exports.right=r,exports.safe=e,exports.top=n;
+//# sourceMappingURL=SafeArea.module.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SafeArea.module.cjs","names":[],"sources":["../../../src/components/SafeArea/SafeArea.module.css"],"sourcesContent":[".safe {\n    display: block;\n}\n\n.safe.inline {\n    display: contents;\n}\n\n.top {\n    padding-top: env(safe-area-inset-top, 0px);\n}\n\n.right {\n    padding-right: env(safe-area-inset-right, 0px);\n}\n\n.bottom {\n    padding-bottom: env(safe-area-inset-bottom, 0px);\n}\n\n.left {\n    padding-left: env(safe-area-inset-left, 0px);\n}\n"],"mappings":""}

package/dist/components/SafeArea/SafeArea.module.js

@@ -0,0 +1,13 @@
+//#region src/components/SafeArea/SafeArea.module.css
+var e = "tempest_safe_iqDFY", t = "tempest_inline_V9eMG", n = "tempest_top_Xse9E", r = "tempest_right_GZm9b", i = "tempest_bottom_kkyD7", a = "tempest_left_Z4Q72", o = {
+	safe: e,
+	inline: t,
+	top: n,
+	right: r,
+	bottom: i,
+	left: a
+};
+//#endregion
+export { i as bottom, o as default, t as inline, a as left, r as right, e as safe, n as top };
+
+//# sourceMappingURL=SafeArea.module.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SafeArea.module.js","names":[],"sources":["../../../src/components/SafeArea/SafeArea.module.css"],"sourcesContent":[".safe {\n    display: block;\n}\n\n.safe.inline {\n    display: contents;\n}\n\n.top {\n    padding-top: env(safe-area-inset-top, 0px);\n}\n\n.right {\n    padding-right: env(safe-area-inset-right, 0px);\n}\n\n.bottom {\n    padding-bottom: env(safe-area-inset-bottom, 0px);\n}\n\n.left {\n    padding-left: env(safe-area-inset-left, 0px);\n}\n"],"mappings":""}

package/dist/components/ScrollArea/ScrollArea.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),i=require("react"),s=require("../../utils/cn.cjs"),d=require("./ScrollArea.module.css.cjs"),f=i.forwardRef(function({maxHeight:e,orientation:r="vertical",className:o,style:t,children:l,...c},n){const a={overflowX:r==="vertical"?"hidden":"auto",overflowY:r==="horizontal"?"hidden":"auto",...e!==void 0?{maxHeight:e}:{},...t};return u.jsx("div",{ref:n,className:s.cn(d.default.root,o),style:a,...c,children:l})});exports.ScrollArea=f;
-//# sourceMappingURL=ScrollArea.cjs.map
+const e=require("../../utils/cn.cjs"),t=require("./ScrollArea.module.cjs");let n=require("react"),r=require("react/jsx-runtime");var i=(0,n.forwardRef)(function({maxHeight:n,orientation:i=`vertical`,className:a,style:o,children:s,...c},l){let u={overflowX:i===`vertical`?`hidden`:`auto`,overflowY:i===`horizontal`?`hidden`:`auto`,...n===void 0?{}:{maxHeight:n},...o};return(0,r.jsx)(`div`,{ref:l,className:e.cn(t.default.root,a),style:u,...c,children:s})});exports.ScrollArea=i;
+//# sourceMappingURL=ScrollArea.cjs.map

package/dist/components/ScrollArea/ScrollArea.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollArea.cjs","sources":["../../../src/components/ScrollArea/ScrollArea.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { CSSProperties, HTMLAttributes } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ScrollArea.module.css\";\n\nexport type ScrollAreaOrientation = \"vertical\" | \"horizontal\" | \"both\";\n\nexport interface ScrollAreaProps extends HTMLAttributes<HTMLDivElement> {\n    /** Caps the container height; numbers are treated as pixels. */\n    maxHeight?: number | string;\n    /** Which axis scrolls. Default `\"vertical\"`. */\n    orientation?: ScrollAreaOrientation;\n}\n\n/**\n * A styled scroll container that overflows on the chosen axis and renders a\n * thin custom scrollbar (WebKit) while staying fully functional in browsers\n * without scrollbar styling. Forwards `className`, `style` and the ref to the\n * underlying `<div>`.\n */\nexport const ScrollArea = forwardRef<HTMLDivElement, ScrollAreaProps>(function ScrollArea(\n    { maxHeight, orientation = \"vertical\", className, style, children, ...props },\n    ref,\n) {\n    const mergedStyle: CSSProperties = {\n        overflowX: orientation === \"vertical\" ? \"hidden\" : \"auto\",\n        overflowY: orientation === \"horizontal\" ? \"hidden\" : \"auto\",\n        ...(maxHeight !== undefined ? { maxHeight } : {}),\n        ...style,\n    };\n\n    return (\n        <div ref={ref} className={cn(styles.root, className)} style={mergedStyle} {...props}>\n            {children}\n        </div>\n    );\n});\n"],"names":["ScrollArea","forwardRef","maxHeight","orientation","className","style","children","props","ref","mergedStyle","jsx","cn","styles"],"mappings":"iNAoBaA,EAAaC,EAAAA,WAA4C,SAClE,CAAE,UAAAC,EAAW,YAAAC,EAAc,WAAY,UAAAC,EAAW,MAAAC,EAAO,SAAAC,EAAU,GAAGC,CAAA,EACtEC,EACF,CACE,MAAMC,EAA6B,CAC/B,UAAWN,IAAgB,WAAa,SAAW,OACnD,UAAWA,IAAgB,aAAe,SAAW,OACrD,GAAID,IAAc,OAAY,CAAE,UAAAA,CAAA,EAAc,CAAA,EAC9C,GAAGG,CAAA,EAGP,OACIK,EAAAA,IAAC,MAAA,CAAI,IAAAF,EAAU,UAAWG,EAAAA,GAAGC,EAAAA,QAAO,KAAMR,CAAS,EAAG,MAAOK,EAAc,GAAGF,EACzE,SAAAD,CAAA,CACL,CAER,CAAC"}
+{"version":3,"file":"ScrollArea.cjs","names":[],"sources":["../../../src/components/ScrollArea/ScrollArea.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { CSSProperties, HTMLAttributes } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ScrollArea.module.css\";\n\nexport type ScrollAreaOrientation = \"vertical\" | \"horizontal\" | \"both\";\n\nexport interface ScrollAreaProps extends HTMLAttributes<HTMLDivElement> {\n    /** Caps the container height; numbers are treated as pixels. */\n    maxHeight?: number | string;\n    /** Which axis scrolls. Default `\"vertical\"`. */\n    orientation?: ScrollAreaOrientation;\n}\n\n/**\n * A styled scroll container that overflows on the chosen axis and renders a\n * thin custom scrollbar (WebKit) while staying fully functional in browsers\n * without scrollbar styling. Forwards `className`, `style` and the ref to the\n * underlying `<div>`.\n */\nexport const ScrollArea = forwardRef<HTMLDivElement, ScrollAreaProps>(function ScrollArea(\n    { maxHeight, orientation = \"vertical\", className, style, children, ...props },\n    ref,\n) {\n    const mergedStyle: CSSProperties = {\n        overflowX: orientation === \"vertical\" ? \"hidden\" : \"auto\",\n        overflowY: orientation === \"horizontal\" ? \"hidden\" : \"auto\",\n        ...(maxHeight !== undefined ? { maxHeight } : {}),\n        ...style,\n    };\n\n    return (\n        <div ref={ref} className={cn(styles.root, className)} style={mergedStyle} {...props}>\n            {children}\n        </div>\n    );\n});\n"],"mappings":"iIAoBA,IAAa,GAAA,EAAA,EAAA,WAAA,CAAyD,SAClE,CAAE,YAAW,cAAc,WAAY,YAAW,QAAO,WAAU,GAAG,GACtE,EACF,CACE,IAAM,EAA6B,CAC/B,UAAW,IAAgB,WAAa,SAAW,OACnD,UAAW,IAAgB,aAAe,SAAW,OACrD,GAAI,IAAc,IAAA,GAA4B,CAAC,EAAjB,CAAE,WAAU,EAC1C,GAAG,CACP,EAEA,OACI,EAAA,EAAA,IAAA,CAAC,MAAD,CAAU,MAAK,UAAW,EAAA,GAAG,EAAA,QAAO,KAAM,CAAS,EAAG,MAAO,EAAa,GAAI,EACzE,UACA,CAAA,CAEb,CAAC"}

package/dist/components/ScrollArea/ScrollArea.js

@@ -1,17 +1,24 @@
-import { jsx as m } from "react/jsx-runtime";
-import { forwardRef as a } from "react";
-import { cn as d } from "../../utils/cn.js";
-import s from "./ScrollArea.module.css.js";
-const y = a(function({ maxHeight: o, orientation: r = "vertical", className: e, style: t, children: l, ...c }, f) {
-  const i = {
-    overflowX: r === "vertical" ? "hidden" : "auto",
-    overflowY: r === "horizontal" ? "hidden" : "auto",
-    ...o !== void 0 ? { maxHeight: o } : {},
-    ...t
-  };
-  return /* @__PURE__ */ m("div", { ref: f, className: d(s.root, e), style: i, ...c, children: l });
+import { cn as e } from "../../utils/cn.js";
+import t from "./ScrollArea.module.js";
+import { forwardRef as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/ScrollArea/ScrollArea.tsx
+var i = n(function({ maxHeight: n, orientation: i = "vertical", className: a, style: o, children: s, ...c }, l) {
+	let u = {
+		overflowX: i === "vertical" ? "hidden" : "auto",
+		overflowY: i === "horizontal" ? "hidden" : "auto",
+		...n === void 0 ? {} : { maxHeight: n },
+		...o
+	};
+	return /* @__PURE__ */ r("div", {
+		ref: l,
+		className: e(t.root, a),
+		style: u,
+		...c,
+		children: s
+	});
 });
-export {
-  y as ScrollArea
-};
-//# sourceMappingURL=ScrollArea.js.map
+//#endregion
+export { i as ScrollArea };
+
+//# sourceMappingURL=ScrollArea.js.map