@saasquatch/mint-components 1.8.0-20 → 1.8.0-22

package/dist/cjs/{ShadowViewAddon-ba90f112.js → ShadowViewAddon-3cb21a64.js}

@@ -4020,517 +4020,6 @@ function CouponCodeView(props) {
 }
 
 const style$f = {
-  FormWrapper: {
-    display: "flex",
-    justifyContent: "flex-start",
-    flexDirection: "column",
-  },
-  CheckboxContainer: {
-    display: "flex",
-    alignItems: "flex-start",
-    justifyContent: "flex-start",
-    flexDirection: "column",
-    gap: "var(--sl-spacing-xx-small)",
-  },
-  TitleContainer: {
-    display: "flex",
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "flex-start",
-    gap: "var(--sl-spacing-small)",
-  },
-  TextContainer: {
-    display: "flex",
-    justifyContent: "flex-start",
-    flexDirection: "column",
-    gap: "24px",
-    paddingBottom: "16px",
-  },
-  BtnContainer: {
-    paddingTop: "36px",
-    display: "flex",
-    gap: "8px",
-  },
-  ErrorText: {
-    color: "var(--sl-color-danger-500)",
-    marginTop: "10px",
-  },
-  DescriptionText: {
-    color: "var(--sl-color-neutral-500)",
-  },
-  BoldText: {
-    fontWeight: "bold",
-  },
-  SecondaryBtn: {
-    "&::part(base)": {
-      color: "var(--sl-color-gray-800) !important",
-    },
-  },
-  ErrorAlertContainer: {
-    "&::part(base)": {
-      backgroundColor: "var(--sl-color-red-100)",
-      borderTop: "none",
-      padding: "0 16px",
-    },
-    "& sl-icon::part(base)": {
-      color: "var(--sl-color-danger-500)",
-    },
-  },
-  InfoAlert: {
-    "&::part(base)": {
-      backgroundColor: "transparent",
-      borderTop: "none",
-      padding: "0px",
-      marginBottom: "16px",
-      border: "none",
-    },
-    "&::part(message)": {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "flex-start",
-      padding: "10px",
-      height: "max-content",
-    },
-    "& sl-icon::part(base)": {
-      color: "var(--sl-color-sky-500)",
-    },
-  },
-  Container: {
-    width: "100%",
-    display: "flex",
-    justifyContent: "flex-start",
-    flexDirection: "column",
-    gap: "16px",
-  },
-  Link: {
-    color: "var(--sl-color-sky-500)",
-    textDecoration: "none",
-    "&:visited": {
-      color: "var(--sl-color-sky-500)",
-    },
-    "&:hover": {
-      textDecoration: "underline",
-    },
-  },
-};
-const sheet$f = JSS.createStyleSheet(style$f);
-const styleString$f = sheet$f.toString();
-const vanillaStyle$a = `
-    :host{
-      display: block;   
-    }
-    * {
-       margin: 0;
-       padding: 0;
-       box-sizing: border-box;
-    }
-
-    p {
-      line-height: 18px;
-      color: var(--sl-color-gray-800);
-       font-size: var(--sl-font-size-small);
-    }
-
-    a {
-      cursor: pointer;
-    }
-
-
-  `;
-const DocusignFormView = (props) => {
-  var _a, _b;
-  const { states, states: { formState, documentType }, callbacks, text, } = props;
-  const { classes } = sheet$f;
-  return (index.h("div", { class: classes.Container },
-    index.h("style", { type: "text/css" },
-      styleString$f,
-      vanillaStyle$a),
-    index.h("div", { class: classes.TextContainer },
-      index.h("div", null,
-        index.h("p", null, text.formStep),
-        index.h("h3", null, text.taxForm))),
-    ((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.general) && (index.h("sl-alert", { type: "warning", open: true, class: sheet$f.classes.ErrorAlertContainer },
-      index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-      index.h("strong", null, text.error.generalTitle),
-      index.h("br", null),
-      text.error.generalDescription)),
-    index.h("h5", { class: classes.BoldText }, global.intl.formatMessage({ id: "tax-form-label", defaultMessage: text.taxFormLabel }, { documentType })),
-    index.h("p", null,
-      global.intl.formatMessage({
-        id: "tax-form-description",
-        defaultMessage: text.taxFormDescription,
-      }, { documentType }),
-      " ",
-      index.h("a", { onClick: callbacks.onShowDocumentType, class: classes.Link }, text.notBasedInUS)),
-    states.loading ? (index.h("sl-spinner", { style: { fontSize: "50px", margin: "40px" } })) : (index.h("div", null,
-      index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "primary", open: true, class: classes.InfoAlert },
-        index.h("sl-icon", { slot: "icon", name: "info-circle" }),
-        text.banner),
-      index.h("slot", { name: "docusign-iframe" }),
-      index.h("div", null,
-        index.h("p", { class: classes.BoldText }, text.checkboxLabel),
-        index.h("sl-checkbox", { disabled: states.disabled, checked: formState.completedTaxForm, "onSl-change": callbacks.toggleFormSubmitted }, text.checkboxDescription),
-        ((_b = formState.errors) === null || _b === void 0 ? void 0 : _b.formSubmission) && (index.h("p", { class: classes.ErrorText }, text.error.formSubmission))),
-      index.h("div", { class: classes.BtnContainer },
-        index.h("sl-button", { type: "primary", loading: states.loading, disabled: states.submitDisabled, submit: true, onClick: callbacks.onSubmit, exportparts: "base: primarybutton-base" }, text.submitButton),
-        index.h("sl-button", { class: classes.SecondaryBtn, type: "text", loading: states.loading, disabled: states.loading, onClick: () => {
-            callbacks.onBack();
-          }, exportparts: "base: secondarybutton-base" }, text.backButton))))));
-};
-
-const statusMap = {
-  pending: "warning",
-  upcoming: "success",
-  "next payout": "success",
-};
-const style$g = {
-  Container: {
-    display: "grid",
-    gridTemplateColumns: "1fr",
-    gridGap: "var(--sl-spacing-large)",
-    background: "var(--sl-color-neutral-0)",
-    boxShadow: "0px 2px 4px rgba(28, 28, 33, 0.12)",
-    borderRadius: "4px",
-    padding: "var(--sl-spacing-large)",
-    minHeight: "150px",
-    border: "1px solid var(--sl-color-gray-200)",
-  },
-  StatusContainer: {
-    display: "flex",
-    justifyContent: "space-between",
-    alignItems: "center",
-  },
-  MainCurrencyLabel: {
-    fontWeight: "var(--sl-font-weight-normal)",
-    color: "var(--sl-color-gray-500)",
-  },
-  MainCurrency: {
-    margin: 0,
-    fontSize: "32px",
-    width: "auto",
-  },
-  SubduedRegularText: {
-    fontSize: "var(--sl-font-size-small)",
-    color: "var(--sl-color-gray-500)",
-    margin: 0,
-    width: "auto",
-  },
-  CurrenciesContainer: {
-    display: "grid",
-    width: "auto",
-    gridTemplateColumns: "1fr 1fr 1fr",
-    gap: "var(--sl-spacing-xx-small) var(--sl-spacing-small)",
-    paddingTop: "var(--sq-spacing-xx-small)",
-    "& > :not(:last-child)": {
-      borderRight: "1px solid var(--sl-color-gray-200)",
-    },
-    "& > :nth-child(3)": {
-      border: "none",
-    },
-  },
-  CurrencyContainer: {
-    paddingRight: "var(--sl-spacing-small)",
-    gap: "var(--sl-spacing-small)",
-  },
-  SubCurrencyText: {
-    fontWeight: "var(--sl-font-weight-bold)",
-    fontSize: "var(--sl-font-size-large)",
-    margin: "0",
-  },
-  W9Container: {
-    paddingTop: "var(--sl-spacing-large)",
-    borderTop: "1px solid var(--sl-color-gray-200)",
-  },
-  SkeletonOne: {
-    width: "25%",
-    height: "16px",
-  },
-  SkeletonTwo: {
-    width: "25%",
-    height: "24px",
-  },
-  SkeletonThree: {
-    width: "50%",
-    height: "34px",
-  },
-};
-function PayoutDetailsCardView(props) {
-  var _a;
-  const sheet = JSS.createStyleSheet(style$g);
-  const styleString = sheet.toString();
-  const { classes } = sheet;
-  const currencyList = (currencies) => {
-    return (index.h("div", { class: classes.CurrenciesContainer },
-      " ", currencies === null || currencies === void 0 ? void 0 :
-      currencies.map((currency) => {
-        return (index.h("div", { class: classes.CurrencyContainer },
-          index.h("p", { class: classes.SubCurrencyText }, currency === null || currency === void 0 ? void 0 :
-            currency.amountText, currency === null || currency === void 0 ? void 0 :
-            currency.currencyText)));
-      }),
-      " "));
-  };
-  const { loading, mainCurrency, status, otherCurrencies, otherCurrenciesText, pendingStatusBadgeText, upcomingStatusBadgeText, nextPayoutStatusBadgeText, pendingDetailedStatusText, upcomingDetailedStatusText, nextPayoutDetailedStatusText, w9Pending, w9PendingText, empty, hasDatePending, hasW9Pending, } = props;
-  const badgeText = {
-    pending: pendingStatusBadgeText,
-    upcoming: upcomingStatusBadgeText,
-    "next payout": nextPayoutStatusBadgeText,
-  };
-  const statusText = {
-    pending: pendingDetailedStatusText,
-    upcoming: upcomingDetailedStatusText,
-    "next payout": nextPayoutDetailedStatusText,
-  };
-  return (index.h("div", null,
-    index.h("style", { type: "text/css" }, styleString),
-    index.h("div", { class: classes.Container },
-      loading ? (index.h("div", { class: classes.StatusContainer },
-        index.h("sl-skeleton", { class: classes.SkeletonOne }),
-        " ",
-        index.h("sl-skeleton", { class: classes.SkeletonTwo }))) : (index.h("div", { class: classes.StatusContainer },
-        index.h("p", { class: classes.SubduedRegularText }, empty && status === "pending"
-          ? ""
-          : status !== "pending"
-            ? statusText[status]
-            : hasDatePending
-              ? statusText["pending"]
-              : w9PendingText),
-        index.h("sl-badge", { pill: true, type: statusMap[status] }, badgeText[status]))),
-      loading ? (index.h("sl-skeleton", { class: classes.SkeletonThree })) : empty ? (index.h("h1", { class: classes.MainCurrency }, "No rewards")) : (index.h("h1", { class: classes.MainCurrency },
-        hasDatePending || status !== "pending"
-          ? mainCurrency === null || mainCurrency === void 0 ? void 0 : mainCurrency.amountText : (_a = w9Pending === null || w9Pending === void 0 ? void 0 : w9Pending[0]) === null || _a === void 0 ? void 0 : _a.amountText,
-        " ",
-        mainCurrency.currencyText)),
-      otherCurrencies !== undefined &&
-        otherCurrencies !== false &&
-        !loading && (index.h("div", null,
-        index.h("p", { class: classes.SubduedRegularText, style: { fontSize: "var(--sl-font-size-x-small)" } },
-          "+ ",
-          otherCurrenciesText),
-        currencyList(otherCurrencies))),
-      hasW9Pending && status === "pending" && hasDatePending && !loading && (index.h("div", { class: classes.W9Container },
-        index.h("p", { class: classes.SubduedRegularText }, w9PendingText),
-        currencyList(w9Pending))),
-      loading ? (index.h("sl-skeleton", { class: classes.SkeletonOne })) : (index.h("div", { style: { display: "flex", gap: "var(--sl-spacing-small)" } },
-        index.h("span", null, "Card ***2381"),
-        index.h("span", null, "Toronto Dominion Bank"))))));
-}
-
-const style$h = {
-  WarningAlertContainer: {
-    "&::part(base)": {
-      backgroundColor: "var(--sl-color-red-100)",
-      borderTop: "none",
-    },
-  },
-  ExpiringSoonAlertContainer: {
-    "&::part(base)": {
-      backgroundColor: "var(--sl-color-yellow-100)",
-      borderTop: "none",
-    },
-  },
-  BankingInformationContainer: {
-    maxWidth: "700px",
-  },
-  TaxDocumentsContainer: {
-    marginTop: "var(--sl-spacing-xx-large)",
-    borderTop: "1px solid var(--sl-color-neutral-200)",
-  },
-  TaxDocumentsHeaderContainer: {
-    marginTop: "var(--sl-spacing-x-large)",
-  },
-  StatusContainer: {
-    display: "flex",
-    flexDirection: "column",
-    gap: "var(--sl-spacing-x-small)",
-    "& h4": {
-      margin: "0",
-    },
-    "& p": {
-      margin: "0",
-    },
-  },
-  TaxFormDetailsContainer: {
-    display: "flex",
-    gap: "var(--sl-spacing-small)",
-    alignItems: "baseline",
-    flexFlow: "row wrap",
-  },
-  BadgeContainer: {
-    "&::part(base)": {
-      padding: "var(--sl-spacing-x-small)",
-    },
-  },
-  NewFormButton: {
-    marginTop: "var(--sl-spacing-medium)",
-    maxWidth: "179px",
-  },
-  EditBankDetailsButton: {
-    marginTop: "var(--sl-spacing-x-large)",
-  },
-  SkeletonOne: {
-    width: "15%",
-    height: "10px",
-  },
-  SkeletonTwo: {
-    width: "25%",
-    height: "24px",
-    top: "var(--sl-spacing-small)",
-    marginBottom: "var(--sl-spacing-x-small)",
-  },
-  TaxSectionSkeletonContainer: {
-    display: "flex",
-    flexDirection: "column",
-  },
-  TaxDocSubtext: {
-    margin: "0",
-    color: "var(--sl-color-neutral-500)",
-    lineHeight: "var(--sl-spacing-medium)",
-  },
-};
-const sheet$g = JSS.createStyleSheet(style$h);
-const styleString$g = sheet$g.toString();
-const TaxDocumentSubmittedView = (props) => {
-  var _a;
-  const { states, text, callbacks } = props;
-  // AL: Not sure what states will be yet, placeholder for now
-  const testDetailsCardProps = {
-    loading: states.loading,
-    empty: false,
-    otherCurrencies: false,
-    mainCurrency: { currencyText: "USD", amountText: "100.00" },
-    status: "upcoming",
-    pendingStatusBadgeText: "Pending",
-    upcomingStatusBadgeText: "Upcoming",
-    nextPayoutStatusBadgeText: "Next payout",
-    pendingDetailedStatusText: "Check rewards table for available date",
-    upcomingDetailedStatusText: "November 1, 2022",
-    nextPayoutDetailedStatusText: "November 1, 2022",
-    otherCurrenciesText: "other currencies",
-    w9PendingText: "Awaiting W-9 tax form",
-    w9Pending: undefined,
-    hasDatePending: true,
-    hasW9Pending: false,
-  };
-  const statusMap = {
-    NOT_VERIFIED: (index.h("div", { class: sheet$g.classes.TaxFormDetailsContainer },
-      index.h("sl-badge", { type: "warning", pill: true, class: sheet$g.classes.BadgeContainer }, text.statusTextNotVerified),
-      index.h("p", null, global.intl.formatMessage({
-        id: `badgeTextAwaitingReview`,
-        defaultMessage: text.badgeTextAwaitingReview,
-      }, {
-        dateSubmitted: states.dateSubmitted,
-      })))),
-    ACTIVE: (index.h("div", { class: sheet$g.classes.TaxFormDetailsContainer },
-      index.h("sl-badge", { type: "success", pill: true, class: sheet$g.classes.BadgeContainer }, text.statusTextActive),
-      index.h("p", null,
-        global.intl.formatMessage({
-          id: `badgeTextSubmittedOn`,
-          defaultMessage: text.badgeTextSubmittedOn,
-        }, {
-          dateSubmitted: states.dateSubmitted,
-        }),
-        global.intl.formatMessage({
-          id: `badgeTextExpiringSoon`,
-          defaultMessage: text.badgeTextExpiringSoon,
-        }, {
-          dateExpired: states.dateExpired,
-        })))),
-    NOT_ACTIVE: (index.h("div", { class: sheet$g.classes.TaxFormDetailsContainer },
-      index.h("sl-badge", { type: "danger", pill: true, class: sheet$g.classes.BadgeContainer }, text.statusTextNotActive),
-      index.h("p", null, text.invalidForm))),
-    EXPIRED: (index.h("div", { class: sheet$g.classes.TaxFormDetailsContainer },
-      index.h("sl-badge", { type: "danger", pill: true, class: sheet$g.classes.BadgeContainer }, text.statusTextExpired),
-      index.h("p", null, global.intl.formatMessage({
-        id: `badgeTextExpiredOn`,
-        defaultMessage: text.badgeTextExpiredOn,
-      }, {
-        dateExpired: states.dateExpired,
-      })))),
-  };
-  const alertMap = {
-    NOT_ACTIVE: (index.h("sl-alert", { type: "danger", open: true, class: sheet$g.classes.WarningAlertContainer },
-      index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-      index.h("strong", null, global.intl.formatMessage({
-        id: `taxAlertHeaderNotActive`,
-        defaultMessage: text.taxAlertHeaderNotActive,
-      }, {
-        documentType: states.documentType,
-      })),
-      index.h("br", null),
-      global.intl.formatMessage({
-        id: `taxAlertMessage`,
-        defaultMessage: text.taxAlertMessage,
-      }, {
-        documentType: states.documentType,
-      }))),
-    EXPIRING_SOON: (index.h("sl-alert", { type: "warning", open: true, class: sheet$g.classes.ExpiringSoonAlertContainer },
-      index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-      index.h("strong", null, global.intl.formatMessage({
-        id: `taxAlertHeaderExpiringSoon`,
-        defaultMessage: text.taxAlertHeaderExpiringSoon,
-      }, {
-        documentType: states.documentType,
-        dateExpired: states.dateExpired,
-      })),
-      index.h("br", null),
-      global.intl.formatMessage({
-        id: `taxAlertMessageExpiringSoon`,
-        defaultMessage: text.taxAlertMessageExpiringSoon,
-      }, {
-        documentType: states.documentType,
-      }))),
-    EXPIRED: (index.h("sl-alert", { type: "danger", open: true, class: sheet$g.classes.WarningAlertContainer },
-      index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-      index.h("strong", null, global.intl.formatMessage({
-        id: `taxAlertHeaderExpiredOn`,
-        defaultMessage: text.taxAlertHeaderExpiredOn,
-      }, {
-        documentType: states.documentType,
-      })),
-      index.h("br", null),
-      global.intl.formatMessage({
-        id: `taxAlertMessage`,
-        defaultMessage: text.taxAlertMessage,
-      }, {
-        documentType: states.documentType,
-      }))),
-  };
-  return (index.h("div", null,
-    index.h("div", null,
-      index.h("style", { type: "text/css" }, styleString$g),
-      ((_a = states.errors) === null || _a === void 0 ? void 0 : _a.general) && (index.h("sl-alert", { type: "danger", open: true, class: sheet$g.classes.WarningAlertContainer },
-        index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-        index.h("strong", null, text.error.generalTitle),
-        index.h("br", null),
-        text.error.generalDescription)),
-      (states.status === "NOT_ACTIVE" || states.status === "EXPIRED") &&
-        alertMap[states.status],
-      states.status === "ACTIVE" &&
-        states.expiresSoon &&
-        alertMap.EXPIRING_SOON,
-      index.h("div", null,
-        index.h("h3", null, text.bankingInformationSectionHeader),
-        index.h("div", { class: sheet$g.classes.BankingInformationContainer },
-          index.h(PayoutDetailsCardView, Object.assign({}, testDetailsCardProps)),
-          index.h("sl-button", { disabled: states.disabled || states.loading, type: "default", class: sheet$g.classes.EditBankDetailsButton }, "Edit Bank Details"))),
-      index.h("div", { class: sheet$g.classes.TaxDocumentsContainer },
-        index.h("h3", { class: sheet$g.classes.TaxDocumentsHeaderContainer }, text.taxDocumentSectionHeader),
-        index.h("div", null,
-          states.loading ? (index.h("div", { class: sheet$g.classes.TaxSectionSkeletonContainer },
-            index.h("sl-skeleton", { class: sheet$g.classes.SkeletonOne }),
-            index.h("sl-skeleton", { class: sheet$g.classes.SkeletonTwo }))) : (index.h("span", { class: sheet$g.classes.TaxFormDetailsContainer }, states.noFormNeeded ? (index.h("p", { class: sheet$g.classes.TaxDocSubtext }, text.noFormNeededSubtext)) : (index.h("div", { class: sheet$g.classes.StatusContainer },
-            index.h("h4", null, global.intl.formatMessage({
-              id: "section-subheader",
-              defaultMessage: text.taxDocumentSectionSubHeader,
-            }, {
-              documentType: states.documentType,
-            })),
-            statusMap[states.status])))),
-          states.noFormNeeded ? ("") : (index.h("sl-button", { disabled: states.disabled || states.loading, onClick: callbacks.onClick, type: "default", class: sheet$g.classes.NewFormButton }, text.newFormButton)))))));
-};
-
-const style$i = {
   FormWrapper: {},
   ErrorInput: {
     "&::part(base)": {
@@ -4601,9 +4090,9 @@ const style$i = {
     },
   },
 };
-const sheet$h = JSS.createStyleSheet(style$i);
-const styleString$h = sheet$h.toString();
-const vanillaStyle$b = `
+const sheet$f = JSS.createStyleSheet(style$f);
+const styleString$f = sheet$f.toString();
+const vanillaStyle$a = `
     :host{
       display: block;   
     }
@@ -4628,22 +4117,22 @@ const vanillaStyle$b = `
 const UserInfoFormView = (props) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j;
   const { states, states: { formState }, callbacks, text, refs, data, } = props;
-  const { classes } = sheet$h;
+  const { classes } = sheet$f;
   console.log({ formState, data });
   return (index.h("sl-form", { class: classes.FormWrapper, "onSl-submit": callbacks.onSubmit, ref: (el) => (refs.formRef.current = el), novalidate: true },
     index.h("style", { type: "text/css" },
-      styleString$h,
-      vanillaStyle$b),
+      styleString$f,
+      vanillaStyle$a),
     index.h("div", { class: classes.TextContainer },
       index.h("div", null,
         index.h("p", null, text.formStep),
         index.h("h3", null, text.personalInformation))),
-    ((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.general) && (index.h("sl-alert", { type: "warning", open: true, class: sheet$h.classes.AlertContainer },
+    ((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.general) && (index.h("sl-alert", { type: "warning", open: true, class: sheet$f.classes.AlertContainer },
       index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
       index.h("strong", null, text.error.generalTitle),
       index.h("br", null),
       text.error.generalDescription)),
-    states.isPartner && (index.h("sl-alert", { type: "primary", open: true, class: sheet$h.classes.PartnerAlertContainer },
+    states.isPartner && (index.h("sl-alert", { type: "primary", open: true, class: sheet$f.classes.PartnerAlertContainer },
       index.h("sl-icon", { slot: "icon", name: "info-circle" }),
       index.h("strong", null, text.isPartnerAlertHeader),
       index.h("br", null),
@@ -4683,12 +4172,12 @@ const UserInfoFormView = (props) => {
             text.taxAndBankingCollection),
           index.h("sl-checkbox", { exportparts: "label: input-label", checked: formState.allowBankingCollection === true, "onSl-change": (e) => {
               e.target.value = e.target.checked;
-            }, disabled: states.disabled, required: true, value: formState.allowBankingCollection, id: "allowBankingCollection", name: "/allowBankingCollection" }, text.allowBankingCollection),
+            }, disabled: states.isPartner ? false : states.disabled, required: true, value: formState.allowBankingCollection, id: "allowBankingCollection", name: "/allowBankingCollection" }, text.allowBankingCollection),
           ((_j = formState.errors) === null || _j === void 0 ? void 0 : _j.allowBankingCollection) && (index.h("p", { class: classes.ErrorText }, text.error.allowBankingCollection)))),
-      index.h("sl-button", { type: "primary", disabled: states.disabled, loading: states.loading, submit: true, exportparts: "base: primarybutton-base" }, text.submitButton)))));
+      index.h("sl-button", { type: "primary", disabled: states.isPartner ? false : states.disabled, loading: states.loading, submit: true, exportparts: "base: primarybutton-base" }, text.submitButton)))));
 };
 
-const style$j = {
+const style$g = {
   Container: {
     width: "100%",
   },
@@ -4717,9 +4206,9 @@ const style$j = {
     },
   },
 };
-const sheet$i = JSS.createStyleSheet(style$j);
-const styleString$i = sheet$i.toString();
-const vanillaStyle$c = `
+const sheet$g = JSS.createStyleSheet(style$g);
+const styleString$g = sheet$g.toString();
+const vanillaStyle$b = `
     :host{
       display: block;   
     }
@@ -4732,13 +4221,13 @@ const vanillaStyle$c = `
 const OtherRegionSlotView = (props) => {
   var _a, _b, _c;
   const { states, states: { formState }, text, } = props;
-  const { classes } = sheet$i;
+  const { classes } = sheet$g;
   console.log("regions", { formState });
   return (index.h("div", { style: states.hide ? { display: "none" } : {} },
     index.h("form", { class: classes.Container },
       index.h("style", { type: "text/css" },
-        styleString$i,
-        vanillaStyle$c),
+        styleString$g,
+        vanillaStyle$b),
       index.h("hr", { class: classes.HR }),
       index.h("div", { class: classes.InputContainer },
         index.h("sl-select", Object.assign({ required: true, class: classes.Input, value: formState.countryCode, exportparts: "label: input-label", label: text.selectedRegion, disabled: states.loading }, (((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.selectedRegion) && {
@@ -4754,13 +4243,13 @@ const OtherRegionSlotView = (props) => {
 const IndirectDetailsSlotView = (props) => {
   var _a, _b;
   const { states, states: { formState }, text, } = props;
-  const { classes } = sheet$i;
+  const { classes } = sheet$g;
   console.log("regions", { formState });
   return (index.h("div", { style: states.hide ? { display: "none" } : {} },
     index.h("form", { class: classes.Container },
       index.h("style", { type: "text/css" },
-        styleString$i,
-        vanillaStyle$c),
+        styleString$g,
+        vanillaStyle$b),
       index.h("hr", { class: classes.HR }),
       index.h("div", { class: classes.InputContainer },
         index.h("sl-select", Object.assign({ required: true, value: formState.province, exportparts: "label: input-label", class: classes.Input, label: text.province, disabled: states.loading }, (((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.province) && {
@@ -4787,6 +4276,144 @@ const IndirectDetailsSlotView = (props) => {
       index.h("hr", { class: classes.HR }))));
 };
 
+const statusMap = {
+  pending: "warning",
+  upcoming: "success",
+  "next payout": "success",
+};
+const style$h = {
+  Container: {
+    display: "grid",
+    gridTemplateColumns: "1fr",
+    gridGap: "var(--sl-spacing-large)",
+    background: "var(--sl-color-neutral-0)",
+    boxShadow: "0px 2px 4px rgba(28, 28, 33, 0.12)",
+    borderRadius: "4px",
+    padding: "var(--sl-spacing-large)",
+    minHeight: "150px",
+    border: "1px solid var(--sl-color-gray-200)",
+  },
+  StatusContainer: {
+    display: "flex",
+    justifyContent: "space-between",
+    alignItems: "center",
+  },
+  MainCurrencyLabel: {
+    fontWeight: "var(--sl-font-weight-normal)",
+    color: "var(--sl-color-gray-500)",
+  },
+  MainCurrency: {
+    margin: 0,
+    fontSize: "32px",
+    width: "auto",
+  },
+  SubduedRegularText: {
+    fontSize: "var(--sl-font-size-small)",
+    color: "var(--sl-color-gray-500)",
+    margin: 0,
+    width: "auto",
+  },
+  CurrenciesContainer: {
+    display: "grid",
+    width: "auto",
+    gridTemplateColumns: "1fr 1fr 1fr",
+    gap: "var(--sl-spacing-xx-small) var(--sl-spacing-small)",
+    paddingTop: "var(--sq-spacing-xx-small)",
+    "& > :not(:last-child)": {
+      borderRight: "1px solid var(--sl-color-gray-200)",
+    },
+    "& > :nth-child(3)": {
+      border: "none",
+    },
+  },
+  CurrencyContainer: {
+    paddingRight: "var(--sl-spacing-small)",
+    gap: "var(--sl-spacing-small)",
+  },
+  SubCurrencyText: {
+    fontWeight: "var(--sl-font-weight-bold)",
+    fontSize: "var(--sl-font-size-large)",
+    margin: "0",
+  },
+  W9Container: {
+    paddingTop: "var(--sl-spacing-large)",
+    borderTop: "1px solid var(--sl-color-gray-200)",
+  },
+  SkeletonOne: {
+    width: "25%",
+    height: "16px",
+  },
+  SkeletonTwo: {
+    width: "25%",
+    height: "24px",
+  },
+  SkeletonThree: {
+    width: "50%",
+    height: "34px",
+  },
+};
+function PayoutDetailsCardView(props) {
+  var _a;
+  const sheet = JSS.createStyleSheet(style$h);
+  const styleString = sheet.toString();
+  const { classes } = sheet;
+  const currencyList = (currencies) => {
+    return (index.h("div", { class: classes.CurrenciesContainer },
+      " ", currencies === null || currencies === void 0 ? void 0 :
+      currencies.map((currency) => {
+        return (index.h("div", { class: classes.CurrencyContainer },
+          index.h("p", { class: classes.SubCurrencyText }, currency === null || currency === void 0 ? void 0 :
+            currency.amountText, currency === null || currency === void 0 ? void 0 :
+            currency.currencyText)));
+      }),
+      " "));
+  };
+  const { loading, mainCurrency, status, otherCurrencies, otherCurrenciesText, pendingStatusBadgeText, upcomingStatusBadgeText, nextPayoutStatusBadgeText, pendingDetailedStatusText, upcomingDetailedStatusText, nextPayoutDetailedStatusText, w9Pending, w9PendingText, empty, hasDatePending, hasW9Pending, } = props;
+  const badgeText = {
+    pending: pendingStatusBadgeText,
+    upcoming: upcomingStatusBadgeText,
+    "next payout": nextPayoutStatusBadgeText,
+  };
+  const statusText = {
+    pending: pendingDetailedStatusText,
+    upcoming: upcomingDetailedStatusText,
+    "next payout": nextPayoutDetailedStatusText,
+  };
+  return (index.h("div", null,
+    index.h("style", { type: "text/css" }, styleString),
+    index.h("div", { class: classes.Container },
+      loading ? (index.h("div", { class: classes.StatusContainer },
+        index.h("sl-skeleton", { class: classes.SkeletonOne }),
+        " ",
+        index.h("sl-skeleton", { class: classes.SkeletonTwo }))) : (index.h("div", { class: classes.StatusContainer },
+        index.h("p", { class: classes.SubduedRegularText }, empty && status === "pending"
+          ? ""
+          : status !== "pending"
+            ? statusText[status]
+            : hasDatePending
+              ? statusText["pending"]
+              : w9PendingText),
+        index.h("sl-badge", { pill: true, type: statusMap[status] }, badgeText[status]))),
+      loading ? (index.h("sl-skeleton", { class: classes.SkeletonThree })) : empty ? (index.h("h1", { class: classes.MainCurrency }, "No rewards")) : (index.h("h1", { class: classes.MainCurrency },
+        hasDatePending || status !== "pending"
+          ? mainCurrency === null || mainCurrency === void 0 ? void 0 : mainCurrency.amountText : (_a = w9Pending === null || w9Pending === void 0 ? void 0 : w9Pending[0]) === null || _a === void 0 ? void 0 : _a.amountText,
+        " ",
+        mainCurrency.currencyText)),
+      otherCurrencies !== undefined &&
+        otherCurrencies !== false &&
+        !loading && (index.h("div", null,
+        index.h("p", { class: classes.SubduedRegularText, style: { fontSize: "var(--sl-font-size-x-small)" } },
+          "+ ",
+          otherCurrenciesText),
+        currencyList(otherCurrencies))),
+      hasW9Pending && status === "pending" && hasDatePending && !loading && (index.h("div", { class: classes.W9Container },
+        index.h("p", { class: classes.SubduedRegularText }, w9PendingText),
+        currencyList(w9Pending))),
+      loading ? (index.h("sl-skeleton", { class: classes.SkeletonOne })) : (index.h("div", { style: { display: "flex", gap: "var(--sl-spacing-small)" } },
+        index.h("span", null, "Card ***2381"),
+        index.h("span", null, "Toronto Dominion Bank"))))));
+}
+
 function t(t,n,r){return Math.min(Math.max(t,r),n)}class n extends Error{constructor(t){super(`Failed to parse color: "${t}"`);}}function r(r){if("string"!=typeof r)throw new n(r);if("transparent"===r.trim().toLowerCase())return [0,0,0,0];let e=r.trim();e=u.test(r)?function(t){const r=t.toLowerCase().trim(),e=o[function(t){let n=5381,r=t.length;for(;r;)n=33*n^t.charCodeAt(--r);return (n>>>0)%2341}(r)];if(!e)throw new n(t);return `#${e}`}(r):r;const f=s.exec(e);if(f){const t=Array.from(f).slice(1);return [...t.slice(0,3).map(t=>parseInt(_(t,2),16)),parseInt(_(t[3]||"f",2),16)/255]}const p=i.exec(e);if(p){const t=Array.from(p).slice(1);return [...t.slice(0,3).map(t=>parseInt(t,16)),parseInt(t[3]||"ff",16)/255]}const z=a.exec(e);if(z){const t=Array.from(z).slice(1);return [...t.slice(0,3).map(t=>parseInt(t,10)),parseFloat(t[3]||"1")]}const h=c.exec(e);if(h){const[e,o,_,s]=Array.from(h).slice(1).map(parseFloat);if(t(0,100,o)!==o)throw new n(r);if(t(0,100,_)!==_)throw new n(r);return [...l(e,o,_),s||1]}throw new n(r)}const e=t=>parseInt(t.replace(/_/g,""),36),o="1q29ehhb 1n09sgk7 1kl1ekf_ _yl4zsno 16z9eiv3 1p29lhp8 _bd9zg04 17u0____ _iw9zhe5 _to73___ _r45e31e _7l6g016 _jh8ouiv _zn3qba8 1jy4zshs 11u87k0u 1ro9yvyo 1aj3xael 1gz9zjz0 _3w8l4xo 1bf1ekf_ _ke3v___ _4rrkb__ 13j776yz _646mbhl _nrjr4__ _le6mbhl 1n37ehkb _m75f91n _qj3bzfz 1939yygw 11i5z6x8 _1k5f8xs 1509441m 15t5lwgf _ae2th1n _tg1ugcv 1lp1ugcv 16e14up_ _h55rw7n _ny9yavn _7a11xb_ 1ih442g9 _pv442g9 1mv16xof 14e6y7tu 1oo9zkds 17d1cisi _4v9y70f _y98m8kc 1019pq0v 12o9zda8 _348j4f4 1et50i2o _8epa8__ _ts6senj 1o350i2o 1mi9eiuo 1259yrp0 1ln80gnw _632xcoy 1cn9zldc _f29edu4 1n490c8q _9f9ziet 1b94vk74 _m49zkct 1kz6s73a 1eu9dtog _q58s1rz 1dy9sjiq __u89jo3 _aj5nkwg _ld89jo3 13h9z6wx _qa9z2ii _l119xgq _bs5arju 1hj4nwk9 1qt4nwk9 1ge6wau6 14j9zlcw 11p1edc_ _ms1zcxe _439shk6 _jt9y70f _754zsow 1la40eju _oq5p___ _x279qkz 1fa5r3rv _yd2d9ip _424tcku _8y1di2_ _zi2uabw _yy7rn9h 12yz980_ __39ljp6 1b59zg0x _n39zfzp 1fy9zest _b33k___ _hp9wq92 1il50hz4 _io472ub _lj9z3eo 19z9ykg0 _8t8iu3a 12b9bl4a 1ak5yw0o _896v4ku _tb8k8lv _s59zi6t _c09ze0p 1lg80oqn 1id9z8wb _238nba5 1kq6wgdi _154zssg _tn3zk49 _da9y6tc 1sg7cv4f _r12jvtt 1gq5fmkz 1cs9rvci _lp9jn1c _xw1tdnb 13f9zje6 16f6973h _vo7ir40 _bt5arjf _rc45e4t _hr4e100 10v4e100 _hc9zke2 _w91egv_ _sj2r1kk 13c87yx8 _vqpds__ _ni8ggk8 _tj9yqfb 1ia2j4r4 _7x9b10u 1fc9ld4j 1eq9zldr _5j9lhpx _ez9zl6o _md61fzm".split(" ").reduce((t,n)=>{const r=e(n.substring(0,3)),o=e(n.substring(3)).toString(16);let _="";for(let t=0;t<6-o.length;t++)_+="0";return t[r]=`${_}${o}`,t},{}),_=(t,n)=>Array.from(Array(n)).map(()=>t).join(""),s=new RegExp(`^#${_("([a-f0-9])",3)}([a-f0-9])?$`,"i"),i=new RegExp(`^#${_("([a-f0-9]{2})",3)}([a-f0-9]{2})?$`,"i"),a=new RegExp(`^rgba?\\(\\s*(\\d+)\\s*${_(",\\s*(\\d+)\\s*",2)}(?:,\\s*([\\d.]+))?\\s*\\)$`,"i"),c=/^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/i,u=/^[a-z]+$/i,f=t=>Math.round(255*t),l=(t,n,r)=>{let e=r/100;if(0===n)return [e,e,e].map(f);const o=(t%360+360)%360/60,_=(1-Math.abs(2*e-1))*(n/100),s=_*(1-Math.abs(o%2-1));let i=0,a=0,c=0;o>=0&&o<1?(i=_,a=s):o>=1&&o<2?(i=s,a=_):o>=2&&o<3?(a=_,c=s):o>=3&&o<4?(a=s,c=_):o>=4&&o<5?(i=s,c=_):o>=5&&o<6&&(i=_,c=s);const u=e-_/2;return [i+u,a+u,c+u].map(f)};function p(t){const[n,e,o,_]=r(t).map((t,n)=>3===n?t:t/255),s=Math.max(n,e,o),i=Math.min(n,e,o),a=(s+i)/2;if(s===i)return [0,0,a,_];const c=s-i;return [60*(n===s?(e-o)/c+(e<o?6:0):e===s?(o-n)/c+2:(n-e)/c+4),a>.5?c/(2-s-i):c/(s+i),a,_]}function z(n,r,e,o){return `hsla(${(n%360).toFixed()}, ${t(0,100,100*r).toFixed()}%, ${t(0,100,100*e).toFixed()}%, ${parseFloat(t(0,1,o).toFixed(3))})`}
 
 const colorScale = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
@@ -4877,7 +4504,6 @@ exports.CardFeedView = CardFeedView;
 exports.CheckboxFieldView = CheckboxFieldView;
 exports.CopyTextView = CopyTextView;
 exports.CouponCodeView = CouponCodeView;
-exports.DocusignFormView = DocusignFormView;
 exports.DropdownFieldView = DropdownFieldView;
 exports.EditProfileView = EditProfileView;
 exports.HeroView = HeroView;
@@ -4901,7 +4527,6 @@ exports.ShadowViewAddon = ShadowViewAddon;
 exports.ShareButtonView = ShareButtonView;
 exports.StatContainerView = StatContainerView;
 exports.TaskCardView = TaskCardView;
-exports.TaxDocumentSubmittedView = TaxDocumentSubmittedView;
 exports.UserInfoFormView = UserInfoFormView;
 exports.autoColorScaleCss = autoColorScaleCss;
 exports.chooseAmountFixed = chooseAmountFixed;