@saasquatch/mint-components 2.3.0-1 → 2.3.0-2

package/dist/collection/components/sqm-portal-reset-password/sqm-portal-reset-password.js

@@ -0,0 +1,592 @@
+import { isDemo } from "@saasquatch/component-boilerplate";
+import { withHooks } from "@saasquatch/stencil-hooks";
+import { Component, h, Prop, State } from "@stencil/core";
+import deepmerge from "deepmerge";
+import { PortalResetPasswordView, } from "./sqm-portal-reset-password-view";
+import { usePortalResetPassword } from "./usePortalResetPassword";
+/**
+ * @uiName Microsite Reset Password
+ */
+export class PortalResetPassword {
+  constructor() {
+    this.ignored = true;
+    /**
+     * Redirect participants to this page when they successfully reset their password.
+     *
+     * @uiName Successful reset redirect
+     * @uiWidget pageSelect
+     */
+    this.nextPage = "/";
+    /**
+     * Redirect participants to this page if password reset fails due to an outdated reset attempt.
+     *
+     * @uiName Failed reset redirect
+     * @uiWidget pageSelect
+     */
+    this.failedPage = "/";
+    /**
+     * @uiName Show confirm password field
+     */
+    this.confirmPassword = false;
+    /**
+     * @uiName Reset password header text
+     */
+    this.resetPasswordHeader = "Reset your password";
+    /**
+     * Displayed after a successful password reset.
+     *
+     * @uiName Successful password reset text
+     * @uiWidget textArea
+     */
+    this.passwordResetHeader = "Password reset";
+    /**
+     * @uiName Password reset button text
+     */
+    this.resetPasswordButtonText = "Reset Password";
+    /**
+     * Button text displayed after a successful password reset.
+     *
+     * @uiName Continue button text
+     */
+    this.continueButtonText = "Continue";
+    /**
+     * @uiName Password confirmation field label
+     */
+    this.confirmPasswordFieldLabel = "Confirm Password";
+    /**
+     * @uiName Password field label
+     */
+    this.passwordFieldLabel = "New Password";
+    /**
+     * @uiName Password requirement met
+     */
+    this.meetsRequirementsText = "Password has met all requirements";
+    /**
+     * @uiName Password requirement failed
+     */
+    this.doesNotMeetRequirementsText = "Password must meet the following requirements:";
+    /**
+     * @uiName Minimum length text
+     */
+    this.minErrorText = "be a minimum of 8 characters";
+    /**
+     * @uiName Missing uppercase text
+     */
+    this.uppercaseErrorText = "contain at least 1 uppercase character";
+    /**
+     * @uiName Missing lowercase text
+     */
+    this.lowercaseErrorText = "contain at least 1 lowercase character";
+    /**
+     * @uiName Missing number or symbol text
+     */
+    this.hasErrorText = "contain at least 1 number or symbol";
+    /**
+     * @uiName Passwords don’t match error message
+     * Please make sure your passwords match
+     */
+    this.passwordMismatchText = "Passwords do not match.";
+    /**
+     * @uiName Reset code invalid error message
+     */
+    this.codeInvalidText = "The password reset code is invalid or has expired, please try again.";
+    /**
+     * @uiName Reset success text
+     */
+    this.resetSuccessText = "Your password has been reset and you are being redirected. If you are not redirected, please click Continue.";
+    /**
+     * Displayed when the password reset fails due to a network error. The participant can try refreshing the page.
+     * @uiName Network error message
+     */
+    this.networkErrorMessage = "An error occurred while resetting your password. Please refresh the page and try again.";
+    withHooks(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const { states, callbacks } = isDemo()
+      ? usePortalResetPasswordDemo(this)
+      : usePortalResetPassword(this);
+    return h(PortalResetPasswordView, { states: states, callbacks: callbacks });
+  }
+  static get is() { return "sqm-portal-reset-password"; }
+  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": "Successful reset redirect",
+            "name": "uiName"
+          }, {
+            "text": "pageSelect",
+            "name": "uiWidget"
+          }],
+        "text": "Redirect participants to this page when they successfully reset their password."
+      },
+      "attribute": "next-page",
+      "reflect": false,
+      "defaultValue": "\"/\""
+    },
+    "failedPage": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Failed reset redirect",
+            "name": "uiName"
+          }, {
+            "text": "pageSelect",
+            "name": "uiWidget"
+          }],
+        "text": "Redirect participants to this page if password reset fails due to an outdated reset attempt."
+      },
+      "attribute": "failed-page",
+      "reflect": false,
+      "defaultValue": "\"/\""
+    },
+    "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"
+    },
+    "resetPasswordHeader": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Reset password header text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "reset-password-header",
+      "reflect": false,
+      "defaultValue": "\"Reset your password\""
+    },
+    "passwordResetHeader": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Successful password reset text",
+            "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
+          }],
+        "text": "Displayed after a successful password reset."
+      },
+      "attribute": "password-reset-header",
+      "reflect": false,
+      "defaultValue": "\"Password reset\""
+    },
+    "resetPasswordButtonText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Password reset button text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "reset-password-button-text",
+      "reflect": false,
+      "defaultValue": "\"Reset Password\""
+    },
+    "continueButtonText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Continue button text",
+            "name": "uiName"
+          }],
+        "text": "Button text displayed after a successful password reset."
+      },
+      "attribute": "continue-button-text",
+      "reflect": false,
+      "defaultValue": "\"Continue\""
+    },
+    "confirmPasswordFieldLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Password confirmation field label",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "confirm-password-field-label",
+      "reflect": false,
+      "defaultValue": "\"Confirm Password\""
+    },
+    "passwordFieldLabel": {
+      "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-field-label",
+      "reflect": false,
+      "defaultValue": "\"New Password\""
+    },
+    "meetsRequirementsText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Password requirement met",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "meets-requirements-text",
+      "reflect": false,
+      "defaultValue": "\"Password has met all requirements\""
+    },
+    "doesNotMeetRequirementsText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Password requirement failed",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "does-not-meet-requirements-text",
+      "reflect": false,
+      "defaultValue": "\"Password must meet the following requirements:\""
+    },
+    "minErrorText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Minimum length text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "min-error-text",
+      "reflect": false,
+      "defaultValue": "\"be a minimum of 8 characters\""
+    },
+    "uppercaseErrorText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Missing uppercase text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "uppercase-error-text",
+      "reflect": false,
+      "defaultValue": "\"contain at least 1 uppercase character\""
+    },
+    "lowercaseErrorText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Missing lowercase text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "lowercase-error-text",
+      "reflect": false,
+      "defaultValue": "\"contain at least 1 lowercase character\""
+    },
+    "hasErrorText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Missing number or symbol text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "has-error-text",
+      "reflect": false,
+      "defaultValue": "\"contain at least 1 number or symbol\""
+    },
+    "passwordMismatchText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Passwords don\u2019t match error message\nPlease make sure your passwords match",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "password-mismatch-text",
+      "reflect": false,
+      "defaultValue": "\"Passwords do not match.\""
+    },
+    "codeInvalidText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Reset code invalid error message",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "code-invalid-text",
+      "reflect": false,
+      "defaultValue": "\"The password reset code is invalid or has expired, please try again.\""
+    },
+    "resetSuccessText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Reset success text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "reset-success-text",
+      "reflect": false,
+      "defaultValue": "\"Your password has been reset and you are being redirected. If you are not redirected, please click Continue.\""
+    },
+    "networkErrorMessage": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Network error message",
+            "name": "uiName"
+          }],
+        "text": "Displayed when the password reset fails due to a network error. The participant can try refreshing the page."
+      },
+      "attribute": "network-error-message",
+      "reflect": false,
+      "defaultValue": "\"An error occurred while resetting your password. Please refresh the page and try again.\""
+    },
+    "demoData": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "DemoData<PortalResetPasswordViewProps>",
+        "resolved": "{ states?: { error: string; loading: boolean; reset: boolean; confirmPassword: boolean; oobCodeValidating: boolean; oobCodeValid: boolean; passwordDemoData?: PasswordFieldViewDemoProps; content: { passwordResetHeader: string; resetPasswordHeader: string; continueButtonText: string; resetPasswordButtonText: string; confirmPasswordFieldLabel: string; passwordFieldLabel: string; meetsRequirementsText?: string; doesNotMeetRequirementsText?: string; minErrorText?: string; uppercaseErrorText?: string; lowercaseErrorText?: string; hasErrorText?: string; resetSuccessText?: string; passwordMismatchText?: string; codeInvalidText?: string; }; }; }",
+        "references": {
+          "DemoData": {
+            "location": "import",
+            "path": "../../global/demo"
+          },
+          "PortalResetPasswordViewProps": {
+            "location": "import",
+            "path": "./sqm-portal-reset-password-view"
+          }
+        }
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [{
+            "text": undefined,
+            "name": "undocumented"
+          }, {
+            "text": "object",
+            "name": "uiType"
+          }],
+        "text": ""
+      }
+    }
+  }; }
+  static get states() { return {
+    "ignored": {}
+  }; }
+}
+function usePortalResetPasswordDemo(props) {
+  return deepmerge({
+    states: {
+      error: "",
+      loading: false,
+      reset: false,
+      confirmPassword: props.confirmPassword,
+      oobCodeValidating: false,
+      oobCodeValid: true,
+      content: {
+        passwordResetHeader: props.passwordResetHeader,
+        resetPasswordHeader: props.resetPasswordHeader,
+        continueButtonText: props.continueButtonText,
+        resetPasswordButtonText: props.resetPasswordButtonText,
+        confirmPasswordFieldLabel: props.confirmPasswordFieldLabel,
+        passwordFieldLabel: props.passwordFieldLabel,
+        meetsRequirementsText: props.meetsRequirementsText,
+        doesNotMeetRequirementsText: props.doesNotMeetRequirementsText,
+        minErrorText: props.minErrorText,
+        uppercaseErrorText: props.uppercaseErrorText,
+        lowercaseErrorText: props.lowercaseErrorText,
+        hasErrorText: props.hasErrorText,
+        passwordMismatchText: props.passwordMismatchText,
+        codeInvalidText: props.codeInvalidText,
+        resetSuccessText: props.resetSuccessText,
+      },
+    },
+    callbacks: {
+      submit: async (_event) => {
+        console.log("submit");
+      },
+      failed: () => { },
+      gotoNextPage: () => { },
+    },
+  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+}

package/dist/collection/components/sqm-portal-reset-password/usePortalResetPassword.js

@@ -0,0 +1,86 @@
+import jsonpointer from "jsonpointer";
+import { useEffect, useState } from "@saasquatch/universal-hooks";
+import { navigation, useVerifyPasswordResetCodeMutation, useResetPasswordMutation, } from "@saasquatch/component-boilerplate";
+import { sanitizeUrlPath } from "../../utils/utils";
+export function usePortalResetPassword(props) {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+  const [reset, setReset] = useState(false);
+  const [error, setError] = useState("");
+  const [verifyPasswordResetCode, verifyPasswordResetCodeState] = useVerifyPasswordResetCodeMutation();
+  const [resetPassword, resetPasswordState] = useResetPasswordMutation();
+  const urlParams = new URLSearchParams(navigation.location.search);
+  const oobCode = urlParams.get("oobCode");
+  urlParams.delete("oobCode");
+  const nextPageOverride = urlParams.get("nextPage");
+  const verifyPasswordResetCodeAndHandleResponse = async () => {
+    const result = await verifyPasswordResetCode({ oobCode });
+    if (result instanceof Error) {
+      setError(props.networkErrorMessage);
+    }
+  };
+  useEffect(() => {
+    verifyPasswordResetCodeAndHandleResponse();
+  }, []);
+  const submit = async (event) => {
+    setError("");
+    let formData = event.detail.formData;
+    formData === null || formData === void 0 ? void 0 : formData.forEach((value, key) => {
+      jsonpointer.set(formData, key, value);
+    });
+    const variables = { oobCode, password: formData.password };
+    if (formData.password !== formData.confirmPassword) {
+      setError(props.passwordMismatchText);
+      return;
+    }
+    const result = await resetPassword(variables);
+    if (result instanceof Error) {
+      return setError(props.networkErrorMessage);
+    }
+    if (result.resetManagedIdentityPassword) {
+      setReset(true);
+      setTimeout(() => {
+        gotoNextPage();
+      }, 5000);
+    }
+  };
+  const gotoNextPage = () => {
+    urlParams.delete("nextPage");
+    const url = sanitizeUrlPath(nextPageOverride || props.nextPage);
+    navigation.push(url.href);
+  };
+  const failed = () => {
+    navigation.push({
+      pathname: props.failedPage,
+      search: urlParams.toString() && "?" + urlParams.toString(),
+    });
+  };
+  return {
+    states: {
+      loading: resetPasswordState.loading,
+      reset,
+      confirmPassword: props.confirmPassword,
+      error: ((_e = (_d = (_c = (_b = (_a = resetPasswordState.errors) === null || _a === void 0 ? void 0 : _a.response) === null || _b === void 0 ? void 0 : _b.errors) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.extensions) === null || _e === void 0 ? void 0 : _e.message) || ((_j = (_h = (_g = (_f = resetPasswordState.errors) === null || _f === void 0 ? void 0 : _f.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) ||
+        error,
+      oobCodeValidating: verifyPasswordResetCodeState.loading,
+      oobCodeValid: (_k = verifyPasswordResetCodeState.data) === null || _k === void 0 ? void 0 : _k.verifyManagedIdentityPasswordResetCode.success,
+      content: {
+        passwordResetHeader: props.passwordResetHeader,
+        resetPasswordHeader: props.resetPasswordHeader,
+        continueButtonText: props.continueButtonText,
+        resetPasswordButtonText: props.resetPasswordButtonText,
+        confirmPasswordFieldLabel: props.confirmPasswordFieldLabel,
+        passwordFieldLabel: props.passwordFieldLabel,
+        meetsRequirementsText: props.meetsRequirementsText,
+        doesNotMeetRequirementsText: props.doesNotMeetRequirementsText,
+        minErrorText: props.minErrorText,
+        uppercaseErrorText: props.uppercaseErrorText,
+        lowercaseErrorText: props.lowercaseErrorText,
+        hasErrorText: props.hasErrorText,
+        passwordMismatchText: props.passwordMismatchText,
+        codeInvalidText: props.codeInvalidText,
+        resetSuccessText: props.resetSuccessText,
+      },
+    },
+    callbacks: { submit, failed, gotoNextPage },
+  };
+}