@schukai/monster 4.64.0 → 4.66.0

package/source/components/form/register-wizard.mjs

@@ -0,0 +1,3298 @@
+/**
+ * Copyright © Volker Schukai and all contributing authors, {{copyRightYear}}. All rights reserved.
+ * Node module: @schukai/monster
+ *
+ * This source code is licensed under the GNU Affero General Public License version 3 (AGPLv3).
+ * The full text of the license can be found at: https://www.gnu.org/licenses/agpl-3.0.en.html
+ *
+ * For those who do not wish to adhere to the AGPLv3, a commercial license is available.
+ * Acquiring a commercial license allows you to use this software without complying with the AGPLv3 terms.
+ * For more information about purchasing a commercial license, please contact Volker Schukai.
+ *
+ * SPDX-License-Identifier: AGPL-3.0
+ */
+
+import { instanceSymbol } from "../../constants.mjs";
+import { ATTRIBUTE_ERRORMESSAGE } from "../../dom/constants.mjs";
+import {
+	assembleMethodSymbol,
+	registerCustomElement,
+	CustomElement,
+} from "../../dom/customelement.mjs";
+import { addAttributeToken } from "../../dom/attributes.mjs";
+import { fireCustomEvent } from "../../dom/events.mjs";
+import { getLocaleOfDocument } from "../../dom/locale.mjs";
+import { Pathfinder } from "../../data/pathfinder.mjs";
+import { isFunction, isObject, isString } from "../../types/is.mjs";
+import { RegisterWizardStyleSheet } from "./stylesheet/register-wizard.mjs";
+
+import "../datatable/datasource/rest.mjs";
+import "./field-set.mjs";
+import "./password.mjs";
+import "./button.mjs";
+import "./message-state-button.mjs";
+import "../navigation/wizard-navigation.mjs";
+
+export { RegisterWizard };
+
+const wizardElementSymbol = Symbol("wizardElement");
+const panelElementsSymbol = Symbol("panelElements");
+const currentStepSymbol = Symbol("currentStep");
+const availabilityDatasourceSymbol = Symbol("availabilityDatasource");
+const registerDatasourceSymbol = Symbol("registerDatasource");
+const consentsDatasourceSymbol = Symbol("consentsDatasource");
+const availabilityStateSymbol = Symbol("availabilityState");
+const availabilityTimerSymbol = Symbol("availabilityTimer");
+const completedSymbol = Symbol("completed");
+const fieldSetElementsSymbol = Symbol("fieldSetElements");
+
+const emailInputSymbol = Symbol("emailInput");
+const passwordInputSymbol = Symbol("passwordInput");
+const passwordConfirmInputSymbol = Symbol("passwordConfirmInput");
+const passwordConfirmLabelSymbol = Symbol("passwordConfirmLabel");
+
+const profileInputsSymbol = Symbol("profileInputs");
+const birthDateLabelSymbol = Symbol("birthDateLabel");
+const nationalityLabelSymbol = Symbol("nationalityLabel");
+const addressInputsSymbol = Symbol("addressInputs");
+
+const availabilityMessageSymbol = Symbol("availabilityMessage");
+const nextButtonsSymbol = Symbol("nextButtons");
+const backButtonsSymbol = Symbol("backButtons");
+const availabilityNextButtonSymbol = Symbol("availabilityNextButton");
+const submitButtonSymbol = Symbol("submitButton");
+
+/**
+ * Registration wizard control using wizard navigation and multi-step forms.
+ *
+ * @since 4.38.0
+ * @summary A multi-step registration wizard with availability checks and register submit.
+ * @fires monster-register-wizard-step-change
+ * @fires monster-register-wizard-availability-check
+ * @fires monster-register-wizard-availability-result
+ * @fires monster-register-wizard-register
+ * @fires monster-register-wizard-success
+ * @fires monster-register-wizard-error
+ * @fires monster-register-wizard-invalid
+ */
+class RegisterWizard extends CustomElement {
+	static get [instanceSymbol]() {
+		return Symbol.for(
+			"@schukai/monster/components/form/register-wizard@@instance",
+		);
+	}
+
+	/**
+	 * To set the options via the HTML Tag, the attribute `data-monster-options` must be used.
+	 * @see {@link https://monsterjs.org/en/doc/#configurate-a-monster-control}
+	 *
+	 * @property {Object} templates Template definitions
+	 * @property {string} templates.main Main template
+	 * @property {Object} labels Labels
+	 * @property {Object} features Feature toggles
+	 * @property {Object} requirements Field requirement flags
+	 * @property {Object} tenant Tenant configuration
+	 * @property {Object} availability Availability check config
+	 * @property {Object} register Register submit config
+	 * @property {Object} consents Consent topics config
+	 * @property {Object} actions Callback actions
+	 */
+	get defaults() {
+		return Object.assign({}, super.defaults, {
+			templates: {
+				main: getTemplate(),
+			},
+			labels: getTranslations(),
+			features: {
+				autoCheckAvailability: false,
+				requireAvailability: true,
+				confirmPassword: false,
+				showAvailabilityMessage: true,
+				showBirthDate: false,
+				showNationality: false,
+			},
+			autocomplete: {
+				email: "email",
+				password: "new-password",
+				passwordConfirm: "new-password",
+				firstName: "given-name",
+				lastName: "family-name",
+				birthDate: "bday",
+				nationality: "country-name",
+				street: "address-line1",
+				zip: "postal-code",
+				city: "address-level2",
+				country: "country",
+			},
+			requirements: {
+				email: true,
+				password: true,
+				passwordConfirm: false,
+				firstName: true,
+				lastName: true,
+				birthDate: false,
+				nationality: false,
+				address: {
+					street: true,
+					zip: true,
+					city: true,
+					country: true,
+				},
+			},
+			tenant: {
+				id: null,
+			},
+			availability: {
+				url: null,
+				fetch: {
+					method: "POST",
+					headers: {
+						Accept: "application/json",
+						"Content-Type": "application/json",
+					},
+				},
+				payload: {
+					emailPath: "email",
+					tenantIdPath: "tenantId",
+				},
+				mapping: {
+					selector: "*",
+					availablePath: "available",
+					existsPath: "exists",
+					messagePath: null,
+				},
+			},
+			register: {
+				url: null,
+				fetch: {
+					method: "POST",
+					headers: {
+						Accept: "application/json",
+						"Content-Type": "application/json",
+					},
+				},
+				payload: {
+					tenantIdPath: "tenantId",
+					emailPath: "email",
+					passwordPath: "password",
+					firstNamePath: "person.firstName",
+					lastNamePath: "person.lastName",
+					birthDatePath: "person.birthDate",
+					nationalityPath: "person.nationality",
+					streetPath: "person.address.street",
+					zipPath: "person.address.zip",
+					cityPath: "person.address.city",
+					countryPath: "person.address.country",
+					consentsPath: "consents",
+				},
+				mapping: {
+					selector: "*",
+				},
+			},
+			consents: {
+				url: null,
+				fetch: {
+					method: "GET",
+					headers: {
+						Accept: "application/json",
+					},
+				},
+				mapping: {
+					selector: "*",
+					topicsPath: "topics",
+					topicPath: "topic",
+					labelPath: "label",
+					descriptionPath: "description",
+					requiredPath: "required",
+				},
+				topics: [
+					{
+						topic: "terms_and_conditions",
+						label: "Terms and conditions",
+						required: true,
+					},
+					{
+						topic: "privacy",
+						label: "Privacy policy",
+						required: true,
+					},
+					{
+						topic: "marketing",
+						label: "Marketing",
+						required: false,
+					},
+				],
+				grantedValue: "granted",
+				revokedValue: "revoked",
+			},
+			actions: {
+				onstepchange: null,
+				onavailabilitycheck: null,
+				onavailabilityresult: null,
+				onregister: null,
+				onsuccess: null,
+				onerror: null,
+				oninvalid: null,
+			},
+		});
+	}
+
+	static getTag() {
+		return "monster-register-wizard";
+	}
+
+	static getCSSStyleSheet() {
+		return [RegisterWizardStyleSheet];
+	}
+
+	[assembleMethodSymbol]() {
+		super[assembleMethodSymbol]();
+		this[currentStepSymbol] = 0;
+		this[completedSymbol] = false;
+		this[availabilityStateSymbol] = {
+			checked: false,
+			available: null,
+			email: null,
+		};
+
+		initControlReferences.call(this);
+		initEventHandler.call(this);
+		applyRequirements.call(this);
+		applyPasswordConfirmVisibility.call(this);
+		applyProfileFeatureVisibility.call(this);
+		applyAddressLayout.call(this);
+		ensureLabels.call(this);
+		applyFieldLabels.call(this);
+		updateWizardLabels.call(this);
+		updateStepVisibility.call(this);
+		loadConsentTopics.call(this);
+		goToStep.call(this, 0, true);
+		return this;
+	}
+
+	refresh() {
+		applyRequirements.call(this);
+		applyPasswordConfirmVisibility.call(this);
+		applyProfileFeatureVisibility.call(this);
+		applyAddressLayout.call(this);
+		ensureLabels.call(this);
+		applyFieldLabels.call(this);
+		updateWizardLabels.call(this);
+		updateStepVisibility.call(this);
+		loadConsentTopics.call(this);
+		return this;
+	}
+}
+
+function initControlReferences() {
+	this[wizardElementSymbol] = this.shadowRoot.querySelector(
+		"monster-wizard-navigation",
+	);
+	this[panelElementsSymbol] = {
+		email: this.shadowRoot.querySelector('[data-step="email"]'),
+		password: this.shadowRoot.querySelector('[data-step="password"]'),
+		profile: this.shadowRoot.querySelector('[data-step="profile"]'),
+		address: this.shadowRoot.querySelector('[data-step="address"]'),
+		consents: this.shadowRoot.querySelector('[data-step="consents"]'),
+	};
+	this[fieldSetElementsSymbol] = {
+		email: this.shadowRoot.querySelector(
+			'[data-monster-role="field-set-email"]',
+		),
+		password: this.shadowRoot.querySelector(
+			'[data-monster-role="field-set-password"]',
+		),
+		profile: this.shadowRoot.querySelector(
+			'[data-monster-role="field-set-profile"]',
+		),
+		address: this.shadowRoot.querySelector(
+			'[data-monster-role="field-set-address"]',
+		),
+		consents: this.shadowRoot.querySelector(
+			'[data-monster-role="field-set-consents"]',
+		),
+	};
+
+	this[emailInputSymbol] = this.shadowRoot.querySelector(
+		'[data-monster-role="email-input"]',
+	);
+	this[passwordInputSymbol] = this.shadowRoot.querySelector(
+		'[data-monster-role="password-input"]',
+	);
+	this[passwordConfirmInputSymbol] = this.shadowRoot.querySelector(
+		'[data-monster-role="password-confirm-input"]',
+	);
+	this[passwordConfirmLabelSymbol] = this.shadowRoot.querySelector(
+		'[data-monster-role~="password-confirm-label"]',
+	);
+
+	this[profileInputsSymbol] = {
+		firstName: this.shadowRoot.querySelector(
+			'[data-monster-role="first-name-input"]',
+		),
+		lastName: this.shadowRoot.querySelector(
+			'[data-monster-role="last-name-input"]',
+		),
+		birthDate: this.shadowRoot.querySelector(
+			'[data-monster-role="birth-date-input"]',
+		),
+		nationality: this.shadowRoot.querySelector(
+			'[data-monster-role="nationality-input"]',
+		),
+	};
+	this[birthDateLabelSymbol] = this.shadowRoot.querySelector(
+		'[data-monster-role~="birth-date-label"]',
+	);
+	this[nationalityLabelSymbol] = this.shadowRoot.querySelector(
+		'[data-monster-role~="nationality-label"]',
+	);
+
+	this[addressInputsSymbol] = {
+		street: this.shadowRoot.querySelector('[data-monster-role="street-input"]'),
+		zip: this.shadowRoot.querySelector('[data-monster-role="zip-input"]'),
+		city: this.shadowRoot.querySelector('[data-monster-role="city-input"]'),
+		country: this.shadowRoot.querySelector(
+			'[data-monster-role="country-input"]',
+		),
+	};
+
+	this[availabilityMessageSymbol] = this.shadowRoot.querySelector(
+		'[data-monster-role="availability-message"]',
+	);
+
+	this[nextButtonsSymbol] = Array.from(
+		this.shadowRoot.querySelectorAll('[data-monster-role="next-button"]'),
+	);
+	this[backButtonsSymbol] = Array.from(
+		this.shadowRoot.querySelectorAll('[data-monster-role="back-button"]'),
+	);
+	this[availabilityNextButtonSymbol] = this.shadowRoot.querySelector(
+		'[data-step="email"] [data-monster-role="next-button"]',
+	);
+	this[submitButtonSymbol] = this.shadowRoot.querySelector(
+		'[data-monster-role="submit-button"]',
+	);
+
+	this[availabilityDatasourceSymbol] = this.shadowRoot.querySelector(
+		'[data-monster-role="availability-datasource"]',
+	);
+	this[registerDatasourceSymbol] = this.shadowRoot.querySelector(
+		'[data-monster-role="register-datasource"]',
+	);
+	this[consentsDatasourceSymbol] = this.shadowRoot.querySelector(
+		'[data-monster-role="consents-datasource"]',
+	);
+}
+
+function initEventHandler() {
+	const wizard = this[wizardElementSymbol];
+	if (wizard) {
+		wizard.setOption("actions.beforeStepChange", (fromIndex, toIndex) => {
+			return handleStepChangeRequest.call(this, fromIndex, toIndex);
+		});
+		wizard.addEventListener("monster-wizard-step-changed", (event) => {
+			const mainIndex = event?.detail?.newIndex ?? 0;
+			const stepIndex = mapWizardStepToIndex(mainIndex);
+			if (stepIndex !== null && stepIndex !== this[currentStepSymbol]) {
+				goToStep.call(this, stepIndex);
+			}
+		});
+		wizard.addEventListener("monster-wizard-substep-changed", (event) => {
+			const mainIndex = event?.detail?.mainIndex ?? 0;
+			const subIndex = event?.detail?.subIndex ?? 0;
+			const stepIndex = mapWizardSubStepToIndex(mainIndex, subIndex);
+			if (stepIndex !== null && stepIndex !== this[currentStepSymbol]) {
+				goToStep.call(this, stepIndex);
+			}
+		});
+	}
+
+	if (this[emailInputSymbol]) {
+		this[emailInputSymbol].addEventListener("input", () => {
+			resetAvailabilityState.call(this);
+			if (this.getOption("features.autoCheckAvailability") === true) {
+				debounceAvailabilityCheck.call(this);
+			}
+		});
+	}
+
+	this[nextButtonsSymbol].forEach((button) => {
+		button.setOption("actions.click", () => {
+			handleNextClick.call(this);
+		});
+	});
+	this[backButtonsSymbol].forEach((button) => {
+		button.setOption("actions.click", () => {
+			handleBackClick.call(this);
+		});
+	});
+	if (this[submitButtonSymbol]) {
+		this[submitButtonSymbol].setOption("actions.click", () => {
+			handleSubmit.call(this);
+		});
+	}
+}
+
+function updateWizardLabels() {
+	const wizard = this[wizardElementSymbol];
+	if (!wizard) {
+		return;
+	}
+	const list = wizard.querySelector("ol.wizard-steps");
+	if (!list) {
+		return;
+	}
+	const labels = this.getOption("labels");
+	const items = list.querySelectorAll("li.step");
+	const entries = [
+		{
+			main: labels.stepAccount,
+			subs: [labels.subEmail, labels.subPassword],
+		},
+		{
+			main: labels.stepProfileGroup,
+			subs: [labels.subProfile, labels.subAddress],
+		},
+		{
+			main: labels.stepConsentsGroup,
+			subs: [labels.subConsents],
+		},
+	];
+	items.forEach((item, index) => {
+		const entry = entries[index];
+		if (!entry) {
+			return;
+		}
+		const label = item.querySelector('[data-monster-role="step-label"]');
+		if (label && entry.main) {
+			label.textContent = entry.main;
+		}
+		const subItems = item.querySelectorAll("ul li");
+		subItems.forEach((subItem, subIndex) => {
+			const subLabel = entry.subs?.[subIndex];
+			if (subLabel) {
+				subItem.textContent = subLabel;
+			}
+		});
+	});
+}
+
+function updateStepVisibility() {
+	if (this[completedSymbol]) {
+		Object.values(this[panelElementsSymbol] || {}).forEach((panel) => {
+			if (panel) {
+				panel.hidden = true;
+				panel.classList.remove("is-active");
+			}
+		});
+		const successPanel = this.shadowRoot.querySelector('[data-step="success"]');
+		if (successPanel) {
+			successPanel.hidden = false;
+			successPanel.classList.add("is-active");
+		}
+		return;
+	}
+	const steps = getStepOrder();
+	steps.forEach((stepId, index) => {
+		const panel = this[panelElementsSymbol]?.[stepId];
+		if (!panel) {
+			return;
+		}
+		panel.hidden = index !== this[currentStepSymbol];
+		panel.classList.toggle("is-active", index === this[currentStepSymbol]);
+	});
+}
+
+function handleBackClick() {
+	const nextIndex = Math.max(0, this[currentStepSymbol] - 1);
+	goToStep.call(this, nextIndex);
+}
+
+function handleNextClick() {
+	if (this[currentStepSymbol] === 0) {
+		handleAvailabilityAndNext.call(this);
+		return;
+	}
+	const canProceed = validateStep.call(this, this[currentStepSymbol]);
+	if (!canProceed) {
+		fireInvalid.call(this, this[currentStepSymbol]);
+		return;
+	}
+	goToStep.call(this, this[currentStepSymbol] + 1);
+}
+
+function handleStepChangeRequest(fromIndex, toIndex) {
+	if (this[completedSymbol]) {
+		return false;
+	}
+	const currentStepIndex = this[currentStepSymbol];
+	const mapping = mapStepToWizardIndices(currentStepIndex);
+	const currentMain = mapping ? mapping.main : currentStepIndex;
+	if (toIndex <= currentMain) {
+		return true;
+	}
+	const canProceed = validateStep.call(this, currentStepIndex);
+	if (!canProceed) {
+		fireInvalid.call(this, currentStepIndex);
+		return false;
+	}
+	if (
+		currentStepIndex === 0 &&
+		this.getOption("features.requireAvailability") === true
+	) {
+		const state = this[availabilityStateSymbol];
+		if (!state?.checked || state?.available !== true) {
+			setInlineMessage.call(
+				this,
+				this.getOption("labels.messageAvailabilityRequired"),
+			);
+			fireInvalid.call(this, currentStepIndex);
+			return false;
+		}
+	}
+	return true;
+}
+
+function goToStep(index, force = false) {
+	if (this[completedSymbol]) {
+		return;
+	}
+	const steps = getStepOrder();
+	const bounded = Math.min(Math.max(index, 0), steps.length - 1);
+	this[currentStepSymbol] = bounded;
+	updateStepVisibility.call(this);
+
+	const wizard = this[wizardElementSymbol];
+	if (wizard) {
+		const mapping = mapStepToWizardIndices(bounded);
+		if (mapping) {
+			wizard.activate(mapping.main, mapping.sub, { force });
+		} else {
+			wizard.goToStep(bounded, { force });
+		}
+	}
+
+	fireCustomEvent(this, "monster-register-wizard-step-change", {
+		index: bounded,
+		step: steps[bounded],
+	});
+	const action = this.getOption("actions.onstepchange");
+	if (isFunction(action)) {
+		action.call(this, bounded, steps[bounded]);
+	}
+}
+
+function validateStep(index) {
+	clearInlineMessage.call(this);
+	const steps = getStepOrder();
+	const stepId = steps[index];
+	if (!stepId) {
+		return true;
+	}
+
+	if (stepId === "email") {
+		return validateEmailStep.call(this);
+	}
+	if (stepId === "password") {
+		return validatePasswordStep.call(this);
+	}
+	if (stepId === "profile") {
+		return validateProfileStep.call(this);
+	}
+	if (stepId === "address") {
+		return validateAddressStep.call(this);
+	}
+	if (stepId === "consents") {
+		return validateConsentsStep.call(this);
+	}
+	return true;
+}
+
+function validateEmailStep() {
+	const input = this[emailInputSymbol];
+	if (!input) {
+		return false;
+	}
+	if (this.getOption("requirements.email") === false) {
+		return true;
+	}
+	const value = getValue(input).trim();
+	if (value === "") {
+		setInlineMessage.call(this, this.getOption("labels.messageRequiredEmail"));
+		return false;
+	}
+	if (!isValidEmail(value)) {
+		setInlineMessage.call(this, this.getOption("labels.messageInvalidEmail"));
+		return false;
+	}
+	return true;
+}
+
+function validatePasswordStep() {
+	const password = this[passwordInputSymbol];
+	const confirm = this[passwordConfirmInputSymbol];
+	let valid = true;
+	if (this.getOption("requirements.password") !== false) {
+		const pwdValue = getValue(password);
+		if (!pwdValue) {
+			setInlineMessage.call(
+				this,
+				this.getOption("labels.messageRequiredPassword"),
+			);
+			valid = false;
+		}
+	}
+	if (!valid) {
+		return false;
+	}
+	if (
+		this.getOption("features.confirmPassword") === true &&
+		this.getOption("requirements.passwordConfirm") !== false
+	) {
+		const pwdValue = getValue(password);
+		if (confirm) {
+			const confirmValue = getValue(confirm);
+			if (!confirmValue) {
+				setInlineMessage.call(
+					this,
+					this.getOption("labels.messageRequiredPasswordConfirm"),
+				);
+				return false;
+			}
+			if (pwdValue !== confirmValue) {
+				setInlineMessage.call(
+					this,
+					this.getOption("labels.messagePasswordMismatch"),
+				);
+				valid = false;
+			}
+		}
+	}
+	return valid;
+}
+
+function validateProfileStep() {
+	const inputs = this[profileInputsSymbol] || {};
+	let valid = true;
+	if (this.getOption("requirements.firstName") !== false && inputs.firstName) {
+		valid = isFilled(inputs.firstName);
+	}
+	if (
+		valid &&
+		this.getOption("requirements.lastName") !== false &&
+		inputs.lastName
+	) {
+		valid = isFilled(inputs.lastName);
+	}
+	if (
+		valid &&
+		this.getOption("requirements.birthDate") !== false &&
+		this.getOption("features.showBirthDate") === true &&
+		inputs.birthDate
+	) {
+		valid = isFilled(inputs.birthDate);
+	}
+	if (
+		valid &&
+		this.getOption("requirements.nationality") !== false &&
+		this.getOption("features.showNationality") === true &&
+		inputs.nationality
+	) {
+		valid = isFilled(inputs.nationality);
+	}
+	if (!valid) {
+		setInlineMessage.call(this, this.getOption("labels.messageRequiredField"));
+	}
+	return valid;
+}
+
+function validateAddressStep() {
+	const inputs = this[addressInputsSymbol] || {};
+	const req = this.getOption("requirements.address") || {};
+	let valid = true;
+	if (req.street !== false && inputs.street) {
+		valid = isFilled(inputs.street);
+	}
+	if (valid && req.zip !== false && inputs.zip) {
+		valid = isFilled(inputs.zip);
+	}
+	if (valid && req.city !== false && inputs.city) {
+		valid = isFilled(inputs.city);
+	}
+	if (valid && req.country !== false && inputs.country) {
+		valid = isFilled(inputs.country);
+	}
+	if (!valid) {
+		setInlineMessage.call(this, this.getOption("labels.messageRequiredField"));
+	}
+	return valid;
+}
+
+function validateConsentsStep() {
+	const container = this.shadowRoot.querySelector(
+		'[data-monster-role="consents-list"]',
+	);
+	if (!container) {
+		return true;
+	}
+	const required = container.querySelectorAll(
+		'input[type="checkbox"][data-required="true"]',
+	);
+	for (const checkbox of required) {
+		if (!checkbox.checked) {
+			setInlineMessage.call(
+				this,
+				this.getOption("labels.messageRequiredConsents"),
+			);
+			return false;
+		}
+	}
+	return true;
+}
+
+function handleAvailabilityAndNext() {
+	const valid = validateEmailStep.call(this);
+	if (!valid) {
+		fireInvalid.call(this, 0);
+		return;
+	}
+	const url = this.getOption("availability.url");
+	const requireAvailability = this.getOption("features.requireAvailability");
+	if ((!isString(url) || url === "") && requireAvailability === false) {
+		goToStep.call(this, 1);
+		return;
+	}
+	checkAvailability.call(this).then((available) => {
+		if (available) {
+			goToStep.call(this, 1);
+		}
+	});
+}
+
+function resetAvailabilityState() {
+	this[availabilityStateSymbol] = {
+		checked: false,
+		available: null,
+		email: getValue(this[emailInputSymbol]) || null,
+	};
+	setAvailabilityMessage.call(this, "");
+}
+
+function debounceAvailabilityCheck() {
+	if (this[availabilityTimerSymbol]) {
+		clearTimeout(this[availabilityTimerSymbol]);
+	}
+	this[availabilityTimerSymbol] = setTimeout(() => {
+		const email = getValue(this[emailInputSymbol]) || "";
+		if (!isValidEmail(email)) {
+			resetAvailabilityState.call(this);
+			return;
+		}
+		checkAvailability.call(this);
+	}, 450);
+}
+
+async function checkAvailability() {
+	const url = this.getOption("availability.url");
+	const email = getValue(this[emailInputSymbol]) || "";
+	const requireAvailability = this.getOption("features.requireAvailability");
+
+	if (!isValidEmail(email)) {
+		resetAvailabilityState.call(this);
+		return false;
+	}
+
+	if (!isString(url) || url === "") {
+		if (requireAvailability) {
+			handleMessageButtonError.call(
+				this,
+				this[availabilityNextButtonSymbol],
+				this.getOption("labels.messageAvailabilityNotConfigured"),
+			);
+		}
+		return false;
+	}
+
+	const payload = buildAvailabilityPayload.call(this, email);
+	const action = this.getOption("actions.onavailabilitycheck");
+	fireCustomEvent(this, "monster-register-wizard-availability-check", {
+		email,
+		payload,
+	});
+	if (isFunction(action)) {
+		action.call(this, email, payload);
+	}
+
+	try {
+		setAvailabilityMessage.call(this, this.getOption("labels.messageChecking"));
+		setButtonState.call(this, this[availabilityNextButtonSymbol], "activity");
+		const { data } = await writeWithDatasource.call(
+			this,
+			this[availabilityDatasourceSymbol],
+			{
+				url,
+				fetch: this.getOption("availability.fetch"),
+			},
+			payload,
+		);
+
+		const result = parseAvailabilityResponse.call(this, data);
+		this[availabilityStateSymbol] = {
+			checked: true,
+			available: result.available,
+			email,
+		};
+
+		fireCustomEvent(
+			this,
+			"monster-register-wizard-availability-result",
+			result,
+		);
+		const resultAction = this.getOption("actions.onavailabilityresult");
+		if (isFunction(resultAction)) {
+			resultAction.call(this, result);
+		}
+
+		if (result.available) {
+			setAvailabilityMessage.call(
+				this,
+				this.getOption("labels.messageEmailAvailable"),
+			);
+			setButtonState.call(
+				this,
+				this[availabilityNextButtonSymbol],
+				"successful",
+				900,
+			);
+			return true;
+		}
+		setAvailabilityMessage.call(
+			this,
+			this.getOption("labels.messageEmailUnavailable"),
+		);
+		handleMessageButtonError.call(
+			this,
+			this[availabilityNextButtonSymbol],
+			this.getOption("labels.messageEmailUnavailable"),
+		);
+		return false;
+	} catch (e) {
+		const msg =
+			extractAvailabilityMessage.call(this, e) ||
+			this.getOption("labels.messageAvailabilityFailed");
+		addAttributeToken(this, ATTRIBUTE_ERRORMESSAGE, `${e}`);
+		setAvailabilityMessage.call(this, msg);
+		handleMessageButtonError.call(
+			this,
+			this[availabilityNextButtonSymbol],
+			msg,
+		);
+		return false;
+	}
+}
+
+function parseAvailabilityResponse(data) {
+	const mapping = this.getOption("availability.mapping") || {};
+	const selector = mapping.selector || "*";
+	let source = data;
+	if (selector && selector !== "*") {
+		try {
+			source = new Pathfinder(data).getVia(selector);
+		} catch (_e) {
+			source = data;
+		}
+	}
+	const available = getPathValue(source, mapping.availablePath);
+	const exists = getPathValue(source, mapping.existsPath);
+	let resolved = available;
+	if (resolved === null || resolved === undefined) {
+		if (exists !== null && exists !== undefined) {
+			resolved = !Boolean(exists);
+		}
+	}
+	return {
+		available: Boolean(resolved),
+		exists: exists === null || exists === undefined ? null : Boolean(exists),
+		data: source,
+	};
+}
+
+function handleSubmit() {
+	const steps = getStepOrder();
+	for (let i = 0; i < steps.length; i += 1) {
+		if (!validateStep.call(this, i)) {
+			fireInvalid.call(this, i);
+			goToStep.call(this, i);
+			return;
+		}
+	}
+	const payload = buildRegisterPayload.call(this);
+	const url = this.getOption("register.url");
+	if (!isString(url) || url === "") {
+		handleMessageButtonError.call(
+			this,
+			this[submitButtonSymbol],
+			this.getOption("labels.messageRegisterNotConfigured"),
+		);
+		return;
+	}
+
+	fireCustomEvent(this, "monster-register-wizard-register", { payload });
+	const action = this.getOption("actions.onregister");
+	if (isFunction(action)) {
+		action.call(this, payload);
+	}
+
+	setButtonState.call(this, this[submitButtonSymbol], "activity");
+	writeWithDatasource
+		.call(
+			this,
+			this[registerDatasourceSymbol],
+			{
+				url,
+				fetch: this.getOption("register.fetch"),
+			},
+			payload,
+		)
+		.then(({ data }) => {
+			setButtonState.call(this, this[submitButtonSymbol], "successful", 1500);
+			const wizard = this[wizardElementSymbol];
+			if (wizard) {
+				wizard.completeAll();
+			}
+			this[completedSymbol] = true;
+			updateStepVisibility.call(this);
+			fireCustomEvent(this, "monster-register-wizard-success", { data });
+			const success = this.getOption("actions.onsuccess");
+			if (isFunction(success)) {
+				success.call(this, data);
+			}
+		})
+		.catch((e) => {
+			const msg =
+				extractRegisterMessage.call(this, e) ||
+				this.getOption("labels.messageRegisterFailed");
+			handleMessageButtonError.call(this, this[submitButtonSymbol], msg);
+			fireCustomEvent(this, "monster-register-wizard-error", { error: e });
+			const errorAction = this.getOption("actions.onerror");
+			if (isFunction(errorAction)) {
+				errorAction.call(this, e);
+			}
+		});
+}
+
+function buildAvailabilityPayload(email) {
+	const payload = {};
+	const mapping = this.getOption("availability.payload") || {};
+	const tenantId = this.getOption("tenant.id");
+	setPathValue(payload, mapping.emailPath || "email", email);
+	if (tenantId) {
+		setPathValue(payload, mapping.tenantIdPath || "tenantId", tenantId);
+	}
+	return payload;
+}
+
+function buildRegisterPayload() {
+	const payload = {};
+	const mapping = this.getOption("register.payload") || {};
+	const data = collectFormData.call(this);
+
+	setPathValue(payload, mapping.tenantIdPath || "tenantId", data.tenantId);
+	setPathValue(payload, mapping.emailPath || "email", data.email);
+	setPathValue(payload, mapping.passwordPath || "password", data.password);
+	if (data.displayName) {
+		setPathValue(
+			payload,
+			mapping.displayNamePath || "displayName",
+			data.displayName,
+		);
+	}
+	setPathValue(
+		payload,
+		mapping.firstNamePath || "person.firstName",
+		data.firstName,
+	);
+	setPathValue(
+		payload,
+		mapping.lastNamePath || "person.lastName",
+		data.lastName,
+	);
+	if (data.birthDate) {
+		setPathValue(
+			payload,
+			mapping.birthDatePath || "person.birthDate",
+			data.birthDate,
+		);
+	}
+	if (data.nationality) {
+		setPathValue(
+			payload,
+			mapping.nationalityPath || "person.nationality",
+			data.nationality,
+		);
+	}
+	setPathValue(
+		payload,
+		mapping.streetPath || "person.address.street",
+		data.street,
+	);
+	setPathValue(payload, mapping.zipPath || "person.address.zip", data.zip);
+	setPathValue(payload, mapping.cityPath || "person.address.city", data.city);
+	setPathValue(
+		payload,
+		mapping.countryPath || "person.address.country",
+		data.country,
+	);
+	setPathValue(payload, mapping.consentsPath || "consents", data.consents);
+
+	return payload;
+}
+
+function collectFormData() {
+	const tenantId = this.getOption("tenant.id");
+	const email = getValue(this[emailInputSymbol]) || "";
+	const password = getValue(this[passwordInputSymbol]) || "";
+	const firstName = getValue(this[profileInputsSymbol]?.firstName) || "";
+	const lastName = getValue(this[profileInputsSymbol]?.lastName) || "";
+	const birthDate =
+		this.getOption("features.showBirthDate") === true
+			? getValue(this[profileInputsSymbol]?.birthDate) || null
+			: null;
+	const nationality =
+		this.getOption("features.showNationality") === true
+			? getValue(this[profileInputsSymbol]?.nationality) || null
+			: null;
+	const street = getValue(this[addressInputsSymbol]?.street) || "";
+	const zip = getValue(this[addressInputsSymbol]?.zip) || "";
+	const city = getValue(this[addressInputsSymbol]?.city) || "";
+	const country = getValue(this[addressInputsSymbol]?.country) || "";
+
+	const displayName = [firstName, lastName].filter(Boolean).join(" ").trim();
+
+	return {
+		tenantId,
+		email,
+		password,
+		displayName,
+		firstName,
+		lastName,
+		birthDate,
+		nationality,
+		street,
+		zip,
+		city,
+		country,
+		consents: collectConsents.call(this),
+	};
+}
+
+function collectConsents() {
+	const container = this.shadowRoot.querySelector(
+		'[data-monster-role="consents-list"]',
+	);
+	if (!container) {
+		return [];
+	}
+	const grantedValue = this.getOption("consents.grantedValue");
+	const revokedValue = this.getOption("consents.revokedValue");
+	const items = [];
+	container.querySelectorAll('input[type="checkbox"]').forEach((checkbox) => {
+		const topic = checkbox.getAttribute("data-topic");
+		if (!topic) {
+			return;
+		}
+		items.push({
+			topic,
+			status: checkbox.checked ? grantedValue : revokedValue,
+		});
+	});
+	return items;
+}
+
+function applyRequirements() {
+	applyRequiredFlag.call(
+		this,
+		this[emailInputSymbol],
+		this.getOption("requirements.email"),
+	);
+	applyRequiredFlag.call(
+		this,
+		this[passwordInputSymbol],
+		this.getOption("requirements.password"),
+	);
+	applyRequiredFlag.call(
+		this,
+		this[passwordConfirmInputSymbol],
+		this.getOption("requirements.passwordConfirm"),
+	);
+
+	const profile = this[profileInputsSymbol] || {};
+	applyRequiredFlag.call(
+		this,
+		profile.firstName,
+		this.getOption("requirements.firstName"),
+	);
+	applyRequiredFlag.call(
+		this,
+		profile.lastName,
+		this.getOption("requirements.lastName"),
+	);
+	applyRequiredFlag.call(
+		this,
+		profile.birthDate,
+		this.getOption("features.showBirthDate") === true
+			? this.getOption("requirements.birthDate")
+			: false,
+	);
+	applyRequiredFlag.call(
+		this,
+		profile.nationality,
+		this.getOption("features.showNationality") === true
+			? this.getOption("requirements.nationality")
+			: false,
+	);
+
+	const address = this[addressInputsSymbol] || {};
+	const addr = this.getOption("requirements.address") || {};
+	applyRequiredFlag.call(this, address.street, addr.street);
+	applyRequiredFlag.call(this, address.zip, addr.zip);
+	applyRequiredFlag.call(this, address.city, addr.city);
+	applyRequiredFlag.call(this, address.country, addr.country);
+}
+
+function applyPasswordConfirmVisibility() {
+	const enabled = this.getOption("features.confirmPassword") !== false;
+	if (this[passwordConfirmInputSymbol]) {
+		this[passwordConfirmInputSymbol].hidden = !enabled;
+		this[passwordConfirmInputSymbol].setAttribute(
+			"aria-hidden",
+			enabled ? "false" : "true",
+		);
+	}
+	if (this[passwordConfirmLabelSymbol]) {
+		this[passwordConfirmLabelSymbol].hidden = !enabled;
+		this[passwordConfirmLabelSymbol].setAttribute(
+			"aria-hidden",
+			enabled ? "false" : "true",
+		);
+	}
+}
+
+function applyProfileFeatureVisibility() {
+	const showBirthDate = this.getOption("features.showBirthDate") === true;
+	const showNationality = this.getOption("features.showNationality") === true;
+	const birthDateInput = this[profileInputsSymbol]?.birthDate;
+	const nationalityInput = this[profileInputsSymbol]?.nationality;
+	if (birthDateInput) {
+		birthDateInput.hidden = !showBirthDate;
+		birthDateInput.setAttribute(
+			"aria-hidden",
+			showBirthDate ? "false" : "true",
+		);
+	}
+	if (this[birthDateLabelSymbol]) {
+		this[birthDateLabelSymbol].hidden = !showBirthDate;
+		this[birthDateLabelSymbol].setAttribute(
+			"aria-hidden",
+			showBirthDate ? "false" : "true",
+		);
+	}
+	if (nationalityInput) {
+		nationalityInput.hidden = !showNationality;
+		nationalityInput.setAttribute(
+			"aria-hidden",
+			showNationality ? "false" : "true",
+		);
+	}
+	if (this[nationalityLabelSymbol]) {
+		this[nationalityLabelSymbol].hidden = !showNationality;
+		this[nationalityLabelSymbol].setAttribute(
+			"aria-hidden",
+			showNationality ? "false" : "true",
+		);
+	}
+}
+
+function applyAddressLayout() {
+	const fieldSet = this[fieldSetElementsSymbol]?.address;
+	if (!fieldSet || typeof fieldSet.setOption !== "function") {
+		return;
+	}
+	fieldSet.setOption("features.multipleColumns", true);
+}
+
+function applyRequiredFlag(element, required) {
+	if (!element) {
+		return;
+	}
+	if (typeof element.setOption === "function") {
+		element.setOption("required", false);
+	}
+	if (required === false) {
+		element.removeAttribute("required");
+		element.setAttribute("aria-required", "false");
+		return;
+	}
+	element.setAttribute("aria-required", "true");
+}
+
+function ensureLabels() {
+	const current = this.getOption("labels");
+	const fallback = getTranslations();
+	if (!isObject(current)) {
+		this.setOption("labels", fallback);
+		return;
+	}
+	const merged = Object.assign({}, fallback, current);
+	this.setOption("labels", merged);
+}
+
+function applyFieldLabels() {
+	const labels = this.getOption("labels") || {};
+	setFieldSetTitle.call(this, "email", labels.stepEmail);
+	setFieldSetTitle.call(this, "password", labels.stepPassword);
+	setFieldSetTitle.call(this, "profile", labels.stepProfile);
+	setFieldSetTitle.call(this, "address", labels.stepAddress);
+	setFieldSetTitle.call(this, "consents", labels.stepConsents);
+	setLabelText.call(this, '[data-monster-role~="email-label"]', labels.email);
+	setLabelText.call(
+		this,
+		'[data-monster-role~="password-label"]',
+		labels.password,
+	);
+	setLabelText.call(
+		this,
+		'[data-monster-role~="password-confirm-label"]',
+		labels.passwordConfirm,
+	);
+	setLabelText.call(
+		this,
+		'[data-monster-role~="first-name-label"]',
+		labels.firstName,
+	);
+	setLabelText.call(
+		this,
+		'[data-monster-role~="last-name-label"]',
+		labels.lastName,
+	);
+	setLabelText.call(
+		this,
+		'[data-monster-role~="birth-date-label"]',
+		labels.birthDate,
+	);
+	setLabelText.call(
+		this,
+		'[data-monster-role~="nationality-label"]',
+		labels.nationality,
+	);
+	setLabelText.call(this, '[data-monster-role~="street-label"]', labels.street);
+	setLabelText.call(this, '[data-monster-role~="zip-label"]', labels.zip);
+	setLabelText.call(this, '[data-monster-role~="city-label"]', labels.city);
+	setLabelText.call(
+		this,
+		'[data-monster-role~="country-label"]',
+		labels.country,
+	);
+
+	setInputMeta.call(
+		this,
+		this[emailInputSymbol],
+		labels.emailPlaceholder,
+		labels.emailAria,
+	);
+	setInputMeta.call(
+		this,
+		this[passwordConfirmInputSymbol],
+		labels.passwordConfirmPlaceholder,
+		labels.passwordConfirmAria,
+	);
+	setInputMeta.call(
+		this,
+		this[profileInputsSymbol]?.firstName,
+		labels.firstNamePlaceholder,
+		labels.firstNameAria,
+	);
+	setInputMeta.call(
+		this,
+		this[profileInputsSymbol]?.lastName,
+		labels.lastNamePlaceholder,
+		labels.lastNameAria,
+	);
+	setInputMeta.call(
+		this,
+		this[profileInputsSymbol]?.birthDate,
+		null,
+		labels.birthDateAria,
+	);
+	setInputMeta.call(
+		this,
+		this[profileInputsSymbol]?.nationality,
+		labels.nationalityPlaceholder,
+		labels.nationalityAria,
+	);
+	setInputMeta.call(
+		this,
+		this[addressInputsSymbol]?.street,
+		labels.streetPlaceholder,
+		labels.streetAria,
+	);
+	setInputMeta.call(
+		this,
+		this[addressInputsSymbol]?.zip,
+		labels.zipPlaceholder,
+		labels.zipAria,
+	);
+	setInputMeta.call(
+		this,
+		this[addressInputsSymbol]?.city,
+		labels.cityPlaceholder,
+		labels.cityAria,
+	);
+	setInputMeta.call(
+		this,
+		this[addressInputsSymbol]?.country,
+		labels.countryPlaceholder,
+		labels.countryAria,
+	);
+}
+
+function setFieldSetTitle(key, text) {
+	const fieldSet = this[fieldSetElementsSymbol]?.[key];
+	if (!fieldSet || typeof fieldSet.setOption !== "function") {
+		return;
+	}
+	fieldSet.setOption("labels.title", text || "");
+}
+
+function setLabelText(selector, text) {
+	const element = this.shadowRoot.querySelector(selector);
+	if (!element) {
+		return;
+	}
+	element.textContent = text || "";
+}
+
+function setInputMeta(element, placeholder, aria) {
+	if (!element) {
+		return;
+	}
+	if (placeholder !== null && placeholder !== undefined) {
+		element.setAttribute("placeholder", placeholder);
+	}
+	if (aria) {
+		element.setAttribute("aria-label", aria);
+	}
+}
+
+async function loadConsentTopics() {
+	const url = this.getOption("consents.url");
+	const container = this.shadowRoot.querySelector(
+		'[data-monster-role="consents-list"]',
+	);
+	if (!container) {
+		return;
+	}
+	if (isString(url) && url !== "") {
+		try {
+			const { data } = await readWithDatasource.call(
+				this,
+				this[consentsDatasourceSymbol],
+				{
+					url,
+					fetch: this.getOption("consents.fetch"),
+				},
+			);
+			const topics = mapConsentTopics.call(this, data);
+			renderConsentTopics.call(this, topics);
+			return;
+		} catch (e) {
+			addAttributeToken(this, ATTRIBUTE_ERRORMESSAGE, `${e}`);
+		}
+	}
+	const fallbackTopics = this.getOption("consents.topics") || [];
+	renderConsentTopics.call(this, fallbackTopics);
+}
+
+function mapConsentTopics(data) {
+	const mapping = this.getOption("consents.mapping") || {};
+	const selector = mapping.selector || "*";
+	let source = data;
+	if (selector && selector !== "*") {
+		try {
+			source = new Pathfinder(data).getVia(selector);
+		} catch (_e) {
+			source = data;
+		}
+	}
+	const topicsPath = mapping.topicsPath;
+	let list = Array.isArray(source) ? source : [];
+	if (topicsPath) {
+		try {
+			list = new Pathfinder(source).getVia(topicsPath);
+		} catch (_e) {
+			list = [];
+		}
+	}
+	if (!Array.isArray(list)) {
+		return [];
+	}
+	return list
+		.map((entry) => ({
+			topic: getPathValue(entry, mapping.topicPath) ?? entry?.topic,
+			label: getPathValue(entry, mapping.labelPath) ?? entry?.label,
+			description:
+				getPathValue(entry, mapping.descriptionPath) ?? entry?.description,
+			required: Boolean(
+				getPathValue(entry, mapping.requiredPath) ?? entry?.required,
+			),
+		}))
+		.filter((entry) => isString(entry.topic) && entry.topic !== "");
+}
+
+function renderConsentTopics(topics) {
+	const container = this.shadowRoot.querySelector(
+		'[data-monster-role="consents-list"]',
+	);
+	if (!container) {
+		return;
+	}
+	container.innerHTML = "";
+	topics.forEach((topic) => {
+		const row = document.createElement("label");
+		row.setAttribute("data-monster-role", "consent-row");
+		row.setAttribute("part", "consent-row");
+
+		const input = document.createElement("input");
+		input.type = "checkbox";
+		input.setAttribute("data-topic", topic.topic);
+		input.setAttribute("part", "consent-input");
+		if (topic.required) {
+			input.setAttribute("data-required", "true");
+			input.setAttribute("required", "");
+		}
+
+		const text = document.createElement("span");
+		text.setAttribute("data-monster-role", "consent-label");
+		text.setAttribute("part", "consent-label");
+		text.textContent = topic.label || topic.topic;
+
+		row.appendChild(input);
+		row.appendChild(text);
+
+		if (topic.description) {
+			const description = document.createElement("span");
+			description.setAttribute("data-monster-role", "consent-description");
+			description.setAttribute("part", "consent-description");
+			description.textContent = topic.description;
+			row.appendChild(description);
+		}
+
+		container.appendChild(row);
+	});
+}
+
+async function writeWithDatasource(datasource, options, payload) {
+	if (!datasource) {
+		throw new Error("datasource not available");
+	}
+	const responseHolder = { data: null };
+	datasource.setOption("write.url", options.url);
+	datasource.setOption("write.init", options.fetch || {});
+	datasource.setOption("write.parameters", payload);
+	datasource.setOption("write.responseCallback", (obj) => {
+		responseHolder.data = obj;
+	});
+	datasource.data = payload;
+	const response = await datasource.write();
+	return { response, data: responseHolder.data };
+}
+
+async function readWithDatasource(datasource, options) {
+	if (!datasource) {
+		throw new Error("datasource not available");
+	}
+	const responseHolder = { data: null };
+	datasource.setOption("read.url", options.url);
+	datasource.setOption("read.init", options.fetch || {});
+	datasource.setOption("read.parameters", {});
+	datasource.setOption("read.responseCallback", (obj) => {
+		responseHolder.data = obj;
+	});
+	const response = await datasource.read();
+	return { response, data: responseHolder.data };
+}
+
+function handleMessageButtonError(button, message) {
+	if (!button || !message) {
+		return;
+	}
+	try {
+		button.setMessage(message);
+		button.showMessage(3000);
+		button.setState("failed", 1500);
+	} catch (_e) {}
+}
+
+function setButtonState(button, state, timeout) {
+	if (!button || !state) {
+		return;
+	}
+	try {
+		button.setState(state, timeout);
+	} catch (_e) {}
+}
+
+function setAvailabilityMessage(message) {
+	if (this.getOption("features.showAvailabilityMessage") === false) {
+		return;
+	}
+	const button = this[availabilityNextButtonSymbol];
+	if (button && typeof button.setMessage === "function") {
+		if (!message) {
+			if (typeof button.clearMessage === "function") {
+				button.clearMessage();
+			}
+			if (typeof button.hideMessage === "function") {
+				button.hideMessage();
+			}
+			return;
+		}
+		try {
+			button.setMessage(message);
+			button.showMessage(3500);
+		} catch (_e) {}
+		return;
+	}
+	if (!this[availabilityMessageSymbol]) {
+		return;
+	}
+	this[availabilityMessageSymbol].textContent = message || "";
+}
+
+function setInlineMessage(message) {
+	if (!message) {
+		return;
+	}
+	const button = getActiveStepActionButton.call(this);
+	if (!button) {
+		return;
+	}
+	handleMessageButtonError.call(this, button, message);
+}
+
+function clearInlineMessage() {
+	const buttons = [];
+	if (Array.isArray(this[nextButtonsSymbol])) {
+		buttons.push(...this[nextButtonsSymbol]);
+	}
+	if (this[submitButtonSymbol]) {
+		buttons.push(this[submitButtonSymbol]);
+	}
+	for (const button of buttons) {
+		if (!button) {
+			continue;
+		}
+		if (typeof button.clearMessage === "function") {
+			button.clearMessage();
+		}
+		if (typeof button.hideMessage === "function") {
+			button.hideMessage();
+		}
+	}
+}
+
+function getActiveStepActionButton() {
+	const steps = getStepOrder();
+	const stepId = steps[this[currentStepSymbol]];
+	if (!stepId) {
+		return null;
+	}
+	if (stepId === "consents") {
+		return this[submitButtonSymbol] || null;
+	}
+	const panel = this[panelElementsSymbol]?.[stepId];
+	if (!panel) {
+		return null;
+	}
+	return panel.querySelector('[data-monster-role="next-button"]') || null;
+}
+
+function fireInvalid(stepIndex) {
+	fireCustomEvent(this, "monster-register-wizard-invalid", {
+		stepIndex,
+	});
+	const action = this.getOption("actions.oninvalid");
+	if (isFunction(action)) {
+		action.call(this, stepIndex);
+	}
+}
+
+function extractAvailabilityMessage(error) {
+	if (!error) {
+		return null;
+	}
+	const response = error?.response;
+	const raw =
+		response?.[
+			Symbol.for("@schukai/monster/data/datasource/server/restapi/rawdata")
+		];
+	const messagePath = this.getOption("availability.mapping.messagePath");
+	if (raw && messagePath) {
+		return getPathValue(raw, messagePath);
+	}
+	return null;
+}
+
+function extractRegisterMessage(error) {
+	if (!error) {
+		return null;
+	}
+	const response = error?.response;
+	const raw =
+		response?.[
+			Symbol.for("@schukai/monster/data/datasource/server/restapi/rawdata")
+		];
+	const messagePath = this.getOption("register.mapping.messagePath");
+	if (raw && messagePath) {
+		return getPathValue(raw, messagePath);
+	}
+	return null;
+}
+
+function getStepOrder() {
+	return ["email", "password", "profile", "address", "consents"];
+}
+
+function mapStepToWizardIndices(stepIndex) {
+	switch (stepIndex) {
+		case 0:
+			return { main: 0, sub: 0 };
+		case 1:
+			return { main: 0, sub: 1 };
+		case 2:
+			return { main: 1, sub: 0 };
+		case 3:
+			return { main: 1, sub: 1 };
+		case 4:
+			return { main: 2, sub: 0 };
+		default:
+			return null;
+	}
+}
+
+function mapWizardStepToIndex(mainIndex) {
+	switch (mainIndex) {
+		case 0:
+			return 0;
+		case 1:
+			return 2;
+		case 2:
+			return 4;
+		default:
+			return null;
+	}
+}
+
+function mapWizardSubStepToIndex(mainIndex, subIndex) {
+	if (mainIndex === 0) {
+		return subIndex === 1 ? 1 : 0;
+	}
+	if (mainIndex === 1) {
+		return subIndex === 1 ? 3 : 2;
+	}
+	if (mainIndex === 2) {
+		return 4;
+	}
+	return null;
+}
+
+function getValue(element) {
+	if (!element) {
+		return "";
+	}
+	if (typeof element.value === "string" || typeof element.value === "number") {
+		return element.value;
+	}
+	if (typeof element.getOption === "function") {
+		return element.getOption("value");
+	}
+	return "";
+}
+
+function isFilled(element) {
+	const value = getValue(element);
+	return String(value ?? "").trim() !== "";
+}
+
+function isValidEmail(value) {
+	if (!isString(value)) {
+		return false;
+	}
+	const trimmed = value.trim();
+	if (trimmed === "") {
+		return false;
+	}
+	return /^[^\s@]+@[^\s@]+(\.[^\s@]+)*$/.test(trimmed);
+}
+
+function setPathValue(target, path, value) {
+	if (!isString(path) || path === "") {
+		return;
+	}
+	try {
+		new Pathfinder(target).setVia(path, value);
+	} catch (_e) {}
+}
+
+function getPathValue(source, path) {
+	if (!isString(path) || path === "") {
+		return null;
+	}
+	try {
+		return new Pathfinder(source).getVia(path);
+	} catch (_e) {
+		return null;
+	}
+}
+
+function getTemplate() {
+	// language=HTML
+	return `
+        <div data-monster-role="control" part="control">
+            <div data-monster-role="header" part="header">
+                <slot name="title"></slot>
+            </div>
+            <div data-monster-role="body" part="body">
+                <div data-monster-role="nav" part="nav">
+                    <monster-wizard-navigation part="nav-control">
+                        <ol class="wizard-steps">
+                            <li class="step">
+                                <span data-monster-role="step-label" part="step-label"
+                                      data-monster-replace="path:labels.stepAccount"></span>
+                                <ul>
+                                    <li data-monster-replace="path:labels.subEmail"></li>
+                                    <li data-monster-replace="path:labels.subPassword"></li>
+                                </ul>
+                            </li>
+                            <li class="step">
+                                <span data-monster-role="step-label" part="step-label"
+                                      data-monster-replace="path:labels.stepProfileGroup"></span>
+                                <ul>
+                                    <li data-monster-replace="path:labels.subProfile"></li>
+                                    <li data-monster-replace="path:labels.subAddress"></li>
+                                </ul>
+                            </li>
+                            <li class="step">
+                                <span data-monster-role="step-label" part="step-label"
+                                      data-monster-replace="path:labels.stepConsentsGroup"></span>
+                                <ul>
+                                    <li data-monster-replace="path:labels.subConsents"></li>
+                                </ul>
+                            </li>
+                        </ol>
+                    </monster-wizard-navigation>
+                </div>
+                <div data-monster-role="content" part="content">
+                    <section data-monster-role="panel" data-step="email" part="panel panel-email">
+                        <monster-field-set data-monster-role="field-set-email" part="field-set field-set-email">
+                            <label data-monster-role="field-label email-label" part="field-label email-label"
+                                   data-monster-replace="path:labels.email"></label>
+                            <input data-monster-role="email-input" part="input input-email"
+                                   type="text" name="email"
+                                   data-monster-attributes="placeholder path:labels.emailPlaceholder, autocomplete path:autocomplete.email, aria-label path:labels.emailAria" />
+                            <slot name="email-fields"></slot>
+                        </monster-field-set>
+                        <slot name="email-info" part="slot slot-email"></slot>
+                        <div data-monster-role="availability-message" part="availability-message"></div>
+                        <div data-monster-role="step-message" part="step-message"></div>
+                        <div data-monster-role="actions" part="actions">
+                            <monster-message-state-button data-monster-role="next-button" part="next-button"
+                                                          data-monster-replace="path:labels.next"></monster-message-state-button>
+                        </div>
+                    </section>
+
+                    <section data-monster-role="panel" data-step="password" part="panel panel-password">
+                        <monster-field-set data-monster-role="field-set-password" part="field-set field-set-password">
+                            <label data-monster-role="field-label password-label" part="field-label password-label"
+                                   data-monster-replace="path:labels.password"></label>
+                            <monster-password data-monster-role="password-input" part="input input-password"
+                                              data-monster-attributes="data-monster-option-autocomplete path:autocomplete.password, aria-label path:labels.passwordAria"></monster-password>
+                            <label data-monster-role="field-label password-confirm-label"
+                                   part="field-label password-confirm-label"
+                                   data-monster-attributes="class path:features.confirmPassword | ?::hidden"
+                                   data-monster-replace="path:labels.passwordConfirm"></label>
+                            <input data-monster-role="password-confirm-input" part="input input-password-confirm"
+                                   type="password" name="passwordConfirm"
+                                   data-monster-attributes="class path:features.confirmPassword | ?::hidden, placeholder path:labels.passwordConfirmPlaceholder, autocomplete path:autocomplete.passwordConfirm, aria-label path:labels.passwordConfirmAria" />
+                            <slot name="password-fields"></slot>
+                        </monster-field-set>
+                        <slot name="password-info" part="slot slot-password"></slot>
+                        <div data-monster-role="step-message" part="step-message"></div>
+                        <div data-monster-role="actions" part="actions">
+                            <monster-button data-monster-role="back-button" part="back-button"
+                                            data-monster-replace="path:labels.back"></monster-button>
+                            <monster-message-state-button data-monster-role="next-button" part="next-button"
+                                                          data-monster-replace="path:labels.next"></monster-message-state-button>
+                        </div>
+                    </section>
+
+                    <section data-monster-role="panel" data-step="profile" part="panel panel-profile">
+                        <monster-field-set data-monster-role="field-set-profile" part="field-set field-set-profile">
+                            <label data-monster-role="field-label first-name-label" part="field-label first-name-label"
+                                   data-monster-replace="path:labels.firstName"></label>
+                            <input data-monster-role="first-name-input" part="input input-first-name"
+                                   type="text" name="firstName"
+                                   data-monster-attributes="placeholder path:labels.firstNamePlaceholder, autocomplete path:autocomplete.firstName, aria-label path:labels.firstNameAria" />
+                            <label data-monster-role="field-label last-name-label" part="field-label last-name-label"
+                                   data-monster-replace="path:labels.lastName"></label>
+                            <input data-monster-role="last-name-input" part="input input-last-name"
+                                   type="text" name="lastName"
+                                   data-monster-attributes="placeholder path:labels.lastNamePlaceholder, autocomplete path:autocomplete.lastName, aria-label path:labels.lastNameAria" />
+                            <label data-monster-role="field-label birth-date-label" part="field-label birth-date-label"
+                                   data-monster-attributes="class path:features.showBirthDate | ?::hidden"
+                                   data-monster-replace="path:labels.birthDate"></label>
+                            <input data-monster-role="birth-date-input" part="input input-birth-date"
+                                   type="text" name="birthDate"
+                                   data-monster-attributes="class path:features.showBirthDate | ?::hidden, autocomplete path:autocomplete.birthDate, aria-label path:labels.birthDateAria" />
+                            <label data-monster-role="field-label nationality-label" part="field-label nationality-label"
+                                   data-monster-attributes="class path:features.showNationality | ?::hidden"
+                                   data-monster-replace="path:labels.nationality"></label>
+                            <input data-monster-role="nationality-input" part="input input-nationality"
+                                   type="text" name="nationality"
+                                   data-monster-attributes="class path:features.showNationality | ?::hidden, placeholder path:labels.nationalityPlaceholder, autocomplete path:autocomplete.nationality, aria-label path:labels.nationalityAria" />
+                            <slot name="profile-fields"></slot>
+                        </monster-field-set>
+                        <slot name="profile-info" part="slot slot-profile"></slot>
+                        <div data-monster-role="step-message" part="step-message"></div>
+                        <div data-monster-role="actions" part="actions">
+                            <monster-button data-monster-role="back-button" part="back-button"
+                                            data-monster-replace="path:labels.back"></monster-button>
+                            <monster-message-state-button data-monster-role="next-button" part="next-button"
+                                                          data-monster-replace="path:labels.next"></monster-message-state-button>
+                        </div>
+                    </section>
+
+                    <section data-monster-role="panel" data-step="address" part="panel panel-address">
+                        <monster-field-set data-monster-role="field-set-address" part="field-set field-set-address">
+                            <label data-monster-role="field-label street-label" part="field-label street-label"
+                                   class="grid-start-1"
+                                   data-monster-replace="path:labels.street"></label>
+                            <input data-monster-role="street-input" part="input input-street"
+                                   class="grid-start-2 grid-span-full"
+                                   type="text" name="street"
+                                   data-monster-attributes="placeholder path:labels.streetPlaceholder, autocomplete path:autocomplete.street, aria-label path:labels.streetAria" />
+                            <label data-monster-role="field-label zip-label" part="field-label zip-label"
+                                   class="grid-start-1"
+                                   data-monster-replace="path:labels.zip"></label>
+                            <input data-monster-role="zip-input" part="input input-zip"
+                                   class="grid-start-2"
+                                   type="text" name="zip"
+                                   data-monster-attributes="placeholder path:labels.zipPlaceholder, autocomplete path:autocomplete.zip, aria-label path:labels.zipAria" />
+                            <label data-monster-role="field-label city-label" part="field-label city-label"
+                                   class="grid-start-3"
+                                   data-monster-replace="path:labels.city"></label>
+                            <input data-monster-role="city-input" part="input input-city"
+                                   class="grid-start-4"
+                                   type="text" name="city"
+                                   data-monster-attributes="placeholder path:labels.cityPlaceholder, autocomplete path:autocomplete.city, aria-label path:labels.cityAria" />
+                            <label data-monster-role="field-label country-label" part="field-label country-label"
+                                   class="grid-start-1"
+                                   data-monster-replace="path:labels.country"></label>
+                            <input data-monster-role="country-input" part="input input-country"
+                                   class="grid-start-2 grid-span-full"
+                                   type="text" name="country"
+                                   data-monster-attributes="placeholder path:labels.countryPlaceholder, autocomplete path:autocomplete.country, aria-label path:labels.countryAria" />
+                            <slot name="address-fields"></slot>
+                        </monster-field-set>
+                        <slot name="address-info" part="slot slot-address"></slot>
+                        <div data-monster-role="step-message" part="step-message"></div>
+                        <div data-monster-role="actions" part="actions">
+                            <monster-button data-monster-role="back-button" part="back-button"
+                                            data-monster-replace="path:labels.back"></monster-button>
+                            <monster-message-state-button data-monster-role="next-button" part="next-button"
+                                                          data-monster-replace="path:labels.next"></monster-message-state-button>
+                        </div>
+                    </section>
+
+                    <section data-monster-role="panel" data-step="consents" part="panel panel-consents">
+                        <monster-field-set data-monster-role="field-set-consents" part="field-set field-set-consents">
+                            <div data-monster-role="consents-title" part="consents-title"
+                                 data-monster-replace="path:labels.consentsTitle"></div>
+                            <div data-monster-role="consents-list" part="consents-list"></div>
+                            <slot name="consents-fields"></slot>
+                        </monster-field-set>
+                        <slot name="consents-info" part="slot slot-consents"></slot>
+                        <div data-monster-role="step-message" part="step-message"></div>
+                        <div data-monster-role="actions" part="actions">
+                            <monster-button data-monster-role="back-button" part="back-button"
+                                            data-monster-replace="path:labels.back"></monster-button>
+                            <monster-message-state-button data-monster-role="submit-button" part="submit-button"
+                                                          data-monster-replace="path:labels.register"></monster-message-state-button>
+                        </div>
+                    </section>
+                    <section data-monster-role="panel" data-step="success" part="panel panel-success" hidden>
+                        <div data-monster-role="success-title" part="success-title"
+                             data-monster-replace="path:labels.successTitle"></div>
+                        <slot name="success"></slot>
+                    </section>
+                </div>
+            </div>
+            <div data-monster-role="footer" part="footer">
+                <slot name="footer"></slot>
+            </div>
+            <monster-datasource-rest data-monster-role="availability-datasource" part="availability-datasource"></monster-datasource-rest>
+            <monster-datasource-rest data-monster-role="register-datasource" part="register-datasource"></monster-datasource-rest>
+            <monster-datasource-rest data-monster-role="consents-datasource" part="consents-datasource"></monster-datasource-rest>
+        </div>
+    `;
+}
+
+function getTranslations() {
+	const locale = getLocaleOfDocument();
+	switch (locale.language) {
+		case "de":
+			return {
+				stepEmail: "E-Mail",
+				stepPassword: "Passwort",
+				stepProfile: "Profil",
+				stepAddress: "Adresse",
+				stepConsents: "Einwilligungen",
+				stepAccount: "Zugangsdaten",
+				stepProfileGroup: "Profil",
+				stepConsentsGroup: "Einwilligungen",
+				subEmail: "E-Mail",
+				subPassword: "Passwort",
+				subProfile: "Profil",
+				subAddress: "Adresse",
+				subConsents: "Einwilligungen",
+				email: "E-Mail-Adresse",
+				emailPlaceholder: "name@beispiel.de",
+				emailAria: "E-Mail-Adresse",
+				password: "Passwort",
+				passwordAria: "Passwort",
+				passwordConfirm: "Passwort bestaetigen",
+				passwordConfirmPlaceholder: "Passwort wiederholen",
+				passwordConfirmAria: "Passwort bestaetigen",
+				firstName: "Vorname",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Vorname",
+				lastName: "Nachname",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Nachname",
+				birthDate: "Geburtsdatum",
+				birthDateAria: "Geburtsdatum",
+				nationality: "Nationalitaet",
+				nationalityPlaceholder: "DE",
+				nationalityAria: "Nationalitaet",
+				street: "Strasse",
+				streetPlaceholder: "Musterstrasse 1",
+				streetAria: "Strasse",
+				zip: "PLZ",
+				zipPlaceholder: "12345",
+				zipAria: "PLZ",
+				city: "Stadt",
+				cityPlaceholder: "Berlin",
+				cityAria: "Stadt",
+				country: "Land",
+				countryPlaceholder: "DE",
+				countryAria: "Land",
+				consentsTitle: "Einwilligungen",
+				back: "Zurueck",
+				next: "Weiter",
+				register: "Registrieren",
+				successTitle: "Registrierung abgeschlossen",
+				messageChecking: "E-Mail wird geprueft...",
+				messageEmailAvailable: "E-Mail ist verfuegbar.",
+				messageEmailUnavailable: "E-Mail ist bereits vergeben.",
+				messageRequiredEmail: "Bitte eine E-Mail-Adresse eingeben.",
+				messageInvalidEmail: "Bitte eine gueltige E-Mail-Adresse eingeben.",
+				messageRequiredPassword: "Bitte ein Passwort eingeben.",
+				messageRequiredPasswordConfirm: "Bitte Passwort bestaetigen.",
+				messageRequiredField: "Bitte alle Pflichtfelder ausfuellen.",
+				messageAvailabilityFailed: "E-Mail-Pruefung fehlgeschlagen.",
+				messageAvailabilityNotConfigured:
+					"E-Mail-Pruefung ist nicht konfiguriert.",
+				messageAvailabilityRequired: "Bitte zuerst die E-Mail pruefen.",
+				messagePasswordMismatch: "Passwoerter stimmen nicht ueberein.",
+				messageRequiredConsents: "Bitte Pflicht-Einwilligungen akzeptieren.",
+				messageRegisterFailed: "Registrierung fehlgeschlagen.",
+				messageRegisterNotConfigured: "Registrierung ist nicht konfiguriert.",
+			};
+		case "es":
+			return {
+				stepEmail: "Correo",
+				stepPassword: "Contrasena",
+				stepProfile: "Perfil",
+				stepAddress: "Direccion",
+				stepConsents: "Consentimientos",
+				stepAccount: "Cuenta",
+				stepProfileGroup: "Perfil",
+				stepConsentsGroup: "Consentimientos",
+				subEmail: "Correo",
+				subPassword: "Contrasena",
+				subProfile: "Perfil",
+				subAddress: "Direccion",
+				subConsents: "Consentimientos",
+				email: "Correo electronico",
+				emailPlaceholder: "nombre@ejemplo.com",
+				emailAria: "Correo electronico",
+				password: "Contrasena",
+				passwordAria: "Contrasena",
+				passwordConfirm: "Confirmar contrasena",
+				passwordConfirmPlaceholder: "Repetir contrasena",
+				passwordConfirmAria: "Confirmar contrasena",
+				firstName: "Nombre",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Nombre",
+				lastName: "Apellido",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Apellido",
+				birthDate: "Fecha de nacimiento",
+				birthDateAria: "Fecha de nacimiento",
+				nationality: "Nacionalidad",
+				nationalityPlaceholder: "ES",
+				nationalityAria: "Nacionalidad",
+				street: "Calle",
+				streetPlaceholder: "Calle 1",
+				streetAria: "Calle",
+				zip: "Codigo postal",
+				zipPlaceholder: "12345",
+				zipAria: "Codigo postal",
+				city: "Ciudad",
+				cityPlaceholder: "Madrid",
+				cityAria: "Ciudad",
+				country: "Pais",
+				countryPlaceholder: "ES",
+				countryAria: "Pais",
+				consentsTitle: "Consentimientos",
+				back: "Atras",
+				next: "Siguiente",
+				register: "Registrarse",
+				successTitle: "Registro completado",
+				messageChecking: "Comprobando correo...",
+				messageEmailAvailable: "El correo esta disponible.",
+				messageEmailUnavailable: "El correo ya esta en uso.",
+				messageRequiredEmail: "Ingrese un correo.",
+				messageInvalidEmail: "Ingrese un correo valido.",
+				messageRequiredPassword: "Ingrese una contrasena.",
+				messageRequiredPasswordConfirm: "Confirme la contrasena.",
+				messageRequiredField: "Complete los campos obligatorios.",
+				messageAvailabilityFailed: "La verificacion fallo.",
+				messageAvailabilityNotConfigured:
+					"La verificacion no esta configurada.",
+				messageAvailabilityRequired: "Por favor revise el correo primero.",
+				messagePasswordMismatch: "Las contrasenas no coinciden.",
+				messageRequiredConsents: "Acepte los consentimientos requeridos.",
+				messageRegisterFailed: "El registro fallo.",
+				messageRegisterNotConfigured: "El registro no esta configurado.",
+			};
+		case "zh":
+			return {
+				stepEmail: "邮箱",
+				stepPassword: "密码",
+				stepProfile: "资料",
+				stepAddress: "地址",
+				stepConsents: "同意",
+				stepAccount: "账户",
+				stepProfileGroup: "资料",
+				stepConsentsGroup: "同意",
+				subEmail: "邮箱",
+				subPassword: "密码",
+				subProfile: "资料",
+				subAddress: "地址",
+				subConsents: "同意",
+				email: "邮箱",
+				emailPlaceholder: "name@example.com",
+				emailAria: "邮箱",
+				password: "密码",
+				passwordAria: "密码",
+				passwordConfirm: "确认密码",
+				passwordConfirmPlaceholder: "再次输入密码",
+				passwordConfirmAria: "确认密码",
+				firstName: "名",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "名",
+				lastName: "姓",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "姓",
+				birthDate: "出生日期",
+				birthDateAria: "出生日期",
+				nationality: "国籍",
+				nationalityPlaceholder: "CN",
+				nationalityAria: "国籍",
+				street: "街道",
+				streetPlaceholder: "街道 1 号",
+				streetAria: "街道",
+				zip: "邮编",
+				zipPlaceholder: "12345",
+				zipAria: "邮编",
+				city: "城市",
+				cityPlaceholder: "北京",
+				cityAria: "城市",
+				country: "国家",
+				countryPlaceholder: "CN",
+				countryAria: "国家",
+				consentsTitle: "同意",
+				back: "返回",
+				next: "继续",
+				register: "注册",
+				successTitle: "注册完成",
+				messageChecking: "正在检查邮箱...",
+				messageEmailAvailable: "邮箱可用。",
+				messageEmailUnavailable: "邮箱已被使用。",
+				messageRequiredEmail: "请输入邮箱。",
+				messageInvalidEmail: "请输入有效的邮箱。",
+				messageRequiredPassword: "请输入密码。",
+				messageRequiredPasswordConfirm: "请确认密码。",
+				messageRequiredField: "请填写必填字段。",
+				messageAvailabilityFailed: "邮箱检查失败。",
+				messageAvailabilityNotConfigured: "邮箱检查未配置。",
+				messageAvailabilityRequired: "请先检查邮箱。",
+				messagePasswordMismatch: "密码不匹配。",
+				messageRequiredConsents: "请同意必选项。",
+				messageRegisterFailed: "注册失败。",
+				messageRegisterNotConfigured: "注册未配置。",
+			};
+		case "hi":
+			return {
+				stepEmail: "ईमेल",
+				stepPassword: "पासवर्ड",
+				stepProfile: "प्रोफाइल",
+				stepAddress: "पता",
+				stepConsents: "सहमति",
+				stepAccount: "Khata",
+				stepProfileGroup: "Profile",
+				stepConsentsGroup: "Sahamati",
+				subEmail: "Email",
+				subPassword: "Password",
+				subProfile: "Profile",
+				subAddress: "Pata",
+				subConsents: "Sahamati",
+				email: "ईमेल",
+				emailPlaceholder: "name@example.com",
+				emailAria: "ईमेल",
+				password: "पासवर्ड",
+				passwordAria: "पासवर्ड",
+				passwordConfirm: "पासवर्ड की पुष्टि",
+				passwordConfirmPlaceholder: "पासवर्ड दोहराएं",
+				passwordConfirmAria: "पासवर्ड की पुष्टि",
+				firstName: "पहला नाम",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "पहला नाम",
+				lastName: "अंतिम नाम",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "अंतिम नाम",
+				birthDate: "जन्म तिथि",
+				birthDateAria: "जन्म तिथि",
+				nationality: "राष्ट्रीयता",
+				nationalityPlaceholder: "IN",
+				nationalityAria: "राष्ट्रीयता",
+				street: "सड़क",
+				streetPlaceholder: "स्ट्रीट 1",
+				streetAria: "सड़क",
+				zip: "पिन कोड",
+				zipPlaceholder: "12345",
+				zipAria: "पिन कोड",
+				city: "शहर",
+				cityPlaceholder: "Delhi",
+				cityAria: "शहर",
+				country: "देश",
+				countryPlaceholder: "IN",
+				countryAria: "देश",
+				consentsTitle: "सहमति",
+				back: "वापस",
+				next: "आगे",
+				register: "रजिस्टर",
+				successTitle: "Registration poora hua",
+				messageChecking: "ईमेल जांच रहे हैं...",
+				messageEmailAvailable: "ईमेल उपलब्ध है।",
+				messageEmailUnavailable: "ईमेल पहले से उपयोग में है।",
+				messageRequiredEmail: "कृपया ईमेल दर्ज करें।",
+				messageInvalidEmail: "कृपया मान्य ईमेल दर्ज करें।",
+				messageRequiredPassword: "कृपया पासवर्ड दर्ज करें।",
+				messageRequiredPasswordConfirm: "कृपया पासवर्ड पुष्टि करें।",
+				messageRequiredField: "कृपया आवश्यक फील्ड भरें।",
+				messageAvailabilityFailed: "ईमेल जांच विफल रही।",
+				messageAvailabilityNotConfigured: "ईमेल जांच कॉन्फ़िगर नहीं है।",
+				messageAvailabilityRequired: "कृपया पहले ईमेल जांचें।",
+				messagePasswordMismatch: "पासवर्ड मेल नहीं खाते।",
+				messageRequiredConsents: "कृपया आवश्यक सहमतियाँ स्वीकार करें।",
+				messageRegisterFailed: "रजिस्ट्रेशन विफल रहा।",
+				messageRegisterNotConfigured: "रजिस्ट्रेशन कॉन्फ़िगर नहीं है।",
+			};
+		case "bn":
+			return {
+				stepEmail: "ইমেল",
+				stepPassword: "পাসওয়ার্ড",
+				stepProfile: "প্রোফাইল",
+				stepAddress: "ঠিকানা",
+				stepConsents: "সম্মতি",
+				stepAccount: "Account",
+				stepProfileGroup: "Profile",
+				stepConsentsGroup: "Sommoti",
+				subEmail: "Email",
+				subPassword: "Password",
+				subProfile: "Profile",
+				subAddress: "Thikana",
+				subConsents: "Sommoti",
+				email: "ইমেল",
+				emailPlaceholder: "name@example.com",
+				emailAria: "ইমেল",
+				password: "পাসওয়ার্ড",
+				passwordAria: "পাসওয়ার্ড",
+				passwordConfirm: "পাসওয়ার্ড নিশ্চিত করুন",
+				passwordConfirmPlaceholder: "পাসওয়ার্ড আবার লিখুন",
+				passwordConfirmAria: "পাসওয়ার্ড নিশ্চিত করুন",
+				firstName: "নাম",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "নাম",
+				lastName: "পদবি",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "পদবি",
+				birthDate: "জন্ম তারিখ",
+				birthDateAria: "জন্ম তারিখ",
+				nationality: "জাতীয়তা",
+				nationalityPlaceholder: "BD",
+				nationalityAria: "জাতীয়তা",
+				street: "রাস্তা",
+				streetPlaceholder: "স্ট্রিট ১",
+				streetAria: "রাস্তা",
+				zip: "পোস্ট কোড",
+				zipPlaceholder: "12345",
+				zipAria: "পোস্ট কোড",
+				city: "শহর",
+				cityPlaceholder: "Dhaka",
+				cityAria: "শহর",
+				country: "দেশ",
+				countryPlaceholder: "BD",
+				countryAria: "দেশ",
+				consentsTitle: "সম্মতি",
+				back: "পেছনে",
+				next: "পরবর্তী",
+				register: "নিবন্ধন",
+				successTitle: "Registration shesh",
+				messageChecking: "ইমেল যাচাই হচ্ছে...",
+				messageEmailAvailable: "ইমেল উপলব্ধ।",
+				messageEmailUnavailable: "ইমেল ব্যবহৃত হচ্ছে।",
+				messageRequiredEmail: "ইমেল লিখুন।",
+				messageInvalidEmail: "সঠিক ইমেল লিখুন।",
+				messageRequiredPassword: "পাসওয়ার্ড লিখুন।",
+				messageRequiredPasswordConfirm: "পাসওয়ার্ড নিশ্চিত করুন।",
+				messageRequiredField: "প্রয়োজনীয় ঘর পূরণ করুন।",
+				messageAvailabilityFailed: "ইমেল যাচাই ব্যর্থ।",
+				messageAvailabilityNotConfigured: "ইমেল যাচাই কনফিগার করা নেই।",
+				messageAvailabilityRequired: "প্রথমে ইমেল যাচাই করুন।",
+				messagePasswordMismatch: "পাসওয়ার্ড মিলছে না।",
+				messageRequiredConsents: "প্রয়োজনীয় সম্মতি দিন।",
+				messageRegisterFailed: "নিবন্ধন ব্যর্থ।",
+				messageRegisterNotConfigured: "নিবন্ধন কনফিগার করা নেই।",
+			};
+		case "pt":
+			return {
+				stepEmail: "Email",
+				stepPassword: "Senha",
+				stepProfile: "Perfil",
+				stepAddress: "Endereco",
+				stepConsents: "Consentimentos",
+				stepAccount: "Conta",
+				stepProfileGroup: "Perfil",
+				stepConsentsGroup: "Consentimentos",
+				subEmail: "Email",
+				subPassword: "Senha",
+				subProfile: "Perfil",
+				subAddress: "Endereco",
+				subConsents: "Consentimentos",
+				email: "Email",
+				emailPlaceholder: "nome@exemplo.com",
+				emailAria: "Email",
+				password: "Senha",
+				passwordAria: "Senha",
+				passwordConfirm: "Confirmar senha",
+				passwordConfirmPlaceholder: "Repetir senha",
+				passwordConfirmAria: "Confirmar senha",
+				firstName: "Nome",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Nome",
+				lastName: "Sobrenome",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Sobrenome",
+				birthDate: "Data de nascimento",
+				birthDateAria: "Data de nascimento",
+				nationality: "Nacionalidade",
+				nationalityPlaceholder: "BR",
+				nationalityAria: "Nacionalidade",
+				street: "Rua",
+				streetPlaceholder: "Rua 1",
+				streetAria: "Rua",
+				zip: "CEP",
+				zipPlaceholder: "12345",
+				zipAria: "CEP",
+				city: "Cidade",
+				cityPlaceholder: "Sao Paulo",
+				cityAria: "Cidade",
+				country: "Pais",
+				countryPlaceholder: "BR",
+				countryAria: "Pais",
+				consentsTitle: "Consentimentos",
+				back: "Voltar",
+				next: "Proximo",
+				register: "Registrar",
+				successTitle: "Registro concluido",
+				messageChecking: "Verificando email...",
+				messageEmailAvailable: "Email disponivel.",
+				messageEmailUnavailable: "Email ja em uso.",
+				messageRequiredEmail: "Informe o email.",
+				messageInvalidEmail: "Informe um email valido.",
+				messageRequiredPassword: "Informe a senha.",
+				messageRequiredPasswordConfirm: "Confirme a senha.",
+				messageRequiredField: "Preencha os campos obrigatorios.",
+				messageAvailabilityFailed: "Falha ao verificar email.",
+				messageAvailabilityNotConfigured: "Verificacao nao configurada.",
+				messageAvailabilityRequired: "Verifique o email primeiro.",
+				messagePasswordMismatch: "As senhas nao coincidem.",
+				messageRequiredConsents: "Aceite os consentimentos obrigatorios.",
+				messageRegisterFailed: "Registro falhou.",
+				messageRegisterNotConfigured: "Registro nao configurado.",
+			};
+		case "ru":
+			return {
+				stepEmail: "Email",
+				stepPassword: "Parol",
+				stepProfile: "Profil",
+				stepAddress: "Adres",
+				stepConsents: "Soglasie",
+				stepAccount: "Uchetnaya zapis",
+				stepProfileGroup: "Profil",
+				stepConsentsGroup: "Soglasiya",
+				subEmail: "Email",
+				subPassword: "Parol",
+				subProfile: "Profil",
+				subAddress: "Adres",
+				subConsents: "Soglasiya",
+				email: "Email",
+				emailPlaceholder: "name@example.com",
+				emailAria: "Email",
+				password: "Parol",
+				passwordAria: "Parol",
+				passwordConfirm: "Podtverdit parol",
+				passwordConfirmPlaceholder: "Povtorite parol",
+				passwordConfirmAria: "Podtverdit parol",
+				firstName: "Imya",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Imya",
+				lastName: "Familiya",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Familiya",
+				birthDate: "Data rozhdeniya",
+				birthDateAria: "Data rozhdeniya",
+				nationality: "Nacionalnost",
+				nationalityPlaceholder: "RU",
+				nationalityAria: "Nacionalnost",
+				street: "Ulica",
+				streetPlaceholder: "Ulica 1",
+				streetAria: "Ulica",
+				zip: "Indeks",
+				zipPlaceholder: "12345",
+				zipAria: "Indeks",
+				city: "Gorod",
+				cityPlaceholder: "Moskva",
+				cityAria: "Gorod",
+				country: "Strana",
+				countryPlaceholder: "RU",
+				countryAria: "Strana",
+				consentsTitle: "Soglasie",
+				back: "Nazad",
+				next: "Daleye",
+				register: "Registraciya",
+				successTitle: "Registraciya zavershena",
+				messageChecking: "Proverka email...",
+				messageEmailAvailable: "Email dostupen.",
+				messageEmailUnavailable: "Email uzhe ispolzuetsya.",
+				messageRequiredEmail: "Vvedite email.",
+				messageInvalidEmail: "Vvedite korrektnyy email.",
+				messageRequiredPassword: "Vvedite parol.",
+				messageRequiredPasswordConfirm: "Podtverdite parol.",
+				messageRequiredField: "Zapolnite obyazatelnye polya.",
+				messageAvailabilityFailed: "Proverka email ne udalas.",
+				messageAvailabilityNotConfigured: "Proverka ne nastroena.",
+				messageAvailabilityRequired: "Snachala prover'te email.",
+				messagePasswordMismatch: "Paroli ne sovpadayut.",
+				messageRequiredConsents: "Prinyat obyazatelnye soglasiya.",
+				messageRegisterFailed: "Registraciya ne udalas.",
+				messageRegisterNotConfigured: "Registraciya ne nastroena.",
+			};
+		case "ja":
+			return {
+				stepEmail: "メール",
+				stepPassword: "パスワード",
+				stepProfile: "プロフィール",
+				stepAddress: "住所",
+				stepConsents: "同意",
+				stepAccount: "Akaunto",
+				stepProfileGroup: "Purofiiru",
+				stepConsentsGroup: "Doui",
+				subEmail: "Meiru",
+				subPassword: "Pasuwaado",
+				subProfile: "Purofiiru",
+				subAddress: "Jusho",
+				subConsents: "Doui",
+				email: "メール",
+				emailPlaceholder: "name@example.com",
+				emailAria: "メール",
+				password: "パスワード",
+				passwordAria: "パスワード",
+				passwordConfirm: "パスワード確認",
+				passwordConfirmPlaceholder: "パスワードを再入力",
+				passwordConfirmAria: "パスワード確認",
+				firstName: "名",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "名",
+				lastName: "姓",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "姓",
+				birthDate: "生年月日",
+				birthDateAria: "生年月日",
+				nationality: "国籍",
+				nationalityPlaceholder: "JP",
+				nationalityAria: "国籍",
+				street: "住所",
+				streetPlaceholder: "ストリート 1",
+				streetAria: "住所",
+				zip: "郵便番号",
+				zipPlaceholder: "12345",
+				zipAria: "郵便番号",
+				city: "市区町村",
+				cityPlaceholder: "東京",
+				cityAria: "市区町村",
+				country: "国",
+				countryPlaceholder: "JP",
+				countryAria: "国",
+				consentsTitle: "同意",
+				back: "戻る",
+				next: "次へ",
+				register: "登録",
+				successTitle: "Touroku kanryo",
+				messageChecking: "メール確認中...",
+				messageEmailAvailable: "メールは利用可能です。",
+				messageEmailUnavailable: "メールは使用済みです。",
+				messageRequiredEmail: "メールを入力してください。",
+				messageInvalidEmail: "有効なメールを入力してください。",
+				messageRequiredPassword: "パスワードを入力してください。",
+				messageRequiredPasswordConfirm: "パスワードを確認してください。",
+				messageRequiredField: "必須項目を入力してください。",
+				messageAvailabilityFailed: "メール確認に失敗しました。",
+				messageAvailabilityNotConfigured: "メール確認が未設定です。",
+				messageAvailabilityRequired: "先にメールを確認してください。",
+				messagePasswordMismatch: "パスワードが一致しません。",
+				messageRequiredConsents: "必須同意にチェックしてください。",
+				messageRegisterFailed: "登録に失敗しました。",
+				messageRegisterNotConfigured: "登録が未設定です。",
+			};
+		case "pa":
+			return {
+				stepEmail: "ਈਮੇਲ",
+				stepPassword: "ਪਾਸਵਰਡ",
+				stepProfile: "ਪ੍ਰੋਫਾਈਲ",
+				stepAddress: "ਪਤਾ",
+				stepConsents: "ਸਹਿਮਤੀ",
+				stepAccount: "Khata",
+				stepProfileGroup: "Profile",
+				stepConsentsGroup: "Sahmati",
+				subEmail: "Email",
+				subPassword: "Password",
+				subProfile: "Profile",
+				subAddress: "Pata",
+				subConsents: "Sahmati",
+				email: "ਈਮੇਲ",
+				emailPlaceholder: "name@example.com",
+				emailAria: "ਈਮੇਲ",
+				password: "ਪਾਸਵਰਡ",
+				passwordAria: "ਪਾਸਵਰਡ",
+				passwordConfirm: "ਪਾਸਵਰਡ ਪੁਸ਼ਟੀ",
+				passwordConfirmPlaceholder: "ਪਾਸਵਰਡ ਦੁਹਰਾਓ",
+				passwordConfirmAria: "ਪਾਸਵਰਡ ਪੁਸ਼ਟੀ",
+				firstName: "ਪਹਿਲਾ ਨਾਂ",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "ਪਹਿਲਾ ਨਾਂ",
+				lastName: "ਅੰਤਿਮ ਨਾਂ",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "ਅੰਤਿਮ ਨਾਂ",
+				birthDate: "ਜਨਮ ਤਾਰੀਖ",
+				birthDateAria: "ਜਨਮ ਤਾਰੀਖ",
+				nationality: "ਰਾਸ਼ਟਰਤਾ",
+				nationalityPlaceholder: "IN",
+				nationalityAria: "ਰਾਸ਼ਟਰਤਾ",
+				street: "ਗਲੀ",
+				streetPlaceholder: "ਸਟ੍ਰੀਟ 1",
+				streetAria: "ਗਲੀ",
+				zip: "ਪੋਸਟ ਕੋਡ",
+				zipPlaceholder: "12345",
+				zipAria: "ਪੋਸਟ ਕੋਡ",
+				city: "ਸ਼ਹਿਰ",
+				cityPlaceholder: "Amritsar",
+				cityAria: "ਸ਼ਹਿਰ",
+				country: "ਦੇਸ਼",
+				countryPlaceholder: "IN",
+				countryAria: "ਦੇਸ਼",
+				consentsTitle: "ਸਹਿਮਤੀ",
+				back: "ਵਾਪਸ",
+				next: "ਅੱਗੇ",
+				register: "ਰਜਿਸਟਰ",
+				successTitle: "Registration ho gaya",
+				messageChecking: "ਈਮੇਲ ਜਾਂਚ ਰਹੇ ਹਾਂ...",
+				messageEmailAvailable: "ਈਮੇਲ ਉਪਲਬਧ ਹੈ।",
+				messageEmailUnavailable: "ਈਮੇਲ ਵਰਤੋਂ ਵਿੱਚ ਹੈ।",
+				messageRequiredEmail: "ਈਮੇਲ ਦਿਓ।",
+				messageInvalidEmail: "ਠੀਕ ਈਮੇਲ ਦਿਓ।",
+				messageRequiredPassword: "ਪਾਸਵਰਡ ਦਿਓ।",
+				messageRequiredPasswordConfirm: "ਪਾਸਵਰਡ ਪੁਸ਼ਟੀ ਕਰੋ।",
+				messageRequiredField: "ਲਾਜ਼ਮੀ ਖੇਤਰ ਭਰੋ।",
+				messageAvailabilityFailed: "ਈਮੇਲ ਜਾਂਚ ਅਸਫਲ।",
+				messageAvailabilityNotConfigured: "ਈਮੇਲ ਜਾਂਚ ਸੰਰਚਿਤ ਨਹੀਂ।",
+				messageAvailabilityRequired: "ਪਹਿਲਾਂ ਈਮੇਲ ਜਾਂਚੋ।",
+				messagePasswordMismatch: "ਪਾਸਵਰਡ ਨਹੀਂ ਮਿਲਦੇ।",
+				messageRequiredConsents: "ਲਾਜ਼ਮੀ ਸਹਿਮਤੀਆਂ ਮਨਜ਼ੂਰ ਕਰੋ।",
+				messageRegisterFailed: "ਰਜਿਸਟਰੇਸ਼ਨ ਅਸਫਲ।",
+				messageRegisterNotConfigured: "ਰਜਿਸਟਰੇਸ਼ਨ ਸੰਰਚਿਤ ਨਹੀਂ।",
+			};
+		case "mr":
+			return {
+				stepEmail: "ईमेल",
+				stepPassword: "पासवर्ड",
+				stepProfile: "प्रोफाइल",
+				stepAddress: "पत्ता",
+				stepConsents: "संमती",
+				stepAccount: "Khata",
+				stepProfileGroup: "Profile",
+				stepConsentsGroup: "Sammati",
+				subEmail: "Email",
+				subPassword: "Password",
+				subProfile: "Profile",
+				subAddress: "Pata",
+				subConsents: "Sammati",
+				email: "ईमेल",
+				emailPlaceholder: "name@example.com",
+				emailAria: "ईमेल",
+				password: "पासवर्ड",
+				passwordAria: "पासवर्ड",
+				passwordConfirm: "पासवर्ड पुष्टी",
+				passwordConfirmPlaceholder: "पासवर्ड पुन्हा टाका",
+				passwordConfirmAria: "पासवर्ड पुष्टी",
+				firstName: "पहिले नाव",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "पहिले नाव",
+				lastName: "आडनाव",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "आडनाव",
+				birthDate: "जन्म तारीख",
+				birthDateAria: "जन्म तारीख",
+				nationality: "राष्ट्रीयत्व",
+				nationalityPlaceholder: "IN",
+				nationalityAria: "राष्ट्रीयत्व",
+				street: "रस्ता",
+				streetPlaceholder: "स्ट्रीट 1",
+				streetAria: "रस्ता",
+				zip: "पिन",
+				zipPlaceholder: "12345",
+				zipAria: "पिन",
+				city: "शहर",
+				cityPlaceholder: "Mumbai",
+				cityAria: "शहर",
+				country: "देश",
+				countryPlaceholder: "IN",
+				countryAria: "देश",
+				consentsTitle: "संमती",
+				back: "मागे",
+				next: "पुढे",
+				register: "नोंदणी",
+				successTitle: "Nondani purna",
+				messageChecking: "ईमेल तपासत आहे...",
+				messageEmailAvailable: "ईमेल उपलब्ध आहे.",
+				messageEmailUnavailable: "ईमेल आधीच वापरात आहे.",
+				messageRequiredEmail: "ईमेल भरा.",
+				messageInvalidEmail: "वैध ईमेल भरा.",
+				messageRequiredPassword: "पासवर्ड भरा.",
+				messageRequiredPasswordConfirm: "पासवर्ड पुष्टी करा.",
+				messageRequiredField: "आवश्यक फील्ड भरा.",
+				messageAvailabilityFailed: "ईमेल तपासणी अयशस्वी.",
+				messageAvailabilityNotConfigured: "ईमेल तपासणी सेट नाही.",
+				messageAvailabilityRequired: "आधी ईमेल तपासा.",
+				messagePasswordMismatch: "पासवर्ड जुळत नाहीत.",
+				messageRequiredConsents: "आवश्यक संमती द्या.",
+				messageRegisterFailed: "नोंदणी अयशस्वी.",
+				messageRegisterNotConfigured: "नोंदणी सेट नाही.",
+			};
+		case "fr":
+			return {
+				stepEmail: "Email",
+				stepPassword: "Mot de passe",
+				stepProfile: "Profil",
+				stepAddress: "Adresse",
+				stepConsents: "Consentements",
+				stepAccount: "Compte",
+				stepProfileGroup: "Profil",
+				stepConsentsGroup: "Consentements",
+				subEmail: "Email",
+				subPassword: "Mot de passe",
+				subProfile: "Profil",
+				subAddress: "Adresse",
+				subConsents: "Consentements",
+				email: "Email",
+				emailPlaceholder: "nom@exemple.com",
+				emailAria: "Email",
+				password: "Mot de passe",
+				passwordAria: "Mot de passe",
+				passwordConfirm: "Confirmer le mot de passe",
+				passwordConfirmPlaceholder: "Repeter le mot de passe",
+				passwordConfirmAria: "Confirmer le mot de passe",
+				firstName: "Prenom",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Prenom",
+				lastName: "Nom",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Nom",
+				birthDate: "Date de naissance",
+				birthDateAria: "Date de naissance",
+				nationality: "Nationalite",
+				nationalityPlaceholder: "FR",
+				nationalityAria: "Nationalite",
+				street: "Rue",
+				streetPlaceholder: "Rue 1",
+				streetAria: "Rue",
+				zip: "Code postal",
+				zipPlaceholder: "12345",
+				zipAria: "Code postal",
+				city: "Ville",
+				cityPlaceholder: "Paris",
+				cityAria: "Ville",
+				country: "Pays",
+				countryPlaceholder: "FR",
+				countryAria: "Pays",
+				consentsTitle: "Consentements",
+				back: "Retour",
+				next: "Suivant",
+				register: "S'inscrire",
+				successTitle: "Inscription terminee",
+				messageChecking: "Verification de l'email...",
+				messageEmailAvailable: "Email disponible.",
+				messageEmailUnavailable: "Email deja utilise.",
+				messageRequiredEmail: "Veuillez saisir un email.",
+				messageInvalidEmail: "Veuillez saisir un email valide.",
+				messageRequiredPassword: "Veuillez saisir un mot de passe.",
+				messageRequiredPasswordConfirm: "Veuillez confirmer le mot de passe.",
+				messageRequiredField: "Veuillez remplir les champs obligatoires.",
+				messageAvailabilityFailed: "Verification echouee.",
+				messageAvailabilityNotConfigured: "Verification non configuree.",
+				messageAvailabilityRequired: "Veuillez verifier l'email d'abord.",
+				messagePasswordMismatch: "Les mots de passe ne correspondent pas.",
+				messageRequiredConsents: "Veuillez accepter les consentements requis.",
+				messageRegisterFailed: "Inscription echouee.",
+				messageRegisterNotConfigured: "Inscription non configuree.",
+			};
+		case "it":
+			return {
+				stepEmail: "Email",
+				stepPassword: "Password",
+				stepProfile: "Profilo",
+				stepAddress: "Indirizzo",
+				stepConsents: "Consensi",
+				stepAccount: "Account",
+				stepProfileGroup: "Profilo",
+				stepConsentsGroup: "Consensi",
+				subEmail: "Email",
+				subPassword: "Password",
+				subProfile: "Profilo",
+				subAddress: "Indirizzo",
+				subConsents: "Consensi",
+				email: "Email",
+				emailPlaceholder: "nome@esempio.com",
+				emailAria: "Email",
+				password: "Password",
+				passwordAria: "Password",
+				passwordConfirm: "Conferma password",
+				passwordConfirmPlaceholder: "Ripeti password",
+				passwordConfirmAria: "Conferma password",
+				firstName: "Nome",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Nome",
+				lastName: "Cognome",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Cognome",
+				birthDate: "Data di nascita",
+				birthDateAria: "Data di nascita",
+				nationality: "Nazionalita",
+				nationalityPlaceholder: "IT",
+				nationalityAria: "Nazionalita",
+				street: "Via",
+				streetPlaceholder: "Via 1",
+				streetAria: "Via",
+				zip: "CAP",
+				zipPlaceholder: "12345",
+				zipAria: "CAP",
+				city: "Citta",
+				cityPlaceholder: "Roma",
+				cityAria: "Citta",
+				country: "Paese",
+				countryPlaceholder: "IT",
+				countryAria: "Paese",
+				consentsTitle: "Consensi",
+				back: "Indietro",
+				next: "Avanti",
+				register: "Registrati",
+				successTitle: "Registrazione completata",
+				messageChecking: "Verifica email...",
+				messageEmailAvailable: "Email disponibile.",
+				messageEmailUnavailable: "Email gia usata.",
+				messageRequiredEmail: "Inserisci email.",
+				messageInvalidEmail: "Inserisci email valida.",
+				messageRequiredPassword: "Inserisci password.",
+				messageRequiredPasswordConfirm: "Conferma la password.",
+				messageRequiredField: "Compila i campi obbligatori.",
+				messageAvailabilityFailed: "Verifica fallita.",
+				messageAvailabilityNotConfigured: "Verifica non configurata.",
+				messageAvailabilityRequired: "Verifica prima l'email.",
+				messagePasswordMismatch: "Le password non corrispondono.",
+				messageRequiredConsents: "Accetta i consensi richiesti.",
+				messageRegisterFailed: "Registrazione fallita.",
+				messageRegisterNotConfigured: "Registrazione non configurata.",
+			};
+		case "nl":
+			return {
+				stepEmail: "Email",
+				stepPassword: "Wachtwoord",
+				stepProfile: "Profiel",
+				stepAddress: "Adres",
+				stepConsents: "Toestemmingen",
+				stepAccount: "Account",
+				stepProfileGroup: "Profiel",
+				stepConsentsGroup: "Toestemmingen",
+				subEmail: "Email",
+				subPassword: "Wachtwoord",
+				subProfile: "Profiel",
+				subAddress: "Adres",
+				subConsents: "Toestemmingen",
+				email: "Email",
+				emailPlaceholder: "naam@voorbeeld.com",
+				emailAria: "Email",
+				password: "Wachtwoord",
+				passwordAria: "Wachtwoord",
+				passwordConfirm: "Bevestig wachtwoord",
+				passwordConfirmPlaceholder: "Herhaal wachtwoord",
+				passwordConfirmAria: "Bevestig wachtwoord",
+				firstName: "Voornaam",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Voornaam",
+				lastName: "Achternaam",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Achternaam",
+				birthDate: "Geboortedatum",
+				birthDateAria: "Geboortedatum",
+				nationality: "Nationaliteit",
+				nationalityPlaceholder: "NL",
+				nationalityAria: "Nationaliteit",
+				street: "Straat",
+				streetPlaceholder: "Straat 1",
+				streetAria: "Straat",
+				zip: "Postcode",
+				zipPlaceholder: "12345",
+				zipAria: "Postcode",
+				city: "Stad",
+				cityPlaceholder: "Amsterdam",
+				cityAria: "Stad",
+				country: "Land",
+				countryPlaceholder: "NL",
+				countryAria: "Land",
+				consentsTitle: "Toestemmingen",
+				back: "Terug",
+				next: "Volgende",
+				register: "Registreren",
+				successTitle: "Registratie voltooid",
+				messageChecking: "Email controleren...",
+				messageEmailAvailable: "Email is beschikbaar.",
+				messageEmailUnavailable: "Email is al in gebruik.",
+				messageRequiredEmail: "Vul een email in.",
+				messageInvalidEmail: "Vul een geldig email in.",
+				messageRequiredPassword: "Vul een wachtwoord in.",
+				messageRequiredPasswordConfirm: "Bevestig het wachtwoord.",
+				messageRequiredField: "Vul de verplichte velden in.",
+				messageAvailabilityFailed: "Controle mislukt.",
+				messageAvailabilityNotConfigured: "Controle niet ingesteld.",
+				messageAvailabilityRequired: "Controleer eerst het emailadres.",
+				messagePasswordMismatch: "Wachtwoorden komen niet overeen.",
+				messageRequiredConsents: "Accepteer de verplichte toestemmingen.",
+				messageRegisterFailed: "Registratie mislukt.",
+				messageRegisterNotConfigured: "Registratie niet ingesteld.",
+			};
+		case "sv":
+			return {
+				stepEmail: "E-post",
+				stepPassword: "Losenord",
+				stepProfile: "Profil",
+				stepAddress: "Adress",
+				stepConsents: "Samtycken",
+				stepAccount: "Konto",
+				stepProfileGroup: "Profil",
+				stepConsentsGroup: "Samtycken",
+				subEmail: "E-post",
+				subPassword: "Losenord",
+				subProfile: "Profil",
+				subAddress: "Adress",
+				subConsents: "Samtycken",
+				email: "E-post",
+				emailPlaceholder: "namn@exempel.se",
+				emailAria: "E-post",
+				password: "Losenord",
+				passwordAria: "Losenord",
+				passwordConfirm: "Bekrafta losenord",
+				passwordConfirmPlaceholder: "Upprepa losenord",
+				passwordConfirmAria: "Bekrafta losenord",
+				firstName: "Fornamn",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Fornamn",
+				lastName: "Efternamn",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Efternamn",
+				birthDate: "Fodelsedatum",
+				birthDateAria: "Fodelsedatum",
+				nationality: "Nationalitet",
+				nationalityPlaceholder: "SE",
+				nationalityAria: "Nationalitet",
+				street: "Gata",
+				streetPlaceholder: "Gata 1",
+				streetAria: "Gata",
+				zip: "Postnummer",
+				zipPlaceholder: "12345",
+				zipAria: "Postnummer",
+				city: "Stad",
+				cityPlaceholder: "Stockholm",
+				cityAria: "Stad",
+				country: "Land",
+				countryPlaceholder: "SE",
+				countryAria: "Land",
+				consentsTitle: "Samtycken",
+				back: "Tillbaka",
+				next: "Nasta",
+				register: "Registrera",
+				successTitle: "Registrering klar",
+				messageChecking: "Kontrollerar e-post...",
+				messageEmailAvailable: "E-post ar tillganglig.",
+				messageEmailUnavailable: "E-post ar redan upptagen.",
+				messageRequiredEmail: "Ange e-post.",
+				messageInvalidEmail: "Ange giltig e-post.",
+				messageRequiredPassword: "Ange losenord.",
+				messageRequiredPasswordConfirm: "Bekrafta losenord.",
+				messageRequiredField: "Fyll i obligatoriska fält.",
+				messageAvailabilityFailed: "Kontroll misslyckades.",
+				messageAvailabilityNotConfigured: "Kontroll ej konfigurerad.",
+				messageAvailabilityRequired: "Kontrollera e-post forst.",
+				messagePasswordMismatch: "Losenorden matchar inte.",
+				messageRequiredConsents: "Godkann obligatoriska samtycken.",
+				messageRegisterFailed: "Registrering misslyckades.",
+				messageRegisterNotConfigured: "Registrering ej konfigurerad.",
+			};
+		case "pl":
+			return {
+				stepEmail: "Email",
+				stepPassword: "Haslo",
+				stepProfile: "Profil",
+				stepAddress: "Adres",
+				stepConsents: "Zgody",
+				stepAccount: "Konto",
+				stepProfileGroup: "Profil",
+				stepConsentsGroup: "Zgody",
+				subEmail: "Email",
+				subPassword: "Haslo",
+				subProfile: "Profil",
+				subAddress: "Adres",
+				subConsents: "Zgody",
+				email: "Email",
+				emailPlaceholder: "name@example.com",
+				emailAria: "Email",
+				password: "Haslo",
+				passwordAria: "Haslo",
+				passwordConfirm: "Potwierdz haslo",
+				passwordConfirmPlaceholder: "Powtorz haslo",
+				passwordConfirmAria: "Potwierdz haslo",
+				firstName: "Imie",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Imie",
+				lastName: "Nazwisko",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Nazwisko",
+				birthDate: "Data urodzenia",
+				birthDateAria: "Data urodzenia",
+				nationality: "Narodowosc",
+				nationalityPlaceholder: "PL",
+				nationalityAria: "Narodowosc",
+				street: "Ulica",
+				streetPlaceholder: "Ulica 1",
+				streetAria: "Ulica",
+				zip: "Kod pocztowy",
+				zipPlaceholder: "12345",
+				zipAria: "Kod pocztowy",
+				city: "Miasto",
+				cityPlaceholder: "Warszawa",
+				cityAria: "Miasto",
+				country: "Kraj",
+				countryPlaceholder: "PL",
+				countryAria: "Kraj",
+				consentsTitle: "Zgody",
+				back: "Wstecz",
+				next: "Dalej",
+				register: "Rejestracja",
+				successTitle: "Rejestracja zakonczona",
+				messageChecking: "Sprawdzanie email...",
+				messageEmailAvailable: "Email dostepny.",
+				messageEmailUnavailable: "Email zajety.",
+				messageRequiredEmail: "Wpisz email.",
+				messageInvalidEmail: "Wpisz poprawny email.",
+				messageRequiredPassword: "Wpisz haslo.",
+				messageRequiredPasswordConfirm: "Potwierdz haslo.",
+				messageRequiredField: "Wypelnij wymagane pola.",
+				messageAvailabilityFailed: "Sprawdzenie nie powiodlo sie.",
+				messageAvailabilityNotConfigured: "Sprawdzenie nie skonfigurowane.",
+				messageAvailabilityRequired: "Najpierw sprawdz email.",
+				messagePasswordMismatch: "Hasla nie sa zgodne.",
+				messageRequiredConsents: "Zaakceptuj wymagane zgody.",
+				messageRegisterFailed: "Rejestracja nieudana.",
+				messageRegisterNotConfigured: "Rejestracja nie skonfigurowana.",
+			};
+		case "da":
+			return {
+				stepEmail: "Email",
+				stepPassword: "Adgangskode",
+				stepProfile: "Profil",
+				stepAddress: "Adresse",
+				stepConsents: "Samtykker",
+				stepAccount: "Konto",
+				stepProfileGroup: "Profil",
+				stepConsentsGroup: "Samtykker",
+				subEmail: "Email",
+				subPassword: "Adgangskode",
+				subProfile: "Profil",
+				subAddress: "Adresse",
+				subConsents: "Samtykker",
+				email: "Email",
+				emailPlaceholder: "navn@example.com",
+				emailAria: "Email",
+				password: "Adgangskode",
+				passwordAria: "Adgangskode",
+				passwordConfirm: "Bekraeft adgangskode",
+				passwordConfirmPlaceholder: "Gentag adgangskode",
+				passwordConfirmAria: "Bekraeft adgangskode",
+				firstName: "Fornavn",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Fornavn",
+				lastName: "Efternavn",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Efternavn",
+				birthDate: "Foedselsdato",
+				birthDateAria: "Foedselsdato",
+				nationality: "Nationalitet",
+				nationalityPlaceholder: "DK",
+				nationalityAria: "Nationalitet",
+				street: "Gade",
+				streetPlaceholder: "Gade 1",
+				streetAria: "Gade",
+				zip: "Postnummer",
+				zipPlaceholder: "12345",
+				zipAria: "Postnummer",
+				city: "By",
+				cityPlaceholder: "Kobenhavn",
+				cityAria: "By",
+				country: "Land",
+				countryPlaceholder: "DK",
+				countryAria: "Land",
+				consentsTitle: "Samtykker",
+				back: "Tilbage",
+				next: "Naeste",
+				register: "Registrer",
+				successTitle: "Registrering gennemfort",
+				messageChecking: "Tjekker email...",
+				messageEmailAvailable: "Email er tilgaengelig.",
+				messageEmailUnavailable: "Email er allerede i brug.",
+				messageRequiredEmail: "Indtast email.",
+				messageInvalidEmail: "Indtast gyldig email.",
+				messageRequiredPassword: "Indtast adgangskode.",
+				messageRequiredPasswordConfirm: "Bekraeft adgangskode.",
+				messageRequiredField: "Udfyld paakraevet felter.",
+				messageAvailabilityFailed: "Tjek mislykkedes.",
+				messageAvailabilityNotConfigured: "Tjek ikke konfigureret.",
+				messageAvailabilityRequired: "Tjek email foerst.",
+				messagePasswordMismatch: "Adgangskoder matcher ikke.",
+				messageRequiredConsents: "Accepter obligatoriske samtykker.",
+				messageRegisterFailed: "Registrering mislykkedes.",
+				messageRegisterNotConfigured: "Registrering ikke konfigureret.",
+			};
+		case "no":
+			return {
+				stepEmail: "E-post",
+				stepPassword: "Passord",
+				stepProfile: "Profil",
+				stepAddress: "Adresse",
+				stepConsents: "Samtykker",
+				stepAccount: "Konto",
+				stepProfileGroup: "Profil",
+				stepConsentsGroup: "Samtykker",
+				subEmail: "E-post",
+				subPassword: "Passord",
+				subProfile: "Profil",
+				subAddress: "Adresse",
+				subConsents: "Samtykker",
+				email: "E-post",
+				emailPlaceholder: "navn@example.com",
+				emailAria: "E-post",
+				password: "Passord",
+				passwordAria: "Passord",
+				passwordConfirm: "Bekreft passord",
+				passwordConfirmPlaceholder: "Gjenta passord",
+				passwordConfirmAria: "Bekreft passord",
+				firstName: "Fornavn",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Fornavn",
+				lastName: "Etternavn",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Etternavn",
+				birthDate: "Fodselsdato",
+				birthDateAria: "Fodselsdato",
+				nationality: "Nasjonalitet",
+				nationalityPlaceholder: "NO",
+				nationalityAria: "Nasjonalitet",
+				street: "Gate",
+				streetPlaceholder: "Gate 1",
+				streetAria: "Gate",
+				zip: "Postnummer",
+				zipPlaceholder: "12345",
+				zipAria: "Postnummer",
+				city: "By",
+				cityPlaceholder: "Oslo",
+				cityAria: "By",
+				country: "Land",
+				countryPlaceholder: "NO",
+				countryAria: "Land",
+				consentsTitle: "Samtykker",
+				back: "Tilbake",
+				next: "Neste",
+				register: "Registrer",
+				successTitle: "Registrering fullfort",
+				messageChecking: "Sjekker e-post...",
+				messageEmailAvailable: "E-post er tilgjengelig.",
+				messageEmailUnavailable: "E-post er allerede i bruk.",
+				messageRequiredEmail: "Skriv inn e-post.",
+				messageInvalidEmail: "Skriv inn gyldig e-post.",
+				messageRequiredPassword: "Skriv inn passord.",
+				messageRequiredPasswordConfirm: "Bekreft passord.",
+				messageRequiredField: "Fyll ut obligatoriske felter.",
+				messageAvailabilityFailed: "Sjekk feilet.",
+				messageAvailabilityNotConfigured: "Sjekk ikke konfigurert.",
+				messageAvailabilityRequired: "Sjekk e-post først.",
+				messagePasswordMismatch: "Passord stemmer ikke.",
+				messageRequiredConsents: "Godta obligatoriske samtykker.",
+				messageRegisterFailed: "Registrering feilet.",
+				messageRegisterNotConfigured: "Registrering ikke konfigurert.",
+			};
+		case "fi":
+			return {
+				stepEmail: "Sahkoposti",
+				stepPassword: "Salasana",
+				stepProfile: "Profiili",
+				stepAddress: "Osoite",
+				stepConsents: "Suostumukset",
+				stepAccount: "Tili",
+				stepProfileGroup: "Profiili",
+				stepConsentsGroup: "Suostumukset",
+				subEmail: "Sahkoposti",
+				subPassword: "Salasana",
+				subProfile: "Profiili",
+				subAddress: "Osoite",
+				subConsents: "Suostumukset",
+				email: "Sahkoposti",
+				emailPlaceholder: "nimi@example.com",
+				emailAria: "Sahkoposti",
+				password: "Salasana",
+				passwordAria: "Salasana",
+				passwordConfirm: "Vahvista salasana",
+				passwordConfirmPlaceholder: "Toista salasana",
+				passwordConfirmAria: "Vahvista salasana",
+				firstName: "Etunimi",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Etunimi",
+				lastName: "Sukunimi",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Sukunimi",
+				birthDate: "Syntymaaika",
+				birthDateAria: "Syntymaaika",
+				nationality: "Kansallisuus",
+				nationalityPlaceholder: "FI",
+				nationalityAria: "Kansallisuus",
+				street: "Katu",
+				streetPlaceholder: "Katu 1",
+				streetAria: "Katu",
+				zip: "Postinumero",
+				zipPlaceholder: "12345",
+				zipAria: "Postinumero",
+				city: "Kaupunki",
+				cityPlaceholder: "Helsinki",
+				cityAria: "Kaupunki",
+				country: "Maa",
+				countryPlaceholder: "FI",
+				countryAria: "Maa",
+				consentsTitle: "Suostumukset",
+				back: "Takaisin",
+				next: "Seuraava",
+				register: "Rekisteroidy",
+				successTitle: "Rekisterointi valmis",
+				messageChecking: "Tarkistetaan sahkoposti...",
+				messageEmailAvailable: "Sahkoposti on saatavilla.",
+				messageEmailUnavailable: "Sahkoposti on jo kaytossa.",
+				messageRequiredEmail: "Syota sahkoposti.",
+				messageInvalidEmail: "Syota kelvollinen sahkoposti.",
+				messageRequiredPassword: "Syota salasana.",
+				messageRequiredPasswordConfirm: "Vahvista salasana.",
+				messageRequiredField: "Tayta pakolliset kentat.",
+				messageAvailabilityFailed: "Tarkistus epaaonnistui.",
+				messageAvailabilityNotConfigured: "Tarkistus ei ole maaritetty.",
+				messageAvailabilityRequired: "Tarkista sahkoposti ensin.",
+				messagePasswordMismatch: "Salasanat eivat tasmää.",
+				messageRequiredConsents: "Hyvaksy pakolliset suostumukset.",
+				messageRegisterFailed: "Rekisterointi epaonnistui.",
+				messageRegisterNotConfigured: "Rekisterointi ei ole maaritetty.",
+			};
+		case "cs":
+			return {
+				stepEmail: "Email",
+				stepPassword: "Heslo",
+				stepProfile: "Profil",
+				stepAddress: "Adresa",
+				stepConsents: "Souhlasy",
+				stepAccount: "Ucet",
+				stepProfileGroup: "Profil",
+				stepConsentsGroup: "Souhlasy",
+				subEmail: "Email",
+				subPassword: "Heslo",
+				subProfile: "Profil",
+				subAddress: "Adresa",
+				subConsents: "Souhlasy",
+				email: "Email",
+				emailPlaceholder: "name@example.com",
+				emailAria: "Email",
+				password: "Heslo",
+				passwordAria: "Heslo",
+				passwordConfirm: "Potvrdit heslo",
+				passwordConfirmPlaceholder: "Zopakujte heslo",
+				passwordConfirmAria: "Potvrdit heslo",
+				firstName: "Jmeno",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "Jmeno",
+				lastName: "Prijmeni",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Prijmeni",
+				birthDate: "Datum narozeni",
+				birthDateAria: "Datum narozeni",
+				nationality: "Narodnost",
+				nationalityPlaceholder: "CZ",
+				nationalityAria: "Narodnost",
+				street: "Ulice",
+				streetPlaceholder: "Ulice 1",
+				streetAria: "Ulice",
+				zip: "PSC",
+				zipPlaceholder: "12345",
+				zipAria: "PSC",
+				city: "Mesto",
+				cityPlaceholder: "Praha",
+				cityAria: "Mesto",
+				country: "Zeme",
+				countryPlaceholder: "CZ",
+				countryAria: "Zeme",
+				consentsTitle: "Souhlasy",
+				back: "Zpet",
+				next: "Dal",
+				register: "Registrovat",
+				successTitle: "Registrace dokoncena",
+				messageChecking: "Overovani emailu...",
+				messageEmailAvailable: "Email je dostupny.",
+				messageEmailUnavailable: "Email je obsazeny.",
+				messageRequiredEmail: "Zadejte email.",
+				messageInvalidEmail: "Zadejte platny email.",
+				messageRequiredPassword: "Zadejte heslo.",
+				messageRequiredPasswordConfirm: "Potvrdte heslo.",
+				messageRequiredField: "Vyplnte povinna pole.",
+				messageAvailabilityFailed: "Overeni selhalo.",
+				messageAvailabilityNotConfigured: "Overeni neni nastaveno.",
+				messageAvailabilityRequired: "Nejprve overte email.",
+				messagePasswordMismatch: "Hesla se neshoduji.",
+				messageRequiredConsents: "Potvrdte povinne souhlasy.",
+				messageRegisterFailed: "Registrace selhala.",
+				messageRegisterNotConfigured: "Registrace neni nastavena.",
+			};
+		default:
+			return {
+				stepEmail: "Email",
+				stepPassword: "Password",
+				stepProfile: "Profile",
+				stepAddress: "Address",
+				stepConsents: "Consents",
+				stepAccount: "Account",
+				stepProfileGroup: "Profile",
+				stepConsentsGroup: "Consents",
+				subEmail: "Email",
+				subPassword: "Password",
+				subProfile: "Profile",
+				subAddress: "Address",
+				subConsents: "Consents",
+				email: "Email",
+				emailPlaceholder: "name@example.com",
+				emailAria: "Email",
+				password: "Password",
+				passwordAria: "Password",
+				passwordConfirm: "Confirm password",
+				passwordConfirmPlaceholder: "Repeat password",
+				passwordConfirmAria: "Confirm password",
+				firstName: "First name",
+				firstNamePlaceholder: "Max",
+				firstNameAria: "First name",
+				lastName: "Last name",
+				lastNamePlaceholder: "Mustermann",
+				lastNameAria: "Last name",
+				birthDate: "Birth date",
+				birthDateAria: "Birth date",
+				nationality: "Nationality",
+				nationalityPlaceholder: "DE",
+				nationalityAria: "Nationality",
+				street: "Street",
+				streetPlaceholder: "Street 1",
+				streetAria: "Street",
+				zip: "ZIP",
+				zipPlaceholder: "12345",
+				zipAria: "ZIP",
+				city: "City",
+				cityPlaceholder: "Berlin",
+				cityAria: "City",
+				country: "Country",
+				countryPlaceholder: "DE",
+				countryAria: "Country",
+				consentsTitle: "Consents",
+				back: "Back",
+				next: "Next",
+				register: "Register",
+				successTitle: "Registration completed",
+				messageChecking: "Checking email...",
+				messageEmailAvailable: "Email is available.",
+				messageEmailUnavailable: "Email is already in use.",
+				messageRequiredEmail: "Please enter an email.",
+				messageInvalidEmail: "Please enter a valid email.",
+				messageRequiredPassword: "Please enter a password.",
+				messageRequiredPasswordConfirm: "Please confirm the password.",
+				messageRequiredField: "Please fill all required fields.",
+				messageAvailabilityFailed: "Availability check failed.",
+				messageAvailabilityNotConfigured: "Availability check not configured.",
+				messageAvailabilityRequired: "Please check email first.",
+				messagePasswordMismatch: "Passwords do not match.",
+				messageRequiredConsents: "Please accept required consents.",
+				messageRegisterFailed: "Registration failed.",
+				messageRegisterNotConfigured: "Registration not configured.",
+			};
+	}
+}
+
+registerCustomElement(RegisterWizard);