@saasquatch/mint-components 1.6.2-21 → 1.6.2-22

package/dist/cjs/{ShadowViewAddon-312e517f.js → ShadowViewAddon-4b75a331.js}

@@ -1619,18 +1619,17 @@ function PortalRegisterView(props) {
           if (!value.includes("@")) {
             return "Must be a valid email address";
           }
-        } }, (((_b = (_a = states.validationState) === null || _a === void 0 ? void 0 : _a.validationErrors) === null || _b === void 0 ? void 0 : _b.email) ? {
+        } }, (((_b = (_a = states.registrationFormState) === null || _a === void 0 ? void 0 : _a.validationErrors) === null || _b === void 0 ? void 0 : _b.email) ? {
         class: sheet$5.classes.ErrorStyle,
-        helpText: ((_d = (_c = states.validationState) === null || _c === void 0 ? void 0 : _c.validationErrors) === null || _d === void 0 ? void 0 : _d.email) ||
+        helpText: ((_d = (_c = states.registrationFormState) === null || _c === void 0 ? void 0 : _c.validationErrors) === null || _d === void 0 ? void 0 : _d.email) ||
           "Cannot be empty",
       }
         : [])))),
       !states.hideInputs && (index.h("sqm-password-field", { fieldLabel: content.passwordLabel, "disable-validation": states.disablePasswordValidation })),
       content.passwordField,
-      !states.hideInputs && states.confirmPassword && (index.h("sl-input", Object.assign({ exportparts: "label: input-label", type: "password", name: "/confirmPassword", label: content.confirmPasswordLabel, disabled: states.loading, required: true }, (((_f = (_e = states.validationState) === null || _e === void 0 ? void 0 : _e.validationErrors) === null || _f === void 0 ? void 0 : _f.confirmPassword) ? {
+      !states.hideInputs && states.confirmPassword && (index.h("sl-input", Object.assign({ exportparts: "label: input-label", type: "password", name: "/confirmPassword", label: content.confirmPasswordLabel, disabled: states.loading, required: true }, (((_f = (_e = states.registrationFormState) === null || _e === void 0 ? void 0 : _e.validationErrors) === null || _f === void 0 ? void 0 : _f.confirmPassword) ? {
         class: sheet$5.classes.ErrorStyle,
-        helpText: ((_h = (_g = states.validationState) === null || _g === void 0 ? void 0 : _g.validationErrors) === null || _h === void 0 ? void 0 : _h.confirmPassword) ||
-          "Cannot be empty",
+        helpText: ((_h = (_g = states.registrationFormState) === null || _g === void 0 ? void 0 : _g.validationErrors) === null || _h === void 0 ? void 0 : _h.confirmPassword) || "Cannot be empty",
       }
         : [])))),
       content.terms,
@@ -2446,23 +2445,23 @@ sl-input::part(label){
 const sheet$9 = JSS.createStyleSheet(style$9);
 const styleString$9 = sheet$9.toString();
 function NameFieldsView(props) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
   const { states } = props;
-  const validationErrors = states === null || states === void 0 ? void 0 : states.validationErrors;
+  const validationErrors = (_a = states === null || states === void 0 ? void 0 : states.registrationFormState) === null || _a === void 0 ? void 0 : _a.validationErrors;
   return (index.h("div", { class: sheet$9.classes.FieldsContainer },
     index.h("style", { type: "text/css" },
       vanillaStyle$3,
       styleString$9),
-    index.h("sl-input", Object.assign({ exportparts: "label: input-label", name: "/firstName", type: "text", label: states.content.firstNameLabel, required: true, disabled: ((_a = states.registrationFormState) === null || _a === void 0 ? void 0 : _a.loading) || ((_b = states.registrationFormState) === null || _b === void 0 ? void 0 : _b.disabled) }, (((_d = (_c = states.registrationFormState) === null || _c === void 0 ? void 0 : _c.initialData) === null || _d === void 0 ? void 0 : _d.firstName) ? {
-      value: (_f = (_e = states.registrationFormState) === null || _e === void 0 ? void 0 : _e.initialData) === null || _f === void 0 ? void 0 : _f.firstName,
+    index.h("sl-input", Object.assign({ exportparts: "label: input-label", name: "/firstName", type: "text", label: states.content.firstNameLabel, required: true, disabled: ((_b = states.registrationFormState) === null || _b === void 0 ? void 0 : _b.loading) || ((_c = states.registrationFormState) === null || _c === void 0 ? void 0 : _c.disabled) }, (((_e = (_d = states.registrationFormState) === null || _d === void 0 ? void 0 : _d.initialData) === null || _e === void 0 ? void 0 : _e.firstName) ? {
+      value: (_g = (_f = states.registrationFormState) === null || _f === void 0 ? void 0 : _f.initialData) === null || _g === void 0 ? void 0 : _g.firstName,
     }
       : {}), ((validationErrors === null || validationErrors === void 0 ? void 0 : validationErrors.firstName) ? {
       class: sheet$9.classes.ErrorStyle,
       helpText: (validationErrors === null || validationErrors === void 0 ? void 0 : validationErrors.firstName) || "Cannot be empty",
     }
       : []))),
-    index.h("sl-input", Object.assign({ exportparts: "label: input-label", name: "/lastName", type: "text", label: states.content.lastNameLabel, required: true, disabled: ((_g = states.registrationFormState) === null || _g === void 0 ? void 0 : _g.loading) || ((_h = states.registrationFormState) === null || _h === void 0 ? void 0 : _h.disabled) }, (((_k = (_j = states.registrationFormState) === null || _j === void 0 ? void 0 : _j.initialData) === null || _k === void 0 ? void 0 : _k.lastName) ? {
-      value: (_m = (_l = states.registrationFormState) === null || _l === void 0 ? void 0 : _l.initialData) === null || _m === void 0 ? void 0 : _m.lastName,
+    index.h("sl-input", Object.assign({ exportparts: "label: input-label", name: "/lastName", type: "text", label: states.content.lastNameLabel, required: true, disabled: ((_h = states.registrationFormState) === null || _h === void 0 ? void 0 : _h.loading) || ((_j = states.registrationFormState) === null || _j === void 0 ? void 0 : _j.disabled) }, (((_l = (_k = states.registrationFormState) === null || _k === void 0 ? void 0 : _k.initialData) === null || _l === void 0 ? void 0 : _l.lastName) ? {
+      value: (_o = (_m = states.registrationFormState) === null || _m === void 0 ? void 0 : _m.initialData) === null || _o === void 0 ? void 0 : _o.lastName,
     }
       : {}), ((validationErrors === null || validationErrors === void 0 ? void 0 : validationErrors.lastName) ? {
       class: sheet$9.classes.ErrorStyle,
@@ -2513,8 +2512,9 @@ JSS.jss.setup(JSS.create());
 const sheet$a = JSS.jss.createStyleSheet(style$a);
 const styleString$a = sheet$a.toString();
 function CheckboxFieldView(props) {
+  var _a, _b, _c, _d, _e, _f, _g;
   const { states, content, callbacks } = props;
-  const validationErrors = states === null || states === void 0 ? void 0 : states.validationErrors;
+  const validationErrors = (_a = states === null || states === void 0 ? void 0 : states.registrationFormState) === null || _a === void 0 ? void 0 : _a.validationErrors;
   return (index.h("div", { class: sheet$a.classes.FieldContainer },
     index.h("style", { type: "text/css" },
       vanillaStyle$4,
@@ -2522,7 +2522,10 @@ function CheckboxFieldView(props) {
     index.h("sl-checkbox", Object.assign({ exportparts: "label: input-label", name: `/${content.checkboxName}`, checked: states.checked, "onSl-change": (e) => {
         e.target.value = e.target.checked;
         callbacks.setChecked(e.target.value);
-      } }, (!content.checkboxOptional ? { required: true } : []), (!states.checked && (validationErrors === null || validationErrors === void 0 ? void 0 : validationErrors[content.checkboxName])
+      } }, (!content.checkboxOptional ? { required: true } : []), { disabled: ((_b = states.registrationFormState) === null || _b === void 0 ? void 0 : _b.loading) || ((_c = states.registrationFormState) === null || _c === void 0 ? void 0 : _c.disabled) }, (((_e = (_d = states.registrationFormState) === null || _d === void 0 ? void 0 : _d.initialData) === null || _e === void 0 ? void 0 : _e[content.checkboxName]) ? {
+      value: (_g = (_f = states.registrationFormState) === null || _f === void 0 ? void 0 : _f.initialData) === null || _g === void 0 ? void 0 : _g[content.checkboxName],
+    }
+      : {}), (!states.checked && (validationErrors === null || validationErrors === void 0 ? void 0 : validationErrors[content.checkboxName])
       ? {
         class: sheet$a.classes.ErrorStyle,
       }
@@ -2570,13 +2573,17 @@ JSS.jss.setup(JSS.create());
 const sheet$b = JSS.jss.createStyleSheet(style$b);
 const styleString$b = sheet$b.toString();
 function DropdownFieldView(props) {
+  var _a, _b, _c, _d, _e, _f, _g;
   const { states, content } = props;
-  const validationErrors = states === null || states === void 0 ? void 0 : states.validationErrors;
+  const validationErrors = (_a = states === null || states === void 0 ? void 0 : states.registrationFormState) === null || _a === void 0 ? void 0 : _a.validationErrors;
   return (index.h("div", { class: sheet$b.classes.FieldContainer },
     index.h("style", { type: "text/css" },
       vanillaStyle$5,
       styleString$b),
-    index.h("sl-select", Object.assign({ exportparts: "label: input-label", label: content.dropdownLabel, name: `/${content.dropdownName}` }, (!content.dropdownOptional ? { required: true } : []), ((validationErrors === null || validationErrors === void 0 ? void 0 : validationErrors[content.dropdownName]) ? {
+    index.h("sl-select", Object.assign({ exportparts: "label: input-label", label: content.dropdownLabel, name: `/${content.dropdownName}` }, (!content.dropdownOptional ? { required: true } : []), { disabled: ((_b = states.registrationFormState) === null || _b === void 0 ? void 0 : _b.loading) || ((_c = states.registrationFormState) === null || _c === void 0 ? void 0 : _c.disabled) }, (((_e = (_d = states.registrationFormState) === null || _d === void 0 ? void 0 : _d.initialData) === null || _e === void 0 ? void 0 : _e[content.dropdownName]) ? {
+      value: (_g = (_f = states.registrationFormState) === null || _f === void 0 ? void 0 : _f.initialData) === null || _g === void 0 ? void 0 : _g[content.dropdownName],
+    }
+      : {}), ((validationErrors === null || validationErrors === void 0 ? void 0 : validationErrors[content.dropdownName]) ? {
       class: sheet$b.classes.ErrorStyle,
     }
       : [])), content.selectOptions),
@@ -2603,13 +2610,17 @@ JSS.jss.setup(JSS.create());
 const sheet$c = JSS.jss.createStyleSheet(style$c);
 const styleString$c = sheet$c.toString();
 function InputFieldView(props) {
+  var _a, _b, _c, _d, _e, _f, _g;
   const { states, content } = props;
-  const validationErrors = states === null || states === void 0 ? void 0 : states.validationErrors;
+  const validationErrors = (_a = states === null || states === void 0 ? void 0 : states.registrationFormState) === null || _a === void 0 ? void 0 : _a.validationErrors;
   return (index.h("div", { class: sheet$c.classes.FieldContainer },
     index.h("style", { type: "text/css" },
       vanillaStyle$6,
       styleString$c),
-    index.h("sl-input", Object.assign({ exportparts: "label: input-label", name: `/${content.fieldName}`, type: content.fieldType, label: content.fieldLabel }, (!content.fieldOptional ? { required: true } : []), ((validationErrors === null || validationErrors === void 0 ? void 0 : validationErrors[content.fieldName]) ? {
+    index.h("sl-input", Object.assign({ exportparts: "label: input-label", name: `/${content.fieldName}`, type: content.fieldType, label: content.fieldLabel }, (!content.fieldOptional ? { required: true } : []), { disabled: ((_b = states.registrationFormState) === null || _b === void 0 ? void 0 : _b.loading) || ((_c = states.registrationFormState) === null || _c === void 0 ? void 0 : _c.disabled) }, (((_e = (_d = states.registrationFormState) === null || _d === void 0 ? void 0 : _d.initialData) === null || _e === void 0 ? void 0 : _e[content.fieldName]) ? {
+      value: (_g = (_f = states.registrationFormState) === null || _f === void 0 ? void 0 : _f.initialData) === null || _g === void 0 ? void 0 : _g[content.fieldName],
+    }
+      : {}), ((validationErrors === null || validationErrors === void 0 ? void 0 : validationErrors[content.fieldName]) ? {
       class: sheet$c.classes.ErrorStyle,
       helpText: global.intl.formatMessage({
         id: `errorMessage-${content.fieldName}`,

package/dist/cjs/sqm-big-stat_35.cjs.entry.js

@@ -18,8 +18,8 @@ const utils = require('./utils-6847bc06.js');
 require('./sqm-text-span-view-b318af73.js');
 require('./sqm-portal-container-view-2ddcaa12.js');
 const AsYouType = require('./AsYouType-6788393a.js');
-const useRegistrationFormState = require('./useRegistrationFormState-d0e43ca9.js');
-const ShadowViewAddon = require('./ShadowViewAddon-312e517f.js');
+const useRegistrationFormState = require('./useRegistrationFormState-bee054d6.js');
+const ShadowViewAddon = require('./ShadowViewAddon-4b75a331.js');
 require('./sqm-portal-section-view-1e5bbcb1.js');
 
 const BigStat = class {
@@ -186,11 +186,11 @@ function RequiredPropsError({ missingProps, heading = "There was a problem loadi
 }
 
 function useCheckboxField() {
-  const validationState = stencilHooks_module.d(useRegistrationFormState.FORM_VALIDATION_CONTEXT);
+  const registrationFormState = stencilHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
   const [checked, setChecked] = stencilHooks_module.useState(false);
   return {
     states: {
-      validationErrors: validationState === null || validationState === void 0 ? void 0 : validationState.validationErrors,
+      registrationFormState,
       checked,
     },
     callbacks: {
@@ -251,7 +251,7 @@ const CheckboxField = class {
 function useCheckboxFieldDemo(props) {
   return cjs.cjs({
     states: {
-      validationErrors: [],
+      registrationFormState: {},
       checked: false,
     },
     callbacks: {
@@ -315,7 +315,7 @@ const DividedLayout = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     /**
-     * Uses Shorthand CSS border syntax allowing specification of thickness, fill style and color.
+     * Uses Shorthand CSS border syntax
      * @uiName Border Style
      */
     this.dividerStyle = "1px solid #EAEAEA";
@@ -328,10 +328,10 @@ const DividedLayout = class {
 };
 
 function useDropdownField() {
-  const validationState = stencilHooks_module.d(useRegistrationFormState.FORM_VALIDATION_CONTEXT);
+  const registrationFormState = stencilHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
   return {
     states: {
-      validationErrors: validationState === null || validationState === void 0 ? void 0 : validationState.validationErrors,
+      registrationFormState,
     },
   };
 }
@@ -379,7 +379,7 @@ const DropdownField = class {
 function useDropdownFieldDemo(props) {
   return cjs.cjs({
     states: {
-      validationErrors: [],
+      registrationFormState: {},
     },
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }
@@ -819,10 +819,10 @@ const SqmHookStoryContainer = class {
 };
 
 function useInputField() {
-  const validationState = stencilHooks_module.d(useRegistrationFormState.FORM_VALIDATION_CONTEXT);
+  const registrationFormState = stencilHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
   return {
     states: {
-      validationErrors: validationState === null || validationState === void 0 ? void 0 : validationState.validationErrors,
+      registrationFormState: registrationFormState,
     },
   };
 }
@@ -870,7 +870,7 @@ const InputField = class {
 function useInputFieldDemo(props) {
   return cjs.cjs({
     states: {
-      validationErrors: [],
+      registrationFormState: {},
     },
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }
@@ -1112,10 +1112,8 @@ function useLeaderboardDemo(props) {
 
 function useNameFields(props) {
   const registrationFormState = stencilHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
-  const validationState = stencilHooks_module.d(useRegistrationFormState.FORM_VALIDATION_CONTEXT);
   return {
     states: {
-      validationErrors: validationState === null || validationState === void 0 ? void 0 : validationState.validationErrors,
       registrationFormState,
       content: {
         lastNameLabel: props.lastNameLabel,
@@ -1294,25 +1292,25 @@ const PortalChangePassword = class {
      */
     this.modalChangePasswordHeader = "Change Password";
     /**
-     * Found in modal
+     * Modal cancel button text
      *
      * @uiName Cancel Button Text
      */
     this.cancelText = "Cancel";
     /**
-     * Found in modal
+     * Modal change password button text
      *
      * @uiName Change Password Button Text
      */
     this.changePasswordButtonText = "Change Password";
     /**
-     * Found in modal
+     * Password input field label
      *
-     * @uiName New Password Field Label
+     * @uiName Password Label
      */
     this.passwordFieldLabel = "New Password";
     /**
-     * Found in modal
+     * Password confirmation input field label
      *
      * @uiName Confirm Password Label
      */
@@ -1458,9 +1456,9 @@ const PortalLogin = class {
     index.registerInstance(this, hostRef);
     this.ignored = true;
     /**
-     * Redirect participants to this page after they successfully login.
+     * Page participants are navigated to after login.
      *
-     * @uiName Login Redirect
+     * @uiName Login Redirect Path
      * @uiWidget pageSelect
      */
     this.nextPage = "/";
@@ -1477,8 +1475,7 @@ const PortalLogin = class {
      */
     this.submitLabel = "Sign In";
     /**
-     * Redirect participants to this page to reset their password
-     * @uiName Forgot Password Redirect
+     * @uiName Forgot Password Redirect Path
      * @uiWidget pageSelect
      */
     this.forgotPasswordPath = "/forgotPassword";
@@ -1491,8 +1488,7 @@ const PortalLogin = class {
      */
     this.registerLabel = "Register";
     /**
-     * Redirect participants to this page to start registration.
-     * @uiName Register Button Redirect
+     * @uiName Register Button Redirect Path
      * @uiWidget pageSelect
      */
     this.registerPath = "/register";
@@ -1538,7 +1534,7 @@ function useLoginDemo(props) {
 function usePortalRegister(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j;
   const formRef = stencilHooks_module.useRef(null);
-  const { validationState, setValidationState } = useRegistrationFormState.useValidationState({});
+  const { registrationFormState, setRegistrationFormState } = useRegistrationFormState.useRegistrationFormState({});
   const [request, { loading, errors, data }] = index_module.je();
   stencilHooks_module.useEffect(() => {
     if (!formRef.current)
@@ -1579,11 +1575,16 @@ function usePortalRegister(props) {
         confirmPassword: "Passwords do not match.",
       };
     }
-    setValidationState({ error: "", validationErrors });
     if (Object.keys(validationErrors).length) {
+      setRegistrationFormState({ loading: false, error: "", validationErrors });
       // early return for validation errors
       return;
     }
+    setRegistrationFormState({
+      loading: true,
+      error: "",
+      validationErrors: {},
+    });
     const { email, password } = formData;
     delete formData.email;
     delete formData.password;
@@ -1601,12 +1602,21 @@ function usePortalRegister(props) {
       if (result instanceof Error) {
         throw result;
       }
+      setRegistrationFormState({
+        loading: false,
+        error: "",
+        validationErrors: {},
+      });
       if ((_a = result.registerManagedIdentityWithEmailAndPassword) === null || _a === void 0 ? void 0 : _a.token) {
         index_module.fn.push(props.nextPage);
       }
     }
     catch (error) {
-      setValidationState({ error: "Network request failed." });
+      setRegistrationFormState({
+        loading: false,
+        error: "Network request failed.",
+        validationErrors: {},
+      });
     }
   };
   const inputFunction = useCallback.useCallback((e) => {
@@ -1626,13 +1636,13 @@ function usePortalRegister(props) {
   }
   else {
     errorMessage =
-      ((_f = (_e = (_d = (_c = errors === null || errors === void 0 ? void 0 : errors.response) === null || _c === void 0 ? void 0 : _c.errors) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.extensions) === null || _f === void 0 ? void 0 : _f.message) || ((_j = (_h = (_g = errors === null || errors === void 0 ? void 0 : errors.response) === null || _g === void 0 ? void 0 : _g.errors) === null || _h === void 0 ? void 0 : _h[0]) === null || _j === void 0 ? void 0 : _j.message) || (validationState === null || validationState === void 0 ? void 0 : validationState.error);
+      ((_f = (_e = (_d = (_c = errors === null || errors === void 0 ? void 0 : errors.response) === null || _c === void 0 ? void 0 : _c.errors) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.extensions) === null || _f === void 0 ? void 0 : _f.message) || ((_j = (_h = (_g = errors === null || errors === void 0 ? void 0 : errors.response) === null || _g === void 0 ? void 0 : _g.errors) === null || _h === void 0 ? void 0 : _h[0]) === null || _j === void 0 ? void 0 : _j.message) || (registrationFormState === null || registrationFormState === void 0 ? void 0 : registrationFormState.error);
   }
   return {
     states: {
       loading,
       error: errorMessage,
-      validationState,
+      registrationFormState,
       confirmPassword: props.confirmPassword,
       hideInputs: props.hideInputs,
       loginPath: props.loginPath,
@@ -1653,16 +1663,16 @@ const PortalRegister = class {
     index.registerInstance(this, hostRef);
     this.ignored = true;
     /**
-     * Redirect participants to this page from their verification email
+     * Page participants are navigated to after registration.
      *
-     * @uiName Registration Redirect
+     * @uiName Registration Redirect Path
      * @uiWidget pageSelect
      */
     this.nextPage = "/";
     /**
      * The page that participants are redirected to from the verification email.
      *
-     * @uiName Email Verification Redirect
+     * @uiName Email Redirection Path
      * @uiWidget pageSelect
      */
     this.redirectPath = "/verifyEmail";
@@ -1683,10 +1693,12 @@ const PortalRegister = class {
      */
     this.loginLabel = "Sign in";
     /**
-     * @uiName Confirm Password Field Label
+     * @uiName Confirm Password Label
      */
     this.confirmPasswordLabel = "Confirm Password";
     /**
+     * Show or hide the confirm password input.
+     *
      * @uiName Show Confirm Password Field
      */
     this.confirmPassword = false;
@@ -1695,9 +1707,9 @@ const PortalRegister = class {
      */
     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.
+     * Hide default input fields to use custom fields.
      *
-     * @uiName Hide Default Fields
+     * @uiName Hide Default Inputs
      */
     this.hideInputs = false;
     /**
@@ -1705,9 +1717,9 @@ const PortalRegister = class {
      */
     this.pageLabel = "Register";
     /**
-     * Redirect participants to this page after clicking the login button.
+     * Login button redirection path.
      *
-     * @uiName Login Redirect
+     * @uiName Login Redirect Path
      * @uiWidget pageSelect
      */
     this.loginPath = "/login";
@@ -2031,12 +2043,12 @@ const SqmReferralIframe = class {
     index.registerInstance(this, hostRef);
     this.ignored = true;
     /**
-     * Define the height of the iframe with any valid CSS height value. Example: 100px, 5rem, or auto.
+     * Height of the iframe container
      * @uiName Iframe Height
      */
     this.iframeHeight = "100%";
     /**
-     * Width of the iframe container  to Define the width of the iframe with any valid CSS width value. Example: 100px, 5rem, or auto.
+     * Width of the iframe container
      * @uiName Iframe Width
      */
     this.iframeWidth = "100%";
@@ -3835,11 +3847,11 @@ const UserName = class {
     index.registerInstance(this, hostRef);
     this.ignored = true;
     /**
-     * @uiName Unknown User Name
+     * Fallback name for unknown users
+     * @uiName Fallback Name
      */
     this.fallback = "Anonymous User";
     /**
-     * Text displayed while the participant’s name is loading.
      * @uiName Loading Text
      */
     this.loadingText = "...";

package/dist/cjs/sqm-password-field.cjs.entry.js

@@ -9,7 +9,7 @@ const index_module = require('./index.module-93c78ac7.js');
 const cjs = require('./cjs-1066ec21.js');
 const mixins = require('./mixins-fe9d4112.js');
 const JSS = require('./JSS-8503a151.js');
-const useRegistrationFormState = require('./useRegistrationFormState-d0e43ca9.js');
+const useRegistrationFormState = require('./useRegistrationFormState-bee054d6.js');
 
 var constants = {
   error: {
@@ -487,7 +487,7 @@ const vanillaStyle = `
 const sheet$1 = JSS.createStyleSheet(style$1);
 const styleString$1 = sheet$1.toString();
 function PortalResetPasswordView(props) {
-  var _a, _b, _c, _d, _e, _f, _g, _h;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
   const { states, callbacks } = props;
   return (index.h("div", { class: sheet$1.classes.InputContainer },
     index.h("style", { type: "text/css" },
@@ -500,16 +500,16 @@ function PortalResetPasswordView(props) {
       } }, (((_d = (_c = states.registrationFormState) === null || _c === void 0 ? void 0 : _c.initialData) === null || _d === void 0 ? void 0 : _d.password) ? {
       value: (_f = (_e = states.registrationFormState) === null || _e === void 0 ? void 0 : _e.initialData) === null || _f === void 0 ? void 0 : _f.password,
     }
-      : {}), (((_g = states.validationErrors) === null || _g === void 0 ? void 0 : _g.password) ? {
+      : {}), (((_h = (_g = states.registrationFormState) === null || _g === void 0 ? void 0 : _g.validationErrors) === null || _h === void 0 ? void 0 : _h.password) ? {
       class: sheet$1.classes.ErrorStyle,
-      helpText: ((_h = states.validationErrors) === null || _h === void 0 ? void 0 : _h.password) || "Cannot be empty",
+      helpText: ((_k = (_j = states.registrationFormState) === null || _j === void 0 ? void 0 : _j.validationErrors) === null || _k === void 0 ? void 0 : _k.password) ||
+        "Cannot be empty",
     }
       : []), { onInput: (input) => states.enableValidation && callbacks.onInput(input) })),
     states.dynamicValidation));
 }
 
 function usePasswordField(props) {
-  const validationState = stencilHooks_module.d(useRegistrationFormState.FORM_VALIDATION_CONTEXT);
   const registrationFormState = stencilHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
   const [dynamicValidation, setDynamicValidation] = stencilHooks_module.useState("");
   function onInput(input) {
@@ -521,7 +521,6 @@ function usePasswordField(props) {
       enableValidation: !props.disableValidation,
       dynamicValidation,
       registrationFormState,
-      validationErrors: validationState === null || validationState === void 0 ? void 0 : validationState.validationErrors,
       content: {
         fieldLabel: props.fieldLabel,
       },
@@ -574,8 +573,7 @@ function usePasswordFieldDemo(props) {
     states: {
       enableValidation: !props.disableValidation,
       dynamicValidation,
-      validationErrors: ((_f = (_e = props === null || props === void 0 ? void 0 : props.demoData) === null || _e === void 0 ? void 0 : _e.states) === null || _f === void 0 ? void 0 : _f.validationErrors) || {},
-      registrationFormState: {},
+      registrationFormState: ((_f = (_e = props === null || props === void 0 ? void 0 : props.demoData) === null || _e === void 0 ? void 0 : _e.states) === null || _f === void 0 ? void 0 : _f.registrationFormState) || {},
       content: {
         fieldLabel: props.fieldLabel,
       },

package/dist/cjs/sqm-portal-email-verification.cjs.entry.js

@@ -64,9 +64,9 @@ const PortalEmailVerification = class {
     index.registerInstance(this, hostRef);
     this.ignored = true;
     /**
-     * Redirect participants to this page from their verification email.
+     * The microsite page that participants are redirected to from the verification email.
      *
-     * @uiName Email Redirect
+     * @uiName Email Redirection Path
      * @uiWidget pageSelect
      */
     this.redirectPath = "/verifyEmail";

package/dist/cjs/sqm-portal-forgot-password.cjs.entry.js

@@ -62,9 +62,9 @@ const PortalForgotPassword = class {
     index.registerInstance(this, hostRef);
     this.ignored = true;
     /**
-     * Redirect participants to this page after they verify their email.
+     * The microsite page that participants are redirected to from the password reset email.
      *
-     * @uiName Email Redirect
+     * @uiName Email Redirection Path
      * @uiWidget pageSelect
      */
     this.redirectPath = "/resetPassword";

package/dist/cjs/sqm-portal-logout.cjs.entry.js

@@ -17,7 +17,7 @@ const PortalLogout = class {
     index.registerInstance(this, hostRef);
     this.ignored = true;
     /**
-     * Redirect participants to this page when they log out.
+     * Redirect participants to this path when they log out
      *
      * @uiName Logout Redirect Path
      * @uiWidget pageSelect

package/dist/cjs/sqm-portal-profile.cjs.entry.js

@@ -194,6 +194,8 @@ const PortalProfile = class {
      */
     this.submitChangeButtonText = "Submit Changes";
     /**
+     * Show or hide the country field.
+     *
      * @uiName Hide Country Field
      */
     this.hideCountry = false;

package/dist/cjs/sqm-portal-protected-route.cjs.entry.js

@@ -37,7 +37,7 @@ const PortalProtectedRoute = class {
     index.registerInstance(this, hostRef);
     this.ignored = true;
     /**
-     * Redirect participants to this page they are not logged in.
+     * Redirect participants to this path they are not logged in.
      *
      * @uiName Redirect Path
      */
@@ -47,7 +47,7 @@ const PortalProtectedRoute = class {
      */
     this.requireEmailVerification = false;
     /**
-     * Redirect participants to this page when email verification is required but they have not verified their email.
+     * Redirect participants to this path when email verification is required but they have not verified their email.
      *
      * @uiName Unverified Participant Redirect Path
      */