@saasquatch/mint-components 1.15.0-6 → 1.15.0-60

package/dist/collection/components/tax-and-cash/sqm-tax-and-cash/sqm-tax-and-cash.js

@@ -1,13 +1,14 @@
+import { isDemo, useParentState } from "@saasquatch/component-boilerplate";
 import { withHooks } from "@saasquatch/stencil-hooks";
 import { Component, Prop, h } from "@stencil/core";
 import deepmerge from "deepmerge";
+import { parseStates } from "../../../utils/parseStates";
 import { getProps } from "../../../utils/utils";
-import LoadingView from "./LoadingView";
-import { TAX_CONTEXT_NAMESPACE } from "./data";
+import { TAX_CONTEXT_NAMESPACE } from "../data";
+import { ErrorView } from "./ErrorView";
 import { extractProps } from "./extractProps";
+import LoadingView from "./LoadingView";
 import { useTaxAndCash } from "./useTaxAndCash";
-import { isDemo, useParentState } from "@saasquatch/component-boilerplate";
-import { ErrorView } from "./ErrorView";
 /**
  * @uiName Tax and Cash
  * @exampleGroup Tax and Cash
@@ -304,6 +305,21 @@ export class TaxAndCashMonolith {
      * @uiGroup Step 3 Properties
      */
     this.step3_exitButton = "Exit";
+    /**
+     * @uiName Information modal title
+     * @uiGroup Step 3 Properties
+     */
+    this.step3_modalTitle = "Important Note";
+    /**
+     * @uiName Information modal description text
+     * @uiGroup Step 3 Properties
+     */
+    this.step3_modalDescription = "Remember the name you enter in your tax form. It must exactly match the bank account holder name configured in the next step. {br}{br}Otherwise you will have to resubmit your form again and there will be delays receiving your payout.";
+    /**
+     * @uiName Information modal button text
+     * @uiGroup Step 3 Properties
+     */
+    this.step3_modalButtonText = "I understand";
     /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                       STEP 4 PROPS:
      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
@@ -386,7 +402,12 @@ export class TaxAndCashMonolith {
      * @uiName Beneficiary account field label
      * @uiGroup Step 4 Properties
      */
-    this.step4_beneficiaryAccountNameLabel = "Beneficiary account name";
+    this.step4_beneficiaryAccountNameLabel = "Account holder name";
+    /**
+     * @uiName Beneficiary account field description
+     * @uiGroup Step 4 Properties
+     */
+    this.step4_beneficiaryAccountNameDescription = "The beneficiary name of your bank account. Ensure this matches the name on your tax form.";
     /**
      * @uiName Bank account type field label
      * @uiGroup Step 4 Properties
@@ -528,6 +549,21 @@ export class TaxAndCashMonolith {
      * @uiGroup Step 4 Properties
      */
     this.step4_verifyEmailDescriptionText = "Verify your email to update your payment settings. Enter the code sent to {email} from our referral provider, impact.com.";
+    /**
+     * @uiName Information modal title
+     * @uiGroup Step 4 Properties
+     */
+    this.step4_modalTitle = "Important Note";
+    /**
+     * @uiName Information modal description text
+     * @uiGroup Step 4 Properties
+     */
+    this.step4_modalDescription = "Updating payment information places your account and payouts on hold for up to 48 hours while we verify your change. Payments scheduled during the hold period are skipped.";
+    /**
+     * @uiName Information modal button text
+     * @uiGroup Step 4 Properties
+     */
+    this.step4_modalButtonText = "I understand, update my information";
     /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                       DASHBOARD PROPS:
      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
@@ -973,6 +1009,15 @@ export class TaxAndCashMonolith {
      * @uiGroup General Form Properties
      */
     this.supportLink = "support team";
+    /**
+     * @uiName Monolith States
+     * @componentState { "title": "Step 1", "props": { "step": "/1" }, "dependencies": ["sqm-user-info-form"] }
+     * @componentState { "title": "Step 2", "props": { "step": "/2" }, "dependencies": ["sqm-indirect-tax-form"] }
+     * @componentState { "title": "Step 3", "props": { "step": "/3" }, "dependencies": ["sqm-docusign-form"] }
+     * @componentState { "title": "Step 4", "props": { "step": "/4" }, "dependencies": ["sqm-banking-info-form"] }
+     * @componentState { "title": "Dashboard", "props": { "step": "/dashboard" }, "dependencies": ["sqm-tax-and-cash-dashboard"] }
+     */
+    this.stateController = "{}";
     withHooks(this);
   }
   disconnectedCallback() { }
@@ -1017,21 +1062,23 @@ export class TaxAndCashMonolith {
           h("hr", null)));
       })));
     }
-    switch (props.step) {
-      case "/1":
-        return (h("sqm-user-info-form", Object.assign({}, this.getGeneralStepTextProps("step1_"))));
-      case "/2":
-        return (h("sqm-indirect-tax-form", Object.assign({}, this.getGeneralStepTextProps("step2_"))));
-      case "/3":
-        return (h("sqm-docusign-form", Object.assign({}, this.getGeneralStepTextProps("step3_"))));
-      case "/4":
-        return (h("sqm-banking-info-form", Object.assign({}, this.getGeneralStepTextProps("step4_"))));
-      case "/dashboard":
-        return (h("sqm-tax-and-cash-dashboard", Object.assign({}, this.getGeneralStepTextProps("dashboard_"))));
-      case "/error":
-        return (h(ErrorView, { loadingErrorAlertHeader: this.loadingErrorAlertHeader, loadingErrorAlertDescription: this.loadingErrorAlertDescription }));
-    }
-    return h(LoadingView, null);
+    const getStep = () => {
+      switch (props.step) {
+        case "/1":
+          return (h("sqm-user-info-form", Object.assign({}, this.getGeneralStepTextProps("step1_"), extractProps(props, "sqm-user-info-form_"))));
+        case "/2":
+          return (h("sqm-indirect-tax-form", Object.assign({}, this.getGeneralStepTextProps("step2_"), extractProps(props, "sqm-indirect-tax-form_"))));
+        case "/3":
+          return (h("sqm-docusign-form", Object.assign({}, this.getGeneralStepTextProps("step3_"), extractProps(props, "sqm-docusign-form_"))));
+        case "/4":
+          return (h("sqm-banking-info-form", Object.assign({}, this.getGeneralStepTextProps("step4_"), extractProps(props, "sqm-banking-info-form_"))));
+        case "/dashboard":
+          return (h("sqm-tax-and-cash-dashboard", Object.assign({}, this.getGeneralStepTextProps("dashboard_"), extractProps(props, "sqm-tax-and-cash-dashboard_"))));
+        case "/error":
+          return (h(ErrorView, { loadingErrorAlertHeader: this.loadingErrorAlertHeader, loadingErrorAlertDescription: this.loadingErrorAlertDescription }));
+      }
+    };
+    return getStep() || h(LoadingView, null);
   }
   static get is() { return "sqm-tax-and-cash"; }
   static get encapsulation() { return "shadow"; }
@@ -2224,6 +2271,78 @@ export class TaxAndCashMonolith {
       "reflect": false,
       "defaultValue": "\"Exit\""
     },
+    "step3_modalTitle": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Information modal title",
+            "name": "uiName"
+          }, {
+            "text": "Step 3 Properties",
+            "name": "uiGroup"
+          }],
+        "text": ""
+      },
+      "attribute": "step-3_modal-title",
+      "reflect": false,
+      "defaultValue": "\"Important Note\""
+    },
+    "step3_modalDescription": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Information modal description text",
+            "name": "uiName"
+          }, {
+            "text": "Step 3 Properties",
+            "name": "uiGroup"
+          }],
+        "text": ""
+      },
+      "attribute": "step-3_modal-description",
+      "reflect": false,
+      "defaultValue": "\"Remember the name you enter in your tax form. It must exactly match the bank account holder name configured in the next step. {br}{br}Otherwise you will have to resubmit your form again and there will be delays receiving your payout.\""
+    },
+    "step3_modalButtonText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Information modal button text",
+            "name": "uiName"
+          }, {
+            "text": "Step 3 Properties",
+            "name": "uiGroup"
+          }],
+        "text": ""
+      },
+      "attribute": "step-3_modal-button-text",
+      "reflect": false,
+      "defaultValue": "\"I understand\""
+    },
     "step4_taxAndPayouts": {
       "type": "string",
       "mutable": false,
@@ -2582,7 +2701,31 @@ export class TaxAndCashMonolith {
       },
       "attribute": "step-4_beneficiary-account-name-label",
       "reflect": false,
-      "defaultValue": "\"Beneficiary account name\""
+      "defaultValue": "\"Account holder name\""
+    },
+    "step4_beneficiaryAccountNameDescription": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Beneficiary account field description",
+            "name": "uiName"
+          }, {
+            "text": "Step 4 Properties",
+            "name": "uiGroup"
+          }],
+        "text": ""
+      },
+      "attribute": "step-4_beneficiary-account-name-description",
+      "reflect": false,
+      "defaultValue": "\"The beneficiary name of your bank account. Ensure this matches the name on your tax form.\""
     },
     "step4_bankAccountTypeLabel": {
       "type": "string",
@@ -3232,6 +3375,78 @@ export class TaxAndCashMonolith {
       "reflect": false,
       "defaultValue": "\"Verify your email to update your payment settings. Enter the code sent to {email} from our referral provider, impact.com.\""
     },
+    "step4_modalTitle": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Information modal title",
+            "name": "uiName"
+          }, {
+            "text": "Step 4 Properties",
+            "name": "uiGroup"
+          }],
+        "text": ""
+      },
+      "attribute": "step-4_modal-title",
+      "reflect": false,
+      "defaultValue": "\"Important Note\""
+    },
+    "step4_modalDescription": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Information modal description text",
+            "name": "uiName"
+          }, {
+            "text": "Step 4 Properties",
+            "name": "uiGroup"
+          }],
+        "text": ""
+      },
+      "attribute": "step-4_modal-description",
+      "reflect": false,
+      "defaultValue": "\"Updating payment information places your account and payouts on hold for up to 48 hours while we verify your change. Payments scheduled during the hold period are skipped.\""
+    },
+    "step4_modalButtonText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Information modal button text",
+            "name": "uiName"
+          }, {
+            "text": "Step 4 Properties",
+            "name": "uiGroup"
+          }],
+        "text": ""
+      },
+      "attribute": "step-4_modal-button-text",
+      "reflect": false,
+      "defaultValue": "\"I understand, update my information\""
+    },
     "dashboard_statusTextActive": {
       "type": "string",
       "mutable": false,
@@ -5014,20 +5229,55 @@ export class TaxAndCashMonolith {
       "reflect": false,
       "defaultValue": "\"support team\""
     },
+    "stateController": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Monolith States",
+            "name": "uiName"
+          }, {
+            "text": "{ \"title\": \"Step 1\", \"props\": { \"step\": \"/1\" }, \"dependencies\": [\"sqm-user-info-form\"] }",
+            "name": "componentState"
+          }, {
+            "text": "{ \"title\": \"Step 2\", \"props\": { \"step\": \"/2\" }, \"dependencies\": [\"sqm-indirect-tax-form\"] }",
+            "name": "componentState"
+          }, {
+            "text": "{ \"title\": \"Step 3\", \"props\": { \"step\": \"/3\" }, \"dependencies\": [\"sqm-docusign-form\"] }",
+            "name": "componentState"
+          }, {
+            "text": "{ \"title\": \"Step 4\", \"props\": { \"step\": \"/4\" }, \"dependencies\": [\"sqm-banking-info-form\"] }",
+            "name": "componentState"
+          }, {
+            "text": "{ \"title\": \"Dashboard\", \"props\": { \"step\": \"/dashboard\" }, \"dependencies\": [\"sqm-tax-and-cash-dashboard\"] }",
+            "name": "componentState"
+          }],
+        "text": ""
+      },
+      "attribute": "state-controller",
+      "reflect": false,
+      "defaultValue": "\"{}\""
+    },
     "demoData": {
       "type": "unknown",
       "mutable": false,
       "complexType": {
-        "original": "DemoData<UseTaxAndCashResultType>",
-        "resolved": "{ loading?: boolean; setStep?: (value: string) => void; step?: string; context?: TaxContext; namespace?: string; }",
+        "original": "DemoData<TaxAndCashMonolith>",
+        "resolved": "{ step1_firstName?: string; step1_lastName?: string; step1_email?: string; step1_country?: string; step1_phoneNumber?: string; step1_address?: string; step1_city?: string; step1_state?: string; step1_province?: string; step1_region?: string; step1_postalCode?: string; step1_currency?: string; step1_currencyHelpText?: string; step1_allowBankingCollection?: string; step1_personalInformation?: string; step1_termsAndConditionsLabel?: string; step1_termsAndConditionsLink?: string; step1_searchForCurrencyText?: string; step2_indirectTax?: string; step2_indirectTaxDescription?: string; step2_indirectTaxDetails?: string; step2_otherRegion?: string; step2_otherRegionSubtext?: string; step2_notRegistered?: string; step2_notRegisteredSubtext?: string; step2_selectedRegion?: string; step2_indirectTaxNumber?: string; step2_province?: string; step2_indirectTaxNumberError?: string; step2_qstNumber?: string; step2_isRegisteredQST?: string; step2_isRegisteredSubRegionIncomeTax?: string; step2_subRegion?: string; step2_subRegionTaxNumberLabel?: string; step2_cannotChangeInfoAlert?: string; step3_taxForm?: string; step3_taxFormLabel?: string; step3_participantType?: string; step3_businessEntity?: string; step3_individualParticipant?: string; step3_taxFormDescription?: string; step3_taxFormDescriptionIndividualParticipant?: string; step3_taxFormDescriptionBusinessEntity?: string; step3_docusignExpired?: string; step3_docusignSessionWarning?: string; step3_docusignError?: string; step3_refreshButton?: string; step3_exitButton?: string; step3_modalTitle?: string; step3_modalDescription?: string; step3_modalButtonText?: string; step4_taxAndPayouts?: string; step4_directlyToBankAccount?: string; step4_toPayPalAccount?: string; step4_paymentScheduleBalanceThreshold?: string; step4_paymentScheduleFixedDay?: string; step4_paymentDaySelectLabel?: string; step4_paymentThresholdSelectLabel?: string; step4_paymentDayFirstOfMonthLabelText?: string; step4_paymentDayFifteenthOfMonthLabelText?: string; step4_paymentMethod?: string; step4_paymentSchedule?: string; step4_paymentMethodSubtext?: string; step4_payPalInputLabel?: string; step4_bankLocationLabel?: string; step4_beneficiaryAccountNameLabel?: string; step4_beneficiaryAccountNameDescription?: string; step4_bankAccountTypeLabel?: string; step4_checkingSelectItemLabel?: string; step4_savingsSelectItemLabel?: string; step4_bankAccountNumberLabel?: string; step4_ibanLabel?: string; step4_swiftCodeLabel?: string; step4_routingCodeLabel?: string; step4_bankNameLabel?: string; step4_classificationEntityLabel?: string; step4_businessSelectItemLabel?: string; step4_individualSelectItemLabel?: string; step4_foreignSelectItemLabel?: string; step4_classificationCPFLabel?: string; step4_patronymicNameLabel?: string; step4_voCodeLabel?: string; step4_agencyCodeLabel?: string; step4_branchCodeLabel?: string; step4_classificationLabel?: string; step4_taxPayerIdLabel?: string; step4_bankAddressLabel?: string; step4_bankCityLabel?: string; step4_bankStateLabel?: string; step4_bankPostalCodeLabel?: string; step4_eftWithdrawalLabel?: string; step4_fxWireProcessingFeeLabel?: string; step4_verifyEmailHeaderText?: string; step4_verifyEmailDescriptionText?: string; step4_modalTitle?: string; step4_modalDescription?: string; step4_modalButtonText?: string; dashboard_statusTextActive?: string; dashboard_statusTextNotActive?: string; dashboard_statusTextNotVerified?: string; dashboard_badgeTextSubmittedOn?: string; dashboard_badgeTextSubmittedOnW8?: string; dashboard_badgeTextAwaitingReview?: string; dashboard_taxAlertHeaderNotActiveW9?: string; dashboard_taxAlertHeaderNotActiveW8?: string; dashboard_taxAlertNotActiveMessageW9?: string; dashboard_taxAlertNotActiveMessageW8?: string; dashboard_invalidForm?: string; dashboard_bankingInformationSectionHeader?: string; dashboard_taxDocumentSectionHeader?: string; dashboard_taxDocumentSectionSubHeader?: string; dashboard_noFormNeededSubtext?: string; dashboard_indirectTaxInfoSectionHeader?: string; dashboard_indirectTaxInfoCanada?: string; dashboard_indirectTaxInfoOtherCountry?: string; dashboard_indirectTaxInfoSpain?: string; dashboard_indirectTaxTooltipSupport?: string; dashboard_indirectTaxDetails?: string; dashboard_newFormButton?: string; dashboard_editPaymentInformationButton?: string; dashboard_notRegisteredForTax?: string; dashboard_qstNumber?: string; dashboard_subRegionTaxNumber?: string; dashboard_statusBadgeText?: string; dashboard_thresholdPayoutText?: string; dashboard_accountText?: string; dashboard_invoiceColumnTitle?: string; dashboard_dateColumnTitle?: string; dashboard_earningsColumnTitle?: string; dashboard_indirectTaxColumnTitle?: string; dashboard_payoutFromImpact?: string; dashboard_earningsAfterTaxColumnTitle?: string; dashboard_payoutHoldAlertHeader?: string; dashboard_payoutHoldAlertDescription?: string; dashboard_payoutMissingInformationText?: string; dashboard_invoiceDescription?: string; dashboard_invoicePrevLabel?: string; dashboard_invoiceMoreLabel?: string; dashboard_invoiceHeader?: string; dashboard_invoiceEmptyStateHeader?: string; dashboard_invoiceEmptyStateText?: string; dashboard_replaceTaxFormModalHeader?: string; dashboard_replaceTaxFormModalBodyText?: string; dashboard_verificationRequiredHeader?: string; dashboard_verificationRequiredDescription?: string; dashboard_verificationRequiredInternalHeader?: string; dashboard_verificationRequiredInternalDescription?: string; dashboard_verificationReviewInternalHeader?: string; dashboard_verificationReviewInternalDescription?: string; dashboard_verificationFailedInternalHeader?: string; dashboard_verificationFailedInternalDescription?: string; dashboard_verificationRequiredButtonText?: string; formStep?: string; generalErrorTitle?: string; generalErrorDescription?: string; fieldRequiredError?: string; invalidCharacterError?: string; fieldInvalidError?: string; continueButton?: string; backButton?: string; cancelButton?: string; isPartnerAlertHeader?: string; isPartnerAlertDescription?: string; searchForCountryText?: string; loadingErrorAlertHeader?: string; loadingErrorAlertDescription?: string; taxAndPayoutsDescription?: string; supportLink?: string; stateController?: string; demoData?: Partial<Pick<TaxAndCashMonolith, \"step1_firstName\" | \"step1_lastName\" | \"step1_email\" | \"step1_country\" | \"step1_phoneNumber\" | \"step1_address\" | \"step1_city\" | \"step1_state\" | \"step1_province\" | \"step1_region\" | \"step1_postalCode\" | \"step1_currency\" | \"step1_currencyHelpText\" | \"step1_allowBankingCollection\" | \"step1_personalInformation\" | \"step1_termsAndConditionsLabel\" | \"step1_termsAndConditionsLink\" | \"step1_searchForCurrencyText\" | \"step2_indirectTax\" | \"step2_indirectTaxDescription\" | \"step2_indirectTaxDetails\" | \"step2_otherRegion\" | \"step2_otherRegionSubtext\" | \"step2_notRegistered\" | \"step2_notRegisteredSubtext\" | \"step2_selectedRegion\" | \"step2_indirectTaxNumber\" | \"step2_province\" | \"step2_indirectTaxNumberError\" | \"step2_qstNumber\" | \"step2_isRegisteredQST\" | \"step2_isRegisteredSubRegionIncomeTax\" | \"step2_subRegion\" | \"step2_subRegionTaxNumberLabel\" | \"step2_cannotChangeInfoAlert\" | \"step3_taxForm\" | \"step3_taxFormLabel\" | \"step3_participantType\" | \"step3_businessEntity\" | \"step3_individualParticipant\" | \"step3_taxFormDescription\" | \"step3_taxFormDescriptionIndividualParticipant\" | \"step3_taxFormDescriptionBusinessEntity\" | \"step3_docusignExpired\" | \"step3_docusignSessionWarning\" | \"step3_docusignError\" | \"step3_refreshButton\" | \"step3_exitButton\" | \"step3_modalTitle\" | \"step3_modalDescription\" | \"step3_modalButtonText\" | \"step4_taxAndPayouts\" | \"step4_directlyToBankAccount\" | \"step4_toPayPalAccount\" | \"step4_paymentScheduleBalanceThreshold\" | \"step4_paymentScheduleFixedDay\" | \"step4_paymentDaySelectLabel\" | \"step4_paymentThresholdSelectLabel\" | \"step4_paymentDayFirstOfMonthLabelText\" | \"step4_paymentDayFifteenthOfMonthLabelText\" | \"step4_paymentMethod\" | \"step4_paymentSchedule\" | \"step4_paymentMethodSubtext\" | \"step4_payPalInputLabel\" | \"step4_bankLocationLabel\" | \"step4_beneficiaryAccountNameLabel\" | \"step4_beneficiaryAccountNameDescription\" | \"step4_bankAccountTypeLabel\" | \"step4_checkingSelectItemLabel\" | \"step4_savingsSelectItemLabel\" | \"step4_bankAccountNumberLabel\" | \"step4_ibanLabel\" | \"step4_swiftCodeLabel\" | \"step4_routingCodeLabel\" | \"step4_bankNameLabel\" | \"step4_classificationEntityLabel\" | \"step4_businessSelectItemLabel\" | \"step4_individualSelectItemLabel\" | \"step4_foreignSelectItemLabel\" | \"step4_classificationCPFLabel\" | \"step4_patronymicNameLabel\" | \"step4_voCodeLabel\" | \"step4_agencyCodeLabel\" | \"step4_branchCodeLabel\" | \"step4_classificationLabel\" | \"step4_taxPayerIdLabel\" | \"step4_bankAddressLabel\" | \"step4_bankCityLabel\" | \"step4_bankStateLabel\" | \"step4_bankPostalCodeLabel\" | \"step4_eftWithdrawalLabel\" | \"step4_fxWireProcessingFeeLabel\" | \"step4_verifyEmailHeaderText\" | \"step4_verifyEmailDescriptionText\" | \"step4_modalTitle\" | \"step4_modalDescription\" | \"step4_modalButtonText\" | \"dashboard_statusTextActive\" | \"dashboard_statusTextNotActive\" | \"dashboard_statusTextNotVerified\" | \"dashboard_badgeTextSubmittedOn\" | \"dashboard_badgeTextSubmittedOnW8\" | \"dashboard_badgeTextAwaitingReview\" | \"dashboard_taxAlertHeaderNotActiveW9\" | \"dashboard_taxAlertHeaderNotActiveW8\" | \"dashboard_taxAlertNotActiveMessageW9\" | \"dashboard_taxAlertNotActiveMessageW8\" | \"dashboard_invalidForm\" | \"dashboard_bankingInformationSectionHeader\" | \"dashboard_taxDocumentSectionHeader\" | \"dashboard_taxDocumentSectionSubHeader\" | \"dashboard_noFormNeededSubtext\" | \"dashboard_indirectTaxInfoSectionHeader\" | \"dashboard_indirectTaxInfoCanada\" | \"dashboard_indirectTaxInfoOtherCountry\" | \"dashboard_indirectTaxInfoSpain\" | \"dashboard_indirectTaxTooltipSupport\" | \"dashboard_indirectTaxDetails\" | \"dashboard_newFormButton\" | \"dashboard_editPaymentInformationButton\" | \"dashboard_notRegisteredForTax\" | \"dashboard_qstNumber\" | \"dashboard_subRegionTaxNumber\" | \"dashboard_statusBadgeText\" | \"dashboard_thresholdPayoutText\" | \"dashboard_accountText\" | \"dashboard_invoiceColumnTitle\" | \"dashboard_dateColumnTitle\" | \"dashboard_earningsColumnTitle\" | \"dashboard_indirectTaxColumnTitle\" | \"dashboard_payoutFromImpact\" | \"dashboard_earningsAfterTaxColumnTitle\" | \"dashboard_payoutHoldAlertHeader\" | \"dashboard_payoutHoldAlertDescription\" | \"dashboard_payoutMissingInformationText\" | \"dashboard_invoiceDescription\" | \"dashboard_invoicePrevLabel\" | \"dashboard_invoiceMoreLabel\" | \"dashboard_invoiceHeader\" | \"dashboard_invoiceEmptyStateHeader\" | \"dashboard_invoiceEmptyStateText\" | \"dashboard_replaceTaxFormModalHeader\" | \"dashboard_replaceTaxFormModalBodyText\" | \"dashboard_verificationRequiredHeader\" | \"dashboard_verificationRequiredDescription\" | \"dashboard_verificationRequiredInternalHeader\" | \"dashboard_verificationRequiredInternalDescription\" | \"dashboard_verificationReviewInternalHeader\" | \"dashboard_verificationReviewInternalDescription\" | \"dashboard_verificationFailedInternalHeader\" | \"dashboard_verificationFailedInternalDescription\" | \"dashboard_verificationRequiredButtonText\" | \"formStep\" | \"generalErrorTitle\" | \"generalErrorDescription\" | \"fieldRequiredError\" | \"invalidCharacterError\" | \"fieldInvalidError\" | \"continueButton\" | \"backButton\" | \"cancelButton\" | \"isPartnerAlertHeader\" | \"isPartnerAlertDescription\" | \"searchForCountryText\" | \"loadingErrorAlertHeader\" | \"loadingErrorAlertDescription\" | \"taxAndPayoutsDescription\" | \"supportLink\" | \"stateController\" | \"demoData\" | \"disconnectedCallback\" | \"getGeneralStepTextProps\" | \"render\">>; disconnectedCallback?: () => void; getGeneralStepTextProps?: (prefix: string) => PickPrefix<TaxAndCashMonolith, string> & { generalErrorTitle: string; generalErrorDescription: string; fieldRequiredError: string; invalidCharacterError: string; fieldInvalidError: string; continueButton: string; backButton: string; cancelButton: string; isPartnerAlertHeader: string; isPartnerAlertDescription: string; loadingErrorAlertHeader: string; loadingErrorAlertDescription: string; taxAndPayoutsDescription: string; searchForCountryText: string; formStep: string; supportLink: string; }; render?: () => any; }",
         "references": {
           "DemoData": {
             "location": "import",
             "path": "../../../global/demo"
           },
-          "UseTaxAndCashResultType": {
-            "location": "import",
-            "path": "./useTaxAndCash"
+          "TaxAndCashMonolith": {
+            "location": "global"
           }
         }
       },
@@ -5037,9 +5287,6 @@ export class TaxAndCashMonolith {
         "tags": [{
             "text": undefined,
             "name": "undocumented"
-          }, {
-            "text": "object",
-            "name": "uiType"
           }],
         "text": ""
       }
@@ -5051,8 +5298,13 @@ function useDemoTaxAndCash(props) {
     namespace: TAX_CONTEXT_NAMESPACE,
     initialValue: "/1",
   });
+  console.log("PROPS", props);
+  const states = parseStates(props.stateController);
+  const formatted = Object.keys(states).reduce((prev, key) => key === "sqm-tax-and-cash"
+    ? { ...prev, ...states[key] }
+    : { ...prev, [`${key}_stateController`]: states[key] }, {});
   return deepmerge({
     step,
     setStep,
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+  }, props.demoData || formatted || {}, { arrayMerge: (_, a) => a });
 }

package/dist/collection/components/tax-and-cash/sqm-tax-and-cash/useTaxAndCash.js

@@ -1,7 +1,7 @@
 import { getContextValueName, useHost, useLocale, useParentQuery, useParentState, useUserIdentity, } from "@saasquatch/component-boilerplate";
 import { useEffect, useMemo } from "@saasquatch/universal-hooks";
+import { COUNTRIES_NAMESPACE, COUNTRIES_QUERY_NAMESPACE, CURRENCIES_NAMESPACE, CURRENCIES_QUERY_NAMESPACE, FINANCE_NETWORK_SETTINGS_NAMESPACE, GET_COUNTRIES, GET_CURRENCIES, GET_FINANCE_NETWORK_SETTINGS, GET_USER, SORTED_COUNTRIES_NAMESPACE, TAX_CONTEXT_NAMESPACE, TAX_FORM_CONTEXT_NAMESPACE, USER_FORM_CONTEXT_NAMESPACE, USER_QUERY_NAMESPACE, } from "../data";
 import { getCountryObj } from "../utils";
-import { COUNTRIES_NAMESPACE, COUNTRIES_QUERY_NAMESPACE, CURRENCIES_NAMESPACE, CURRENCIES_QUERY_NAMESPACE, FINANCE_NETWORK_SETTINGS_NAMESPACE, GET_COUNTRIES, GET_CURRENCIES, GET_FINANCE_NETWORK_SETTINGS, GET_USER, SORTED_COUNTRIES_NAMESPACE, TAX_CONTEXT_NAMESPACE, TAX_FORM_CONTEXT_NAMESPACE, USER_FORM_CONTEXT_NAMESPACE, USER_QUERY_NAMESPACE, } from "./data";
 function getCurrentStep(user) {
   var _a, _b;
   if (!((_a = user.impactConnection) === null || _a === void 0 ? void 0 : _a.connected) || !((_b = user.impactConnection) === null || _b === void 0 ? void 0 : _b.publisher)) {

package/dist/collection/components/tax-and-cash/sqm-tax-and-cash-dashboard/sqm-tax-and-cash-dashboard-view.js

@@ -4,21 +4,21 @@ import { createStyleSheet } from "../../../styling/JSS";
 const style = {
   ErrorAlertContainer: {
     "&::part(base)": {
-      backgroundColor: "var(--sl-color-red-100)",
-      borderTop: "none",
+      backgroundColor: "var(--sqm-danger-color-background)",
+      border: "none",
     },
     "& sl-icon::part(base)": {
-      color: "var(--sl-color-danger-500)",
+      color: "var(--sqm-danger-color-text)",
     },
   },
   WarningAlertContainer: {
     "&::part(base)": {
-      backgroundColor: "var(--sl-color-yellow-100)",
-      borderTop: "none",
+      backgroundColor: "var(--sqm-warning-color-background)",
+      border: "none",
       maxWidth: "600px",
     },
     "& sl-icon::part(base)": {
-      color: "var(--sl-color-warning-500)",
+      color: "var(--sqm-warning-color-text)",
     },
   },
   WarningHoldAlertContainer: {
@@ -29,7 +29,7 @@ const style = {
       backgroundColor: "transparent",
     },
     "& sl-icon::part(base)": {
-      color: "var(--sl-color-warning-500)",
+      color: "var(--sqm-warning-color-text)",
     },
   },
   ErrorHoldAlertContainer: {
@@ -40,13 +40,13 @@ const style = {
       backgroundColor: "transparent",
     },
     "& sl-icon::part(base)": {
-      color: "var(--sl-color-danger-500)",
+      color: "var(--sqm-danger-color-icon)",
     },
   },
   ExpiringSoonAlertContainer: {
     "&::part(base)": {
-      backgroundColor: "var(--sl-color-yellow-100)",
-      borderTop: "none",
+      backgroundColor: "var(--sqm-warning-color-background)",
+      border: "none",
     },
   },
   BankingInformationContainer: {
@@ -54,7 +54,7 @@ const style = {
   },
   IndirectTaxPreviewContainer: {
     marginTop: "var(--sl-spacing-x-large)",
-    borderTop: "1px solid var(--sl-color-neutral-200)",
+    borderTop: "1px solid var(--sqm-border-color)",
   },
   IndirectTaxPreviewHeaderContainer: {
     marginTop: "var(--sl-spacing-large)",
@@ -63,7 +63,7 @@ const style = {
     display: "flex",
     gap: "var(--sl-spacing-x-small)",
     "&::part(base)": {
-      color: "var(--sl-color-green-500)",
+      color: "var(--sqm-success-color-text)",
     },
   },
   IndirectTaxPreviewDetails: {
@@ -77,11 +77,11 @@ const style = {
     marginTop: "var(--sl-spacing-medium)",
   },
   NotRegisteredIndirectTaxText: {
-    color: "var(--sl-color-gray-500)",
+    color: "var(--sqm-text-subdued)",
   },
   TaxDocumentsContainer: {
     marginTop: "var(--sl-spacing-xx-large)",
-    borderTop: "1px solid var(--sl-color-neutral-200)",
+    borderTop: "1px solid var(--sqm-border-color)",
   },
   TaxDocumentsSectionHeaderContainer: {
     marginTop: "var(--sl-spacing-x-large)",
@@ -98,7 +98,7 @@ const style = {
     "& p": {
       margin: "0",
       paddingTop: "2px",
-      color: "var(--sl-color-gray-500)",
+      color: "var(--sqm-text-subdued)",
     },
   },
   StatusAlert: {
@@ -133,7 +133,7 @@ const style = {
   },
   TaxDocSubtext: {
     margin: "0",
-    color: "var(--sl-color-neutral-500)",
+    color: "var(--sqm-text-subdued)",
     lineHeight: "var(--sl-spacing-medium)",
     fontSize: "var(--sl-font-size-small)",
     marginLeft: "1px",
@@ -154,13 +154,13 @@ const style = {
     gap: "6px",
   },
   DescriptionText: {
-    color: "var(--sl-color-gray-500)",
+    color: "var(--sqm-text-subdued)",
     fontSize: "var(--sl-font-size-x-small)",
     marginBottom: "none",
     maxWidth: "492px",
   },
   PageDescriptionText: {
-    color: "var(--sl-color-neutral-500)",
+    color: "var(--sqm-text-subdued)",
     fontSize: "var(--sl-font-size-medium)",
     marginTop: "0",
   },

package/dist/collection/components/tax-and-cash/sqm-tax-and-cash-dashboard/sqm-tax-and-cash-dashboard.js

@@ -1724,23 +1724,31 @@ export class TaxAndCashDashboard {
   }; }
 }
 function useDemoTaxAndCashDashboard(props) {
+  // const states = parseStates(props.stateController);
   return deepmerge({
     states: {
       dateSubmitted: "today",
       documentType: "W9",
       documentTypeString: "W9",
-      status: "ACTIVE",
       country: "United States",
-      indirectTaxNumber: 55555555,
+      indirectTaxNumber: "55555555",
       indirectTaxType: "Indirect Tax",
-      noFormNeeded: true,
+      noFormNeeded: false,
       disabled: false,
       loading: false,
       showNewFormDialog: false,
       hasHold: false,
-      showVerifyIdentity: false,
+      subRegion: "CA",
+      subRegionTaxNumber: undefined,
+      qstNumber: undefined,
+      isBusinessEntity: false,
+      province: undefined,
+      notRegistered: true,
+      loadingError: false,
       payoutStatus: "DONE",
       veriffLoading: false,
+      canEditPayoutInfo: true,
+      status: "ACTIVE",
     },
     callbacks: {
       onClick: () => console.debug("check step"),
@@ -1750,5 +1758,12 @@ function useDemoTaxAndCashDashboard(props) {
       onVerifyClick: () => console.log("verify"),
     },
     text: props.getTextProps(),
+    slots: {
+      payoutDetailsCardSlot: (h("sqm-payout-details-card", { demoData: {
+          states: {
+            badgeStatus: "nextPayout",
+          },
+        } })),
+    },
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }

package/dist/collection/components/tax-and-cash/sqm-tax-and-cash-dashboard/useTaxAndCashDashboard.js

@@ -2,11 +2,11 @@ import { useLocale, useParentQueryValue, useSetParent, } from "@saasquatch/compo
 import { useEffect, useState } from "@saasquatch/universal-hooks";
 import { DateTime } from "luxon";
 import { vatLabels } from "../countries";
-import { TAX_CONTEXT_NAMESPACE, TAX_FORM_CONTEXT_NAMESPACE, USER_QUERY_NAMESPACE, } from "../sqm-tax-and-cash/data";
-import { INDIRECT_TAX_PROVINCES, INDIRECT_TAX_SPAIN_REGIONS, } from "../subregions";
-import { taxTypeToName } from "../utils";
+import { TAX_CONTEXT_NAMESPACE, TAX_FORM_CONTEXT_NAMESPACE, USER_QUERY_NAMESPACE, } from "../data";
 import { getStatus } from "../sqm-payout-status-alert/usePayoutStatus";
+import { INDIRECT_TAX_PROVINCES, INDIRECT_TAX_SPAIN_REGIONS, } from "../subregions";
 import { useVeriffApp, VERIFF_COMPLETE_EVENT_KEY } from "../useVeriffApp";
+import { taxTypeToName } from "../utils";
 function getCountryName(countryCode, locale) {
   if (!countryCode)
     return undefined;

package/dist/collection/components/tax-and-cash/sqm-user-info-form/small-views/DocusignExpiredView.js

@@ -10,7 +10,7 @@ const style = {
     gap: "10px",
     margin: "auto",
     textAlign: "center",
-    border: "1px solid var(--sl-color-gray-200)",
+    border: "var(--sqm-border-thickness) solid var(--sqm-border-color)",
   },
 };
 const sheet = createStyleSheet(style);