@saasquatch/mint-components 1.6.2-7 → 1.6.2

package/dist/collection/components/sqm-portal-registration-form/sqm-portal-registration-form.js

@@ -1,436 +1,595 @@
-import { isDemo, navigation } from "@saasquatch/component-boilerplate";
-import { withHooks } from "@saasquatch/stencil-hooks";
-import { Component, h, Prop, State } from "@stencil/core";
-import deepmerge from "deepmerge";
-import { PortalRegistrationFormView, } from "./sqm-portal-registration-form-view";
-import { usePortalRegistrationForm } from "./usePortalRegistrationForm";
-/**
- * @uiName Portal Register
- */
-export class PortalRegistrationForm {
-  constructor() {
-    this.ignored = true;
-    /**
-     * Page navigated to after registration
-     *
-     * @uiName Next Page
-     */
-    this.nextPage = "/";
-    /**
-     * The page that users are redirected to from the verification email.
-     *
-     * @uiName Email Redirection Base Path
-     */
-    this.redirectPath = "/verifyEmail";
-    /**
-     * @uiName Email Label
-     */
-    this.emailLabel = "Email";
-    /**
-     * @uiName Password Label
-     */
-    this.passwordLabel = "Password";
-    /**
-     * @uiName Submit Button Text
-     */
-    this.submitLabel = "Register";
-    /**
-     * @uiName Login Button Text
-     */
-    this.loginLabel = "Sign in";
-    /**
-     * @uiName Confirm Password Label
-     */
-    this.confirmPasswordLabel = "Confirm Password";
-    /**
-     * Show or hide the confirm password input
-     *
-     * @uiName Show Confirm Password Field
-     * @default
-     */
-    this.confirmPassword = false;
-    /**
-     * @uiName Enable Password Validation
-     */
-    this.enablePasswordValidation = true;
-    /**
-     * Hide default input fields to use custom fields
-     *
-     * @uiName Hide Default Inputs
-     * @default
-     */
-    this.hideInputs = false;
-    /**
-     * @uiName Heading Label
-     */
-    this.pageLabel = "Register";
-    /**
-     * Login button redirection path
-     *
-     * @uiName Login Path
-     */
-    this.loginPath = "/login";
-    /**
-     * Microsite Registration Form Key
-     *
-     * @uiName Form Key
-     */
-    this.formKey = "microsite-registration-form";
-    withHooks(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const { states, callbacks, refs } = isDemo()
-      ? useRegisterDemo(this)
-      : usePortalRegistrationForm(this);
-    const content = {
-      formData: h("slot", { name: "formData" }),
-      secondaryButton: (h("slot", { name: "secondaryButton" },
-        h("sl-button", { type: "text", disabled: states.loading, onClick: () => navigation.push(states.loginPath) }, this.loginLabel))),
-      terms: h("slot", { name: "terms" }),
-      emailLabel: this.emailLabel,
-      passwordLabel: this.passwordLabel,
-      submitLabel: this.submitLabel,
-      pageLabel: this.pageLabel,
-      confirmPasswordLabel: this.confirmPasswordLabel,
-    };
-    return (h(PortalRegistrationFormView, { states: states, callbacks: callbacks, content: content, refs: refs }));
-  }
-  static get is() { return "sqm-portal-registration-form"; }
-  static get encapsulation() { return "shadow"; }
-  static get properties() { return {
-    "nextPage": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Next Page",
-            "name": "uiName"
-          }],
-        "text": "Page navigated to after registration"
-      },
-      "attribute": "next-page",
-      "reflect": false,
-      "defaultValue": "\"/\""
-    },
-    "redirectPath": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Email Redirection Base Path",
-            "name": "uiName"
-          }],
-        "text": "The page that users are redirected to from the verification email."
-      },
-      "attribute": "redirect-path",
-      "reflect": false,
-      "defaultValue": "\"/verifyEmail\""
-    },
-    "emailLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Email Label",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "email-label",
-      "reflect": false,
-      "defaultValue": "\"Email\""
-    },
-    "passwordLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Password Label",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "password-label",
-      "reflect": false,
-      "defaultValue": "\"Password\""
-    },
-    "submitLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Submit Button Text",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "submit-label",
-      "reflect": false,
-      "defaultValue": "\"Register\""
-    },
-    "loginLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Login Button Text",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "login-label",
-      "reflect": false,
-      "defaultValue": "\"Sign in\""
-    },
-    "confirmPasswordLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Confirm Password Label",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "confirm-password-label",
-      "reflect": false,
-      "defaultValue": "\"Confirm Password\""
-    },
-    "confirmPassword": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Show Confirm Password Field",
-            "name": "uiName"
-          }, {
-            "text": undefined,
-            "name": "default"
-          }],
-        "text": "Show or hide the confirm password input"
-      },
-      "attribute": "confirm-password",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "enablePasswordValidation": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Enable Password Validation",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "enable-password-validation",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "hideInputs": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Hide Default Inputs",
-            "name": "uiName"
-          }, {
-            "text": undefined,
-            "name": "default"
-          }],
-        "text": "Hide default input fields to use custom fields"
-      },
-      "attribute": "hide-inputs",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "pageLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Heading Label",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "page-label",
-      "reflect": false,
-      "defaultValue": "\"Register\""
-    },
-    "loginPath": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Login Path",
-            "name": "uiName"
-          }],
-        "text": "Login button redirection path"
-      },
-      "attribute": "login-path",
-      "reflect": false,
-      "defaultValue": "\"/login\""
-    },
-    "formKey": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Form Key",
-            "name": "uiName"
-          }],
-        "text": "Microsite Registration Form Key"
-      },
-      "attribute": "form-key",
-      "reflect": false,
-      "defaultValue": "\"microsite-registration-form\""
-    },
-    "demoData": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "DemoData<PortalRegistrationFormViewProps>",
-        "resolved": "{ states?: { error: string; loading: boolean; confirmPassword: boolean; hideInputs: boolean; validationState?: FormState; registrationFormState?: RegistrationFormState; enablePasswordValidation?: boolean; loginPath: string; }; refs?: { formRef: any; }; content?: { formData?: VNode; terms?: VNode; passwordField?: VNode; secondaryButton?: VNode; emailLabel?: string; passwordLabel?: string; submitLabel?: string; pageLabel?: string; confirmPasswordLabel: string; }; }",
-        "references": {
-          "DemoData": {
-            "location": "import",
-            "path": "../../global/demo"
-          },
-          "PortalRegistrationFormViewProps": {
-            "location": "import",
-            "path": "./sqm-portal-registration-form-view"
-          }
-        }
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "text": undefined,
-            "name": "undocumented"
-          }, {
-            "text": "object",
-            "name": "uiType"
-          }],
-        "text": ""
-      }
-    }
-  }; }
-  static get states() { return {
-    "ignored": {}
-  }; }
-}
-function useRegisterDemo(props) {
-  return deepmerge({
-    states: {
-      error: "",
-      loading: false,
-      confirmPassword: true,
-      hideInputs: props.hideInputs || false,
-      customPasswordField: false,
-      loginPath: "/login",
-    },
-    callbacks: {
-      submit: async (_event) => {
-        console.log("submit");
-      },
-      inputFunction: () => { },
-    },
-    refs: {
-      formRef: {},
-    },
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
-}
+import { isDemo, navigation } from "@saasquatch/component-boilerplate";
+import { withHooks } from "@saasquatch/stencil-hooks";
+import { Component, h, Prop, State } from "@stencil/core";
+import deepmerge from "deepmerge";
+import { PortalRegistrationFormView, } from "./sqm-portal-registration-form-view";
+import { usePortalRegistrationForm } from "./usePortalRegistrationForm";
+/**
+ * @uiName Microsite Registration
+ * @slots [{"name":"formData","title":"Additional Fields"},{"name":"terms","title":"Terms And Conditions Fields"}]
+ */
+export class PortalRegistrationForm {
+  constructor() {
+    this.ignored = true;
+    /**
+     * Redirect participants to this page after they successfully register.
+     *
+     * @uiName Registration Redirect
+     * @uiWidget pageSelect
+     */
+    this.nextPage = "/";
+    /**
+     * Redirect participants to this page from their verification email
+     *
+     * @uiName Email Verification Redirect
+     * @uiWidget pageSelect
+     */
+    this.redirectPath = "/verifyEmail";
+    /**
+     * @uiName Email Field Label
+     */
+    this.emailLabel = "Email";
+    /**
+     * @uiName Password Field Label
+     */
+    this.passwordLabel = "Password";
+    /**
+     * @uiName Submit Button Text
+     */
+    this.submitLabel = "Register";
+    /**
+     * @uiName Login Button Text
+     */
+    this.loginLabel = "Sign in";
+    /**
+     * @uiName Confirm Password Field Label
+     */
+    this.confirmPasswordLabel = "Confirm Password";
+    /**
+     * @uiName Show Confirm Password Field
+     */
+    this.confirmPassword = false;
+    /**
+     * @uiName Disable Password Validation
+     */
+    this.disablePasswordValidation = false;
+    /**
+     * Hides the email and password fields. Note: If you hide default inputs, you must add additional input fields. They must have the input name attributes "email" and "password" for this form to succeed.
+     *
+     * @uiName Hide Default Fields
+     */
+    this.hideInputs = false;
+    /**
+     * @uiName Header Text
+     */
+    this.pageLabel = "Register";
+    /**
+     * Redirect participants to this page after clicking the login button.
+     *
+     * @uiName Login Redirect
+     * @uiWidget pageSelect
+     */
+    this.loginPath = "/login";
+    /**
+     * The message to be displayed when a required field is not filled.
+     *
+     * @uiName Required Field Message
+     * @uiWidget textArea
+     */
+    this.requiredFieldErrorMessage = "Cannot be empty";
+    /**
+     * The message to be displayed when a the form submission fails unexpectedly.
+     *
+     * @uiName Network Error Message
+     * @uiWidget textArea
+     */
+    this.networkErrorMessage = "Network request failed.";
+    /**
+     * The message to be displayed when password inputs do not match.
+     *
+     * @uiName Password Mismatch Message
+     * @uiWidget textArea
+     */
+    this.passwordMismatchErrorMessage = "Passwords do not match.";
+    /**
+     * The message to be displayed when the email used is invalid or blocked.
+     *
+     * @uiName Invalid Email Message
+     * @uiWidget textArea
+     */
+    this.invalidEmailErrorMessage = "Must be a valid email address";
+    /**
+     * The message to be displayed when the registration form is disabled.
+     *
+     * @uiName Form Disabled Message
+     * @uiWidget textArea
+     */
+    this.formDisabledErrorMessage = "The registration form is currently disabled.";
+    withHooks(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const { states, callbacks, refs } = isDemo()
+      ? useRegisterDemo(this)
+      : usePortalRegistrationForm(this);
+    const content = {
+      formData: h("slot", { name: "formData" }),
+      secondaryButton: (h("slot", { name: "secondaryButton" },
+        h("sl-button", { type: "text", disabled: states.loading, onClick: () => navigation.push(states.loginPath) }, this.loginLabel))),
+      terms: h("slot", { name: "terms" }),
+      emailLabel: this.emailLabel,
+      passwordLabel: this.passwordLabel,
+      submitLabel: this.submitLabel,
+      pageLabel: this.pageLabel,
+      confirmPasswordLabel: this.confirmPasswordLabel,
+      networkErrorMessage: this.networkErrorMessage,
+      passwordMismatchErrorMessage: this.passwordMismatchErrorMessage,
+      invalidEmailErrorMessage: this.invalidEmailErrorMessage,
+      formDisabledErrorMessage: this.formDisabledErrorMessage,
+      requiredFieldErrorMessage: this.requiredFieldErrorMessage,
+    };
+    return (h(PortalRegistrationFormView, { states: states, callbacks: callbacks, content: content, refs: refs }));
+  }
+  static get is() { return "sqm-portal-registration-form"; }
+  static get encapsulation() { return "shadow"; }
+  static get properties() { return {
+    "nextPage": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Registration Redirect",
+            "name": "uiName"
+          }, {
+            "text": "pageSelect",
+            "name": "uiWidget"
+          }],
+        "text": "Redirect participants to this page after they successfully register."
+      },
+      "attribute": "next-page",
+      "reflect": false,
+      "defaultValue": "\"/\""
+    },
+    "redirectPath": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Email Verification Redirect",
+            "name": "uiName"
+          }, {
+            "text": "pageSelect",
+            "name": "uiWidget"
+          }],
+        "text": "Redirect participants to this page from their verification email"
+      },
+      "attribute": "redirect-path",
+      "reflect": false,
+      "defaultValue": "\"/verifyEmail\""
+    },
+    "emailLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Email Field Label",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "email-label",
+      "reflect": false,
+      "defaultValue": "\"Email\""
+    },
+    "passwordLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Password Field Label",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "password-label",
+      "reflect": false,
+      "defaultValue": "\"Password\""
+    },
+    "submitLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Submit Button Text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "submit-label",
+      "reflect": false,
+      "defaultValue": "\"Register\""
+    },
+    "loginLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Login Button Text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "login-label",
+      "reflect": false,
+      "defaultValue": "\"Sign in\""
+    },
+    "confirmPasswordLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Confirm Password Field Label",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "confirm-password-label",
+      "reflect": false,
+      "defaultValue": "\"Confirm Password\""
+    },
+    "confirmPassword": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Show Confirm Password Field",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "confirm-password",
+      "reflect": false,
+      "defaultValue": "false"
+    },
+    "disablePasswordValidation": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Disable Password Validation",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "disable-password-validation",
+      "reflect": false,
+      "defaultValue": "false"
+    },
+    "hideInputs": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Hide Default Fields",
+            "name": "uiName"
+          }],
+        "text": "Hides the email and password fields. Note: If you hide default inputs, you must add additional input fields. They must have the input name attributes \"email\" and \"password\" for this form to succeed."
+      },
+      "attribute": "hide-inputs",
+      "reflect": false,
+      "defaultValue": "false"
+    },
+    "pageLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Header Text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "page-label",
+      "reflect": false,
+      "defaultValue": "\"Register\""
+    },
+    "loginPath": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Login Redirect",
+            "name": "uiName"
+          }, {
+            "text": "pageSelect",
+            "name": "uiWidget"
+          }],
+        "text": "Redirect participants to this page after clicking the login button."
+      },
+      "attribute": "login-path",
+      "reflect": false,
+      "defaultValue": "\"/login\""
+    },
+    "requiredFieldErrorMessage": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Required Field Message",
+            "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
+          }],
+        "text": "The message to be displayed when a required field is not filled."
+      },
+      "attribute": "required-field-error-message",
+      "reflect": false,
+      "defaultValue": "\"Cannot be empty\""
+    },
+    "networkErrorMessage": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Network Error Message",
+            "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
+          }],
+        "text": "The message to be displayed when a the form submission fails unexpectedly."
+      },
+      "attribute": "network-error-message",
+      "reflect": false,
+      "defaultValue": "\"Network request failed.\""
+    },
+    "passwordMismatchErrorMessage": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Password Mismatch Message",
+            "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
+          }],
+        "text": "The message to be displayed when password inputs do not match."
+      },
+      "attribute": "password-mismatch-error-message",
+      "reflect": false,
+      "defaultValue": "\"Passwords do not match.\""
+    },
+    "invalidEmailErrorMessage": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Invalid Email Message",
+            "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
+          }],
+        "text": "The message to be displayed when the email used is invalid or blocked."
+      },
+      "attribute": "invalid-email-error-message",
+      "reflect": false,
+      "defaultValue": "\"Must be a valid email address\""
+    },
+    "formDisabledErrorMessage": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Form Disabled Message",
+            "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
+          }],
+        "text": "The message to be displayed when the registration form is disabled."
+      },
+      "attribute": "form-disabled-error-message",
+      "reflect": false,
+      "defaultValue": "\"The registration form is currently disabled.\""
+    },
+    "formKey": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Form Key",
+            "name": "uiName"
+          }, {
+            "text": undefined,
+            "name": "required"
+          }],
+        "text": "The key of the registration form used for this microsite."
+      },
+      "attribute": "form-key",
+      "reflect": false
+    },
+    "demoData": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "DemoData<PortalRegistrationFormViewProps>",
+        "resolved": "{ states?: { error: string; loading: boolean; confirmPassword: boolean; hideInputs: boolean; registrationFormState?: RegistrationFormState; enablePasswordValidation?: boolean; loginPath: string; }; refs?: { formRef: any; }; content?: { formData?: VNode; terms?: VNode; passwordField?: VNode; secondaryButton?: VNode; emailLabel?: string; passwordLabel?: string; submitLabel?: string; pageLabel?: string; confirmPasswordLabel?: string; networkErrorMessage?: string; passwordMismatchErrorMessage?: string; invalidEmailErrorMessage?: string; formDisabledErrorMessage?: string; requiredFieldErrorMessage?: string; }; }",
+        "references": {
+          "DemoData": {
+            "location": "import",
+            "path": "../../global/demo"
+          },
+          "PortalRegistrationFormViewProps": {
+            "location": "import",
+            "path": "./sqm-portal-registration-form-view"
+          }
+        }
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [{
+            "text": undefined,
+            "name": "undocumented"
+          }, {
+            "text": "object",
+            "name": "uiType"
+          }],
+        "text": ""
+      }
+    }
+  }; }
+  static get states() { return {
+    "ignored": {}
+  }; }
+}
+function useRegisterDemo(props) {
+  return deepmerge({
+    states: {
+      error: "",
+      loading: false,
+      confirmPassword: props.confirmPassword,
+      hideInputs: props.hideInputs || false,
+      customPasswordField: false,
+      loginPath: "/login",
+    },
+    callbacks: {
+      submit: async (_event) => {
+        console.log("submit");
+      },
+      inputFunction: () => { },
+    },
+    refs: {
+      formRef: {},
+    },
+  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+}