@softr/sdk 0.0.22 → 0.0.24

package/dist/auth/session.js

@@ -46,8 +46,9 @@ function readSessionData(sessionToken) {
 		permissions: payload.permissions
 	};
 }
-function makeSessionTokenCookie(token, secure = requestIsSecure()) {
-	return serializeCookie(sessionCookieName(SESSION_TOKEN, secure), sealEnvelope(token, SESSION_TOKEN), {
+function makeSessionTokenCookie(token) {
+	const { name, secure } = sessionCookie(SESSION_TOKEN);
+	return serializeCookie(name, sealEnvelope(token, SESSION_TOKEN), {
 		maxAge: sessionConfig().sessionMaxAge,
 		secure
 	});
@@ -71,19 +72,6 @@ function makeSessionDataCookie(session, sessionToken) {
 function clearSession() {
 	clearCookies([SESSION_TOKEN, SESSION_DATA]);
 }
-/** The clearing pair, for the same out-of-context caller as `makeSessionTokenCookie`. */
-function makeSessionClearingCookies(secure) {
-	return serializeClearingCookies([SESSION_TOKEN, SESSION_DATA], secure);
-}
-/**
-* The name `readSessionToken` would look the token up under on a request of this
-* scheme, for a caller that only needs to know whether one is present and cannot
-* decode it. Same `secure` argument as `makeSessionTokenCookie`, so a caller that
-* writes and a caller that probes cannot disagree about the name.
-*/
-function sessionTokenCookieName(secure) {
-	return sessionCookieName(SESSION_TOKEN, secure);
-}
 const sessionDataSchema = z.object({
 	user: userSchema.nullable(),
 	permissions: permissionsSchema,
@@ -95,13 +83,11 @@ const sessionDataSchema = z.object({
 * schemes, and the one left behind would revive if the scheme changed back.
 */
 function clearCookies(bases) {
-	writeCookies(serializeClearingCookies(bases, requestIsSecure()));
-}
-function serializeClearingCookies(bases, secure) {
-	return bases.flatMap((base) => secure ? [sessionCookieName(base, secure), base] : [base]).map((name) => serializeCookie(name, "", {
+	const secure = requestIsSecure();
+	writeCookies(bases.flatMap((base) => secure ? [sessionCookieName(base, secure), base] : [base]).map((name) => serializeCookie(name, "", {
 		maxAge: 0,
 		secure
-	}));
+	})));
 }
 /**
 * Over the plaintext token, never the cookie value: that is resealed with a
@@ -177,4 +163,4 @@ function openEnvelope(raw, purpose) {
 }
 
 //#endregion
-export { clearSession, makeSessionClearingCookies, makeSessionDataCookie, makeSessionTokenCookie, readSessionData, readSessionToken, sessionTokenCookieName };
+export { clearSession, makeSessionDataCookie, makeSessionTokenCookie, readSessionData, readSessionToken };

package/dist/core/datasource.d.ts

@@ -1,13 +1,23 @@
-import { ChartDataOptions, ChartDataResult, CreateOptions, GetOptions, ListOptions, ListResult, MetricOptions, MetricResult, SoftrRecord, UpdateOptions } from "../types.js";
+import { ChartOptions, ChartResult, CreateOptions, GetOptions, ListOptions, ListResult, MetricOptions, MetricResult, RecordFieldsFor, SoftrRecord, UpdateOptions } from "../types.js";
 
 //#region src/core/datasource.d.ts
-declare function listRecords(datasourceId: string, options?: ListOptions): Promise<ListResult>;
-declare function getRecord(datasourceId: string, options: GetOptions): Promise<SoftrRecord | null>;
-declare function createRecord(datasourceId: string, options: CreateOptions): Promise<SoftrRecord>;
-declare function updateRecord(datasourceId: string, options: UpdateOptions): Promise<SoftrRecord>;
+declare function listRecords<Id extends string, Sel extends Record<string, string> = Record<never, never>>(datasourceId: Id, options?: Omit<ListOptions, 'select'> & {
+  select?: Sel;
+}): Promise<ListResult<SoftrRecord<RecordFieldsFor<Id, Sel>>>>;
+declare function getRecord<Id extends string, Sel extends Record<string, string> = Record<never, never>>(datasourceId: Id, options: Omit<GetOptions, 'select'> & {
+  select?: Sel;
+}): Promise<SoftrRecord<RecordFieldsFor<Id, Sel>> | null>;
+declare function createRecord<Id extends string, Sel extends Record<string, string> = Record<never, never>>(datasourceId: Id, options: Omit<CreateOptions, 'select' | 'data'> & {
+  select?: Sel;
+  data: Partial<RecordFieldsFor<Id, Sel>>;
+}): Promise<SoftrRecord<RecordFieldsFor<Id, Sel>>>;
+declare function updateRecord<Id extends string, Sel extends Record<string, string> = Record<never, never>>(datasourceId: Id, options: Omit<UpdateOptions, 'select' | 'data'> & {
+  select?: Sel;
+  data: Partial<RecordFieldsFor<Id, Sel>>;
+}): Promise<SoftrRecord<RecordFieldsFor<Id, Sel>>>;
 declare function deleteRecord(datasourceId: string, id: string): Promise<void>;
 declare function getMetric(datasourceId: string, options: MetricOptions): Promise<MetricResult>;
-declare function getChartData(datasourceId: string, options: ChartDataOptions): Promise<ChartDataResult>;
+declare function getChart(datasourceId: string, options: ChartOptions): Promise<ChartResult>;
 declare const ds: {
   list: typeof listRecords;
   get: typeof getRecord;
@@ -15,7 +25,7 @@ declare const ds: {
   update: typeof updateRecord;
   delete: typeof deleteRecord;
   metric: typeof getMetric;
-  chartData: typeof getChartData;
+  chart: typeof getChart;
 };
 //#endregion
 export { ds };

package/dist/core/datasource.js

@@ -3,6 +3,7 @@ import { panic } from "../assertions.js";
 import { readUserTimezone } from "../cookies.js";
 import { sessionConfig } from "../auth/config.js";
 import { readSessionToken } from "../auth/session.js";
+import { assertResponseOk } from "./utils.js";
 
 //#region src/core/datasource.ts
 const MAX_RECORD_COUNT = 100;
@@ -36,7 +37,7 @@ async function listRecords(datasourceId, options = {}) {
 			}
 		})
 	});
-	if (!res.ok) throw new Error(`Softr datasource list failed for "${datasourceId}": ${res.status}`);
+	await assertResponseOk(res, `Softr datasource list failed for "${datasourceId}"`);
 	const payload = await res.json();
 	const nextOffset = payload.offset < payload.total ? payload.offset : null;
 	return {
@@ -60,13 +61,18 @@ async function getRecord(datasourceId, options) {
 			},
 			body: JSON.stringify({ options: { userLocale: "en-US" } })
 		});
-		if (!res.ok) throw new Error(`Softr datasource get failed for "${datasourceId}": ${res.status}`);
+		await assertResponseOk(res, `Softr datasource get failed for "${datasourceId}"`);
 		const contentLength = res.headers.get("Content-Length");
 		if (contentLength && parseInt(contentLength, 10) === 0) return null;
-		return res.json();
+		const record = await res.json();
+		return {
+			id: record.id,
+			fields: options.select ? aliasFields(record.fields, options.select) : record.fields
+		};
 	}
 	return (await listRecords(datasourceId, {
 		where: options.where,
+		select: options.select,
 		limit: 1,
 		timeZone: options.timeZone
 	})).records[0] ?? null;
@@ -81,12 +87,12 @@ async function createRecord(datasourceId, options) {
 		},
 		body: JSON.stringify({ fields: rawFields })
 	});
-	if (!res.ok) throw new Error(`Softr datasource create failed for "${datasourceId}": ${res.status}`);
+	await assertResponseOk(res, `Softr datasource create failed for "${datasourceId}"`);
 	const record = await res.json();
-	return options.select ? {
+	return {
 		id: record.id,
-		fields: aliasFields(record.fields, options.select)
-	} : record;
+		fields: options.select ? aliasFields(record.fields, options.select) : record.fields
+	};
 }
 async function updateRecord(datasourceId, options) {
 	if (!options.id) throw new Error(`Softr datasource update: id must not be empty`);
@@ -99,25 +105,25 @@ async function updateRecord(datasourceId, options) {
 		},
 		body: JSON.stringify({ fields: rawFields })
 	});
-	if (!res.ok) throw new Error(`Softr datasource update failed for "${datasourceId}": ${res.status}`);
+	await assertResponseOk(res, `Softr datasource update failed for "${datasourceId}"`);
 	const record = await res.json();
-	return options.select ? {
+	return {
 		id: record.id,
-		fields: aliasFields(record.fields, options.select)
-	} : record;
+		fields: options.select ? aliasFields(record.fields, options.select) : record.fields
+	};
 }
 async function deleteRecord(datasourceId, id) {
-	const res = await fetch(`${dsUrl(datasourceId)}/records/${id}`, {
+	await assertResponseOk(await fetch(`${dsUrl(datasourceId)}/records/${id}`, {
 		method: "DELETE",
 		headers: { "Authorization": `Bearer ${readSessionToken()}` }
-	});
-	if (!res.ok) throw new Error(`Softr datasource delete failed for "${datasourceId}": ${res.status}`);
+	}), `Softr datasource delete failed for "${datasourceId}"`);
 }
 async function getMetric(datasourceId, options) {
 	const { select, where, aggregation, field } = options;
+	if (aggregation !== "COUNT" && !field) throw new Error(`field is required for aggregation "${aggregation}"`);
 	const fieldId = field ? select?.[field] ?? field : void 0;
 	const filterCriteria = where ? dealiasFilterCriteria(buildFilterCriteria(where), select ?? {}) : {};
-	const res = await fetch(`${dsUrl(datasourceId)}/metric/data`, {
+	const res = await fetch(`${dsUrl(datasourceId)}/chart/data`, {
 		method: "POST",
 		headers: {
 			"Content-Type": "application/json",
@@ -126,37 +132,36 @@ async function getMetric(datasourceId, options) {
 		},
 		body: JSON.stringify({
 			options: { userLocale: "en-US" },
-			calculationField: {
+			groupBy: [],
+			metrics: [{
 				field: fieldId,
 				aggregation
-			},
+			}],
 			filterCriteria
 		})
 	});
-	if (!res.ok) throw new Error(`Softr datasource metric failed for "${datasourceId}": ${res.status}`);
+	await assertResponseOk(res, `Softr datasource metric failed for "${datasourceId}"`);
 	const payload = await res.json();
 	const executionTimestamp = /* @__PURE__ */ new Date(payload.executionTimestamp * 1e3);
 	let value;
-	if (aggregation === "COUNT") value = payload.data.find((item) => COUNT_CNT in item)?.[COUNT_CNT] ?? null;
-	else {
-		if (!fieldId) throw new Error(`field is required for aggregation "${aggregation}"`);
-		value = payload.data.find((item) => fieldId in item)?.[fieldId] ?? null;
-	}
+	const responseKey = aggregation === "COUNT" && !fieldId ? COUNT_CNT : fieldId;
+	value = payload.data.find((item) => responseKey in item)?.[responseKey] ?? null;
 	return {
 		value,
 		executionTimestamp
 	};
 }
-async function getChartData(datasourceId, options) {
+async function getChart(datasourceId, options) {
 	const { select, where, groupBy, metrics, orderBy } = options;
 	const filterCriteria = where ? dealiasFilterCriteria(buildFilterCriteria(where), select ?? {}) : {};
-	const sortingOption = orderBy ? dealiasOrderBy(buildOrderBy(orderBy), select ?? {})[0] : void 0;
+	const sortingOptions = orderBy ? dealiasOrderBy(buildOrderBy(orderBy), select ?? {}) : void 0;
 	const groupByFields = (Array.isArray(groupBy) ? groupBy : [groupBy]).map((field) => ({ field: select?.[field] ?? field }));
 	const yAxisFields = Object.values(metrics).map(({ field, aggregation }) => ({
 		field: field ? select?.[field] ?? field : void 0,
 		aggregation
 	}));
-	const res = await fetch(`${dsUrl(datasourceId)}/chart`, {
+	if (!yAxisFields.length) throw new Error("chart requires at least one metric");
+	const res = await fetch(`${dsUrl(datasourceId)}/chart/data`, {
 		method: "POST",
 		headers: {
 			"Content-Type": "application/json",
@@ -166,12 +171,12 @@ async function getChartData(datasourceId, options) {
 		body: JSON.stringify({
 			options: { userLocale: "en-US" },
 			filterCriteria,
-			sortingOption,
-			xAxisFields: groupByFields,
-			yAxisFields
+			sortingOptions,
+			groupBy: groupByFields,
+			metrics: yAxisFields
 		})
 	});
-	if (!res.ok) throw new Error(`Softr datasource chartData failed for "${datasourceId}": ${res.status}`);
+	await assertResponseOk(res, `Softr datasource chart failed for "${datasourceId}"`);
 	const payload = await res.json();
 	const executionTimestamp = /* @__PURE__ */ new Date(payload.executionTimestamp * 1e3);
 	const aliases = {};
@@ -211,11 +216,11 @@ const ds = {
 	update: updateRecord,
 	delete: deleteRecord,
 	metric: getMetric,
-	chartData: getChartData
+	chart: getChart
 };
 function withoutTrailingSlash(url) {
 	return url.replace(/\/+$/, "");
 }
 
 //#endregion
-export { ds };
+export { ds, dsUrl };

package/dist/core/integration.js

@@ -1,7 +1,7 @@
 import { readSessionToken } from "../auth/session.js";
+import { dsUrl } from "./datasource.js";
 
 //#region src/core/integration.ts
-const BASE_URL = () => (import.meta.env.VITE_SOFTR_BASE_URL ?? "").replace(/\/$/, "");
 async function integrationFetch(integrationId, input, init) {
 	const req = new Request(input, init);
 	if (req.signal.aborted) throw req.signal.reason ?? new DOMException("The operation was aborted.", "AbortError");
@@ -16,7 +16,7 @@ async function integrationFetch(integrationId, input, init) {
 	};
 	const method = req.method.toUpperCase();
 	if (method !== "GET" && method !== "HEAD" && req.body !== null) payload.body = await req.clone().text();
-	return fetch(`${BASE_URL()}/api/integrations/${integrationId}/proxy`, {
+	return fetch(`${dsUrl(integrationId)}/proxy`, {
 		method: "POST",
 		headers: {
 			"Content-Type": "application/json",

package/dist/core/utils.js

@@ -0,0 +1,14 @@
+//#region src/core/utils.ts
+async function assertResponseOk(res, message) {
+	if (!res.ok) {
+		let fullMessage = `${message}: ${res.status}`;
+		if (process.env.NODE_ENV !== "production") {
+			const body = await res.text().catch(() => "");
+			if (body) fullMessage += `\n\n${body}`;
+		}
+		throw new Error(fullMessage);
+	}
+}
+
+//#endregion
+export { assertResponseOk };

package/dist/default-error-overlay.d.ts

@@ -0,0 +1,13 @@
+import * as react0 from "react";
+
+//#region src/default-error-overlay.d.ts
+type Props = {
+  error: Error;
+  reset?: () => void;
+};
+declare function DefaultErrorOverlay({
+  error,
+  reset
+}: Props): react0.JSX.Element;
+//#endregion
+export { DefaultErrorOverlay };

package/dist/default-error-overlay.js

@@ -0,0 +1,319 @@
+import { useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/default-error-overlay.tsx
+function DefaultErrorOverlay({ error, reset }) {
+	if (process.env.NODE_ENV === "production") return /* @__PURE__ */ jsx("div", {
+		style: s.overlay,
+		children: /* @__PURE__ */ jsxs("div", {
+			style: s.card,
+			children: [
+				/* @__PURE__ */ jsx(AlertIcon, {}),
+				/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h1", {
+					style: s.heading,
+					children: "Something went wrong"
+				}), /* @__PURE__ */ jsx("p", {
+					style: s.body,
+					children: "This page couldn't be shown. Try again in a moment."
+				})] }),
+				/* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(RetryButton, { onClick: reset }) })
+			]
+		})
+	});
+	return /* @__PURE__ */ jsx(DevView, {
+		error,
+		reset
+	});
+}
+function DevView({ error, reset }) {
+	return /* @__PURE__ */ jsx("div", {
+		style: s.overlay,
+		children: /* @__PURE__ */ jsxs("div", {
+			style: s.card,
+			children: [
+				/* @__PURE__ */ jsx(AlertIcon, {}),
+				/* @__PURE__ */ jsxs("div", { children: [
+					/* @__PURE__ */ jsx("h1", {
+						style: s.heading,
+						children: "Something went wrong"
+					}),
+					/* @__PURE__ */ jsx("p", {
+						style: s.body,
+						children: "A render error was caught. Copy the details to the agent to help fix the issue."
+					}),
+					/* @__PURE__ */ jsx("p", {
+						style: s.note,
+						children: "Only shown in development mode."
+					})
+				] }),
+				/* @__PURE__ */ jsx("pre", {
+					style: s.message,
+					children: error.message
+				}),
+				error.stack && /* @__PURE__ */ jsx(StackTrace, { stack: error.stack }),
+				/* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(RetryButton, { onClick: reset }) })
+			]
+		})
+	});
+}
+function cleanStack(stack) {
+	return stack.split("\n").slice(1).filter((line) => line.trim().startsWith("at ") && !line.includes("/node_modules/")).map((line) => line.replace(/https?:\/\/[^/]+\//, "").replace(/\?[^):]+/g, "")).join("\n");
+}
+function StackTrace({ stack }) {
+	const cleaned = cleanStack(stack);
+	const [open, setOpen] = useState(false);
+	const [copied, setCopied] = useState(false);
+	const ref = useRef(null);
+	if (!cleaned) return null;
+	async function copy() {
+		try {
+			await navigator.clipboard.writeText(cleaned);
+			setCopied(true);
+			setTimeout(() => setCopied(false), 1500);
+		} catch {
+			if (ref.current) getSelection()?.selectAllChildren(ref.current);
+		}
+	}
+	return /* @__PURE__ */ jsxs("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			gap: "0.5rem"
+		},
+		children: [/* @__PURE__ */ jsxs("button", {
+			type: "button",
+			style: s.toggle,
+			"aria-expanded": open,
+			onClick: () => setOpen((v) => !v),
+			children: [/* @__PURE__ */ jsx("svg", {
+				style: {
+					width: "0.875rem",
+					height: "0.875rem",
+					flexShrink: 0,
+					transition: "transform 150ms",
+					transform: open ? "rotate(90deg)" : "none"
+				},
+				viewBox: "0 0 24 24",
+				fill: "none",
+				stroke: "currentColor",
+				strokeWidth: "2",
+				strokeLinecap: "round",
+				strokeLinejoin: "round",
+				children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" })
+			}), "Stack trace"]
+		}), open && /* @__PURE__ */ jsxs("div", {
+			style: { position: "relative" },
+			children: [/* @__PURE__ */ jsx("pre", {
+				ref,
+				style: s.stack,
+				children: cleaned
+			}), /* @__PURE__ */ jsx("button", {
+				type: "button",
+				style: s.copy,
+				"aria-label": "Copy stack trace",
+				onClick: copy,
+				children: copied ? /* @__PURE__ */ jsx("svg", {
+					style: icon.sm,
+					viewBox: "0 0 24 24",
+					fill: "none",
+					stroke: "currentColor",
+					strokeWidth: "2",
+					strokeLinecap: "round",
+					strokeLinejoin: "round",
+					children: /* @__PURE__ */ jsx("path", { d: "M20 6 9 17l-5-5" })
+				}) : /* @__PURE__ */ jsxs("svg", {
+					style: icon.sm,
+					viewBox: "0 0 24 24",
+					fill: "none",
+					stroke: "currentColor",
+					strokeWidth: "2",
+					strokeLinecap: "round",
+					strokeLinejoin: "round",
+					children: [/* @__PURE__ */ jsx("rect", {
+						width: "14",
+						height: "14",
+						x: "8",
+						y: "8",
+						rx: "2",
+						ry: "2"
+					}), /* @__PURE__ */ jsx("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })]
+				})
+			})]
+		})]
+	});
+}
+function AlertIcon() {
+	return /* @__PURE__ */ jsx("div", {
+		style: s.alert,
+		children: /* @__PURE__ */ jsxs("svg", {
+			style: icon.md,
+			viewBox: "0 0 24 24",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "2",
+			strokeLinecap: "round",
+			strokeLinejoin: "round",
+			children: [
+				/* @__PURE__ */ jsx("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
+				/* @__PURE__ */ jsx("path", { d: "M12 9v4" }),
+				/* @__PURE__ */ jsx("path", { d: "M12 17h.01" })
+			]
+		})
+	});
+}
+function RetryButton({ onClick }) {
+	return /* @__PURE__ */ jsxs("button", {
+		type: "button",
+		style: s.retry,
+		onClick,
+		children: [/* @__PURE__ */ jsxs("svg", {
+			style: icon.sm,
+			viewBox: "0 0 24 24",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "2",
+			strokeLinecap: "round",
+			strokeLinejoin: "round",
+			children: [
+				/* @__PURE__ */ jsx("path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8" }),
+				/* @__PURE__ */ jsx("path", { d: "M21 3v5h-5" }),
+				/* @__PURE__ */ jsx("path", { d: "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16" }),
+				/* @__PURE__ */ jsx("path", { d: "M8 16H3v5" })
+			]
+		}), "Try again"]
+	});
+}
+const icon = {
+	sm: {
+		width: "0.875rem",
+		height: "0.875rem"
+	},
+	md: {
+		width: "1.25rem",
+		height: "1.25rem"
+	}
+};
+const s = {
+	overlay: {
+		minHeight: "100vh",
+		display: "grid",
+		placeItems: "center",
+		gridTemplateColumns: "minmax(0, 1fr)",
+		padding: "1.5rem"
+	},
+	card: {
+		width: "100%",
+		maxWidth: "36rem",
+		display: "flex",
+		flexDirection: "column",
+		gap: "1.25rem",
+		padding: "1.5rem",
+		borderRadius: "calc(var(--radius, 0.625rem) + 4px)",
+		background: "var(--card, oklch(1 0 0))",
+		boxShadow: "0 0 0 1px color-mix(in oklch, var(--foreground, oklch(0.145 0 0)) 10%, transparent)"
+	},
+	alert: {
+		display: "flex",
+		alignItems: "center",
+		justifyContent: "center",
+		width: "2.5rem",
+		height: "2.5rem",
+		borderRadius: "var(--radius, 0.625rem)",
+		background: "color-mix(in oklch, var(--destructive, oklch(0.577 0.245 27.325)) 12%, transparent)",
+		color: "var(--destructive, oklch(0.577 0.245 27.325))",
+		flexShrink: 0
+	},
+	heading: {
+		margin: 0,
+		fontSize: "1rem",
+		fontWeight: 500,
+		lineHeight: 1.375
+	},
+	body: {
+		margin: "0.375rem 0 0",
+		fontSize: "0.875rem",
+		color: "var(--muted-foreground, oklch(0.556 0 0))"
+	},
+	note: {
+		margin: "0.75rem 0 0",
+		fontSize: "0.875rem",
+		color: "var(--muted-foreground, oklch(0.556 0 0))",
+		opacity: .65
+	},
+	message: {
+		margin: 0,
+		padding: "0.75rem",
+		borderRadius: "var(--radius, 0.625rem)",
+		background: "var(--muted, oklch(0.97 0 0))",
+		fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace",
+		fontSize: "0.8125rem",
+		lineHeight: 1.6,
+		whiteSpace: "pre-wrap",
+		overflowWrap: "anywhere",
+		maxHeight: "12rem",
+		overflow: "auto"
+	},
+	toggle: {
+		display: "inline-flex",
+		alignItems: "center",
+		gap: "0.375rem",
+		height: "2rem",
+		padding: "0 0.75rem 0 0.5rem",
+		border: "1px solid var(--input, oklch(0.922 0 0))",
+		borderRadius: "var(--radius, 0.625rem)",
+		background: "var(--input-fill, oklch(1 0 0))",
+		color: "var(--primary-foreground, oklch(0.985 0 0))",
+		fontFamily: "inherit",
+		fontSize: "0.875rem",
+		fontWeight: 500,
+		cursor: "pointer",
+		userSelect: "none"
+	},
+	stack: {
+		margin: 0,
+		padding: "0.75rem",
+		paddingRight: "2.75rem",
+		borderRadius: "var(--radius, 0.625rem)",
+		background: "var(--muted, oklch(0.97 0 0))",
+		fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace",
+		fontSize: "0.75rem",
+		lineHeight: 1.6,
+		maxHeight: "16rem",
+		overflow: "auto"
+	},
+	copy: {
+		position: "absolute",
+		top: "0.375rem",
+		right: "0.375rem",
+		display: "inline-flex",
+		alignItems: "center",
+		justifyContent: "center",
+		width: "1.75rem",
+		height: "1.75rem",
+		padding: 0,
+		border: "1px solid var(--input, oklch(0.922 0 0))",
+		borderRadius: "calc(var(--radius, 0.625rem) - 2px)",
+		background: "var(--card, oklch(1 0 0))",
+		color: "var(--muted-foreground, oklch(0.556 0 0))",
+		cursor: "pointer"
+	},
+	retry: {
+		display: "inline-flex",
+		alignItems: "center",
+		gap: "0.375rem",
+		height: "2rem",
+		padding: "0 0.75rem",
+		border: "1px solid transparent",
+		borderRadius: "var(--radius, 0.625rem)",
+		background: "var(--primary, oklch(0.205 0 0))",
+		color: "var(--primary-foreground, oklch(0.985 0 0))",
+		fontFamily: "inherit",
+		fontSize: "0.875rem",
+		fontWeight: 500,
+		cursor: "pointer",
+		userSelect: "none"
+	}
+};
+
+//#endregion
+export { DefaultErrorOverlay };

package/dist/index.d.ts

@@ -1,9 +1,10 @@
 import { q } from "./core/query.js";
 import { SoftrUserGroupId, SoftrUserGroups, User } from "./auth/user.js";
-import { AggregationFunction, ChartDataOptions, ChartDataResult, CreateOptions, DatasourcePermissions, GetOptions, JsonValue, ListOptions, ListResult, MetricOptions, MetricResult, SoftrMe, SoftrPermissions, SoftrRecord, SoftrUser, UpdateOptions } from "./types.js";
+import { AggregationFunction, ChartOptions, ChartResult, CreateOptions, DatasourcePermissions, DatasourceTypeMap, GetOptions, JsonValue, ListOptions, ListResult, MetricOptions, MetricResult, RecordFieldsFor, SoftrMe, SoftrPermissions, SoftrRecord, SoftrUser, UpdateOptions } from "./types.js";
 import { Permissions } from "./auth/permissions.js";
 import { SoftrContext } from "./auth/context.js";
 import { AccessBehaviour, AccessCheck, AccessError, AccessReason, RouteVisibility, VisibilityHandle, defineVisibility, isAccessError, isAlreadySignedInError, isForbiddenError, isUnauthenticatedError } from "./routes/visibility.js";
 import { getSoftrContext, initialSoftrContext, softrAuthMiddleware, useCurrentUser, usePermissions } from "./auth/isomorphic.js";
 import { useUserTimezone } from "./timezone.js";
-export { type AccessBehaviour, type AccessCheck, type AccessError, type AccessReason, type AggregationFunction, type ChartDataOptions, type ChartDataResult, type CreateOptions, type DatasourcePermissions, type GetOptions, type JsonValue, type ListOptions, type ListResult, type MetricOptions, type MetricResult, type Permissions, type RouteVisibility, type SoftrContext, type SoftrMe, type SoftrPermissions, type SoftrRecord, type SoftrUser, type SoftrUserGroupId, type SoftrUserGroups, type UpdateOptions, type User, type VisibilityHandle, defineVisibility, getSoftrContext, initialSoftrContext, isAccessError, isAlreadySignedInError, isForbiddenError, isUnauthenticatedError, q, softrAuthMiddleware, useCurrentUser, usePermissions, useUserTimezone };
+import { DefaultErrorOverlay } from "./default-error-overlay.js";
+export { type AccessBehaviour, type AccessCheck, type AccessError, type AccessReason, type AggregationFunction, type ChartOptions, type ChartResult, type CreateOptions, type DatasourcePermissions, type DatasourceTypeMap, DefaultErrorOverlay, type GetOptions, type JsonValue, type ListOptions, type ListResult, type MetricOptions, type MetricResult, type Permissions, type RecordFieldsFor, type RouteVisibility, type SoftrContext, type SoftrMe, type SoftrPermissions, type SoftrRecord, type SoftrUser, type SoftrUserGroupId, type SoftrUserGroups, type UpdateOptions, type User, type VisibilityHandle, defineVisibility, getSoftrContext, initialSoftrContext, isAccessError, isAlreadySignedInError, isForbiddenError, isUnauthenticatedError, q, softrAuthMiddleware, useCurrentUser, usePermissions, useUserTimezone };

package/dist/index.js

@@ -2,5 +2,6 @@ import { q } from "./core/query.js";
 import { defineVisibility, isAccessError, isAlreadySignedInError, isForbiddenError, isUnauthenticatedError } from "./routes/visibility.js";
 import { getSoftrContext, initialSoftrContext, softrAuthMiddleware, useCurrentUser, usePermissions } from "./auth/isomorphic.js";
 import { useUserTimezone } from "./timezone.js";
+import { DefaultErrorOverlay } from "./default-error-overlay.js";
 
-export { defineVisibility, getSoftrContext, initialSoftrContext, isAccessError, isAlreadySignedInError, isForbiddenError, isUnauthenticatedError, q, softrAuthMiddleware, useCurrentUser, usePermissions, useUserTimezone };
+export { DefaultErrorOverlay, defineVisibility, getSoftrContext, initialSoftrContext, isAccessError, isAlreadySignedInError, isForbiddenError, isUnauthenticatedError, q, softrAuthMiddleware, useCurrentUser, usePermissions, useUserTimezone };