@plitzi/sdk-elements 0.37.1 → 0.37.2

package/dist/elements/internal/Page/declaration.mjs

@@ -2,6 +2,17 @@ import { elementDeclaration as e } from "@plitzi/sdk-shared/authoring/declare";
 //#region src/elements/internal/Page/declaration.ts
 var t = e()({
 	type: "page",
+	triggers: { onPageLoad: {
+		action: "onPageLoad",
+		title: "On Page Load",
+		type: "trigger",
+		params: {},
+		preview: {
+			pageId: "",
+			routeParams: "",
+			queryParams: ""
+		}
+	} },
 	content: {
 		attributes: {
 			enabled: !0,

package/dist/elements/internal/Page/index.d.ts

@@ -1,8 +1,21 @@
 declare const Page: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Page').PageProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Page').PageProps>): import('react').JSX.Element;
     displayName: string;
 } & {
     readonly type: "page";
+    readonly triggers: {
+        readonly onPageLoad: {
+            readonly action: "onPageLoad";
+            readonly title: "On Page Load";
+            readonly type: "trigger";
+            readonly params: {};
+            readonly preview: {
+                readonly pageId: "";
+                readonly routeParams: "";
+                readonly queryParams: "";
+            };
+        };
+    };
     readonly content: {
         readonly attributes: {
             readonly enabled: true;

package/dist/elements/media/FontAwesome/FontAwesome.d.ts

@@ -6,9 +6,9 @@ export type FontAwesomeProps = {
     size?: string;
     iconAnimation?: string;
 };
-declare const FontAwesome: ({ ref, className, icon, size, iconAnimation }: FontAwesomeProps) => import("react").JSX.Element;
+declare const FontAwesome: ({ ref, className, icon, size, iconAnimation }: FontAwesomeProps) => import('react').JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<FontAwesomeProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<FontAwesomeProps>): import('react').JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/media/FontAwesome/Settings.d.ts

@@ -4,5 +4,5 @@ type SettingsProps = {
     iconAnimation?: string;
     onUpdate?: (key: string, value: string | boolean | number) => void;
 };
-declare const Settings: ({ icon, size, iconAnimation, onUpdate }: SettingsProps) => import("react").JSX.Element;
+declare const Settings: ({ icon, size, iconAnimation, onUpdate }: SettingsProps) => import('react').JSX.Element;
 export default Settings;

package/dist/elements/media/FontAwesome/index.d.ts

@@ -1,5 +1,5 @@
 declare const FontAwesome: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./FontAwesome').FontAwesomeProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./FontAwesome').FontAwesomeProps>): import('react').JSX.Element;
     displayName: string;
 } & {
     readonly type: "fontAwesome";

package/dist/elements/media/Image/Image.d.ts

@@ -7,9 +7,9 @@ export type ImageProps = {
     fetchPriority?: 'high' | 'low' | 'auto';
     loadMode?: 'eager' | 'lazy';
 };
-declare const Image: ({ ref, className, src: srcProp, alt, fetchPriority, loadMode }: ImageProps) => import("react").JSX.Element;
+declare const Image: ({ ref, className, src: srcProp, alt, fetchPriority, loadMode }: ImageProps) => import('react').JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<ImageProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<ImageProps>): import('react').JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/media/Image/Settings.d.ts

@@ -5,5 +5,5 @@ type SettingsProps = {
     variables?: Record<string, string>;
     onUpdate?: (key: string, value: string | boolean | number) => void;
 };
-declare const Settings: ({ src, variables, fetchPriority, loadMode, onUpdate }: SettingsProps) => import("react").JSX.Element;
+declare const Settings: ({ src, variables, fetchPriority, loadMode, onUpdate }: SettingsProps) => import('react').JSX.Element;
 export default Settings;

package/dist/elements/media/Image/index.d.ts

@@ -1,5 +1,5 @@
 declare const Image: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Image').ImageProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Image').ImageProps>): import('react').JSX.Element;
     displayName: string;
 } & {
     readonly type: "image";

package/dist/elements/media/Video/Settings.d.ts

@@ -6,5 +6,5 @@ type SettingsProps = {
     muted?: boolean;
     onUpdate?: (key: string, value: string | boolean | number) => void;
 };
-declare const Settings: ({ src, autoPlay, playsInline, loop, muted, onUpdate }: SettingsProps) => import("react").JSX.Element;
+declare const Settings: ({ src, autoPlay, playsInline, loop, muted, onUpdate }: SettingsProps) => import('react').JSX.Element;
 export default Settings;

package/dist/elements/media/Video/Video.d.ts

@@ -8,9 +8,9 @@ export type VideoProps = {
     muted?: boolean;
     className?: string;
 };
-declare const Video: ({ ref, src, autoPlay, playsInline, loop, muted, className }: VideoProps) => import("react").JSX.Element;
+declare const Video: ({ ref, src, autoPlay, playsInline, loop, muted, className }: VideoProps) => import('react').JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<VideoProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<VideoProps>): import('react').JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/media/Video/index.d.ts

@@ -1,5 +1,5 @@
 declare const Video: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Video').VideoProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Video').VideoProps>): import('react').JSX.Element;
     displayName: string;
 } & {
     readonly type: "video";

package/dist/elements/provider/ApiContainer/ApiContainer.d.ts

@@ -60,10 +60,19 @@ export type ApiContainerProps = {
     staleTime?: number | string;
     /** With `cache`: seconds an answer nobody renders is kept, so coming back within it paints at once. */
     gcTime?: number | string;
+    /**
+     * Asks again on its own every this many seconds — for a page showing something that keeps moving: a queue, a
+     * feed, a status board. Off (`0`) by default.
+     *
+     * The same refresh `performQuery` runs, for either runtime: a browser request is re-sent, a server provider
+     * asks the server for its own slice again. Skipped while the tab is hidden and never stacked on one still in
+     * flight. A text field in the builder, hence the string.
+     */
+    refreshSeconds?: number | string;
 };
-declare const ApiContainer: ({ ref, className, children, query, method, accessToken, when, headers, mockData, subType, credentials, singleRecord, pagination, pageParam, renderWhileLoading, cache, staleTime, gcTime }: ApiContainerProps) => import("react").JSX.Element;
+declare const ApiContainer: ({ ref, className, children, query, method, accessToken, when, headers, mockData, subType, credentials, singleRecord, pagination, pageParam, renderWhileLoading, cache, staleTime, gcTime, refreshSeconds }: ApiContainerProps) => import('react').JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<ApiContainerProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<ApiContainerProps>): import('react').JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/provider/ApiContainer/ApiContainer.mjs

@@ -1,234 +1,192 @@
 import e from "../../../Element/hocs/withElement.mjs";
-import ee from "../../../Element/hooks/useElement.mjs";
-import te from "../../../Element/hooks/useRscData.mjs";
-import { RootElement as t } from "../../../Element/RootElement.mjs";
-import ne from "./declaration.mjs";
-import re from "./hooks/useApi.mjs";
+import t from "../../../Element/hooks/useElement.mjs";
+import ee from "../../../Element/hooks/useRscData.mjs";
+import { RootElement as te } from "../../../Element/RootElement.mjs";
+import n from "./declaration.mjs";
+import r from "./helpers/providerOutcome.mjs";
+import ne from "./hooks/useApi.mjs";
+import re from "./hooks/useAutoRefresh.mjs";
 import ie from "./hooks/useProviderPagination.mjs";
 import ae from "./hooks/useProviderWrite.mjs";
-import oe from "../../../dataSource/pathFields.mjs";
-import { use as se, useCallback as n, useEffect as ce, useMemo as r } from "react";
-import le from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
-import { useSdkStore as i } from "@plitzi/sdk-shared/store";
-import { StoreProvider as a } from "@plitzi/nexus/react";
-import { emptyObject as o } from "@plitzi/sdk-shared/helpers/utils";
-import { jsx as s } from "react/jsx-runtime";
-import { currentRscLocation as c } from "@plitzi/sdk-shared/server/rsc/refreshRsc";
-import l from "clsx";
-import u from "@plitzi/sdk-shared/dataSource/helpers/getSourceName";
-import ue from "@plitzi/sdk-shared/dataSource/hooks/useRegisterSource";
-import { QueryBuilderEvaluator as de } from "@plitzi/plitzi-ui/QueryBuilder";
+import i from "../../../dataSource/pathFields.mjs";
+import { use as a, useCallback as o, useEffect as s, useMemo as c } from "react";
+import oe from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
+import { useSdkStore as se } from "@plitzi/sdk-shared/store";
+import { StoreProvider as ce } from "@plitzi/nexus/react";
+import { emptyObject as l } from "@plitzi/sdk-shared/helpers/utils";
+import { jsx as u } from "react/jsx-runtime";
+import { currentRscLocation as le } from "@plitzi/sdk-shared/server/rsc/refreshRsc";
+import ue from "clsx";
+import de from "@plitzi/sdk-shared/dataSource/helpers/getSourceName";
+import fe from "@plitzi/sdk-shared/dataSource/hooks/useRegisterSource";
+import { QueryBuilderEvaluator as pe } from "@plitzi/plitzi-ui/QueryBuilder";
 //#region src/elements/provider/ApiContainer/ApiContainer.tsx
-var d = ({ ref: e, className: d = "", children: f, query: p = "", method: m = "get", accessToken: h = "", when: g = o, headers: _ = o, mockData: v = "{}", subType: y = "", credentials: fe = "same-origin", singleRecord: b = !1, pagination: x = "none", pageParam: pe = "page", renderWhileLoading: me = !1, cache: S = !1, staleTime: he = 30, gcTime: ge = 300 }) => {
-	let { id: C, visible: w, definition: { label: T = "Api Container", runtime: _e, items: ve } } = ee(), E = _e === "server", { loaded: D, stale: O, location: k, elementData: A, refresh: j } = te(), M = u(ne.sourceType, C), { settings: { previewMode: N }, contexts: { InteractionsContext: P } } = le(), { interactionsManager: F } = se(P), [[I, L, ye]] = i([
+var d = ({ ref: e, className: d = "", children: f, query: p = "", method: m = "get", accessToken: h = "", when: g = l, headers: _ = l, mockData: v = "{}", subType: y = "", credentials: b = "same-origin", singleRecord: x = !1, pagination: me = "none", pageParam: he = "page", renderWhileLoading: ge = !1, cache: _e = !1, staleTime: ve = 30, gcTime: ye = 300, refreshSeconds: be = 0 }) => {
+	let { id: S, visible: C, definition: { label: w = "Api Container", runtime: xe, items: T } } = t(), E = xe === "server", { loaded: D, stale: O, location: k, elementData: A, refresh: j } = ee(), M = de(n.sourceType, S), { settings: { previewMode: N }, contexts: { InteractionsContext: Se } } = oe(), { interactionsManager: P } = a(Se), [[F, I, Ce]] = se([
 		"navigation.routeParams",
 		"navigation.queryParams",
 		"navigation.navigate"
-	]), be = r(() => h ? {
+	]), we = c(() => h ? {
 		..._,
 		Authorization: `Bearer ${h}`
-	} : _, [_, h]), xe = r(() => E || !w ? !1 : !!(N && p && (g === o || de(g, {
-		...I,
-		...L
-	})) || !N && (p || v && v !== "{}" && v !== o)), [
+	} : _, [_, h]), L = c(() => E || !C ? !1 : !!(N && p && (g === l || pe(g, {
+		...F,
+		...I
+	})) || !N && (p || v && v !== "{}" && v !== l)), [
 		E,
-		w,
+		C,
 		N,
 		p,
 		g,
+		F,
 		I,
-		L,
 		v
-	]), Se = r(() => [C], [C]), { isLoading: Ce, isFetching: we, data: R, refetch: z, isSuccess: B, isError: V } = re({
+	]), Te = c(() => [S], [S]), { isLoading: Ee, isFetching: R, data: z, refetch: B, isSuccess: De, isError: Oe } = ne({
 		url: p,
 		method: m,
-		credentials: fe,
+		credentials: b,
 		mock: N ? void 0 : v,
-		customHeaders: be,
-		enabled: xe,
-		cache: S,
-		staleTime: he,
-		gcTime: ge,
-		tags: Se
-	}), H = E && !!k && k !== c(), U = E && D && !H && A === null, W = r(() => {
-		if (!E) return R ?? o;
+		customHeaders: we,
+		enabled: L,
+		cache: _e,
+		staleTime: ve,
+		gcTime: ye,
+		tags: Te
+	}), V = E && !!k && k !== le(), H = E && D && !V && A === null, U = c(() => {
+		if (!E) return z ?? l;
 		if (A) return A;
-		if (D) return o;
+		if (D) return l;
 		if (typeof v != "string") return v;
 		try {
 			return JSON.parse(v || "{}");
 		} catch {
-			return o;
+			return l;
 		}
 	}, [
 		E,
-		R,
+		z,
 		A,
 		D,
 		v
-	]), G = E ? H : we, Te = E ? H : Ce, K = n(async () => {
+	]), W = E ? V : R, ke = E ? V : Ee, G = o(async () => {
 		if (!E) {
-			z();
+			B();
 			return;
 		}
-		await j([C]);
+		await j([S]);
 	}, [
 		E,
-		z,
+		B,
 		j,
-		C
-	]), q = W, Ee = r(() => Array.isArray(q.records) ? q.records : [], [q.records]), { records: J, isLoadingMore: Y, goToPage: X, loadMore: Z } = ie({
-		elementId: C,
-		mode: x,
-		pageParam: pe,
-		records: Ee,
-		page: q.pageInfo?.page ?? 1,
+		S
+	]);
+	re({
+		seconds: be,
+		enabled: C && (E ? D && !V : L),
+		refresh: G
+	});
+	let K = U, Ae = c(() => Array.isArray(K.records) ? K.records : [], [K.records]), { records: q, isLoadingMore: J, goToPage: Y, loadMore: X } = ie({
+		elementId: S,
+		mode: me,
+		pageParam: he,
+		records: Ae,
+		page: K.pageInfo?.page ?? 1,
 		refresh: j,
-		navigate: ye
+		navigate: Ce
+	}), Z = r({
+		serverMode: E,
+		isSuccess: De,
+		isError: Oe,
+		rscResolved: D,
+		rscPending: V,
+		elementData: A
 	});
-	ce(() => {
-		!G && C && (B ? F.interactionTrigger(C, "onApiSuccess", {
-			url: p,
-			method: m,
-			...W
-		}) : V && F.interactionTrigger(C, "onApiError", {
+	s(() => {
+		!W && S && Z && P.interactionTrigger(S, Z === "success" ? "onApiSuccess" : "onApiError", {
 			url: p,
 			method: m,
-			...W
-		}));
+			...U
+		});
 	}, [
+		U,
+		S,
+		P,
 		W,
-		C,
-		F,
-		V,
-		G,
-		B,
 		m,
+		Z,
 		p
 	]);
-	let Q = r(() => ({
-		...W,
-		...Array.isArray(q.records) ? { records: J } : o,
-		isLoading: G || Y,
-		isEmpty: b ? q.record === void 0 : J.length === 0,
-		hasError: U,
-		errorMessage: U ? "The data provider could not be reached" : "",
+	let Q = c(() => ({
+		...U,
+		...Array.isArray(K.records) ? { records: q } : l,
+		isLoading: W || J,
+		isEmpty: x ? K.record === void 0 : q.length === 0,
+		hasError: H,
+		errorMessage: H ? "The data provider could not be reached" : "",
 		isStale: E && O
 	}), [
+		U,
+		K.records,
+		K.record,
+		q,
 		W,
-		q.records,
-		q.record,
 		J,
-		G,
-		Y,
-		b,
-		U,
+		x,
+		H,
 		E,
 		O
-	]), De = n(() => oe(Q), [Q]);
-	ue({
-		id: C,
+	]), je = o(() => i(Q), [Q]);
+	fe({
+		id: S,
 		source: M,
-		name: T || `API - ${C}`,
-		fields: De
+		name: w || `API - ${S}`,
+		fields: je
 	});
 	let { writeRecord: $ } = ae({
-		elementId: C,
+		elementId: S,
 		enabled: E,
-		onDone: K
-	}), Oe = r(() => {
+		onDone: G
+	}), Me = c(() => {
 		let e = {
 			performQuery: {
-				action: "performQuery",
-				title: `Perform Query ${T}`,
-				type: "callback",
-				callback: K,
-				preview: {},
-				params: {}
+				...n.callbacks.performQuery,
+				title: `Perform Query ${w}`,
+				callback: G
 			},
 			loadMore: {
-				action: "loadMore",
-				title: `Load More ${T}`,
-				type: "callback",
-				callback: Z,
-				preview: {},
-				params: {}
+				...n.callbacks.loadMore,
+				title: `Load More ${w}`,
+				callback: X
 			},
 			goToPage: {
-				action: "goToPage",
-				title: `Go To Page ${T}`,
-				type: "callback",
-				callback: ({ page: e }) => X(Number(e) || 1),
-				preview: {},
-				params: { page: {
-					label: "Page",
-					defaultValue: "1",
-					type: "text"
-				} }
+				...n.callbacks.goToPage,
+				title: `Go To Page ${w}`,
+				callback: ({ page: e }) => Y(Number(e) || 1)
 			}
 		};
 		return E && (e.writeRecord = {
-			action: "writeRecord",
-			title: `Write Record ${T}`,
-			type: "callback",
-			callback: $,
-			preview: { action: "create" },
-			params: {
-				action: {
-					label: "Endpoint",
-					defaultValue: "create",
-					type: "text"
-				},
-				recordId: {
-					label: "Record Id",
-					defaultValue: "",
-					type: "text"
-				}
-			}
+			...n.callbacks.writeRecord,
+			title: `Write Record ${w}`,
+			callback: $
 		}), e;
 	}, [
-		T,
-		K,
-		Z,
+		w,
+		G,
 		X,
+		Y,
 		E,
 		$
-	]), ke = r(() => ({
-		onApiError: {
-			action: "onApiError",
-			title: "On Api Error",
-			type: "trigger",
-			params: {},
-			preview: {
-				url: "",
-				method: "",
-				status: "",
-				data: ""
-			}
-		},
-		onApiSuccess: {
-			action: "onApiSuccess",
-			title: "On Api Success",
-			type: "trigger",
-			params: {},
-			preview: {
-				url: "",
-				method: "",
-				status: "",
-				data: ""
-			}
-		}
-	}), []), Ae = r(() => M ? { runtime: { sources: { [M]: Q } } } : o, [Q, M]);
-	return /* @__PURE__ */ s(t, {
+	]), Ne = c(() => M ? { runtime: { sources: { [M]: Q } } } : l, [Q, M]);
+	return /* @__PURE__ */ u(te, {
 		ref: e,
-		tag: !N && !ve?.length ? "div" : y,
-		className: l("plitzi-component__api-container", d),
-		interactionTriggers: ke,
-		interactionCallbacks: Oe,
-		children: (!Te || me) && /* @__PURE__ */ s(a, {
+		tag: !N && !T?.length ? "div" : y,
+		className: ue("plitzi-component__api-container", d),
+		interactionTriggers: n.triggers,
+		interactionCallbacks: Me,
+		children: (!ke || ge) && /* @__PURE__ */ u(ce, {
 			inherit: "live",
-			name: `Api:${C}`,
-			value: Ae,
+			name: `Api:${S}`,
+			value: Ne,
 			children: f
 		})
 	});

package/dist/elements/provider/ApiContainer/Settings.d.ts

@@ -24,7 +24,8 @@ type SettingsProps = {
     cache?: boolean;
     staleTime?: number | string;
     gcTime?: number | string;
+    refreshSeconds?: number | string;
     onUpdate?: (key: string, value: string | boolean | number | object, isDefinition?: boolean) => void;
 };
-declare const Settings: ({ query, method, accessToken, headers, when, subType, mockData, credentials, runtime, connector, action, endpoint, resource, limit, singleRecord, filters, pagination, pageParam, renderWhileLoading, cache, staleTime, gcTime, onUpdate }: SettingsProps) => import("react").JSX.Element;
+declare const Settings: ({ query, method, accessToken, headers, when, subType, mockData, credentials, runtime, connector, action, endpoint, resource, limit, singleRecord, filters, pagination, pageParam, renderWhileLoading, cache, staleTime, gcTime, refreshSeconds, onUpdate }: SettingsProps) => import('react').JSX.Element;
 export default Settings;