@thunderid/react 0.1.0 → 0.2.0

package/dist/components/adapters/ImageComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageComponent.js","names":["ImageComponent: FC<AdapterProps>","useTheme","config: Record<string, unknown>","src: string","alt: string","width: string","height: string","variant: string","imageStyle: CSSProperties","cssWidth: string","cssHeight: string","containerHeight: string"],"sources":["../../../src/components/adapters/ImageComponent.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {extractEmojiFromUri, isEmojiUri} from '@thunderid/browser';\nimport {CSSProperties, FC, SyntheticEvent} from 'react';\nimport useTheme from '../../contexts/Theme/useTheme';\nimport {AdapterProps} from '../../models/adapters';\n\nconst DEFAULT_EMOJI_CONTAINER_HEIGHT = '4em';\n\n/**\n * Image component for sign-up forms.\n */\nconst ImageComponent: FC<AdapterProps> = ({component}: AdapterProps) => {\n  const {theme} = useTheme();\n  const config: Record<string, unknown> = component.config || {};\n  const src: string = (config['src'] as string) || '';\n  const alt: string = (config['alt'] as string) || (config['label'] as string) || 'Image';\n  const width: string = (config['width'] as string) || '100%';\n  const height: string = (config['height'] as string) || 'auto';\n  const variant: string = component.variant?.toLowerCase() || 'image_block';\n\n  const imageStyle: CSSProperties = {\n    borderRadius: theme.vars.borderRadius.small,\n    display: 'block',\n    margin: variant === 'image_block' ? '1rem auto' : '0',\n  };\n\n  if (!src) {\n    return null;\n  }\n\n  if (isEmojiUri(src)) {\n    // Bare numbers (e.g. \"48\") are valid for <img> width/height attributes but\n    // are unit-less and ignored as CSS properties — normalize them to px.\n    const toCSSLength = (value: string): string => (/^\\d+(\\.\\d+)?$/.test(value) ? `${value}px` : value);\n    const cssWidth: string = toCSSLength(width);\n    const cssHeight: string = toCSSLength(height);\n\n    // container-type: size needs a concrete block dimension — percentage and\n    // 'auto' values both collapse to 0 when the parent has no defined height.\n    // Priority: explicit height → explicit width (square) → fallback constant.\n    const isConcrete = (v: string): boolean => v !== 'auto' && !v.endsWith('%');\n    let containerHeight: string;\n    if (isConcrete(cssHeight)) {\n      containerHeight = cssHeight;\n    } else if (isConcrete(cssWidth)) {\n      containerHeight = cssWidth;\n    } else {\n      containerHeight = DEFAULT_EMOJI_CONTAINER_HEIGHT;\n    }\n\n    return (\n      <div key={component.id} style={{textAlign: 'center'}}>\n        {/*\n         * container-type: size lets the inner span use cqmin (= min(cqw, cqh))\n         * so the emoji font-size tracks the rendered container dimensions\n         * rather than the parent's font-size.\n         */}\n        <span\n          style={{\n            ...imageStyle,\n            containerType: 'size',\n            display: 'inline-grid',\n            height: containerHeight,\n            placeItems: 'center',\n            width: cssWidth,\n          }}\n        >\n          <span aria-label={alt} role=\"img\" style={{fontSize: '100cqmin', lineHeight: 1}}>\n            {extractEmojiFromUri(src)}\n          </span>\n        </span>\n      </div>\n    );\n  }\n\n  return (\n    <div key={component.id} style={{textAlign: 'center'}}>\n      <img\n        src={src}\n        alt={alt}\n        height={height}\n        width={width}\n        style={imageStyle}\n        onError={(e: SyntheticEvent<HTMLImageElement>): void => {\n          // Hide broken images\n          e.currentTarget.style.display = 'none';\n        }}\n      />\n    </div>\n  );\n};\n\nexport default ImageComponent;\n"],"mappings":";;;;;AAuBA,MAAM,iCAAiC;;;;AAKvC,MAAMA,kBAAoC,EAAC,gBAA6B;CACtE,MAAM,EAAC,UAASC,kBAAU;CAC1B,MAAMC,SAAkC,UAAU,UAAU,EAAE;CAC9D,MAAMC,MAAe,OAAO,UAAqB;CACjD,MAAMC,MAAe,OAAO,UAAsB,OAAO,YAAuB;CAChF,MAAMC,QAAiB,OAAO,YAAuB;CACrD,MAAMC,SAAkB,OAAO,aAAwB;CACvD,MAAMC,UAAkB,UAAU,SAAS,aAAa,IAAI;CAE5D,MAAMC,aAA4B;EAChC,cAAc,MAAM,KAAK,aAAa;EACtC,SAAS;EACT,QAAQ,YAAY,gBAAgB,cAAc;EACnD;AAED,KAAI,CAAC,IACH,QAAO;AAGT,KAAI,WAAW,IAAI,EAAE;EAGnB,MAAM,eAAe,UAA2B,gBAAgB,KAAK,MAAM,GAAG,GAAG,MAAM,MAAM;EAC7F,MAAMC,WAAmB,YAAY,MAAM;EAC3C,MAAMC,YAAoB,YAAY,OAAO;EAK7C,MAAM,cAAc,MAAuB,MAAM,UAAU,CAAC,EAAE,SAAS,IAAI;EAC3E,IAAIC;AACJ,MAAI,WAAW,UAAU,CACvB,mBAAkB;WACT,WAAW,SAAS,CAC7B,mBAAkB;MAElB,mBAAkB;AAGpB,SACE,oBAAC;GAAuB,OAAO,EAAC,WAAW,UAAS;aAMlD,oBAAC;IACC,OAAO;KACL,GAAG;KACH,eAAe;KACf,SAAS;KACT,QAAQ;KACR,YAAY;KACZ,OAAO;KACR;cAED,oBAAC;KAAK,cAAY;KAAK,MAAK;KAAM,OAAO;MAAC,UAAU;MAAY,YAAY;MAAE;eAC3E,oBAAoB,IAAI;MACpB;KACF;KAnBC,UAAU,GAoBd;;AAIV,QACE,oBAAC;EAAuB,OAAO,EAAC,WAAW,UAAS;YAClD,oBAAC;GACM;GACA;GACG;GACD;GACP,OAAO;GACP,UAAU,MAA8C;AAEtD,MAAE,cAAc,MAAM,UAAU;;IAElC;IAXM,UAAU,GAYd;;AAIV,6BAAe"}

package/dist/components/adapters/LinkedInButton.js

@@ -0,0 +1,36 @@
+import useTranslation_default from "../../hooks/useTranslation.js";
+import Button_default from "../primitives/Button/Button.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/adapters/LinkedInButton.tsx
+/**
+* LinkedIn Sign-In Button Component.
+* Handles authentication with LinkedIn identity provider.
+*/
+const LinkedInButton = ({ isLoading, preferences, children,...rest }) => {
+	const { t } = useTranslation_default(preferences?.i18n);
+	return /* @__PURE__ */ jsx(Button_default, {
+		...rest,
+		fullWidth: true,
+		type: "button",
+		color: "secondary",
+		variant: "solid",
+		disabled: isLoading,
+		startIcon: /* @__PURE__ */ jsx("svg", {
+			width: "18",
+			height: "18",
+			viewBox: "0 0 24 24",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: /* @__PURE__ */ jsx("path", {
+				fill: "#0077B5",
+				d: "M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"
+			})
+		}),
+		children: children ?? t("elements.buttons.linkedin.text")
+	});
+};
+var LinkedInButton_default = LinkedInButton;
+
+//#endregion
+export { LinkedInButton_default as default };
+//# sourceMappingURL=LinkedInButton.js.map

package/dist/components/adapters/LinkedInButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkedInButton.js","names":["LinkedInButton: FC<LinkedInButtonProps & HTMLAttributes<HTMLButtonElement>>","useTranslation","Button"],"sources":["../../../src/components/adapters/LinkedInButton.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {WithPreferences} from '@thunderid/browser';\nimport {FC, HTMLAttributes} from 'react';\nimport useTranslation from '../../hooks/useTranslation';\nimport Button from '../primitives/Button/Button';\n\nexport interface LinkedInButtonProps extends WithPreferences {\n  /**\n   * Whether the component is in loading state.\n   */\n  isLoading?: boolean;\n}\n\n/**\n * LinkedIn Sign-In Button Component.\n * Handles authentication with LinkedIn identity provider.\n */\nconst LinkedInButton: FC<LinkedInButtonProps & HTMLAttributes<HTMLButtonElement>> = ({\n  isLoading,\n  preferences,\n  children,\n  ...rest\n}: LinkedInButtonProps & HTMLAttributes<HTMLButtonElement>) => {\n  const {t} = useTranslation(preferences?.i18n);\n\n  return (\n    <Button\n      {...rest}\n      fullWidth\n      type=\"button\"\n      color=\"secondary\"\n      variant=\"solid\"\n      disabled={isLoading}\n      startIcon={\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            fill=\"#0077B5\"\n            d=\"M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z\"\n          />\n        </svg>\n      }\n    >\n      {children ?? t('elements.buttons.linkedin.text')}\n    </Button>\n  );\n};\n\nexport default LinkedInButton;\n"],"mappings":";;;;;;;;;AAkCA,MAAMA,kBAA+E,EACnF,WACA,aACA,SACA,GAAG,WAC0D;CAC7D,MAAM,EAAC,MAAKC,uBAAe,aAAa,KAAK;AAE7C,QACE,oBAACC;EACC,GAAI;EACJ;EACA,MAAK;EACL,OAAM;EACN,SAAQ;EACR,UAAU;EACV,WACE,oBAAC;GAAI,OAAM;GAAK,QAAO;GAAK,SAAQ;GAAY,OAAM;aACpD,oBAAC;IACC,MAAK;IACL,GAAE;KACF;IACE;YAGP,YAAY,EAAE,iCAAiC;GACzC;;AAIb,6BAAe"}

package/dist/components/adapters/MicrosoftButton.js

@@ -0,0 +1,54 @@
+import useTranslation_default from "../../hooks/useTranslation.js";
+import Button_default from "../primitives/Button/Button.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/adapters/MicrosoftButton.tsx
+/**
+* Microsoft Sign-In Button Component.
+* Handles authentication with Microsoft identity provider.
+*/
+const MicrosoftButton = ({ isLoading, preferences, children,...rest }) => {
+	const { t } = useTranslation_default(preferences?.i18n);
+	return /* @__PURE__ */ jsx(Button_default, {
+		...rest,
+		fullWidth: true,
+		type: "button",
+		color: "secondary",
+		variant: "solid",
+		disabled: isLoading,
+		startIcon: /* @__PURE__ */ jsxs("svg", {
+			width: "14",
+			height: "14",
+			viewBox: "0 0 23 23",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: [
+				/* @__PURE__ */ jsx("path", {
+					fill: "#f3f3f3",
+					d: "M0 0h23v23H0z"
+				}),
+				/* @__PURE__ */ jsx("path", {
+					fill: "#f35325",
+					d: "M1 1h10v10H1z"
+				}),
+				/* @__PURE__ */ jsx("path", {
+					fill: "#81bc06",
+					d: "M12 1h10v10H12z"
+				}),
+				/* @__PURE__ */ jsx("path", {
+					fill: "#05a6f0",
+					d: "M1 12h10v10H1z"
+				}),
+				/* @__PURE__ */ jsx("path", {
+					fill: "#ffba08",
+					d: "M12 12h10v10H12z"
+				})
+			]
+		}),
+		children: children ?? t("elements.buttons.microsoft.text")
+	});
+};
+var MicrosoftButton_default = MicrosoftButton;
+
+//#endregion
+export { MicrosoftButton_default as default };
+//# sourceMappingURL=MicrosoftButton.js.map

package/dist/components/adapters/MicrosoftButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MicrosoftButton.js","names":["MicrosoftButton: FC<MicrosoftButtonProps & HTMLAttributes<HTMLButtonElement>>","useTranslation","Button"],"sources":["../../../src/components/adapters/MicrosoftButton.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {WithPreferences} from '@thunderid/browser';\nimport {FC, HTMLAttributes} from 'react';\nimport useTranslation from '../../hooks/useTranslation';\nimport Button from '../primitives/Button/Button';\n\nexport interface MicrosoftButtonProps extends WithPreferences {\n  /**\n   * Whether the component is in loading state.\n   */\n  isLoading?: boolean;\n}\n\n/**\n * Microsoft Sign-In Button Component.\n * Handles authentication with Microsoft identity provider.\n */\nconst MicrosoftButton: FC<MicrosoftButtonProps & HTMLAttributes<HTMLButtonElement>> = ({\n  isLoading,\n  preferences,\n  children,\n  ...rest\n}: MicrosoftButtonProps & HTMLAttributes<HTMLButtonElement>) => {\n  const {t} = useTranslation(preferences?.i18n);\n\n  return (\n    <Button\n      {...rest}\n      fullWidth\n      type=\"button\"\n      color=\"secondary\"\n      variant=\"solid\"\n      disabled={isLoading}\n      startIcon={\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 23 23\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path fill=\"#f3f3f3\" d=\"M0 0h23v23H0z\" />\n          <path fill=\"#f35325\" d=\"M1 1h10v10H1z\" />\n          <path fill=\"#81bc06\" d=\"M12 1h10v10H12z\" />\n          <path fill=\"#05a6f0\" d=\"M1 12h10v10H1z\" />\n          <path fill=\"#ffba08\" d=\"M12 12h10v10H12z\" />\n        </svg>\n      }\n    >\n      {children ?? t('elements.buttons.microsoft.text')}\n    </Button>\n  );\n};\n\nexport default MicrosoftButton;\n"],"mappings":";;;;;;;;;AAkCA,MAAMA,mBAAiF,EACrF,WACA,aACA,SACA,GAAG,WAC2D;CAC9D,MAAM,EAAC,MAAKC,uBAAe,aAAa,KAAK;AAE7C,QACE,oBAACC;EACC,GAAI;EACJ;EACA,MAAK;EACL,OAAM;EACN,SAAQ;EACR,UAAU;EACV,WACE,qBAAC;GAAI,OAAM;GAAK,QAAO;GAAK,SAAQ;GAAY,OAAM;;IACpD,oBAAC;KAAK,MAAK;KAAU,GAAE;MAAkB;IACzC,oBAAC;KAAK,MAAK;KAAU,GAAE;MAAkB;IACzC,oBAAC;KAAK,MAAK;KAAU,GAAE;MAAoB;IAC3C,oBAAC;KAAK,MAAK;KAAU,GAAE;MAAmB;IAC1C,oBAAC;KAAK,MAAK;KAAU,GAAE;MAAqB;;IACxC;YAGP,YAAY,EAAE,kCAAkC;GAC1C;;AAIb,8BAAe"}

package/dist/components/adapters/NumberInput.js

@@ -0,0 +1,28 @@
+import { createField } from "../factories/FieldFactory.js";
+import { FieldType } from "@thunderid/browser";
+
+//#region src/components/adapters/NumberInput.tsx
+/**
+* Number input component for sign-up forms.
+*/
+const NumberInput = ({ component, formValues, touchedFields, formErrors, onInputChange, inputClassName }) => {
+	const config = component.config || {};
+	const fieldName = config["identifier"] || config["name"] || component.id;
+	const value = formValues[fieldName] || "";
+	return createField({
+		className: inputClassName,
+		error: touchedFields[fieldName] ? formErrors[fieldName] : void 0,
+		label: config["label"] || "",
+		name: fieldName,
+		onChange: (newValue) => onInputChange(fieldName, newValue),
+		placeholder: config["placeholder"] || "",
+		required: config["required"] || false,
+		type: FieldType.Number,
+		value
+	});
+};
+var NumberInput_default = NumberInput;
+
+//#endregion
+export { NumberInput_default as default };
+//# sourceMappingURL=NumberInput.js.map

package/dist/components/adapters/NumberInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.js","names":["NumberInput: FC<AdapterProps>","config: Record<string, unknown>","fieldName: string","value: string"],"sources":["../../../src/components/adapters/NumberInput.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {FieldType} from '@thunderid/browser';\nimport {FC} from 'react';\nimport {AdapterProps} from '../../models/adapters';\nimport {createField} from '../factories/FieldFactory';\n\n/**\n * Number input component for sign-up forms.\n */\nconst NumberInput: FC<AdapterProps> = ({\n  component,\n  formValues,\n  touchedFields,\n  formErrors,\n  onInputChange,\n  inputClassName,\n}: AdapterProps) => {\n  const config: Record<string, unknown> = component.config || {};\n  const fieldName: string = (config['identifier'] as string) || (config['name'] as string) || component.id;\n  const value: string = formValues[fieldName] || '';\n  const error: string | undefined = touchedFields[fieldName] ? formErrors[fieldName] : undefined;\n\n  return createField({\n    className: inputClassName,\n    error,\n    label: (config['label'] as string) || '',\n    name: fieldName,\n    onChange: (newValue: string) => onInputChange(fieldName, newValue),\n    placeholder: (config['placeholder'] as string) || '',\n    required: (config['required'] as boolean) || false,\n    type: FieldType.Number,\n    value,\n  });\n};\n\nexport default NumberInput;\n"],"mappings":";;;;;;;AA0BA,MAAMA,eAAiC,EACrC,WACA,YACA,eACA,YACA,eACA,qBACkB;CAClB,MAAMC,SAAkC,UAAU,UAAU,EAAE;CAC9D,MAAMC,YAAqB,OAAO,iBAA6B,OAAO,WAAsB,UAAU;CACtG,MAAMC,QAAgB,WAAW,cAAc;AAG/C,QAAO,YAAY;EACjB,WAAW;EACX,OAJgC,cAAc,aAAa,WAAW,aAAa;EAKnF,OAAQ,OAAO,YAAuB;EACtC,MAAM;EACN,WAAW,aAAqB,cAAc,WAAW,SAAS;EAClE,aAAc,OAAO,kBAA6B;EAClD,UAAW,OAAO,eAA2B;EAC7C,MAAM,UAAU;EAChB;EACD,CAAC;;AAGJ,0BAAe"}

package/dist/components/adapters/PasswordInput.js

@@ -0,0 +1,50 @@
+import { createField } from "../factories/FieldFactory.js";
+import { FieldType } from "@thunderid/browser";
+
+//#region src/components/adapters/PasswordInput.tsx
+/**
+* Password input component for sign-up forms.
+*/
+const PasswordInput = ({ component, formValues, touchedFields, formErrors, onInputChange, inputClassName }) => {
+	const config = component.config || {};
+	const fieldName = config["identifier"] || config["name"] || component.id;
+	const value = formValues[fieldName] || "";
+	const error = touchedFields[fieldName] ? formErrors[fieldName] : void 0;
+	const validations = config["validations"] || [];
+	const validationHints = [];
+	validations.forEach((validation) => {
+		if (validation.name === "LengthValidator") {
+			const minLength = validation.conditions?.find((c) => c.key === "min.length")?.value;
+			const maxLength = validation.conditions?.find((c) => c.key === "max.length")?.value;
+			if (minLength || maxLength) validationHints.push(`Length: ${minLength || "0"}-${maxLength || "∞"} characters`);
+		} else if (validation.name === "UpperCaseValidator") {
+			const minLength = validation.conditions?.find((c) => c.key === "min.length")?.value;
+			if (minLength && parseInt(minLength, 10) > 0) validationHints.push("Must contain uppercase letter(s)");
+		} else if (validation.name === "LowerCaseValidator") {
+			const minLength = validation.conditions?.find((c) => c.key === "min.length")?.value;
+			if (minLength && parseInt(minLength, 10) > 0) validationHints.push("Must contain lowercase letter(s)");
+		} else if (validation.name === "NumeralValidator") {
+			const minLength = validation.conditions?.find((c) => c.key === "min.length")?.value;
+			if (minLength && parseInt(minLength, 10) > 0) validationHints.push("Must contain number(s)");
+		} else if (validation.name === "SpecialCharacterValidator") {
+			const minLength = validation.conditions?.find((c) => c.key === "min.length")?.value;
+			if (minLength && parseInt(minLength, 10) > 0) validationHints.push("Must contain special character(s)");
+		}
+	});
+	return createField({
+		className: inputClassName,
+		error,
+		label: config["label"] || "Password",
+		name: fieldName,
+		onChange: (newValue) => onInputChange(fieldName, newValue),
+		placeholder: config["placeholder"] || "Enter your password",
+		required: config["required"] || false,
+		type: FieldType.Password,
+		value
+	});
+};
+var PasswordInput_default = PasswordInput;
+
+//#endregion
+export { PasswordInput_default as default };
+//# sourceMappingURL=PasswordInput.js.map

package/dist/components/adapters/PasswordInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordInput.js","names":["PasswordInput: FC<AdapterProps>","config: Record<string, unknown>","fieldName: string","value: string","error: string | undefined","validations: {\n    conditions?: {key: string; value: string}[];\n    name: string;\n  }[]","validationHints: string[]","minLength: string | undefined","maxLength: string | undefined"],"sources":["../../../src/components/adapters/PasswordInput.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {FieldType} from '@thunderid/browser';\nimport {FC} from 'react';\nimport {AdapterProps} from '../../models/adapters';\nimport {createField} from '../factories/FieldFactory';\n\n/**\n * Password input component for sign-up forms.\n */\nconst PasswordInput: FC<AdapterProps> = ({\n  component,\n  formValues,\n  touchedFields,\n  formErrors,\n  onInputChange,\n  inputClassName,\n}: AdapterProps) => {\n  const config: Record<string, unknown> = component.config || {};\n  const fieldName: string = (config['identifier'] as string) || (config['name'] as string) || component.id;\n  const value: string = formValues[fieldName] || '';\n  const error: string | undefined = touchedFields[fieldName] ? formErrors[fieldName] : undefined;\n\n  // Extract validation rules from the component config if available\n  const validations: {\n    conditions?: {key: string; value: string}[];\n    name: string;\n  }[] =\n    (config['validations'] as {\n      conditions?: {key: string; value: string}[];\n      name: string;\n    }[]) || [];\n  const validationHints: string[] = [];\n\n  validations.forEach((validation: any) => {\n    if (validation.name === 'LengthValidator') {\n      const minLength: string | undefined = validation.conditions?.find((c: any) => c.key === 'min.length')?.value;\n      const maxLength: string | undefined = validation.conditions?.find((c: any) => c.key === 'max.length')?.value;\n      if (minLength || maxLength) {\n        validationHints.push(`Length: ${minLength || '0'}-${maxLength || '∞'} characters`);\n      }\n    } else if (validation.name === 'UpperCaseValidator') {\n      const minLength: string | undefined = validation.conditions?.find((c: any) => c.key === 'min.length')?.value;\n      if (minLength && parseInt(minLength, 10) > 0) {\n        validationHints.push('Must contain uppercase letter(s)');\n      }\n    } else if (validation.name === 'LowerCaseValidator') {\n      const minLength: string | undefined = validation.conditions?.find((c: any) => c.key === 'min.length')?.value;\n      if (minLength && parseInt(minLength, 10) > 0) {\n        validationHints.push('Must contain lowercase letter(s)');\n      }\n    } else if (validation.name === 'NumeralValidator') {\n      const minLength: string | undefined = validation.conditions?.find((c: any) => c.key === 'min.length')?.value;\n      if (minLength && parseInt(minLength, 10) > 0) {\n        validationHints.push('Must contain number(s)');\n      }\n    } else if (validation.name === 'SpecialCharacterValidator') {\n      const minLength: string | undefined = validation.conditions?.find((c: any) => c.key === 'min.length')?.value;\n      if (minLength && parseInt(minLength, 10) > 0) {\n        validationHints.push('Must contain special character(s)');\n      }\n    }\n  });\n\n  return createField({\n    className: inputClassName,\n    error,\n    label: (config['label'] as string) || 'Password',\n    name: fieldName,\n    onChange: (newValue: string) => onInputChange(fieldName, newValue),\n    placeholder: (config['placeholder'] as string) || 'Enter your password',\n    required: (config['required'] as boolean) || false,\n    type: FieldType.Password,\n    value,\n  });\n};\n\nexport default PasswordInput;\n"],"mappings":";;;;;;;AA0BA,MAAMA,iBAAmC,EACvC,WACA,YACA,eACA,YACA,eACA,qBACkB;CAClB,MAAMC,SAAkC,UAAU,UAAU,EAAE;CAC9D,MAAMC,YAAqB,OAAO,iBAA6B,OAAO,WAAsB,UAAU;CACtG,MAAMC,QAAgB,WAAW,cAAc;CAC/C,MAAMC,QAA4B,cAAc,aAAa,WAAW,aAAa;CAGrF,MAAMC,cAIH,OAAO,kBAGA,EAAE;CACZ,MAAMC,kBAA4B,EAAE;AAEpC,aAAY,SAAS,eAAoB;AACvC,MAAI,WAAW,SAAS,mBAAmB;GACzC,MAAMC,YAAgC,WAAW,YAAY,MAAM,MAAW,EAAE,QAAQ,aAAa,EAAE;GACvG,MAAMC,YAAgC,WAAW,YAAY,MAAM,MAAW,EAAE,QAAQ,aAAa,EAAE;AACvG,OAAI,aAAa,UACf,iBAAgB,KAAK,WAAW,aAAa,IAAI,GAAG,aAAa,IAAI,aAAa;aAE3E,WAAW,SAAS,sBAAsB;GACnD,MAAMD,YAAgC,WAAW,YAAY,MAAM,MAAW,EAAE,QAAQ,aAAa,EAAE;AACvG,OAAI,aAAa,SAAS,WAAW,GAAG,GAAG,EACzC,iBAAgB,KAAK,mCAAmC;aAEjD,WAAW,SAAS,sBAAsB;GACnD,MAAMA,YAAgC,WAAW,YAAY,MAAM,MAAW,EAAE,QAAQ,aAAa,EAAE;AACvG,OAAI,aAAa,SAAS,WAAW,GAAG,GAAG,EACzC,iBAAgB,KAAK,mCAAmC;aAEjD,WAAW,SAAS,oBAAoB;GACjD,MAAMA,YAAgC,WAAW,YAAY,MAAM,MAAW,EAAE,QAAQ,aAAa,EAAE;AACvG,OAAI,aAAa,SAAS,WAAW,GAAG,GAAG,EACzC,iBAAgB,KAAK,yBAAyB;aAEvC,WAAW,SAAS,6BAA6B;GAC1D,MAAMA,YAAgC,WAAW,YAAY,MAAM,MAAW,EAAE,QAAQ,aAAa,EAAE;AACvG,OAAI,aAAa,SAAS,WAAW,GAAG,GAAG,EACzC,iBAAgB,KAAK,oCAAoC;;GAG7D;AAEF,QAAO,YAAY;EACjB,WAAW;EACX;EACA,OAAQ,OAAO,YAAuB;EACtC,MAAM;EACN,WAAW,aAAqB,cAAc,WAAW,SAAS;EAClE,aAAc,OAAO,kBAA6B;EAClD,UAAW,OAAO,eAA2B;EAC7C,MAAM,UAAU;EAChB;EACD,CAAC;;AAGJ,4BAAe"}

package/dist/components/adapters/SelectInput.js

@@ -0,0 +1,34 @@
+import { createField } from "../factories/FieldFactory.js";
+import { FieldType } from "@thunderid/browser";
+
+//#region src/components/adapters/SelectInput.tsx
+/**
+* Select input component for sign-up forms.
+*/
+const SelectInput = ({ component, formValues, touchedFields, formErrors, onInputChange, inputClassName }) => {
+	const config = component.config || {};
+	const fieldName = config["identifier"] || config["name"] || component.id;
+	const value = formValues[fieldName] || "";
+	const error = touchedFields[fieldName] ? formErrors[fieldName] : void 0;
+	const options = (config["options"] || []).map((option) => ({
+		label: option,
+		value: option
+	}));
+	return createField({
+		className: inputClassName,
+		error,
+		label: config["label"] || "",
+		name: fieldName,
+		onChange: (newValue) => onInputChange(fieldName, newValue),
+		options,
+		placeholder: config["placeholder"] || "",
+		required: config["required"] || false,
+		type: FieldType.Select,
+		value
+	});
+};
+var SelectInput_default = SelectInput;
+
+//#endregion
+export { SelectInput_default as default };
+//# sourceMappingURL=SelectInput.js.map

package/dist/components/adapters/SelectInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInput.js","names":["SelectInput: FC<AdapterProps>","config: Record<string, unknown>","fieldName: string","value: string","error: string | undefined","options: SelectOption[]"],"sources":["../../../src/components/adapters/SelectInput.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {FieldType} from '@thunderid/browser';\nimport {FC} from 'react';\nimport {AdapterProps} from '../../models/adapters';\nimport {createField} from '../factories/FieldFactory';\nimport {SelectOption} from '../primitives/Select/Select';\n\n/**\n * Select input component for sign-up forms.\n */\nconst SelectInput: FC<AdapterProps> = ({\n  component,\n  formValues,\n  touchedFields,\n  formErrors,\n  onInputChange,\n  inputClassName,\n}: AdapterProps) => {\n  const config: Record<string, unknown> = component.config || {};\n  const fieldName: string = (config['identifier'] as string) || (config['name'] as string) || component.id;\n  const value: string = formValues[fieldName] || '';\n  const error: string | undefined = touchedFields[fieldName] ? formErrors[fieldName] : undefined;\n\n  // Get options from config and convert to SelectOption format\n  const rawOptions: string[] = (config['options'] as string[]) || [];\n  const options: SelectOption[] = rawOptions.map((option: string) => ({\n    label: option,\n    value: option,\n  }));\n\n  return createField({\n    className: inputClassName,\n    error,\n    label: (config['label'] as string) || '',\n    name: fieldName,\n    onChange: (newValue: string): void => onInputChange(fieldName, newValue),\n    options,\n    placeholder: (config['placeholder'] as string) || '',\n    required: (config['required'] as boolean) || false,\n    type: FieldType.Select,\n    value,\n  });\n};\n\nexport default SelectInput;\n"],"mappings":";;;;;;;AA2BA,MAAMA,eAAiC,EACrC,WACA,YACA,eACA,YACA,eACA,qBACkB;CAClB,MAAMC,SAAkC,UAAU,UAAU,EAAE;CAC9D,MAAMC,YAAqB,OAAO,iBAA6B,OAAO,WAAsB,UAAU;CACtG,MAAMC,QAAgB,WAAW,cAAc;CAC/C,MAAMC,QAA4B,cAAc,aAAa,WAAW,aAAa;CAIrF,MAAMC,WADwB,OAAO,cAA2B,EAAE,EACvB,KAAK,YAAoB;EAClE,OAAO;EACP,OAAO;EACR,EAAE;AAEH,QAAO,YAAY;EACjB,WAAW;EACX;EACA,OAAQ,OAAO,YAAuB;EACtC,MAAM;EACN,WAAW,aAA2B,cAAc,WAAW,SAAS;EACxE;EACA,aAAc,OAAO,kBAA6B;EAClD,UAAW,OAAO,eAA2B;EAC7C,MAAM,UAAU;EAChB;EACD,CAAC;;AAGJ,0BAAe"}

package/dist/components/adapters/SignInWithEthereumButton.js

@@ -0,0 +1,36 @@
+import useTranslation_default from "../../hooks/useTranslation.js";
+import Button_default from "../primitives/Button/Button.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/adapters/SignInWithEthereumButton.tsx
+/**
+* Sign In With Ethereum Button Component.
+* Handles authentication with Sign In With Ethereum identity provider.
+*/
+const SignInWithEthereumButton = ({ isLoading, preferences, children,...rest }) => {
+	const { t } = useTranslation_default(preferences?.i18n);
+	return /* @__PURE__ */ jsx(Button_default, {
+		...rest,
+		fullWidth: true,
+		type: "button",
+		color: "secondary",
+		variant: "solid",
+		disabled: isLoading,
+		startIcon: /* @__PURE__ */ jsx("svg", {
+			width: "18",
+			height: "18",
+			viewBox: "0 0 24 24",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: /* @__PURE__ */ jsx("path", {
+				fill: "#627EEA",
+				d: "M11.944 17.97L4.58 13.62 11.943 24l7.37-10.38-7.372 4.35h.003zM12.056 0L4.69 12.223l7.365 4.354 7.365-4.35L12.056 0z"
+			})
+		}),
+		children: children ?? t("elements.buttons.ethereum.text")
+	});
+};
+var SignInWithEthereumButton_default = SignInWithEthereumButton;
+
+//#endregion
+export { SignInWithEthereumButton_default as default };
+//# sourceMappingURL=SignInWithEthereumButton.js.map

package/dist/components/adapters/SignInWithEthereumButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SignInWithEthereumButton.js","names":["SignInWithEthereumButton: FC<SignInWithEthereumButtonProps & HTMLAttributes<HTMLButtonElement>>","useTranslation","Button"],"sources":["../../../src/components/adapters/SignInWithEthereumButton.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {WithPreferences} from '@thunderid/browser';\nimport {FC, HTMLAttributes} from 'react';\nimport useTranslation from '../../hooks/useTranslation';\nimport Button from '../primitives/Button/Button';\n\nexport interface SignInWithEthereumButtonProps extends WithPreferences {\n  /**\n   * Whether the component is in loading state.\n   */\n  isLoading?: boolean;\n}\n\n/**\n * Sign In With Ethereum Button Component.\n * Handles authentication with Sign In With Ethereum identity provider.\n */\nconst SignInWithEthereumButton: FC<SignInWithEthereumButtonProps & HTMLAttributes<HTMLButtonElement>> = ({\n  isLoading,\n  preferences,\n  children,\n  ...rest\n}: SignInWithEthereumButtonProps & HTMLAttributes<HTMLButtonElement>) => {\n  const {t} = useTranslation(preferences?.i18n);\n\n  return (\n    <Button\n      {...rest}\n      fullWidth\n      type=\"button\"\n      color=\"secondary\"\n      variant=\"solid\"\n      disabled={isLoading}\n      startIcon={\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            fill=\"#627EEA\"\n            d=\"M11.944 17.97L4.58 13.62 11.943 24l7.37-10.38-7.372 4.35h.003zM12.056 0L4.69 12.223l7.365 4.354 7.365-4.35L12.056 0z\"\n          />\n        </svg>\n      }\n    >\n      {children ?? t('elements.buttons.ethereum.text')}\n    </Button>\n  );\n};\n\nexport default SignInWithEthereumButton;\n"],"mappings":";;;;;;;;;AAkCA,MAAMA,4BAAmG,EACvG,WACA,aACA,SACA,GAAG,WACoE;CACvE,MAAM,EAAC,MAAKC,uBAAe,aAAa,KAAK;AAE7C,QACE,oBAACC;EACC,GAAI;EACJ;EACA,MAAK;EACL,OAAM;EACN,SAAQ;EACR,UAAU;EACV,WACE,oBAAC;GAAI,OAAM;GAAK,QAAO;GAAK,SAAQ;GAAY,OAAM;aACpD,oBAAC;IACC,MAAK;IACL,GAAE;KACF;IACE;YAGP,YAAY,EAAE,iCAAiC;GACzC;;AAIb,uCAAe"}

package/dist/components/adapters/SmsOtpButton.js

@@ -0,0 +1,36 @@
+import useTranslation_default from "../../hooks/useTranslation.js";
+import Button_default from "../primitives/Button/Button.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/adapters/SmsOtpButton.tsx
+/**
+* SMS OTP Sign-In Button Component.
+* Handles authentication with SMS OTP.
+*/
+const SmsOtpButton = ({ isLoading, preferences, children,...rest }) => {
+	const { t } = useTranslation_default(preferences?.i18n);
+	return /* @__PURE__ */ jsx(Button_default, {
+		...rest,
+		fullWidth: true,
+		type: "button",
+		color: "secondary",
+		variant: "solid",
+		disabled: isLoading,
+		startIcon: /* @__PURE__ */ jsx("svg", {
+			width: "18",
+			height: "18",
+			viewBox: "0 0 24 24",
+			xmlns: "http://www.w3.org/2000/svg",
+			children: /* @__PURE__ */ jsx("path", {
+				fill: "currentColor",
+				d: "M20 15.5c-1.25 0-2.45-.2-3.57-.57a1.02 1.02 0 0 0-1.02.24l-2.2 2.2a15.074 15.074 0 0 1-6.59-6.59l2.2-2.2c.27-.27.35-.67.24-1.02A11.36 11.36 0 0 1 8.5 4c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1 0 9.39 7.61 17 17 17 .55 0 1-.45 1-1v-3.5c0-.55-.45-1-1-1M12 3v10l3-3h6V3z"
+			})
+		}),
+		children: children ?? t("elements.buttons.smsotp.text")
+	});
+};
+var SmsOtpButton_default = SmsOtpButton;
+
+//#endregion
+export { SmsOtpButton_default as default };
+//# sourceMappingURL=SmsOtpButton.js.map

package/dist/components/adapters/SmsOtpButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SmsOtpButton.js","names":["SmsOtpButton: FC<SmsOtpButtonProps & HTMLAttributes<HTMLButtonElement>>","useTranslation","Button"],"sources":["../../../src/components/adapters/SmsOtpButton.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {WithPreferences} from '@thunderid/browser';\nimport {FC, HTMLAttributes} from 'react';\nimport useTranslation from '../../hooks/useTranslation';\nimport Button from '../primitives/Button/Button';\n\nexport interface SmsOtpButtonProps extends WithPreferences {\n  /**\n   * Whether the component is in loading state.\n   */\n  isLoading?: boolean;\n}\n\n/**\n * SMS OTP Sign-In Button Component.\n * Handles authentication with SMS OTP.\n */\nconst SmsOtpButton: FC<SmsOtpButtonProps & HTMLAttributes<HTMLButtonElement>> = ({\n  isLoading,\n  preferences,\n  children,\n  ...rest\n}: SmsOtpButtonProps & HTMLAttributes<HTMLButtonElement>) => {\n  const {t} = useTranslation(preferences?.i18n);\n\n  return (\n    <Button\n      {...rest}\n      fullWidth\n      type=\"button\"\n      color=\"secondary\"\n      variant=\"solid\"\n      disabled={isLoading}\n      startIcon={\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            fill=\"currentColor\"\n            d=\"M20 15.5c-1.25 0-2.45-.2-3.57-.57a1.02 1.02 0 0 0-1.02.24l-2.2 2.2a15.074 15.074 0 0 1-6.59-6.59l2.2-2.2c.27-.27.35-.67.24-1.02A11.36 11.36 0 0 1 8.5 4c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1 0 9.39 7.61 17 17 17 .55 0 1-.45 1-1v-3.5c0-.55-.45-1-1-1M12 3v10l3-3h6V3z\"\n          />\n        </svg>\n      }\n    >\n      {children ?? t('elements.buttons.smsotp.text')}\n    </Button>\n  );\n};\n\nexport default SmsOtpButton;\n"],"mappings":";;;;;;;;;AAkCA,MAAMA,gBAA2E,EAC/E,WACA,aACA,SACA,GAAG,WACwD;CAC3D,MAAM,EAAC,MAAKC,uBAAe,aAAa,KAAK;AAE7C,QACE,oBAACC;EACC,GAAI;EACJ;EACA,MAAK;EACL,OAAM;EACN,SAAQ;EACR,UAAU;EACV,WACE,oBAAC;GAAI,OAAM;GAAK,QAAO;GAAK,SAAQ;GAAY,OAAM;aACpD,oBAAC;IACC,MAAK;IACL,GAAE;KACF;IACE;YAGP,YAAY,EAAE,+BAA+B;GACvC;;AAIb,2BAAe"}

package/dist/components/adapters/SubmitButton.js

@@ -0,0 +1,59 @@
+import Spinner_default from "../primitives/Spinner/Spinner.js";
+import Button_default from "../primitives/Button/Button.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/adapters/SubmitButton.tsx
+/**
+* Button component for sign-up forms that handles all button variants.
+*/
+const ButtonComponent = ({ component, isLoading, isFormValid, buttonClassName, onSubmit, size = "medium" }) => {
+	const config = component.config || {};
+	const buttonText = config["text"] || config["label"] || "Continue";
+	const buttonType = config["type"] || "submit";
+	const componentVariant = component.variant?.toUpperCase() || "PRIMARY";
+	const getButtonProps = () => {
+		switch (componentVariant) {
+			case "PRIMARY": return {
+				color: "primary",
+				variant: "solid"
+			};
+			case "SECONDARY": return {
+				color: "secondary",
+				variant: "solid"
+			};
+			case "TEXT": return {
+				color: "primary",
+				variant: "text"
+			};
+			case "SOCIAL":
+			case "OUTLINED": return {
+				color: "primary",
+				variant: "outline"
+			};
+			default: return {
+				color: "primary",
+				variant: "solid"
+			};
+		}
+	};
+	const { variant, color } = getButtonProps();
+	const handleClick = () => {
+		if (onSubmit && buttonType !== "submit") onSubmit(component);
+	};
+	return /* @__PURE__ */ jsx(Button_default, {
+		type: buttonType === "submit" ? "submit" : "button",
+		variant,
+		color,
+		size,
+		disabled: isLoading || buttonType === "submit" && !isFormValid,
+		onClick: buttonType !== "submit" ? handleClick : void 0,
+		className: buttonClassName,
+		style: { width: "100%" },
+		children: isLoading ? /* @__PURE__ */ jsx(Spinner_default, { size: "small" }) : buttonText
+	}, component.id);
+};
+var SubmitButton_default = ButtonComponent;
+
+//#endregion
+export { SubmitButton_default as default };
+//# sourceMappingURL=SubmitButton.js.map

package/dist/components/adapters/SubmitButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SubmitButton.js","names":["ButtonComponent: FC<AdapterProps>","config: Record<string, unknown>","buttonText: string","buttonType: string","componentVariant: string","Button","Spinner"],"sources":["../../../src/components/adapters/SubmitButton.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {FC} from 'react';\nimport {AdapterProps} from '../../models/adapters';\nimport Button from '../primitives/Button/Button';\nimport Spinner from '../primitives/Spinner/Spinner';\n\n/**\n * Button component for sign-up forms that handles all button variants.\n */\nconst ButtonComponent: FC<AdapterProps> = ({\n  component,\n  isLoading,\n  isFormValid,\n  buttonClassName,\n  onSubmit,\n  size = 'medium',\n}: AdapterProps) => {\n  const config: Record<string, unknown> = component.config || {};\n  const buttonText: string = (config['text'] as string) || (config['label'] as string) || 'Continue';\n  const buttonType: string = (config['type'] as string) || 'submit';\n  const componentVariant: string = component.variant?.toUpperCase() || 'PRIMARY';\n\n  // Map component variants to Button primitive props\n  const getButtonProps = (): {color: 'primary' | 'secondary'; variant: 'solid' | 'text' | 'outline'} => {\n    switch (componentVariant) {\n      case 'PRIMARY':\n        return {color: 'primary' as const, variant: 'solid' as const};\n      case 'SECONDARY':\n        return {color: 'secondary' as const, variant: 'solid' as const};\n      case 'TEXT':\n        return {color: 'primary' as const, variant: 'text' as const};\n      case 'SOCIAL':\n      case 'OUTLINED':\n        return {color: 'primary' as const, variant: 'outline' as const};\n      default:\n        return {color: 'primary' as const, variant: 'solid' as const};\n    }\n  };\n\n  const {variant, color} = getButtonProps();\n\n  const handleClick = (): void => {\n    if (onSubmit && buttonType !== 'submit') {\n      onSubmit(component);\n    }\n  };\n\n  return (\n    <Button\n      key={component.id}\n      type={buttonType === 'submit' ? 'submit' : 'button'}\n      variant={variant}\n      color={color}\n      size={size}\n      disabled={isLoading || (buttonType === 'submit' && !isFormValid)}\n      onClick={buttonType !== 'submit' ? handleClick : undefined}\n      className={buttonClassName}\n      style={{width: '100%'}}\n    >\n      {isLoading ? <Spinner size=\"small\" /> : buttonText}\n    </Button>\n  );\n};\n\nexport default ButtonComponent;\n"],"mappings":";;;;;;;;AA0BA,MAAMA,mBAAqC,EACzC,WACA,WACA,aACA,iBACA,UACA,OAAO,eACW;CAClB,MAAMC,SAAkC,UAAU,UAAU,EAAE;CAC9D,MAAMC,aAAsB,OAAO,WAAuB,OAAO,YAAuB;CACxF,MAAMC,aAAsB,OAAO,WAAsB;CACzD,MAAMC,mBAA2B,UAAU,SAAS,aAAa,IAAI;CAGrE,MAAM,uBAAgG;AACpG,UAAQ,kBAAR;GACE,KAAK,UACH,QAAO;IAAC,OAAO;IAAoB,SAAS;IAAiB;GAC/D,KAAK,YACH,QAAO;IAAC,OAAO;IAAsB,SAAS;IAAiB;GACjE,KAAK,OACH,QAAO;IAAC,OAAO;IAAoB,SAAS;IAAgB;GAC9D,KAAK;GACL,KAAK,WACH,QAAO;IAAC,OAAO;IAAoB,SAAS;IAAmB;GACjE,QACE,QAAO;IAAC,OAAO;IAAoB,SAAS;IAAiB;;;CAInE,MAAM,EAAC,SAAS,UAAS,gBAAgB;CAEzC,MAAM,oBAA0B;AAC9B,MAAI,YAAY,eAAe,SAC7B,UAAS,UAAU;;AAIvB,QACE,oBAACC;EAEC,MAAM,eAAe,WAAW,WAAW;EAClC;EACF;EACD;EACN,UAAU,aAAc,eAAe,YAAY,CAAC;EACpD,SAAS,eAAe,WAAW,cAAc;EACjD,WAAW;EACX,OAAO,EAAC,OAAO,QAAO;YAErB,YAAY,oBAACC,mBAAQ,MAAK,UAAU,GAAG;IAVnC,UAAU,GAWR;;AAIb,2BAAe"}

package/dist/components/adapters/TelephoneInput.js

@@ -0,0 +1,30 @@
+import TextField_default from "../primitives/TextField/TextField.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/adapters/TelephoneInput.tsx
+/**
+* Telephone input component for sign-up forms.
+*/
+const TelephoneInput = ({ component, formValues, touchedFields, formErrors, onInputChange, inputClassName }) => {
+	const config = component.config || {};
+	const fieldName = config["identifier"] || config["name"] || component.id;
+	const value = formValues[fieldName] || "";
+	const error = touchedFields[fieldName] ? formErrors[fieldName] : void 0;
+	return /* @__PURE__ */ jsx(TextField_default, {
+		name: fieldName,
+		type: "tel",
+		label: config["label"] || "",
+		placeholder: config["placeholder"] || "",
+		required: config["required"] || false,
+		value,
+		error,
+		onChange: (e) => onInputChange(fieldName, e.target.value),
+		className: inputClassName,
+		helperText: config["hint"] || ""
+	}, component.id);
+};
+var TelephoneInput_default = TelephoneInput;
+
+//#endregion
+export { TelephoneInput_default as default };
+//# sourceMappingURL=TelephoneInput.js.map

package/dist/components/adapters/TelephoneInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TelephoneInput.js","names":["TelephoneInput: FC<AdapterProps>","config: Record<string, unknown>","fieldName: string","value: string","error: string | undefined","TextField"],"sources":["../../../src/components/adapters/TelephoneInput.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {ChangeEvent, FC} from 'react';\nimport {AdapterProps} from '../../models/adapters';\nimport TextField from '../primitives/TextField/TextField';\n\n/**\n * Telephone input component for sign-up forms.\n */\nconst TelephoneInput: FC<AdapterProps> = ({\n  component,\n  formValues,\n  touchedFields,\n  formErrors,\n  onInputChange,\n  inputClassName,\n}: AdapterProps) => {\n  const config: Record<string, unknown> = component.config || {};\n  const fieldName: string = (config['identifier'] as string) || (config['name'] as string) || component.id;\n  const value: string = formValues[fieldName] || '';\n  const error: string | undefined = touchedFields[fieldName] ? formErrors[fieldName] : undefined;\n\n  return (\n    <TextField\n      key={component.id}\n      name={fieldName}\n      type=\"tel\"\n      label={(config['label'] as string) || ''}\n      placeholder={(config['placeholder'] as string) || ''}\n      required={(config['required'] as boolean) || false}\n      value={value}\n      error={error}\n      onChange={(e: ChangeEvent<HTMLInputElement>): void => onInputChange(fieldName, e.target.value)}\n      className={inputClassName}\n      helperText={(config['hint'] as string) || ''}\n    />\n  );\n};\n\nexport default TelephoneInput;\n"],"mappings":";;;;;;;AAyBA,MAAMA,kBAAoC,EACxC,WACA,YACA,eACA,YACA,eACA,qBACkB;CAClB,MAAMC,SAAkC,UAAU,UAAU,EAAE;CAC9D,MAAMC,YAAqB,OAAO,iBAA6B,OAAO,WAAsB,UAAU;CACtG,MAAMC,QAAgB,WAAW,cAAc;CAC/C,MAAMC,QAA4B,cAAc,aAAa,WAAW,aAAa;AAErF,QACE,oBAACC;EAEC,MAAM;EACN,MAAK;EACL,OAAQ,OAAO,YAAuB;EACtC,aAAc,OAAO,kBAA6B;EAClD,UAAW,OAAO,eAA2B;EACtC;EACA;EACP,WAAW,MAA2C,cAAc,WAAW,EAAE,OAAO,MAAM;EAC9F,WAAW;EACX,YAAa,OAAO,WAAsB;IAVrC,UAAU,GAWf;;AAIN,6BAAe"}

package/dist/components/adapters/TextInput.js

@@ -0,0 +1,28 @@
+import { createField } from "../factories/FieldFactory.js";
+import { FieldType } from "@thunderid/browser";
+
+//#region src/components/adapters/TextInput.tsx
+/**
+* Text input component for sign-up forms.
+*/
+const TextInput = ({ component, formValues, touchedFields, formErrors, onInputChange, inputClassName }) => {
+	const config = component.config || {};
+	const fieldName = config["identifier"] || config["name"] || component.id;
+	const value = formValues[fieldName] || "";
+	return createField({
+		className: inputClassName,
+		error: touchedFields[fieldName] ? formErrors[fieldName] : void 0,
+		label: config["label"] || "",
+		name: fieldName,
+		onChange: (newValue) => onInputChange(fieldName, newValue),
+		placeholder: config["placeholder"] || "",
+		required: config["required"] || false,
+		type: FieldType.Text,
+		value
+	});
+};
+var TextInput_default = TextInput;
+
+//#endregion
+export { TextInput_default as default };
+//# sourceMappingURL=TextInput.js.map

package/dist/components/adapters/TextInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextInput.js","names":["TextInput: FC<AdapterProps>","config: Record<string, unknown>","fieldName: string","value: string"],"sources":["../../../src/components/adapters/TextInput.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {FieldType} from '@thunderid/browser';\nimport {FC} from 'react';\nimport {AdapterProps} from '../../models/adapters';\nimport {createField} from '../factories/FieldFactory';\n\n/**\n * Text input component for sign-up forms.\n */\nconst TextInput: FC<AdapterProps> = ({\n  component,\n  formValues,\n  touchedFields,\n  formErrors,\n  onInputChange,\n  inputClassName,\n}: AdapterProps) => {\n  const config: Record<string, unknown> = component.config || {};\n  const fieldName: string = (config['identifier'] as string) || (config['name'] as string) || component.id;\n  const value: string = formValues[fieldName] || '';\n  const error: string | undefined = touchedFields[fieldName] ? formErrors[fieldName] : undefined;\n\n  return createField({\n    className: inputClassName,\n    error,\n    label: (config['label'] as string) || '',\n    name: fieldName,\n    onChange: (newValue: string) => onInputChange(fieldName, newValue),\n    placeholder: (config['placeholder'] as string) || '',\n    required: (config['required'] as boolean) || false,\n    type: FieldType.Text,\n    value,\n  });\n};\n\nexport default TextInput;\n"],"mappings":";;;;;;;AA0BA,MAAMA,aAA+B,EACnC,WACA,YACA,eACA,YACA,eACA,qBACkB;CAClB,MAAMC,SAAkC,UAAU,UAAU,EAAE;CAC9D,MAAMC,YAAqB,OAAO,iBAA6B,OAAO,WAAsB,UAAU;CACtG,MAAMC,QAAgB,WAAW,cAAc;AAG/C,QAAO,YAAY;EACjB,WAAW;EACX,OAJgC,cAAc,aAAa,WAAW,aAAa;EAKnF,OAAQ,OAAO,YAAuB;EACtC,MAAM;EACN,WAAW,aAAqB,cAAc,WAAW,SAAS;EAClE,aAAc,OAAO,kBAA6B;EAClD,UAAW,OAAO,eAA2B;EAC7C,MAAM,UAAU;EAChB;EACD,CAAC;;AAGJ,wBAAe"}

package/dist/components/adapters/Typography.js

@@ -0,0 +1,58 @@
+import useTheme_default from "../../contexts/Theme/useTheme.js";
+import Typography_default from "../primitives/Typography/Typography.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/adapters/Typography.tsx
+/**
+* Typography component for sign-up forms (titles, descriptions, etc.).
+*/
+const TypographyComponent = ({ component }) => {
+	const { theme } = useTheme_default();
+	const config = component.config || {};
+	const text = config["text"] || config["content"] || "";
+	const variant = component.variant?.toLowerCase() || "body1";
+	let typographyVariant = "body1";
+	switch (variant) {
+		case "h1":
+			typographyVariant = "h1";
+			break;
+		case "h2":
+			typographyVariant = "h2";
+			break;
+		case "h3":
+			typographyVariant = "h3";
+			break;
+		case "h4":
+			typographyVariant = "h4";
+			break;
+		case "h5":
+			typographyVariant = "h5";
+			break;
+		case "h6":
+			typographyVariant = "h6";
+			break;
+		case "subtitle1":
+			typographyVariant = "subtitle1";
+			break;
+		case "subtitle2":
+			typographyVariant = "subtitle2";
+			break;
+		case "body2":
+			typographyVariant = "body2";
+			break;
+		case "caption":
+			typographyVariant = "caption";
+			break;
+		default: typographyVariant = "body1";
+	}
+	return /* @__PURE__ */ jsx(Typography_default, {
+		variant: typographyVariant,
+		style: { marginBottom: `calc(${theme.vars.spacing.unit} * 2)` },
+		children: text
+	}, component.id);
+};
+var Typography_default$1 = TypographyComponent;
+
+//#endregion
+export { Typography_default$1 as default };
+//# sourceMappingURL=Typography.js.map

package/dist/components/adapters/Typography.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typography.js","names":["TypographyComponent: FC<AdapterProps>","useTheme","config: Record<string, unknown>","text: string","variant: string","typographyVariant: any","Typography"],"sources":["../../../src/components/adapters/Typography.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {FC} from 'react';\nimport useTheme from '../../contexts/Theme/useTheme';\nimport {AdapterProps} from '../../models/adapters';\nimport Typography from '../primitives/Typography/Typography';\n\n/**\n * Typography component for sign-up forms (titles, descriptions, etc.).\n */\nconst TypographyComponent: FC<AdapterProps> = ({component}: AdapterProps) => {\n  const {theme} = useTheme();\n  const config: Record<string, unknown> = component.config || {};\n  const text: string = (config['text'] as string) || (config['content'] as string) || '';\n  const variant: string = component.variant?.toLowerCase() || 'body1';\n\n  // Map component variants to Typography variants\n  let typographyVariant: any = 'body1';\n\n  switch (variant) {\n    case 'h1':\n      typographyVariant = 'h1';\n      break;\n    case 'h2':\n      typographyVariant = 'h2';\n      break;\n    case 'h3':\n      typographyVariant = 'h3';\n      break;\n    case 'h4':\n      typographyVariant = 'h4';\n      break;\n    case 'h5':\n      typographyVariant = 'h5';\n      break;\n    case 'h6':\n      typographyVariant = 'h6';\n      break;\n    case 'subtitle1':\n      typographyVariant = 'subtitle1';\n      break;\n    case 'subtitle2':\n      typographyVariant = 'subtitle2';\n      break;\n    case 'body2':\n      typographyVariant = 'body2';\n      break;\n    case 'caption':\n      typographyVariant = 'caption';\n      break;\n    default:\n      typographyVariant = 'body1';\n  }\n\n  return (\n    <Typography\n      key={component.id}\n      variant={typographyVariant}\n      style={{marginBottom: `calc(${theme.vars.spacing.unit} * 2)`}}\n    >\n      {text}\n    </Typography>\n  );\n};\n\nexport default TypographyComponent;\n"],"mappings":";;;;;;;;AA0BA,MAAMA,uBAAyC,EAAC,gBAA6B;CAC3E,MAAM,EAAC,UAASC,kBAAU;CAC1B,MAAMC,SAAkC,UAAU,UAAU,EAAE;CAC9D,MAAMC,OAAgB,OAAO,WAAuB,OAAO,cAAyB;CACpF,MAAMC,UAAkB,UAAU,SAAS,aAAa,IAAI;CAG5D,IAAIC,oBAAyB;AAE7B,SAAQ,SAAR;EACE,KAAK;AACH,uBAAoB;AACpB;EACF,KAAK;AACH,uBAAoB;AACpB;EACF,KAAK;AACH,uBAAoB;AACpB;EACF,KAAK;AACH,uBAAoB;AACpB;EACF,KAAK;AACH,uBAAoB;AACpB;EACF,KAAK;AACH,uBAAoB;AACpB;EACF,KAAK;AACH,uBAAoB;AACpB;EACF,KAAK;AACH,uBAAoB;AACpB;EACF,KAAK;AACH,uBAAoB;AACpB;EACF,KAAK;AACH,uBAAoB;AACpB;EACF,QACE,qBAAoB;;AAGxB,QACE,oBAACC;EAEC,SAAS;EACT,OAAO,EAAC,cAAc,QAAQ,MAAM,KAAK,QAAQ,KAAK,QAAO;YAE5D;IAJI,UAAU,GAKJ;;AAIjB,2BAAe"}