@saasquatch/mint-components 2.2.0-6 → 2.2.0-8

package/dist/collection/components/sqm-share-link/useShareLink.js

@@ -1,16 +1,15 @@
-import { useEngagementMedium, useMutation, useParentValue, useProgramId, useQuery, useUserIdentity, } from "@saasquatch/component-boilerplate";
-import { useState } from "@saasquatch/universal-hooks";
+import { useEngagementMedium, useLazyQuery, useMutation, useParentValue, useProgramId, useQuery, useRefreshDispatcher, useUserIdentity, } from "@saasquatch/component-boilerplate";
+import { useRef, useState } from "@saasquatch/universal-hooks";
 import { gql } from "graphql-request";
 import { REFERRAL_CODES_NAMESPACE, SET_CODE_COPIED, } from "../sqm-referral-codes/useReferralCodes";
+const MAX_EDITS = 5;
+const CHARACTER_LIMIT = 15;
+const MIN_CHARACTERS = 3;
 const MessageLinkQuery = gql `
-  query ($programId: ID, $engagementMedium: UserEngagementMedium!) {
+  query ($programId: ID) {
     user: viewer {
       ... on User {
-        shareLink(
-          programId: $programId
-          engagementMedium: $engagementMedium
-          shareMedium: DIRECT
-        )
+        shareLink(programId: $programId)
       }
     }
   }
@@ -20,19 +19,115 @@ const WIDGET_ENGAGEMENT_EVENT = gql `
     createUserAnalyticsEvent(eventMeta: $eventMeta)
   }
 `;
+const ADD_SHARE_LINK_CODE = gql `
+  mutation ($addShareLinkCodeInput: AddShareLinkCodeInput!) {
+    addShareLinkCode(addShareLinkCodeInput: $addShareLinkCodeInput) {
+      linkCode {
+        linkCode
+        shortUrl
+        referralCode {
+          code
+        }
+      }
+    }
+  }
+`;
+const VALIDATE_LINK_CODE = gql `
+  query validateLinkCode($linkCode: String!) {
+    validateLinkCode(linkCode: $linkCode) {
+      valid
+      invalidReason
+    }
+  }
+`;
+const GET_LINK_DOMAIN = gql `
+  query getLinkDomain {
+    tenantSettings {
+      primaryLinkDomain {
+        host
+      }
+    }
+  }
+`;
+const SHARE_LINK_EDIT_COUNT = gql `
+  query shareLinkEditCount {
+    viewer {
+      ... on User {
+        shareLinkCodes {
+          totalCount
+          data {
+            isVanity
+          }
+        }
+      }
+    }
+  }
+`;
+function parseShareUrl(url) {
+  try {
+    const parsed = new URL(url);
+    return {
+      url: parsed.origin + parsed.pathname,
+      domain: parsed.origin + "/",
+      path: parsed.pathname.slice(1),
+    };
+  }
+  catch {
+    return { url, domain: url, path: "" };
+  }
+}
 export function useShareLink(props) {
-  var _a, _b;
+  var _a, _b, _c, _d, _e, _f, _g;
   const { programId = useProgramId() } = props;
   const user = useUserIdentity();
   const engagementMedium = useEngagementMedium();
   const contextData = useParentValue(REFERRAL_CODES_NAMESPACE);
-  const { data } = useQuery(MessageLinkQuery, { programId, engagementMedium }, !(user === null || user === void 0 ? void 0 : user.jwt) || !!props.linkOverride || (contextData === null || contextData === void 0 ? void 0 : contextData.shareLink) !== undefined);
+  const { data, refetch } = useQuery(MessageLinkQuery, { programId }, !(user === null || user === void 0 ? void 0 : user.jwt) || !!props.linkOverride || (contextData === null || contextData === void 0 ? void 0 : contextData.shareLink) !== undefined);
   const [sendLoadEvent] = useMutation(WIDGET_ENGAGEMENT_EVENT);
-  const [setCopied, copiedRes] = useMutation(SET_CODE_COPIED);
-  const copyString = (_b = ((contextData === null || contextData === void 0 ? void 0 : contextData.shareLink) || ((_a = data === null || data === void 0 ? void 0 : data.user) === null || _a === void 0 ? void 0 : _a.shareLink))) !== null && _b !== void 0 ? _b : 
+  const [setCopied] = useMutation(SET_CODE_COPIED);
+  const [addShareLinkCode, { loading: isSaving }] = useMutation(ADD_SHARE_LINK_CODE);
+  const [validateLinkCode] = useLazyQuery(VALIDATE_LINK_CODE);
+  const { refresh } = useRefreshDispatcher();
+  const { data: linkDomainData } = useQuery(GET_LINK_DOMAIN, {}, !(user === null || user === void 0 ? void 0 : user.jwt) || !props.allowCustomization);
+  const { data: editCountData, refetch: refetchEditCount } = useQuery(SHARE_LINK_EDIT_COUNT, {}, !(user === null || user === void 0 ? void 0 : user.jwt) || !props.allowCustomization);
+  const { url: copyString, domain: domainPrefix, path: pathSuffix, } = parseShareUrl((_b = ((contextData === null || contextData === void 0 ? void 0 : contextData.shareLink) || ((_a = data === null || data === void 0 ? void 0 : data.user) === null || _a === void 0 ? void 0 : _a.shareLink))) !== null && _b !== void 0 ? _b : 
   // Shown during loading
-  "...";
+  "...");
   const [open, setOpen] = useState(false);
+  const [isEditing, setIsEditing] = useState(false);
+  const [editValue, setEditValue] = useState("");
+  const [validationError, setValidationError] = useState(null);
+  const [isValidating, setIsValidating] = useState(false);
+  const debounceTimerRef = useRef(undefined);
+  const latestValidationValueRef = useRef("");
+  const hasPrimaryLinkDomain = ((_c = linkDomainData === null || linkDomainData === void 0 ? void 0 : linkDomainData.tenantSettings) === null || _c === void 0 ? void 0 : _c.primaryLinkDomain) != null;
+  const customizeDisabled = !hasPrimaryLinkDomain;
+  const vanityCount = (_g = (_f = (_e = (_d = editCountData === null || editCountData === void 0 ? void 0 : editCountData.viewer) === null || _d === void 0 ? void 0 : _d.shareLinkCodes) === null || _e === void 0 ? void 0 : _e.data) === null || _f === void 0 ? void 0 : _f.filter((code) => code.isVanity).length) !== null && _g !== void 0 ? _g : 0;
+  const editCount = vanityCount;
+  const editsRemaining = Math.max(0, MAX_EDITS - editCount);
+  const limitReached = editsRemaining <= 0;
+  function mapErrorCodeToInfo(errorCode) {
+    if (!errorCode)
+      return null;
+    const errorMap = {
+      EXISTING_CODE_CONFLICT: {
+        code: "EXISTING_CODE_CONFLICT",
+        title: props.linkTakenErrorTitle,
+        description: props.linkTakenErrorDescription,
+      },
+      INVALID_CHARACTER: {
+        code: "INVALID_CHARACTER",
+        title: props.invalidCharactersErrorTitle,
+        description: props.invalidCharactersErrorDescription,
+      },
+      BLOCKED_WORD: {
+        code: "BLOCKED_WORD",
+        title: props.restrictedWordsErrorTitle,
+        description: props.restrictedWordsErrorDescription,
+      },
+    };
+    return errorMap[errorCode];
+  }
   async function onClick() {
     if (contextData) {
       await setCopied({ referralCode: contextData.referralCode });
@@ -56,5 +151,123 @@ export function useShareLink(props) {
       },
     });
   }
-  return { ...props, onClick, open, copyString: copyString };
+  function onCustomizeClick() {
+    if (limitReached || customizeDisabled)
+      return;
+    setIsEditing(true);
+    setEditValue(editCount === 0 ? "" : pathSuffix);
+    setValidationError(null);
+  }
+  function onEditValueChange(value) {
+    const trimmed = value.slice(0, CHARACTER_LIMIT);
+    setEditValue(trimmed);
+    setValidationError(null);
+    latestValidationValueRef.current = trimmed;
+    if (debounceTimerRef.current)
+      clearTimeout(debounceTimerRef.current);
+    if (!trimmed || trimmed.length < MIN_CHARACTERS) {
+      setIsValidating(false);
+      return;
+    }
+    setIsValidating(true);
+    debounceTimerRef.current = setTimeout(async () => {
+      var _a, _b;
+      const requestedValue = trimmed;
+      try {
+        const result = await validateLinkCode({ linkCode: requestedValue });
+        // Discard stale responses if the user has continued typing
+        if (latestValidationValueRef.current !== requestedValue)
+          return;
+        if (!((_a = result === null || result === void 0 ? void 0 : result.validateLinkCode) === null || _a === void 0 ? void 0 : _a.valid)) {
+          const reason = (_b = result === null || result === void 0 ? void 0 : result.validateLinkCode) === null || _b === void 0 ? void 0 : _b.invalidReason;
+          setValidationError(mapErrorCodeToInfo(reason));
+        }
+      }
+      catch {
+        // Validation query failed — don't block the user
+        if (latestValidationValueRef.current !== requestedValue)
+          return;
+      }
+      if (latestValidationValueRef.current === requestedValue) {
+        setIsValidating(false);
+      }
+    }, 500);
+  }
+  async function onSave() {
+    var _a, _b;
+    if (!editValue ||
+      editValue.length < MIN_CHARACTERS ||
+      validationError ||
+      isValidating)
+      return;
+    try {
+      await addShareLinkCode({
+        addShareLinkCodeInput: {
+          userId: user === null || user === void 0 ? void 0 : user.id,
+          accountId: user === null || user === void 0 ? void 0 : user.accountId,
+          programId,
+          linkCode: editValue,
+          makeShareLinkCodePrimaryForReferralCode: true,
+        },
+      });
+      setIsEditing(false);
+      await Promise.all([refetch(), refetchEditCount()]);
+      refresh();
+    }
+    catch (e) {
+      const errorCode = (_a = e === null || e === void 0 ? void 0 : e.extensions) === null || _a === void 0 ? void 0 : _a.code;
+      setValidationError((_b = mapErrorCodeToInfo(errorCode)) !== null && _b !== void 0 ? _b : {
+        code: null,
+        title: props.saveErrorTitle,
+        description: (e === null || e === void 0 ? void 0 : e.message) || props.saveErrorDescription,
+      });
+    }
+  }
+  function onCancel() {
+    setIsEditing(false);
+    setEditValue("");
+    setValidationError(null);
+    setIsValidating(false);
+    latestValidationValueRef.current = "";
+    if (debounceTimerRef.current)
+      clearTimeout(debounceTimerRef.current);
+  }
+  return {
+    copyTextViewProps: {
+      ...props,
+      onClick,
+      open,
+      copyString,
+    },
+    minCharactersText: props.minCharactersText,
+    allowCustomization: props.allowCustomization,
+    customizeLinkLabel: props.customizeLinkButtonLabel,
+    saveLabelText: props.saveLabelText,
+    savingLabelText: props.savingLabelText,
+    cancelLabelText: props.cancelLabelText,
+    editLabelText: props.editLabelText,
+    charactersRemainingText: props.charactersRemainingText,
+    validatingLabelText: props.validatingLabelText,
+    isEditing,
+    editValue,
+    domainPrefix,
+    editsRemaining,
+    maxEdits: MAX_EDITS,
+    limitReached,
+    validationError,
+    isValidating,
+    isSaving,
+    characterLimit: CHARACTER_LIMIT,
+    minCharacters: MIN_CHARACTERS,
+    charactersRemaining: CHARACTER_LIMIT - editValue.length,
+    editLimitText: props.editLimitText,
+    editLimitReachedText: props.editLimitReachedText,
+    supportLinkText: props.supportLinkText,
+    customizeDisabled,
+    customizeDisabledTooltip: props.customizeDisabledTooltip,
+    onCustomizeClick,
+    onEditValueChange,
+    onSave,
+    onCancel,
+  };
 }

package/dist/collection/components/sqm-text-span/sqm-text-span-view.js

@@ -50,7 +50,7 @@ export function TextSpanView(props, children) {
       display: inline;
     }
   `;
-  return (h("span", { class: sheet.classes[type], part: "sqm-text-span-base" },
+  return (h("span", { class: sheet.classes[type], part: "sqm-text-span" },
     h("style", { type: "text/css" },
       vanillaStyle,
       styleString),

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

@@ -14,6 +14,7 @@ export const GET_USER = gql `
     user: viewer {
       ... on User {
         id
+        accountId
         firstName
         lastName
         email

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

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 import { intl } from "../../../global/global";
 export function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64, _65, _66, _67, _68, _69, _70;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64, _65, _66, _67, _68, _69, _70, _71, _72, _73, _74, _75, _76;
   const { errors, ...formState } = props.states.formState;
   return {
     0: {
@@ -234,5 +234,23 @@ export function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
         h("sl-menu-item", { value: "INDIVIDUAL" }, props.text.individualSelectItemLabel),
         h("sl-menu-item", { value: "FOREIGN" }, props.text.foreignSelectItemLabel))),
     },
+    15: {
+      input: (h("sl-input", Object.assign({ required: true, label: props.text.branchNameLabel, name: "/branchName", id: "branchName", key: "branchName", type: "text" }, (((_71 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _71 === void 0 ? void 0 : _71.branchName) && {
+        class: "error-input",
+        helpText: getValidationErrorMessage({
+          type: (_73 = (_72 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _72 === void 0 ? void 0 : _72.branchName) === null || _73 === void 0 ? void 0 : _73.type,
+          label: props.text.branchNameLabel,
+        }),
+      })))),
+    },
+    16: {
+      input: (h("sl-input", Object.assign({ required: true, label: props.text.classificationCodeLabel, name: "/classificationCode", id: "classificationCode", key: "classificationCode", type: "text" }, (((_74 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _74 === void 0 ? void 0 : _74.classificationCode) && {
+        class: "error-input",
+        helpText: getValidationErrorMessage({
+          type: (_76 = (_75 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _75 === void 0 ? void 0 : _75.classificationCode) === null || _76 === void 0 ? void 0 : _76.type,
+          label: props.text.classificationCodeLabel,
+        }),
+      })))),
+    },
   };
 }

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

@@ -168,11 +168,19 @@ export class BankingInfoForm {
      * @uiName Branch code field label
      */
     this.branchCodeLabel = "Branch code";
+    /**
+     * @uiName Branch name field label
+     */
+    this.branchNameLabel = "Branch name";
     /**
      * Label text for the classification input field
      * @uiName Classification field label
      */
     this.classificationLabel = "Classification";
+    /**
+     * @uiName Classification code field label
+     */
+    this.classificationCodeLabel = "KBE code";
     /**
      * @uiName Taxpayer ID field label
      */
@@ -1368,6 +1376,27 @@ export class BankingInfoForm {
       "reflect": false,
       "defaultValue": "\"Branch code\""
     },
+    "branchNameLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Branch name field label",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "branch-name-label",
+      "reflect": false,
+      "defaultValue": "\"Branch name\""
+    },
     "classificationLabel": {
       "type": "string",
       "mutable": false,
@@ -1389,6 +1418,27 @@ export class BankingInfoForm {
       "reflect": false,
       "defaultValue": "\"Classification\""
     },
+    "classificationCodeLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Classification code field label",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "classification-code-label",
+      "reflect": false,
+      "defaultValue": "\"KBE code\""
+    },
     "taxPayerIdLabel": {
       "type": "string",
       "mutable": false,

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

@@ -65,7 +65,7 @@ export class IndirectTaxForm {
     /**
      * @uiName Indirect tax number field label
      */
-    this.indirectTaxNumber = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}}";
+    this.indirectTaxNumber = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}}";
     /**
      * Displayed to participants registered for QST.
      * @uiName QST number field label
@@ -104,7 +104,7 @@ export class IndirectTaxForm {
     /**
      * @uiName Missing indirect tax number error message
      */
-    this.indirectTaxNumberError = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}} is required";
+    this.indirectTaxNumberError = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}} is required";
     /**
      * Placeholder text displayed in the country search dropdown
      * @uiName Country field placeholder text
@@ -457,7 +457,7 @@ export class IndirectTaxForm {
       },
       "attribute": "indirect-tax-number",
       "reflect": false,
-      "defaultValue": "\"{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}}\""
+      "defaultValue": "\"{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}}\""
     },
     "qstNumber": {
       "type": "string",
@@ -631,7 +631,7 @@ export class IndirectTaxForm {
       },
       "attribute": "indirect-tax-number-error",
       "reflect": false,
-      "defaultValue": "\"{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}} is required\""
+      "defaultValue": "\"{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}} is required\""
     },
     "searchForCountryText": {
       "type": "string",

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

@@ -15,7 +15,7 @@ export class PayoutDetailsCard {
      * Badge text indicating payout status
      * @uiName Payout badge status text
      */
-    this.statusBadgeText = "{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} }";
+    this.statusBadgeText = "{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} other {Failed}}";
     /**
      * Display participants' payout preference on the payout information card, indicating the balance at which they want to get paid.
      * @uiName Payout schedule by threshold text
@@ -73,7 +73,7 @@ export class PayoutDetailsCard {
       },
       "attribute": "status-badge-text",
       "reflect": false,
-      "defaultValue": "\"{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} }\""
+      "defaultValue": "\"{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} other {Failed}}\""
     },
     "thresholdPayoutText": {
       "type": "string",