@10x-media/form-builder 0.1.0-beta.2 → 0.1.0-beta.21

package/dist/react/FormResults.d.ts

@@ -7,18 +7,23 @@ type FormResultsProps = {
   /** One field aggregation or several (a survey summary), resolved server-side and passed in. */results: FieldAggregation | FieldAggregation[]; /** Localized translator for built-in copy. Defaults to identity (returns the key). */
   t?: RendererTranslate;
   locale?: string; /** Show the raw count beside each option. Default true. */
-  showCounts?: boolean;
+  showCounts?: boolean; /** The recorded outcome's stable option values; every matching bucket is highlighted as a winner (a tie highlights more than one). */
+  winningValues?: string[]; /** The viewing voter's own pick (e.g. `resolveVotedSubmission().pick`); every matching bucket carries a "your vote" marker. */
+  currentValues?: string[];
 };
 /**
  * Presentational results view for polls and survey summaries: per-option bars with percentages. Headless,
  * data resolved server-side via `aggregateFieldResponses`/`aggregateFormResponses` and passed in (it never
  * fetches). The option label, count, and percentage are real text (the accessible content); the bar fill
- * is `aria-hidden` visual sugar sized by inline width.
+ * is `aria-hidden` visual sugar sized by inline width. With `winningValues`, every matching bucket gets
+ * the winner class and a translated badge (real text, so the outcome is accessible); a tie highlights more than one.
  */
 declare const FormResults: ({
   results,
   t,
-  showCounts
+  showCounts,
+  winningValues,
+  currentValues
 }: FormResultsProps) => ReactNode;
 //#endregion
 export { FormResults, FormResultsProps };

package/dist/react/FormResults.js

@@ -4,7 +4,7 @@ import { en } from "../translations/en.js";
 import { makeTranslate } from "../translations/makeTranslate.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/react/FormResults.tsx
-const OneResult = ({ result, t, showCounts }) => {
+const OneResult = ({ result, t, showCounts, winningValues, currentValues }) => {
 	if (result.total === 0) return /* @__PURE__ */ jsxs("section", {
 		className: "fb-results__field",
 		children: [result.label ? /* @__PURE__ */ jsx("h3", {
@@ -24,31 +24,49 @@ const OneResult = ({ result, t, showCounts }) => {
 			}) : null,
 			/* @__PURE__ */ jsx("ul", {
 				className: "fb-results__list",
-				children: result.buckets.map((bucket) => /* @__PURE__ */ jsxs("li", {
-					className: "fb-results__row",
-					children: [
-						/* @__PURE__ */ jsx("span", {
-							className: "fb-results__option",
-							children: bucket.label
-						}),
-						/* @__PURE__ */ jsx("span", {
-							className: "fb-results__bar",
-							children: /* @__PURE__ */ jsx("span", {
-								className: "fb-results__bar-fill",
-								style: { width: `${bucket.percentage}%` },
-								"aria-hidden": "true"
-							})
-						}),
-						/* @__PURE__ */ jsxs("span", {
-							className: "fb-results__pct",
-							children: [bucket.percentage, "%"]
-						}),
-						showCounts ? /* @__PURE__ */ jsx("span", {
-							className: "fb-results__count",
-							children: bucket.count
-						}) : null
-					]
-				}, bucket.value))
+				children: result.buckets.map((bucket) => {
+					const isWinner = winningValues?.includes(bucket.value) ?? false;
+					const isYours = currentValues?.includes(bucket.value) ?? false;
+					return /* @__PURE__ */ jsxs("li", {
+						className: [
+							"fb-results__row",
+							...isWinner ? ["fb-results__bucket--winner"] : [],
+							...isYours ? ["fb-results__bucket--yours"] : []
+						].join(" "),
+						children: [
+							/* @__PURE__ */ jsxs("span", {
+								className: "fb-results__option",
+								children: [
+									bucket.label,
+									isWinner ? /* @__PURE__ */ jsx("span", {
+										className: "fb-results__winner-badge",
+										children: t(keys.resultsWinner)
+									}) : null,
+									isYours ? /* @__PURE__ */ jsx("span", {
+										className: "fb-results__your-vote-badge",
+										children: t(keys.resultsYourVote)
+									}) : null
+								]
+							}),
+							/* @__PURE__ */ jsx("span", {
+								className: "fb-results__bar",
+								children: /* @__PURE__ */ jsx("span", {
+									className: "fb-results__bar-fill",
+									style: { width: `${bucket.percentage}%` },
+									"aria-hidden": "true"
+								})
+							}),
+							/* @__PURE__ */ jsxs("span", {
+								className: "fb-results__pct",
+								children: [bucket.percentage, "%"]
+							}),
+							showCounts ? /* @__PURE__ */ jsx("span", {
+								className: "fb-results__count",
+								children: bucket.count
+							}) : null
+						]
+					}, bucket.value);
+				})
 			}),
 			/* @__PURE__ */ jsxs("p", {
 				className: "fb-results__total",
@@ -66,16 +84,19 @@ const OneResult = ({ result, t, showCounts }) => {
 * Presentational results view for polls and survey summaries: per-option bars with percentages. Headless,
 * data resolved server-side via `aggregateFieldResponses`/`aggregateFormResponses` and passed in (it never
 * fetches). The option label, count, and percentage are real text (the accessible content); the bar fill
-* is `aria-hidden` visual sugar sized by inline width.
+* is `aria-hidden` visual sugar sized by inline width. With `winningValues`, every matching bucket gets
+* the winner class and a translated badge (real text, so the outcome is accessible); a tie highlights more than one.
 */
-const FormResults = ({ results, t, showCounts = true }) => {
+const FormResults = ({ results, t, showCounts = true, winningValues, currentValues }) => {
 	const translate = t ?? makeTranslate(en);
 	return /* @__PURE__ */ jsx("div", {
 		className: "fb-results",
 		children: (Array.isArray(results) ? results : [results]).map((result) => /* @__PURE__ */ jsx(OneResult, {
 			result,
 			t: translate,
-			showCounts
+			showCounts,
+			winningValues,
+			currentValues
 		}, result.field))
 	});
 };

package/dist/react/FormResults.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormResults.js","names":[],"sources":["../../src/react/FormResults.tsx"],"sourcesContent":["'use client'\n\nimport type { ReactNode } from 'react'\nimport type { FieldAggregation } from '../aggregation/types'\nimport { en } from '../translations/en'\nimport { keys } from '../translations/keys'\nimport { makeTranslate } from '../translations/makeTranslate'\nimport type { RendererTranslate } from './contract'\n\nexport type FormResultsProps = {\n\t/** One field aggregation or several (a survey summary), resolved server-side and passed in. */\n\tresults: FieldAggregation | FieldAggregation[]\n\t/** Localized translator for built-in copy. Defaults to identity (returns the key). */\n\tt?: RendererTranslate\n\tlocale?: string\n\t/** Show the raw count beside each option. Default true. */\n\tshowCounts?: boolean\n}\n\nconst OneResult = ({\n\tresult,\n\tt,\n\tshowCounts,\n}: {\n\tresult: FieldAggregation\n\tt: RendererTranslate\n\tshowCounts: boolean\n}): ReactNode => {\n\tif (result.total === 0) {\n\t\treturn (\n\t\t\t<section className=\"fb-results__field\">\n\t\t\t\t{result.label ? <h3 className=\"fb-results__label\">{result.label}</h3> : null}\n\t\t\t\t<p className=\"fb-results__empty\">{t(keys.resultsNoResponses)}</p>\n\t\t\t</section>\n\t\t)\n\t}\n\treturn (\n\t\t<section className=\"fb-results__field\">\n\t\t\t{result.label ? <h3 className=\"fb-results__label\">{result.label}</h3> : null}\n\t\t\t<ul className=\"fb-results__list\">\n\t\t\t\t{result.buckets.map((bucket) => (\n\t\t\t\t\t<li key={bucket.value} className=\"fb-results__row\">\n\t\t\t\t\t\t<span className=\"fb-results__option\">{bucket.label}</span>\n\t\t\t\t\t\t<span className=\"fb-results__bar\">\n\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\tclassName=\"fb-results__bar-fill\"\n\t\t\t\t\t\t\t\tstyle={{ width: `${bucket.percentage}%` }}\n\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<span className=\"fb-results__pct\">{bucket.percentage}%</span>\n\t\t\t\t\t\t{showCounts ? <span className=\"fb-results__count\">{bucket.count}</span> : null}\n\t\t\t\t\t</li>\n\t\t\t\t))}\n\t\t\t</ul>\n\t\t\t<p className=\"fb-results__total\">\n\t\t\t\t{result.total} {t(keys.resultsResponses)}\n\t\t\t\t{result.truncated ? ` (${t(keys.resultsTruncated)})` : ''}\n\t\t\t</p>\n\t\t</section>\n\t)\n}\n\n/**\n * Presentational results view for polls and survey summaries: per-option bars with percentages. Headless,\n * data resolved server-side via `aggregateFieldResponses`/`aggregateFormResponses` and passed in (it never\n * fetches). The option label, count, and percentage are real text (the accessible content); the bar fill\n * is `aria-hidden` visual sugar sized by inline width.\n */\nexport const FormResults = ({ results, t, showCounts = true }: FormResultsProps): ReactNode => {\n\tconst translate: RendererTranslate = t ?? makeTranslate(en)\n\tconst list = Array.isArray(results) ? results : [results]\n\treturn (\n\t\t<div className=\"fb-results\">\n\t\t\t{list.map((result) => (\n\t\t\t\t<OneResult key={result.field} result={result} t={translate} showCounts={showCounts} />\n\t\t\t))}\n\t\t</div>\n\t)\n}\n"],"mappings":";;;;;;AAmBA,MAAM,aAAa,EAClB,QACA,GACA,iBAKgB;CAChB,IAAI,OAAO,UAAU,GACpB,OACC,qBAAC,WAAD;EAAS,WAAU;YAAnB,CACE,OAAO,QAAQ,oBAAC,MAAD;GAAI,WAAU;aAAqB,OAAO;EAAU,CAAA,IAAI,MACxE,oBAAC,KAAD;GAAG,WAAU;aAAqB,EAAE,KAAK,kBAAkB;EAAK,CAAA,CACxD;;CAGX,OACC,qBAAC,WAAD;EAAS,WAAU;YAAnB;GACE,OAAO,QAAQ,oBAAC,MAAD;IAAI,WAAU;cAAqB,OAAO;GAAU,CAAA,IAAI;GACxE,oBAAC,MAAD;IAAI,WAAU;cACZ,OAAO,QAAQ,KAAK,WACpB,qBAAC,MAAD;KAAuB,WAAU;eAAjC;MACC,oBAAC,QAAD;OAAM,WAAU;iBAAsB,OAAO;MAAY,CAAA;MACzD,oBAAC,QAAD;OAAM,WAAU;iBACf,oBAAC,QAAD;QACC,WAAU;QACV,OAAO,EAAE,OAAO,GAAG,OAAO,WAAW,GAAG;QACxC,eAAY;OACZ,CAAA;MACI,CAAA;MACN,qBAAC,QAAD;OAAM,WAAU;iBAAhB,CAAmC,OAAO,YAAW,GAAO;;MAC3D,aAAa,oBAAC,QAAD;OAAM,WAAU;iBAAqB,OAAO;MAAY,CAAA,IAAI;KACvE;OAXK,OAAO,KAWZ,CACJ;GACE,CAAA;GACJ,qBAAC,KAAD;IAAG,WAAU;cAAb;KACE,OAAO;KAAM;KAAE,EAAE,KAAK,gBAAgB;KACtC,OAAO,YAAY,KAAK,EAAE,KAAK,gBAAgB,EAAE,KAAK;IACrD;;EACK;;AAEX;;;;;;;AAQA,MAAa,eAAe,EAAE,SAAS,GAAG,aAAa,WAAwC;CAC9F,MAAM,YAA+B,KAAK,cAAc,EAAE;CAE1D,OACC,oBAAC,OAAD;EAAK,WAAU;aAFH,MAAM,QAAQ,OAAO,IAAI,UAAU,CAAC,OAAO,GAGhD,KAAK,WACV,oBAAC,WAAD;GAAsC;GAAQ,GAAG;GAAuB;EAAa,GAArE,OAAO,KAA8D,CACrF;CACG,CAAA;AAEP"}
+{"version":3,"file":"FormResults.js","names":[],"sources":["../../src/react/FormResults.tsx"],"sourcesContent":["'use client'\n\nimport type { ReactNode } from 'react'\nimport type { FieldAggregation } from '../aggregation/types'\nimport { en } from '../translations/en'\nimport { keys } from '../translations/keys'\nimport { makeTranslate } from '../translations/makeTranslate'\nimport type { RendererTranslate } from './contract'\n\nexport type FormResultsProps = {\n\t/** One field aggregation or several (a survey summary), resolved server-side and passed in. */\n\tresults: FieldAggregation | FieldAggregation[]\n\t/** Localized translator for built-in copy. Defaults to identity (returns the key). */\n\tt?: RendererTranslate\n\tlocale?: string\n\t/** Show the raw count beside each option. Default true. */\n\tshowCounts?: boolean\n\t/** The recorded outcome's stable option values; every matching bucket is highlighted as a winner (a tie highlights more than one). */\n\twinningValues?: string[]\n\t/** The viewing voter's own pick (e.g. `resolveVotedSubmission().pick`); every matching bucket carries a \"your vote\" marker. */\n\tcurrentValues?: string[]\n}\n\nconst OneResult = ({\n\tresult,\n\tt,\n\tshowCounts,\n\twinningValues,\n\tcurrentValues,\n}: {\n\tresult: FieldAggregation\n\tt: RendererTranslate\n\tshowCounts: boolean\n\twinningValues?: string[]\n\tcurrentValues?: string[]\n}): ReactNode => {\n\tif (result.total === 0) {\n\t\treturn (\n\t\t\t<section className=\"fb-results__field\">\n\t\t\t\t{result.label ? <h3 className=\"fb-results__label\">{result.label}</h3> : null}\n\t\t\t\t<p className=\"fb-results__empty\">{t(keys.resultsNoResponses)}</p>\n\t\t\t</section>\n\t\t)\n\t}\n\treturn (\n\t\t<section className=\"fb-results__field\">\n\t\t\t{result.label ? <h3 className=\"fb-results__label\">{result.label}</h3> : null}\n\t\t\t<ul className=\"fb-results__list\">\n\t\t\t\t{result.buckets.map((bucket) => {\n\t\t\t\t\tconst isWinner = winningValues?.includes(bucket.value) ?? false\n\t\t\t\t\tconst isYours = currentValues?.includes(bucket.value) ?? false\n\t\t\t\t\tconst rowClass = [\n\t\t\t\t\t\t'fb-results__row',\n\t\t\t\t\t\t...(isWinner ? ['fb-results__bucket--winner'] : []),\n\t\t\t\t\t\t...(isYours ? ['fb-results__bucket--yours'] : []),\n\t\t\t\t\t].join(' ')\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<li key={bucket.value} className={rowClass}>\n\t\t\t\t\t\t\t<span className=\"fb-results__option\">\n\t\t\t\t\t\t\t\t{bucket.label}\n\t\t\t\t\t\t\t\t{isWinner ? (\n\t\t\t\t\t\t\t\t\t<span className=\"fb-results__winner-badge\">{t(keys.resultsWinner)}</span>\n\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t{isYours ? (\n\t\t\t\t\t\t\t\t\t<span className=\"fb-results__your-vote-badge\">{t(keys.resultsYourVote)}</span>\n\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span className=\"fb-results__bar\">\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\tclassName=\"fb-results__bar-fill\"\n\t\t\t\t\t\t\t\t\tstyle={{ width: `${bucket.percentage}%` }}\n\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span className=\"fb-results__pct\">{bucket.percentage}%</span>\n\t\t\t\t\t\t\t{showCounts ? <span className=\"fb-results__count\">{bucket.count}</span> : null}\n\t\t\t\t\t\t</li>\n\t\t\t\t\t)\n\t\t\t\t})}\n\t\t\t</ul>\n\t\t\t<p className=\"fb-results__total\">\n\t\t\t\t{result.total} {t(keys.resultsResponses)}\n\t\t\t\t{result.truncated ? ` (${t(keys.resultsTruncated)})` : ''}\n\t\t\t</p>\n\t\t</section>\n\t)\n}\n\n/**\n * Presentational results view for polls and survey summaries: per-option bars with percentages. Headless,\n * data resolved server-side via `aggregateFieldResponses`/`aggregateFormResponses` and passed in (it never\n * fetches). The option label, count, and percentage are real text (the accessible content); the bar fill\n * is `aria-hidden` visual sugar sized by inline width. With `winningValues`, every matching bucket gets\n * the winner class and a translated badge (real text, so the outcome is accessible); a tie highlights more than one.\n */\nexport const FormResults = ({\n\tresults,\n\tt,\n\tshowCounts = true,\n\twinningValues,\n\tcurrentValues,\n}: FormResultsProps): ReactNode => {\n\tconst translate: RendererTranslate = t ?? makeTranslate(en)\n\tconst list = Array.isArray(results) ? results : [results]\n\treturn (\n\t\t<div className=\"fb-results\">\n\t\t\t{list.map((result) => (\n\t\t\t\t<OneResult\n\t\t\t\t\tkey={result.field}\n\t\t\t\t\tresult={result}\n\t\t\t\t\tt={translate}\n\t\t\t\t\tshowCounts={showCounts}\n\t\t\t\t\twinningValues={winningValues}\n\t\t\t\t\tcurrentValues={currentValues}\n\t\t\t\t/>\n\t\t\t))}\n\t\t</div>\n\t)\n}\n"],"mappings":";;;;;;AAuBA,MAAM,aAAa,EAClB,QACA,GACA,YACA,eACA,oBAOgB;CAChB,IAAI,OAAO,UAAU,GACpB,OACC,qBAAC,WAAD;EAAS,WAAU;YAAnB,CACE,OAAO,QAAQ,oBAAC,MAAD;GAAI,WAAU;aAAqB,OAAO;EAAU,CAAA,IAAI,MACxE,oBAAC,KAAD;GAAG,WAAU;aAAqB,EAAE,KAAK,kBAAkB;EAAK,CAAA,CACxD;;CAGX,OACC,qBAAC,WAAD;EAAS,WAAU;YAAnB;GACE,OAAO,QAAQ,oBAAC,MAAD;IAAI,WAAU;cAAqB,OAAO;GAAU,CAAA,IAAI;GACxE,oBAAC,MAAD;IAAI,WAAU;cACZ,OAAO,QAAQ,KAAK,WAAW;KAC/B,MAAM,WAAW,eAAe,SAAS,OAAO,KAAK,KAAK;KAC1D,MAAM,UAAU,eAAe,SAAS,OAAO,KAAK,KAAK;KAMzD,OACC,qBAAC,MAAD;MAAuB,WANP;OAChB;OACA,GAAI,WAAW,CAAC,4BAA4B,IAAI,CAAC;OACjD,GAAI,UAAU,CAAC,2BAA2B,IAAI,CAAC;MAChD,EAAE,KAAK,GAEmC;gBAAzC;OACC,qBAAC,QAAD;QAAM,WAAU;kBAAhB;SACE,OAAO;SACP,WACA,oBAAC,QAAD;UAAM,WAAU;oBAA4B,EAAE,KAAK,aAAa;SAAQ,CAAA,IACrE;SACH,UACA,oBAAC,QAAD;UAAM,WAAU;oBAA+B,EAAE,KAAK,eAAe;SAAQ,CAAA,IAC1E;QACC;;OACN,oBAAC,QAAD;QAAM,WAAU;kBACf,oBAAC,QAAD;SACC,WAAU;SACV,OAAO,EAAE,OAAO,GAAG,OAAO,WAAW,GAAG;SACxC,eAAY;QACZ,CAAA;OACI,CAAA;OACN,qBAAC,QAAD;QAAM,WAAU;kBAAhB,CAAmC,OAAO,YAAW,GAAO;;OAC3D,aAAa,oBAAC,QAAD;QAAM,WAAU;kBAAqB,OAAO;OAAY,CAAA,IAAI;MACvE;QAnBK,OAAO,KAmBZ;IAEN,CAAC;GACE,CAAA;GACJ,qBAAC,KAAD;IAAG,WAAU;cAAb;KACE,OAAO;KAAM;KAAE,EAAE,KAAK,gBAAgB;KACtC,OAAO,YAAY,KAAK,EAAE,KAAK,gBAAgB,EAAE,KAAK;IACrD;;EACK;;AAEX;;;;;;;;AASA,MAAa,eAAe,EAC3B,SACA,GACA,aAAa,MACb,eACA,oBACkC;CAClC,MAAM,YAA+B,KAAK,cAAc,EAAE;CAE1D,OACC,oBAAC,OAAD;EAAK,WAAU;aAFH,MAAM,QAAQ,OAAO,IAAI,UAAU,CAAC,OAAO,GAGhD,KAAK,WACV,oBAAC,WAAD;GAES;GACR,GAAG;GACS;GACG;GACA;EACf,GANK,OAAO,KAMZ,CACD;CACG,CAAA;AAEP"}

package/dist/react/FormSteps.d.ts

@@ -0,0 +1,17 @@
+//#region src/react/FormSteps.d.ts
+type FormStepsProps = {
+  /** Additional CSS class on the wrapping `.fb-form-steps` list. */className?: string;
+};
+/**
+ * Step-progress indicator for multi-step forms: an ordered list of the flow's steps with the
+ * current one marked via `aria-current="step"` and a `--current` class. Step labels use the
+ * step's title, falling back to the translated "Step {n}" (same semantics as the admin flow
+ * builder). Carries no styling opinions beyond `fb-form-steps` classes. Renders nothing when
+ * the form has fewer than two steps. Must render inside `<Form>`.
+ */
+declare const FormSteps: ({
+  className
+}: FormStepsProps) => import("react/jsx-runtime").JSX.Element | null;
+//#endregion
+export { FormSteps, FormStepsProps };
+//# sourceMappingURL=FormSteps.d.ts.map

package/dist/react/FormSteps.js

@@ -0,0 +1,35 @@
+"use client";
+import { keys } from "../translations/keys.js";
+import { stepLabel } from "../flow/stepLabel.js";
+import { cn } from "./cn.js";
+import { useFormContext } from "./FormContext.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/react/FormSteps.tsx
+/**
+* Step-progress indicator for multi-step forms: an ordered list of the flow's steps with the
+* current one marked via `aria-current="step"` and a `--current` class. Step labels use the
+* step's title, falling back to the translated "Step {n}" (same semantics as the admin flow
+* builder). Carries no styling opinions beyond `fb-form-steps` classes. Renders nothing when
+* the form has fewer than two steps. Must render inside `<Form>`.
+*/
+const FormSteps = ({ className }) => {
+	const { step, t } = useFormContext();
+	const steps = step.flow?.steps;
+	if (!steps || steps.length < 2) return null;
+	const fallbackTitle = t(keys.flowStepFallbackTitle);
+	return /* @__PURE__ */ jsx("ol", {
+		className: cn("fb-form-steps", className),
+		children: steps.map((flowStep, index) => {
+			const current = index === step.stepIndex;
+			return /* @__PURE__ */ jsx("li", {
+				className: cn("fb-form-steps__step", current && "fb-form-steps__step--current"),
+				"aria-current": current ? "step" : void 0,
+				children: stepLabel(flowStep, index, fallbackTitle)
+			}, flowStep.id);
+		})
+	});
+};
+//#endregion
+export { FormSteps };
+
+//# sourceMappingURL=FormSteps.js.map

package/dist/react/FormSteps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormSteps.js","names":[],"sources":["../../src/react/FormSteps.tsx"],"sourcesContent":["'use client'\n\nimport { stepLabel } from '../flow/stepLabel'\nimport { keys } from '../translations/keys'\nimport { cn } from './cn'\nimport { useFormContext } from './FormContext'\n\nexport type FormStepsProps = {\n\t/** Additional CSS class on the wrapping `.fb-form-steps` list. */\n\tclassName?: string\n}\n\n/**\n * Step-progress indicator for multi-step forms: an ordered list of the flow's steps with the\n * current one marked via `aria-current=\"step\"` and a `--current` class. Step labels use the\n * step's title, falling back to the translated \"Step {n}\" (same semantics as the admin flow\n * builder). Carries no styling opinions beyond `fb-form-steps` classes. Renders nothing when\n * the form has fewer than two steps. Must render inside `<Form>`.\n */\nexport const FormSteps = ({ className }: FormStepsProps) => {\n\tconst { step, t } = useFormContext()\n\tconst steps = step.flow?.steps\n\tif (!steps || steps.length < 2) {\n\t\treturn null\n\t}\n\tconst fallbackTitle = t(keys.flowStepFallbackTitle)\n\treturn (\n\t\t<ol className={cn('fb-form-steps', className)}>\n\t\t\t{steps.map((flowStep, index) => {\n\t\t\t\tconst current = index === step.stepIndex\n\t\t\t\treturn (\n\t\t\t\t\t<li\n\t\t\t\t\t\tkey={flowStep.id}\n\t\t\t\t\t\tclassName={cn('fb-form-steps__step', current && 'fb-form-steps__step--current')}\n\t\t\t\t\t\taria-current={current ? 'step' : undefined}\n\t\t\t\t\t>\n\t\t\t\t\t\t{stepLabel(flowStep, index, fallbackTitle)}\n\t\t\t\t\t</li>\n\t\t\t\t)\n\t\t\t})}\n\t\t</ol>\n\t)\n}\n"],"mappings":";;;;;;;;;;;;;;AAmBA,MAAa,aAAa,EAAE,gBAAgC;CAC3D,MAAM,EAAE,MAAM,MAAM,eAAe;CACnC,MAAM,QAAQ,KAAK,MAAM;CACzB,IAAI,CAAC,SAAS,MAAM,SAAS,GAC5B,OAAO;CAER,MAAM,gBAAgB,EAAE,KAAK,qBAAqB;CAClD,OACC,oBAAC,MAAD;EAAI,WAAW,GAAG,iBAAiB,SAAS;YAC1C,MAAM,KAAK,UAAU,UAAU;GAC/B,MAAM,UAAU,UAAU,KAAK;GAC/B,OACC,oBAAC,MAAD;IAEC,WAAW,GAAG,uBAAuB,WAAW,8BAA8B;IAC9E,gBAAc,UAAU,SAAS,KAAA;cAEhC,UAAU,UAAU,OAAO,aAAa;GACtC,GALE,SAAS,EAKX;EAEN,CAAC;CACE,CAAA;AAEN"}

package/dist/react/Poll.d.ts

@@ -1,22 +1,54 @@
 import { FormProps } from "./Form.js";
+import { FormResultsProps } from "./FormResults.js";
 import { fetchFormResults } from "./fetchResults.js";
+import { VotedSubmission } from "../submissions/resolveVotedSubmission.js";
+import { ReactNode } from "react";
 
 //#region src/react/Poll.d.ts
 type PollProps = FormProps & {
-  /** The choice field whose results are shown after voting (should match the form's public `resultsField`). */resultsField: string; /** localStorage key for the per-browser voted guard. Default `fb-poll-{form.id}`. */
-  storageKey?: string; /** Force the voted state (controlled). Omit to use the localStorage guard. */
+  /** The choice field whose results are shown after voting (should match the form's public `poll.resultsField`). */resultsField: string;
+  /**
+   * Key for the per-browser voted guard (localStorage by default; overridable or disabled via
+   * `adapters.voteStorage`). Default `fb-poll-{form.id}`.
+   */
+  storageKey?: string;
+  /**
+   * Server-known voted state, ORed with the localStorage guard: `true` marks the visitor as voted;
+   * `false`/omitted falls back to localStorage. SSR hosts using the plugin's `poll.votedCookie`
+   * option pass `hasVotedCookie(cookieHeader, form.id)` here.
+   */
   hasVoted?: boolean;
   /**
    * Injectable results fetch (testing); defaults to `fetchFormResults`. Pass a stable reference (module
    * scope, `useCallback`, or `useMemo`): an inline function re-runs the load effect and double-fetches.
    */
   fetchResultsImpl?: typeof fetchFormResults;
+  /**
+   * The voter's server-resolved current vote (`resolveVotedSubmission`, read from the httpOnly voted
+   * cookie). Presence implies voted; `pick` marks the voter's option in results and `value` prefills
+   * the form when they change their vote. Read at mount: after a client-side change the component
+   * tracks the new pick itself.
+   */
+  currentVote?: Pick<VotedSubmission, 'value' | 'pick'> | null;
+  /**
+   * Replaces the built-in `<FormResults>` wherever the poll shows results (after voting, when
+   * closed, and for a recorded outcome). Receives exactly what `<FormResults>` receives at that
+   * site, so the default is `(props) => <FormResults {...props} />`; surrounding chrome (the
+   * closed/final notices, the change-vote button) stays the poll's.
+   */
+  renderResults?: (props: FormResultsProps) => ReactNode;
 };
 /**
- * A poll: renders `<Form>` until the visitor votes, then fetches the aggregate results and shows
- * `<FormResults>`. A per-browser localStorage flag (`storageKey`) skips straight to results on revisit. The
- * guard is UX, not integrity (bypassable): server-enforced one-per-identity dedup composes via `req.user`
- * (authed forms) or a `notAlreadySubmitted` rule, with cookie/IP identity deferred to the spam phase.
+ * A poll: renders `<Form>` while open and not yet voted, then fetches the aggregate results and shows
+ * `<FormResults>`. Lifecycle comes from `form.poll`: past `closesAt` the poll is closed (a translated
+ * notice plus results, which the endpoint serves for any visibility once closed); a voted-but-open
+ * `afterClose` poll shows a translated wait notice instead of fetching (the endpoint would refuse). A
+ * recorded `outcome.winningValues` (via `resolvePollOutcome`) supersedes everything: a translated final
+ * notice plus results with every winning bucket highlighted (a tie highlights more than one). A
+ * per-browser localStorage flag (`storageKey`) skips straight to results on revisit; `hasVoted: true`
+ * (e.g. from the server-set voted cookie) marks voted regardless of localStorage. The guard is UX, not
+ * integrity (bypassable): server-enforced
+ * one-per-identity dedup composes via `req.user` (authed forms) or a `notAlreadySubmitted` rule.
  */
 declare const Poll: ({
   resultsField,
@@ -25,6 +57,8 @@ declare const Poll: ({
   fetchResultsImpl,
   apiRoute,
   onSuccess,
+  currentVote,
+  renderResults,
   ...formProps
 }: PollProps) => import("react/jsx-runtime").JSX.Element | null;
 //#endregion

package/dist/react/Poll.js

@@ -1,72 +1,176 @@
 "use client";
+import { keys } from "../translations/keys.js";
+import { isPollClosed, pollConfigOf } from "../form/pollState.js";
+import { answerValues } from "../poll/votes/answerValues.js";
+import { en } from "../translations/en.js";
+import { makeTranslate } from "../translations/makeTranslate.js";
 import { Form } from "./Form.js";
 import { FormResults } from "./FormResults.js";
 import { fetchFormResults } from "./fetchResults.js";
-import { useCallback, useEffect, useState } from "react";
-import { jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useState } from "react";
 //#region src/react/Poll.tsx
-const readVoted = (key) => {
-	try {
-		return window.localStorage.getItem(key) != null;
-	} catch {
-		return false;
+const localStorageVoteStorage = {
+	read: (key) => {
+		try {
+			return window.localStorage.getItem(key) != null;
+		} catch {
+			return false;
+		}
+	},
+	write: (key) => {
+		try {
+			window.localStorage.setItem(key, "1");
+		} catch {}
 	}
 };
-const writeVoted = (key) => {
-	try {
-		window.localStorage.setItem(key, "1");
-	} catch {}
+/** `false` disables client persistence entirely (`hasVoted` still marks voted). */
+const noopVoteStorage = {
+	read: () => false,
+	write: () => {}
+};
+const resolveVoteStorage = (configured) => {
+	if (configured === false) return noopVoteStorage;
+	return configured ?? localStorageVoteStorage;
 };
 /**
-* A poll: renders `<Form>` until the visitor votes, then fetches the aggregate results and shows
-* `<FormResults>`. A per-browser localStorage flag (`storageKey`) skips straight to results on revisit. The
-* guard is UX, not integrity (bypassable): server-enforced one-per-identity dedup composes via `req.user`
-* (authed forms) or a `notAlreadySubmitted` rule, with cookie/IP identity deferred to the spam phase.
+* A poll: renders `<Form>` while open and not yet voted, then fetches the aggregate results and shows
+* `<FormResults>`. Lifecycle comes from `form.poll`: past `closesAt` the poll is closed (a translated
+* notice plus results, which the endpoint serves for any visibility once closed); a voted-but-open
+* `afterClose` poll shows a translated wait notice instead of fetching (the endpoint would refuse). A
+* recorded `outcome.winningValues` (via `resolvePollOutcome`) supersedes everything: a translated final
+* notice plus results with every winning bucket highlighted (a tie highlights more than one). A
+* per-browser localStorage flag (`storageKey`) skips straight to results on revisit; `hasVoted: true`
+* (e.g. from the server-set voted cookie) marks voted regardless of localStorage. The guard is UX, not
+* integrity (bypassable): server-enforced
+* one-per-identity dedup composes via `req.user` (authed forms) or a `notAlreadySubmitted` rule.
 */
-const Poll = ({ resultsField, storageKey, hasVoted, fetchResultsImpl = fetchFormResults, apiRoute, onSuccess, ...formProps }) => {
+const Poll = ({ resultsField, storageKey, hasVoted, fetchResultsImpl = fetchFormResults, apiRoute, onSuccess, currentVote, renderResults, ...formProps }) => {
+	const renderResultsView = renderResults ?? ((props) => /* @__PURE__ */ jsx(FormResults, { ...props }));
 	const key = storageKey ?? `fb-poll-${formProps.form.id}`;
-	const [voted, setVoted] = useState(false);
+	const poll = formProps.form.poll;
+	const closed = isPollClosed(poll);
+	const allowChange = pollConfigOf(poll)?.allowChange === true;
+	const winningValues = poll?.outcome?.winningValues;
+	const finalized = Array.isArray(winningValues) && winningValues.length > 0;
+	const resultsAwaitClose = !closed && !finalized && poll?.resultsVisibility === "afterClose";
+	const [voted, setVoted] = useState(hasVoted === true || currentVote != null);
+	const [changing, setChanging] = useState(false);
+	const [pick, setPick] = useState(currentVote?.pick);
+	const [prefill, setPrefill] = useState(currentVote?.value);
+	const [changeReady, setChangeReady] = useState(currentVote != null);
 	const [results, setResults] = useState(null);
+	const [loadFailed, setLoadFailed] = useState(false);
+	const translate = useMemo(() => formProps.t ?? makeTranslate(en), [formProps.t]);
+	const configuredVoteStorage = formProps.adapters?.voteStorage;
+	const voteStorage = useMemo(() => resolveVoteStorage(configuredVoteStorage), [configuredVoteStorage]);
 	const loadResults = useCallback(async () => {
 		const result = await fetchResultsImpl({
 			formId: formProps.form.id,
 			field: resultsField,
 			apiRoute
 		});
-		setResults(result.ok ? result.results : []);
+		if (result.ok) {
+			setResults(result.results);
+			setLoadFailed(false);
+		} else setLoadFailed(true);
 	}, [
 		fetchResultsImpl,
 		formProps.form.id,
 		resultsField,
 		apiRoute
 	]);
+	const resultsError = /* @__PURE__ */ jsx("p", {
+		className: "fb-poll__error",
+		role: "alert",
+		children: translate(keys.pollResultsError)
+	});
 	useEffect(() => {
-		if (hasVoted ?? readVoted(key)) {
-			setVoted(true);
-			loadResults();
-		}
+		const already = hasVoted === true || currentVote != null || voteStorage.read(key);
+		if (already) setVoted(true);
+		if (already && !resultsAwaitClose || closed || finalized) loadResults();
 	}, [
 		hasVoted,
+		currentVote,
 		key,
-		loadResults
+		loadResults,
+		closed,
+		resultsAwaitClose,
+		finalized,
+		voteStorage
 	]);
-	const handleSuccess = useCallback((submissionId) => {
-		writeVoted(key);
+	const handleSuccess = useCallback((submissionId, result) => {
+		voteStorage.write(key);
 		setVoted(true);
-		loadResults();
-		onSuccess?.(submissionId);
+		setChanging(false);
+		setChangeReady(true);
+		if (result?.values) {
+			setPrefill(result.values.find((row) => row.field === resultsField)?.value);
+			setPick(answerValues(result.values, resultsField));
+		}
+		if (!resultsAwaitClose) loadResults();
+		onSuccess?.(submissionId, result);
 	}, [
 		key,
 		loadResults,
-		onSuccess
+		onSuccess,
+		resultsAwaitClose,
+		voteStorage,
+		resultsField
 	]);
-	if (voted) return results ? /* @__PURE__ */ jsx(FormResults, {
-		results,
-		t: formProps.t,
-		locale: formProps.locale
-	}) : null;
+	if (finalized) return /* @__PURE__ */ jsxs("div", {
+		className: "fb-poll fb-poll--final",
+		children: [/* @__PURE__ */ jsx("p", {
+			className: "fb-poll__final",
+			children: translate(keys.pollFinalResult)
+		}), loadFailed ? resultsError : results ? renderResultsView({
+			results,
+			winningValues,
+			currentValues: pick,
+			t: formProps.t,
+			locale: formProps.locale
+		}) : null]
+	});
+	if (closed) return /* @__PURE__ */ jsxs("div", {
+		className: "fb-poll fb-poll--closed",
+		children: [/* @__PURE__ */ jsx("p", {
+			className: "fb-poll__closed",
+			children: translate(keys.pollClosed)
+		}), loadFailed ? resultsError : results ? renderResultsView({
+			results,
+			currentValues: pick,
+			t: formProps.t,
+			locale: formProps.locale
+		}) : null]
+	});
+	if (voted && !changing) {
+		if (resultsAwaitClose) return /* @__PURE__ */ jsx("p", {
+			className: "fb-poll__await-close",
+			children: translate(keys.pollResultsAfterClose)
+		});
+		if (loadFailed) return resultsError;
+		return results ? /* @__PURE__ */ jsxs("div", {
+			className: "fb-poll fb-poll--voted",
+			children: [renderResultsView({
+				results,
+				currentValues: pick,
+				t: formProps.t,
+				locale: formProps.locale
+			}), allowChange && changeReady ? /* @__PURE__ */ jsx("button", {
+				className: "fb-poll__change",
+				type: "button",
+				onClick: () => setChanging(true),
+				children: translate(keys.pollChangeVote)
+			}) : null]
+		}) : null;
+	}
+	const initialValues = changing && prefill !== void 0 ? {
+		...formProps.initialValues ?? {},
+		[resultsField]: prefill
+	} : formProps.initialValues;
 	return /* @__PURE__ */ jsx(Form, {
 		...formProps,
+		initialValues,
 		apiRoute,
 		onSuccess: handleSuccess
 	});

package/dist/react/Poll.js.map

@@ -1 +1 @@
-{"version":3,"file":"Poll.js","names":[],"sources":["../../src/react/Poll.tsx"],"sourcesContent":["'use client'\n\nimport { useCallback, useEffect, useState } from 'react'\nimport type { FieldAggregation } from '../aggregation/types'\nimport { Form, type FormProps } from './Form'\nimport { FormResults } from './FormResults'\nimport { type FetchResultsResult, fetchFormResults } from './fetchResults'\n\nexport type PollProps = FormProps & {\n\t/** The choice field whose results are shown after voting (should match the form's public `resultsField`). */\n\tresultsField: string\n\t/** localStorage key for the per-browser voted guard. Default `fb-poll-{form.id}`. */\n\tstorageKey?: string\n\t/** Force the voted state (controlled). Omit to use the localStorage guard. */\n\thasVoted?: boolean\n\t/**\n\t * Injectable results fetch (testing); defaults to `fetchFormResults`. Pass a stable reference (module\n\t * scope, `useCallback`, or `useMemo`): an inline function re-runs the load effect and double-fetches.\n\t */\n\tfetchResultsImpl?: typeof fetchFormResults\n}\n\nconst readVoted = (key: string): boolean => {\n\ttry {\n\t\treturn window.localStorage.getItem(key) != null\n\t} catch {\n\t\treturn false\n\t}\n}\n\nconst writeVoted = (key: string): void => {\n\ttry {\n\t\twindow.localStorage.setItem(key, '1')\n\t} catch {\n\t\t// Private mode / storage disabled: the guard is best-effort UX, never integrity.\n\t}\n}\n\n/**\n * A poll: renders `<Form>` until the visitor votes, then fetches the aggregate results and shows\n * `<FormResults>`. A per-browser localStorage flag (`storageKey`) skips straight to results on revisit. The\n * guard is UX, not integrity (bypassable): server-enforced one-per-identity dedup composes via `req.user`\n * (authed forms) or a `notAlreadySubmitted` rule, with cookie/IP identity deferred to the spam phase.\n */\nexport const Poll = ({\n\tresultsField,\n\tstorageKey,\n\thasVoted,\n\tfetchResultsImpl = fetchFormResults,\n\tapiRoute,\n\tonSuccess,\n\t...formProps\n}: PollProps) => {\n\tconst key = storageKey ?? `fb-poll-${formProps.form.id}`\n\tconst [voted, setVoted] = useState(false)\n\tconst [results, setResults] = useState<FieldAggregation[] | null>(null)\n\n\tconst loadResults = useCallback(async () => {\n\t\tconst result: FetchResultsResult = await fetchResultsImpl({\n\t\t\tformId: formProps.form.id,\n\t\t\tfield: resultsField,\n\t\t\tapiRoute,\n\t\t})\n\t\tsetResults(result.ok ? result.results : [])\n\t}, [fetchResultsImpl, formProps.form.id, resultsField, apiRoute])\n\n\tuseEffect(() => {\n\t\tconst already = hasVoted ?? readVoted(key)\n\t\tif (already) {\n\t\t\tsetVoted(true)\n\t\t\tvoid loadResults()\n\t\t}\n\t}, [hasVoted, key, loadResults])\n\n\tconst handleSuccess = useCallback(\n\t\t(submissionId?: string) => {\n\t\t\twriteVoted(key)\n\t\t\tsetVoted(true)\n\t\t\tvoid loadResults()\n\t\t\tonSuccess?.(submissionId)\n\t\t},\n\t\t[key, loadResults, onSuccess]\n\t)\n\n\tif (voted) {\n\t\treturn results ? (\n\t\t\t<FormResults results={results} t={formProps.t} locale={formProps.locale} />\n\t\t) : null\n\t}\n\n\treturn <Form {...formProps} apiRoute={apiRoute} onSuccess={handleSuccess} />\n}\n"],"mappings":";;;;;;;AAsBA,MAAM,aAAa,QAAyB;CAC3C,IAAI;EACH,OAAO,OAAO,aAAa,QAAQ,GAAG,KAAK;CAC5C,QAAQ;EACP,OAAO;CACR;AACD;AAEA,MAAM,cAAc,QAAsB;CACzC,IAAI;EACH,OAAO,aAAa,QAAQ,KAAK,GAAG;CACrC,QAAQ,CAER;AACD;;;;;;;AAQA,MAAa,QAAQ,EACpB,cACA,YACA,UACA,mBAAmB,kBACnB,UACA,WACA,GAAG,gBACa;CAChB,MAAM,MAAM,cAAc,WAAW,UAAU,KAAK;CACpD,MAAM,CAAC,OAAO,YAAY,SAAS,KAAK;CACxC,MAAM,CAAC,SAAS,cAAc,SAAoC,IAAI;CAEtE,MAAM,cAAc,YAAY,YAAY;EAC3C,MAAM,SAA6B,MAAM,iBAAiB;GACzD,QAAQ,UAAU,KAAK;GACvB,OAAO;GACP;EACD,CAAC;EACD,WAAW,OAAO,KAAK,OAAO,UAAU,CAAC,CAAC;CAC3C,GAAG;EAAC;EAAkB,UAAU,KAAK;EAAI;EAAc;CAAQ,CAAC;CAEhE,gBAAgB;EAEf,IADgB,YAAY,UAAU,GAAG,GAC5B;GACZ,SAAS,IAAI;GACb,YAAiB;EAClB;CACD,GAAG;EAAC;EAAU;EAAK;CAAW,CAAC;CAE/B,MAAM,gBAAgB,aACpB,iBAA0B;EAC1B,WAAW,GAAG;EACd,SAAS,IAAI;EACb,YAAiB;EACjB,YAAY,YAAY;CACzB,GACA;EAAC;EAAK;EAAa;CAAS,CAC7B;CAEA,IAAI,OACH,OAAO,UACN,oBAAC,aAAD;EAAsB;EAAS,GAAG,UAAU;EAAG,QAAQ,UAAU;CAAS,CAAA,IACvE;CAGL,OAAO,oBAAC,MAAD;EAAM,GAAI;EAAqB;EAAU,WAAW;CAAgB,CAAA;AAC5E"}
+{"version":3,"file":"Poll.js","names":[],"sources":["../../src/react/Poll.tsx"],"sourcesContent":["'use client'\n\nimport type { ReactNode } from 'react'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\nimport type { FieldAggregation } from '../aggregation/types'\nimport { isPollClosed, pollConfigOf } from '../form/pollState'\nimport { answerValues } from '../poll/votes/answerValues'\nimport type { VotedSubmission } from '../submissions/resolveVotedSubmission'\nimport { en } from '../translations/en'\nimport { keys } from '../translations/keys'\nimport { makeTranslate } from '../translations/makeTranslate'\nimport type { VoteStorage } from './adapters'\nimport { Form, type FormProps } from './Form'\nimport { FormResults, type FormResultsProps } from './FormResults'\nimport { type FetchResultsResult, fetchFormResults } from './fetchResults'\n\nexport type PollProps = FormProps & {\n\t/** The choice field whose results are shown after voting (should match the form's public `poll.resultsField`). */\n\tresultsField: string\n\t/**\n\t * Key for the per-browser voted guard (localStorage by default; overridable or disabled via\n\t * `adapters.voteStorage`). Default `fb-poll-{form.id}`.\n\t */\n\tstorageKey?: string\n\t/**\n\t * Server-known voted state, ORed with the localStorage guard: `true` marks the visitor as voted;\n\t * `false`/omitted falls back to localStorage. SSR hosts using the plugin's `poll.votedCookie`\n\t * option pass `hasVotedCookie(cookieHeader, form.id)` here.\n\t */\n\thasVoted?: boolean\n\t/**\n\t * Injectable results fetch (testing); defaults to `fetchFormResults`. Pass a stable reference (module\n\t * scope, `useCallback`, or `useMemo`): an inline function re-runs the load effect and double-fetches.\n\t */\n\tfetchResultsImpl?: typeof fetchFormResults\n\t/**\n\t * The voter's server-resolved current vote (`resolveVotedSubmission`, read from the httpOnly voted\n\t * cookie). Presence implies voted; `pick` marks the voter's option in results and `value` prefills\n\t * the form when they change their vote. Read at mount: after a client-side change the component\n\t * tracks the new pick itself.\n\t */\n\tcurrentVote?: Pick<VotedSubmission, 'value' | 'pick'> | null\n\t/**\n\t * Replaces the built-in `<FormResults>` wherever the poll shows results (after voting, when\n\t * closed, and for a recorded outcome). Receives exactly what `<FormResults>` receives at that\n\t * site, so the default is `(props) => <FormResults {...props} />`; surrounding chrome (the\n\t * closed/final notices, the change-vote button) stays the poll's.\n\t */\n\trenderResults?: (props: FormResultsProps) => ReactNode\n}\n\nconst localStorageVoteStorage: VoteStorage = {\n\tread: (key) => {\n\t\ttry {\n\t\t\treturn window.localStorage.getItem(key) != null\n\t\t} catch {\n\t\t\treturn false\n\t\t}\n\t},\n\twrite: (key) => {\n\t\ttry {\n\t\t\twindow.localStorage.setItem(key, '1')\n\t\t} catch {\n\t\t\t// Private mode / storage disabled: the guard is best-effort UX, never integrity.\n\t\t}\n\t},\n}\n\n/** `false` disables client persistence entirely (`hasVoted` still marks voted). */\nconst noopVoteStorage: VoteStorage = { read: () => false, write: () => {} }\n\nconst resolveVoteStorage = (configured: VoteStorage | false | undefined): VoteStorage => {\n\tif (configured === false) {\n\t\treturn noopVoteStorage\n\t}\n\treturn configured ?? localStorageVoteStorage\n}\n\n/**\n * A poll: renders `<Form>` while open and not yet voted, then fetches the aggregate results and shows\n * `<FormResults>`. Lifecycle comes from `form.poll`: past `closesAt` the poll is closed (a translated\n * notice plus results, which the endpoint serves for any visibility once closed); a voted-but-open\n * `afterClose` poll shows a translated wait notice instead of fetching (the endpoint would refuse). A\n * recorded `outcome.winningValues` (via `resolvePollOutcome`) supersedes everything: a translated final\n * notice plus results with every winning bucket highlighted (a tie highlights more than one). A\n * per-browser localStorage flag (`storageKey`) skips straight to results on revisit; `hasVoted: true`\n * (e.g. from the server-set voted cookie) marks voted regardless of localStorage. The guard is UX, not\n * integrity (bypassable): server-enforced\n * one-per-identity dedup composes via `req.user` (authed forms) or a `notAlreadySubmitted` rule.\n */\nexport const Poll = ({\n\tresultsField,\n\tstorageKey,\n\thasVoted,\n\tfetchResultsImpl = fetchFormResults,\n\tapiRoute,\n\tonSuccess,\n\tcurrentVote,\n\trenderResults,\n\t...formProps\n}: PollProps) => {\n\tconst renderResultsView =\n\t\trenderResults ?? ((props: FormResultsProps): ReactNode => <FormResults {...props} />)\n\tconst key = storageKey ?? `fb-poll-${formProps.form.id}`\n\tconst poll = formProps.form.poll\n\tconst closed = isPollClosed(poll)\n\tconst allowChange = pollConfigOf(poll)?.allowChange === true\n\tconst winningValues = poll?.outcome?.winningValues\n\tconst finalized = Array.isArray(winningValues) && winningValues.length > 0\n\tconst resultsAwaitClose = !closed && !finalized && poll?.resultsVisibility === 'afterClose'\n\t// Server-known voted state renders the results view on the very first paint; the effect below\n\t// only adds the localStorage read.\n\tconst [voted, setVoted] = useState(hasVoted === true || currentVote != null)\n\tconst [changing, setChanging] = useState(false)\n\tconst [pick, setPick] = useState<string[] | undefined>(currentVote?.pick)\n\tconst [prefill, setPrefill] = useState<unknown>(currentVote?.value)\n\t// Changing is offered only when the signed cookie verifiably identifies a submission: at mount\n\t// via a resolved `currentVote`, or after an in-session vote (the server just issued the cookie).\n\t// A localStorage-only voted flag proves nothing about the cookie, and a \"change\" without one\n\t// would create a second submission instead of updating.\n\tconst [changeReady, setChangeReady] = useState(currentVote != null)\n\tconst [results, setResults] = useState<FieldAggregation[] | null>(null)\n\tconst [loadFailed, setLoadFailed] = useState(false)\n\tconst translate = useMemo(() => formProps.t ?? makeTranslate(en), [formProps.t])\n\tconst configuredVoteStorage = formProps.adapters?.voteStorage\n\tconst voteStorage = useMemo(\n\t\t() => resolveVoteStorage(configuredVoteStorage),\n\t\t[configuredVoteStorage]\n\t)\n\n\tconst loadResults = useCallback(async () => {\n\t\tconst result: FetchResultsResult = await fetchResultsImpl({\n\t\t\tformId: formProps.form.id,\n\t\t\tfield: resultsField,\n\t\t\tapiRoute,\n\t\t})\n\t\t// A failed load surfaces as an error, not an empty result set: `[]` would read as \"no votes yet\".\n\t\tif (result.ok) {\n\t\t\tsetResults(result.results)\n\t\t\tsetLoadFailed(false)\n\t\t} else {\n\t\t\tsetLoadFailed(true)\n\t\t}\n\t}, [fetchResultsImpl, formProps.form.id, resultsField, apiRoute])\n\n\tconst resultsError = (\n\t\t<p className=\"fb-poll__error\" role=\"alert\">\n\t\t\t{translate(keys.pollResultsError)}\n\t\t</p>\n\t)\n\n\tuseEffect(() => {\n\t\tconst already = hasVoted === true || currentVote != null || voteStorage.read(key)\n\t\tif (already) {\n\t\t\tsetVoted(true)\n\t\t}\n\t\tif ((already && !resultsAwaitClose) || closed || finalized) {\n\t\t\tvoid loadResults()\n\t\t}\n\t}, [hasVoted, currentVote, key, loadResults, closed, resultsAwaitClose, finalized, voteStorage])\n\n\tconst handleSuccess = useCallback<NonNullable<FormProps['onSuccess']>>(\n\t\t(submissionId, result) => {\n\t\t\tvoteStorage.write(key)\n\t\t\tsetVoted(true)\n\t\t\tsetChanging(false)\n\t\t\tsetChangeReady(true)\n\t\t\t// Track the pick client-side so the \"your vote\" marker is fresh right after a (re-)vote,\n\t\t\t// without waiting for a server-resolved currentVote on the next page load.\n\t\t\tif (result?.values) {\n\t\t\t\tconst entry = result.values.find((row) => row.field === resultsField)\n\t\t\t\tsetPrefill(entry?.value)\n\t\t\t\tsetPick(answerValues(result.values, resultsField))\n\t\t\t}\n\t\t\tif (!resultsAwaitClose) {\n\t\t\t\tvoid loadResults()\n\t\t\t}\n\t\t\t// Forward the resolved success response so a Poll host gets the same onSuccess payload as a Form host.\n\t\t\tonSuccess?.(submissionId, result)\n\t\t},\n\t\t[key, loadResults, onSuccess, resultsAwaitClose, voteStorage, resultsField]\n\t)\n\n\tif (finalized) {\n\t\treturn (\n\t\t\t<div className=\"fb-poll fb-poll--final\">\n\t\t\t\t<p className=\"fb-poll__final\">{translate(keys.pollFinalResult)}</p>\n\t\t\t\t{loadFailed\n\t\t\t\t\t? resultsError\n\t\t\t\t\t: results\n\t\t\t\t\t\t? renderResultsView({\n\t\t\t\t\t\t\t\tresults,\n\t\t\t\t\t\t\t\twinningValues,\n\t\t\t\t\t\t\t\tcurrentValues: pick,\n\t\t\t\t\t\t\t\tt: formProps.t,\n\t\t\t\t\t\t\t\tlocale: formProps.locale,\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t: null}\n\t\t\t</div>\n\t\t)\n\t}\n\n\tif (closed) {\n\t\treturn (\n\t\t\t<div className=\"fb-poll fb-poll--closed\">\n\t\t\t\t<p className=\"fb-poll__closed\">{translate(keys.pollClosed)}</p>\n\t\t\t\t{loadFailed\n\t\t\t\t\t? resultsError\n\t\t\t\t\t: results\n\t\t\t\t\t\t? renderResultsView({\n\t\t\t\t\t\t\t\tresults,\n\t\t\t\t\t\t\t\tcurrentValues: pick,\n\t\t\t\t\t\t\t\tt: formProps.t,\n\t\t\t\t\t\t\t\tlocale: formProps.locale,\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t: null}\n\t\t\t</div>\n\t\t)\n\t}\n\n\tif (voted && !changing) {\n\t\tif (resultsAwaitClose) {\n\t\t\treturn <p className=\"fb-poll__await-close\">{translate(keys.pollResultsAfterClose)}</p>\n\t\t}\n\t\tif (loadFailed) {\n\t\t\treturn resultsError\n\t\t}\n\t\treturn results ? (\n\t\t\t<div className=\"fb-poll fb-poll--voted\">\n\t\t\t\t{renderResultsView({\n\t\t\t\t\tresults,\n\t\t\t\t\tcurrentValues: pick,\n\t\t\t\t\tt: formProps.t,\n\t\t\t\t\tlocale: formProps.locale,\n\t\t\t\t})}\n\t\t\t\t{allowChange && changeReady ? (\n\t\t\t\t\t<button className=\"fb-poll__change\" type=\"button\" onClick={() => setChanging(true)}>\n\t\t\t\t\t\t{translate(keys.pollChangeVote)}\n\t\t\t\t\t</button>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t) : null\n\t}\n\n\t// While changing, the current pick prefills the results field; the server identifies the\n\t// submission to update from the httpOnly voted cookie, so the client sends a normal submit.\n\tconst initialValues =\n\t\tchanging && prefill !== undefined\n\t\t\t? { ...(formProps.initialValues ?? {}), [resultsField]: prefill }\n\t\t\t: formProps.initialValues\n\treturn (\n\t\t<Form\n\t\t\t{...formProps}\n\t\t\tinitialValues={initialValues}\n\t\t\tapiRoute={apiRoute}\n\t\t\tonSuccess={handleSuccess}\n\t\t/>\n\t)\n}\n"],"mappings":"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"}

package/dist/react/adapters.d.ts

@@ -0,0 +1,35 @@
+//#region src/react/adapters.d.ts
+/** The plugin's navigation intent for a post-submit redirect, passed through to the adapter. */
+type NavigateOptions = {
+  replace: boolean;
+};
+/**
+ * Client persistence for a poll's per-browser voted flag. `read` reports whether the flag is set;
+ * `write` sets it after a successful vote.
+ */
+type VoteStorage = {
+  read: (key: string) => boolean;
+  write: (key: string) => void;
+};
+/** Loads a third-party script and resolves once it is executable (e.g. a consent-gated loader). */
+type LoadScript = (src: string) => Promise<void>;
+/**
+ * Host-owned effects. Every member is optional and defaults to the current DOM behavior, so
+ * omitting the prop entirely preserves the default semantics exactly.
+ *
+ * - `navigate`: replaces `window.location.assign`/`.replace` for the post-submit redirect. When
+ *   set, the plugin never touches `window.location` for that form; a throwing adapter propagates
+ *   and never falls back to a hard navigation. Not awaited.
+ * - `voteStorage`: replaces the `<Poll>` localStorage voted-flag read/write; `false` disables
+ *   client persistence entirely (e.g. when the server-side `poll.votedCookie` is the source of truth).
+ * - `loadScript`: replaces the captcha widgets' `document.head` script injection (consent
+ *   managers, CSP nonces). The per-src cache and evict-on-failure retry still apply.
+ */
+type FormAdapters = {
+  navigate?: (url: string, options: NavigateOptions) => void;
+  voteStorage?: VoteStorage | false;
+  loadScript?: LoadScript;
+};
+//#endregion
+export { FormAdapters, LoadScript, NavigateOptions, VoteStorage };
+//# sourceMappingURL=adapters.d.ts.map

package/dist/react/adapters.js

@@ -0,0 +1,11 @@
+//#region src/react/adapters.ts
+/** The default navigation: a full document load, push semantics unless `replace` is requested. */
+const defaultNavigate = (url, options) => {
+	if (typeof window === "undefined") return;
+	if (options.replace) window.location.replace(url);
+	else window.location.assign(url);
+};
+//#endregion
+export { defaultNavigate };
+
+//# sourceMappingURL=adapters.js.map

package/dist/react/adapters.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"adapters.js","names":[],"sources":["../../src/react/adapters.ts"],"sourcesContent":["/** The plugin's navigation intent for a post-submit redirect, passed through to the adapter. */\nexport type NavigateOptions = { replace: boolean }\n\n/**\n * Client persistence for a poll's per-browser voted flag. `read` reports whether the flag is set;\n * `write` sets it after a successful vote.\n */\nexport type VoteStorage = {\n\tread: (key: string) => boolean\n\twrite: (key: string) => void\n}\n\n/** Loads a third-party script and resolves once it is executable (e.g. a consent-gated loader). */\nexport type LoadScript = (src: string) => Promise<void>\n\n/**\n * Host-owned effects. Every member is optional and defaults to the current DOM behavior, so\n * omitting the prop entirely preserves the default semantics exactly.\n *\n * - `navigate`: replaces `window.location.assign`/`.replace` for the post-submit redirect. When\n *   set, the plugin never touches `window.location` for that form; a throwing adapter propagates\n *   and never falls back to a hard navigation. Not awaited.\n * - `voteStorage`: replaces the `<Poll>` localStorage voted-flag read/write; `false` disables\n *   client persistence entirely (e.g. when the server-side `poll.votedCookie` is the source of truth).\n * - `loadScript`: replaces the captcha widgets' `document.head` script injection (consent\n *   managers, CSP nonces). The per-src cache and evict-on-failure retry still apply.\n */\nexport type FormAdapters = {\n\tnavigate?: (url: string, options: NavigateOptions) => void\n\tvoteStorage?: VoteStorage | false\n\tloadScript?: LoadScript\n}\n\n/** The default navigation: a full document load, push semantics unless `replace` is requested. */\nexport const defaultNavigate = (url: string, options: NavigateOptions): void => {\n\tif (typeof window === 'undefined') {\n\t\treturn\n\t}\n\tif (options.replace) {\n\t\twindow.location.replace(url)\n\t} else {\n\t\twindow.location.assign(url)\n\t}\n}\n"],"mappings":";;AAkCA,MAAa,mBAAmB,KAAa,YAAmC;CAC/E,IAAI,OAAO,WAAW,aACrB;CAED,IAAI,QAAQ,SACX,OAAO,SAAS,QAAQ,GAAG;MAE3B,OAAO,SAAS,OAAO,GAAG;AAE5B"}