@saasquatch/mint-components 1.16.0-9 → 2.0.0-1

package/dist/types/components.d.ts

@@ -6,7 +6,6 @@
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 import { DemoData } from "./global/demo";
-import { AssetCardViewProps } from "./components/sqm-asset-card/sqm-asset-card-view";
 import { BankingInfoFormViewProps } from "./components/tax-and-cash/sqm-banking-info-form/sqm-banking-info-form-view";
 import { BigStatViewProps } from "./components/sqm-big-stat/sqm-big-stat-view";
 import { CheckboxFieldViewProps } from "./components/sqm-checkbox-field/sqm-checkbox-field-view";
@@ -22,6 +21,7 @@ import { UseIndirectTaxFormResult } from "./components/tax-and-cash/sqm-indirect
 import { InputFieldViewProps } from "./components/sqm-input-field/sqm-input-field-view";
 import { EmailRegistrationViewProps } from "./components/views/email-registration-view";
 import { GenericTableViewProps } from "./tables/GenericTableView";
+import { FraudStatus, ImpactConnection, Invoice, Referral, Referrer, Reward } from "./saasquatch";
 import { LeadCheckboxFieldViewProps } from "./components/sqm-lead-form/sqm-lead-checkbox-field-view";
 import { DropdownFieldViewProps as DropdownFieldViewProps1 } from "./components/sqm-lead-form/sqm-lead-dropdown-field-view";
 import { LeadFormViewProps } from "./components/sqm-lead-form/sqm-lead-form-view";
@@ -31,6 +31,7 @@ import { LeaderboardRankViewProps } from "./components/sqm-leaderboard-rank/sqm-
 import { CopyTextViewProps } from "./components/views/copy-text-view";
 import { NameFieldsViewProps } from "./components/sqm-name-fields/sqm-name-fields-view";
 import { NavigationMenuViewProps } from "./components/sqm-navigation-menu/sqm-navigation-menu-view";
+import { NavigationSidebarViewProps } from "./components/sqm-navigation-sidebar/sqm-navigation-sidebar-view";
 import { NavigationSidebarItemViewProps } from "./components/sqm-navigation-sidebar-item/sqm-navigation-sidebar-item-view";
 import { UsePagination } from "./components/sqm-pagination/usePagination";
 import { PasswordFieldViewDemoProps } from "./components/sqm-password-field/sqm-password-field";
@@ -54,7 +55,6 @@ import { ReferralDates } from "./components/sqm-referral-table/useReferralTable"
 import { RewardExchangeViewProps } from "./components/sqm-reward-exchange-list/sqm-reward-exchange-list-view";
 import { ShareButtonViewProps } from "./components/sqm-share-button/sqm-share-button-view";
 import { TaskCardViewProps } from "./components/sqm-task-card/sqm-task-card-view";
-import { UseTaxAndCashResultType } from "./components/tax-and-cash/sqm-tax-and-cash/useTaxAndCash";
 import { UseTaxAndCashDashboardResult } from "./components/tax-and-cash/sqm-tax-and-cash-dashboard/useTaxAndCashDashboard";
 import { UseUserInfoFormResult } from "./components/tax-and-cash/sqm-user-info-form/useUserInfoForm";
 import { UserNameViewProps } from "./components/sqm-user-name/sqm-user-name-view";
@@ -63,21 +63,6 @@ export namespace Components {
         "renderCell": () => Promise<any>;
         "renderLabel": (idx: any) => Promise<any>;
     }
-    interface SqmAssetCard {
-        /**
-          * @undocumented 
-          * @uiType object
-         */
-        "demoData"?: DemoData<AssetCardViewProps>;
-        /**
-          * @uiName Banner image
-         */
-        "imgUrl": string;
-        /**
-          * @uiName Banner title
-         */
-        "titleText": string;
-    }
     interface SqmBankingInfoForm {
         /**
           * @uiName Agency code field label
@@ -360,6 +345,7 @@ export namespace Components {
           * @uiType string
           * @uiEnum ["left", "right", "center"]
           * @uiEnumNames ["Left", "Right", "Center"]
+          * @uiGroup Additional Settings
          */
         "alignment"?: "left" | "right" | "center";
         /**
@@ -367,18 +353,59 @@ export namespace Components {
           * @uiType object
          */
         "demoData"?: DemoData<BigStatViewProps>;
+        /**
+          * Font size of the description text in pixels
+          * @uiName Description font size
+          * @uiGroup Additional Settings
+         */
+        "descriptionFontSize"?: number;
+        /**
+          * Color of the description text
+          * @uiName Description text color
+          * @uiWidget color
+          * @uiType string
+          * @format color
+          * @uiGroup Additional Settings
+         */
+        "descriptionTextColor"?: string;
         /**
           * Controls the order of the stat value & description column
           * @uiName Flex reverse
-          * @default
+          * @default 
+          * @uiGroup Additional Settings
          */
         "flexReverse"?: boolean;
         /**
           * The ID of the program that is used to scope stats. Defaults to the program context when no ID is specified.
           * @uiName Program ID
           * @uiWidget programSelector
+          * @uiGroup Additional Settings
          */
         "programId"?: string;
+        /**
+          * Font size of the stat text in pixels
+          * @uiName Stat font size
+          * @uiType string
+          * @uiGroup Additional Settings
+         */
+        "statFontSize"?: number;
+        /**
+          * Font weight of the stat text
+          * @uiName Stat font weight
+          * @uiGroup Additional Settings
+          * @uiEnum [100, 200, 300, 400, 500, 600, 700, 800, 900]
+          * @uiEnumNames ["Thin", "Extra Light", "Light", "Normal", "Medium", "Semi Bold", "Bold", "Extra Bold", "Heavy"]
+         */
+        "statFontWeight"?: number;
+        /**
+          * Color of the stat text
+          * @uiName Stat text color
+          * @uiWidget color
+          * @uiType string
+          * @format color
+          * @uiGroup Additional Settings
+         */
+        "statTextColor"?: string;
         /**
           * Select what type of stat to display. Manual paths are also supported.
           * @uiWidget statTypeSelectWidget
@@ -403,6 +430,8 @@ export namespace Components {
          */
         "brandFont": string;
     }
+    interface SqmBrandSelector {
+    }
     interface SqmCardFeed {
         /**
           * @uiName Column gap
@@ -509,14 +538,47 @@ export namespace Components {
         "contextName": string;
     }
     interface SqmCouponCode {
+        /**
+          * Background color of share link container
+          * @uiName Background color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "backgroundColor"?: string;
+        /**
+          * Border color of share link container
+          * @uiName Border color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "borderColor"?: string;
+        /**
+          * The border radius on the share link container (in pixels)
+          * @uiName Border Radius
+          * @uiType number
+          * @uiGroup Style
+         */
+        "borderRadius"?: string;
         /**
           * Set the copy button style and placement.
           * @uiName Style
           * @uiType string
           * @uiEnum ["icon", "button-outside", "button-below"]
           * @uiEnumNames ["Icon", "Button outside", "Button below"]
+          * @uiGroup Style
          */
         "buttonStyle"?: "icon" | "button-outside" | "button-below";
+        /**
+          * The type of the button (primary or secondary) that will be used to copy the link.
+          * @uiName Button Type
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * Display this message when the coupon code has been cancelled.
           * @uiWidget textArea
@@ -603,8 +665,17 @@ export namespace Components {
           * @uiType string
           * @uiEnum ["left", "center", "right"]
           * @uiEnumNames ["Left", "Center", "Right"]
+          * @uiGroup Style
          */
         "textAlign"?: "left" | "center" | "right";
+        /**
+          * Color of the text and copy icon
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
         /**
           * The number of milliseconds that the tooltip appears for
           * @uiName Tooltip lifespan
@@ -617,6 +688,18 @@ export namespace Components {
         "tooltiptext": string;
     }
     interface SqmDividedLayout {
+        /**
+          * Background color of the divider
+          * @uiName Background Color
+          * @uiWidget color
+         */
+        "backgroundColor"?: string;
+        /**
+          * Color of the divider (defaults to default text color if none is set)
+          * @uiName Border Color
+          * @uiWidget color
+         */
+        "borderColor"?: string;
         /**
           * Overrides max-width of content area
           * @uiName Content Area Width
@@ -631,7 +714,7 @@ export namespace Components {
          */
         "direction": "row" | "column";
         /**
-          * Uses Shorthand CSS border syntax allowing specification of thickness, fill style and color.
+          * @undocumented Uses Shorthand CSS border syntax allowing specification of thickness, fill style and color.
           * @uiName Border style
          */
         "dividerStyle": string;
@@ -941,11 +1024,18 @@ export namespace Components {
     }
     interface SqmHero {
         /**
-          * Can be an image url, colour or Shoelace variable.
+          * Add an image or select a color. Recommended image aspect ratio of 4:5
           * @uiName Background
           * @uiWidget Background
          */
         "background"?: string;
+        /**
+          * Can only be used when two columns are present
+          * @uiName Hide the column in mobile view
+          * @uiEnum ["primary", "secondary", "null"]
+          * @uiEnumNames ["Primary", "Secondary", "None"]
+         */
+        "columnToHideInMobile"?: "primary" | "secondary" | null;
         /**
           * @uiName Columns
           * @uiEnum [1, 2]
@@ -982,6 +1072,7 @@ export namespace Components {
           * @uiName Background color
           * @uiWidget color
           * @format color
+          * @uiGroup Style
          */
         "backgroundColor"?: string;
         /**
@@ -997,6 +1088,15 @@ export namespace Components {
           * @uiName Button text
          */
         "buttonText"?: string;
+        /**
+          * The type of the button that is used (primary or secondary).
+          * @uiName Button Type
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * @uiName Description
           * @uiWidget textArea
@@ -1011,11 +1111,13 @@ export namespace Components {
           * @uiType string
           * @uiEnum ["top", "bottom"]
           * @uiEnumNames ["Top", "Bottom"]
+          * @uiGroup Style
          */
         "imageMobilePos": "top" | "bottom";
         /**
           * @uiName Image percentage
           * @uiType number
+          * @uiGroup Style
          */
         "imagePercentage": number;
         /**
@@ -1023,6 +1125,7 @@ export namespace Components {
           * @uiType string
           * @uiEnum ["left", "center", "right"]
           * @uiEnumNames ["Left", "Center", "Right"]
+          * @uiGroup Style
          */
         "imagePos": "left" | "center" | "right";
         /**
@@ -1036,16 +1139,19 @@ export namespace Components {
           * @uiType string
           * @uiEnum ["overlay", "columns"]
           * @uiEnumNames ["Overlay", "Two-column"]
+          * @uiGroup Style
          */
         "layout": "overlay" | "columns";
         /**
           * @uiName Overlay color
           * @uiWidget color
           * @format color
+          * @uiGroup Style
          */
         "overlayColor"?: string;
         /**
           * @uiName Overlay opacity
+          * @uiGroup Style
          */
         "overlayOpacity": string;
         /**
@@ -1053,6 +1159,7 @@ export namespace Components {
           * @uiType string
           * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
           * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+          * @uiGroup Style
          */
         "paddingImage": Spacing;
         /**
@@ -1060,12 +1167,14 @@ export namespace Components {
           * @uiType string
           * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
           * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+          * @uiGroup Style
          */
         "paddingText": Spacing;
         /**
           * @uiName Text color
           * @uiWidget color
           * @format color
+          * @uiGroup Style
          */
         "textColor"?: string;
     }
@@ -1677,6 +1786,26 @@ export namespace Components {
           * @uiName Unknown user text
          */
         "anonymousUser": string;
+        /**
+          * Changes the background color of the leaderboard.
+          * @uiName Background Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "background"?: string;
+        /**
+          * Changes the border color of the table rows.
+          * @uiName Border Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "borderColor"?: string;
+        /**
+          * Leaderboard border radius in pixels.
+          * @uiName Border Radius
+          * @uiGroup Style
+         */
+        "borderRadius"?: number;
         /**
           * @undocumented 
           * @uiType object
@@ -1745,10 +1874,31 @@ export namespace Components {
           * @uiName Stats column heading
          */
         "statsheading": string;
+        /**
+          * Text color of the leaderboard.
+          * @uiName Text Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
         /**
           * @uiName User column heading
          */
         "usersheading": string;
+        /**
+          * Changes the background color of the viewing user row in the leaderboard.
+          * @uiName Viewing User Highlight Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "viewingUserHighlightColor"?: string;
+        /**
+          * Changes the text color of the viewing user row in the leaderboard.
+          * @uiName Viewing User Text Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "viewingUserHighlightTextColor"?: string;
         /**
           * @uiName Viewing user text
          */
@@ -1891,8 +2041,47 @@ export namespace Components {
         "menuLabel": string;
     }
     interface SqmNavigationSidebar {
+        /**
+          * @undocumented 
+          * @uiType object
+         */
+        "demoData"?: DemoData<NavigationSidebarViewProps>;
+        /**
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "mobileMenuColor"?: string;
     }
     interface SqmNavigationSidebarItem {
+        /**
+          * Background color of the nav item
+          * @uiName Background Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "backgroundColor"?: string;
+        /**
+          * Background color of the nav item when focused
+          * @uiName Background Focused Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "backgroundFocusedColor"?: string;
+        /**
+          * Background color of the nav item when hovered
+          * @uiName Background Hover Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "backgroundHoverColor"?: string;
+        /**
+          * Border radius (in number of pixels)
+          * @uiName Border Radius
+          * @uiGroup Style
+         */
+        "borderRadius"?: number;
         /**
           * @undocumented 
           * @uiType object
@@ -1901,19 +2090,57 @@ export namespace Components {
         /**
           * Options available at https://shoelace.style/components/icon
           * @uiName Icon
+          * @uiGroup Style
          */
         "icon": string;
         /**
           * @uiName Label
          */
         "label": string;
+        /**
+          * @uiName Padding
+          * @uiType string
+          * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
+          * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+         */
+        "padding"?: Spacing;
         /**
           * @uiName Navigation path
           * @uiWidget pageSelect
          */
         "path": string;
+        /**
+          * Text color of the nav item
+          * @uiName Text Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
+        /**
+          * Text color of the nav item when items is focused
+          * @uiName Text Focused Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "textFocusedColor"?: string;
+        /**
+          * Text color of the nav item when hovered
+          * @uiName Text Hover Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "textHoverColor"?: string;
     }
     interface SqmPagination {
+        /**
+          * The type of the button that is used (primary or secondary).
+          * @uiName Button Type
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * @undocumented 
           * @uiType object
@@ -1996,6 +2223,10 @@ export namespace Components {
           * @uiName Payout missing information subtext
          */
         "payoutMissingInformationText": string;
+        /**
+          * @componentState { "title": "Loading", "props": { "states": { "loading": true } } }
+         */
+        "stateController"?: string;
         /**
           * Badge text indicating payout status
           * @uiName Payout badge status text
@@ -2008,6 +2239,14 @@ export namespace Components {
         "thresholdPayoutText": string;
     }
     interface SqmPayoutStatusAlert {
+        /**
+          * @uiName Account review alert description
+         */
+        "accountReviewDescription": string;
+        /**
+          * @uiName Account review alert header
+         */
+        "accountReviewHeader": string;
         /**
           * @uiName Cash & Payouts Microsite Page (only set if alert is used in a microsite)
          */
@@ -2090,15 +2329,15 @@ export namespace Components {
          */
         "verificationReviewInternalHeader": string;
         /**
-          * @uiName W9 payment threshold alert button text
+          * @uiName W-9 payment threshold alert button text
          */
         "w9RequiredButtonText": string;
         /**
-          * @uiName W9 payment threshold alert description
+          * @uiName W-9 payment threshold alert description
          */
         "w9RequiredDescription": string;
         /**
-          * @uiName W9 payment threshold alert header
+          * @uiName W-9 payment threshold alert header
          */
         "w9RequiredHeader": string;
     }
@@ -2432,6 +2671,21 @@ export namespace Components {
         "termsText"?: string;
     }
     interface SqmPortalForgotPassword {
+        /**
+          * @uiName Background color
+          * @uiWidget color
+         */
+        "backgroundColor": string;
+        /**
+          * @uiName Border style
+          * @uiWidget textArea
+         */
+        "border": string;
+        /**
+          * @uiName Border radius
+          * @uiWidget number
+         */
+        "borderRadius": string;
         /**
           * @undocumented 
           * @uiType object
@@ -2476,11 +2730,30 @@ export namespace Components {
         "successAlertText": string;
     }
     interface SqmPortalFrame {
+        /**
+          * @uiName Background color
+          * @uiWidget color
+          * @uiType string
+         */
+        "backgroundColor": string;
+        /**
+          * Borders placed to seperate the header and footer from the body content.
+          * @uiName Border
+          * @uiType string
+         */
+        "border": string;
         /**
           * @undocumented 
           * @uiType object
          */
         "demoData"?: DemoData<PortalFrameViewProps>;
+        /**
+          * Background color for the header and footer.
+          * @uiName Header and Footer Background Color
+          * @uiWidget color
+          * @uiType string
+         */
+        "headerAndFooterBackgroundColor": string;
         /**
           * @undocumented
          */
@@ -3213,7 +3486,13 @@ export namespace Components {
           * @uiWidget color
           * @format color
          */
-        "backgroundColor": string;
+        "backgroundColor"?: string;
+        /**
+          * Amount in pixels
+          * @uiName Border radius
+          * @type number
+         */
+        "borderRadius"?: number;
         /**
           * @uiName Description
           * @uiWidget textArea
@@ -3228,6 +3507,18 @@ export namespace Components {
           * @uiName Icon
          */
         "icon"?: string;
+        /**
+          * @uiName Icon Background color
+          * @uiWidget color
+          * @format color
+         */
+        "iconBackgroundColor"?: string;
+        /**
+          * @uiName Icon color
+          * @uiWidget color
+          * @format color
+         */
+        "iconColor"?: string;
         /**
           * Displayed in place of an icon
           * @uiName Image URL
@@ -3240,7 +3531,7 @@ export namespace Components {
           * @uiWidget color
           * @format color
          */
-        "textColor": string;
+        "textColor"?: string;
     }
     interface SqmProgramMenu {
     }
@@ -3292,7 +3583,20 @@ export namespace Components {
           * @uiWidget color
           * @uiType string
          */
-        "backgroundColor": string;
+        "backgroundColor"?: string;
+        /**
+          * Border color of container
+          * @uiName Border color
+          * @uiWidget color
+          * @format color
+         */
+        "borderColor"?: string;
+        /**
+          * The border radius (in pixels)
+          * @uiName Border Radius
+          * @uiType number
+         */
+        "borderRadius"?: number;
         /**
           * @uiName Hide border
           * @uiType boolean
@@ -3331,6 +3635,13 @@ export namespace Components {
           * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
          */
         "paddingTop": string;
+        /**
+          * Color of the text and copy icon
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+         */
+        "textColor"?: string;
         /**
           * @uiName Vertical alignment
           * @uiType string
@@ -3340,14 +3651,47 @@ export namespace Components {
         "verticalAlignment": "start" | "center" | "end";
     }
     interface SqmReferralCode {
+        /**
+          * Background color of share link container
+          * @uiName Background color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "backgroundColor"?: string;
+        /**
+          * Border color of share link container (default is set to 1px solid transparent)
+          * @uiName Border color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "borderColor"?: string;
+        /**
+          * The border radius on the share link container (in pixels)
+          * @uiName Border Radius
+          * @uiType number
+          * @uiGroup Style
+         */
+        "borderRadius"?: string;
         /**
           * Set the copy button style and placement
           * @uiName Style
           * @uiType string
           * @uiEnum ["icon", "button-outside", "button-below"]
           * @uiEnumNames ["Icon", "Button outside", "Button below"]
+          * @uiGroup Style
          */
         "buttonStyle"?: "icon" | "button-outside" | "button-below";
+        /**
+          * The type of the button that is used (primary or secondary).
+          * @uiName Button Type
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * @uiName Copy button label
          */
@@ -3379,8 +3723,17 @@ export namespace Components {
           * @uiType string
           * @uiEnum ["left", "center", "right"]
           * @uiEnumNames ["Left", "Center", "Right"]
+          * @uiGroup Style
          */
         "textAlign": "left" | "center" | "right";
+        /**
+          * Color of the text and copy icon
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
         /**
           * The number of milliseconds that the tooltip appears for
           * @uiName Tooltip lifespan
@@ -3415,6 +3768,12 @@ export namespace Components {
           * @uiWidget programSelector
          */
         "programId"?: string;
+        /**
+          * @uiName Text Color
+          * @uiType string
+          * @uiWidget color
+         */
+        "textColor"?: string;
         /**
           * @uiName Title Text
          */
@@ -3878,6 +4237,13 @@ export namespace Components {
           * @uiWidget textArea
          */
         "sourceAmountMessage": string;
+        /**
+          * @componentState { "title": "Choose reward", "props": { "states": { "redeemStage": "chooseReward" } }, "dependencies": ["sqm-reward-exchange-list"] }
+          * @componentState { "title": "Reward details", "props": { "states": { "redeemStage": "chooseAmount" } }, "dependencies": ["sqm-reward-exchange-list"] }
+          * @componentState { "title": "Confirm exchange", "props": { "states": { "redeemStage": "confirmation" } }, "dependencies": ["sqm-reward-exchange-list"] }
+          * @componentState { "title": "Exchange successful", "props": { "states": { "redeemStage": "success" } }, "dependencies": ["sqm-reward-exchange-list"] }
+         */
+        "stateController": string;
         /**
           * Shown when a user copies a fuel tank code
           * @uiName Tooltip text
@@ -4115,8 +4481,8 @@ export namespace Components {
          */
         "pendingUnhandled": string;
         /**
-          * Displayed when a reward is pending due to W9 compliance.
-          * @uiName W9 pending text
+          * Displayed when a reward is pending due to W-9 compliance.
+          * @uiName W-9 pending text
          */
         "pendingUsTax": string;
         "renderCell": (data: Reward, options?: { locale: string; taxConnection: ImpactConnection; }) => Promise<any>;
@@ -4141,19 +4507,6 @@ export namespace Components {
           * @uiName Button text
          */
         "buttonText": string;
-        /**
-          * @uiName Button type
-          * @uiType string
-          * @uiEnum ["default", "primary", "success", "neutral", "warning", "danger", "text"]
-          * @uiEnumNames ["Default", "Primary", "Success", "Neutral", "Warning", "Danger", "Text"]
-         */
-        "buttonType": | "default"
-    | "primary"
-    | "success"
-    | "neutral"
-    | "warning"
-    | "danger"
-    | "text";
         /**
           * Draws a circle button.
           * @uiName Circle
@@ -4216,11 +4569,18 @@ export namespace Components {
           * @uiName Button background color
           * @uiWidget color
           * @format color
+          * @uiGroup Style
          */
         "backgroundcolor"?: string;
+        /**
+          * @uiName Border
+          * @uiGroup Style
+         */
+        "border"?: string;
         /**
           * Configure border radius with pixel amount
           * @uiName Border radius
+          * @uiGroup Style
          */
         "borderradius"?: number;
         /**
@@ -4234,11 +4594,13 @@ export namespace Components {
         "disabled"?: boolean;
         /**
           * @uiName Hide icon
+          * @uiGroup Style
           * @default
          */
         "hideicon"?: boolean;
         /**
           * @uiName Hide text
+          * @uiGroup Style
           * @default
          */
         "hidetext"?: boolean;
@@ -4276,6 +4638,7 @@ export namespace Components {
     | "unknown";
         /**
           * @uiName Display pill
+          * @uiGroup Style
          */
         "pill"?: boolean;
         /**
@@ -4299,21 +4662,24 @@ export namespace Components {
           * @uiType string
           * @uiEnum ["small", "medium", "large" ]
           * @uiEnumNames ["Small", "Medium", "Large"]
+          * @uiGroup Style
          */
         "size"?: "small" | "medium" | "large";
         /**
           * @uiName Button text color
           * @uiWidget color
           * @format color
+          * @uiGroup Style
          */
         "textcolor"?: string;
         /**
           * @uiType string
           * @uiName Button style
-          * @uiEnum ["primary" , "success", "info", "warning", "danger", "default", "text" ]
-          * @uiEnumNames ["Primary", "Success", "Info", "Warning", "Danger", "Default", "Text"]
+          * @uiEnum ["primary", "secondary", "success", "info", "warning", "danger", "default", "text" ]
+          * @uiEnumNames ["Primary", "Secondary", "Success", "Info", "Warning", "Danger", "Default", "Text"]
          */
         "type"?: | "primary"
+    | "secondary"
     | "success"
     | "info"
     | "warning"
@@ -4332,14 +4698,47 @@ export namespace Components {
         "unsupportedPlatformText"?: string;
     }
     interface SqmShareCode {
+        /**
+          * Background color of share link container
+          * @uiName Background color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "backgroundColor"?: string;
+        /**
+          * Border color of share link container
+          * @uiName Border color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "borderColor"?: string;
+        /**
+          * The border radius on the share link container (in pixels)
+          * @uiName Border Radius
+          * @uiType number
+          * @uiGroup Style
+         */
+        "borderRadius"?: string;
         /**
           * Set the copy button style and placement
           * @uiName Style
           * @uiType string
           * @uiEnum ["icon", "button-outside", "button-below"]
           * @uiEnumNames ["Icon", "Button outside", "Button below"]
+          * @uiGroup Style
          */
         "buttonStyle"?: "icon" | "button-outside" | "button-below";
+        /**
+          * The type of the button that is used (primary or secondary).
+          * @uiName Button Type
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * @uiName Copy button label
          */
@@ -4361,8 +4760,17 @@ export namespace Components {
           * @uiType string
           * @uiEnum ["left", "center", "right"]
           * @uiEnumNames ["Left", "Center", "Right"]
+          * @uiGroup Style
          */
         "textAlign": "left" | "center" | "right";
+        /**
+          * Color of the text and copy icon
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
         /**
           * The number of milliseconds that the tooltip appears for
           * @uiName Tooltip lifespan
@@ -4375,14 +4783,47 @@ export namespace Components {
         "tooltiptext": string;
     }
     interface SqmShareLink {
+        /**
+          * Background color of share link container
+          * @uiName Background color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "backgroundColor"?: string;
+        /**
+          * Border color of share link container
+          * @uiName Border color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "borderColor"?: string;
+        /**
+          * The border radius on the share link container (in pixels)
+          * @uiName Border Radius
+          * @uiType number
+          * @uiGroup Style
+         */
+        "borderRadius"?: string;
         /**
           * Set the copy button style and placement
-          * @uiName Style
+          * @uiName Button style
           * @uiType string
           * @uiEnum ["icon", "button-outside", "button-below"]
           * @uiEnumNames ["Icon", "Button outside", "Button below"]
+          * @uiGroup Style
          */
         "buttonStyle"?: "icon" | "button-outside" | "button-below";
+        /**
+          * The type of the button that is used (primary or secondary).
+          * @uiName Button Type
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * @uiName Copy button label
          */
@@ -4404,8 +4845,17 @@ export namespace Components {
           * @uiType string
           * @uiEnum ["left", "center", "right"]
           * @uiEnumNames ["Left", "Center", "Right"]
+          * @uiGroup Style
          */
         "textAlign"?: "left" | "center" | "right";
+        /**
+          * Color of the text and copy icon
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
         /**
           * The number of milliseconds that the tooltip appears for
           * @uiName Tooltip lifespan
@@ -4419,12 +4869,34 @@ export namespace Components {
     }
     interface SqmStatContainer {
         /**
+          * Controls the alignment of the flexbox
+          * @uiName Alignment
+          * @uiType string
+          * @uiEnum ["left", "right", "center"]
+          * @uiEnumNames ["Left", "Right", "Center"]
+         */
+        "alignment"?: "left" | "right" | "center";
+        /**
+          * @undocumented 
           * @uiName Display
           * @uiType string
           * @uiEnum ["grid", "flex"]
           * @uiEnumNames ["Grid", "Flex"]
          */
         "display": "grid" | "flex";
+        /**
+          * @uiName Gap
+          * @uiType string
+          * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
+          * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+         */
+        "gap": Spacing;
+        /**
+          * Hide the seperating border between stats
+          * @uiName Hide border
+          * @uiType boolean
+         */
+        "hideBorder"?: boolean;
         /**
           * @uiName Space between stats
           * @uiType string
@@ -4466,8 +4938,33 @@ export namespace Components {
           * @uiEnumNames ["Left", "Right", "Bottom", "Top"]
          */
         "placement"?: "left" | "right" | "bottom" | "top";
+        /**
+          * Tab text color
+          * @uiName Text color
+          * @uiType string
+          * @uiWidget color
+         */
+        "textColor"?: string;
     }
     interface SqmTaskCard {
+        /**
+          * @uiName Card Background color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "backgroundColor"?: string;
+        /**
+          * @uiName Border color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "borderColor"?: string;
+        /**
+          * @uiName Border radius
+          * @uiType number
+          * @uiGroup Style
+         */
+        "borderRadius"?: number;
         /**
           * @uiName Button link
           * @uiGroup Button
@@ -4478,6 +4975,14 @@ export namespace Components {
           * @uiGroup Button
          */
         "buttonText": string;
+        /**
+          * @uiName Button Style
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * @uiName Title
           * @uiGroup Task
@@ -4615,6 +5120,12 @@ export namespace Components {
           * @default
          */
         "steps": boolean;
+        /**
+          * @uiName Text color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
     }
     interface SqmTaxAndCash {
         /**
@@ -4632,6 +5143,14 @@ export namespace Components {
           * @uiGroup General Form Properties
          */
         "continueButton": string;
+        /**
+          * @uiName Account review alert description
+         */
+        "dashboard_accountReviewDescription": string;
+        /**
+          * @uiName Account review alert header
+         */
+        "dashboard_accountReviewHeader": string;
         /**
           * Shown before the participant’s bank account information.
           * @uiName Bank account field label
@@ -4973,28 +5492,27 @@ export namespace Components {
          */
         "dashboard_verificationReviewInternalHeader": string;
         /**
-          * @uiName W9 payment threshold alert button text
+          * @uiName W-9 payment threshold alert button text
           * @uiGroup Dashboard Properties
           * @uiWidget textArea
          */
         "dashboard_w9RequiredButtonText": string;
         /**
-          * @uiName W9 payment threshold alert description
+          * @uiName W-9 payment threshold alert description
           * @uiGroup Dashboard Properties
           * @uiWidget textArea
          */
         "dashboard_w9RequiredDescription": string;
         /**
-          * @uiName W9 payment threshold alert header
+          * @uiName W-9 payment threshold alert header
           * @uiGroup Dashboard Properties
           * @uiWidget textArea
          */
         "dashboard_w9RequiredHeader": string;
         /**
-          * @undocumented 
-          * @uiType object
+          * @undocumented
          */
-        "demoData"?: DemoData<UseTaxAndCashResultType>;
+        "demoData"?: DemoData<TaxAndCashMonolith>;
         /**
           * Displayed under a field when it has an invalid entry.
           * @uiName Form field error message
@@ -5066,6 +5584,15 @@ export namespace Components {
           * @uiGroup General Form Properties
          */
         "searchForCountryText": string;
+        /**
+          * @undocumented 
+          * @componentState { "title": "Step 1: Personal information", "props": { "step": "/1" }, "dependencies": ["sqm-user-info-form"], "uiGroup": "Step 1 Properties" }
+          * @componentState { "title": "Step 2: Indirect tax", "props": { "step": "/2" }, "dependencies": ["sqm-indirect-tax-form"], "uiGroup": "Step 2 Properties" }
+          * @componentState { "title": "Step 3: Tax form", "props": { "step": "/3" }, "dependencies": ["sqm-docusign-form"], "uiGroup": "Step 3 Properties" }
+          * @componentState { "title": "Step 4: Payment method", "props": { "step": "/4" }, "dependencies": ["sqm-banking-info-form"], "uiGroup": "Step 4 Properties" }
+          * @componentState { "title": "Dashboard", "props": { "step": "/dashboard" }, "dependencies": ["sqm-tax-and-cash-dashboard"], "uiGroup": "Dashboard Properties" }
+         */
+        "stateController": string;
         /**
           * @uiName Address field label
           * @uiGroup Step 1 Properties
@@ -5616,6 +6143,14 @@ export namespace Components {
         "termsAndConditions": string;
     }
     interface SqmTaxAndCashDashboard {
+        /**
+          * @uiName Account review alert description
+         */
+        "accountReviewDescription": string;
+        /**
+          * @uiName Account review alert header
+         */
+        "accountReviewHeader": string;
         /**
           * Shown before the participant’s bank account information.
           * @uiName Bank account field label
@@ -5811,6 +6346,11 @@ export namespace Components {
           * @uiName Required tax form description
          */
         "requiredTaxForm"?: string;
+        /**
+          * @undocumented 
+          * @componentState { "title": "Payouts on hold", "props": { "states": { "payoutStatus": "HOLD" } }, "uiGroup": "Dashboard Properties" }
+         */
+        "stateController"?: string;
         /**
           * @uiName Payout status badge
          */
@@ -5864,11 +6404,6 @@ export namespace Components {
           * @uiWidget textArea
          */
         "taxAlertNotActiveMessageW9"?: string;
-        /**
-          * Displayed at the top of the page on all set up steps and on the dashboard.
-          * @uiName Page description
-         */
-        "taxAndPayoutsDescription": string;
         /**
           * @uiName Tax document section header
          */
@@ -5929,25 +6464,49 @@ export namespace Components {
          */
         "verificationReviewInternalHeader": string;
         /**
-          * @uiName W9 payment threshold alert button text
+          * @uiName W-9 payment threshold alert button text
          */
         "w9RequiredButtonText": string;
         /**
-          * @uiName W9 payment threshold alert description
+          * @uiName W-9 payment threshold alert description
          */
         "w9RequiredDescription": string;
         /**
-          * @uiName W9 payment threshold alert header
+          * @uiName W-9 payment threshold alert header
          */
         "w9RequiredHeader": string;
     }
     interface SqmText {
+        /**
+          * Font size in pixels
+          * @uiName Font Size
+          * @uiType number
+         */
+        "fontSize"?: number;
+        /**
+          * @uiName Text Color
+          * @uiWidget color
+          * @format color
+         */
+        "textColor"?: string;
     }
     interface SqmTextSpan {
+        /**
+          * Font size in pixels
+          * @uiName Font Size
+          * @uiType number
+         */
+        "fontSize"?: number;
         /**
           * @uiName Text
          */
         "text": string;
+        /**
+          * @uiName Text Color
+          * @uiWidget color
+          * @format color
+         */
+        "textColor"?: string;
         /**
           * @uiName Type
           * @uiType string
@@ -5977,11 +6536,25 @@ export namespace Components {
           * @uiEnumNames ["Gift", "Circle"]
          */
         "icon": "gift" | "circle";
+        /**
+          * Color of timeline
+          * @uiName Line color
+          * @uiWidget color
+          * @format color
+         */
+        "lineColor"?: string;
         /**
           * @uiName Reward amount
          */
         "reward": string;
         "setIcon": (value: "gift" | "circle") => Promise<void>;
+        /**
+          * Color of the text and copy icon
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+         */
+        "textColor"?: string;
         /**
           * @uiName Reward unit
          */
@@ -6277,8 +6850,19 @@ export namespace Components {
           * @uiGroup General Text
          */
         "general_verifyEmailHeader": string;
+        /**
+          * @undocumented 
+          * @componentState { "title": "Step 1: Enter email", "props": { "showCode": false }, "dependencies": ["sqm-email-verification"], "uiGroup": "Email Verification Step" }
+          * @componentState { "title": "Step 2: Enter code", "props": { "showCode": true }, "dependencies": ["sqm-code-verification"], "uiGroup": "Code Verification Step" }
+         */
+        "stateController": string;
     }
     interface SqmWidgetVerificationController {
+        /**
+          * @componentState { "title": "Verify email", "slot": "not-verified", "props": { "isAuth": false } }
+          * @componentState { "title": "Tax and cash", "slot": "verified", "props": { "isAuth": true } }
+         */
+        "stateController": string;
     }
 }
 declare global {
@@ -6288,12 +6872,6 @@ declare global {
         prototype: HTMLRaisinsPlopTargetElement;
         new (): HTMLRaisinsPlopTargetElement;
     };
-    interface HTMLSqmAssetCardElement extends Components.SqmAssetCard, HTMLStencilElement {
-    }
-    var HTMLSqmAssetCardElement: {
-        prototype: HTMLSqmAssetCardElement;
-        new (): HTMLSqmAssetCardElement;
-    };
     interface HTMLSqmBankingInfoFormElement extends Components.SqmBankingInfoForm, HTMLStencilElement {
     }
     var HTMLSqmBankingInfoFormElement: {
@@ -6312,6 +6890,12 @@ declare global {
         prototype: HTMLSqmBrandElement;
         new (): HTMLSqmBrandElement;
     };
+    interface HTMLSqmBrandSelectorElement extends Components.SqmBrandSelector, HTMLStencilElement {
+    }
+    var HTMLSqmBrandSelectorElement: {
+        prototype: HTMLSqmBrandSelectorElement;
+        new (): HTMLSqmBrandSelectorElement;
+    };
     interface HTMLSqmCardFeedElement extends Components.SqmCardFeed, HTMLStencilElement {
     }
     var HTMLSqmCardFeedElement: {
@@ -7046,10 +7630,10 @@ declare global {
     };
     interface HTMLElementTagNameMap {
         "raisins-plop-target": HTMLRaisinsPlopTargetElement;
-        "sqm-asset-card": HTMLSqmAssetCardElement;
         "sqm-banking-info-form": HTMLSqmBankingInfoFormElement;
         "sqm-big-stat": HTMLSqmBigStatElement;
         "sqm-brand": HTMLSqmBrandElement;
+        "sqm-brand-selector": HTMLSqmBrandSelectorElement;
         "sqm-card-feed": HTMLSqmCardFeedElement;
         "sqm-checkbox-field": HTMLSqmCheckboxFieldElement;
         "sqm-close-button": HTMLSqmCloseButtonElement;
@@ -7177,21 +7761,6 @@ declare global {
 declare namespace LocalJSX {
     interface RaisinsPlopTarget {
     }
-    interface SqmAssetCard {
-        /**
-          * @undocumented 
-          * @uiType object
-         */
-        "demoData"?: DemoData<AssetCardViewProps>;
-        /**
-          * @uiName Banner image
-         */
-        "imgUrl"?: string;
-        /**
-          * @uiName Banner title
-         */
-        "titleText"?: string;
-    }
     interface SqmBankingInfoForm {
         /**
           * @uiName Agency code field label
@@ -7474,6 +8043,7 @@ declare namespace LocalJSX {
           * @uiType string
           * @uiEnum ["left", "right", "center"]
           * @uiEnumNames ["Left", "Right", "Center"]
+          * @uiGroup Additional Settings
          */
         "alignment"?: "left" | "right" | "center";
         /**
@@ -7481,18 +8051,59 @@ declare namespace LocalJSX {
           * @uiType object
          */
         "demoData"?: DemoData<BigStatViewProps>;
+        /**
+          * Font size of the description text in pixels
+          * @uiName Description font size
+          * @uiGroup Additional Settings
+         */
+        "descriptionFontSize"?: number;
+        /**
+          * Color of the description text
+          * @uiName Description text color
+          * @uiWidget color
+          * @uiType string
+          * @format color
+          * @uiGroup Additional Settings
+         */
+        "descriptionTextColor"?: string;
         /**
           * Controls the order of the stat value & description column
           * @uiName Flex reverse
-          * @default
+          * @default 
+          * @uiGroup Additional Settings
          */
         "flexReverse"?: boolean;
         /**
           * The ID of the program that is used to scope stats. Defaults to the program context when no ID is specified.
           * @uiName Program ID
           * @uiWidget programSelector
+          * @uiGroup Additional Settings
          */
         "programId"?: string;
+        /**
+          * Font size of the stat text in pixels
+          * @uiName Stat font size
+          * @uiType string
+          * @uiGroup Additional Settings
+         */
+        "statFontSize"?: number;
+        /**
+          * Font weight of the stat text
+          * @uiName Stat font weight
+          * @uiGroup Additional Settings
+          * @uiEnum [100, 200, 300, 400, 500, 600, 700, 800, 900]
+          * @uiEnumNames ["Thin", "Extra Light", "Light", "Normal", "Medium", "Semi Bold", "Bold", "Extra Bold", "Heavy"]
+         */
+        "statFontWeight"?: number;
+        /**
+          * Color of the stat text
+          * @uiName Stat text color
+          * @uiWidget color
+          * @uiType string
+          * @format color
+          * @uiGroup Additional Settings
+         */
+        "statTextColor"?: string;
         /**
           * Select what type of stat to display. Manual paths are also supported.
           * @uiWidget statTypeSelectWidget
@@ -7517,6 +8128,8 @@ declare namespace LocalJSX {
          */
         "brandFont"?: string;
     }
+    interface SqmBrandSelector {
+    }
     interface SqmCardFeed {
         /**
           * @uiName Column gap
@@ -7623,14 +8236,47 @@ declare namespace LocalJSX {
         "contextName"?: string;
     }
     interface SqmCouponCode {
+        /**
+          * Background color of share link container
+          * @uiName Background color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "backgroundColor"?: string;
+        /**
+          * Border color of share link container
+          * @uiName Border color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "borderColor"?: string;
+        /**
+          * The border radius on the share link container (in pixels)
+          * @uiName Border Radius
+          * @uiType number
+          * @uiGroup Style
+         */
+        "borderRadius"?: string;
         /**
           * Set the copy button style and placement.
           * @uiName Style
           * @uiType string
           * @uiEnum ["icon", "button-outside", "button-below"]
           * @uiEnumNames ["Icon", "Button outside", "Button below"]
+          * @uiGroup Style
          */
         "buttonStyle"?: "icon" | "button-outside" | "button-below";
+        /**
+          * The type of the button (primary or secondary) that will be used to copy the link.
+          * @uiName Button Type
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * Display this message when the coupon code has been cancelled.
           * @uiWidget textArea
@@ -7717,8 +8363,17 @@ declare namespace LocalJSX {
           * @uiType string
           * @uiEnum ["left", "center", "right"]
           * @uiEnumNames ["Left", "Center", "Right"]
+          * @uiGroup Style
          */
         "textAlign"?: "left" | "center" | "right";
+        /**
+          * Color of the text and copy icon
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
         /**
           * The number of milliseconds that the tooltip appears for
           * @uiName Tooltip lifespan
@@ -7731,6 +8386,18 @@ declare namespace LocalJSX {
         "tooltiptext"?: string;
     }
     interface SqmDividedLayout {
+        /**
+          * Background color of the divider
+          * @uiName Background Color
+          * @uiWidget color
+         */
+        "backgroundColor"?: string;
+        /**
+          * Color of the divider (defaults to default text color if none is set)
+          * @uiName Border Color
+          * @uiWidget color
+         */
+        "borderColor"?: string;
         /**
           * Overrides max-width of content area
           * @uiName Content Area Width
@@ -7745,7 +8412,7 @@ declare namespace LocalJSX {
          */
         "direction"?: "row" | "column";
         /**
-          * Uses Shorthand CSS border syntax allowing specification of thickness, fill style and color.
+          * @undocumented Uses Shorthand CSS border syntax allowing specification of thickness, fill style and color.
           * @uiName Border style
          */
         "dividerStyle"?: string;
@@ -8056,11 +8723,18 @@ declare namespace LocalJSX {
     }
     interface SqmHero {
         /**
-          * Can be an image url, colour or Shoelace variable.
+          * Add an image or select a color. Recommended image aspect ratio of 4:5
           * @uiName Background
           * @uiWidget Background
          */
         "background"?: string;
+        /**
+          * Can only be used when two columns are present
+          * @uiName Hide the column in mobile view
+          * @uiEnum ["primary", "secondary", "null"]
+          * @uiEnumNames ["Primary", "Secondary", "None"]
+         */
+        "columnToHideInMobile"?: "primary" | "secondary" | null;
         /**
           * @uiName Columns
           * @uiEnum [1, 2]
@@ -8097,6 +8771,7 @@ declare namespace LocalJSX {
           * @uiName Background color
           * @uiWidget color
           * @format color
+          * @uiGroup Style
          */
         "backgroundColor"?: string;
         /**
@@ -8112,6 +8787,15 @@ declare namespace LocalJSX {
           * @uiName Button text
          */
         "buttonText"?: string;
+        /**
+          * The type of the button that is used (primary or secondary).
+          * @uiName Button Type
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * @uiName Description
           * @uiWidget textArea
@@ -8126,11 +8810,13 @@ declare namespace LocalJSX {
           * @uiType string
           * @uiEnum ["top", "bottom"]
           * @uiEnumNames ["Top", "Bottom"]
+          * @uiGroup Style
          */
         "imageMobilePos"?: "top" | "bottom";
         /**
           * @uiName Image percentage
           * @uiType number
+          * @uiGroup Style
          */
         "imagePercentage"?: number;
         /**
@@ -8138,6 +8824,7 @@ declare namespace LocalJSX {
           * @uiType string
           * @uiEnum ["left", "center", "right"]
           * @uiEnumNames ["Left", "Center", "Right"]
+          * @uiGroup Style
          */
         "imagePos"?: "left" | "center" | "right";
         /**
@@ -8151,16 +8838,19 @@ declare namespace LocalJSX {
           * @uiType string
           * @uiEnum ["overlay", "columns"]
           * @uiEnumNames ["Overlay", "Two-column"]
+          * @uiGroup Style
          */
         "layout"?: "overlay" | "columns";
         /**
           * @uiName Overlay color
           * @uiWidget color
           * @format color
+          * @uiGroup Style
          */
         "overlayColor"?: string;
         /**
           * @uiName Overlay opacity
+          * @uiGroup Style
          */
         "overlayOpacity"?: string;
         /**
@@ -8168,6 +8858,7 @@ declare namespace LocalJSX {
           * @uiType string
           * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
           * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+          * @uiGroup Style
          */
         "paddingImage"?: Spacing;
         /**
@@ -8175,12 +8866,14 @@ declare namespace LocalJSX {
           * @uiType string
           * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
           * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+          * @uiGroup Style
          */
         "paddingText"?: Spacing;
         /**
           * @uiName Text color
           * @uiWidget color
           * @format color
+          * @uiGroup Style
          */
         "textColor"?: string;
     }
@@ -8786,6 +9479,26 @@ declare namespace LocalJSX {
           * @uiName Unknown user text
          */
         "anonymousUser"?: string;
+        /**
+          * Changes the background color of the leaderboard.
+          * @uiName Background Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "background"?: string;
+        /**
+          * Changes the border color of the table rows.
+          * @uiName Border Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "borderColor"?: string;
+        /**
+          * Leaderboard border radius in pixels.
+          * @uiName Border Radius
+          * @uiGroup Style
+         */
+        "borderRadius"?: number;
         /**
           * @undocumented 
           * @uiType object
@@ -8854,10 +9567,31 @@ declare namespace LocalJSX {
           * @uiName Stats column heading
          */
         "statsheading"?: string;
+        /**
+          * Text color of the leaderboard.
+          * @uiName Text Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
         /**
           * @uiName User column heading
          */
         "usersheading"?: string;
+        /**
+          * Changes the background color of the viewing user row in the leaderboard.
+          * @uiName Viewing User Highlight Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "viewingUserHighlightColor"?: string;
+        /**
+          * Changes the text color of the viewing user row in the leaderboard.
+          * @uiName Viewing User Text Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "viewingUserHighlightTextColor"?: string;
         /**
           * @uiName Viewing user text
          */
@@ -9000,8 +9734,47 @@ declare namespace LocalJSX {
         "menuLabel"?: string;
     }
     interface SqmNavigationSidebar {
+        /**
+          * @undocumented 
+          * @uiType object
+         */
+        "demoData"?: DemoData<NavigationSidebarViewProps>;
+        /**
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "mobileMenuColor"?: string;
     }
     interface SqmNavigationSidebarItem {
+        /**
+          * Background color of the nav item
+          * @uiName Background Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "backgroundColor"?: string;
+        /**
+          * Background color of the nav item when focused
+          * @uiName Background Focused Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "backgroundFocusedColor"?: string;
+        /**
+          * Background color of the nav item when hovered
+          * @uiName Background Hover Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "backgroundHoverColor"?: string;
+        /**
+          * Border radius (in number of pixels)
+          * @uiName Border Radius
+          * @uiGroup Style
+         */
+        "borderRadius"?: number;
         /**
           * @undocumented 
           * @uiType object
@@ -9010,19 +9783,57 @@ declare namespace LocalJSX {
         /**
           * Options available at https://shoelace.style/components/icon
           * @uiName Icon
+          * @uiGroup Style
          */
         "icon"?: string;
         /**
           * @uiName Label
          */
         "label"?: string;
+        /**
+          * @uiName Padding
+          * @uiType string
+          * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
+          * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+         */
+        "padding"?: Spacing;
         /**
           * @uiName Navigation path
           * @uiWidget pageSelect
          */
         "path"?: string;
+        /**
+          * Text color of the nav item
+          * @uiName Text Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
+        /**
+          * Text color of the nav item when items is focused
+          * @uiName Text Focused Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "textFocusedColor"?: string;
+        /**
+          * Text color of the nav item when hovered
+          * @uiName Text Hover Color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "textHoverColor"?: string;
     }
     interface SqmPagination {
+        /**
+          * The type of the button that is used (primary or secondary).
+          * @uiName Button Type
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * @undocumented 
           * @uiType object
@@ -9105,6 +9916,10 @@ declare namespace LocalJSX {
           * @uiName Payout missing information subtext
          */
         "payoutMissingInformationText"?: string;
+        /**
+          * @componentState { "title": "Loading", "props": { "states": { "loading": true } } }
+         */
+        "stateController"?: string;
         /**
           * Badge text indicating payout status
           * @uiName Payout badge status text
@@ -9117,6 +9932,14 @@ declare namespace LocalJSX {
         "thresholdPayoutText"?: string;
     }
     interface SqmPayoutStatusAlert {
+        /**
+          * @uiName Account review alert description
+         */
+        "accountReviewDescription"?: string;
+        /**
+          * @uiName Account review alert header
+         */
+        "accountReviewHeader"?: string;
         /**
           * @uiName Cash & Payouts Microsite Page (only set if alert is used in a microsite)
          */
@@ -9199,15 +10022,15 @@ declare namespace LocalJSX {
          */
         "verificationReviewInternalHeader"?: string;
         /**
-          * @uiName W9 payment threshold alert button text
+          * @uiName W-9 payment threshold alert button text
          */
         "w9RequiredButtonText"?: string;
         /**
-          * @uiName W9 payment threshold alert description
+          * @uiName W-9 payment threshold alert description
          */
         "w9RequiredDescription"?: string;
         /**
-          * @uiName W9 payment threshold alert header
+          * @uiName W-9 payment threshold alert header
          */
         "w9RequiredHeader"?: string;
     }
@@ -9541,6 +10364,21 @@ declare namespace LocalJSX {
         "termsText"?: string;
     }
     interface SqmPortalForgotPassword {
+        /**
+          * @uiName Background color
+          * @uiWidget color
+         */
+        "backgroundColor"?: string;
+        /**
+          * @uiName Border style
+          * @uiWidget textArea
+         */
+        "border"?: string;
+        /**
+          * @uiName Border radius
+          * @uiWidget number
+         */
+        "borderRadius"?: string;
         /**
           * @undocumented 
           * @uiType object
@@ -9585,11 +10423,30 @@ declare namespace LocalJSX {
         "successAlertText"?: string;
     }
     interface SqmPortalFrame {
+        /**
+          * @uiName Background color
+          * @uiWidget color
+          * @uiType string
+         */
+        "backgroundColor"?: string;
+        /**
+          * Borders placed to seperate the header and footer from the body content.
+          * @uiName Border
+          * @uiType string
+         */
+        "border"?: string;
         /**
           * @undocumented 
           * @uiType object
          */
         "demoData"?: DemoData<PortalFrameViewProps>;
+        /**
+          * Background color for the header and footer.
+          * @uiName Header and Footer Background Color
+          * @uiWidget color
+          * @uiType string
+         */
+        "headerAndFooterBackgroundColor"?: string;
         /**
           * @undocumented
          */
@@ -10323,6 +11180,12 @@ declare namespace LocalJSX {
           * @format color
          */
         "backgroundColor"?: string;
+        /**
+          * Amount in pixels
+          * @uiName Border radius
+          * @type number
+         */
+        "borderRadius"?: number;
         /**
           * @uiName Description
           * @uiWidget textArea
@@ -10337,6 +11200,18 @@ declare namespace LocalJSX {
           * @uiName Icon
          */
         "icon"?: string;
+        /**
+          * @uiName Icon Background color
+          * @uiWidget color
+          * @format color
+         */
+        "iconBackgroundColor"?: string;
+        /**
+          * @uiName Icon color
+          * @uiWidget color
+          * @format color
+         */
+        "iconColor"?: string;
         /**
           * Displayed in place of an icon
           * @uiName Image URL
@@ -10402,6 +11277,19 @@ declare namespace LocalJSX {
           * @uiType string
          */
         "backgroundColor"?: string;
+        /**
+          * Border color of container
+          * @uiName Border color
+          * @uiWidget color
+          * @format color
+         */
+        "borderColor"?: string;
+        /**
+          * The border radius (in pixels)
+          * @uiName Border Radius
+          * @uiType number
+         */
+        "borderRadius"?: number;
         /**
           * @uiName Hide border
           * @uiType boolean
@@ -10440,6 +11328,13 @@ declare namespace LocalJSX {
           * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
          */
         "paddingTop"?: string;
+        /**
+          * Color of the text and copy icon
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+         */
+        "textColor"?: string;
         /**
           * @uiName Vertical alignment
           * @uiType string
@@ -10449,14 +11344,47 @@ declare namespace LocalJSX {
         "verticalAlignment"?: "start" | "center" | "end";
     }
     interface SqmReferralCode {
+        /**
+          * Background color of share link container
+          * @uiName Background color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "backgroundColor"?: string;
+        /**
+          * Border color of share link container (default is set to 1px solid transparent)
+          * @uiName Border color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "borderColor"?: string;
+        /**
+          * The border radius on the share link container (in pixels)
+          * @uiName Border Radius
+          * @uiType number
+          * @uiGroup Style
+         */
+        "borderRadius"?: string;
         /**
           * Set the copy button style and placement
           * @uiName Style
           * @uiType string
           * @uiEnum ["icon", "button-outside", "button-below"]
           * @uiEnumNames ["Icon", "Button outside", "Button below"]
+          * @uiGroup Style
          */
         "buttonStyle"?: "icon" | "button-outside" | "button-below";
+        /**
+          * The type of the button that is used (primary or secondary).
+          * @uiName Button Type
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * @uiName Copy button label
          */
@@ -10488,8 +11416,17 @@ declare namespace LocalJSX {
           * @uiType string
           * @uiEnum ["left", "center", "right"]
           * @uiEnumNames ["Left", "Center", "Right"]
+          * @uiGroup Style
          */
         "textAlign"?: "left" | "center" | "right";
+        /**
+          * Color of the text and copy icon
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
         /**
           * The number of milliseconds that the tooltip appears for
           * @uiName Tooltip lifespan
@@ -10524,6 +11461,12 @@ declare namespace LocalJSX {
           * @uiWidget programSelector
          */
         "programId"?: string;
+        /**
+          * @uiName Text Color
+          * @uiType string
+          * @uiWidget color
+         */
+        "textColor"?: string;
         /**
           * @uiName Title Text
          */
@@ -10973,6 +11916,13 @@ declare namespace LocalJSX {
           * @uiWidget textArea
          */
         "sourceAmountMessage"?: string;
+        /**
+          * @componentState { "title": "Choose reward", "props": { "states": { "redeemStage": "chooseReward" } }, "dependencies": ["sqm-reward-exchange-list"] }
+          * @componentState { "title": "Reward details", "props": { "states": { "redeemStage": "chooseAmount" } }, "dependencies": ["sqm-reward-exchange-list"] }
+          * @componentState { "title": "Confirm exchange", "props": { "states": { "redeemStage": "confirmation" } }, "dependencies": ["sqm-reward-exchange-list"] }
+          * @componentState { "title": "Exchange successful", "props": { "states": { "redeemStage": "success" } }, "dependencies": ["sqm-reward-exchange-list"] }
+         */
+        "stateController"?: string;
         /**
           * Shown when a user copies a fuel tank code
           * @uiName Tooltip text
@@ -11202,8 +12152,8 @@ declare namespace LocalJSX {
          */
         "pendingUnhandled"?: string;
         /**
-          * Displayed when a reward is pending due to W9 compliance.
-          * @uiName W9 pending text
+          * Displayed when a reward is pending due to W-9 compliance.
+          * @uiName W-9 pending text
          */
         "pendingUsTax"?: string;
         /**
@@ -11226,19 +12176,6 @@ declare namespace LocalJSX {
           * @uiName Button text
          */
         "buttonText"?: string;
-        /**
-          * @uiName Button type
-          * @uiType string
-          * @uiEnum ["default", "primary", "success", "neutral", "warning", "danger", "text"]
-          * @uiEnumNames ["Default", "Primary", "Success", "Neutral", "Warning", "Danger", "Text"]
-         */
-        "buttonType"?: | "default"
-    | "primary"
-    | "success"
-    | "neutral"
-    | "warning"
-    | "danger"
-    | "text";
         /**
           * Draws a circle button.
           * @uiName Circle
@@ -11301,11 +12238,18 @@ declare namespace LocalJSX {
           * @uiName Button background color
           * @uiWidget color
           * @format color
+          * @uiGroup Style
          */
         "backgroundcolor"?: string;
+        /**
+          * @uiName Border
+          * @uiGroup Style
+         */
+        "border"?: string;
         /**
           * Configure border radius with pixel amount
           * @uiName Border radius
+          * @uiGroup Style
          */
         "borderradius"?: number;
         /**
@@ -11319,11 +12263,13 @@ declare namespace LocalJSX {
         "disabled"?: boolean;
         /**
           * @uiName Hide icon
+          * @uiGroup Style
           * @default
          */
         "hideicon"?: boolean;
         /**
           * @uiName Hide text
+          * @uiGroup Style
           * @default
          */
         "hidetext"?: boolean;
@@ -11361,6 +12307,7 @@ declare namespace LocalJSX {
     | "unknown";
         /**
           * @uiName Display pill
+          * @uiGroup Style
          */
         "pill"?: boolean;
         /**
@@ -11384,21 +12331,24 @@ declare namespace LocalJSX {
           * @uiType string
           * @uiEnum ["small", "medium", "large" ]
           * @uiEnumNames ["Small", "Medium", "Large"]
+          * @uiGroup Style
          */
         "size"?: "small" | "medium" | "large";
         /**
           * @uiName Button text color
           * @uiWidget color
           * @format color
+          * @uiGroup Style
          */
         "textcolor"?: string;
         /**
           * @uiType string
           * @uiName Button style
-          * @uiEnum ["primary" , "success", "info", "warning", "danger", "default", "text" ]
-          * @uiEnumNames ["Primary", "Success", "Info", "Warning", "Danger", "Default", "Text"]
+          * @uiEnum ["primary", "secondary", "success", "info", "warning", "danger", "default", "text" ]
+          * @uiEnumNames ["Primary", "Secondary", "Success", "Info", "Warning", "Danger", "Default", "Text"]
          */
         "type"?: | "primary"
+    | "secondary"
     | "success"
     | "info"
     | "warning"
@@ -11417,14 +12367,47 @@ declare namespace LocalJSX {
         "unsupportedPlatformText"?: string;
     }
     interface SqmShareCode {
+        /**
+          * Background color of share link container
+          * @uiName Background color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "backgroundColor"?: string;
+        /**
+          * Border color of share link container
+          * @uiName Border color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "borderColor"?: string;
+        /**
+          * The border radius on the share link container (in pixels)
+          * @uiName Border Radius
+          * @uiType number
+          * @uiGroup Style
+         */
+        "borderRadius"?: string;
         /**
           * Set the copy button style and placement
           * @uiName Style
           * @uiType string
           * @uiEnum ["icon", "button-outside", "button-below"]
           * @uiEnumNames ["Icon", "Button outside", "Button below"]
+          * @uiGroup Style
          */
         "buttonStyle"?: "icon" | "button-outside" | "button-below";
+        /**
+          * The type of the button that is used (primary or secondary).
+          * @uiName Button Type
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * @uiName Copy button label
          */
@@ -11446,8 +12429,17 @@ declare namespace LocalJSX {
           * @uiType string
           * @uiEnum ["left", "center", "right"]
           * @uiEnumNames ["Left", "Center", "Right"]
+          * @uiGroup Style
          */
         "textAlign"?: "left" | "center" | "right";
+        /**
+          * Color of the text and copy icon
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
         /**
           * The number of milliseconds that the tooltip appears for
           * @uiName Tooltip lifespan
@@ -11460,14 +12452,47 @@ declare namespace LocalJSX {
         "tooltiptext"?: string;
     }
     interface SqmShareLink {
+        /**
+          * Background color of share link container
+          * @uiName Background color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "backgroundColor"?: string;
+        /**
+          * Border color of share link container
+          * @uiName Border color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "borderColor"?: string;
+        /**
+          * The border radius on the share link container (in pixels)
+          * @uiName Border Radius
+          * @uiType number
+          * @uiGroup Style
+         */
+        "borderRadius"?: string;
         /**
           * Set the copy button style and placement
-          * @uiName Style
+          * @uiName Button style
           * @uiType string
           * @uiEnum ["icon", "button-outside", "button-below"]
           * @uiEnumNames ["Icon", "Button outside", "Button below"]
+          * @uiGroup Style
          */
         "buttonStyle"?: "icon" | "button-outside" | "button-below";
+        /**
+          * The type of the button that is used (primary or secondary).
+          * @uiName Button Type
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * @uiName Copy button label
          */
@@ -11489,8 +12514,17 @@ declare namespace LocalJSX {
           * @uiType string
           * @uiEnum ["left", "center", "right"]
           * @uiEnumNames ["Left", "Center", "Right"]
+          * @uiGroup Style
          */
         "textAlign"?: "left" | "center" | "right";
+        /**
+          * Color of the text and copy icon
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
         /**
           * The number of milliseconds that the tooltip appears for
           * @uiName Tooltip lifespan
@@ -11504,12 +12538,34 @@ declare namespace LocalJSX {
     }
     interface SqmStatContainer {
         /**
+          * Controls the alignment of the flexbox
+          * @uiName Alignment
+          * @uiType string
+          * @uiEnum ["left", "right", "center"]
+          * @uiEnumNames ["Left", "Right", "Center"]
+         */
+        "alignment"?: "left" | "right" | "center";
+        /**
+          * @undocumented 
           * @uiName Display
           * @uiType string
           * @uiEnum ["grid", "flex"]
           * @uiEnumNames ["Grid", "Flex"]
          */
         "display"?: "grid" | "flex";
+        /**
+          * @uiName Gap
+          * @uiType string
+          * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
+          * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+         */
+        "gap"?: Spacing;
+        /**
+          * Hide the seperating border between stats
+          * @uiName Hide border
+          * @uiType boolean
+         */
+        "hideBorder"?: boolean;
         /**
           * @uiName Space between stats
           * @uiType string
@@ -11551,8 +12607,33 @@ declare namespace LocalJSX {
           * @uiEnumNames ["Left", "Right", "Bottom", "Top"]
          */
         "placement"?: "left" | "right" | "bottom" | "top";
+        /**
+          * Tab text color
+          * @uiName Text color
+          * @uiType string
+          * @uiWidget color
+         */
+        "textColor"?: string;
     }
     interface SqmTaskCard {
+        /**
+          * @uiName Card Background color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "backgroundColor"?: string;
+        /**
+          * @uiName Border color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "borderColor"?: string;
+        /**
+          * @uiName Border radius
+          * @uiType number
+          * @uiGroup Style
+         */
+        "borderRadius"?: number;
         /**
           * @uiName Button link
           * @uiGroup Button
@@ -11563,6 +12644,14 @@ declare namespace LocalJSX {
           * @uiGroup Button
          */
         "buttonText"?: string;
+        /**
+          * @uiName Button Style
+          * @uiType string
+          * @uiEnum ["primary", "secondary"]
+          * @uiEnumNames ["Primary", "Secondary"]
+          * @uiGroup Style
+         */
+        "buttonType"?: "primary" | "secondary";
         /**
           * @uiName Title
           * @uiGroup Task
@@ -11700,6 +12789,12 @@ declare namespace LocalJSX {
           * @default
          */
         "steps"?: boolean;
+        /**
+          * @uiName Text color
+          * @uiWidget color
+          * @uiGroup Style
+         */
+        "textColor"?: string;
     }
     interface SqmTaxAndCash {
         /**
@@ -11717,6 +12812,14 @@ declare namespace LocalJSX {
           * @uiGroup General Form Properties
          */
         "continueButton"?: string;
+        /**
+          * @uiName Account review alert description
+         */
+        "dashboard_accountReviewDescription"?: string;
+        /**
+          * @uiName Account review alert header
+         */
+        "dashboard_accountReviewHeader"?: string;
         /**
           * Shown before the participant’s bank account information.
           * @uiName Bank account field label
@@ -12058,28 +13161,27 @@ declare namespace LocalJSX {
          */
         "dashboard_verificationReviewInternalHeader"?: string;
         /**
-          * @uiName W9 payment threshold alert button text
+          * @uiName W-9 payment threshold alert button text
           * @uiGroup Dashboard Properties
           * @uiWidget textArea
          */
         "dashboard_w9RequiredButtonText"?: string;
         /**
-          * @uiName W9 payment threshold alert description
+          * @uiName W-9 payment threshold alert description
           * @uiGroup Dashboard Properties
           * @uiWidget textArea
          */
         "dashboard_w9RequiredDescription"?: string;
         /**
-          * @uiName W9 payment threshold alert header
+          * @uiName W-9 payment threshold alert header
           * @uiGroup Dashboard Properties
           * @uiWidget textArea
          */
         "dashboard_w9RequiredHeader"?: string;
         /**
-          * @undocumented 
-          * @uiType object
+          * @undocumented
          */
-        "demoData"?: DemoData<UseTaxAndCashResultType>;
+        "demoData"?: DemoData<TaxAndCashMonolith>;
         /**
           * Displayed under a field when it has an invalid entry.
           * @uiName Form field error message
@@ -12151,6 +13253,15 @@ declare namespace LocalJSX {
           * @uiGroup General Form Properties
          */
         "searchForCountryText"?: string;
+        /**
+          * @undocumented 
+          * @componentState { "title": "Step 1: Personal information", "props": { "step": "/1" }, "dependencies": ["sqm-user-info-form"], "uiGroup": "Step 1 Properties" }
+          * @componentState { "title": "Step 2: Indirect tax", "props": { "step": "/2" }, "dependencies": ["sqm-indirect-tax-form"], "uiGroup": "Step 2 Properties" }
+          * @componentState { "title": "Step 3: Tax form", "props": { "step": "/3" }, "dependencies": ["sqm-docusign-form"], "uiGroup": "Step 3 Properties" }
+          * @componentState { "title": "Step 4: Payment method", "props": { "step": "/4" }, "dependencies": ["sqm-banking-info-form"], "uiGroup": "Step 4 Properties" }
+          * @componentState { "title": "Dashboard", "props": { "step": "/dashboard" }, "dependencies": ["sqm-tax-and-cash-dashboard"], "uiGroup": "Dashboard Properties" }
+         */
+        "stateController"?: string;
         /**
           * @uiName Address field label
           * @uiGroup Step 1 Properties
@@ -12701,6 +13812,14 @@ declare namespace LocalJSX {
         "termsAndConditions"?: string;
     }
     interface SqmTaxAndCashDashboard {
+        /**
+          * @uiName Account review alert description
+         */
+        "accountReviewDescription"?: string;
+        /**
+          * @uiName Account review alert header
+         */
+        "accountReviewHeader"?: string;
         /**
           * Shown before the participant’s bank account information.
           * @uiName Bank account field label
@@ -12896,6 +14015,11 @@ declare namespace LocalJSX {
           * @uiName Required tax form description
          */
         "requiredTaxForm"?: string;
+        /**
+          * @undocumented 
+          * @componentState { "title": "Payouts on hold", "props": { "states": { "payoutStatus": "HOLD" } }, "uiGroup": "Dashboard Properties" }
+         */
+        "stateController"?: string;
         /**
           * @uiName Payout status badge
          */
@@ -12949,11 +14073,6 @@ declare namespace LocalJSX {
           * @uiWidget textArea
          */
         "taxAlertNotActiveMessageW9"?: string;
-        /**
-          * Displayed at the top of the page on all set up steps and on the dashboard.
-          * @uiName Page description
-         */
-        "taxAndPayoutsDescription"?: string;
         /**
           * @uiName Tax document section header
          */
@@ -13014,25 +14133,49 @@ declare namespace LocalJSX {
          */
         "verificationReviewInternalHeader"?: string;
         /**
-          * @uiName W9 payment threshold alert button text
+          * @uiName W-9 payment threshold alert button text
          */
         "w9RequiredButtonText"?: string;
         /**
-          * @uiName W9 payment threshold alert description
+          * @uiName W-9 payment threshold alert description
          */
         "w9RequiredDescription"?: string;
         /**
-          * @uiName W9 payment threshold alert header
+          * @uiName W-9 payment threshold alert header
          */
         "w9RequiredHeader"?: string;
     }
     interface SqmText {
+        /**
+          * Font size in pixels
+          * @uiName Font Size
+          * @uiType number
+         */
+        "fontSize"?: number;
+        /**
+          * @uiName Text Color
+          * @uiWidget color
+          * @format color
+         */
+        "textColor"?: string;
     }
     interface SqmTextSpan {
+        /**
+          * Font size in pixels
+          * @uiName Font Size
+          * @uiType number
+         */
+        "fontSize"?: number;
         /**
           * @uiName Text
          */
         "text"?: string;
+        /**
+          * @uiName Text Color
+          * @uiWidget color
+          * @format color
+         */
+        "textColor"?: string;
         /**
           * @uiName Type
           * @uiType string
@@ -13062,10 +14205,24 @@ declare namespace LocalJSX {
           * @uiEnumNames ["Gift", "Circle"]
          */
         "icon"?: "gift" | "circle";
+        /**
+          * Color of timeline
+          * @uiName Line color
+          * @uiWidget color
+          * @format color
+         */
+        "lineColor"?: string;
         /**
           * @uiName Reward amount
          */
         "reward"?: string;
+        /**
+          * Color of the text and copy icon
+          * @uiName Text color
+          * @uiWidget color
+          * @format color
+         */
+        "textColor"?: string;
         /**
           * @uiName Reward unit
          */
@@ -13361,15 +14518,26 @@ declare namespace LocalJSX {
           * @uiGroup General Text
          */
         "general_verifyEmailHeader"?: string;
+        /**
+          * @undocumented 
+          * @componentState { "title": "Step 1: Enter email", "props": { "showCode": false }, "dependencies": ["sqm-email-verification"], "uiGroup": "Email Verification Step" }
+          * @componentState { "title": "Step 2: Enter code", "props": { "showCode": true }, "dependencies": ["sqm-code-verification"], "uiGroup": "Code Verification Step" }
+         */
+        "stateController"?: string;
     }
     interface SqmWidgetVerificationController {
+        /**
+          * @componentState { "title": "Verify email", "slot": "not-verified", "props": { "isAuth": false } }
+          * @componentState { "title": "Tax and cash", "slot": "verified", "props": { "isAuth": true } }
+         */
+        "stateController"?: string;
     }
     interface IntrinsicElements {
         "raisins-plop-target": RaisinsPlopTarget;
-        "sqm-asset-card": SqmAssetCard;
         "sqm-banking-info-form": SqmBankingInfoForm;
         "sqm-big-stat": SqmBigStat;
         "sqm-brand": SqmBrand;
+        "sqm-brand-selector": SqmBrandSelector;
         "sqm-card-feed": SqmCardFeed;
         "sqm-checkbox-field": SqmCheckboxField;
         "sqm-close-button": SqmCloseButton;
@@ -13499,10 +14667,10 @@ declare module "@stencil/core" {
     export namespace JSX {
         interface IntrinsicElements {
             "raisins-plop-target": LocalJSX.RaisinsPlopTarget & JSXBase.HTMLAttributes<HTMLRaisinsPlopTargetElement>;
-            "sqm-asset-card": LocalJSX.SqmAssetCard & JSXBase.HTMLAttributes<HTMLSqmAssetCardElement>;
             "sqm-banking-info-form": LocalJSX.SqmBankingInfoForm & JSXBase.HTMLAttributes<HTMLSqmBankingInfoFormElement>;
             "sqm-big-stat": LocalJSX.SqmBigStat & JSXBase.HTMLAttributes<HTMLSqmBigStatElement>;
             "sqm-brand": LocalJSX.SqmBrand & JSXBase.HTMLAttributes<HTMLSqmBrandElement>;
+            "sqm-brand-selector": LocalJSX.SqmBrandSelector & JSXBase.HTMLAttributes<HTMLSqmBrandSelectorElement>;
             "sqm-card-feed": LocalJSX.SqmCardFeed & JSXBase.HTMLAttributes<HTMLSqmCardFeedElement>;
             "sqm-checkbox-field": LocalJSX.SqmCheckboxField & JSXBase.HTMLAttributes<HTMLSqmCheckboxFieldElement>;
             "sqm-close-button": LocalJSX.SqmCloseButton & JSXBase.HTMLAttributes<HTMLSqmCloseButtonElement>;