@plitzi/sdk-elements 0.34.1 → 0.35.2

package/CHANGELOG.md

@@ -1,5 +1,77 @@
 # @plitzi/sdk-elements
 
+## 0.35.2
+
+### Minor Changes
+
+- 470aaf8: A booking form can ask for a date, and a toggle can say it is one.
+
+  - **`formControl` accepts `subType: 'date'`.** It renders the browser's own date picker and submits `YYYY-MM-DD`, so
+    a flow or a server action reads one format whatever the visitor's locale. Until now a date was a free text field
+    and every form that needed one parsed whatever somebody typed. Offered in the builder's Input Type list.
+  - **`button` accepts `ariaExpanded` and `ariaPressed`.** A button that opens a menu or an answer, or one that stays on
+    like a filter, can tell assistive technology so — statically, or bound to the state it flips
+    (`bind: { ariaExpanded: 'state.menuOpen' }`). Left out, neither attribute is rendered: an ordinary button does not
+    claim to control anything.
+
+- 470aaf8: The theme is a data source, and a binding reads every source its template names.
+
+  - **`theme` global source.** `GlobalSources` publishes `runtime.sources.theme` as `{ mode, resolved }` for the area
+    the space paints in. `resolved` is always `light` or `dark`, so `{{ theme.resolved }}` is what a URL or a `when`
+    rule wants — a dashboard asking the API for a thumbnail in the visitor's scheme, for one. The comments that promised
+    `{{ theme.resolved }}` through the app store's `theme` mirror were wrong: nothing a binding reads lives there.
+  - **A binding subscribes to the roots of its `twigTemplate`.** It used to get only the head of its `source`, so a
+    binding on `list_spaces.item.id` whose template also said `{{ theme.resolved }}` or `{{ state.scope }}` resolved the
+    second name to nothing, silently. The names are read off the parsed template (`templateRootNames`, exported from
+    `@plitzi/sdk-shared/helpers/twigWrapper`). A name that is not a source is left out of the map rather than set to
+    `undefined`, so `{{ source }}` and the variables lifted to the template's root are never shadowed.
+  - **Authoring.** `theme` joins `GLOBAL_SOURCES`: `bind: { src: 'theme.resolved' }` is accepted, and an element can no
+    longer be named `theme`.
+
+### Patch Changes
+
+- v0.35.2
+- Updated dependencies
+- Updated dependencies [470aaf8]
+  - @plitzi/sdk-auth@0.35.2
+  - @plitzi/sdk-dev-tools@0.35.2
+  - @plitzi/sdk-event-bridge@0.35.2
+  - @plitzi/sdk-interactions@0.35.2
+  - @plitzi/sdk-navigation@0.35.2
+  - @plitzi/sdk-schema@0.35.2
+  - @plitzi/sdk-shared@0.35.2
+
+## 0.35.1
+
+### Patch Changes
+
+- v0.35.1
+- Updated dependencies
+  - @plitzi/sdk-auth@0.35.1
+  - @plitzi/sdk-dev-tools@0.35.1
+  - @plitzi/sdk-event-bridge@0.35.1
+  - @plitzi/sdk-interactions@0.35.1
+  - @plitzi/sdk-navigation@0.35.1
+  - @plitzi/sdk-schema@0.35.1
+  - @plitzi/sdk-shared@0.35.1
+
+## 0.35.0
+
+### Minor Changes
+
+- v0.35.0
+
+### Patch Changes
+
+- Updated dependencies
+  - @plitzi/sdk-auth@0.35.0
+  - @plitzi/sdk-dev-tools@0.35.0
+  - @plitzi/sdk-event-bridge@0.35.0
+  - @plitzi/sdk-interactions@0.35.0
+  - @plitzi/sdk-navigation@0.35.0
+  - @plitzi/sdk-schema@0.35.0
+  - @plitzi/sdk-shared@0.35.0
+
 ## 0.34.1
 
 ### Patch Changes

package/dist/Element/hooks/useElementDataSource.mjs

@@ -1,23 +1,27 @@
 import { useMemo as e } from "react";
 import { useCommonStore as t } from "@plitzi/sdk-shared/store";
+import { templateRootNames as n } from "@plitzi/sdk-shared/helpers/twigWrapper";
 //#region src/Element/hooks/useElementDataSource.ts
-var n = ({ bindings: n, sources: r }) => {
-	let i = e(() => {
-		let e = new Set(r ?? []);
-		for (let t of Object.values(n ?? {})) if (Array.isArray(t)) {
-			for (let { source: n } of t) if (n) {
-				let t = n.indexOf(".");
-				e.add(t > -1 ? n.substring(0, t) : n);
-			}
-		}
+var r = ({ source: e, transformers: t }) => {
+	let r = [];
+	if (e) {
+		let t = e.indexOf(".");
+		r.push(t > -1 ? e.substring(0, t) : e);
+	}
+	for (let { action: e, params: i } of t ?? []) e === "twigTemplate" && i.template && r.push(...n(i.template));
+	return r;
+}, i = ({ bindings: n, sources: i }) => {
+	let a = e(() => {
+		let e = new Set(i ?? []);
+		for (let t of Object.values(n ?? {})) if (Array.isArray(t)) for (let n of t) for (let t of r(n)) e.add(t);
 		return e.size > 0 && !e.has("variables") && e.add("variables"), [...e];
-	}, [n, r]), a = e(() => i.map((e) => `runtime.sources.${e}`), [i]), [o] = t(a);
+	}, [n, i]), o = e(() => a.map((e) => `runtime.sources.${e}`), [a]), [s] = t(o);
 	return e(() => {
 		let e = {};
-		return i.forEach((t, n) => {
-			e[t] = o[n];
+		return a.forEach((t, n) => {
+			s[n] !== void 0 && (e[t] = s[n]);
 		}), e;
-	}, [i, o]);
+	}, [a, s]);
 };
 //#endregion
-export { n as default };
+export { i as default };

package/dist/dataSource/GlobalSources.mjs

@@ -2,67 +2,68 @@ import { use as e, useCallback as t, useMemo as n } from "react";
 import { useCommonStore as r, useCommonStoreSync as i, useRenderSettings as a } from "@plitzi/sdk-shared/store";
 import { get as o } from "@plitzi/plitzi-ui/helpers";
 import { getPathsFromObeject as s } from "@plitzi/sdk-shared/helpers/utils";
-import c from "@plitzi/sdk-shared/dataSource/hooks/useRegisterSource";
-import l from "@plitzi/sdk-auth/AuthContext";
-import { resolveVariables as u } from "@plitzi/sdk-shared/dataSource";
+import c, { SPACE_THEME_AREA as l } from "@plitzi/sdk-shared/theme/useTheme";
+import u from "@plitzi/sdk-shared/dataSource/hooks/useRegisterSource";
+import d from "@plitzi/sdk-auth/AuthContext";
+import { resolveVariables as f } from "@plitzi/sdk-shared/dataSource";
 //#region src/dataSource/GlobalSources.tsx
-var d = ({ children: d }) => {
-	let { environment: f } = a(), [[p, m, h, g, _, v]] = r([
+var p = ({ children: p }) => {
+	let { environment: m } = a(), [[h, g, _, v, y, b]] = r([
 		"schema.variables",
 		"navigation.routeParams",
 		"navigation.queryParams",
 		"navigation.hostname",
 		"navigation.origin",
 		"navigation.currentPageId"
-	]), y = n(() => u(p, {
-		routeParams: m,
-		queryParams: h,
-		hostname: g,
-		environment: f
+	]), x = n(() => f(h, {
+		routeParams: g,
+		queryParams: _,
+		hostname: v,
+		environment: m
 	}), [
-		f,
-		g,
-		h,
 		m,
-		p
-	]), b = t(() => s(y).map((e) => ({
+		v,
+		_,
+		g,
+		h
+	]), S = t(() => s(x).map((e) => ({
 		path: e,
 		name: `variables.${e}`
-	})), [y]);
-	c({
+	})), [x]);
+	u({
 		id: "global",
 		source: "variables",
 		name: "Variables",
-		fields: b
-	}), i("runtime.sources.variables", y);
-	let [x = {}] = r("pageDefinitions"), S = n(() => Object.values(x).map((e) => ({
+		fields: S
+	}), i("runtime.sources.variables", x);
+	let [C = {}] = r("pageDefinitions"), w = n(() => Object.values(C).map((e) => ({
 		value: e.id,
 		label: o(e, "attributes.name", e.id)
-	})), [x]), C = n(() => ({
-		routeParams: m,
-		queryParams: h,
-		origin: _,
-		currentPageId: v
+	})), [C]), T = n(() => ({
+		routeParams: g,
+		queryParams: _,
+		origin: y,
+		currentPageId: b
 	}), [
-		m,
-		h,
+		g,
 		_,
-		v
-	]), w = t(() => {
+		y,
+		b
+	]), E = t(() => {
 		let e = s({
-			routeParams: m,
-			queryParams: h
+			routeParams: g,
+			queryParams: _
 		}).map((e) => ({
 			path: e,
 			name: `navigation.${e}`
 		})), t = {
 			path: "origin",
 			name: "Origin"
-		}, n = S.length > 0 ? {
+		}, n = w.length > 0 ? {
 			path: "currentPageId",
 			name: "Current Page",
 			inputType: "select",
-			values: S
+			values: w
 		} : {
 			path: "currentPageId",
 			name: "Current Page"
@@ -73,61 +74,74 @@ var d = ({ children: d }) => {
 			n
 		];
 	}, [
-		m,
-		h,
-		S
+		g,
+		_,
+		w
 	]);
-	c({
+	u({
 		id: "global",
 		source: "navigation",
 		name: "Navigation",
-		fields: w
-	}), i("runtime.sources.navigation", C);
-	let { user: T, authenticated: E } = e(l), [D = "basic"] = r("schema.settings.userProvider"), O = n(() => D === "" ? {} : {
-		isAuthenticated: E,
-		accessToken: T?.accessToken ?? "",
+		fields: E
+	}), i("runtime.sources.navigation", T);
+	let { user: D, authenticated: O } = e(d), [k = "basic"] = r("schema.settings.userProvider"), A = n(() => k === "" ? {} : {
+		isAuthenticated: O,
+		accessToken: D?.accessToken ?? "",
 		details: {
 			username: "",
 			email: "",
 			roles: "",
 			permissions: "",
 			verified: "",
-			...T?.details ?? {}
+			...D?.details ?? {}
 		}
 	}, [
+		k,
 		D,
-		T,
-		E
-	]), k = t(() => s(O).map((e) => ({
+		O
+	]), j = t(() => s(A).map((e) => ({
 		path: e,
 		name: `user.${e}`
-	})), [O]);
-	c({
+	})), [A]);
+	u({
 		id: "global",
 		source: "auth",
 		name: "Auth State",
-		fields: k
-	}), i("runtime.sources.auth", O);
-	let [A] = r("runtime.state"), j = t(() => s(A).map((e) => ({
+		fields: j
+	}), i("runtime.sources.auth", A);
+	let [M] = r("runtime.state"), N = t(() => s(M).map((e) => ({
 		path: e,
 		name: `state.${e}`
-	})), [A]);
-	c({
+	})), [M]);
+	u({
 		id: "global",
 		source: "state",
 		name: "State",
-		fields: j
-	}), i("runtime.sources.state", A);
-	let [M] = r("runtime.host"), N = t(() => s(M).map((e) => ({
+		fields: N
+	}), i("runtime.sources.state", M);
+	let [P] = r("runtime.host"), F = t(() => s(P).map((e) => ({
 		path: e,
 		name: `host.${e}`
-	})), [M]);
-	return c({
+	})), [P]);
+	u({
 		id: "global",
 		source: "host",
 		name: "Host",
-		fields: N
-	}), i("runtime.sources.host", M), d;
+		fields: F
+	}), i("runtime.sources.host", P);
+	let { theme: I, resolvedTheme: L } = c(l), R = n(() => ({
+		mode: I,
+		resolved: L
+	}), [I, L]), z = t(() => s(R).map((e) => ({
+		path: e,
+		name: `theme.${e}`
+	})), [R]);
+	return u({
+		id: "global",
+		source: "theme",
+		name: "Theme",
+		fields: z
+	}), i("runtime.sources.theme", R), p;
 };
 //#endregion
-export { d as default };
+export { p as default };

package/dist/elements/basic/Button/Button.d.ts

@@ -7,8 +7,17 @@ export type ButtonProps = {
     content?: string;
     subType?: 'button' | 'submit' | 'reset';
     disabled?: boolean;
+    /**
+     * For a button that shows and hides something — a menu, an answer, a panel: `true` while that is open.
+     *
+     * Left out, the button claims to control nothing, which is not the same as `false` ("it controls something, and it
+     * is closed"). A screen reader announces the difference, so an ordinary button must not get a default here.
+     */
+    ariaExpanded?: boolean;
+    /** For a button that stays on or off — a filter, a mode: `true` while it is on. Left out, it is a plain button. */
+    ariaPressed?: boolean;
 };
-declare const Button: ({ ref, className, children, contentPlacement, content, subType, disabled }: ButtonProps) => import("react").JSX.Element;
+declare const Button: ({ ref, className, children, contentPlacement, content, subType, disabled, ariaExpanded, ariaPressed }: ButtonProps) => import("react").JSX.Element;
 declare const _default: {
     (props: import('../../../Element/hocs/withElement').WithElementProps<ButtonProps>): import("react").JSX.Element;
     displayName: string;

package/dist/elements/basic/Button/Button.mjs

@@ -6,15 +6,17 @@ import i from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
 import { jsxs as a } from "react/jsx-runtime";
 import o from "clsx";
 //#region src/elements/basic/Button/Button.tsx
-var s = ({ ref: e, className: s = "", children: c, contentPlacement: l = "after", content: u = "Button", subType: d = "button", disabled: f = !1 }) => {
-	let { definition: { label: p } } = t(), { settings: { previewMode: m } } = i(), h = r(() => typeof u == "string" ? u : p, [u, p]);
+var s = ({ ref: e, className: s = "", children: c, contentPlacement: l = "after", content: u = "Button", subType: d = "button", disabled: f = !1, ariaExpanded: p, ariaPressed: m }) => {
+	let { definition: { label: h } } = t(), { settings: { previewMode: g } } = i(), _ = r(() => typeof u == "string" ? u : h, [u, h]);
 	return /* @__PURE__ */ a(n, {
 		ref: e,
 		tag: "button",
-		type: m ? d : "button",
-		className: o("plitzi-component__button", s, { "container--empty--skip": !m && !c && u }),
+		type: g ? d : "button",
+		className: o("plitzi-component__button", s, { "container--empty--skip": !g && !c && u }),
 		disabled: f,
-		"aria-label": h,
+		"aria-label": _,
+		"aria-expanded": p,
+		"aria-pressed": m,
 		children: [
 			l === "before" && u,
 			c,

package/dist/elements/basic/Button/declaration.d.ts

@@ -123,5 +123,7 @@ declare const declaration: {
     disabled?: boolean | undefined;
     subType?: "button" | "submit" | "reset" | undefined;
     contentPlacement?: "before" | "after" | undefined;
+    ariaExpanded?: boolean | undefined;
+    ariaPressed?: boolean | undefined;
 }>>;
 export default declaration;

package/dist/elements/basic/Button/index.d.ts

@@ -122,5 +122,7 @@ declare const Button: {
     disabled?: boolean | undefined;
     subType?: "button" | "submit" | "reset" | undefined;
     contentPlacement?: "before" | "after" | undefined;
+    ariaExpanded?: boolean | undefined;
+    ariaPressed?: boolean | undefined;
 }>>;
 export default Button;

package/dist/elements/declarations/index.d.ts

@@ -320,6 +320,8 @@ export declare const elementDeclarations: {
         disabled?: boolean | undefined;
         subType?: "button" | "submit" | "reset" | undefined;
         contentPlacement?: "before" | "after" | undefined;
+        ariaExpanded?: boolean | undefined;
+        ariaPressed?: boolean | undefined;
     }>>;
     readonly Container: {
         readonly type: "container";

package/dist/elements/form/FormControl/FormControl.d.ts

@@ -2,7 +2,7 @@ import { ChangeEvent, RefObject } from 'react';
 export type FormControlProps = {
     ref: RefObject<HTMLElement>;
     className: string;
-    subType: 'text' | 'number' | 'email' | 'password' | 'time' | 'checkbox' | 'switch' | 'select' | 'textarea' | 'hidden';
+    subType: 'text' | 'number' | 'email' | 'password' | 'date' | 'time' | 'checkbox' | 'switch' | 'select' | 'textarea' | 'hidden';
     name: string;
     label: string;
     placeholder: string;

package/dist/elements/form/FormControl/FormControl.mjs

@@ -105,6 +105,7 @@ var y = ({ ref: e, className: i = "", subType: y = "text", name: b = "", label:
 				"number",
 				"email",
 				"password",
+				"date",
 				"time"
 			].includes(y) && /* @__PURE__ */ g(s, {
 				id: `${P}_${N}`,

package/dist/elements/form/FormControl/Settings.d.ts

@@ -1,5 +1,5 @@
 type SettingsProps = {
-    subType?: 'text' | 'number' | 'time' | 'email' | 'password' | 'select' | 'checkbox' | 'textarea' | 'hidden' | 'color' | 'switch';
+    subType?: 'text' | 'number' | 'date' | 'time' | 'email' | 'password' | 'select' | 'checkbox' | 'textarea' | 'hidden' | 'color' | 'switch';
     name?: string;
     label?: string;
     placeholder?: string;

package/dist/elements/form/FormControl/Settings.mjs

@@ -59,6 +59,10 @@ var c = (e) => {
 						value: "number",
 						children: "Number"
 					}),
+					/* @__PURE__ */ n("option", {
+						value: "date",
+						children: "Date"
+					}),
 					/* @__PURE__ */ n("option", {
 						value: "time",
 						children: "Time"

package/dist/elements/form/FormControl/hocs/withFieldValue.d.ts

@@ -3,7 +3,7 @@ export type WithFieldValueProps<T> = {
     ref: RefObject<HTMLElement>;
     name: string;
     defaultValue?: string;
-    subType: 'hidden' | 'text' | 'number' | 'email' | 'password' | 'select' | 'checkbox' | 'textarea' | 'color' | 'switch';
+    subType: 'hidden' | 'text' | 'number' | 'email' | 'password' | 'date' | 'time' | 'select' | 'checkbox' | 'textarea' | 'color' | 'switch';
     required: boolean;
     minLength?: number;
     maxLength?: number;

package/dist/index.d.ts

@@ -1979,6 +1979,8 @@ export declare const defaultElements: {
         disabled?: boolean | undefined;
         subType?: "button" | "submit" | "reset" | undefined;
         contentPlacement?: "before" | "after" | undefined;
+        ariaExpanded?: boolean | undefined;
+        ariaPressed?: boolean | undefined;
     }>>;
     paragraph: {
         (props: import('./Element/hocs/withElement').WithElementProps<import('./elements/basic/Paragraph/Paragraph').ParagraphProps>): import("react").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plitzi/sdk-elements",
-  "version": "0.34.1",
+  "version": "0.35.2",
   "license": "AGPL-3.0",
   "files": [
     "dist"
@@ -986,13 +986,13 @@
   "dependencies": {
     "@plitzi/nexus": "^1.1.4",
     "@plitzi/plitzi-ui": "^1.6.21",
-    "@plitzi/sdk-auth": "0.34.1",
-    "@plitzi/sdk-dev-tools": "0.34.1",
-    "@plitzi/sdk-event-bridge": "0.34.1",
-    "@plitzi/sdk-interactions": "0.34.1",
-    "@plitzi/sdk-navigation": "0.34.1",
-    "@plitzi/sdk-schema": "0.34.1",
-    "@plitzi/sdk-shared": "0.34.1",
+    "@plitzi/sdk-auth": "0.35.2",
+    "@plitzi/sdk-dev-tools": "0.35.2",
+    "@plitzi/sdk-event-bridge": "0.35.2",
+    "@plitzi/sdk-interactions": "0.35.2",
+    "@plitzi/sdk-navigation": "0.35.2",
+    "@plitzi/sdk-schema": "0.35.2",
+    "@plitzi/sdk-shared": "0.35.2",
     "clsx": "^2.1.1",
     "immer": "^11.1.18"
   },