@stackframe/dashboard-ui-components 2.8.89 → 2.8.92

package/dist/components/data-grid/use-url-state.d.ts

@@ -0,0 +1,38 @@
+import { DataGridColumnDef, DataGridState } from "./types.js";
+
+//#region src/components/data-grid/use-url-state.d.ts
+type UrlStateOptions = {
+  /** Disambiguates URL params when multiple grids share a page. Defaults
+   * to `"grid"`. Use unique prefixes per-grid (e.g. `"users"`, `"teams"`). */
+  paramPrefix?: string;
+  /** Overrides for default state used when the URL has no value for a
+   * given key. Useful for things like a sensible initial sort (e.g.
+   * "newest signups first") that should appear on first load but be
+   * overridden when the user navigates to a bookmarked URL. */
+  initial?: Partial<Pick<DataGridState, "sorting" | "quickSearch" | "columnVisibility">>;
+};
+/**
+ * Drop-in replacement for `useState(() => createDefaultDataGridState(columns))`
+ * that persists user view preferences to URL search params, so a view
+ * can be bookmarked / shared / restored on reload.
+ *
+ * **Persisted:** column widths, hidden columns, sort model, quick-search.
+ * **Not persisted** (deliberately): pagination scroll position, selection,
+ * column pinning/order, date display mode — these are session-scoped.
+ *
+ * ```tsx
+ * const [gridState, setGridState] = useDataGridUrlState(columns, {
+ *   paramPrefix: "users",
+ *   initial: { sorting: [{ columnId: "signedUpAt", direction: "desc" }] },
+ * });
+ * ```
+ *
+ * URL encoding: `?{prefix}_w=...&{prefix}_h=...&{prefix}_s=...&{prefix}_q=...`.
+ * Default values are omitted so URLs stay clean. Updates use
+ * `history.replaceState` (not pushState) so back/forward isn't polluted,
+ * and `popstate` is observed so external URL changes flow back into state.
+ */
+declare function useDataGridUrlState<TRow>(columns: readonly DataGridColumnDef<TRow>[], opts?: UrlStateOptions): [DataGridState, React.Dispatch<React.SetStateAction<DataGridState>>];
+//#endregion
+export { useDataGridUrlState };
+//# sourceMappingURL=use-url-state.d.ts.map

package/dist/components/data-grid/use-url-state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-url-state.d.ts","names":[],"sources":["../../../src/components/data-grid/use-url-state.ts"],"mappings":";;;KAqJK,eAAA;;AA3IY;EA8If,WAAA;;;;;EAKA,OAAA,GAAU,OAAA,CAAQ,IAAA,CAAK,aAAA;AAAA;;;;;;;;AAwBzB;;;;;;;;;;;;;;iBAAgB,mBAAA,MAAA,CACd,OAAA,WAAkB,iBAAA,CAAkB,IAAA,KACpC,IAAA,GAAO,eAAA,IACL,aAAA,EAAe,KAAA,CAAM,QAAA,CAAS,KAAA,CAAM,cAAA,CAAe,aAAA"}

package/dist/components/data-grid/use-url-state.js

@@ -0,0 +1,214 @@
+"use client";
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_chunk = require('../../chunk-BE-pF4vm.js');
+let react = require("react");
+let __state_js = require("./state.js");
+let __data_grid_sizing_js = require("./data-grid-sizing.js");
+
+//#region src/components/data-grid/use-url-state.ts
+function serializeWidths(widths, columns) {
+	const parts = [];
+	for (const col of columns) {
+		const w = widths[col.id];
+		if (typeof w !== "number" || !Number.isFinite(w)) continue;
+		const defaultW = (0, __data_grid_sizing_js.clampColumnWidth)(col, col.width ?? __data_grid_sizing_js.DEFAULT_COL_WIDTH);
+		if (Math.round(w) === Math.round(defaultW)) continue;
+		parts.push(`${encodeURIComponent(col.id)}:${Math.round(w)}`);
+	}
+	return parts.join(",");
+}
+function parseWidths(raw, fallback, columns) {
+	if (!raw) return fallback;
+	const colMap = new Map(columns.map((c) => [c.id, c]));
+	const out = { ...fallback };
+	for (const part of raw.split(",")) {
+		const colonIdx = part.indexOf(":");
+		if (colonIdx <= 0) continue;
+		const encodedId = part.slice(0, colonIdx);
+		const num = part.slice(colonIdx + 1);
+		let id;
+		try {
+			id = decodeURIComponent(encodedId);
+		} catch {
+			continue;
+		}
+		if (!id || !num) continue;
+		const col = colMap.get(id);
+		if (!col) continue;
+		const n = Number(num);
+		if (!Number.isFinite(n)) continue;
+		out[id] = (0, __data_grid_sizing_js.clampColumnWidth)(col, n);
+	}
+	return out;
+}
+function serializeHidden(visibility) {
+	return Object.entries(visibility).filter(([, v]) => v === false).map(([id]) => encodeURIComponent(id)).join(",");
+}
+function parseHidden(raw, columns) {
+	if (!raw) return {};
+	const known = new Set(columns.map((c) => c.id));
+	const out = {};
+	for (const encodedId of raw.split(",")) {
+		let id;
+		try {
+			id = decodeURIComponent(encodedId);
+		} catch {
+			continue;
+		}
+		if (id && known.has(id)) out[id] = false;
+	}
+	return out;
+}
+function serializeSort(sort) {
+	return sort.map((s) => `${encodeURIComponent(s.columnId)}:${s.direction === "desc" ? "desc" : "asc"}`).join(",");
+}
+function sortEqual(a, b) {
+	if (a.length !== b.length) return false;
+	for (let i = 0; i < a.length; i++) if (a[i].columnId !== b[i].columnId || a[i].direction !== b[i].direction) return false;
+	return true;
+}
+function parseSort(raw, fallback, columns) {
+	if (raw == null) return fallback;
+	if (raw === "") return [];
+	const known = new Set(columns.map((c) => c.id));
+	const out = [];
+	for (const part of raw.split(",")) {
+		const colonIdx = part.indexOf(":");
+		if (colonIdx <= 0) continue;
+		const encodedId = part.slice(0, colonIdx);
+		const dir = part.slice(colonIdx + 1);
+		if (dir !== "asc" && dir !== "desc") continue;
+		let id;
+		try {
+			id = decodeURIComponent(encodedId);
+		} catch {
+			continue;
+		}
+		if (!id || !known.has(id)) continue;
+		out.push({
+			columnId: id,
+			direction: dir
+		});
+	}
+	return out;
+}
+function parseQuickSearch(raw, fallback) {
+	if (raw == null) return fallback;
+	return raw;
+}
+/**
+* Drop-in replacement for `useState(() => createDefaultDataGridState(columns))`
+* that persists user view preferences to URL search params, so a view
+* can be bookmarked / shared / restored on reload.
+*
+* **Persisted:** column widths, hidden columns, sort model, quick-search.
+* **Not persisted** (deliberately): pagination scroll position, selection,
+* column pinning/order, date display mode — these are session-scoped.
+*
+* ```tsx
+* const [gridState, setGridState] = useDataGridUrlState(columns, {
+*   paramPrefix: "users",
+*   initial: { sorting: [{ columnId: "signedUpAt", direction: "desc" }] },
+* });
+* ```
+*
+* URL encoding: `?{prefix}_w=...&{prefix}_h=...&{prefix}_s=...&{prefix}_q=...`.
+* Default values are omitted so URLs stay clean. Updates use
+* `history.replaceState` (not pushState) so back/forward isn't polluted,
+* and `popstate` is observed so external URL changes flow back into state.
+*/
+function useDataGridUrlState(columns, opts) {
+	const prefix = opts?.paramPrefix ?? "grid";
+	const widthsKey = `${prefix}_w`;
+	const hiddenKey = `${prefix}_h`;
+	const sortKey = `${prefix}_s`;
+	const searchKey = `${prefix}_q`;
+	const columnsRef = (0, react.useRef)(columns);
+	columnsRef.current = columns;
+	const initialRef = (0, react.useRef)(opts?.initial);
+	const [state, setState] = (0, react.useState)(() => {
+		const base = (0, __state_js.createDefaultDataGridState)(columns);
+		const initial = initialRef.current ?? {};
+		const baseWithInitial = {
+			...base,
+			sorting: initial.sorting ?? base.sorting,
+			quickSearch: initial.quickSearch ?? base.quickSearch,
+			columnVisibility: initial.columnVisibility ?? base.columnVisibility
+		};
+		if (typeof window === "undefined") return baseWithInitial;
+		const params = new URLSearchParams(window.location.search);
+		return {
+			...baseWithInitial,
+			columnWidths: parseWidths(params.get(widthsKey), base.columnWidths, columns),
+			columnVisibility: params.get(hiddenKey) != null ? parseHidden(params.get(hiddenKey), columns) : baseWithInitial.columnVisibility,
+			sorting: parseSort(params.get(sortKey), baseWithInitial.sorting, columns),
+			quickSearch: parseQuickSearch(params.get(searchKey), baseWithInitial.quickSearch)
+		};
+	});
+	(0, react.useEffect)(() => {
+		if (typeof window === "undefined") return;
+		const timer = setTimeout(() => {
+			const params = new URLSearchParams(window.location.search);
+			const before = params.toString();
+			const cols = columnsRef.current;
+			const initial = initialRef.current ?? {};
+			const widthsStr = serializeWidths(state.columnWidths, cols);
+			if (widthsStr) params.set(widthsKey, widthsStr);
+			else params.delete(widthsKey);
+			const hiddenStr = serializeHidden(state.columnVisibility);
+			const initialHidden = initial.columnVisibility ? serializeHidden(initial.columnVisibility) : "";
+			if (hiddenStr) params.set(hiddenKey, hiddenStr);
+			else if (initialHidden) params.set(hiddenKey, "");
+			else params.delete(hiddenKey);
+			const initialSort = initial.sorting ?? [];
+			if (sortEqual(state.sorting, initialSort)) params.delete(sortKey);
+			else params.set(sortKey, serializeSort(state.sorting));
+			const initialSearch = initial.quickSearch ?? "";
+			if (state.quickSearch === initialSearch) params.delete(searchKey);
+			else params.set(searchKey, state.quickSearch);
+			const after = params.toString();
+			if (before === after) return;
+			const url = `${window.location.pathname}${after ? `?${after}` : ""}${window.location.hash}`;
+			window.history.replaceState(window.history.state, "", url);
+		}, 100);
+		return () => clearTimeout(timer);
+	}, [
+		state.columnWidths,
+		state.columnVisibility,
+		state.sorting,
+		state.quickSearch,
+		widthsKey,
+		hiddenKey,
+		sortKey,
+		searchKey
+	]);
+	(0, react.useEffect)(() => {
+		if (typeof window === "undefined") return;
+		const onPop = () => {
+			const params = new URLSearchParams(window.location.search);
+			const cols = columnsRef.current;
+			const initial = initialRef.current ?? {};
+			const defaults = (0, __state_js.createDefaultDataGridState)(cols);
+			setState((prev) => ({
+				...prev,
+				columnWidths: parseWidths(params.get(widthsKey), defaults.columnWidths, cols),
+				columnVisibility: params.get(hiddenKey) != null ? parseHidden(params.get(hiddenKey), cols) : initial.columnVisibility ?? defaults.columnVisibility,
+				sorting: parseSort(params.get(sortKey), initial.sorting ?? defaults.sorting, cols),
+				quickSearch: parseQuickSearch(params.get(searchKey), initial.quickSearch ?? defaults.quickSearch)
+			}));
+		};
+		window.addEventListener("popstate", onPop);
+		return () => window.removeEventListener("popstate", onPop);
+	}, [
+		widthsKey,
+		hiddenKey,
+		sortKey,
+		searchKey
+	]);
+	return [state, setState];
+}
+
+//#endregion
+exports.useDataGridUrlState = useDataGridUrlState;
+//# sourceMappingURL=use-url-state.js.map

package/dist/components/data-grid/use-url-state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-url-state.js","names":["DEFAULT_COL_WIDTH"],"sources":["../../../src/components/data-grid/use-url-state.ts"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\nimport { DEFAULT_COL_WIDTH, clampColumnWidth } from \"./data-grid-sizing\";\nimport { createDefaultDataGridState } from \"./state\";\nimport type {\n  DataGridColumnDef,\n  DataGridSortItem,\n  DataGridSortModel,\n  DataGridState,\n} from \"./types\";\n\n// ─── URL <-> state encoding ──────────────────────────────────────────\n// Compact, human-readable formats so URLs stay short. Each piece of\n// state gets its own param so unrelated changes don't churn shared keys:\n//\n//   ?{prefix}_w=name:200,email:300       column widths (only non-defaults)\n//   ?{prefix}_h=createdAt,role           hidden column ids\n//   ?{prefix}_s=signedUpAt:desc,name:asc multi-column sort\n//   ?{prefix}_q=alice                    quick-search text\n//\n// Column ids are URL-encoded so ids containing `,` `:` or other reserved\n// characters round-trip safely. Without encoding, an id like \"user:name\"\n// would silently break the parser.\n\n// ── widths ─────────────────────────────────────────────────────────\nfunction serializeWidths(\n  widths: Record<string, number>,\n  columns: readonly DataGridColumnDef<any>[],\n): string {\n  const parts: string[] = [];\n  for (const col of columns) {\n    const w = widths[col.id];\n    if (typeof w !== \"number\" || !Number.isFinite(w)) continue;\n    const defaultW = clampColumnWidth(col, col.width ?? DEFAULT_COL_WIDTH);\n    if (Math.round(w) === Math.round(defaultW)) continue;\n    parts.push(`${encodeURIComponent(col.id)}:${Math.round(w)}`);\n  }\n  return parts.join(\",\");\n}\n\nfunction parseWidths(\n  raw: string | null,\n  fallback: Record<string, number>,\n  columns: readonly DataGridColumnDef<any>[],\n): Record<string, number> {\n  if (!raw) return fallback;\n  const colMap = new Map(columns.map((c) => [c.id, c]));\n  const out: Record<string, number> = { ...fallback };\n  for (const part of raw.split(\",\")) {\n    // Only split on the FIRST colon — id-side is always pre-encoded so it\n    // can't contain a literal `:`, but width-side is always numeric.\n    const colonIdx = part.indexOf(\":\");\n    if (colonIdx <= 0) continue;\n    const encodedId = part.slice(0, colonIdx);\n    const num = part.slice(colonIdx + 1);\n    let id: string;\n    try {\n      id = decodeURIComponent(encodedId);\n    } catch {\n      continue;\n    }\n    if (!id || !num) continue;\n    const col = colMap.get(id);\n    if (!col) continue;\n    const n = Number(num);\n    if (!Number.isFinite(n)) continue;\n    out[id] = clampColumnWidth(col, n);\n  }\n  return out;\n}\n\n// ── hidden columns ─────────────────────────────────────────────────\nfunction serializeHidden(visibility: Record<string, boolean>): string {\n  return Object.entries(visibility)\n    .filter(([, v]) => v === false)\n    .map(([id]) => encodeURIComponent(id))\n    .join(\",\");\n}\n\nfunction parseHidden(\n  raw: string | null,\n  columns: readonly DataGridColumnDef<any>[],\n): Record<string, boolean> {\n  if (!raw) return {};\n  const known = new Set(columns.map((c) => c.id));\n  const out: Record<string, boolean> = {};\n  for (const encodedId of raw.split(\",\")) {\n    let id: string;\n    try {\n      id = decodeURIComponent(encodedId);\n    } catch {\n      continue;\n    }\n    if (id && known.has(id)) out[id] = false;\n  }\n  return out;\n}\n\n// ── sort model ─────────────────────────────────────────────────────\nfunction serializeSort(sort: DataGridSortModel): string {\n  return sort\n    .map((s) => `${encodeURIComponent(s.columnId)}:${s.direction === \"desc\" ? \"desc\" : \"asc\"}`)\n    .join(\",\");\n}\n\nfunction sortEqual(a: DataGridSortModel, b: DataGridSortModel): boolean {\n  if (a.length !== b.length) return false;\n  for (let i = 0; i < a.length; i++) {\n    if (a[i].columnId !== b[i].columnId || a[i].direction !== b[i].direction) return false;\n  }\n  return true;\n}\n\nfunction parseSort(\n  raw: string | null,\n  fallback: DataGridSortModel,\n  columns: readonly DataGridColumnDef<any>[],\n): DataGridSortModel {\n  if (raw == null) return fallback;\n  if (raw === \"\") return [];\n  const known = new Set(columns.map((c) => c.id));\n  const out: DataGridSortItem[] = [];\n  for (const part of raw.split(\",\")) {\n    const colonIdx = part.indexOf(\":\");\n    if (colonIdx <= 0) continue;\n    const encodedId = part.slice(0, colonIdx);\n    const dir = part.slice(colonIdx + 1);\n    if (dir !== \"asc\" && dir !== \"desc\") continue;\n    let id: string;\n    try {\n      id = decodeURIComponent(encodedId);\n    } catch {\n      continue;\n    }\n    if (!id || !known.has(id)) continue;\n    out.push({ columnId: id, direction: dir });\n  }\n  return out;\n}\n\n// ── quick search ───────────────────────────────────────────────────\nfunction parseQuickSearch(raw: string | null, fallback: string): string {\n  if (raw == null) return fallback;\n  return raw;\n}\n\n// ─── Hook ────────────────────────────────────────────────────────────\n\ntype UrlStateOptions = {\n  /** Disambiguates URL params when multiple grids share a page. Defaults\n   * to `\"grid\"`. Use unique prefixes per-grid (e.g. `\"users\"`, `\"teams\"`). */\n  paramPrefix?: string,\n  /** Overrides for default state used when the URL has no value for a\n   * given key. Useful for things like a sensible initial sort (e.g.\n   * \"newest signups first\") that should appear on first load but be\n   * overridden when the user navigates to a bookmarked URL. */\n  initial?: Partial<Pick<DataGridState, \"sorting\" | \"quickSearch\" | \"columnVisibility\">>,\n};\n\n/**\n * Drop-in replacement for `useState(() => createDefaultDataGridState(columns))`\n * that persists user view preferences to URL search params, so a view\n * can be bookmarked / shared / restored on reload.\n *\n * **Persisted:** column widths, hidden columns, sort model, quick-search.\n * **Not persisted** (deliberately): pagination scroll position, selection,\n * column pinning/order, date display mode — these are session-scoped.\n *\n * ```tsx\n * const [gridState, setGridState] = useDataGridUrlState(columns, {\n *   paramPrefix: \"users\",\n *   initial: { sorting: [{ columnId: \"signedUpAt\", direction: \"desc\" }] },\n * });\n * ```\n *\n * URL encoding: `?{prefix}_w=...&{prefix}_h=...&{prefix}_s=...&{prefix}_q=...`.\n * Default values are omitted so URLs stay clean. Updates use\n * `history.replaceState` (not pushState) so back/forward isn't polluted,\n * and `popstate` is observed so external URL changes flow back into state.\n */\nexport function useDataGridUrlState<TRow>(\n  columns: readonly DataGridColumnDef<TRow>[],\n  opts?: UrlStateOptions,\n): [DataGridState, React.Dispatch<React.SetStateAction<DataGridState>>] {\n  const prefix = opts?.paramPrefix ?? \"grid\";\n  const widthsKey = `${prefix}_w`;\n  const hiddenKey = `${prefix}_h`;\n  const sortKey = `${prefix}_s`;\n  const searchKey = `${prefix}_q`;\n\n  const columnsRef = useRef(columns);\n  columnsRef.current = columns;\n\n  // `initial` snapshots are captured once on first render. Re-running them\n  // each render would clobber the user's interactions.\n  const initialRef = useRef(opts?.initial);\n\n  const [state, setState] = useState<DataGridState>(() => {\n    const base = createDefaultDataGridState(columns);\n    const initial = initialRef.current ?? {};\n    const baseWithInitial: DataGridState = {\n      ...base,\n      sorting: initial.sorting ?? base.sorting,\n      quickSearch: initial.quickSearch ?? base.quickSearch,\n      columnVisibility: initial.columnVisibility ?? base.columnVisibility,\n    };\n    if (typeof window === \"undefined\") return baseWithInitial;\n    const params = new URLSearchParams(window.location.search);\n    return {\n      ...baseWithInitial,\n      columnWidths: parseWidths(params.get(widthsKey), base.columnWidths, columns),\n      columnVisibility: params.get(hiddenKey) != null\n        ? parseHidden(params.get(hiddenKey), columns)\n        : baseWithInitial.columnVisibility,\n      sorting: parseSort(params.get(sortKey), baseWithInitial.sorting, columns),\n      quickSearch: parseQuickSearch(params.get(searchKey), baseWithInitial.quickSearch),\n    };\n  });\n\n  // Sync state -> URL. Debounced so that high-frequency state changes\n  // (e.g. dragging a column resize handle, typing in the search box)\n  // don't fire a URL write per pixel / per keystroke.\n  useEffect(() => {\n    if (typeof window === \"undefined\") return;\n    const timer = setTimeout(() => {\n      const params = new URLSearchParams(window.location.search);\n      const before = params.toString();\n      const cols = columnsRef.current;\n      const initial = initialRef.current ?? {};\n\n      const widthsStr = serializeWidths(state.columnWidths, cols);\n      if (widthsStr) params.set(widthsKey, widthsStr);\n      else params.delete(widthsKey);\n\n      const hiddenStr = serializeHidden(state.columnVisibility);\n      // If the consumer supplied initial visibility, \"no hidden cols\" must\n      // be encoded explicitly (empty string) so a bookmark with no `_h=`\n      // doesn't silently re-hide a column the user just un-hid.\n      const initialHidden = initial.columnVisibility\n        ? serializeHidden(initial.columnVisibility)\n        : \"\";\n      if (hiddenStr) params.set(hiddenKey, hiddenStr);\n      else if (initialHidden) params.set(hiddenKey, \"\");\n      else params.delete(hiddenKey);\n\n      const initialSort = initial.sorting ?? [];\n      if (sortEqual(state.sorting, initialSort)) params.delete(sortKey);\n      else params.set(sortKey, serializeSort(state.sorting));\n\n      const initialSearch = initial.quickSearch ?? \"\";\n      if (state.quickSearch === initialSearch) params.delete(searchKey);\n      else params.set(searchKey, state.quickSearch);\n\n      const after = params.toString();\n      if (before === after) return;\n      const url = `${window.location.pathname}${after ? `?${after}` : \"\"}${window.location.hash}`;\n      window.history.replaceState(window.history.state, \"\", url);\n    }, 100);\n    return () => clearTimeout(timer);\n  }, [\n    state.columnWidths,\n    state.columnVisibility,\n    state.sorting,\n    state.quickSearch,\n    widthsKey,\n    hiddenKey,\n    sortKey,\n    searchKey,\n  ]);\n\n  // React to back/forward navigation.\n  useEffect(() => {\n    if (typeof window === \"undefined\") return;\n    const onPop = () => {\n      const params = new URLSearchParams(window.location.search);\n      const cols = columnsRef.current;\n      const initial = initialRef.current ?? {};\n      // When the URL no longer has a value for a key, reset to defaults\n      // rather than preserving the previous in-memory state — otherwise\n      // navigating back to a clean URL leaves stale state.\n      const defaults = createDefaultDataGridState(cols);\n      setState((prev) => ({\n        ...prev,\n        columnWidths: parseWidths(params.get(widthsKey), defaults.columnWidths, cols),\n        columnVisibility: params.get(hiddenKey) != null\n          ? parseHidden(params.get(hiddenKey), cols)\n          : (initial.columnVisibility ?? defaults.columnVisibility),\n        sorting: parseSort(params.get(sortKey), initial.sorting ?? defaults.sorting, cols),\n        quickSearch: parseQuickSearch(params.get(searchKey), initial.quickSearch ?? defaults.quickSearch),\n      }));\n    };\n    window.addEventListener(\"popstate\", onPop);\n    return () => window.removeEventListener(\"popstate\", onPop);\n  }, [widthsKey, hiddenKey, sortKey, searchKey]);\n\n  return [state, setState];\n}\n"],"mappings":"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"}

package/dist/components/data-grid/use-url-state.test.d.ts

@@ -0,0 +1 @@
+export { };

package/dist/components/data-grid/use-url-state.test.js

@@ -0,0 +1,91 @@
+const require_chunk = require('../../chunk-BE-pF4vm.js');
+let _testing_library_react = require("@testing-library/react");
+let vitest = require("vitest");
+let __use_url_state_js = require("./use-url-state.js");
+
+//#region src/components/data-grid/use-url-state.test.tsx
+// @vitest-environment jsdom
+const columns = [{
+	id: "name",
+	header: "Name",
+	accessor: () => "",
+	width: 160,
+	minWidth: 80,
+	type: "string"
+}, {
+	id: "email",
+	header: "Email",
+	accessor: () => "",
+	width: 200,
+	minWidth: 80,
+	type: "string"
+}];
+function setUrl(search) {
+	window.history.replaceState(null, "", `/${search ? `?${search}` : ""}`);
+}
+(0, vitest.beforeEach)(() => {
+	setUrl("");
+});
+(0, vitest.afterEach)(() => {
+	setUrl("");
+});
+(0, vitest.describe)("useDataGridUrlState", () => {
+	(0, vitest.it)("initializes from existing URL params", () => {
+		setUrl("grid_w=name:240&grid_h=email");
+		const { result } = (0, _testing_library_react.renderHook)(() => (0, __use_url_state_js.useDataGridUrlState)(columns));
+		const [state] = result.current;
+		(0, vitest.expect)(state.columnWidths.name).toBe(240);
+		(0, vitest.expect)(state.columnVisibility.email).toBe(false);
+	});
+	(0, vitest.it)("writes width changes back to the URL (after debounce)", async () => {
+		const { result } = (0, _testing_library_react.renderHook)(() => (0, __use_url_state_js.useDataGridUrlState)(columns));
+		(0, _testing_library_react.act)(() => {
+			const [, setState] = result.current;
+			setState((prev) => ({
+				...prev,
+				columnWidths: {
+					...prev.columnWidths,
+					name: 250
+				}
+			}));
+		});
+		await new Promise((resolve) => setTimeout(resolve, 150));
+		(0, vitest.expect)(new URLSearchParams(window.location.search).get("grid_w")).toBe("name:250");
+	});
+	(0, vitest.it)("resets column widths to defaults when a popstate clears the URL", () => {
+		setUrl("grid_w=name:300");
+		const { result } = (0, _testing_library_react.renderHook)(() => (0, __use_url_state_js.useDataGridUrlState)(columns));
+		(0, vitest.expect)(result.current[0].columnWidths.name).toBe(300);
+		(0, _testing_library_react.act)(() => {
+			setUrl("");
+			window.dispatchEvent(new PopStateEvent("popstate"));
+		});
+		(0, vitest.expect)(result.current[0].columnWidths.name).toBe(160);
+	});
+	(0, vitest.it)("isolates two grids on the same page via paramPrefix", async () => {
+		const { result: a } = (0, _testing_library_react.renderHook)(() => (0, __use_url_state_js.useDataGridUrlState)(columns, { paramPrefix: "users" }));
+		const { result: b } = (0, _testing_library_react.renderHook)(() => (0, __use_url_state_js.useDataGridUrlState)(columns, { paramPrefix: "teams" }));
+		(0, _testing_library_react.act)(() => {
+			a.current[1]((prev) => ({
+				...prev,
+				columnWidths: {
+					...prev.columnWidths,
+					name: 222
+				}
+			}));
+		});
+		await new Promise((resolve) => setTimeout(resolve, 150));
+		const params = new URLSearchParams(window.location.search);
+		(0, vitest.expect)(params.get("users_w")).toBe("name:222");
+		(0, vitest.expect)(params.get("teams_w")).toBeNull();
+		(0, vitest.expect)(b.current[0].columnWidths.name).toBe(160);
+	});
+	(0, vitest.it)("ignores malformed entries in the URL param without throwing", () => {
+		setUrl("grid_w=:,name:abc,name:240,bogusid:99");
+		const { result } = (0, _testing_library_react.renderHook)(() => (0, __use_url_state_js.useDataGridUrlState)(columns));
+		(0, vitest.expect)(result.current[0].columnWidths.name).toBe(240);
+	});
+});
+
+//#endregion
+//# sourceMappingURL=use-url-state.test.js.map

package/dist/components/data-grid/use-url-state.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-url-state.test.js","names":[],"sources":["../../../src/components/data-grid/use-url-state.test.tsx"],"sourcesContent":["// @vitest-environment jsdom\n\nimport { act, renderHook } from \"@testing-library/react\";\nimport { afterEach, beforeEach, describe, expect, it } from \"vitest\";\nimport type { DataGridColumnDef } from \"./types\";\nimport { useDataGridUrlState } from \"./use-url-state\";\n\ntype Row = { id: string };\n\nconst columns: DataGridColumnDef<Row>[] = [\n  { id: \"name\", header: \"Name\", accessor: () => \"\", width: 160, minWidth: 80, type: \"string\" },\n  { id: \"email\", header: \"Email\", accessor: () => \"\", width: 200, minWidth: 80, type: \"string\" },\n];\n\nfunction setUrl(search: string) {\n  window.history.replaceState(null, \"\", `/${search ? `?${search}` : \"\"}`);\n}\n\nbeforeEach(() => {\n  setUrl(\"\");\n});\n\nafterEach(() => {\n  setUrl(\"\");\n});\n\ndescribe(\"useDataGridUrlState\", () => {\n  it(\"initializes from existing URL params\", () => {\n    setUrl(\"grid_w=name:240&grid_h=email\");\n    const { result } = renderHook(() => useDataGridUrlState(columns));\n    const [state] = result.current;\n    expect(state.columnWidths.name).toBe(240);\n    expect(state.columnVisibility.email).toBe(false);\n  });\n\n  it(\"writes width changes back to the URL (after debounce)\", async () => {\n    const { result } = renderHook(() => useDataGridUrlState(columns));\n\n    act(() => {\n      const [, setState] = result.current;\n      setState((prev) => ({\n        ...prev,\n        columnWidths: { ...prev.columnWidths, name: 250 },\n      }));\n    });\n\n    // Debounce is 100ms.\n    await new Promise((resolve) => setTimeout(resolve, 150));\n    const params = new URLSearchParams(window.location.search);\n    expect(params.get(\"grid_w\")).toBe(\"name:250\");\n  });\n\n  it(\"resets column widths to defaults when a popstate clears the URL\", () => {\n    setUrl(\"grid_w=name:300\");\n    const { result } = renderHook(() => useDataGridUrlState(columns));\n    expect(result.current[0].columnWidths.name).toBe(300);\n\n    act(() => {\n      setUrl(\"\");\n      window.dispatchEvent(new PopStateEvent(\"popstate\"));\n    });\n\n    // Default for \"name\" column is its declared width of 160.\n    expect(result.current[0].columnWidths.name).toBe(160);\n  });\n\n  it(\"isolates two grids on the same page via paramPrefix\", async () => {\n    const { result: a } = renderHook(() => useDataGridUrlState(columns, { paramPrefix: \"users\" }));\n    const { result: b } = renderHook(() => useDataGridUrlState(columns, { paramPrefix: \"teams\" }));\n\n    act(() => {\n      a.current[1]((prev) => ({ ...prev, columnWidths: { ...prev.columnWidths, name: 222 } }));\n    });\n    await new Promise((resolve) => setTimeout(resolve, 150));\n\n    const params = new URLSearchParams(window.location.search);\n    expect(params.get(\"users_w\")).toBe(\"name:222\");\n    expect(params.get(\"teams_w\")).toBeNull();\n    expect(b.current[0].columnWidths.name).toBe(160); // unaffected\n  });\n\n  it(\"ignores malformed entries in the URL param without throwing\", () => {\n    setUrl(\"grid_w=:,name:abc,name:240,bogusid:99\");\n    const { result } = renderHook(() => useDataGridUrlState(columns));\n    // Only the well-formed `name:240` should land; junk is dropped silently.\n    expect(result.current[0].columnWidths.name).toBe(240);\n  });\n});\n"],"mappings":";;;;;;;AASA,MAAM,UAAoC,CACxC;CAAE,IAAI;CAAQ,QAAQ;CAAQ,gBAAgB;CAAI,OAAO;CAAK,UAAU;CAAI,MAAM;CAAU,EAC5F;CAAE,IAAI;CAAS,QAAQ;CAAS,gBAAgB;CAAI,OAAO;CAAK,UAAU;CAAI,MAAM;CAAU,CAC/F;AAED,SAAS,OAAO,QAAgB;AAC9B,QAAO,QAAQ,aAAa,MAAM,IAAI,IAAI,SAAS,IAAI,WAAW,KAAK;;6BAGxD;AACf,QAAO,GAAG;EACV;4BAEc;AACd,QAAO,GAAG;EACV;qBAEO,6BAA6B;AACpC,gBAAG,8CAA8C;AAC/C,SAAO,+BAA+B;EACtC,MAAM,EAAE,oGAAgD,QAAQ,CAAC;EACjE,MAAM,CAAC,SAAS,OAAO;AACvB,qBAAO,MAAM,aAAa,KAAK,CAAC,KAAK,IAAI;AACzC,qBAAO,MAAM,iBAAiB,MAAM,CAAC,KAAK,MAAM;GAChD;AAEF,gBAAG,yDAAyD,YAAY;EACtE,MAAM,EAAE,oGAAgD,QAAQ,CAAC;AAEjE,wCAAU;GACR,MAAM,GAAG,YAAY,OAAO;AAC5B,aAAU,UAAU;IAClB,GAAG;IACH,cAAc;KAAE,GAAG,KAAK;KAAc,MAAM;KAAK;IAClD,EAAE;IACH;AAGF,QAAM,IAAI,SAAS,YAAY,WAAW,SAAS,IAAI,CAAC;AAExD,qBADe,IAAI,gBAAgB,OAAO,SAAS,OAAO,CAC5C,IAAI,SAAS,CAAC,CAAC,KAAK,WAAW;GAC7C;AAEF,gBAAG,yEAAyE;AAC1E,SAAO,kBAAkB;EACzB,MAAM,EAAE,oGAAgD,QAAQ,CAAC;AACjE,qBAAO,OAAO,QAAQ,GAAG,aAAa,KAAK,CAAC,KAAK,IAAI;AAErD,wCAAU;AACR,UAAO,GAAG;AACV,UAAO,cAAc,IAAI,cAAc,WAAW,CAAC;IACnD;AAGF,qBAAO,OAAO,QAAQ,GAAG,aAAa,KAAK,CAAC,KAAK,IAAI;GACrD;AAEF,gBAAG,uDAAuD,YAAY;EACpE,MAAM,EAAE,QAAQ,+FAA2C,SAAS,EAAE,aAAa,SAAS,CAAC,CAAC;EAC9F,MAAM,EAAE,QAAQ,+FAA2C,SAAS,EAAE,aAAa,SAAS,CAAC,CAAC;AAE9F,wCAAU;AACR,KAAE,QAAQ,IAAI,UAAU;IAAE,GAAG;IAAM,cAAc;KAAE,GAAG,KAAK;KAAc,MAAM;KAAK;IAAE,EAAE;IACxF;AACF,QAAM,IAAI,SAAS,YAAY,WAAW,SAAS,IAAI,CAAC;EAExD,MAAM,SAAS,IAAI,gBAAgB,OAAO,SAAS,OAAO;AAC1D,qBAAO,OAAO,IAAI,UAAU,CAAC,CAAC,KAAK,WAAW;AAC9C,qBAAO,OAAO,IAAI,UAAU,CAAC,CAAC,UAAU;AACxC,qBAAO,EAAE,QAAQ,GAAG,aAAa,KAAK,CAAC,KAAK,IAAI;GAChD;AAEF,gBAAG,qEAAqE;AACtE,SAAO,wCAAwC;EAC/C,MAAM,EAAE,oGAAgD,QAAQ,CAAC;AAEjE,qBAAO,OAAO,QAAQ,GAAG,aAAa,KAAK,CAAC,KAAK,IAAI;GACrD;EACF"}

package/dist/components/dialog.d.ts

@@ -0,0 +1,67 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import React from "react";
+import { Dialog } from "@stackframe/stack-ui";
+import * as _radix_ui_react_dialog0 from "@radix-ui/react-dialog";
+
+//#region src/components/dialog.d.ts
+type DesignDialogSize = "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "full";
+type DesignDialogVariant = "glassmorphic" | "plain";
+type DesignDialogIcon = React.ElementType<{
+  className?: string;
+}>;
+type DesignDialogRootProps = Omit<React.ComponentProps<typeof Dialog>, "children">;
+type DesignDialogProps = {
+  trigger?: React.ReactElement;
+  size?: DesignDialogSize;
+  variant?: DesignDialogVariant;
+  icon?: DesignDialogIcon | null;
+  title?: React.ReactNode;
+  description?: React.ReactNode;
+  headerContent?: React.ReactNode;
+  customHeader?: React.ReactNode;
+  footer?: React.ReactNode;
+  noBodyPadding?: boolean;
+  hideTopCloseButton?: boolean;
+  className?: string;
+  overlayClassName?: string;
+  headerClassName?: string;
+  bodyClassName?: string;
+  footerClassName?: string;
+  children?: React.ReactNode;
+} & DesignDialogRootProps;
+/**
+ * Canonical dashboard modal surface. This wraps the base dialog primitives with
+ * a reusable glassmorphic shell and consistent header/body/footer regions.
+ */
+declare function DesignDialog({
+  trigger,
+  size,
+  variant,
+  icon: Icon,
+  title,
+  description,
+  headerContent,
+  customHeader,
+  footer,
+  noBodyPadding,
+  hideTopCloseButton,
+  className,
+  overlayClassName,
+  headerClassName,
+  bodyClassName,
+  footerClassName,
+  children,
+  ...dialogRootProps
+}: DesignDialogProps): react_jsx_runtime0.JSX.Element;
+declare const DesignDialogRoot: React.FC<_radix_ui_react_dialog0.DialogProps>;
+declare const DesignDialogTrigger: React.ForwardRefExoticComponent<_radix_ui_react_dialog0.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DesignDialogClose: React.ForwardRefExoticComponent<_radix_ui_react_dialog0.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DesignDialogTitle: React.FC<Omit<_radix_ui_react_dialog0.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & {
+  ref?: React.Ref<HTMLHeadingElement> | undefined;
+}>;
+declare const DesignDialogDescription: React.FC<Omit<_radix_ui_react_dialog0.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & {
+  ref?: React.Ref<HTMLParagraphElement> | undefined;
+}>;
+//#endregion
+export { DesignDialog, DesignDialogClose, DesignDialogDescription, DesignDialogProps, DesignDialogRoot, DesignDialogSize, DesignDialogTitle, DesignDialogTrigger, DesignDialogVariant };
+//# sourceMappingURL=dialog.d.ts.map

package/dist/components/dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.d.ts","names":[],"sources":["../../src/components/dialog.tsx"],"mappings":";;;;;;KAgBY,gBAAA;AAAA,KAaA,mBAAA;AAAA,KA0BP,gBAAA,GAAmB,KAAA,CAAM,WAAA;EAAc,SAAA;AAAA;AAAA,KAEvC,qBAAA,GAAwB,IAAA,CAAK,KAAA,CAAM,cAAA,QAAsB,MAAA;AAAA,KAElD,iBAAA;EACV,OAAA,GAAU,KAAA,CAAM,YAAA;EAChB,IAAA,GAAO,gBAAA;EACP,OAAA,GAAU,mBAAA;EACV,IAAA,GAAO,gBAAA;EACP,KAAA,GAAQ,KAAA,CAAM,SAAA;EACd,WAAA,GAAc,KAAA,CAAM,SAAA;EACpB,aAAA,GAAgB,KAAA,CAAM,SAAA;EACtB,YAAA,GAAe,KAAA,CAAM,SAAA;EACrB,MAAA,GAAS,KAAA,CAAM,SAAA;EACf,aAAA;EACA,kBAAA;EACA,SAAA;EACA,gBAAA;EACA,eAAA;EACA,aAAA;EACA,eAAA;EACA,QAAA,GAAW,KAAA,CAAM,SAAA;AAAA,IACf,qBAAA;;;;;iBAMY,YAAA,CAAA;EACd,OAAA;EACA,IAAA;EACA,OAAA;EACA,IAAA,EAAM,IAAA;EACN,KAAA;EACA,WAAA;EACA,aAAA;EACA,YAAA;EACA,MAAA;EACA,aAAA;EACA,kBAAA;EACA,SAAA;EACA,gBAAA;EACA,eAAA;EACA,aAAA;EACA,eAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,iBAAA,GAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAoGP,gBAAA,EAAgB,KAAA,CAAA,EAAA,CAAS,uBAAA,CAAT,WAAA;AAAA,cAChB,mBAAA,EAAmB,KAAA,CAAA,yBAAA,CAAgB,uBAAA,CAAhB,kBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,cACnB,iBAAA,EAAiB,KAAA,CAAA,yBAAA,CAAc,uBAAA,CAAd,gBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,cACjB,iBAAA,EAAiB,KAAA,CAAA,EAAA,CAAA,IAAA,CAAc,uBAAA,CAAd,gBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,kBAAA;;;cACjB,uBAAA,EAAuB,KAAA,CAAA,EAAA,CAAA,IAAA,CAAoB,uBAAA,CAApB,sBAAA,GAAA,KAAA,CAAA,aAAA,CAAA,oBAAA"}

package/dist/components/dialog.js

@@ -0,0 +1,100 @@
+"use client";
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_chunk = require('../chunk-BE-pF4vm.js');
+let _stackframe_stack_ui = require("@stackframe/stack-ui");
+let react_jsx_runtime = require("react/jsx-runtime");
+let react = require("react");
+react = require_chunk.__toESM(react);
+
+//#region src/components/dialog.tsx
+const dialogSizeClasses = new Map([
+	["sm", "max-w-sm"],
+	["md", "max-w-md"],
+	["lg", "max-w-lg"],
+	["xl", "max-w-xl"],
+	["2xl", "max-w-2xl"],
+	["3xl", "max-w-3xl"],
+	["4xl", "max-w-4xl"],
+	["5xl", "max-w-5xl"],
+	["6xl", "max-w-6xl"],
+	["7xl", "max-w-7xl"],
+	["full", "max-w-[calc(100vw-2rem)]"]
+]);
+const dialogSurfaceClasses = new Map([["glassmorphic", "border-0 sm:rounded-2xl bg-background/85 backdrop-blur-2xl ring-1 ring-foreground/[0.06] shadow-[0_24px_48px_-12px_rgba(0,0,0,0.25),0_4px_24px_-8px_rgba(0,0,0,0.12)] dark:bg-background/80 dark:ring-white/[0.06]"], ["plain", "border bg-background shadow-lg sm:rounded-lg"]]);
+const dialogOverlayClasses = new Map([["glassmorphic", "bg-black/50 backdrop-blur-sm"], ["plain", void 0]]);
+/**
+* Canonical dashboard modal surface. This wraps the base dialog primitives with
+* a reusable glassmorphic shell and consistent header/body/footer regions.
+*/
+function DesignDialog({ trigger, size = "lg", variant = "glassmorphic", icon: Icon = null, title, description, headerContent, customHeader, footer, noBodyPadding = false, hideTopCloseButton = false, className, overlayClassName, headerClassName, bodyClassName, footerClassName, children, ...dialogRootProps }) {
+	const resolvedSizeClass = dialogSizeClasses.get(size) ?? "max-w-lg";
+	const resolvedSurfaceClass = dialogSurfaceClasses.get(variant) ?? dialogSurfaceClasses.get("glassmorphic");
+	const resolvedOverlayClass = (0, _stackframe_stack_ui.cn)(dialogOverlayClasses.get(variant), overlayClassName);
+	const shouldRenderTopHeaderRow = Icon != null || title != null || description != null;
+	const shouldRenderHeader = customHeader != null || shouldRenderTopHeaderRow || headerContent != null;
+	const shouldRenderBody = react.default.Children.toArray(children).filter(Boolean).length > 0;
+	const needsAccessibleTitleFallback = !(title != null) && customHeader == null;
+	if (process.env.NODE_ENV !== "production" && needsAccessibleTitleFallback) console.warn("[DesignDialog] Rendered without a `title` or `customHeader`. Every dialog needs an accessible name — pass `title`, or render a `DialogTitle` inside `customHeader`.");
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_stackframe_stack_ui.Dialog, {
+		...dialogRootProps,
+		children: [trigger != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.DialogTrigger, {
+			asChild: true,
+			children: trigger
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_stackframe_stack_ui.DialogContent, {
+			className: (0, _stackframe_stack_ui.cn)("gap-0 p-0 overflow-hidden", resolvedSizeClass, resolvedSurfaceClass, className),
+			overlayProps: resolvedOverlayClass ? { className: resolvedOverlayClass } : void 0,
+			noCloseButton: hideTopCloseButton,
+			children: [
+				needsAccessibleTitleFallback && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.DialogTitle, {
+					className: "sr-only",
+					children: "Dialog"
+				}),
+				shouldRenderHeader && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.DialogHeader, {
+					className: (0, _stackframe_stack_ui.cn)("px-6 pt-6 pb-4 border-b border-foreground/[0.06]", headerClassName),
+					children: customHeader ?? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [shouldRenderTopHeaderRow && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: (0, _stackframe_stack_ui.cn)("flex items-start gap-3", Icon == null && "gap-0"),
+						children: [Icon != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "h-9 w-9 rounded-xl bg-primary/10 ring-1 ring-primary/15 flex items-center justify-center shrink-0",
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { className: "h-4 w-4 text-primary" })
+						}), (title != null || description != null) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "flex-1 min-w-0 space-y-1",
+							children: [title != null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.DialogTitle, {
+								className: "text-base",
+								children: title
+							}) : null, description != null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.DialogDescription, {
+								className: "text-xs",
+								children: description
+							}) : null]
+						})]
+					}), headerContent != null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: (0, _stackframe_stack_ui.cn)(shouldRenderTopHeaderRow && "mt-4"),
+						children: headerContent
+					}) : null] })
+				}),
+				shouldRenderBody && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.DialogBody, {
+					className: (0, _stackframe_stack_ui.cn)("mx-0 my-0 w-auto", noBodyPadding ? "px-0 py-0" : "px-6 py-4", bodyClassName),
+					children
+				}),
+				footer != null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.DialogFooter, {
+					className: (0, _stackframe_stack_ui.cn)("px-6 py-3 border-t border-foreground/[0.06] bg-foreground/[0.02]", footerClassName),
+					children: footer
+				}) : null
+			]
+		})]
+	});
+}
+const DesignDialogRoot = _stackframe_stack_ui.Dialog;
+const DesignDialogTrigger = _stackframe_stack_ui.DialogTrigger;
+const DesignDialogClose = _stackframe_stack_ui.DialogClose;
+const DesignDialogTitle = _stackframe_stack_ui.DialogTitle;
+const DesignDialogDescription = _stackframe_stack_ui.DialogDescription;
+
+//#endregion
+exports.DesignDialog = DesignDialog;
+exports.DesignDialogClose = DesignDialogClose;
+exports.DesignDialogDescription = DesignDialogDescription;
+exports.DesignDialogRoot = DesignDialogRoot;
+exports.DesignDialogTitle = DesignDialogTitle;
+exports.DesignDialogTrigger = DesignDialogTrigger;
+//# sourceMappingURL=dialog.js.map

package/dist/components/dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.js","names":["React","Dialog","DialogTrigger","DialogContent","DialogTitle","DialogHeader","DialogDescription","DialogBody","DialogFooter","DialogClose"],"sources":["../../src/components/dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  Dialog,\n  DialogBody,\n  DialogClose,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n  DialogTrigger,\n  cn,\n} from \"@stackframe/stack-ui\";\nimport React from \"react\";\n\nexport type DesignDialogSize =\n  | \"sm\"\n  | \"md\"\n  | \"lg\"\n  | \"xl\"\n  | \"2xl\"\n  | \"3xl\"\n  | \"4xl\"\n  | \"5xl\"\n  | \"6xl\"\n  | \"7xl\"\n  | \"full\";\n\nexport type DesignDialogVariant = \"glassmorphic\" | \"plain\";\n\nconst dialogSizeClasses = new Map<DesignDialogSize, string>([\n  [\"sm\", \"max-w-sm\"],\n  [\"md\", \"max-w-md\"],\n  [\"lg\", \"max-w-lg\"],\n  [\"xl\", \"max-w-xl\"],\n  [\"2xl\", \"max-w-2xl\"],\n  [\"3xl\", \"max-w-3xl\"],\n  [\"4xl\", \"max-w-4xl\"],\n  [\"5xl\", \"max-w-5xl\"],\n  [\"6xl\", \"max-w-6xl\"],\n  [\"7xl\", \"max-w-7xl\"],\n  [\"full\", \"max-w-[calc(100vw-2rem)]\"],\n]);\n\nconst dialogSurfaceClasses = new Map<DesignDialogVariant, string>([\n  [\"glassmorphic\", \"border-0 sm:rounded-2xl bg-background/85 backdrop-blur-2xl ring-1 ring-foreground/[0.06] shadow-[0_24px_48px_-12px_rgba(0,0,0,0.25),0_4px_24px_-8px_rgba(0,0,0,0.12)] dark:bg-background/80 dark:ring-white/[0.06]\"],\n  [\"plain\", \"border bg-background shadow-lg sm:rounded-lg\"],\n]);\n\nconst dialogOverlayClasses = new Map<DesignDialogVariant, string | undefined>([\n  [\"glassmorphic\", \"bg-black/50 backdrop-blur-sm\"],\n  [\"plain\", undefined],\n]);\n\ntype DesignDialogIcon = React.ElementType<{ className?: string }>;\n\ntype DesignDialogRootProps = Omit<React.ComponentProps<typeof Dialog>, \"children\">;\n\nexport type DesignDialogProps = {\n  trigger?: React.ReactElement,\n  size?: DesignDialogSize,\n  variant?: DesignDialogVariant,\n  icon?: DesignDialogIcon | null,\n  title?: React.ReactNode,\n  description?: React.ReactNode,\n  headerContent?: React.ReactNode,\n  customHeader?: React.ReactNode,\n  footer?: React.ReactNode,\n  noBodyPadding?: boolean,\n  hideTopCloseButton?: boolean,\n  className?: string,\n  overlayClassName?: string,\n  headerClassName?: string,\n  bodyClassName?: string,\n  footerClassName?: string,\n  children?: React.ReactNode,\n} & DesignDialogRootProps;\n\n/**\n * Canonical dashboard modal surface. This wraps the base dialog primitives with\n * a reusable glassmorphic shell and consistent header/body/footer regions.\n */\nexport function DesignDialog({\n  trigger,\n  size = \"lg\",\n  variant = \"glassmorphic\",\n  icon: Icon = null,\n  title,\n  description,\n  headerContent,\n  customHeader,\n  footer,\n  noBodyPadding = false,\n  hideTopCloseButton = false,\n  className,\n  overlayClassName,\n  headerClassName,\n  bodyClassName,\n  footerClassName,\n  children,\n  ...dialogRootProps\n}: DesignDialogProps) {\n  const resolvedSizeClass = dialogSizeClasses.get(size) ?? \"max-w-lg\";\n  const resolvedSurfaceClass = dialogSurfaceClasses.get(variant) ?? dialogSurfaceClasses.get(\"glassmorphic\");\n  const resolvedOverlayClass = cn(dialogOverlayClasses.get(variant), overlayClassName);\n  const shouldRenderTopHeaderRow = Icon != null || title != null || description != null;\n  const shouldRenderHeader = customHeader != null || shouldRenderTopHeaderRow || headerContent != null;\n  // Use toArray + filter(Boolean) instead of Children.count so that\n  // expressions like `{condition && <Foo/>}` resolving to `false` don't\n  // produce an empty DialogBody (which would still render padding/borders).\n  const shouldRenderBody = React.Children.toArray(children).filter(Boolean).length > 0;\n  const hasStandardTitle = title != null;\n  const needsAccessibleTitleFallback = !hasStandardTitle && customHeader == null;\n\n  if (process.env.NODE_ENV !== \"production\" && needsAccessibleTitleFallback) {\n    console.warn(\n      \"[DesignDialog] Rendered without a `title` or `customHeader`. Every dialog needs an accessible name — pass `title`, or render a `DialogTitle` inside `customHeader`.\",\n    );\n  }\n\n  return (\n    <Dialog {...dialogRootProps}>\n      {trigger != null && (\n        <DialogTrigger asChild>\n          {trigger}\n        </DialogTrigger>\n      )}\n\n      <DialogContent\n        className={cn(\n          \"gap-0 p-0 overflow-hidden\",\n          resolvedSizeClass,\n          resolvedSurfaceClass,\n          className\n        )}\n        overlayProps={resolvedOverlayClass ? { className: resolvedOverlayClass } : undefined}\n        noCloseButton={hideTopCloseButton}\n      >\n        {needsAccessibleTitleFallback && (\n          <DialogTitle className=\"sr-only\">Dialog</DialogTitle>\n        )}\n        {shouldRenderHeader && (\n          <DialogHeader className={cn(\"px-6 pt-6 pb-4 border-b border-foreground/[0.06]\", headerClassName)}>\n            {customHeader ?? (\n              <>\n                {shouldRenderTopHeaderRow && (\n                  <div className={cn(\"flex items-start gap-3\", Icon == null && \"gap-0\")}>\n                    {Icon != null && (\n                      <div className=\"h-9 w-9 rounded-xl bg-primary/10 ring-1 ring-primary/15 flex items-center justify-center shrink-0\">\n                        <Icon className=\"h-4 w-4 text-primary\" />\n                      </div>\n                    )}\n                    {(title != null || description != null) && (\n                      <div className=\"flex-1 min-w-0 space-y-1\">\n                        {title != null ? (\n                          <DialogTitle className=\"text-base\">\n                            {title}\n                          </DialogTitle>\n                        ) : null}\n                        {description != null ? (\n                          <DialogDescription className=\"text-xs\">\n                            {description}\n                          </DialogDescription>\n                        ) : null}\n                      </div>\n                    )}\n                  </div>\n                )}\n\n                {headerContent != null ? (\n                  <div className={cn(shouldRenderTopHeaderRow && \"mt-4\")}>\n                    {headerContent}\n                  </div>\n                ) : null}\n              </>\n            )}\n          </DialogHeader>\n        )}\n\n        {shouldRenderBody && (\n          <DialogBody\n            className={cn(\n              \"mx-0 my-0 w-auto\",\n              noBodyPadding ? \"px-0 py-0\" : \"px-6 py-4\",\n              bodyClassName\n            )}\n          >\n            {children}\n          </DialogBody>\n        )}\n\n        {footer != null ? (\n          <DialogFooter className={cn(\"px-6 py-3 border-t border-foreground/[0.06] bg-foreground/[0.02]\", footerClassName)}>\n            {footer}\n          </DialogFooter>\n        ) : null}\n      </DialogContent>\n    </Dialog>\n  );\n}\n\nexport const DesignDialogRoot = Dialog;\nexport const DesignDialogTrigger = DialogTrigger;\nexport const DesignDialogClose = DialogClose;\nexport const DesignDialogTitle = DialogTitle;\nexport const DesignDialogDescription = DialogDescription;\n"],"mappings":";;;;;;;;;;AA+BA,MAAM,oBAAoB,IAAI,IAA8B;CAC1D,CAAC,MAAM,WAAW;CAClB,CAAC,MAAM,WAAW;CAClB,CAAC,MAAM,WAAW;CAClB,CAAC,MAAM,WAAW;CAClB,CAAC,OAAO,YAAY;CACpB,CAAC,OAAO,YAAY;CACpB,CAAC,OAAO,YAAY;CACpB,CAAC,OAAO,YAAY;CACpB,CAAC,OAAO,YAAY;CACpB,CAAC,OAAO,YAAY;CACpB,CAAC,QAAQ,2BAA2B;CACrC,CAAC;AAEF,MAAM,uBAAuB,IAAI,IAAiC,CAChE,CAAC,gBAAgB,qNAAqN,EACtO,CAAC,SAAS,+CAA+C,CAC1D,CAAC;AAEF,MAAM,uBAAuB,IAAI,IAA6C,CAC5E,CAAC,gBAAgB,+BAA+B,EAChD,CAAC,SAAS,OAAU,CACrB,CAAC;;;;;AA8BF,SAAgB,aAAa,EAC3B,SACA,OAAO,MACP,UAAU,gBACV,MAAM,OAAO,MACb,OACA,aACA,eACA,cACA,QACA,gBAAgB,OAChB,qBAAqB,OACrB,WACA,kBACA,iBACA,eACA,iBACA,UACA,GAAG,mBACiB;CACpB,MAAM,oBAAoB,kBAAkB,IAAI,KAAK,IAAI;CACzD,MAAM,uBAAuB,qBAAqB,IAAI,QAAQ,IAAI,qBAAqB,IAAI,eAAe;CAC1G,MAAM,oDAA0B,qBAAqB,IAAI,QAAQ,EAAE,iBAAiB;CACpF,MAAM,2BAA2B,QAAQ,QAAQ,SAAS,QAAQ,eAAe;CACjF,MAAM,qBAAqB,gBAAgB,QAAQ,4BAA4B,iBAAiB;CAIhG,MAAM,mBAAmBA,cAAM,SAAS,QAAQ,SAAS,CAAC,OAAO,QAAQ,CAAC,SAAS;CAEnF,MAAM,+BAA+B,EADZ,SAAS,SACwB,gBAAgB;AAE1E,KAAI,QAAQ,IAAI,aAAa,gBAAgB,6BAC3C,SAAQ,KACN,sKACD;AAGH,QACE,4CAACC;EAAO,GAAI;aACT,WAAW,QACV,2CAACC;GAAc;aACZ;IACa,EAGlB,4CAACC;GACC,wCACE,6BACA,mBACA,sBACA,UACD;GACD,cAAc,uBAAuB,EAAE,WAAW,sBAAsB,GAAG;GAC3E,eAAe;;IAEd,gCACC,2CAACC;KAAY,WAAU;eAAU;MAAoB;IAEtD,sBACC,2CAACC;KAAa,wCAAc,oDAAoD,gBAAgB;eAC7F,gBACC,qFACG,4BACC,4CAAC;MAAI,wCAAc,0BAA0B,QAAQ,QAAQ,QAAQ;iBAClE,QAAQ,QACP,2CAAC;OAAI,WAAU;iBACb,2CAAC,QAAK,WAAU,yBAAyB;QACrC,GAEN,SAAS,QAAQ,eAAe,SAChC,4CAAC;OAAI,WAAU;kBACZ,SAAS,OACR,2CAACD;QAAY,WAAU;kBACpB;SACW,GACZ,MACH,eAAe,OACd,2CAACE;QAAkB,WAAU;kBAC1B;SACiB,GAClB;QACA;OAEJ,EAGP,iBAAiB,OAChB,2CAAC;MAAI,wCAAc,4BAA4B,OAAO;gBACnD;OACG,GACJ,QACH;MAEQ;IAGhB,oBACC,2CAACC;KACC,wCACE,oBACA,gBAAgB,cAAc,aAC9B,cACD;KAEA;MACU;IAGd,UAAU,OACT,2CAACC;KAAa,wCAAc,oEAAoE,gBAAgB;eAC7G;MACY,GACb;;IACU;GACT;;AAIb,MAAa,mBAAmBP;AAChC,MAAa,sBAAsBC;AACnC,MAAa,oBAAoBO;AACjC,MAAa,oBAAoBL;AACjC,MAAa,0BAA0BE"}