@plitzi/sdk-elements 0.38.3 → 0.38.5

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

@@ -7,203 +7,220 @@ import { isEmptyAnswer as ne } from "./helpers/isEmptyAnswer.mjs";
 import { childrenWhile as re } from "./helpers/loadingSlot.mjs";
 import ie from "./helpers/providerOutcome.mjs";
 import { queryInputOf as ae } from "./helpers/queryInput.mjs";
-import r from "./hooks/useApi.mjs";
-import i from "./hooks/useAutoRefresh.mjs";
-import oe from "./hooks/useProviderPagination.mjs";
-import se from "./hooks/useProviderWrite.mjs";
-import ce from "../../../dataSource/pathFields.mjs";
-import { use as le, useCallback as a, useEffect as ue, useMemo as o, useRef as de } from "react";
-import fe from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
-import { useSdkStore as pe } from "@plitzi/sdk-shared/store";
-import { StoreProvider as s } from "@plitzi/nexus/react";
-import { emptyObject as c } from "@plitzi/sdk-shared/helpers/utils";
-import { jsx as l } from "react/jsx-runtime";
-import { currentRscLocation as me } from "@plitzi/sdk-shared/server/rsc/refreshRsc";
-import he from "clsx";
-import ge from "@plitzi/sdk-shared/dataSource/helpers/getSourceName";
-import _e from "@plitzi/sdk-shared/dataSource/hooks/useRegisterSource";
-import { QueryBuilderEvaluator as ve } from "@plitzi/plitzi-ui/QueryBuilder";
+import { serverMock as oe } from "./helpers/serverMock.mjs";
+import se from "./hooks/useApi.mjs";
+import ce from "./hooks/useAutoRefresh.mjs";
+import le from "./hooks/useInputRefresh.mjs";
+import ue from "./hooks/useProviderPagination.mjs";
+import de from "./hooks/useProviderWrite.mjs";
+import fe from "../../../dataSource/pathFields.mjs";
+import { use as pe, useCallback as r, useEffect as me, useMemo as i, useRef as a } from "react";
+import he from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
+import { useCommonStore as ge, useSdkStore as _e } from "@plitzi/sdk-shared/store";
+import { StoreProvider as ve } 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 ye } from "@plitzi/sdk-shared/server/rsc/refreshRsc";
+import be from "clsx";
+import xe from "@plitzi/sdk-shared/dataSource/helpers/getSourceName";
+import Se from "@plitzi/sdk-shared/dataSource/hooks/useRegisterSource";
+import { QueryBuilderEvaluator as Ce } from "@plitzi/plitzi-ui/QueryBuilder";
 //#region src/elements/provider/ApiContainer/ApiContainer.tsx
-var u = ({ ref: e, className: u = "", children: d, query: f = "", method: p = "get", accessToken: m = "", when: h = c, headers: g = c, mockData: _ = "{}", subType: ye = "", credentials: be = "same-origin", singleRecord: v = !1, pagination: xe = "none", pageParam: Se = "page", renderWhileLoading: Ce = !1, loadingSlot: y = "", cache: we = !1, staleTime: Te = 30, gcTime: Ee = 300, refreshSeconds: De = 0 }) => {
-	let { id: b, visible: x, definition: { label: S = "Api Container", runtime: Oe, items: ke } } = t(), C = Oe === "server", { loaded: w, stale: T, location: E, elementData: D, refresh: O } = ee(), k = ge(n.sourceType, b), { settings: { previewMode: A }, contexts: { InteractionsContext: Ae } } = fe(), { interactionsManager: j } = le(Ae), [[M, N, je]] = pe([
+var c = ({ ref: e, className: c = "", children: l, query: u = "", method: d = "get", accessToken: f = "", when: p = o, headers: m = o, mockData: h = "{}", subType: we = "", credentials: Te = "same-origin", singleRecord: g = !1, pagination: Ee = "none", pageParam: De = "page", renderWhileLoading: Oe = !1, loadingSlot: _ = "", cache: ke = !1, staleTime: Ae = 30, gcTime: je = 300, refreshSeconds: Me = 0, connector: Ne = "", action: Pe = "", input: Fe }) => {
+	let { id: v, visible: y, definition: { label: b = "Api Container", runtime: Ie, items: Le } } = t(), x = Ie === "server", { loaded: S, stale: C, location: w, elementData: T, refreshing: Re, refresh: E, cancel: D } = ee(), O = xe(n.sourceType, v), { settings: { previewMode: k }, contexts: { InteractionsContext: ze } } = he(), { interactionsManager: A } = pe(ze), [[j, M, Be]] = _e([
 		"navigation.routeParams",
 		"navigation.queryParams",
 		"navigation.navigate"
-	]), Me = o(() => m ? {
-		...g,
-		Authorization: `Bearer ${m}`
-	} : g, [g, m]), P = o(() => C || !x ? !1 : !!(A && f && (h === c || ve(h, {
-		...M,
-		...N
-	})) || !A && (f || _ && _ !== "{}" && _ !== c)), [
-		C,
+	]), Ve = i(() => f ? {
+		...m,
+		Authorization: `Bearer ${f}`
+	} : m, [m, f]), N = i(() => x || !y ? !1 : !!(k && u && (p === o || Ce(p, {
+		...j,
+		...M
+	})) || !k && (u || h && h !== "{}" && h !== o)), [
 		x,
-		A,
-		f,
-		h,
+		y,
+		k,
+		u,
+		p,
+		j,
 		M,
-		N,
-		_
-	]), Ne = o(() => [b], [b]), { isLoading: Pe, isFetching: Fe, data: F, refetch: I, isSuccess: Ie, isError: Le } = r({
-		url: f,
-		method: p,
-		credentials: be,
-		mock: A ? void 0 : _,
-		customHeaders: Me,
-		enabled: P,
-		cache: we,
-		staleTime: Te,
-		gcTime: Ee,
-		tags: Ne
-	}), L = C && !!E && E !== me(), R = C && w && !L && D === null, z = o(() => {
-		if (!C) return F ?? c;
-		if (D) return D;
-		if (w) return c;
-		if (typeof _ != "string") return _;
-		try {
-			return JSON.parse(_ || "{}");
-		} catch {
-			return c;
+		h
+	]), He = i(() => [v], [v]), { isLoading: Ue, isFetching: We, data: P, refetch: F, cancel: I, isSuccess: Ge, isError: Ke } = se({
+		url: u,
+		method: d,
+		credentials: Te,
+		mock: k ? void 0 : h,
+		customHeaders: Ve,
+		enabled: N,
+		cache: ke,
+		staleTime: Ae,
+		gcTime: je,
+		tags: He
+	}), L = x && !!w && w !== ye(), R = x && S && !L && T === null, z = x && !Ne && !Pe, B = i(() => x ? T || (S ? o : oe(h, z)) : P ?? o, [
+		x,
+		P,
+		T,
+		S,
+		h,
+		z
+	]), V = x ? L || Re : We, H = x ? L : Ue, U = a({}), W = r((e, t) => E(e, {
+		...U.current,
+		...t
+	}), [E]), G = r(async () => {
+		if (!x) {
+			F();
+			return;
 		}
+		await W([v]);
 	}, [
-		C,
+		x,
 		F,
-		D,
-		w,
-		_
-	]), B = C ? L : Fe, V = C ? L : Pe, H = de({}), U = a((e, t) => O(e, {
-		...H.current,
-		...t
-	}), [O]), W = a(async () => {
-		if (!C) {
-			I();
+		W,
+		v
+	]), K = r(async ({ input: e } = {}) => {
+		let t = ae(e);
+		t && (U.current = t), await G();
+	}, [G]), q = r(() => {
+		if (x) {
+			D();
 			return;
 		}
-		await U([b]);
+		I();
 	}, [
-		C,
-		I,
-		U,
-		b
-	]), G = a(async ({ input: e } = {}) => {
-		let t = ae(e);
-		t && (H.current = t), await W();
-	}, [W]);
-	i({
-		seconds: De,
-		enabled: x && (C ? w && !L : P),
-		refresh: W
+		x,
+		D,
+		I
+	]), [qe] = ge(`schema.flat.${v}.attributes.input`, { mode: "mount" });
+	le({
+		enabled: x && S,
+		input: Fe,
+		savedInput: qe,
+		performQuery: K
+	}), ce({
+		seconds: Me,
+		enabled: y && (x ? S && !L : N),
+		refresh: G
 	});
-	let K = z, Re = o(() => Array.isArray(K.records) ? K.records : [], [K.records]), { records: q, isLoadingMore: J, goToPage: Y, loadMore: X } = oe({
-		elementId: b,
-		mode: xe,
-		pageParam: Se,
-		records: Re,
-		page: K.pageInfo?.page ?? 1,
-		refresh: U,
-		navigate: je
-	}), Z = ie({
-		serverMode: C,
-		isSuccess: Ie,
-		isError: Le,
-		rscResolved: w,
+	let J = B, Je = i(() => Array.isArray(J.records) ? J.records : [], [J.records]), { records: Y, isLoadingMore: Ye, goToPage: Xe, loadMore: Ze } = ue({
+		elementId: v,
+		mode: Ee,
+		pageParam: De,
+		records: Je,
+		page: J.pageInfo?.page ?? 1,
+		refresh: W,
+		navigate: Be
+	}), X = ie({
+		serverMode: x,
+		isSuccess: Ge,
+		isError: Ke,
+		rscResolved: S,
 		rscPending: L,
-		elementData: D
-	});
-	ue(() => {
-		!B && b && Z && j.interactionTrigger(b, Z === "success" ? "onApiSuccess" : "onApiError", {
-			url: f,
-			method: p,
-			...z
-		});
+		elementData: T
+	}), Z = a(void 0);
+	me(() => {
+		!V && v && X && (Z.current?.data !== B || Z.current.outcome !== X) && (Z.current = {
+			data: B,
+			outcome: X
+		}, A.interactionTrigger(v, X === "success" ? "onApiSuccess" : "onApiError", {
+			url: u,
+			method: d,
+			...B
+		}));
 	}, [
-		z,
-		b,
-		j,
 		B,
-		p,
-		Z,
-		f
+		v,
+		A,
+		V,
+		d,
+		X,
+		u
 	]);
-	let Q = o(() => ({
-		...z,
-		...Array.isArray(K.records) ? { records: q } : c,
-		isLoading: B || J,
-		isEmpty: ne(K, q, v),
+	let Q = i(() => ({
+		...B,
+		...Array.isArray(J.records) ? { records: Y } : o,
+		isLoading: V || Ye,
+		isEmpty: ne(J, Y, g),
 		hasError: R,
 		errorMessage: R ? "The data provider could not be reached" : "",
-		isStale: C && T
+		isStale: x && C
 	}), [
-		z,
-		K.records,
-		K.record,
-		q,
 		B,
-		J,
-		v,
+		J.records,
+		J.record,
+		Y,
+		V,
+		Ye,
+		g,
 		R,
-		C,
-		T
-	]), ze = a(() => ce(Q), [Q]);
-	_e({
-		id: b,
-		source: k,
-		name: S || `API - ${b}`,
-		fields: ze
+		x,
+		C
+	]), Qe = r(() => fe(Q), [Q]);
+	Se({
+		id: v,
+		source: O,
+		name: b || `API - ${v}`,
+		fields: Qe
 	});
-	let { writeRecord: $ } = se({
-		elementId: b,
-		enabled: C,
-		onDone: W
-	}), Be = o(() => {
+	let { writeRecord: $ } = de({
+		elementId: v,
+		enabled: x,
+		onDone: G
+	}), $e = i(() => {
 		let e = {
 			performQuery: {
 				...n.callbacks.performQuery,
-				title: `Perform Query ${S}`,
-				callback: G
+				title: `Perform Query ${b}`,
+				callback: K
+			},
+			cancelQuery: {
+				...n.callbacks.cancelQuery,
+				title: `Cancel Query ${b}`,
+				callback: q
 			},
 			loadMore: {
 				...n.callbacks.loadMore,
-				title: `Load More ${S}`,
-				callback: X
+				title: `Load More ${b}`,
+				callback: Ze
 			},
 			goToPage: {
 				...n.callbacks.goToPage,
-				title: `Go To Page ${S}`,
-				callback: ({ page: e }) => Y(Number(e) || 1)
+				title: `Go To Page ${b}`,
+				callback: ({ page: e }) => Xe(Number(e) || 1)
 			}
 		};
-		return C && (e.writeRecord = {
+		return x && (e.writeRecord = {
 			...n.callbacks.writeRecord,
-			title: `Write Record ${S}`,
+			title: `Write Record ${b}`,
 			callback: $
 		}), e;
 	}, [
-		S,
-		G,
-		X,
-		Y,
-		C,
+		b,
+		K,
+		q,
+		Ze,
+		Xe,
+		x,
 		$
-	]), Ve = o(() => y && A ? re(d, y, V) : d, [
-		d,
-		V,
-		y,
-		A
-	]), He = o(() => k ? { runtime: { sources: { [k]: Q } } } : c, [Q, k]);
-	return /* @__PURE__ */ l(te, {
+	]), et = i(() => _ && k ? re(l, _, H) : l, [
+		l,
+		H,
+		_,
+		k
+	]), tt = i(() => O ? { runtime: { sources: { [O]: Q } } } : o, [Q, O]);
+	return /* @__PURE__ */ s(te, {
 		ref: e,
-		tag: !A && !ke?.length ? "div" : ye,
-		className: he("plitzi-component__api-container", u),
+		tag: !k && !Le?.length ? "div" : we,
+		className: be("plitzi-component__api-container", c),
 		interactionTriggers: n.triggers,
-		interactionCallbacks: Be,
-		children: (!V || Ce || y) && /* @__PURE__ */ l(s, {
+		interactionCallbacks: $e,
+		children: (!H || Oe || _) && /* @__PURE__ */ s(ve, {
 			inherit: "live",
-			name: `Api:${b}`,
-			value: He,
-			children: Ve
+			name: `Api:${v}`,
+			value: tt,
+			children: et
 		})
 	});
-}, d = e(u);
+}, l = e(c);
 //#endregion
-export { u as ApiContainer, d as default };
+export { c as ApiContainer, l as default };

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

@@ -1,15 +1,7 @@
 import { ApiContainerProps } from './ApiContainer';
 import { AuthorableAttributes } from '@plitzi/sdk-shared/authoring/declare';
 /** What this element can be authored with — its component's own props, minus what the runtime supplies. */
-export type ApiContainerAttributes = AuthorableAttributes<ApiContainerProps> & {
-    /**
-     * What this element asks of the action it names, on top of the page's own route and query params.
-     *
-     * Not a component prop, and it never will be: the action runs on the server, so this is read there and the
-     * element only ever sees what came back.
-     */
-    input?: Record<string, unknown>;
-};
+export type ApiContainerAttributes = AuthorableAttributes<ApiContainerProps>;
 declare const declaration: {
     readonly type: "apiContainer";
     readonly attributeValues: {
@@ -60,6 +52,13 @@ declare const declaration: {
                 };
             };
         };
+        readonly cancelQuery: {
+            readonly action: "cancelQuery";
+            readonly title: "Cancel Query";
+            readonly type: "callback";
+            readonly preview: {};
+            readonly params: {};
+        };
         readonly loadMore: {
             readonly action: "loadMore";
             readonly title: "Load More";
@@ -164,5 +163,34 @@ declare const declaration: {
         };
         readonly settings: {};
     };
-} & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<ApiContainerAttributes>;
+} & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
+    when?: import('@plitzi/sdk-shared').RuleGroup | undefined;
+    action?: string | undefined;
+    cache?: boolean | undefined;
+    endpoint?: string | undefined;
+    input?: (Record<string, unknown> | string) | undefined;
+    method?: "get" | "post" | "put" | "delete" | "patch" | undefined;
+    resource?: string | undefined;
+    headers?: Record<string, string> | undefined;
+    subType?: "div" | "header" | "footer" | "nav" | "main" | "section" | "article" | "aside" | "address" | "figure" | "" | undefined;
+    query?: string | undefined;
+    accessToken?: string | undefined;
+    mockData?: (Record<string, unknown> | string) | undefined;
+    credentials?: RequestCredentials | undefined;
+    connector?: string | undefined;
+    limit?: string | undefined;
+    singleRecord?: boolean | undefined;
+    filters?: {
+        field: string;
+        operator: string;
+        value: string;
+    }[] | undefined;
+    pagination?: import('./hooks/useProviderPagination').ProviderPagination | undefined;
+    pageParam?: string | undefined;
+    renderWhileLoading?: boolean | undefined;
+    loadingSlot?: string | undefined;
+    staleTime?: number | string | undefined;
+    gcTime?: number | string | undefined;
+    refreshSeconds?: number | string | undefined;
+}>>;
 export default declaration;

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

@@ -74,6 +74,13 @@ var n = e()({
 				description: "Values handed to a server-driven provider with its request, beside the page’s own route and query params — a search, a filter. Kept for the pages it loads after (`loadMore`, `goToPage`) until the next query."
 			} }
 		},
+		cancelQuery: {
+			action: "cancelQuery",
+			title: "Cancel Query",
+			type: "callback",
+			preview: {},
+			params: {}
+		},
 		loadMore: {
 			action: "loadMore",
 			title: "Load More",

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

@@ -0,0 +1,10 @@
+/**
+ * What a server provider renders from in the builder, which has no `/_rsc` to ask: its mock data, in the shape the
+ * server answers it with.
+ *
+ * A provider that only has a `query` is answered as a browser request publishes — `{ status, data }`, the body under
+ * `data` — so its mock is that body under `data` too: `<source>.data.<field>` in the browser, on the server and in the
+ * builder alike. A connector's or an action's answer is its own slice (`records`, an action's output), and so is its
+ * mock. Mock data that is not JSON renders nothing, as an empty answer would.
+ */
+export declare const serverMock: (mockData: Record<string, unknown> | string, queryShaped: boolean) => Record<string, unknown>;

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

@@ -0,0 +1,17 @@
+import { emptyObject as e } from "@plitzi/sdk-shared/helpers/utils";
+//#region src/elements/provider/ApiContainer/helpers/serverMock.ts
+var t = (t, n) => {
+	let r;
+	if (typeof t != "string") r = t;
+	else try {
+		r = JSON.parse(t || "{}");
+	} catch {
+		return e;
+	}
+	return n ? {
+		status: 200,
+		data: r
+	} : r;
+};
+//#endregion
+export { t as serverMock };

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

@@ -39,6 +39,8 @@ declare const useApi: ({ url, method, mock, customHeaders, enabled, credentials,
     isFetching: boolean;
     data: ApiResponse | undefined;
     refetch: () => void;
+    /** Stops the request in flight; the last answer stays on screen. */
+    cancel: () => void;
     /**
      * Whether THIS question has been answered — not whether an answer is on screen.
      *

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

@@ -94,6 +94,7 @@ var l = 30, u = 300, d = (e) => !!e && e !== "{}" && e !== i, f = (e) => {
 		isFetching: A,
 		data: k,
 		refetch: D.refetch,
+		cancel: D.cancel,
 		isSuccess: !w && !A && !!k && k.status < 400,
 		isError: !w && !A && !!k && k.status >= 400
 	};

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

@@ -0,0 +1,20 @@
+export type UseInputRefreshProps = {
+    /** A server provider whose payload has arrived: there is a question to ask again. */
+    enabled: boolean;
+    /** The input as it resolves now — bound to state, it changes as the visitor does. */
+    input: unknown;
+    /** The input the element was saved with: what the page server resolved the first paint with. */
+    savedInput: unknown;
+    performQuery: (options: {
+        input?: unknown;
+    }) => Promise<void>;
+};
+/**
+ * A bound `input` asks again when what it says changes.
+ *
+ * The first paint was resolved by the page server with the input the element was SAVED with — bindings to the
+ * visitor's state are not the server's to read — so that is what the first value is compared against: a binding that
+ * already says something else (a state kept from the last visit) asks at once.
+ */
+declare const useInputRefresh: ({ enabled, input, savedInput, performQuery }: UseInputRefreshProps) => void;
+export default useInputRefresh;

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

@@ -0,0 +1,16 @@
+import { queryInputOf as e } from "../helpers/queryInput.mjs";
+import { useEffect as t, useRef as n } from "react";
+//#region src/elements/provider/ApiContainer/hooks/useInputRefresh.ts
+var r = ({ enabled: r, input: i, savedInput: a, performQuery: o }) => {
+	let s = JSON.stringify(e(i) ?? {}), c = n(JSON.stringify(e(a) ?? {}));
+	t(() => {
+		r && s !== c.current && (c.current = s, o({ input: i }));
+	}, [
+		r,
+		s,
+		i,
+		o
+	]);
+};
+//#endregion
+export { r as default };

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

@@ -51,6 +51,13 @@ declare const ApiContainer: {
                 };
             };
         };
+        readonly cancelQuery: {
+            readonly action: "cancelQuery";
+            readonly title: "Cancel Query";
+            readonly type: "callback";
+            readonly preview: {};
+            readonly params: {};
+        };
         readonly loadMore: {
             readonly action: "loadMore";
             readonly title: "Load More";
@@ -155,5 +162,34 @@ declare const ApiContainer: {
         };
         readonly settings: {};
     };
-} & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<import('./declaration').ApiContainerAttributes>;
+} & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
+    when?: import('@plitzi/sdk-shared').RuleGroup | undefined;
+    action?: string | undefined;
+    cache?: boolean | undefined;
+    endpoint?: string | undefined;
+    input?: (Record<string, unknown> | string) | undefined;
+    method?: "get" | "post" | "put" | "delete" | "patch" | undefined;
+    resource?: string | undefined;
+    headers?: Record<string, string> | undefined;
+    subType?: "div" | "header" | "footer" | "nav" | "main" | "section" | "article" | "aside" | "address" | "figure" | "" | undefined;
+    query?: string | undefined;
+    accessToken?: string | undefined;
+    mockData?: (Record<string, unknown> | string) | undefined;
+    credentials?: RequestCredentials | undefined;
+    connector?: string | undefined;
+    limit?: string | undefined;
+    singleRecord?: boolean | undefined;
+    filters?: {
+        field: string;
+        operator: string;
+        value: string;
+    }[] | undefined;
+    pagination?: import('./hooks/useProviderPagination').ProviderPagination | undefined;
+    pageParam?: string | undefined;
+    renderWhileLoading?: boolean | undefined;
+    loadingSlot?: string | undefined;
+    staleTime?: number | string | undefined;
+    gcTime?: number | string | undefined;
+    refreshSeconds?: number | string | undefined;
+}>>;
 export default ApiContainer;

package/dist/elements/structure/Container/Container.d.ts

@@ -2,7 +2,7 @@ import { ReactNode, RefObject } from 'react';
 export type ContainerProps = {
     ref?: RefObject<HTMLElement>;
     className?: string;
-    subType?: 'div' | 'header' | 'footer' | 'nav' | 'main' | 'section' | 'article' | 'aside' | 'address' | 'figure' | 'dl' | 'dt' | 'dd' | 'li' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span';
+    subType?: 'div' | 'header' | 'footer' | 'nav' | 'main' | 'section' | 'article' | 'aside' | 'address' | 'figure' | 'dl' | 'dt' | 'dd' | 'li' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span';
     /**
      * The name of the part of the page this is — "Main navigation", "Search results", "Your cart" — for screen readers
      * and browser agents, which list the page by its landmarks and regions and jump between them.
@@ -17,9 +17,20 @@ export type ContainerProps = {
      * control inside it can still be tabbed to, and is then announced as nothing.
      */
     decorative?: boolean;
+    /**
+     * A part of the page whose words change while somebody is on it — a count, a total, a status — said aloud when they
+     * do (`aria-live`): `polite` once the reader is idle, `assertive` at once, for what cannot wait. Left out, a change is
+     * silent to a screen reader, which reads only what it is moved to.
+     */
+    live?: 'polite' | 'assertive' | '';
+    /**
+     * What a pointer resting on it shows — the whole of a value cut short, what a symbol means. Not a name: a screen reader
+     * may not say it, so what matters to someone who cannot hover is in the content or in `label` too.
+     */
+    title?: string;
     children?: ReactNode;
 };
-declare const Container: ({ ref, className, subType, label, decorative, children }: ContainerProps) => import('react').JSX.Element;
+declare const Container: ({ ref, className, subType, label, decorative, live, title, children }: ContainerProps) => import('react').JSX.Element;
 declare const _default: {
     (props: import('../../../Element/hocs/withElement').WithElementProps<ContainerProps>): import('react').JSX.Element;
     displayName: string;