@saasquatch/mint-components 1.15.0-45 → 1.15.0-46

package/dist/collection/components/sqm-rewards-table/sqm-rewards-table.js

@@ -224,7 +224,7 @@ export class RewardsTable {
       "mutable": false,
       "complexType": {
         "original": "DemoData<GenericTableViewProps> & {\n    mockData?: { data: Referral[] };\n  }",
-        "resolved": "Partial<Pick<GenericTableViewProps, \"states\" | \"data\" | \"elements\">> & { mockData?: { data: any[]; }; }",
+        "resolved": "Partial<Pick<GenericTableViewProps, \"states\" | \"data\" | \"elements\">> & { mockData?: { data: Referral[]; }; }",
         "references": {
           "DemoData": {
             "location": "import",

package/dist/collection/components/sqm-share-button/sqm-share-button.js

@@ -15,12 +15,12 @@ import deepmerge from "deepmerge";
  * @example Facebook Share Button - <sqm-share-button medium="facebook">Share on Facebook</sqm-share-button>
  * @example X Share Button - <sqm-share-button medium="twitter">Share via X</sqm-share-button>
  * @example Email Share Button - <sqm-share-button medium="email">Share via Email</sqm-share-button>
- * @example Web Share Sheet Share Button - <sqm-share-button medium="direct">Share</sqm-share-button>
+ * @example Mobile Share Sheet Button - <sqm-share-button medium="direct">Share</sqm-share-button>
  * @example LinkedIn Share Button - <sqm-share-button medium="linkedin">Share on LinkedIn</sqm-share-button>
  * @example SMS Share Button - <sqm-share-button medium="sms">Text a friend</sqm-share-button>
- * @example Facebook Messenger Share Button - <sqm-share-button medium="fbmessenger">Share via Messenger</sqm-share-button>
+ * @example Messenger Share Button - <sqm-share-button medium="fbmessenger">Share via Messenger</sqm-share-button>
  * @example WhatsApp Share Button - <sqm-share-button medium="whatsapp">Share via WhatsApp</sqm-share-button>
- * @example Line Messenger Share Button - <sqm-share-button medium="linemessenger">Share via Line Messenger</sqm-share-button>
+ * @example LINE Share Button - <sqm-share-button medium="linemessenger">Share via Line Messenger</sqm-share-button>
  * @example Pinterest Share Button - <sqm-share-button medium="pinterest">Share on Pinterest</sqm-share-button>
  */
 export class ShareButton {

package/dist/collection/components/sqm-stencilbook/sqm-stencilbook.js

@@ -1,105 +1,105 @@
-import { useState, withHooks } from "@saasquatch/stencil-hooks";
+import { h, Component, Host, State } from "@stencil/core";
 import { useStencilbook } from "@saasquatch/stencilbook";
-import { Component, h, Host, State } from "@stencil/core";
-import * as NewPortal from "../../stories/NewPortal.stories";
-import * as PortalTemplates from "../../stories/PortalTemplates.stories";
-import * as PoweredByImg from "../../stories/PoweredByImg.stories";
-import * as Widget from "../../stories/Widget.stories";
-import * as BaseRegistrationForm from "../sqm-base-registration/BaseRegistrationForm.stories";
+import { useState, withHooks } from "@saasquatch/stencil-hooks";
+import * as ShareButton from "../sqm-share-button/ShareButton.stories";
+import * as EmptyState from "../sqm-empty/EmptyState.stories";
+import * as Pagination from "../sqm-pagination/Pagination.stories";
+import * as ShareLink from "../sqm-share-link/ShareLink.stories";
 import * as BigStat from "../sqm-big-stat/BigStat.stories";
-import * as UseBigStat from "../sqm-big-stat/UseBigStat.stories";
-import * as BrandStories from "../sqm-brand/SqmBrand.stories";
-import * as CardFeed from "../sqm-card-feed/CardFeed.stories";
-import * as CheckboxField from "../sqm-checkbox-field/CheckboxField.stories";
-import * as UseCheckboxField from "../sqm-checkbox-field/UseCheckboxField.stories";
-import * as CloseButton from "../sqm-close-button/CloseButton.stories";
-import * as CouponCode from "../sqm-coupon-code/CouponCode.stories";
-import * as DividedLayout from "../sqm-divided-layout/DividedLayout.stories";
-import * as DropdownField from "../sqm-dropdown-field/DropdownField.stories";
-import * as UseDropdownField from "../sqm-dropdown-field/UseDropdownField.stories";
+import * as Leaderboard from "../sqm-leaderboard/Leaderboard.stories";
+import * as Router from "../sqm-router/Router.stories";
+import * as LeaderboardRank from "../sqm-leaderboard-rank/LeaderboardRank.stories";
+import * as PortalFrame from "../sqm-portal-frame/PortalFrame.stories";
 import * as EditProfile from "../sqm-edit-profile/EditProfileForm.stories";
+import * as UseShareLink from "../sqm-share-link/UseShareLink.stories";
+import * as UseShareButton from "../sqm-share-button/UseShareButton.stories";
+import * as UseBigStat from "../sqm-big-stat/UseBigStat.stories";
 import * as UseEditProfile from "../sqm-edit-profile/UseEditProfile.stories";
-import * as EmptyState from "../sqm-empty/EmptyState.stories";
-import * as FormMessage from "../sqm-form-message/FormMessage.stories";
-import * as HeroImage from "../sqm-hero-image/HeroImage.stories";
-import * as Hero from "../sqm-hero/Hero.stories";
-import * as Image from "../sqm-image/Image.stories";
-import * as InputField from "../sqm-input-field/InputField.stories";
-import * as UseInputField from "../sqm-input-field/UseInputField.stories";
-import * as InvoiceTable from "../sqm-invoice-table/InvoiceTable.stories";
-import * as InvoiceTableCells from "../sqm-invoice-table/InvoiceTableCell.stories";
-import * as UseInvoiceTableCells from "../sqm-invoice-table/UseInvoiceTable.stories";
-import * as LeaderboardRank from "../sqm-leaderboard-rank/LeaderboardRank.stories";
-import * as Leaderboard from "../sqm-leaderboard/Leaderboard.stories";
 import * as UseLeaderboard from "../sqm-leaderboard/UseLeaderboard.stories";
-import * as LinkButton from "../sqm-link-button/LinkButton.stories";
-import * as LogoutCurrentUser from "../sqm-logout-current-user/LogoutCurrentUser.stories";
-import * as MarketingEmailsCheckbox from "../sqm-marketing-emails-checkbox/MarketingEmailsCheckbox.stories";
-import * as NameFields from "../sqm-name-fields/NameFields.stories";
+import * as FormMessage from "../sqm-form-message/FormMessage.stories";
+import * as UseRewardExchangeList from "../sqm-reward-exchange-list/UseRewardExchangeList.stories";
+import * as UseRewardsTable from "../sqm-rewards-table/UseRewardsTable.stories";
+import * as UseTaskCard from "../sqm-task-card/UseTaskCard.stories";
+import * as NewPortal from "../../stories/NewPortal.stories";
+import * as Widget from "../../stories/Widget.stories";
 import * as SidebarItem from "../sqm-navigation-sidebar-item/SidebarItem.stories";
 import * as NavigationSidebar from "../sqm-navigation-sidebar/NavigationSidebar.stories";
-import * as Pagination from "../sqm-pagination/Pagination.stories";
-import * as PasswordField from "../sqm-password-field/PasswordField.stories";
-import * as PayoutButtonScroll from "../sqm-payout-button-scroll/PayoutButtonScroll.stories";
-import * as ChangeMarketing from "../sqm-portal-change-marketing/ChangeMarketing.stories";
-import * as ChangePassword from "../sqm-portal-change-password/ChangePassword.stories";
-import * as PortalContainer from "../sqm-portal-container/PortalContainer.stories";
-import * as PortalEmailVerification from "../sqm-portal-email-verification/PortalEmailVerification.stories";
-import * as PortalFooter from "../sqm-portal-footer/PortalFooter.stories";
-import * as PortalForgotPassword from "../sqm-portal-forgot-password/PortalForgotPassword.stories";
-import * as PortalFrame from "../sqm-portal-frame/PortalFrame.stories";
-import * as PortalGoogleRegistrationFormStories from "../sqm-portal-google-registration-form/PortalGoogleRegistrationForm.stories";
 import * as PortalLogin from "../sqm-portal-login/PortalLogin.stories";
-import * as PortalProfile from "../sqm-portal-profile/PortalProfile.stories";
 import * as PortalRegister from "../sqm-portal-register/PortalRegister.stories";
 import * as NewPortalRegistrationForm from "../sqm-portal-registration-form/PortalRegistrationForm.stories";
+import * as PortalForgotPassword from "../sqm-portal-forgot-password/PortalForgotPassword.stories";
+import * as PortalEmailVerification from "../sqm-portal-email-verification/PortalEmailVerification.stories";
 import * as PortalResetPassword from "../sqm-portal-reset-password/PortalResetPassword.stories";
 import * as PortalVerifyEmail from "../sqm-portal-verify-email/PortalVerifyEmail.stories";
-import * as ProgramExplainerStep from "../sqm-program-explainer-step/ProgramExplainerStep.stories";
-import * as ProgramExplainer from "../sqm-program-explainer/ProgramExplainer.stories";
-import * as ProgramMenu from "../sqm-program-menu/ProgramMenu.stories";
-import * as QRCode from "../sqm-qr-code/QRCode.stories";
-import * as RadioCard from "../sqm-radio-card/RadioCard.stories";
-import * as ReferralCard from "../sqm-referral-card/ReferralCard.stories";
-import * as ReferralCode from "../sqm-referral-code/ReferralCode.stories";
-import * as ReferralCodes from "../sqm-referral-codes/ReferralCodes.stories";
-import * as ReferralIframe from "../sqm-referral-iframe/ReferralIframe.stories";
+import * as DividedLayout from "../sqm-divided-layout/DividedLayout.stories";
+import * as ChangePassword from "../sqm-portal-change-password/ChangePassword.stories";
+import * as ChangeMarketing from "../sqm-portal-change-marketing/ChangeMarketing.stories";
+import * as PortalProfile from "../sqm-portal-profile/PortalProfile.stories";
 import * as ReferralTable from "../sqm-referral-table/ReferralTable.stories";
 import * as ReferralTableCell from "../sqm-referral-table/ReferralTableCell.stories";
 import * as ReferralTableRewardsCell from "../sqm-referral-table/ReferralTableRewardsCell.stories";
-import * as UseReferralTable from "../sqm-referral-table/UseReferralTable.stories";
+import * as UserName from "../sqm-user-name/UserName.stories";
+import * as PasswordField from "../sqm-password-field/PasswordField.stories";
+import * as TaskCard from "../sqm-task-card/TaskCard.stories";
+import * as PortalTemplates from "../../stories/PortalTemplates.stories";
+import * as ProgramMenu from "../sqm-program-menu/ProgramMenu.stories";
+import * as PoweredByImg from "../../stories/PoweredByImg.stories";
+import * as PortalFooter from "../sqm-portal-footer/PortalFooter.stories";
+import * as Hero from "../sqm-hero/Hero.stories";
+import * as ReferralIframe from "../sqm-referral-iframe/ReferralIframe.stories";
+import * as NameFields from "../sqm-name-fields/NameFields.stories";
+import * as CheckboxField from "../sqm-checkbox-field/CheckboxField.stories";
+import * as MarketingEmailsCheckbox from "../sqm-marketing-emails-checkbox/MarketingEmailsCheckbox.stories";
+import * as UseCheckboxField from "../sqm-checkbox-field/UseCheckboxField.stories";
+import * as DropdownField from "../sqm-dropdown-field/DropdownField.stories";
+import * as UseDropdownField from "../sqm-dropdown-field/UseDropdownField.stories";
+import * as InputField from "../sqm-input-field/InputField.stories";
+import * as UseInputField from "../sqm-input-field/UseInputField.stories";
 import * as RewardExchangeList from "../sqm-reward-exchange-list/RewardExchangeList.stories";
-import * as UseRewardExchangeList from "../sqm-reward-exchange-list/UseRewardExchangeList.stories";
-import * as RewardsTable from "../sqm-rewards-table/RewardsTable.stories";
+import * as ProgramExplainer from "../sqm-program-explainer/ProgramExplainer.stories";
+import * as ProgramExplainerStep from "../sqm-program-explainer-step/ProgramExplainerStep.stories";
+import * as BrandStories from "../sqm-brand/SqmBrand.stories";
+import * as CardFeed from "../sqm-card-feed/CardFeed.stories";
+import * as PortalContainer from "../sqm-portal-container/PortalContainer.stories";
 import * as RewardsTableCell from "../sqm-rewards-table/RewardsTableCell.stories";
-import * as UseRewardsTable from "../sqm-rewards-table/UseRewardsTable.stories";
-import * as Router from "../sqm-router/Router.stories";
-import * as Scroll from "../sqm-scroll/Scroll.stories";
-import * as ShareButton from "../sqm-share-button/ShareButton.stories";
-import * as UseShareButton from "../sqm-share-button/UseShareButton.stories";
-import * as ShareCode from "../sqm-share-code/ShareCode.stories";
-import * as ShareLink from "../sqm-share-link/ShareLink.stories";
-import * as UseShareLink from "../sqm-share-link/UseShareLink.stories";
-import * as Tabs from "../sqm-tabs/Tabs.stories";
-import * as TaskCard from "../sqm-task-card/TaskCard.stories";
-import * as UseTaskCard from "../sqm-task-card/UseTaskCard.stories";
-import * as ProgressBar from "../sqm-task-card/progress-bar/ProgressBar.stories";
-import * as Text from "../sqm-text/Text.stories";
+import * as RewardsTable from "../sqm-rewards-table/RewardsTable.stories";
+import * as UseReferralTable from "../sqm-referral-table/UseReferralTable.stories";
+import * as HeroImage from "../sqm-hero-image/HeroImage.stories";
+import * as ReferralCard from "../sqm-referral-card/ReferralCard.stories";
 import * as Timeline from "../sqm-timeline/Timeline.stories";
+import * as Image from "../sqm-image/Image.stories";
 import * as TitledSection from "../sqm-titled-section/TitledSection.stories";
-import * as UserName from "../sqm-user-name/UserName.stories";
-import * as WidgetCodeVerification from "../sqm-widget-verification/sqm-code-verification/WidgetCodeVerification.stories";
-import * as WidgetEmailVerification from "../sqm-widget-verification/sqm-email-verification/WidgetEmailVerification.stories";
-import * as BankingInfoForm from "../tax-and-cash/BankingForm.stories";
+import * as Scroll from "../sqm-scroll/Scroll.stories";
+import * as Tabs from "../sqm-tabs/Tabs.stories";
+import * as ShareCode from "../sqm-share-code/ShareCode.stories";
+import * as ReferralCode from "../sqm-referral-code/ReferralCode.stories";
+import * as EmailRegistration from "../views/EmailRegistration.stories";
+import * as CouponCode from "../sqm-coupon-code/CouponCode.stories";
+import * as LogoutCurrentUser from "../sqm-logout-current-user/LogoutCurrentUser.stories";
+import * as LinkButton from "../sqm-link-button/LinkButton.stories";
+import * as CloseButton from "../sqm-close-button/CloseButton.stories";
 import * as TaxForm from "../tax-and-cash/TaxForm.stories";
+import * as TaxFormSlots from "../tax-and-cash/sqm-user-info-form/small-views/SlotViews.stories";
+import * as RadioCard from "../sqm-radio-card/RadioCard.stories";
+import * as ProgressBar from "../sqm-task-card/progress-bar/ProgressBar.stories";
 import * as PayoutDetailsCard from "../tax-and-cash/sqm-payout-details-card/PayoutDetailsCard.stories";
+import * as BankingInfoForm from "../tax-and-cash/BankingForm.stories";
+import * as InvoiceTable from "../sqm-invoice-table/InvoiceTable.stories";
+import * as InvoiceTableCells from "../sqm-invoice-table/InvoiceTableCell.stories";
+import * as UseInvoiceTableCells from "../sqm-invoice-table/UseInvoiceTable.stories";
+import * as WidgetEmailVerification from "../sqm-widget-verification/sqm-email-verification/WidgetEmailVerification.stories";
+import * as WidgetCodeVerification from "../sqm-widget-verification/sqm-code-verification/WidgetCodeVerification.stories";
+import * as PayoutButtonScroll from "../sqm-payout-button-scroll/PayoutButtonScroll.stories";
 import * as PayoutStatusAlert from "../tax-and-cash/sqm-payout-status-alert/PayoutStatusAlert.stories";
-import * as TaxFormSlots from "../tax-and-cash/sqm-user-info-form/small-views/SlotViews.stories";
-import * as EmailRegistration from "../views/EmailRegistration.stories";
-import { ShadowViewAddon } from "../../ShadowViewAddon";
+import * as ReferralCodes from "../sqm-referral-codes/ReferralCodes.stories";
+import * as BaseRegistrationForm from "../sqm-base-registration/BaseRegistrationForm.stories";
+import * as PortalGoogleRegistrationFormStories from "../sqm-portal-google-registration-form/PortalGoogleRegistrationForm.stories";
+import * as QRCode from "../sqm-qr-code/QRCode.stories";
+import * as Text from "../sqm-text/Text.stories";
+import * as Themes from "./Themes";
 import { CucumberAddon } from "./CucumberAddon";
 import { HookStoryAddon } from "./HookStoryAddon";
-import * as Themes from "./Themes";
+import { ShadowViewAddon } from "../../ShadowViewAddon";
 const stories = [
   InvoiceTable,
   InvoiceTableCells,

package/dist/collection/components/sqm-widget-verification/sqm-code-verification/sqm-code-verification.js

@@ -3,9 +3,9 @@ import { useState, withHooks } from "@saasquatch/stencil-hooks";
 import { Component, h, Prop } from "@stencil/core";
 import deepmerge from "deepmerge";
 import { getProps } from "../../../utils/utils";
-import { VERIFICATION_PARENT_NAMESPACE } from "../keys";
 import { WidgetCodeVerificationView, } from "./sqm-code-verification-view";
 import { useWidgetCodeVerification } from "./useCodeVerification";
+import { VERIFICATION_PARENT_NAMESPACE } from "../keys";
 export class WidgetCodeVerification {
   constructor() {
     /**
@@ -283,10 +283,10 @@ function useDemoWidgetCodeVerification(props) {
   const setVerifiedContext = useSetParent(VERIFICATION_PARENT_NAMESPACE);
   return deepmerge({
     states: {
-      initialiseLoading: false,
       loading: false,
       email: "test@example.com",
       emailResent,
+      resendError: false,
       verifyFailed: false,
     },
     refs: {

package/dist/collection/components/sqm-widget-verification/sqm-widget-verification-controller.js

@@ -1,7 +1,7 @@
-import { isDemo, useParentState } from "@saasquatch/component-boilerplate";
+import { useParentState } from "@saasquatch/component-boilerplate";
 import { withHooks } from "@saasquatch/stencil-hooks";
 import { useCallback, useEffect, useState } from "@saasquatch/universal-hooks";
-import { Component, h, Host, Prop } from "@stencil/core";
+import { Component, h, Host } from "@stencil/core";
 import debugFn from "debug";
 import { VERIFICATION_PARENT_NAMESPACE } from "./keys";
 const debug = debugFn("sq:widget-verification");
@@ -40,26 +40,18 @@ function useTemplateChildren({ parent, callback }) {
  */
 export class WidgetVerificationController {
   constructor() {
-    /**
-     * @componentState { "title": "Not Verified", "slot": "not-verified", "props": { "isAuth": false } }
-     * @componentState { "title": "Verified", "slot": "verified", "props": { "isAuth": true } }
-     */
-    this.stateController = "{}";
     withHooks(this);
   }
   disconnectedCallback() { }
   render() {
-    var _a;
     const [context, setContext] = useParentState({
       namespace: VERIFICATION_PARENT_NAMESPACE,
       initialValue: false,
     });
-    const props = JSON.parse(this.stateController);
-    const demoIsAuth = isDemo() && ((_a = props["sqm-widget-verification-controller"]) === null || _a === void 0 ? void 0 : _a.isAuth);
     const [container, setContainer] = useState(undefined);
     const [slot, setSlot] = useState(undefined);
     const updateTemplates = useCallback(() => {
-      const isAuth = demoIsAuth || context;
+      const isAuth = context;
       const templates = slot.querySelectorAll(`template`);
       const template = Array.from(templates).find((t) => t.slot === (isAuth ? "verified" : "not-verified"));
       if (template) {
@@ -107,7 +99,7 @@ export class WidgetVerificationController {
           target.style.height = "25px";
         });
       }
-    }, [container, slot, context, demoIsAuth]);
+    }, [container, slot, context]);
     useEffect(() => {
       if (!container || !slot) {
         debug("DOM not ready:");
@@ -116,7 +108,7 @@ export class WidgetVerificationController {
       // Run on first render
       updateTemplates();
       return useTemplateChildren({ parent: slot, callback: updateTemplates });
-    }, [slot, container, context, demoIsAuth]);
+    }, [slot, container, context]);
     return (h(Host, null,
       h("div", { ref: setSlot, style: { display: "contents" } },
         h("slot", { name: "not-verified" }),
@@ -125,30 +117,4 @@ export class WidgetVerificationController {
         h("slot", { name: "shown" }))));
   }
   static get is() { return "sqm-widget-verification-controller"; }
-  static get properties() { return {
-    "stateController": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "{ \"title\": \"Not Verified\", \"slot\": \"not-verified\", \"props\": { \"isAuth\": false } }",
-            "name": "componentState"
-          }, {
-            "text": "{ \"title\": \"Verified\", \"slot\": \"verified\", \"props\": { \"isAuth\": true } }",
-            "name": "componentState"
-          }],
-        "text": ""
-      },
-      "attribute": "state-controller",
-      "reflect": false,
-      "defaultValue": "\"{}\""
-    }
-  }; }
 }

package/dist/collection/components/sqm-widget-verification/sqm-widget-verification.js

@@ -1,8 +1,6 @@
 import { isDemo, useParentState, useSetParent, } from "@saasquatch/component-boilerplate";
 import { withHooks } from "@saasquatch/stencil-hooks";
 import { Component, h, Prop } from "@stencil/core";
-import deepmerge from "deepmerge";
-import { parseStates } from "../../utils/parseStates";
 import { getProps } from "../../utils/utils";
 import { extractProps } from "../tax-and-cash/sqm-tax-and-cash/extractProps";
 import { SHOW_CODE_NAMESPACE, VERIFICATION_EMAIL_NAMESPACE, VERIFICATION_PARENT_NAMESPACE, } from "./keys";
@@ -10,7 +8,7 @@ import { useWidgetVerification } from "./useWidgetVerification";
 /**
  * @uiName Widget Verification Flow
  * @exampleGroup Widget Verification
- * @example Widget Verification Flow - <sqm-widget-verification></sqm-widget-verification>
+ * @example Widget Verification - <sqm-widget-verification></sqm-widget-verification>
  */
 export class WidgetVerification {
   constructor() {
@@ -109,11 +107,6 @@ export class WidgetVerification {
      * @uiGroup Code Verification Step
      */
     this.codeStep_networkErrorMessage = "An error occurred while verifying your email. Please refresh the page and try again.";
-    /**
-     * @componentState { "title": "Email Step", "props": { "showCode": false }, "dependencies": ["sqm-email-verification"] }
-     * @componentState { "title": "Code Step", "props": { "showCode": true }, "dependencies": ["sqm-code-verification"] }
-     */
-    this.stateController = "{}";
     withHooks(this);
   }
   disconnectedCallback() { }
@@ -122,10 +115,10 @@ export class WidgetVerification {
     return extractProps(props, prefix);
   }
   render() {
-    const props = isDemo()
-      ? useDemoWidgetVerificationInternal(this)
+    const { showCode, onVerification, loading } = isDemo()
+      ? useDemoWidgetVerificationInternal()
       : useWidgetVerification();
-    if (props.loading)
+    if (loading)
       return h("sl-spinner", null);
     const generalText = this.getStepTextProps("general_");
     return (h("div", null,
@@ -135,7 +128,7 @@ export class WidgetVerification {
           fontSize: "var(--sl-font-size-medium)",
           margin: "0",
         } }, generalText.verifyEmailDescription),
-      props.showCode ? (h("sqm-code-verification", Object.assign({ onVerification: props.onVerification }, this.getStepTextProps("codeStep_"), extractProps(props, "sqm-code-verification_")))) : (h("sqm-email-verification", Object.assign({}, this.getStepTextProps("emailStep_"), extractProps(props, "sqm-email-verification_"))))));
+      showCode ? (h("sqm-code-verification", Object.assign({ onVerification: onVerification }, this.getStepTextProps("codeStep_")))) : (h("sqm-email-verification", Object.assign({}, this.getStepTextProps("emailStep_"))))));
   }
   static get is() { return "sqm-widget-verification"; }
   static get encapsulation() { return "shadow"; }
@@ -523,34 +516,10 @@ export class WidgetVerification {
       "attribute": "code-step_network-error-message",
       "reflect": false,
       "defaultValue": "\"An error occurred while verifying your email. Please refresh the page and try again.\""
-    },
-    "stateController": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "{ \"title\": \"Email Step\", \"props\": { \"showCode\": false }, \"dependencies\": [\"sqm-email-verification\"] }",
-            "name": "componentState"
-          }, {
-            "text": "{ \"title\": \"Code Step\", \"props\": { \"showCode\": true }, \"dependencies\": [\"sqm-code-verification\"] }",
-            "name": "componentState"
-          }],
-        "text": ""
-      },
-      "attribute": "state-controller",
-      "reflect": false,
-      "defaultValue": "\"{}\""
     }
   }; }
 }
-function useDemoWidgetVerificationInternal(props) {
+function useDemoWidgetVerificationInternal() {
   const [showCode, setShowCode] = useParentState({
     namespace: SHOW_CODE_NAMESPACE,
     initialValue: false,
@@ -560,12 +529,8 @@ function useDemoWidgetVerificationInternal(props) {
     initialValue: undefined,
   });
   const setContext = useSetParent(VERIFICATION_PARENT_NAMESPACE);
-  const states = parseStates(props.stateController);
-  const formatted = Object.keys(states).reduce((prev, key) => key === "sqm-widget-verification"
-    ? { ...prev, ...states[key] }
-    : { ...prev, [`${key}_stateController`]: states[key] }, {});
   const onVerification = () => {
     setContext(true);
   };
-  return deepmerge({ showCode, onVerification, loading: false }, formatted || {}, { arrayMerge: (_, a) => a });
+  return { showCode, onVerification, loading: false };
 }

package/dist/collection/components/tax-and-cash/TaxForm.stories.js

@@ -1,8 +1,8 @@
 import { h } from "@stencil/core";
-import { ErrorView } from "./sqm-tax-and-cash/ErrorView";
-import LoadingView from "./sqm-tax-and-cash/LoadingView";
 import { INDIRECT_TAX_PROVINCES, INDIRECT_TAX_SPAIN_REGIONS, } from "./subregions";
+import LoadingView from "./sqm-tax-and-cash/LoadingView";
 import { taxTypeToName } from "./utils";
+import { ErrorView } from "./sqm-tax-and-cash/ErrorView";
 export default {
   title: "Components/Tax Form",
 };
@@ -1217,13 +1217,9 @@ export const TaxAndCashDashboardDisabled = () => {
       },
     } }));
 };
-// export const TaxAndCashTextProps = () => {
-//   return (
-//     <sqm-tax-and-cash
-//       demoData={{
-//         // @ts-ignore
-//         showTextProps: true,
-//       }}
-//     ></sqm-tax-and-cash>
-//   );
-// };
+export const TaxAndCashTextProps = () => {
+  return (h("sqm-tax-and-cash", { demoData: {
+      // @ts-ignore
+      showTextProps: true,
+    } }));
+};

package/dist/collection/components/tax-and-cash/sqm-banking-info-form/sqm-banking-info-form-view.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 import { intl } from "../../../global/global";
 import { createStyleSheet } from "../../../styling/JSS";
-import { FORM_STEPS } from "../data";
+import { FORM_STEPS } from "../sqm-tax-and-cash/data";
 const style = {
   FormWrapper: {
     display: "flex",

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

@@ -4,13 +4,13 @@ import { useEffect } from "@saasquatch/universal-hooks";
 import { Component, Host, Prop, State, h } from "@stencil/core";
 import deepmerge from "deepmerge";
 import { intl } from "../../../global/global";
-import { createStyleSheet } from "../../../styling/JSS";
 import { getProps } from "../../../utils/utils";
-import { TAX_CONTEXT_NAMESPACE } from "../data";
+import { TAX_CONTEXT_NAMESPACE } from "../sqm-tax-and-cash/data";
 import { getFormMap } from "./formDefinitions";
 import { mockPaymentOptions } from "./mockData";
 import { BankingInfoFormView, } from "./sqm-banking-info-form-view";
 import { getFormInputs, paypalFeeMap, useBankingInfoForm, } from "./useBankingInfoForm";
+import { createStyleSheet } from "../../../styling/JSS";
 /**
  * @uiName Banking Information Form
  * @exampleGroup Common Components

package/dist/collection/components/tax-and-cash/sqm-banking-info-form/useBankingInfoForm.js

@@ -3,8 +3,8 @@ import { useEffect, useRef, useState } from "@saasquatch/universal-hooks";
 import { gql } from "graphql-request";
 import JSONPointer from "jsonpointer";
 import { intl } from "../../../global/global";
+import { FINANCE_NETWORK_SETTINGS_NAMESPACE, SORTED_COUNTRIES_NAMESPACE, TAX_CONTEXT_NAMESPACE, TAX_FORM_CONTEXT_NAMESPACE, USER_QUERY_NAMESPACE, } from "../sqm-tax-and-cash/data";
 import { VERIFICATION_EVENT_KEY } from "../../sqm-widget-verification/keys";
-import { FINANCE_NETWORK_SETTINGS_NAMESPACE, SORTED_COUNTRIES_NAMESPACE, TAX_CONTEXT_NAMESPACE, TAX_FORM_CONTEXT_NAMESPACE, USER_QUERY_NAMESPACE, } from "../data";
 import { TAX_FORM_UPDATED_EVENT_KEY } from "../eventKeys";
 // Hardcoded in Impact backend
 export const paypalFeeMap = {

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

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 import { intl } from "../../../global/global";
 import { createStyleSheet } from "../../../styling/JSS";
-import { FORM_STEPS } from "../data";
+import { FORM_STEPS } from "../sqm-tax-and-cash/data";
 const style = {
   FormWrapper: {
     display: "flex",

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

@@ -3,7 +3,7 @@ import { withHooks } from "@saasquatch/stencil-hooks";
 import { Component, Element, Host, Prop, State, h } from "@stencil/core";
 import deepmerge from "deepmerge";
 import { getProps } from "../../../utils/utils";
-import { TAX_CONTEXT_NAMESPACE } from "../data";
+import { TAX_CONTEXT_NAMESPACE } from "../sqm-tax-and-cash/data";
 import { DocusignIframe, } from "./docusign-iframe/DocusignIframe";
 import { DocusignFormView } from "./sqm-docusign-form-view";
 import { useDocusignForm } from "./useDocusignForm";

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

@@ -1,9 +1,9 @@
 import { useMutation, useParent, useParentQueryValue, useParentValue, useUserIdentity, } from "@saasquatch/component-boilerplate";
 import { useEffect, useState } from "@saasquatch/universal-hooks";
 import { gql } from "graphql-request";
-import { TAX_CONTEXT_NAMESPACE, TAX_FORM_CONTEXT_NAMESPACE, USER_QUERY_NAMESPACE, } from "../data";
-import { TAX_FORM_UPDATED_EVENT_KEY } from "../eventKeys";
+import { TAX_CONTEXT_NAMESPACE, TAX_FORM_CONTEXT_NAMESPACE, USER_QUERY_NAMESPACE, } from "../sqm-tax-and-cash/data";
 import { taxTypeToName, validTaxDocument } from "../utils";
+import { TAX_FORM_UPDATED_EVENT_KEY } from "../eventKeys";
 const GET_TAX_DOCUMENT = gql `
   mutation createImpactPublisherTaxDocument(
     $vars: CreateImpactPublisherTaxDocumentInput!

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

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
-import { intl } from "../../../global/global";
 import { createStyleSheet } from "../../../styling/JSS";
-import { FORM_STEPS } from "../data";
+import { intl } from "../../../global/global";
+import { FORM_STEPS } from "../sqm-tax-and-cash/data";
 const style = {
   FormWrapper: {
     display: "flex",

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

@@ -4,7 +4,7 @@ import { useState } from "@saasquatch/universal-hooks";
 import { Component, Host, Prop, h } from "@stencil/core";
 import deepmerge from "deepmerge";
 import { getProps } from "../../../utils/utils";
-import { TAX_CONTEXT_NAMESPACE } from "../data";
+import { TAX_CONTEXT_NAMESPACE } from "../sqm-tax-and-cash/data";
 import { OtherRegionSlotView } from "../sqm-user-info-form/small-views/IndirectTaxDetailsView";
 import { INDIRECT_TAX_PROVINCES, INDIRECT_TAX_SPAIN_REGIONS, } from "../subregions";
 import { IndirectTaxFormView } from "./sqm-indirect-tax-form-view";
@@ -913,7 +913,7 @@ export class IndirectTaxForm {
 }
 function useDemoIndirectTaxForm(props) {
   const setStep = useSetParent(TAX_CONTEXT_NAMESPACE);
-  const [option, setOption] = useState("otherRegion");
+  const [option, setOption] = useState(null);
   const [demoFormState, setDemoFormState] = useState({});
   return deepmerge({
     states: {

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

@@ -2,10 +2,10 @@ import { useLocale, useMutation, useParent, useParentQueryValue, useParentValue,
 import { useEffect, useMemo, useRef, useState, } from "@saasquatch/universal-hooks";
 import { gql } from "graphql-request";
 import JSONPointer from "jsonpointer";
-import { COUNTRIES_QUERY_NAMESPACE, TAX_CONTEXT_NAMESPACE, TAX_FORM_CONTEXT_NAMESPACE, USER_FORM_CONTEXT_NAMESPACE, USER_QUERY_NAMESPACE, } from "../data";
-import { TAX_FORM_UPDATED_EVENT_KEY } from "../eventKeys";
+import { COUNTRIES_QUERY_NAMESPACE, TAX_CONTEXT_NAMESPACE, TAX_FORM_CONTEXT_NAMESPACE, USER_FORM_CONTEXT_NAMESPACE, USER_QUERY_NAMESPACE, } from "../sqm-tax-and-cash/data";
 import { INDIRECT_TAX_PROVINCES, INDIRECT_TAX_SPAIN_REGIONS, } from "../subregions";
 import { getCountryObj, validTaxDocument } from "../utils";
+import { TAX_FORM_UPDATED_EVENT_KEY } from "../eventKeys";
 const CONNECT_PARTNER = gql `
   mutation createImpactConnection($vars: ImpactConnectionInput!) {
     createImpactConnection(impactConnectionInput: $vars) {

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

@@ -2,9 +2,9 @@ import { isDemo } from "@saasquatch/component-boilerplate";
 import { withHooks } from "@saasquatch/stencil-hooks";
 import { Component, Host, Prop, h } from "@stencil/core";
 import deepmerge from "deepmerge";
-import { getProps } from "../../../utils/utils";
 import { PayoutDetailsCardView } from "./sqm-payout-details-card-view";
 import { usePayoutDetailsCard } from "./usePayoutDetailsCard";
+import { getProps } from "../../../utils/utils";
 /**
  * @uiName Payout Details Card
  * @exampleGroup Tax and Cash Components
@@ -31,10 +31,6 @@ export class PayoutDetailsCard {
      * @uiName Payout missing information subtext
      */
     this.payoutMissingInformationText = "Missing banking information, go to Impact.com to resolve.";
-    /**
-     * @componentState { "title": "Loading", "props": { "states": { "loading": true } } }
-     */
-    this.stateController = "{}";
     withHooks(this);
   }
   disconnectedCallback() { }
@@ -138,27 +134,6 @@ export class PayoutDetailsCard {
       "reflect": false,
       "defaultValue": "\"Missing banking information, go to Impact.com to resolve.\""
     },
-    "stateController": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "text": "{ \"title\": \"Loading\", \"props\": { \"states\": { \"loading\": true } } }",
-            "name": "componentState"
-          }],
-        "text": ""
-      },
-      "attribute": "state-controller",
-      "reflect": false,
-      "defaultValue": "\"{}\""
-    },
     "demoData": {
       "type": "unknown",
       "mutable": false,