@saasquatch/mint-components 2.5.0-2 → 2.5.0-3

package/dist/cjs/{sqm-user-info-form-view-c5f9b79b.js → sqm-user-info-form-view-9745956d.js}

@@ -4,8 +4,8 @@ const index = require('./index-8277cbb3.js');
 const global = require('./global-258c36b8.js');
 const JSS = require('./JSS-8503a151.js');
 const AsYouType = require('./AsYouType-d15caac8.js');
-const subregions = require('./subregions-3d27e279.js');
-const data = require('./data-89ac73dd.js');
+const subregions = require('./subregions-d12829d6.js');
+const data = require('./data-04ef5511.js');
 
 const style = {
   Description: {
@@ -61,6 +61,18 @@ function InvoiceTableView(props, children) {
         children))));
 }
 
+const holdAlertContainer = (iconColor) => ({
+  marginLeft: "-20px",
+  "&::part(base)": {
+    maxWidth: "850px",
+    border: "none",
+    backgroundColor: "transparent",
+    color: "var(--sqm-text)",
+  },
+  "& sl-icon::part(base)": {
+    color: iconColor,
+  },
+});
 const style$1 = {
   ErrorAlertContainer: {
     "&::part(base)": {
@@ -75,30 +87,9 @@ const style$1 = {
       maxWidth: "600px",
     },
   },
-  WarningHoldAlertContainer: {
-    marginLeft: "-20px",
-    "&::part(base)": {
-      maxWidth: "850px",
-      border: "none",
-      backgroundColor: "transparent",
-      color: "var(--sqm-text)",
-    },
-    "& sl-icon::part(base)": {
-      color: "var(--sqm-warning-color-icon)",
-    },
-  },
-  ErrorHoldAlertContainer: {
-    marginLeft: "-20px",
-    "&::part(base)": {
-      maxWidth: "850px",
-      border: "none",
-      backgroundColor: "transparent",
-      color: "var(--sqm-text)",
-    },
-    "& sl-icon::part(base)": {
-      color: "var(--sqm-danger-color-icon)",
-    },
-  },
+  WarningHoldAlertContainer: holdAlertContainer("var(--sqm-warning-color-icon)"),
+  ErrorHoldAlertContainer: holdAlertContainer("var(--sqm-danger-color-icon)"),
+  InfoHoldAlertContainer: holdAlertContainer("var(--sqm-informative-color-icon)"),
   ExpiringSoonAlertContainer: {
     "&::part(base)": {
       backgroundColor: "var(--sl-color-yellow-100)",
@@ -358,7 +349,7 @@ const TaxAndCashDashboardView = (props) => {
               id: "payoutHoldAlertDescription",
               defaultMessage: text.payoutHoldAlertDescription,
             }, {
-              supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+              supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
             }),
             buttonText: null,
             alertType: "warning",
@@ -373,7 +364,7 @@ const TaxAndCashDashboardView = (props) => {
             id: "verificationRequiredDescription",
             defaultMessage: text.verificationRequiredDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }),
           buttonText: text.verificationRequiredButtonText,
           alertType: "warning",
@@ -387,7 +378,7 @@ const TaxAndCashDashboardView = (props) => {
             id: "verificationRequiredInternalDescription",
             defaultMessage: text.verificationRequiredInternalDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }),
           alertType: "warning",
           icon: "exclamation-triangle",
@@ -400,7 +391,7 @@ const TaxAndCashDashboardView = (props) => {
             id: "verificationReviewInternalDescription",
             defaultMessage: text.verificationReviewInternalDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }),
           alertType: "warning",
           icon: "exclamation-triangle",
@@ -413,7 +404,7 @@ const TaxAndCashDashboardView = (props) => {
             id: "verificationFailedInternalDescription",
             defaultMessage: text.verificationFailedInternalDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }),
           alertType: "error",
           icon: "exclamation-octagon",
@@ -426,13 +417,25 @@ const TaxAndCashDashboardView = (props) => {
             id: "accountReviewDescription",
             defaultMessage: text.accountReviewDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }),
           buttonText: null,
           alertType: "warning",
           icon: "exclamation-triangle",
           class: sheet.classes.WarningHoldAlertContainer,
         };
+      case "BALANCE_UNDER_THRESHOLD":
+        return {
+          header: text.balanceUnderThresholdHeader,
+          description: global.intl.formatMessage({
+            id: "balanceUnderThresholdDescription",
+            defaultMessage: text.balanceUnderThresholdDescription,
+          }, { minPayoutAmount: states.minPayoutAmount }),
+          buttonText: null,
+          alertType: "info",
+          icon: "info-circle",
+          class: sheet.classes.InfoHoldAlertContainer,
+        };
       case "PAYMENT_HOLD_ON_CHANGE":
         return {
           header: text.paymentHoldOnChangeHeader,
@@ -440,7 +443,7 @@ const TaxAndCashDashboardView = (props) => {
             id: "accountReviewDescription",
             defaultMessage: text.paymentHoldOnChangeDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }),
           buttonText: null,
           alertType: "warning",
@@ -454,7 +457,7 @@ const TaxAndCashDashboardView = (props) => {
             id: "accountReviewDescription",
             defaultMessage: text.beneficiaryNameInvalidDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }),
           button: (index.h("div", { class: sheet.classes.ButtonContainer },
             index.h("sl-button", { disabled: states.disabled || states.loading, type: "primary", class: sheet.classes.EditBankDetailsButton, onClick: callbacks.onEditPayoutInfo }, text.editPaymentInformationButton),
@@ -470,7 +473,7 @@ const TaxAndCashDashboardView = (props) => {
             id: "accountReviewDescription",
             defaultMessage: text.beneficiaryNameMismatchDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }),
           button: (index.h("div", { class: sheet.classes.ButtonContainer },
             index.h("sl-button", { disabled: states.disabled || states.loading, type: "primary", class: sheet.classes.EditBankDetailsButton, onClick: callbacks.onEditPayoutInfo }, text.editPaymentInformationButton),
@@ -486,7 +489,7 @@ const TaxAndCashDashboardView = (props) => {
             id: "accountReviewDescription",
             defaultMessage: text.bankTaxNameMismatchDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }),
           button: (index.h("div", { class: sheet.classes.ButtonContainer },
             index.h("sl-button", { disabled: states.disabled || states.loading, type: "primary", class: sheet.classes.EditBankDetailsButton, onClick: callbacks.onEditPayoutInfo }, text.editPaymentInformationButton),
@@ -502,7 +505,7 @@ const TaxAndCashDashboardView = (props) => {
             id: "accountReviewDescription",
             defaultMessage: text.withdrawalSettingsInvalidDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }),
           button: (index.h("sl-button", { disabled: states.disabled || states.loading, type: "default", class: sheet.classes.EditBankDetailsButton, onClick: callbacks.onEditPayoutInfo }, text.editPaymentInformationButton)),
           alertType: "warning",
@@ -516,7 +519,7 @@ const TaxAndCashDashboardView = (props) => {
             id: "accountReviewDescription",
             defaultMessage: text.paymentReturnedDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }),
           button: (index.h("sl-button", { disabled: states.disabled || states.loading, type: "primary", class: sheet.classes.EditBankDetailsButton, onClick: callbacks.onEditPayoutInfo }, text.editPaymentInformationButton)),
           alertType: "error",
@@ -530,7 +533,7 @@ const TaxAndCashDashboardView = (props) => {
             id: "payoutHoldAlertDescription",
             defaultMessage: text.payoutHoldAlertDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }),
           buttonText: null,
           alertType: "warning",
@@ -664,7 +667,7 @@ const TaxAndCashDashboardView = (props) => {
             id: "loadingErrorAlertDescription",
             defaultMessage: text.error.loadingErrorAlertDescription,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           })))),
       ((_a = states.errors) === null || _a === void 0 ? void 0 : _a.general) && (index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet.classes.ErrorAlertContainer },
         index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
@@ -674,7 +677,7 @@ const TaxAndCashDashboardView = (props) => {
           id: "generalDescription",
           defaultMessage: text.error.generalDescription,
         }, {
-          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
         }))),
       alertInfo && (index.h("sqm-form-message", { loading: states.loading, exportparts: "base: alert-base, icon:alert-icon", type: alertInfo === null || alertInfo === void 0 ? void 0 : alertInfo.alertType, class: alertInfo === null || alertInfo === void 0 ? void 0 : alertInfo.class, icon: alertInfo === null || alertInfo === void 0 ? void 0 : alertInfo.icon, transparent: true },
         index.h("strong", null, alertInfo.header),
@@ -723,14 +726,14 @@ const TaxAndCashDashboardView = (props) => {
                 id: "indirectTaxTooltipSupport",
                 defaultMessage: text.indirectTaxTooltipSupport,
               }, {
-                supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com`, class: sheet.classes.DropdownLink }, text.supportLink)),
+                supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com`, class: sheet.classes.DropdownLink }, text.supportLink)),
               })))),
         index.h("div", { class: sheet.classes.IndirectTaxPreviewDetails },
           index.h("span", null, states.notRegistered ? (index.h("span", { class: sheet.classes.NotRegisteredIndirectTaxText }, global.intl.formatMessage({
             id: "notRegisteredForTax",
             defaultMessage: text.notRegisteredForTax,
           }, {
-            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
           }))) : (getIndirectTaxRegisteredIn())),
           !states.notRegistered && (index.h("div", { class: sheet.classes.TaxNumberContainer },
             index.h("span", null, global.intl.formatMessage({
@@ -2268,7 +2271,7 @@ const UserInfoFormView = (props) => {
           id: "loadingErrorAlertDescription",
           defaultMessage: text.error.loadingErrorAlertDescription,
         }, {
-          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
         }))))),
     states.loading ? (index.h(subregions.LoadingView, null)) : (index.h("div", null,
       index.h("div", { class: classes.TextContainer },
@@ -2285,7 +2288,7 @@ const UserInfoFormView = (props) => {
           id: "generalDescription",
           defaultMessage: text.error.generalDescription,
         }, {
-          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
         })))),
       (states.isPartnerLegacy || states.isUserLegacy) && (index.h("sqm-form-message", { loading: states.loading, type: "info" },
         index.h("p", { part: "alert-title" }, text.isPartnerAlertHeader),
@@ -2293,7 +2296,7 @@ const UserInfoFormView = (props) => {
           id: "isPartnerAlertDescription",
           defaultMessage: text.isPartnerAlertDescription,
         }, {
-          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
         })))),
       index.h("div", null,
         index.h("div", { class: classes.InputContainer },

package/dist/cjs/{subregions-3d27e279.js → subregions-d12829d6.js}

@@ -635,6 +635,32 @@ function getCountryObj({ countryCode, locale, }) {
     displayName,
   };
 }
+/** The minimum balance Impact requires before it will issue a payout, e.g. "USD50.00". */
+function formatPayoutThreshold(publisher) {
+  var _a, _b;
+  const threshold = (_a = publisher === null || publisher === void 0 ? void 0 : publisher.withdrawalSettings) === null || _a === void 0 ? void 0 : _a.paymentThreshold;
+  if (!threshold)
+    return undefined;
+  return `${(_b = publisher === null || publisher === void 0 ? void 0 : publisher.currency) !== null && _b !== void 0 ? _b : ""}${threshold}`;
+}
+/** `payoutsAccount.balance` is a formatted string; only `balanceAmount` (minor units) is comparable. */
+function isBalanceUnderPayoutThreshold(publisher) {
+  var _a;
+  const rawThreshold = (_a = publisher === null || publisher === void 0 ? void 0 : publisher.withdrawalSettings) === null || _a === void 0 ? void 0 : _a.paymentThreshold;
+  const account = publisher === null || publisher === void 0 ? void 0 : publisher.payoutsAccount;
+  if (!rawThreshold || !account)
+    return false;
+  const threshold = Number(rawThreshold);
+  if (!Number.isFinite(threshold) || !Number.isFinite(account.balanceAmount))
+    return false;
+  const currency = account.currencyCode || (publisher === null || publisher === void 0 ? void 0 : publisher.currency);
+  if (!currency)
+    return false;
+  const scale = 10 **
+    new Intl.NumberFormat("en-US", { style: "currency", currency })
+      .resolvedOptions().maximumFractionDigits;
+  return account.balanceAmount < Math.round(threshold * scale);
+}
 
 const style = {
   Container: {
@@ -1059,7 +1085,9 @@ exports.INDIRECT_TAX_PROVINCES = INDIRECT_TAX_PROVINCES;
 exports.INDIRECT_TAX_SPAIN_REGIONS = INDIRECT_TAX_SPAIN_REGIONS;
 exports.LoadingView = LoadingView;
 exports.formatErrorMessage = formatErrorMessage;
+exports.formatPayoutThreshold = formatPayoutThreshold;
 exports.getCountryObj = getCountryObj;
+exports.isBalanceUnderPayoutThreshold = isBalanceUnderPayoutThreshold;
 exports.isValidI18nPhoneNumber = isValidI18nPhoneNumber;
 exports.objectIsFull = objectIsFull;
 exports.taxTypeToName = taxTypeToName;

package/dist/cjs/{useIndirectTaxForm-5211013b.js → useIndirectTaxForm-0969e194.js}

@@ -3,8 +3,8 @@
 const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
 const index_module = require('./index.module-f8c8495f.js');
 const jsonpointer = require('./jsonpointer-11327262.js');
-const subregions = require('./subregions-3d27e279.js');
-const data = require('./data-89ac73dd.js');
+const subregions = require('./subregions-d12829d6.js');
+const data = require('./data-04ef5511.js');
 const eventKeys = require('./eventKeys-7af4df4d.js');
 
 var toArray = function toArray(a) {
@@ -977,9 +977,16 @@ const GET_USER_STATUS = index_module.dist.gql `
           connected
           publisher {
             id
+            currency
+            withdrawalSettings {
+              paymentThreshold
+            }
             payoutsAccount {
               hold
               holdReasons
+              balance
+              balanceAmount
+              currencyCode
             }
           }
         }
@@ -1006,7 +1013,22 @@ const GET_TAX_SETTING = index_module.dist.gql `
     }
   }
 `;
+/** Transient holds that clear automatically, so a balance under the minimum explains the wait better. */
+const DISPLACEABLE_STATUSES = [
+  "DONE",
+  "NEW_PAYEE_REVIEW",
+  "PAYMENT_HOLD_ON_CHANGE",
+];
 function getStatus(data) {
+  var _a;
+  const status = getHoldStatus(data);
+  const publisher = (_a = data.user.impactConnection) === null || _a === void 0 ? void 0 : _a.publisher;
+  return DISPLACEABLE_STATUSES.includes(status) &&
+    subregions.isBalanceUnderPayoutThreshold(publisher)
+    ? "BALANCE_UNDER_THRESHOLD"
+    : status;
+}
+function getHoldStatus(data) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
   const account = (_b = (_a = data.user.impactConnection) === null || _a === void 0 ? void 0 : _a.publisher) === null || _b === void 0 ? void 0 : _b.payoutsAccount;
   const hasTransferredReward = (_e = (_d = (_c = data === null || data === void 0 ? void 0 : data.user) === null || _c === void 0 ? void 0 : _c.rewards) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.find((reward) => {
@@ -1049,7 +1071,7 @@ function getStatus(data) {
   return "DONE";
 }
 function usePayoutStatus(props) {
-  var _a;
+  var _a, _b, _c;
   const { type } = index_module.getEnvironmentSDK();
   const { loading, data, errors, refetch } = index_module.wn(GET_USER_STATUS, {});
   const { data: taxSettingRes } = index_module.wn(GET_TAX_SETTING, {});
@@ -1099,6 +1121,7 @@ function usePayoutStatus(props) {
       status,
       error: !!errors,
       enforceUsTaxComplianceOption,
+      minPayoutAmount: subregions.formatPayoutThreshold((_c = (_b = data === null || data === void 0 ? void 0 : data.user) === null || _b === void 0 ? void 0 : _b.impactConnection) === null || _c === void 0 ? void 0 : _c.publisher),
     },
     data: { type },
     text: props.getTextProps(),

package/dist/collection/components/sqm-big-stat/sqm-big-stat.js

@@ -19,6 +19,7 @@ import { useDemoBigStat } from "./useDemoBigStat";
  * @example Other Stat - <sqm-big-stat flex-reverse="true" alignment="left" stat-type=""><p>Label</p></sqm-big-stat>
  * @csspart stat-value - The stat value element
  * @csspart stat-description - The stat description element
+ * @csspart stat-wrapper - The stat wrapper element
  */
 export class BigStat {
   constructor() {

package/dist/collection/components/sqm-checkbox-field/sqm-checkbox-field.js

@@ -11,6 +11,8 @@ import { useCheckboxField } from "./useCheckboxField";
  * @validParents ["sqm-portal-register","sqm-portal-registration-form", "sqm-portal-google-registration-form"]
  * @exampleGroup Microsite Components
  * @example Form Checkbox Field - <sqm-checkbox-field checkbox-name="terms" checkbox-label="By signing up you agree to the {labelLink}" checkbox-label-link="https://example.com" checkbox-label-link-text="Terms and Conditions" error-message="Must be checked" ></sqm-checkbox-field>
+ * @csspart input-label - The input label
+ * @csspart input-base - The input base
  */
 export class CheckboxField {
   constructor() {

package/dist/collection/components/sqm-coupon-code/sqm-coupon-code.js

@@ -11,6 +11,11 @@ import { useCouponCode } from "./useCouponCode";
  * @compatibility Built for instant access
  * @exampleGroup Instant Access
  * @example Coupon Code - <sqm-coupon-code tooltip-text="Copied to Clipboard" tooltip-lifespan="1000"></sqm-coupon-code>
+ * @csspart erroralert-text - The error message element
+ * @csspart erroralert-icon - The error alert icon
+ * @csspart icon-button-base - The copy icon button base
+ * @csspart primarybutton-base - The primary button base
+ * @csspart secondarybutton-base - The secondary button base
  */
 export class CouponCode {
   constructor() {

package/dist/collection/components/sqm-dropdown-field/sqm-dropdown-field.js

@@ -12,6 +12,8 @@ import { useDropdownField } from "./useDropdownField";
  * @slots [{"name":"", "title":"Drop Down Option"}]
  * @exampleGroup Microsite Components
  * @example Form Dropdown Field - <sqm-dropdown-field dropdown-label="Select an option" error-message="Select an option"><sl-menu-item value="option-1">Option 1</sl-menu-item><sl-menu-item value="option-2">Option 2</sl-menu-item><sl-menu-item value="option-3">Option 3</sl-menu-item></sqm-dropdown-field>
+ * @csspart input-label - The input label
+ * @csspart input-base - The input base
  */
 export class DropdownField {
   constructor() {

package/dist/collection/components/sqm-edit-profile/sqm-edit-profile.js

@@ -7,6 +7,13 @@ import { getProps } from "../../utils/utils";
 import deepmerge from "deepmerge";
 /**
  * @uiName Microsite Edit Profile
+ * @csspart sqm-header - The profile form header
+ * @csspart erroralert-text - The error message element
+ * @csspart erroralert-icon - The error alert icon
+ * @csspart input-label - The input label
+ * @csspart input-base - The input base
+ * @csspart primarybutton-base - The primary button base
+ * @csspart secondarybutton-base - The secondary button base
  */
 export class EditProfile {
   constructor() {

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

@@ -3,6 +3,8 @@ import { EmptyStateView } from "./sqm-empty-view";
 /**
  * @uiName Empty State Content
  * @validParents ["sqm-referral-table","sqm-rewards-table","sqm-leaderboard","sqm-reward-exchange-list"]
+ * @csspart header-text - The empty state header
+ * @csspart description-text - The empty state description
  */
 export class Empty {
   render() {

package/dist/collection/components/sqm-form-message/sqm-form-message.js

@@ -3,6 +3,14 @@ import { Component, h, Prop, State } from "@stencil/core";
 /**
  * @uiName Form Message
  * @slots [{"name":"","title":"Message Content"}]
+ * @csspart erroralert-base - The error alert base
+ * @csspart erroralert-icon - The error alert icon
+ * @csspart infoalert-base - The info alert base
+ * @csspart infoalert-icon - The info alert icon
+ * @csspart warningalert-base - The warning alert base
+ * @csspart warningalert-icon - The warning alert icon
+ * @csspart successalert-base - The success alert base
+ * @csspart successalert-icon - The success alert icon
  */
 export class FormMessage {
   constructor() {

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

@@ -8,6 +8,10 @@ import { getProps } from "../../utils/utils";
  * @slots [{"name":"","title":"Primary Column Content"},{"name":"secondary-column","title":"Secondary Column Content"}]
  * @example Two Column Hero Layout - <sqm-hero background="https://images.unsplash.com/photo-1599676821464-3555954838dc?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=1939&amp;q=80" min-height="0" columns="2" padding-size="large" wrap-direction="wrap" secondary-background="lightgrey"><h1>Primary Column Content</h1><h1 slot="secondary-column">Secondary Column Content</h1></sqm-hero>
  * @exampleGroup Layout
+ * @csspart sqm-single-col - The single-column container
+ * @csspart sqm-two-col-container - The two-column container
+ * @csspart sqm-two-col-primary-col - The primary column
+ * @csspart sqm-two-col-secondary-col - The secondary column
  */
 export class Hero {
   constructor() {

package/dist/collection/components/sqm-hero-image/sqm-hero-image.js

@@ -9,6 +9,14 @@ import { HeroImageView } from "./sqm-hero-image-view";
  * @exampleGroup Common Components
  * @example Two Column Hero Image - <sqm-hero-image image-url="https://res.cloudinary.com/saasquatch/image/upload/v1644000275/squatch-assets/yr6ER3R.png" header="MyCompany Rewards" description="Refer a friend and earn up to $1200 in rewards" layout="columns" image-pos="right"></sqm-hero-image>
  * @example Overlay Hero Image - <sqm-hero-image image-url="https://res.cloudinary.com/saasquatch/image/upload/v1644000275/squatch-assets/yr6ER3R.png" header="MyCompany Rewards" description="Refer a friend and earn up to $1200 in rewards" layout="overlay" image-pos="center" button-link="https://www.example.com" button-new-tab button-text="Earn!" image-percentage="45" overlay-opacity=".5" padding-image="small" padding-text="xxxx-large"></sqm-hero-image>
+ * @csspart sqm-overlay - The image overlay
+ * @csspart sqm-columns-image - The image column
+ * @csspart sqm-columns-text-area - The text column
+ * @csspart sqm-columns-header - The header in the text column
+ * @csspart sqm-columns-description - The description in the text column
+ * @csspart primarybutton-base - The primary button base
+ * @csspart secondarybutton-base - The secondary button base
+ * @csspart sqm-hero-image-button - The hero image button
  */
 export class HeroImage {
   constructor() {

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

@@ -6,6 +6,7 @@ import { ImageView } from "./sqm-image-view";
  * @validParents ["sqm-brand","div","sqm-portal-container","sqm-divided-layout","sqm-titled-section", "sqb-program-section", "sqb-conditional-section", "sqm-tab"]
  * @exampleGroup Common Components
  * @example Image - <sqm-image image-url="https://res.cloudinary.com/saasquatch/image/upload/v1644000259/squatch-assets/tn47wOj.png" alignment="center"></sqm-image>
+ * @csspart sqm-image - The image element
  */
 export class Image {
   constructor() {

package/dist/collection/components/sqm-input-field/sqm-input-field.js

@@ -11,6 +11,8 @@ import { useInputField } from "./useInputField";
  * @validParents ["sqm-portal-register","sqm-portal-registration-form", "sqm-portal-google-registration-form"]
  * @exampleGroup Microsite Components
  * @example Form Input Field - <sqm-input-field input-label="Field Label" field-type="text" error-message="Cannot be empty"></sqm-input-field>
+ * @csspart input-label - The input label
+ * @csspart input-base - The input base
  */
 export class InputField {
   constructor() {

package/dist/collection/components/sqm-instant-access-registration/sqm-instant-access-registration.js

@@ -11,6 +11,10 @@ import { useInstantAccessRegistration } from "./useInstantAccessRegistration";
  * @exampleGroup Instant Access
  * @example Advocate Registration - <sqm-instant-access-registration></sqm-instant-access-registration>
  * @slots [{"name":"top","title":"Top Content"},{"name":"bottom","title":"Bottom Content"}]
+ * @csspart erroralert-icon - The error alert icon
+ * @csspart input-label - The input label
+ * @csspart input-base - The input base
+ * @csspart primarybutton-base - The primary button base
  */
 export class InstantAccessRegistration {
   constructor() {

package/dist/collection/components/sqm-lead-form/sqm-lead-form.js

@@ -8,6 +8,13 @@ import { useLeadForm } from "./useLeadForm";
  * @uiName Lead Form
  * @canvasRenderer always-replace
  * @slots [{"name":"formData","title":"Additional Fields"}]
+ * @csspart successalert-text - The success message element
+ * @csspart alert-title - The alert title
+ * @csspart alert-description - The alert description
+ * @csspart success-icon - The success alert icon
+ * @csspart input-label - The input label
+ * @csspart input-base - The input base
+ * @csspart primarybutton-base - The primary button base
  */
 export class LeadForm {
   constructor() {

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

@@ -16,6 +16,7 @@ import { useLeaderboard } from "./useLeaderboard";
  * @example Points Earned - <sqm-leaderboard usersheading="Name" rank-suffix="{rank, selectordinal, one {#st} two {#nd} few {#rd} other {#th}}" statsheading="Points" rank-type="rank" leaderboard-type="topPointEarners" rankheading="Rank" show-rank="true"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_leaderboard2.png" empty-state-header="View your rank in the leaderboard" empty-state-text="Be the first to refer a friend and reach the top of the leaderboard" ></sqm-empty></sqm-leaderboard>
  * @example Anonymous Leaderboard - <div style="display: flex; align-items: flex-start; justify-content: center; width: 100%; gap: 50px;"><div style="display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; max-width: 30%;"><sqm-image width="70%" alignment="center" image-url="https://res.cloudinary.com/saasquatch-staging/image/upload/v1729728469/Leaderboard_image_z87lsm.png"></sqm-image><h2 style="margin: auto;">Top Performers</h2><p style="margin: 0; text-align: center;">The leaderboard highlights the top performers in real-time. Stay motivated, stay competitive!</p></div><sqm-leaderboard width="300px" usersheading="Referrer" rank-suffix="{rank, selectordinal, one {#st} two {#nd} few {#rd} other {#th}}" statsheading="Referrals" rank-type="rank" leaderboard-type="topStartedReferrers" rankheading="Rank" show-rank="true" hide-names="true" hide-viewer="true"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_leaderboard2.png" empty-state-header="View your rank in the leaderboard" empty-state-text="Be the first to refer a friend and reach the top of the leaderboard"></sqm-empty></sqm-leaderboard></div>
  * @featureTooltip <div>Motivate your participants by gamifying your program. Contact <a href="mailto:saasquatch-support%40impact.com?subject=Next steps for Leaderboards feature&body=Hi Support Team, %0D%0A%0D%0A I am interested in learning more about how Leaderboards can support the growth of our referral program. Please connect me with a program strategy manager to discuss this feature further, and determine the next steps.%0D%0A%0D%0A%0D%0AThank you,%0D%0A[Add your name here]">Support</a> to upgrade your plan and add a leaderboard.</div>
+ * @csspart sqm-table - The leaderboard table
  */
 export class Leaderboard {
   constructor() {

package/dist/collection/components/sqm-logout-current-user/sqm-logout-current-user.js

@@ -11,6 +11,7 @@ import { getProps } from "../../utils/utils";
  * @compatibility Built for instant access
  * @validParents ["sqm-portal-container","template", "sqm-referred-registration", "sqb-auth-template-switch", "div","sqm-divided-layout","template","sqm-tab","sqb-program-section","sqb-conditional-section"]
  * @example Sign out current user - <sqm-logout-current-user user-identification-text="{email}" switch-user-link="#" switch-user-text="not you?"></sqm-logout-current-user>
+ * @csspart sqm-link - The logout link element
  */
 export class LogoutCurrentUser {
   constructor() {

package/dist/collection/components/sqm-name-fields/sqm-name-fields.js

@@ -9,6 +9,8 @@ import { useNameFields } from "./useNameFields";
  * @validParents ["sqm-portal-register","sqm-portal-registration-form", "sqm-portal-google-registration-form"]
  * @exampleGroup Microsite Components
  * @example Form Name Fields - <sqm-name-fields first-name-label="First Name" last-name-label="Last Name"></sqm-name-fields>
+ * @csspart input-label - The input label
+ * @csspart input-base - The input base
  */
 export class NameFields {
   constructor() {

package/dist/collection/components/sqm-navigation-menu/sqm-navigation-menu.js

@@ -8,6 +8,7 @@ import deepmerge from "deepmerge";
 /**
  * @uiName Navigation Menu
  * @validParents ["sqm-portal-container","div","sqm-brand","sqm-divided-layout"]
+ * @csspart dropdownbutton-base - The dropdown button base
  */
 export class NavigationMenu {
   constructor() {

package/dist/collection/components/sqm-navigation-sidebar/sqm-navigation-sidebar.js

@@ -9,6 +9,7 @@ import deepmerge from "deepmerge";
  * @validParents ["div","sqm-divided-layout","template","sqm-portal-container","sqm-brand"]
  * @validChildren ["sqm-navigation-sidebar-item"]
  * @slots [{"name":"", "title":"Sidebar Content"}]
+ * @csspart sqm-items-container - The navigation items container
  */
 export class NavigationSidebar {
   constructor() {

package/dist/collection/components/sqm-navigation-sidebar-item/sqm-navigation-sidebar-item.js

@@ -10,6 +10,8 @@ import { useNavigationSidebarItem } from "./useNavigationSidebarItem";
  * @validParents ["sqm-navigation-sidebar"]
  * @exampleGroup Microsite Components
  * @example Sidebar Item - <sqm-navigation-sidebar-item label="Sidebar Item" icon="house"></sqm-navigation-sidebar-item>
+ * @csspart sqm-link - The navigation link element
+ * @csspart sqm-label - The navigation label
  */
 export class NavigationSidebarItem {
   constructor() {

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

@@ -9,6 +9,9 @@ import { PaginationView } from "./sqm-pagination-view";
 import { usePagination } from "./usePagination";
 /**
  * @uiName Pagination
+ * @csspart sqm-pagination-button - A pagination button
+ * @csspart primarybutton-base - The primary button base
+ * @csspart secondarybutton-base - The secondary button base
  */
 export class Pagination {
   constructor() {

package/dist/collection/components/sqm-partner-info-modal/sqm-partner-info-modal-view.js

@@ -85,7 +85,7 @@ export function PartnerInfoModalContentView(props) {
     id: "supportDescriptionExistingPartner",
     defaultMessage: text.supportDescriptionExistingPartner,
   }, {
-    supportLink: (h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+    supportLink: (h("a", { target: "_blank", href: `mailto:advocate-payment-support@impact.com` }, text.supportLink)),
   });
   const description = states.isExistingPartner ? (h("span", { class: sheet.classes.DescriptionContainer },
     h("p", null, text.descriptionExistingPartner),

package/dist/collection/components/sqm-partner-info-modal/sqm-partner-info-modal.js

@@ -12,6 +12,11 @@ import { usePartnerInfoModal, } from "./usePartnerInfoModal";
  * @validParents ["sqm-portal-container", "sqm-portal-frame", "div", "sqm-divided-layout", "sqb-program-section", "sqb-conditional-section"]
  * @example Partner Info Modal - <sqm-partner-info-modal></sqm-partner-info-modal>
  * @hidden
+ * @csspart alert-description - The error description
+ * @csspart input-label - The input label
+ * @csspart input-base - The input base
+ * @csspart select-menu - The select menu
+ * @csspart primarybutton-base - The primary button base
  */
 export class PartnerInfoModal {
   constructor() {

package/dist/collection/components/sqm-password-field/sqm-password-field.js

@@ -12,6 +12,8 @@ import { usePasswordField, } from "./usePasswordField";
  * @validParents ["sqm-portal-register","sqm-portal-registration-form", "sqm-portal-google-registration-form"]
  * @exampleGroup Microsite Components
  * @example Form Password Field - <sqm-password-field field-label="Password"></sqm-password-field>
+ * @csspart input-label - The input label
+ * @csspart input-base - The input base
  */
 export class PortalPasswordField {
   constructor() {