@saasquatch/mint-components 1.6.2-7 → 1.6.2

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

@@ -1,153 +1,153 @@
-import { h } from "@stencil/core";
-import { PortalResetPasswordView, } from "./sqm-portal-reset-password-view";
-import scenario from "./sqm-portal-reset-password.feature";
-export default {
-  title: "Components/Portal Reset Password",
-  parameters: {
-    scenario,
-  },
-};
-const defaultProps = {
-  states: {
-    error: "",
-    loading: false,
-    reset: false,
-    confirmPassword: true,
-    oobCodeValidating: false,
-    oobCodeValid: true,
-    content: {
-      passwordResetHeader: "Password reset",
-      resetPasswordHeader: "Reset your password",
-      continueButtonText: "Continue",
-      resetPasswordButtonText: "Reset Password",
-      confirmPasswordFieldLabel: "Confirm Password",
-      passwordFieldLabel: "New Password",
-    },
-  },
-  callbacks: {
-    submit: async (e) => await e,
-    gotoNextPage: () => console.log("next page"),
-    failed: () => console.log("failed"),
-  },
-};
-const defaultPropsNoConfirm = {
-  states: {
-    error: "",
-    loading: false,
-    reset: false,
-    confirmPassword: false,
-    oobCodeValidating: false,
-    oobCodeValid: true,
-    content: {
-      passwordResetHeader: "Password reset",
-      resetPasswordHeader: "Reset your password",
-      continueButtonText: "Continue",
-      resetPasswordButtonText: "Reset Password",
-      confirmPasswordFieldLabel: "Confirm Password",
-      passwordFieldLabel: "New Password",
-    },
-  },
-  callbacks: {
-    submit: async (e) => await e,
-    gotoNextPage: () => console.log("next page"),
-    failed: () => console.log("failed"),
-  },
-};
-const errorProps = {
-  states: {
-    error: "Something went wrong. Please try again.",
-    loading: false,
-    reset: false,
-    confirmPassword: true,
-    oobCodeValidating: false,
-    oobCodeValid: true,
-    content: {
-      passwordResetHeader: "Password reset",
-      resetPasswordHeader: "Reset your password",
-      continueButtonText: "Continue",
-      resetPasswordButtonText: "Reset Password",
-      confirmPasswordFieldLabel: "Confirm Password",
-      passwordFieldLabel: "New Password",
-    },
-  },
-  callbacks: {
-    submit: async (e) => await e,
-    gotoNextPage: () => console.log("next page"),
-    failed: () => console.log("failed"),
-  },
-};
-const loadingProps = {
-  states: {
-    error: "",
-    loading: true,
-    reset: false,
-    confirmPassword: true,
-    oobCodeValidating: false,
-    oobCodeValid: true,
-    content: {
-      passwordResetHeader: "Password reset",
-      resetPasswordHeader: "Reset your password",
-      continueButtonText: "Continue",
-      resetPasswordButtonText: "Reset Password",
-      confirmPasswordFieldLabel: "Confirm Password",
-      passwordFieldLabel: "New Password",
-    },
-  },
-  callbacks: {
-    submit: async (e) => await e,
-    gotoNextPage: () => console.log("next page"),
-    failed: () => console.log("failed"),
-  },
-};
-const successProps = {
-  states: {
-    error: "",
-    loading: false,
-    reset: true,
-    confirmPassword: true,
-    oobCodeValidating: false,
-    oobCodeValid: true,
-    content: {
-      passwordResetHeader: "Password reset",
-      resetPasswordHeader: "Reset your password",
-      continueButtonText: "Continue",
-      resetPasswordButtonText: "Reset Password",
-      confirmPasswordFieldLabel: "Confirm Password",
-      passwordFieldLabel: "New Password",
-    },
-  },
-  callbacks: {
-    submit: async (e) => await e,
-    gotoNextPage: () => console.log("next page"),
-    failed: () => console.log("failed"),
-  },
-};
-const validatingCodeProps = {
-  states: {
-    error: "",
-    loading: false,
-    reset: false,
-    confirmPassword: true,
-    oobCodeValidating: false,
-    oobCodeValid: false,
-    content: {
-      passwordResetHeader: "Password reset",
-      resetPasswordHeader: "Reset your password",
-      continueButtonText: "Continue",
-      resetPasswordButtonText: "Reset Password",
-      confirmPasswordFieldLabel: "Confirm Password",
-      passwordFieldLabel: "New Password",
-    },
-  },
-  callbacks: {
-    submit: async (e) => await e,
-    gotoNextPage: () => console.log("next page"),
-    failed: () => console.log("failed"),
-  },
-};
-export const Default = () => h(PortalResetPasswordView, Object.assign({}, defaultProps));
-export const DefaultWithoutConfirmField = () => (h(PortalResetPasswordView, Object.assign({}, defaultPropsNoConfirm)));
-export const ResetPasswordWithError = () => (h(PortalResetPasswordView, Object.assign({}, errorProps)));
-export const ResetPasswordLoading = () => (h(PortalResetPasswordView, Object.assign({}, loadingProps)));
-export const ResetPasswordSuccess = () => (h(PortalResetPasswordView, Object.assign({}, successProps)));
-export const CodeValidating = () => (h(PortalResetPasswordView, Object.assign({}, validatingCodeProps)));
+import { h } from "@stencil/core";
+import { PortalResetPasswordView, } from "./sqm-portal-reset-password-view";
+import scenario from "./sqm-portal-reset-password.feature";
+export default {
+  title: "Components/Portal Reset Password",
+  parameters: {
+    scenario,
+  },
+};
+const defaultProps = {
+  states: {
+    error: "",
+    loading: false,
+    reset: false,
+    confirmPassword: true,
+    oobCodeValidating: false,
+    oobCodeValid: true,
+    content: {
+      passwordResetHeader: "Password reset",
+      resetPasswordHeader: "Reset your password",
+      continueButtonText: "Continue",
+      resetPasswordButtonText: "Reset Password",
+      confirmPasswordFieldLabel: "Confirm Password",
+      passwordFieldLabel: "New Password",
+    },
+  },
+  callbacks: {
+    submit: async (e) => await e,
+    gotoNextPage: () => console.log("next page"),
+    failed: () => console.log("failed"),
+  },
+};
+const defaultPropsNoConfirm = {
+  states: {
+    error: "",
+    loading: false,
+    reset: false,
+    confirmPassword: false,
+    oobCodeValidating: false,
+    oobCodeValid: true,
+    content: {
+      passwordResetHeader: "Password reset",
+      resetPasswordHeader: "Reset your password",
+      continueButtonText: "Continue",
+      resetPasswordButtonText: "Reset Password",
+      confirmPasswordFieldLabel: "Confirm Password",
+      passwordFieldLabel: "New Password",
+    },
+  },
+  callbacks: {
+    submit: async (e) => await e,
+    gotoNextPage: () => console.log("next page"),
+    failed: () => console.log("failed"),
+  },
+};
+const errorProps = {
+  states: {
+    error: "Something went wrong. Please try again.",
+    loading: false,
+    reset: false,
+    confirmPassword: true,
+    oobCodeValidating: false,
+    oobCodeValid: true,
+    content: {
+      passwordResetHeader: "Password reset",
+      resetPasswordHeader: "Reset your password",
+      continueButtonText: "Continue",
+      resetPasswordButtonText: "Reset Password",
+      confirmPasswordFieldLabel: "Confirm Password",
+      passwordFieldLabel: "New Password",
+    },
+  },
+  callbacks: {
+    submit: async (e) => await e,
+    gotoNextPage: () => console.log("next page"),
+    failed: () => console.log("failed"),
+  },
+};
+const loadingProps = {
+  states: {
+    error: "",
+    loading: true,
+    reset: false,
+    confirmPassword: true,
+    oobCodeValidating: false,
+    oobCodeValid: true,
+    content: {
+      passwordResetHeader: "Password reset",
+      resetPasswordHeader: "Reset your password",
+      continueButtonText: "Continue",
+      resetPasswordButtonText: "Reset Password",
+      confirmPasswordFieldLabel: "Confirm Password",
+      passwordFieldLabel: "New Password",
+    },
+  },
+  callbacks: {
+    submit: async (e) => await e,
+    gotoNextPage: () => console.log("next page"),
+    failed: () => console.log("failed"),
+  },
+};
+const successProps = {
+  states: {
+    error: "",
+    loading: false,
+    reset: true,
+    confirmPassword: true,
+    oobCodeValidating: false,
+    oobCodeValid: true,
+    content: {
+      passwordResetHeader: "Password reset",
+      resetPasswordHeader: "Reset your password",
+      continueButtonText: "Continue",
+      resetPasswordButtonText: "Reset Password",
+      confirmPasswordFieldLabel: "Confirm Password",
+      passwordFieldLabel: "New Password",
+    },
+  },
+  callbacks: {
+    submit: async (e) => await e,
+    gotoNextPage: () => console.log("next page"),
+    failed: () => console.log("failed"),
+  },
+};
+const validatingCodeProps = {
+  states: {
+    error: "",
+    loading: false,
+    reset: false,
+    confirmPassword: true,
+    oobCodeValidating: false,
+    oobCodeValid: false,
+    content: {
+      passwordResetHeader: "Password reset",
+      resetPasswordHeader: "Reset your password",
+      continueButtonText: "Continue",
+      resetPasswordButtonText: "Reset Password",
+      confirmPasswordFieldLabel: "Confirm Password",
+      passwordFieldLabel: "New Password",
+    },
+  },
+  callbacks: {
+    submit: async (e) => await e,
+    gotoNextPage: () => console.log("next page"),
+    failed: () => console.log("failed"),
+  },
+};
+export const Default = () => h(PortalResetPasswordView, Object.assign({}, defaultProps));
+export const DefaultWithoutConfirmField = () => (h(PortalResetPasswordView, Object.assign({}, defaultPropsNoConfirm)));
+export const ResetPasswordWithError = () => (h(PortalResetPasswordView, Object.assign({}, errorProps)));
+export const ResetPasswordLoading = () => (h(PortalResetPasswordView, Object.assign({}, loadingProps)));
+export const ResetPasswordSuccess = () => (h(PortalResetPasswordView, Object.assign({}, successProps)));
+export const CodeValidating = () => (h(PortalResetPasswordView, Object.assign({}, validatingCodeProps)));

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

@@ -1,76 +1,76 @@
-import { h } from "@stencil/core";
-import { AuthButtonsContainer, AuthColumn, AuthWrapper } from "../../global/mixins";
-import { createStyleSheet } from "../../styling/JSS";
-import { TextSpanView } from "../sqm-text-span/sqm-text-span-view";
-const style = {
-  Wrapper: AuthWrapper,
-  Column: AuthColumn,
-  ButtonsContainer: AuthButtonsContainer,
-  Banner: {
-    "&::part(erroralert-base)": {
-      margin: "15px 0px",
-    },
-  },
-  CodeError: {
-    "&::part(erroralert-base)": {
-      "margin-bottom": "15px",
-    },
-  },
-  CodeSuccess: {
-    "&::part(successalert-base)": {
-      "margin-bottom": "15px",
-    },
-  },
-  ContinueButton: {
-    width: "100%",
-  },
-};
-const vanillaStyle = `
-:host {
-  display: block;
-}
-:host([hidden]): {
-  display: none;
-}
-`;
-const sheet = createStyleSheet(style);
-const styleString = sheet.toString();
-export function PortalResetPasswordView(props) {
-  const { states, callbacks } = props;
-  if (states.reset) {
-    return (h("div", { class: `${sheet.classes.Wrapper} ${sheet.classes.Column}` },
-      h("style", { type: "text/css" }, styleString),
-      h(TextSpanView, { type: "h3" }, states.content.resetPasswordHeader),
-      h("sqm-form-message", { class: sheet.classes.CodeSuccess, exportparts: "success-icon" },
-        h("div", { part: "successalert-text" }, "Your password has been reset and you are being redirected. If you are not redirected, please click Continue.")),
-      h("div", null,
-        h("sl-button", { class: sheet.classes.ContinueButton, onClick: callbacks.gotoNextPage, loading: states.loading, exportparts: "base: primarybutton-base", type: "primary" }, states.content.continueButtonText))));
-  }
-  if (states.oobCodeValidating) {
-    return h("div", null);
-  }
-  if (!states.oobCodeValid) {
-    return (h("div", { class: `${sheet.classes.Wrapper} ${sheet.classes.Column}` },
-      h("style", { type: "text/css" }, styleString),
-      h("sqm-form-message", { class: sheet.classes.CodeError, type: "error", exportparts: "erroralert-icon" },
-        h("div", { part: "erroralert-text" }, "The password reset code is invalid or has expired, please try again.")),
-      h("div", null,
-        h("sl-button", { class: sheet.classes.ContinueButton, onClick: callbacks.failed, exportparts: "base: primarybutton-base", type: "primary" }, states.content.continueButtonText))));
-  }
-  return (h("div", { class: sheet.classes.Wrapper },
-    h("style", { type: "text/css" },
-      vanillaStyle,
-      styleString),
-    h(TextSpanView, { type: "h2" }, states.reset
-      ? states.content.passwordResetHeader
-      : states.content.resetPasswordHeader),
-    h("sl-form", { class: sheet.classes.Column, "onSl-submit": callbacks.submit },
-      props.states.error && (h("sqm-form-message", { type: "error", class: sheet.classes.Banner, exportparts: "erroralert-icon" },
-        h("div", { part: "erroralert-text" }, props.states.error))),
-      !states.reset && (h("sqm-password-field", { fieldLabel: states.content.passwordFieldLabel, demoData: states.passwordDemoData })),
-      !states.reset && states.confirmPassword && (h("sl-input", { exportparts: "label: input-label", type: "password", name: "/confirmPassword", label: states.content.confirmPasswordFieldLabel, disabled: states.loading, required: true })),
-      h("div", { class: sheet.classes.ButtonsContainer },
-        h("sl-button", { class: sheet.classes.ContinueButton, submit: true, loading: states.loading, exportparts: "base: primarybutton-base", type: "primary" }, states.reset
-          ? states.content.continueButtonText
-          : states.content.resetPasswordButtonText)))));
-}
+import { h } from "@stencil/core";
+import { AuthButtonsContainer, AuthColumn, AuthWrapper } from "../../global/mixins";
+import { createStyleSheet } from "../../styling/JSS";
+import { TextSpanView } from "../sqm-text-span/sqm-text-span-view";
+const style = {
+  Wrapper: AuthWrapper,
+  Column: AuthColumn,
+  ButtonsContainer: AuthButtonsContainer,
+  Banner: {
+    "&::part(erroralert-base)": {
+      margin: "15px 0px",
+    },
+  },
+  CodeError: {
+    "&::part(erroralert-base)": {
+      "margin-bottom": "15px",
+    },
+  },
+  CodeSuccess: {
+    "&::part(successalert-base)": {
+      "margin-bottom": "15px",
+    },
+  },
+  ContinueButton: {
+    width: "100%",
+  },
+};
+const vanillaStyle = `
+:host {
+  display: block;
+}
+:host([hidden]): {
+  display: none;
+}
+`;
+const sheet = createStyleSheet(style);
+const styleString = sheet.toString();
+export function PortalResetPasswordView(props) {
+  const { states, callbacks } = props;
+  if (states.reset) {
+    return (h("div", { class: `${sheet.classes.Wrapper} ${sheet.classes.Column}` },
+      h("style", { type: "text/css" }, styleString),
+      h(TextSpanView, { type: "h3" }, states.content.resetPasswordHeader),
+      h("sqm-form-message", { class: sheet.classes.CodeSuccess, exportparts: "success-icon" },
+        h("div", { part: "successalert-text" }, "Your password has been reset and you are being redirected. If you are not redirected, please click Continue.")),
+      h("div", null,
+        h("sl-button", { class: sheet.classes.ContinueButton, onClick: callbacks.gotoNextPage, loading: states.loading, exportparts: "base: primarybutton-base", type: "primary" }, states.content.continueButtonText))));
+  }
+  if (states.oobCodeValidating) {
+    return h("div", null);
+  }
+  if (!states.oobCodeValid) {
+    return (h("div", { class: `${sheet.classes.Wrapper} ${sheet.classes.Column}` },
+      h("style", { type: "text/css" }, styleString),
+      h("sqm-form-message", { class: sheet.classes.CodeError, type: "error", exportparts: "erroralert-icon" },
+        h("div", { part: "erroralert-text" }, "The password reset code is invalid or has expired, please try again.")),
+      h("div", null,
+        h("sl-button", { class: sheet.classes.ContinueButton, onClick: callbacks.failed, exportparts: "base: primarybutton-base", type: "primary" }, states.content.continueButtonText))));
+  }
+  return (h("div", { class: sheet.classes.Wrapper },
+    h("style", { type: "text/css" },
+      vanillaStyle,
+      styleString),
+    h(TextSpanView, { type: "h2" }, states.reset
+      ? states.content.passwordResetHeader
+      : states.content.resetPasswordHeader),
+    h("sl-form", { class: sheet.classes.Column, "onSl-submit": callbacks.submit },
+      props.states.error && (h("sqm-form-message", { type: "error", class: sheet.classes.Banner, exportparts: "erroralert-icon" },
+        h("div", { part: "erroralert-text" }, props.states.error))),
+      !states.reset && (h("sqm-password-field", { fieldLabel: states.content.passwordFieldLabel, demoData: states.passwordDemoData })),
+      !states.reset && states.confirmPassword && (h("sl-input", { exportparts: "label: input-label", type: "password", name: "/confirmPassword", label: states.content.confirmPasswordFieldLabel, disabled: states.loading, required: true })),
+      h("div", { class: sheet.classes.ButtonsContainer },
+        h("sl-button", { class: sheet.classes.ContinueButton, submit: true, loading: states.loading, exportparts: "base: primarybutton-base", type: "primary" }, states.reset
+          ? states.content.continueButtonText
+          : states.content.resetPasswordButtonText)))));
+}