@riverbankcms/sdk 0.145.0 → 0.147.0

package/dist/client/{form-Dodt8Y8t.mjs → form-Qf6qTbos.mjs}

@@ -1,10 +1,11 @@
 "use client";
-import { O as clsx } from "./colorStyles-CuJBiS-1.mjs";
-import { Ht as ok, Vt as err, t as defineIslandPropsDecoder, zt as assertNever } from "./propsDecoder-C3TP_z4x.mjs";
-import { n as useBlockApi, t as BlockApiProvider } from "./context-BFeY_Wbm.mjs";
+import { O as clsx } from "./colorStyles-j5U9v5JA.mjs";
+import { Ut as err, Vt as assertNever, Wt as ok, t as defineIslandPropsDecoder } from "./propsDecoder-CwvvNOHx.mjs";
+import { n as useBlockApi, t as BlockApiProvider } from "./context-C8TinPJc.mjs";
 import { n as isSpamProtectionEnabled, r as AltchaWidget, t as getChallengeUrl } from "./src-B833rYRr.mjs";
-import { t as ThemedButton } from "./ThemedButton-LAJTNrS8.mjs";
+import { t as ThemedButton } from "./ThemedButton-DoVIV1Ao.mjs";
 import { t as FeedbackMessage } from "./FeedbackMessage-CtLvvS_d.mjs";
+import { t as CheckboxChoice } from "./CheckboxChoice-B33MqoUo.mjs";
 import { t as mountReactIsland } from "./reactMount-SY8AVRof.mjs";
 import { useReducer, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -87,6 +88,136 @@ function useFormSubmission() {
 	};
 }
 //#endregion
+//#region ../blocks/src/system/runtime/nodes/form.fields.tsx
+function fieldBasics(field) {
+	return {
+		inputId: `f_${field.id}`,
+		label: String(field.label ?? field.id),
+		required: Boolean(field.required)
+	};
+}
+function textInputType(type) {
+	return type === "email" || type === "url" || type === "tel" || type === "number" ? type : "text";
+}
+function textInputConstraints(field, inputType) {
+	if (inputType === "number") return {
+		...typeof field.min === "number" ? { min: field.min } : {},
+		...typeof field.max === "number" ? { max: field.max } : {}
+	};
+	return {
+		...typeof field.minLength === "number" ? { minLength: field.minLength } : {},
+		...typeof field.maxLength === "number" ? { maxLength: field.maxLength } : {},
+		...typeof field.pattern === "string" && field.pattern ? { pattern: field.pattern } : {}
+	};
+}
+function LabelledField({ basics, children }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "fb-field",
+		children: [/* @__PURE__ */ jsx("label", {
+			htmlFor: basics.inputId,
+			className: "form-label",
+			children: basics.label
+		}), children]
+	});
+}
+function TextareaField({ field }) {
+	const basics = fieldBasics(field);
+	return /* @__PURE__ */ jsx(LabelledField, {
+		basics,
+		children: /* @__PURE__ */ jsx("textarea", {
+			id: basics.inputId,
+			name: field.id,
+			required: basics.required,
+			placeholder: field.placeholder,
+			rows: field.rows,
+			className: "form-textarea"
+		})
+	});
+}
+function SelectField({ field }) {
+	const basics = fieldBasics(field);
+	const options = field.options ?? [];
+	const multiple = Boolean(field.multiple);
+	return /* @__PURE__ */ jsx(LabelledField, {
+		basics,
+		children: /* @__PURE__ */ jsxs("select", {
+			id: basics.inputId,
+			name: field.id,
+			multiple,
+			required: basics.required,
+			className: "form-select",
+			children: [!multiple && /* @__PURE__ */ jsx("option", {
+				value: "",
+				children: "Select…"
+			}), options.map((opt) => /* @__PURE__ */ jsx("option", {
+				value: opt.value,
+				children: opt.label
+			}, opt.value))]
+		})
+	});
+}
+function RadioField({ field }) {
+	const basics = fieldBasics(field);
+	const options = field.options ?? [];
+	return /* @__PURE__ */ jsxs("fieldset", {
+		className: "fb-fieldset",
+		children: [/* @__PURE__ */ jsx("legend", {
+			className: "form-label",
+			children: basics.label
+		}), options.map((opt) => /* @__PURE__ */ jsxs("label", {
+			className: "form-check",
+			children: [/* @__PURE__ */ jsx("input", {
+				type: "radio",
+				name: field.id,
+				value: opt.value,
+				required: basics.required,
+				className: "form-radio"
+			}), /* @__PURE__ */ jsx("span", {
+				className: "form-check-label",
+				children: opt.label
+			})]
+		}, opt.value))]
+	});
+}
+function TextInputField({ field, type }) {
+	const basics = fieldBasics(field);
+	const inputType = textInputType(type);
+	return /* @__PURE__ */ jsx(LabelledField, {
+		basics,
+		children: /* @__PURE__ */ jsx("input", {
+			id: basics.inputId,
+			name: field.id,
+			type: inputType,
+			required: basics.required,
+			placeholder: field.placeholder,
+			...textInputConstraints(field, inputType),
+			className: "form-input"
+		})
+	});
+}
+function FormFieldControl({ field }) {
+	const type = String(field.type ?? "text");
+	switch (type) {
+		case "textarea": return /* @__PURE__ */ jsx(TextareaField, { field });
+		case "select": return /* @__PURE__ */ jsx(SelectField, { field });
+		case "radio": return /* @__PURE__ */ jsx(RadioField, { field });
+		case "checkbox":
+		case "consent": {
+			const basics = fieldBasics(field);
+			return /* @__PURE__ */ jsx(CheckboxChoice, {
+				name: field.id,
+				required: basics.required,
+				label: basics.label,
+				presentation: type === "consent" ? "tile" : "row"
+			});
+		}
+		default: return /* @__PURE__ */ jsx(TextInputField, {
+			field,
+			type
+		});
+	}
+}
+//#endregion
 //#region ../blocks/src/system/runtime/nodes/form.client.tsx
 const FormNodeClient = ({ render }) => {
 	const form = render.display.form;
@@ -100,107 +231,7 @@ const FormNodeClient = ({ render }) => {
 		children: "Missing or unknown form."
 	});
 	const groups = render.display.groups;
-	const renderField = (field) => {
-		const inputId = `f_${field.id}`;
-		const label = String(field.label ?? field.id);
-		const required = Boolean(field.required);
-		const type = String(field.type ?? "text");
-		if (type === "textarea") return /* @__PURE__ */ jsxs("div", {
-			className: "fb-field",
-			children: [/* @__PURE__ */ jsx("label", {
-				htmlFor: inputId,
-				className: "form-label",
-				children: label
-			}), /* @__PURE__ */ jsx("textarea", {
-				id: inputId,
-				name: field.id,
-				required,
-				placeholder: field.placeholder,
-				rows: field.rows,
-				className: "form-textarea"
-			})]
-		}, field.id);
-		if (type === "select") {
-			const options = field.options ?? [];
-			const multiple = Boolean(field.multiple);
-			return /* @__PURE__ */ jsxs("div", {
-				className: "fb-field",
-				children: [/* @__PURE__ */ jsx("label", {
-					htmlFor: inputId,
-					className: "form-label",
-					children: label
-				}), /* @__PURE__ */ jsxs("select", {
-					id: inputId,
-					name: field.id,
-					multiple,
-					required,
-					className: "form-select",
-					children: [!multiple && /* @__PURE__ */ jsx("option", {
-						value: "",
-						children: "Select…"
-					}), options.map((opt) => /* @__PURE__ */ jsx("option", {
-						value: opt.value,
-						children: opt.label
-					}, opt.value))]
-				})]
-			}, field.id);
-		}
-		if (type === "radio") {
-			const options = field.options ?? [];
-			return /* @__PURE__ */ jsxs("fieldset", {
-				className: "fb-fieldset",
-				children: [/* @__PURE__ */ jsx("legend", {
-					className: "form-label",
-					children: label
-				}), options.map((opt) => /* @__PURE__ */ jsxs("label", {
-					className: "fb-inline form-label",
-					children: [/* @__PURE__ */ jsx("input", {
-						type: "radio",
-						name: field.id,
-						value: opt.value,
-						required,
-						className: "form-radio"
-					}), /* @__PURE__ */ jsx("span", { children: opt.label })]
-				}, opt.value))]
-			}, field.id);
-		}
-		if (type === "checkbox" || type === "consent") return /* @__PURE__ */ jsxs("label", {
-			className: "fb-inline form-label",
-			children: [/* @__PURE__ */ jsx("input", {
-				type: "checkbox",
-				name: field.id,
-				required,
-				className: "form-checkbox"
-			}), /* @__PURE__ */ jsx("span", { children: label })]
-		}, field.id);
-		const inputType = type === "email" || type === "url" || type === "tel" || type === "number" ? type : "text";
-		const extra = {};
-		if (inputType === "text" || inputType === "email" || inputType === "url" || inputType === "tel") {
-			if (typeof field.minLength === "number") extra.minLength = field.minLength;
-			if (typeof field.maxLength === "number") extra.maxLength = field.maxLength;
-			if (typeof field.pattern === "string" && field.pattern) extra.pattern = field.pattern;
-		}
-		if (inputType === "number") {
-			if (typeof field.min === "number") extra.min = field.min;
-			if (typeof field.max === "number") extra.max = field.max;
-		}
-		return /* @__PURE__ */ jsxs("div", {
-			className: "fb-field",
-			children: [/* @__PURE__ */ jsx("label", {
-				htmlFor: inputId,
-				className: "form-label",
-				children: label
-			}), /* @__PURE__ */ jsx("input", {
-				id: inputId,
-				name: field.id,
-				type: inputType,
-				required,
-				placeholder: field.placeholder,
-				...extra,
-				className: "form-input"
-			})]
-		}, field.id);
-	};
+	const renderField = (field) => /* @__PURE__ */ jsx(FormFieldControl, { field }, field.id);
 	const handleSubmit = async (e) => {
 		e.preventDefault();
 		const formData = new FormData(e.currentTarget);

package/dist/client/{headerSection-B0qj9ttg.mjs → headerSection-D7qJrqFX.mjs}

@@ -1,8 +1,8 @@
 "use client";
-import { k as staticHeaderChromeRuntime, r as buildCartDisplay, t as defineIslandPropsDecoder } from "./propsDecoder-C3TP_z4x.mjs";
-import { n as ThemedButtonLink, t as ThemedButton } from "./ThemedButton-LAJTNrS8.mjs";
+import { j as staticHeaderChromeRuntime, r as buildCartDisplay, t as defineIslandPropsDecoder } from "./propsDecoder-CwvvNOHx.mjs";
+import { n as ThemedButtonLink, t as ThemedButton } from "./ThemedButton-DoVIV1Ao.mjs";
 import { t as resolveDedicatedCheckoutPath } from "./checkoutRoute-ClwHwYVA.mjs";
-import { n as useCommerceCart } from "./shop-commerce-store-Sf1eyTaZ.mjs";
+import { n as useCommerceCart } from "./shop-commerce-store-B3MCxIBW.mjs";
 import { t as ModalShell } from "./ModalShell-CqkBvBIC.mjs";
 import * as React$1 from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";