@incodetech/web 2.0.1-rc.0 → 2.1.0-rc.0

package/dist/snackbar-CxepGC3e.js

@@ -0,0 +1,16 @@
+import { v as u } from "./vendor-preact-DThS2ZQ_.js";
+import { n as cn } from "./loadingIcon-B0ysgiNq.js";
+//#region src/shared/snackbar/snackbar.tsx
+var Snackbar = ({ variant = "neutral", children, className, ariaLive = "polite" }) => {
+	return /* @__PURE__ */ u("div", {
+		role: "status",
+		"aria-live": ariaLive,
+		class: cn("IncodeSnackbar", `IncodeSnackbar--${variant}`, className),
+		children: /* @__PURE__ */ u("span", {
+			class: "IncodeSnackbarContent",
+			children
+		})
+	});
+};
+//#endregion
+export { Snackbar as t };

package/dist/spinner-B6RxGFrI.js

@@ -0,0 +1 @@
+import "./spinner-D8a_2LvW.js";

package/dist/spinner-D8a_2LvW.js

@@ -0,0 +1,42 @@
+import { _ as y, l as A, v as u, x as k } from "./vendor-preact-DThS2ZQ_.js";
+import { n as cn, r as Spacer, t as LoadingIcon } from "./loadingIcon-B0ysgiNq.js";
+import { t as Title } from "./typography-YLgHHuao.js";
+//#region src/shared/spinner/spinner.tsx
+var sizeMap = {
+	small: 24,
+	medium: 48,
+	large: 64
+};
+var Spinner = ({ title, subtitle, size = "medium", fullScreen = true, className }) => {
+	const iconSize = sizeMap[size];
+	const titleRef = A(null);
+	y(() => {
+		if (title) titleRef.current?.focus();
+	}, [title]);
+	return /* @__PURE__ */ u("div", {
+		class: cn("IncodeSpinner", fullScreen && "IncodeSpinnerFullScreen", className),
+		"data-testid": "spinner",
+		"data-title": title,
+		"data-subtitle": subtitle,
+		"data-size": size,
+		role: "status",
+		"aria-live": "polite",
+		children: /* @__PURE__ */ u("div", {
+			class: "IncodeSpinnerContent",
+			children: [/* @__PURE__ */ u(LoadingIcon, { size: iconSize }), (title || subtitle) && /* @__PURE__ */ u(k, { children: [/* @__PURE__ */ u(Spacer, { size: 16 }), /* @__PURE__ */ u("div", {
+				class: "IncodeSpinnerText",
+				children: [title && /* @__PURE__ */ u(Title, {
+					ref: titleRef,
+					tabIndex: -1,
+					className: "IncodeSpinnerTitle",
+					children: title
+				}), subtitle && /* @__PURE__ */ u(k, { children: [title && /* @__PURE__ */ u(Spacer, { size: 12 }), /* @__PURE__ */ u("p", {
+					class: "IncodeSpinnerSubtitle",
+					children: subtitle
+				})] })]
+			})] })]
+		})
+	});
+};
+//#endregion
+export { Spinner as t };

package/dist/statusPage-DMYPUwRZ.js

@@ -0,0 +1,28 @@
+import { v as u } from "./vendor-preact-DThS2ZQ_.js";
+import { r as Spacer } from "./loadingIcon-B0ysgiNq.js";
+import { t as Page } from "./page-DxGQj7Gk.js";
+import { t as AutoFocusTitle } from "./autoFocusTitle-BzkUiELM.js";
+//#region src/shared/statusPage/statusPage.tsx
+var StatusPage = ({ variant, icon, title, subtitle, hideFooterBranding }) => /* @__PURE__ */ u(Page, {
+	className: `IncodeStatusPage IncodeStatusPage--${variant}`,
+	hideFooterBranding,
+	children: /* @__PURE__ */ u("div", {
+		class: "IncodeStatusPageContainer",
+		role: variant === "loading" ? "status" : void 0,
+		"aria-live": variant === "loading" ? "polite" : void 0,
+		children: [
+			icon,
+			/* @__PURE__ */ u(Spacer, { size: 16 }),
+			/* @__PURE__ */ u(AutoFocusTitle, {
+				className: "IncodeStatusPageTitle",
+				children: title
+			}, variant),
+			subtitle && /* @__PURE__ */ u("p", {
+				class: "IncodeStatusPageSubtitle",
+				children: subtitle
+			})
+		]
+	})
+});
+//#endregion
+export { StatusPage as t };

package/dist/successIcon-BAyDPT7I.js

@@ -0,0 +1,30 @@
+import { v as u } from "./vendor-preact-DThS2ZQ_.js";
+//#region src/shared/icons/successIcon.tsx
+var SuccessIcon = ({ size = 64 }) => {
+	return /* @__PURE__ */ u("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: size,
+		height: size,
+		viewBox: "0 0 64 64",
+		fill: "none",
+		class: "IncodeSuccessIcon",
+		"aria-hidden": "true",
+		children: [
+			/* @__PURE__ */ u("title", { children: "status" }),
+			/* @__PURE__ */ u("path", {
+				"fill-rule": "evenodd",
+				"clip-rule": "evenodd",
+				d: "M32 6.66669C18.032 6.66669 6.66663 18.032 6.66663 32C6.66663 45.9707 18.032 57.3334 32 57.3334C45.968 57.3334 57.3333 45.9707 57.3333 32C57.3333 18.032 45.968 6.66669 32 6.66669Z",
+				fill: "var(--icon-status-positive)"
+			}),
+			/* @__PURE__ */ u("path", {
+				"fill-rule": "evenodd",
+				"clip-rule": "evenodd",
+				d: "M42.648 27.2587L30.3333 39.5733C29.9413 39.9653 29.432 40.16 28.92 40.16C28.4053 40.16 27.896 39.9653 27.504 39.5733L21.3466 33.416C20.5653 32.6347 20.5653 31.368 21.3466 30.5867C22.128 29.8053 23.392 29.8053 24.1733 30.5867L28.92 35.3307L39.8186 24.4293C40.6 23.648 41.8666 23.648 42.648 24.4293C43.4293 25.2107 43.4293 26.4773 42.648 27.2587Z",
+				fill: "var(--icon-neutral-0)"
+			})
+		]
+	});
+};
+//#endregion
+export { SuccessIcon as t };

package/dist/tabs-C8npVBbk.js

@@ -0,0 +1,103 @@
+import { b as Q, g as x, m as g, p as d, v as u } from "./vendor-preact-DThS2ZQ_.js";
+import { n as cn } from "./loadingIcon-B0ysgiNq.js";
+//#region src/shared/tabs/tabs.tsx
+var TabsContext = Q(null);
+var useTabsContext = () => {
+	const ctx = x(TabsContext);
+	if (!ctx) throw new Error("Tabs compound components must be used within <Tabs>");
+	return ctx;
+};
+var tabId = (baseId, value) => `${baseId}-tab-${value}`;
+var panelId = (baseId, value) => `${baseId}-panel-${value}`;
+var TabsRoot = ({ defaultValue, value, onValueChange, orientation = "horizontal", activation = "manual", listClassName, triggerClassName, activeTriggerClassName, children }) => {
+	const baseId = g();
+	const [internalValue, setInternalValue] = d(defaultValue ?? value ?? "");
+	const activeValue = value ?? internalValue;
+	const setActiveValue = (next) => {
+		if (value === void 0) setInternalValue(next);
+		onValueChange?.(next);
+	};
+	return /* @__PURE__ */ u(TabsContext.Provider, {
+		value: {
+			baseId,
+			activeValue,
+			setActiveValue,
+			orientation,
+			activation,
+			listClassName,
+			triggerClassName,
+			activeTriggerClassName
+		},
+		children
+	});
+};
+var TabsList = ({ label, labelledBy, children }) => {
+	const { listClassName, orientation } = useTabsContext();
+	return /* @__PURE__ */ u("div", {
+		role: "tablist",
+		"aria-orientation": orientation,
+		"aria-label": label,
+		"aria-labelledby": labelledBy,
+		class: listClassName,
+		children
+	});
+};
+var TabsTrigger = ({ value, disabled, children }) => {
+	const { baseId, activeValue, setActiveValue, orientation, activation, triggerClassName, activeTriggerClassName } = useTabsContext();
+	const selected = activeValue === value;
+	const handleKeyDown = (event) => {
+		const horizontal = orientation === "horizontal";
+		const nextKey = horizontal ? "ArrowRight" : "ArrowDown";
+		const prevKey = horizontal ? "ArrowLeft" : "ArrowUp";
+		if (event.key !== nextKey && event.key !== prevKey && event.key !== "Home" && event.key !== "End") return;
+		const list = event.currentTarget.closest("[role=\"tablist\"]");
+		if (!list) return;
+		const tabs = Array.from(list.querySelectorAll("[role=\"tab\"]:not([disabled])"));
+		const currentIndex = tabs.indexOf(event.currentTarget);
+		if (currentIndex === -1) return;
+		let target;
+		if (event.key === nextKey) target = tabs[(currentIndex + 1) % tabs.length];
+		else if (event.key === prevKey) target = tabs[(currentIndex - 1 + tabs.length) % tabs.length];
+		else if (event.key === "Home") target = tabs[0];
+		else if (event.key === "End") target = tabs[tabs.length - 1];
+		if (!target) return;
+		event.preventDefault();
+		target.focus();
+		if (activation === "automatic") {
+			const nextValue = target.dataset.value;
+			if (nextValue !== void 0) setActiveValue(nextValue);
+		}
+	};
+	return /* @__PURE__ */ u("button", {
+		type: "button",
+		role: "tab",
+		id: tabId(baseId, value),
+		"aria-selected": selected,
+		"aria-controls": panelId(baseId, value),
+		tabIndex: selected ? 0 : -1,
+		disabled,
+		"data-value": value,
+		class: cn(triggerClassName, selected && activeTriggerClassName),
+		onClick: () => setActiveValue(value),
+		onKeyDown: handleKeyDown,
+		children
+	});
+};
+var TabsContent = ({ value, className, children }) => {
+	const { baseId, activeValue } = useTabsContext();
+	if (activeValue !== value) return null;
+	return /* @__PURE__ */ u("div", {
+		role: "tabpanel",
+		id: panelId(baseId, value),
+		"aria-labelledby": tabId(baseId, value),
+		class: className,
+		children
+	});
+};
+var Tabs = Object.assign(TabsRoot, {
+	List: TabsList,
+	Trigger: TabsTrigger,
+	Content: TabsContent
+});
+//#endregion
+export { Tabs as t };

package/dist/themes/dark.css

@@ -729,6 +729,7 @@
   --surface-neutral-400: var(--primitive-color-gray-400);
   --surface-neutral-500: var(--primitive-color-gray-500);
   --surface-neutral-600: var(--primitive-color-gray-600);
+  --surface-neutral-600-static: var(--primitive-color-gray-600);
   --surface-neutral-700: var(--primitive-color-gray-700);
   --surface-neutral-750: var(--primitive-color-gray-750);
   --surface-neutral-800: var(--primitive-color-gray-800);
@@ -853,6 +854,7 @@
   --surface-neutral-400: var(--primitive-color-gray-500);
   --surface-neutral-500: var(--primitive-color-gray-300);
   --surface-neutral-600: var(--primitive-color-gray-250);
+  --surface-neutral-600-static: var(--primitive-color-gray-600);
   --surface-neutral-700: var(--primitive-color-gray-200);
   --surface-neutral-750: var(--primitive-color-gray-150);
   --surface-neutral-800: var(--primitive-color-gray-100);
@@ -1208,6 +1210,8 @@
   --redirect-options-max-width: 752px;
   --redirect-tabs-max-width: 676px;
   --redirect-tab-description-max-width: 434px;
+  --redirect-form-column-max-width: 326px;
+  --redirect-phone-input-country-code-width: 130px;
   --redirect-qr-wrapper-border-radius: 21px;
 
   /* digital ID upload */
@@ -1240,6 +1244,7 @@
   --surface-neutral-400: var(--primitive-color-gray-500);
   --surface-neutral-500: var(--primitive-color-gray-300);
   --surface-neutral-600: var(--primitive-color-gray-250);
+  --surface-neutral-600-static: var(--primitive-color-gray-600);
   --surface-neutral-700: var(--primitive-color-gray-200);
   --surface-neutral-750: var(--primitive-color-gray-150);
   --surface-neutral-800: var(--primitive-color-gray-100);

package/dist/themes/light.css

@@ -729,6 +729,7 @@
   --surface-neutral-400: var(--primitive-color-gray-400);
   --surface-neutral-500: var(--primitive-color-gray-500);
   --surface-neutral-600: var(--primitive-color-gray-600);
+  --surface-neutral-600-static: var(--primitive-color-gray-600);
   --surface-neutral-700: var(--primitive-color-gray-700);
   --surface-neutral-750: var(--primitive-color-gray-750);
   --surface-neutral-800: var(--primitive-color-gray-800);
@@ -853,6 +854,7 @@
   --surface-neutral-400: var(--primitive-color-gray-500);
   --surface-neutral-500: var(--primitive-color-gray-300);
   --surface-neutral-600: var(--primitive-color-gray-250);
+  --surface-neutral-600-static: var(--primitive-color-gray-600);
   --surface-neutral-700: var(--primitive-color-gray-200);
   --surface-neutral-750: var(--primitive-color-gray-150);
   --surface-neutral-800: var(--primitive-color-gray-100);
@@ -1208,6 +1210,8 @@
   --redirect-options-max-width: 752px;
   --redirect-tabs-max-width: 676px;
   --redirect-tab-description-max-width: 434px;
+  --redirect-form-column-max-width: 326px;
+  --redirect-phone-input-country-code-width: 130px;
   --redirect-qr-wrapper-border-radius: 21px;
 
   /* digital ID upload */

package/dist/transitionSpinner-DRRz-NV8.js

@@ -0,0 +1,26 @@
+import { n as useTranslation } from "./i18n-CoCO2ZuN.js";
+import { v as u } from "./vendor-preact-DThS2ZQ_.js";
+import { t as Spinner } from "./spinner-D8a_2LvW.js";
+import "./spinner-B6RxGFrI.js";
+//#region src/shared/processing/transitionSpinner.tsx
+/**
+* Canonical "we're getting ready / processing" loader.
+*
+* Renders a container-filling `Spinner` with the unified `loadingCircle.hangOn`
+* / `loadingCircle.validating` copy at `size="large"` so every cross-module
+* transition looks identical to the user. Optional `spinnerConfig` overrides
+* any of `title`, `subtitle`, or `size` for consumers that already exposed
+* those. Pass `hideText` to render the spinner icon on its own.
+*/
+var TransitionSpinner = ({ spinnerConfig, className, hideText = false }) => {
+	const { t } = useTranslation();
+	return /* @__PURE__ */ u(Spinner, {
+		title: hideText ? void 0 : spinnerConfig?.title ?? t("loadingCircle.hangOn"),
+		subtitle: hideText ? void 0 : spinnerConfig?.subtitle ?? t("loadingCircle.validating"),
+		size: spinnerConfig?.size ?? "large",
+		fullScreen: true,
+		className
+	});
+};
+//#endregion
+export { TransitionSpinner as t };