@lumeweb/portal-framework-ui 0.0.1 → 0.1.0

package/dist/esm/components/shared/footers/WizardFooter.js

@@ -0,0 +1,79 @@
+import { __esmMin } from "../../../_virtual/rolldown_runtime.js";
+import { ActionItemType, init_types } from "../../actions/types.js";
+import { ActionListRenderer } from "../../actions/ActionListRenderer.js";
+import { init_actions } from "../../actions/index.js";
+import { init_FooterContext, useFooterContext } from "../context/FooterContext.js";
+import { cn } from "@lumeweb/portal-framework-ui-core";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/shared/footers/WizardFooter.tsx
+function WizardFooter({ actionButtons, className, isSubmitting, onClose }) {
+	const context = useFooterContext();
+	if (!context.step) {
+		console.warn("WizardFooter rendered without step context");
+		return null;
+	}
+	const { current, total } = context.step;
+	const progressPercentage = Math.round(current / total * 100);
+	const styledActions = actionButtons.map((action) => {
+		if (action.type === ActionItemType.SUBMIT && action.label === "Back") return {
+			...action,
+			variant: "outline"
+		};
+		if (action.type === ActionItemType.SUBMIT && action.label !== "Back") return {
+			...action,
+			variant: "default"
+		};
+		return action;
+	});
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("mt-4 border-t pt-4", className),
+		children: /* @__PURE__ */ jsx("div", {
+			className: "mx-auto max-w-4xl",
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col items-center justify-between gap-6 sm:flex-row",
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "flex items-center gap-6",
+					children: [/* @__PURE__ */ jsxs("div", {
+						className: "text-muted-foreground flex-shrink-0 text-sm",
+						children: [
+							"Step ",
+							current,
+							" of ",
+							total
+						]
+					}), /* @__PURE__ */ jsxs("div", {
+						className: "flex min-w-0 flex-1 items-center gap-3",
+						children: [/* @__PURE__ */ jsx("div", {
+							className: "bg-muted h-2 w-32 flex-1 overflow-hidden rounded-full",
+							children: /* @__PURE__ */ jsx("div", {
+								className: "bg-primary h-full transition-all duration-300",
+								style: { width: `${progressPercentage}%` }
+							})
+						}), /* @__PURE__ */ jsxs("span", {
+							className: "text-muted-foreground whitespace-nowrap text-xs",
+							children: [progressPercentage, "% complete"]
+						})]
+					})]
+				}), /* @__PURE__ */ jsx(ActionListRenderer, {
+					actions: styledActions,
+					className: "flex items-center gap-3",
+					closeDialog: onClose,
+					isSubmitting,
+					layout: "horizontal"
+				})]
+			})
+		})
+	});
+}
+var init_WizardFooter = __esmMin(() => {
+	init_actions();
+	init_types();
+	init_FooterContext();
+});
+
+//#endregion
+init_WizardFooter();
+export { WizardFooter, init_WizardFooter };
+//# sourceMappingURL=WizardFooter.js.map

package/dist/esm/components/shared/footers/WizardFooter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WizardFooter.js","names":[],"sources":["../../../../../src/components/shared/footers/WizardFooter.tsx"],"sourcesContent":["import { cn } from \"@lumeweb/portal-framework-ui-core\";\nimport React from \"react\";\n\nimport { ActionListRenderer } from \"../../actions\";\nimport { ActionItemType } from \"../../actions/types\";\nimport { useFooterContext } from \"../context/FooterContext\";\nimport { BaseFooterProps } from \"../types/footer\";\n\nexport function WizardFooter<T = any>({\n  actionButtons,\n  className,\n  isSubmitting,\n  onClose,\n}: Pick<BaseFooterProps<T>, \"actionButtons\" | \"className\" | \"isSubmitting\" | \"onClose\">) {\n  const context = useFooterContext<T>();\n\n  // Wizard footer requires step context\n  if (!context.step) {\n    console.warn(\"WizardFooter rendered without step context\");\n    return null;\n  }\n\n  const { current, total } = context.step;\n  const progressPercentage = Math.round((current / total) * 100);\n\n  // Apply specific styling to buttons\n  const styledActions = actionButtons.map((action) => {\n    if (action.type === ActionItemType.SUBMIT && action.label === \"Back\") {\n      return {\n        ...action,\n        variant: \"outline\",\n      };\n    }\n    if (action.type === ActionItemType.SUBMIT && action.label !== \"Back\") {\n      return {\n        ...action,\n        variant: \"default\",\n      };\n    }\n    return action;\n  });\n\n  return (\n    <div className={cn(\"mt-4 border-t pt-4\", className)}>\n      <div className=\"mx-auto max-w-4xl\">\n        <div className=\"flex flex-col items-center justify-between gap-6 sm:flex-row\">\n          <div className=\"flex items-center gap-6\">\n            <div className=\"text-muted-foreground flex-shrink-0 text-sm\">\n              Step {current} of {total}\n            </div>\n            <div className=\"flex min-w-0 flex-1 items-center gap-3\">\n              <div className=\"bg-muted h-2 w-32 flex-1 overflow-hidden rounded-full\">\n                <div\n                  className=\"bg-primary h-full transition-all duration-300\"\n                  style={{ width: `${progressPercentage}%` }}\n                />\n              </div>\n              <span className=\"text-muted-foreground whitespace-nowrap text-xs\">\n                {progressPercentage}% complete\n              </span>\n            </div>\n          </div>\n\n          <ActionListRenderer\n            actions={styledActions}\n            className=\"flex items-center gap-3\"\n            closeDialog={onClose}\n            isSubmitting={isSubmitting}\n            layout=\"horizontal\"\n          />\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;AAQA,SAAgB,aAAsB,EACpC,eACA,WACA,cACA,WACuF;CACvF,MAAM,UAAU,kBAAqB;AAGrC,KAAI,CAAC,QAAQ,MAAM;AACjB,UAAQ,KAAK,6CAA6C;AAC1D,SAAO;;CAGT,MAAM,EAAE,SAAS,UAAU,QAAQ;CACnC,MAAM,qBAAqB,KAAK,MAAO,UAAU,QAAS,IAAI;CAG9D,MAAM,gBAAgB,cAAc,KAAK,WAAW;AAClD,MAAI,OAAO,SAAS,eAAe,UAAU,OAAO,UAAU,OAC5D,QAAO;GACL,GAAG;GACH,SAAS;GACV;AAEH,MAAI,OAAO,SAAS,eAAe,UAAU,OAAO,UAAU,OAC5D,QAAO;GACL,GAAG;GACH,SAAS;GACV;AAEH,SAAO;GACP;AAEF,QACE,oBAAC;EAAI,WAAW,GAAG,sBAAsB,UAAU;YACjD,oBAAC;GAAI,WAAU;aACb,qBAAC;IAAI,WAAU;eACb,qBAAC;KAAI,WAAU;gBACb,qBAAC;MAAI,WAAU;;OAA8C;OACrD;OAAQ;OAAK;;OACf,EACN,qBAAC;MAAI,WAAU;iBACb,oBAAC;OAAI,WAAU;iBACb,oBAAC;QACC,WAAU;QACV,OAAO,EAAE,OAAO,GAAG,mBAAmB,IAAI;SAC1C;QACE,EACN,qBAAC;OAAK,WAAU;kBACb,oBAAmB;QACf;OACH;MACF,EAEN,oBAAC;KACC,SAAS;KACT,WAAU;KACV,aAAa;KACC;KACd,QAAO;MACP;KACE;IACF;GACF;;;eArEyC;aACE;qBACO"}

package/dist/esm/components/shared/footers/index.d.ts

@@ -0,0 +1,6 @@
+import { ActionsFooter } from "./ActionsFooter.js";
+import { DefaultFooter } from "./DefaultFooter.js";
+import { FormFooter } from "./FormFooter.js";
+import { StepFormFooter } from "./StepFormFooter.js";
+import { WizardFooter } from "./WizardFooter.js";
+export { ActionsFooter, DefaultFooter, FormFooter, StepFormFooter, WizardFooter };

package/dist/esm/components/shared/footers/index.js

@@ -0,0 +1,20 @@
+import { __esmMin } from "../../../_virtual/rolldown_runtime.js";
+import { ActionsFooter, init_ActionsFooter } from "./ActionsFooter.js";
+import { DefaultFooter, init_DefaultFooter } from "./DefaultFooter.js";
+import { FormFooter, init_FormFooter } from "./FormFooter.js";
+import { StepFormFooter, init_StepFormFooter } from "./StepFormFooter.js";
+import { WizardFooter, init_WizardFooter } from "./WizardFooter.js";
+
+//#region src/components/shared/footers/index.ts
+var init_footers = __esmMin(() => {
+	init_ActionsFooter();
+	init_DefaultFooter();
+	init_FormFooter();
+	init_StepFormFooter();
+	init_WizardFooter();
+});
+
+//#endregion
+init_footers();
+export { ActionsFooter, DefaultFooter, FormFooter, StepFormFooter, WizardFooter, init_footers };
+//# sourceMappingURL=index.js.map

package/dist/esm/components/shared/footers/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/shared/footers/index.ts"],"sourcesContent":["export * from \"./ActionsFooter\";\nexport * from \"./DefaultFooter\";\nexport * from \"./FormFooter\";\nexport * from \"./StepFormFooter\";\nexport * from \"./WizardFooter\";\n"],"mappings":""}

package/dist/esm/components/shared/headers/DefaultHeader.d.ts

@@ -0,0 +1,13 @@
+import { BaseHeaderProps } from "../types/header.js";
+
+//#region src/components/shared/headers/DefaultHeader.d.ts
+declare function DefaultHeader<T = any>({
+  actionButtons,
+  className,
+  description,
+  environment,
+  title
+}: BaseHeaderProps<T>): any;
+//#endregion
+export { DefaultHeader };
+//# sourceMappingURL=DefaultHeader.d.ts.map

package/dist/esm/components/shared/headers/DefaultHeader.js

@@ -0,0 +1,35 @@
+import { __esmMin } from "../../../_virtual/rolldown_runtime.js";
+import { ActionListRenderer } from "../../actions/ActionListRenderer.js";
+import { init_actions } from "../../actions/index.js";
+import { cn } from "@lumeweb/portal-framework-ui-core";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/shared/headers/DefaultHeader.tsx
+function DefaultHeader({ actionButtons, className, description, environment, title }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("space-y-2", className),
+		children: [(title || description) && /* @__PURE__ */ jsxs("div", {
+			className: "space-y-1",
+			children: [title && /* @__PURE__ */ jsx("h2", {
+				className: "text-lg font-semibold leading-none tracking-tight",
+				children: title
+			}), description && /* @__PURE__ */ jsx("p", {
+				className: "text-muted-foreground text-sm",
+				children: description
+			})]
+		}), actionButtons && actionButtons.length > 0 && /* @__PURE__ */ jsx(ActionListRenderer, {
+			actions: actionButtons,
+			className: "flex justify-end gap-2",
+			layout: "horizontal"
+		})]
+	});
+}
+var init_DefaultHeader = __esmMin(() => {
+	init_actions();
+});
+
+//#endregion
+init_DefaultHeader();
+export { DefaultHeader, init_DefaultHeader };
+//# sourceMappingURL=DefaultHeader.js.map

package/dist/esm/components/shared/headers/DefaultHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultHeader.js","names":[],"sources":["../../../../../src/components/shared/headers/DefaultHeader.tsx"],"sourcesContent":["import { cn } from \"@lumeweb/portal-framework-ui-core\";\nimport React from \"react\";\n\nimport { ActionListRenderer } from \"../../actions\";\nimport { BaseHeaderProps } from \"../types/header\";\n\nexport function DefaultHeader<T = any>({\n  actionButtons,\n  className,\n  description,\n  environment,\n  title,\n}: BaseHeaderProps<T>) {\n  return (\n    <div className={cn(\"space-y-2\", className)}>\n      {(title || description) && (\n        <div className=\"space-y-1\">\n          {title && (\n            <h2 className=\"text-lg font-semibold leading-none tracking-tight\">\n              {title}\n            </h2>\n          )}\n          {description && (\n            <p className=\"text-muted-foreground text-sm\">{description}</p>\n          )}\n        </div>\n      )}\n      {actionButtons && actionButtons.length > 0 && (\n        <ActionListRenderer\n          actions={actionButtons}\n          className=\"flex justify-end gap-2\"\n          layout=\"horizontal\"\n        />\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;AAMA,SAAgB,cAAuB,EACrC,eACA,WACA,aACA,aACA,SACqB;AACrB,QACE,qBAAC;EAAI,WAAW,GAAG,aAAa,UAAU;cACtC,SAAS,gBACT,qBAAC;GAAI,WAAU;cACZ,SACC,oBAAC;IAAG,WAAU;cACX;KACE,EAEN,eACC,oBAAC;IAAE,WAAU;cAAiC;KAAgB;IAE5D,EAEP,iBAAiB,cAAc,SAAS,KACvC,oBAAC;GACC,SAAS;GACT,WAAU;GACV,QAAO;IACP;GAEA;;;eA/ByC"}

package/dist/esm/components/shared/headers/FormHeader.d.ts

@@ -0,0 +1,12 @@
+import { BaseHeaderProps } from "../types/header.js";
+
+//#region src/components/shared/headers/FormHeader.d.ts
+declare function FormHeader<T = any>({
+  actionButtons,
+  className,
+  description,
+  title
+}: BaseHeaderProps<T>): any;
+//#endregion
+export { FormHeader };
+//# sourceMappingURL=FormHeader.d.ts.map

package/dist/esm/components/shared/headers/FormHeader.js

@@ -0,0 +1,36 @@
+import { __esmMin } from "../../../_virtual/rolldown_runtime.js";
+import { ActionListRenderer } from "../../actions/ActionListRenderer.js";
+import { init_actions } from "../../actions/index.js";
+import { cn } from "@lumeweb/portal-framework-ui-core";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/shared/headers/FormHeader.tsx
+function FormHeader({ actionButtons, className, description, title }) {
+	if (!title && !description && (!actionButtons || actionButtons.length === 0)) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("space-y-4", className),
+		children: [(title || description) && /* @__PURE__ */ jsxs("div", {
+			className: "space-y-2",
+			children: [title && /* @__PURE__ */ jsx("h2", {
+				className: "text-xl font-semibold leading-none tracking-tight",
+				children: title
+			}), description && /* @__PURE__ */ jsx("p", {
+				className: "text-muted-foreground text-sm",
+				children: description
+			})]
+		}), actionButtons && actionButtons.length > 0 && /* @__PURE__ */ jsx(ActionListRenderer, {
+			actions: actionButtons,
+			className: "flex justify-end gap-2",
+			layout: "horizontal"
+		})]
+	});
+}
+var init_FormHeader = __esmMin(() => {
+	init_actions();
+});
+
+//#endregion
+init_FormHeader();
+export { FormHeader, init_FormHeader };
+//# sourceMappingURL=FormHeader.js.map

package/dist/esm/components/shared/headers/FormHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormHeader.js","names":[],"sources":["../../../../../src/components/shared/headers/FormHeader.tsx"],"sourcesContent":["import { cn } from \"@lumeweb/portal-framework-ui-core\";\nimport React from \"react\";\n\nimport { ActionListRenderer } from \"../../actions\";\nimport { BaseHeaderProps } from \"../types/header\";\n\nexport function FormHeader<T = any>({\n  actionButtons,\n  className,\n  description,\n  title,\n}: BaseHeaderProps<T>) {\n  // Return null if all content fields are not passed\n  if (\n    !title &&\n    !description &&\n    (!actionButtons || actionButtons.length === 0)\n  ) {\n    return null;\n  }\n\n  return (\n    <div className={cn(\"space-y-4\", className)}>\n      {(title || description) && (\n        <div className=\"space-y-2\">\n          {title && (\n            <h2 className=\"text-xl font-semibold leading-none tracking-tight\">\n              {title}\n            </h2>\n          )}\n          {description && (\n            <p className=\"text-muted-foreground text-sm\">{description}</p>\n          )}\n        </div>\n      )}\n      {actionButtons && actionButtons.length > 0 && (\n        <ActionListRenderer\n          actions={actionButtons}\n          className=\"flex justify-end gap-2\"\n          layout=\"horizontal\"\n        />\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;AAMA,SAAgB,WAAoB,EAClC,eACA,WACA,aACA,SACqB;AAErB,KACE,CAAC,SACD,CAAC,gBACA,CAAC,iBAAiB,cAAc,WAAW,GAE5C,QAAO;AAGT,QACE,qBAAC;EAAI,WAAW,GAAG,aAAa,UAAU;cACtC,SAAS,gBACT,qBAAC;GAAI,WAAU;cACZ,SACC,oBAAC;IAAG,WAAU;cACX;KACE,EAEN,eACC,oBAAC;IAAE,WAAU;cAAiC;KAAgB;IAE5D,EAEP,iBAAiB,cAAc,SAAS,KACvC,oBAAC;GACC,SAAS;GACT,WAAU;GACV,QAAO;IACP;GAEA;;;eAvCyC"}

package/dist/esm/components/shared/headers/WizardHeader.d.ts

@@ -0,0 +1,9 @@
+import { BaseHeaderProps } from "../types/header.js";
+
+//#region src/components/shared/headers/WizardHeader.d.ts
+declare function WizardHeader<T = any>({
+  className
+}: BaseHeaderProps<T>): any;
+//#endregion
+export { WizardHeader };
+//# sourceMappingURL=WizardHeader.d.ts.map

package/dist/esm/components/shared/headers/WizardHeader.js

@@ -0,0 +1,124 @@
+import { __esmMin } from "../../../_virtual/rolldown_runtime.js";
+import { calculateStepState, createStepClickHandler, createStepKeyHandler, init_stepState } from "../utils/stepState.js";
+import { getComponentSizeClass, init_sizing } from "../../sizing/index.js";
+import { init_HeaderContext, useHeaderContext } from "../context/HeaderContext.js";
+import { init_header, isWizardNavigation } from "../types/header.js";
+import { cn } from "@lumeweb/portal-framework-ui-core";
+import React, { useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { isElement, isValidElementType } from "react-is";
+import { Check } from "lucide-react";
+
+//#region src/components/shared/headers/WizardHeader.tsx
+function WizardHeader({ className }) {
+	const context = useHeaderContext();
+	if (!isWizardNavigation(context.navigation)) {
+		console.warn("WizardHeader rendered without wizard navigation context");
+		return null;
+	}
+	const { allowNavigation, current, descriptionMaxWidth = "xs", disabledSteps = [], iconSize = "sm", onStepClick, showStepDescriptions = true, showStepTitles = true, steps = [], total } = context.navigation;
+	const resolvedAllowNavigation = useMemo(() => {
+		if (typeof allowNavigation === "function") return allowNavigation();
+		return allowNavigation;
+	}, [allowNavigation]);
+	const renderMobileProgressBars = () => /* @__PURE__ */ jsxs("div", {
+		className: "mb-6 w-full px-4 md:hidden",
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "bg-muted flex h-1 w-full overflow-hidden rounded-full",
+			children: Array.from({ length: total }, (_, index) => {
+				const stepState = calculateStepState(index, current, total, resolvedAllowNavigation, disabledSteps, steps);
+				return /* @__PURE__ */ jsx("div", {
+					className: cn("h-full flex-1 transition-all duration-300", {
+						"bg-accent": stepState.isCompleted,
+						"bg-muted": !stepState.isCompleted && !stepState.isActive,
+						"bg-primary": stepState.isActive && !stepState.isCompleted,
+						"cursor-pointer": stepState.canNavigate
+					}),
+					onClick: stepState.canNavigate ? createStepClickHandler(index, resolvedAllowNavigation, disabledSteps, current, onStepClick) : void 0,
+					onKeyDown: stepState.canNavigate ? createStepKeyHandler(index, resolvedAllowNavigation, disabledSteps, current, onStepClick) : void 0,
+					role: stepState.canNavigate ? "button" : void 0,
+					tabIndex: stepState.canNavigate ? 0 : -1
+				}, index);
+			})
+		}), steps[current] && /* @__PURE__ */ jsxs("div", {
+			className: "mt-4 text-center",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "mb-2 flex items-center justify-center gap-2",
+				children: [renderIcon(steps[current].icon, iconSize) && /* @__PURE__ */ jsx("div", {
+					className: "flex items-center",
+					children: renderIcon(steps[current].icon, iconSize)
+				}), /* @__PURE__ */ jsx("span", {
+					className: "text-primary text-sm font-medium",
+					children: steps[current].shortTitle || steps[current].title || `Step ${current}`
+				})]
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "text-muted-foreground text-xs",
+				children: [
+					"Step ",
+					current,
+					" of ",
+					total
+				]
+			})]
+		})]
+	});
+	const renderDesktopTimeline = () => /* @__PURE__ */ jsx("div", {
+		className: "mb-6 hidden items-center justify-center gap-4 px-4 md:flex",
+		children: Array.from({ length: total }, (_, index) => {
+			const stepState = calculateStepState(index, current, total, resolvedAllowNavigation, disabledSteps, steps);
+			return /* @__PURE__ */ jsxs("div", {
+				className: "flex items-center",
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "flex flex-col items-center justify-center",
+					children: [
+						/* @__PURE__ */ jsx("div", {
+							"aria-current": stepState.isActive ? "step" : void 0,
+							"aria-disabled": stepState.isDisabled,
+							className: `flex h-10 w-10 items-center justify-center rounded-full transition-all duration-200 ${stepState.isCompleted ? "bg-accent text-white" : stepState.isActive ? "bg-primary text-primary-foreground ring-primary/20 ring-4" : "bg-muted text-muted-foreground"} ${stepState.canNavigate ? "cursor-pointer hover:scale-110 hover:shadow-lg" : ""}`,
+							onClick: stepState.canNavigate ? createStepClickHandler(index, resolvedAllowNavigation, disabledSteps, current, onStepClick) : void 0,
+							onKeyDown: stepState.canNavigate ? createStepKeyHandler(index, resolvedAllowNavigation, disabledSteps, current, onStepClick) : void 0,
+							role: stepState.canNavigate ? "button" : void 0,
+							tabIndex: stepState.canNavigate ? 0 : -1,
+							children: stepState.isCompleted ? /* @__PURE__ */ jsx(Check, { className: "h-5 w-5" }) : renderIcon(stepState.step.icon, "md") || /* @__PURE__ */ jsx("div", { className: "h-5 w-5" })
+						}),
+						showStepTitles && /* @__PURE__ */ jsx("span", {
+							className: `mt-3 text-center text-sm font-medium ${stepState.isActive ? "text-primary" : stepState.isCompleted ? "text-accent-foreground" : "text-muted-foreground"} ${stepState.canNavigate ? "cursor-pointer" : ""}`,
+							onClick: stepState.canNavigate ? createStepClickHandler(index, resolvedAllowNavigation, disabledSteps, current, onStepClick) : void 0,
+							children: stepState.step.shortTitle || stepState.step.title
+						}),
+						showStepDescriptions && stepState.step.description && /* @__PURE__ */ jsx("span", {
+							className: cn("text-muted-foreground mt-2 text-center text-xs", getComponentSizeClass(descriptionMaxWidth)),
+							children: stepState.step.description
+						})
+					]
+				}), index < total - 1 && /* @__PURE__ */ jsx("div", { className: `mx-2 h-0.5 w-6 transition-all duration-200 ${stepState.isCompleted ? "bg-accent" : "bg-muted"}` })]
+			}, index);
+		})
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("space-y-6", className),
+		children: [renderMobileProgressBars(), renderDesktopTimeline()]
+	});
+}
+function renderIcon(icon, size = "sm") {
+	if (!icon) return null;
+	const sizeClasses = {
+		lg: "h-6 w-6",
+		md: "h-5 w-5",
+		sm: "h-4 w-4"
+	};
+	if (isElement(icon)) return React.cloneElement(icon, { className: cn(icon.props.className, sizeClasses[size]) });
+	if (isValidElementType(icon)) return /* @__PURE__ */ jsx(icon, { className: sizeClasses[size] });
+	return null;
+}
+var init_WizardHeader = __esmMin(() => {
+	init_sizing();
+	init_HeaderContext();
+	init_header();
+	init_stepState();
+});
+
+//#endregion
+init_WizardHeader();
+export { WizardHeader, init_WizardHeader };
+//# sourceMappingURL=WizardHeader.js.map

package/dist/esm/components/shared/headers/WizardHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WizardHeader.js","names":[],"sources":["../../../../../src/components/shared/headers/WizardHeader.tsx"],"sourcesContent":["import { cn } from \"@lumeweb/portal-framework-ui-core\";\nimport { Check } from \"lucide-react\";\nimport React, { useMemo } from \"react\";\nimport { isElement, isValidElementType } from \"react-is\";\n\nimport { ComponentSize, getComponentSizeClass } from \"../../sizing\";\nimport { useHeaderContext } from \"../context/HeaderContext\";\nimport { BaseHeaderProps, isWizardNavigation } from \"../types/header\";\nimport {\n  calculateStepState,\n  createStepClickHandler,\n  createStepKeyHandler,\n} from \"../utils/stepState\";\n\nexport function WizardHeader<T = any>({ className }: BaseHeaderProps<T>) {\n  const context = useHeaderContext<T>();\n\n  // Wizard header requires wizard navigation context\n  if (!isWizardNavigation(context.navigation)) {\n    console.warn(\"WizardHeader rendered without wizard navigation context\");\n    return null;\n  }\n\n  const {\n    allowNavigation,\n    current,\n    descriptionMaxWidth = \"xs\" as ComponentSize,\n    disabledSteps = [],\n    iconSize = \"sm\",\n    onStepClick,\n    showStepDescriptions = true,\n    showStepTitles = true,\n    steps = [],\n    total,\n  } = context.navigation;\n\n  // Resolve allowNavigation value (it's already pre-resolved)\n  const resolvedAllowNavigation = useMemo(() => {\n    if (typeof allowNavigation === \"function\") {\n      return allowNavigation();\n    }\n    return allowNavigation;\n  }, [allowNavigation]);\n\n  // Mobile Instagram-style progress bars\n  const renderMobileProgressBars = () => (\n    <div className=\"mb-6 w-full px-4 md:hidden\">\n      <div className=\"bg-muted flex h-1 w-full overflow-hidden rounded-full\">\n        {Array.from({ length: total }, (_, index) => {\n          const stepState = calculateStepState(\n            index,\n            current,\n            total,\n            resolvedAllowNavigation,\n            disabledSteps,\n            steps,\n          );\n\n          return (\n            <div\n              className={cn(\"h-full flex-1 transition-all duration-300\", {\n                \"bg-accent\": stepState.isCompleted,\n                \"bg-muted\": !stepState.isCompleted && !stepState.isActive,\n                \"bg-primary\": stepState.isActive && !stepState.isCompleted,\n                \"cursor-pointer\": stepState.canNavigate,\n              })}\n              key={index}\n              onClick={\n                stepState.canNavigate\n                  ? createStepClickHandler(\n                      index,\n                      resolvedAllowNavigation,\n                      disabledSteps,\n                      current,\n                      onStepClick,\n                    )\n                  : undefined\n              }\n              onKeyDown={\n                stepState.canNavigate\n                  ? createStepKeyHandler(\n                      index,\n                      resolvedAllowNavigation,\n                      disabledSteps,\n                      current,\n                      onStepClick,\n                    )\n                  : undefined\n              }\n              role={stepState.canNavigate ? \"button\" : undefined}\n              tabIndex={stepState.canNavigate ? 0 : -1}\n            />\n          );\n        })}\n      </div>\n      {steps[current] && (\n        <div className=\"mt-4 text-center\">\n          <div className=\"mb-2 flex items-center justify-center gap-2\">\n            {renderIcon(steps[current].icon, iconSize) && (\n              <div className=\"flex items-center\">\n                {renderIcon(steps[current].icon, iconSize)}\n              </div>\n            )}\n            <span className=\"text-primary text-sm font-medium\">\n              {steps[current].shortTitle ||\n                steps[current].title ||\n                `Step ${current}`}\n            </span>\n          </div>\n          <div className=\"text-muted-foreground text-xs\">\n            Step {current} of {total}\n          </div>\n        </div>\n      )}\n    </div>\n  );\n\n  // Desktop circular timeline\n  const renderDesktopTimeline = () => (\n    <div className=\"mb-6 hidden items-center justify-center gap-4 px-4 md:flex\">\n      {Array.from({ length: total }, (_, index) => {\n        const stepState = calculateStepState(\n          index,\n          current,\n          total,\n          resolvedAllowNavigation,\n          disabledSteps,\n          steps,\n        );\n\n        return (\n          <div className=\"flex items-center\" key={index}>\n            <div className=\"flex flex-col items-center justify-center\">\n              <div\n                aria-current={stepState.isActive ? \"step\" : undefined}\n                aria-disabled={stepState.isDisabled}\n                className={`flex h-10 w-10 items-center justify-center rounded-full transition-all duration-200 ${\n                  stepState.isCompleted\n                    ? \"bg-accent text-white\"\n                    : stepState.isActive\n                      ? \"bg-primary text-primary-foreground ring-primary/20 ring-4\"\n                      : \"bg-muted text-muted-foreground\"\n                } ${stepState.canNavigate ? \"cursor-pointer hover:scale-110 hover:shadow-lg\" : \"\"}`}\n                onClick={\n                  stepState.canNavigate\n                    ? createStepClickHandler(\n                        index,\n                        resolvedAllowNavigation,\n                        disabledSteps,\n                        current,\n                        onStepClick,\n                      )\n                    : undefined\n                }\n                onKeyDown={\n                  stepState.canNavigate\n                    ? createStepKeyHandler(\n                        index,\n                        resolvedAllowNavigation,\n                        disabledSteps,\n                        current,\n                        onStepClick,\n                      )\n                    : undefined\n                }\n                role={stepState.canNavigate ? \"button\" : undefined}\n                tabIndex={stepState.canNavigate ? 0 : -1}>\n                {stepState.isCompleted ? (\n                  <Check className=\"h-5 w-5\" />\n                ) : (\n                  renderIcon(stepState.step.icon, \"md\") || (\n                    <div className=\"h-5 w-5\" />\n                  )\n                )}\n              </div>\n              {showStepTitles && (\n                <span\n                  className={`mt-3 text-center text-sm font-medium ${\n                    stepState.isActive\n                      ? \"text-primary\"\n                      : stepState.isCompleted\n                        ? \"text-accent-foreground\"\n                        : \"text-muted-foreground\"\n                  } ${stepState.canNavigate ? \"cursor-pointer\" : \"\"}`}\n                  onClick={\n                    stepState.canNavigate\n                      ? createStepClickHandler(\n                          index,\n                          resolvedAllowNavigation,\n                          disabledSteps,\n                          current,\n                          onStepClick,\n                        )\n                      : undefined\n                  }>\n                  {stepState.step.shortTitle || stepState.step.title}\n                </span>\n              )}\n              {showStepDescriptions && stepState.step.description && (\n                <span\n                  className={cn(\n                    \"text-muted-foreground mt-2 text-center text-xs\",\n                    getComponentSizeClass(descriptionMaxWidth),\n                  )}>\n                  {stepState.step.description}\n                </span>\n              )}\n            </div>\n            {index < total - 1 && (\n              <div\n                className={`mx-2 h-0.5 w-6 transition-all duration-200 ${\n                  stepState.isCompleted ? \"bg-accent\" : \"bg-muted\"\n                }`}\n              />\n            )}\n          </div>\n        );\n      })}\n    </div>\n  );\n\n  return (\n    <div className={cn(\"space-y-6\", className)}>\n      {renderMobileProgressBars()}\n      {renderDesktopTimeline()}\n    </div>\n  );\n}\n\n// Helper function to safely render icons\nfunction renderIcon(\n  icon: React.ReactNode,\n  size: \"lg\" | \"md\" | \"sm\" = \"sm\",\n): React.ReactNode {\n  if (!icon) return null;\n\n  // Define size classes\n  const sizeClasses = {\n    lg: \"h-6 w-6\",\n    md: \"h-5 w-5\",\n    sm: \"h-4 w-4\",\n  };\n\n  // If icon is already a valid React element, clone it with size classes\n  if (isElement(icon)) {\n    return React.cloneElement(icon as React.ReactElement, {\n      className: cn(\n        (icon as React.ReactElement).props.className,\n        sizeClasses[size],\n      ),\n    });\n  }\n\n  // If icon is a valid React component type, instantiate it with size classes\n  if (isValidElementType(icon)) {\n    const IconComponent = icon as React.ComponentType<{ className?: string }>;\n    return <IconComponent className={sizeClasses[size]} />;\n  }\n\n  // For any other case, return null\n  return null;\n}\n"],"mappings":"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"}

package/dist/esm/components/shared/headers/index.d.ts

@@ -0,0 +1,4 @@
+import { DefaultHeader } from "./DefaultHeader.js";
+import { FormHeader } from "./FormHeader.js";
+import { WizardHeader } from "./WizardHeader.js";
+export { DefaultHeader, FormHeader, WizardHeader };

package/dist/esm/components/shared/headers/index.js

@@ -0,0 +1,16 @@
+import { __esmMin } from "../../../_virtual/rolldown_runtime.js";
+import { DefaultHeader, init_DefaultHeader } from "./DefaultHeader.js";
+import { FormHeader, init_FormHeader } from "./FormHeader.js";
+import { WizardHeader, init_WizardHeader } from "./WizardHeader.js";
+
+//#region src/components/shared/headers/index.ts
+var init_headers = __esmMin(() => {
+	init_DefaultHeader();
+	init_FormHeader();
+	init_WizardHeader();
+});
+
+//#endregion
+init_headers();
+export { DefaultHeader, FormHeader, WizardHeader, init_headers };
+//# sourceMappingURL=index.js.map

package/dist/esm/components/shared/headers/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/shared/headers/index.ts"],"sourcesContent":["export * from \"./DefaultHeader\";\nexport * from \"./FormHeader\";\nexport * from \"./WizardHeader\";\n"],"mappings":""}

package/dist/esm/components/shared/hooks/index.d.ts

@@ -0,0 +1,3 @@
+import { useForceRerender } from "./useForceRerender.js";
+import { useEnvironmentSync } from "./useEnvironmentSync.js";
+export { useEnvironmentSync, useForceRerender };

package/dist/esm/components/shared/hooks/index.js

@@ -0,0 +1,14 @@
+import { __esmMin } from "../../../_virtual/rolldown_runtime.js";
+import { init_useEnvironmentSync, useEnvironmentSync } from "./useEnvironmentSync.js";
+import { init_useForceRerender, useForceRerender } from "./useForceRerender.js";
+
+//#region src/components/shared/hooks/index.ts
+var init_hooks = __esmMin(() => {
+	init_useForceRerender();
+	init_useEnvironmentSync();
+});
+
+//#endregion
+init_hooks();
+export { init_hooks, useEnvironmentSync, useForceRerender };
+//# sourceMappingURL=index.js.map

package/dist/esm/components/shared/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/shared/hooks/index.ts"],"sourcesContent":["export * from \"./useForceRerender\";\nexport * from \"./useEnvironmentSync\";\n"],"mappings":""}

package/dist/esm/components/shared/hooks/useEnvironmentSync.d.ts

@@ -0,0 +1,18 @@
+import { EnvironmentSyncCallback } from "../types/form.js";
+import { UnifiedEnvironment } from "../types/environment.js";
+
+//#region src/components/shared/hooks/useEnvironmentSync.d.ts
+
+/**
+ * Hook to provide environment sync functionality
+ *
+ * This hook is a simple mechanism to call the callback with the environment
+ * when it's provided. It doesn't manage any state internally.
+ *
+ * @param currentEnvironment - The current environment to sync
+ * @param environmentSyncCallback - Optional callback that receives the environment directly
+ */
+declare function useEnvironmentSync(currentEnvironment: UnifiedEnvironment | null, environmentSyncCallback?: EnvironmentSyncCallback): void;
+//#endregion
+export { useEnvironmentSync };
+//# sourceMappingURL=useEnvironmentSync.d.ts.map

package/dist/esm/components/shared/hooks/useEnvironmentSync.js

@@ -0,0 +1,21 @@
+import { __esmMin } from "../../../_virtual/rolldown_runtime.js";
+
+//#region src/components/shared/hooks/useEnvironmentSync.ts
+/**
+* Hook to provide environment sync functionality
+* 
+* This hook is a simple mechanism to call the callback with the environment
+* when it's provided. It doesn't manage any state internally.
+* 
+* @param currentEnvironment - The current environment to sync
+* @param environmentSyncCallback - Optional callback that receives the environment directly
+*/
+function useEnvironmentSync(currentEnvironment, environmentSyncCallback) {
+	if (environmentSyncCallback && currentEnvironment) environmentSyncCallback(currentEnvironment);
+}
+var init_useEnvironmentSync = __esmMin(() => {});
+
+//#endregion
+init_useEnvironmentSync();
+export { init_useEnvironmentSync, useEnvironmentSync };
+//# sourceMappingURL=useEnvironmentSync.js.map

package/dist/esm/components/shared/hooks/useEnvironmentSync.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEnvironmentSync.js","names":[],"sources":["../../../../../src/components/shared/hooks/useEnvironmentSync.ts"],"sourcesContent":["import type { EnvironmentSyncCallback } from \"../types/form\";\nimport type { UnifiedEnvironment } from \"../types/environment\";\n\n/**\n * Hook to provide environment sync functionality\n * \n * This hook is a simple mechanism to call the callback with the environment\n * when it's provided. It doesn't manage any state internally.\n * \n * @param currentEnvironment - The current environment to sync\n * @param environmentSyncCallback - Optional callback that receives the environment directly\n */\nexport function useEnvironmentSync(\n  currentEnvironment: UnifiedEnvironment | null,\n  environmentSyncCallback?: EnvironmentSyncCallback\n) {\n  // Call the callback with the current environment if provided\n  if (environmentSyncCallback && currentEnvironment) {\n    environmentSyncCallback(currentEnvironment);\n  }\n}\n"],"mappings":";;;;;;;;;;;;AAYA,SAAgB,mBACd,oBACA,yBACA;AAEA,KAAI,2BAA2B,mBAC7B,yBAAwB,mBAAmB"}

package/dist/esm/components/shared/hooks/useForceRerender.d.ts

@@ -0,0 +1,18 @@
+import { ForceRerenderCallback } from "../types/form.js";
+
+//#region src/components/shared/hooks/useForceRerender.d.ts
+
+/**
+ * Hook to provide force rerender functionality
+ *
+ * This hook manages a force rerender mechanism that can be triggered
+ * from outside the normal React render loop. It accepts an optional
+ * callback that the framework can call with a rerender method,
+ * which can then be stored and used to force a rerender when needed.
+ *
+ * @param forceRerenderCallback - Optional callback that receives the force rerender method
+ */
+declare function useForceRerender(forceRerenderCallback?: ForceRerenderCallback): void;
+//#endregion
+export { useForceRerender };
+//# sourceMappingURL=useForceRerender.d.ts.map

package/dist/esm/components/shared/hooks/useForceRerender.js

@@ -0,0 +1,29 @@
+import { __esmMin } from "../../../_virtual/rolldown_runtime.js";
+import { useCallback, useState } from "react";
+
+//#region src/components/shared/hooks/useForceRerender.ts
+/**
+* Hook to provide force rerender functionality
+* 
+* This hook manages a force rerender mechanism that can be triggered
+* from outside the normal React render loop. It accepts an optional
+* callback that the framework can call with a rerender method,
+* which can then be stored and used to force a rerender when needed.
+* 
+* @param forceRerenderCallback - Optional callback that receives the force rerender method
+*/
+function useForceRerender(forceRerenderCallback) {
+	const [, setCounter] = useState(0);
+	const forceRerender = useCallback(() => {
+		setCounter((prev) => prev + 1);
+	}, []);
+	useCallback(() => {
+		if (forceRerenderCallback) forceRerenderCallback(forceRerender);
+	}, [forceRerender, forceRerenderCallback])();
+}
+var init_useForceRerender = __esmMin(() => {});
+
+//#endregion
+init_useForceRerender();
+export { init_useForceRerender, useForceRerender };
+//# sourceMappingURL=useForceRerender.js.map

package/dist/esm/components/shared/hooks/useForceRerender.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useForceRerender.js","names":[],"sources":["../../../../../src/components/shared/hooks/useForceRerender.ts"],"sourcesContent":["import { useCallback, useState } from \"react\";\n\nimport type { ForceRerenderCallback } from \"../types/form\";\n\n/**\n * Hook to provide force rerender functionality\n * \n * This hook manages a force rerender mechanism that can be triggered\n * from outside the normal React render loop. It accepts an optional\n * callback that the framework can call with a rerender method,\n * which can then be stored and used to force a rerender when needed.\n * \n * @param forceRerenderCallback - Optional callback that receives the force rerender method\n */\nexport function useForceRerender(forceRerenderCallback?: ForceRerenderCallback) {\n  const [, setCounter] = useState(0);\n\n  // The force rerender method that can be called externally\n  const forceRerender = useCallback(() => {\n    setCounter((prev) => prev + 1);\n  }, []);\n\n  // Set up the callback if provided\n  useCallback(() => {\n    if (forceRerenderCallback) {\n      forceRerenderCallback(forceRerender);\n    }\n  }, [forceRerender, forceRerenderCallback])();\n\n  // Return nothing - the hook is used for its side effect of setting up the callback\n}"],"mappings":";;;;;;;;;;;;;;AAcA,SAAgB,iBAAiB,uBAA+C;CAC9E,MAAM,GAAG,cAAc,SAAS,EAAE;CAGlC,MAAM,gBAAgB,kBAAkB;AACtC,cAAY,SAAS,OAAO,EAAE;IAC7B,EAAE,CAAC;AAGN,mBAAkB;AAChB,MAAI,sBACF,uBAAsB,cAAc;IAErC,CAAC,eAAe,sBAAsB,CAAC,EAAE"}

package/dist/esm/components/shared/index.d.ts

@@ -0,0 +1,38 @@
+import { AnyContainerEnvironment, ContainerEnvironment, ContainerType, DialogContainerEnvironment, StandaloneContainerEnvironment, isDialogContainer, isStandaloneContainer } from "./types/container.js";
+import { AnyFormEnvironment, EnvironmentSyncCallback, ForceRerenderCallback, ForceRerenderMethod, FormEnvironment, FormType, SimpleFormEnvironment, StepFormEnvironment, WizardFormEnvironment, isSimpleForm, isStepForm, isWizardForm } from "./types/form.js";
+import { StepEnvironment, createStepEnvironment } from "./types/step.js";
+import { UnifiedEnvironment } from "./types/environment.js";
+import { AllowStepNavigation } from "./types/navigation.js";
+import { BaseFooterProps, FooterEnvironment, FormFooterProps, hasStepEnvironment, isDialogFooterEnvironment, isSimpleFooterEnvironment, isStandaloneFooterEnvironment, isStepFooterEnvironment, isWizardFooterEnvironment } from "./types/footer.js";
+import { FooterContextProvider, useFooterContext, useOptionalFooterContext } from "./context/FooterContext.js";
+import { AnyNavigationEnvironment, BaseHeaderProps, HeaderContent, HeaderEnvironment, NavigationEnvironment, NavigationType, NoneNavigationEnvironment, ProgressStyleType, StepNavigationEnvironment, WizardNavigationEnvironment, getEffectiveAllowNavigation, hasNavigation, isNoneNavigation, isStepHeaderEnvironment, isStepNavigation, isWizardHeaderEnvironment, isWizardNavigation } from "./types/header.js";
+import { HeaderContextProvider, useHeaderContext, useOptionalHeaderContext } from "./context/HeaderContext.js";
+import "./context/index.js";
+import "./types/index.js";
+import { Environment, EnvironmentBuilder, FooterEnvironmentBuilder, HeaderEnvironmentBuilder } from "./environment/builders.js";
+import { ActionsFooter } from "./footers/ActionsFooter.js";
+import { DefaultFooter } from "./footers/DefaultFooter.js";
+import { FormFooter } from "./footers/FormFooter.js";
+import { StepFormFooter } from "./footers/StepFormFooter.js";
+import { WizardFooter } from "./footers/WizardFooter.js";
+import "./footers/index.js";
+import { DefaultHeader } from "./headers/DefaultHeader.js";
+import { FormHeader } from "./headers/FormHeader.js";
+import { WizardHeader } from "./headers/WizardHeader.js";
+import "./headers/index.js";
+import { FooterComponent, FooterType, HeaderComponent, HeaderType } from "./registry/types.js";
+import { FooterRegistry, createFooterRegistry, footerRegistry } from "./registry/FooterRegistry.js";
+import { HeaderRegistry, createHeaderRegistry, headerRegistry } from "./registry/HeaderRegistry.js";
+import "./registry/index.js";
+import { UnifiedFooter } from "./UnifiedFooter.js";
+import { UnifiedHeader } from "./UnifiedHeader.js";
+import { createForceRerenderReceiver } from "./utils/createForceRerenderReceiver.js";
+import { createEnvironmentReceiver } from "./utils/createEnvironmentReceiver.js";
+import { FooterRenderConfig, renderFooter } from "./utils/renderFooter.js";
+import { HeaderRenderConfig, renderHeader } from "./utils/renderHeader.js";
+import { StepState, calculateStepState, createStepClickHandler, createStepKeyHandler, resolveAllowStepNavigation } from "./utils/stepState.js";
+import "./utils/index.js";
+import { useForceRerender } from "./hooks/useForceRerender.js";
+import { useEnvironmentSync } from "./hooks/useEnvironmentSync.js";
+import "./hooks/index.js";
+export { ActionsFooter, AllowStepNavigation, AnyContainerEnvironment, AnyFormEnvironment, AnyNavigationEnvironment, BaseFooterProps, BaseHeaderProps, ContainerEnvironment, ContainerType, DefaultFooter, DefaultHeader, DialogContainerEnvironment, Environment, EnvironmentBuilder, EnvironmentSyncCallback, FooterComponent, FooterContextProvider, FooterEnvironment, FooterEnvironmentBuilder, FooterRegistry, FooterRenderConfig, FooterType, ForceRerenderCallback, ForceRerenderMethod, FormEnvironment, FormFooter, FormFooterProps, FormHeader, FormType, HeaderComponent, HeaderContent, HeaderContextProvider, HeaderEnvironment, HeaderEnvironmentBuilder, HeaderRegistry, HeaderRenderConfig, HeaderType, NavigationEnvironment, NavigationType, NoneNavigationEnvironment, ProgressStyleType, SimpleFormEnvironment, StandaloneContainerEnvironment, StepEnvironment, StepFormEnvironment, StepFormFooter, StepNavigationEnvironment, StepState, UnifiedEnvironment, UnifiedFooter, UnifiedHeader, WizardFooter, WizardFormEnvironment, WizardHeader, WizardNavigationEnvironment, calculateStepState, createEnvironmentReceiver, createFooterRegistry, createForceRerenderReceiver, createHeaderRegistry, createStepClickHandler, createStepEnvironment, createStepKeyHandler, footerRegistry, getEffectiveAllowNavigation, hasNavigation, hasStepEnvironment, headerRegistry, isDialogContainer, isDialogFooterEnvironment, isNoneNavigation, isSimpleFooterEnvironment, isSimpleForm, isStandaloneContainer, isStandaloneFooterEnvironment, isStepFooterEnvironment, isStepForm, isStepHeaderEnvironment, isStepNavigation, isWizardFooterEnvironment, isWizardForm, isWizardHeaderEnvironment, isWizardNavigation, renderFooter, renderHeader, resolveAllowStepNavigation, useEnvironmentSync, useFooterContext, useForceRerender, useHeaderContext, useOptionalFooterContext, useOptionalHeaderContext };