@saasquatch/mint-components 2.1.8-26 → 2.1.8-28

package/dist/cjs/useShareLink-94e077a4.js

@@ -0,0 +1,454 @@
+'use strict';
+
+const index = require('./index-fd67d7bc.js');
+const global = require('./global-746daf93.js');
+const domContextHooks_module = require('./dom-context-hooks.module-224e09d4.js');
+const index_module = require('./index.module-c79bd5b0.js');
+const JSS = require('./JSS-518e9b4d.js');
+const useReferralCodes = require('./useReferralCodes-4304f68f.js');
+const copyTextView = require('./copy-text-view-fd17b89a.js');
+
+const vanillaStyle = `
+  :host {
+    display: block;
+    width: 100%;
+  }
+`;
+function ShareLinkView(props) {
+  const { copyTextViewProps, allowCustomization, customizeLinkLabel, saveLabelText, cancelLabelText, isEditing, editValue, domainPrefix, editsRemaining, maxEdits, limitReached, validationError, isValidating, isSaving, characterLimit, minCharacters, charactersRemaining, editLimitText, editLimitReachedText, supportLinkText, customizeDisabled, customizeDisabledTooltip, onCustomizeClick, onEditValueChange, onSave, onCancel, minCharactersText, } = props;
+  const style = {
+    Container: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "var(--sl-spacing-xx-small)",
+      width: "100%",
+    },
+    CustomizeLinkText: {
+      paddingTop: "var(--sl-spacing-xx-small)",
+      margin: "0",
+      fontSize: "var(--sl-font-size-small)",
+      fontWeight: "600",
+      cursor: "pointer",
+      color: "var(--sl-color-neutral-900)",
+      textAlign: "left",
+      "&:hover": {
+        textDecoration: "underline",
+      },
+    },
+    CustomizeLinkDisabled: {
+      paddingTop: "var(--sl-spacing-xx-small)",
+      margin: "0",
+      fontSize: "var(--sl-font-size-small)",
+      fontWeight: "600",
+      color: "var(--sl-color-neutral-400)",
+      cursor: "default",
+      textAlign: "left",
+    },
+    EditContainer: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "var(--sl-spacing-x-small)",
+      width: "100%",
+    },
+    EditInputWrapper: {
+      display: "flex",
+      alignItems: "center",
+      width: "100%",
+      border: "var(--sqm-border-thickness, 1px) solid var(--sqm-input-border-color, #d1d5db)",
+      borderRadius: "var(--sqm-border-radius-normal, 4px)",
+      background: "var(--sqm-input-background, #fff)",
+      overflow: "hidden",
+      "&:focus-within": {
+        borderColor: "#999999",
+        boxShadow: "0 0 0 var(--sl-focus-ring-width) var(--sl-input-focus-ring-color)",
+      },
+    },
+    DomainPrefix: {
+      padding: "0 0 0 var(--sl-spacing-medium)",
+      fontSize: "var(--sl-font-size-medium)",
+      color: "var(--sl-color-neutral-500)",
+      whiteSpace: "nowrap",
+      userSelect: "none",
+      lineHeight: "var(--sl-input-height-medium)",
+    },
+    EditInput: {
+      flex: "1",
+      border: "none",
+      outline: "none",
+      padding: "0 var(--sl-spacing-medium) 0 0",
+      fontSize: "var(--sl-font-size-medium)",
+      fontFamily: "var(--sl-font-sans)",
+      color: "var(--sl-input-color)",
+      background: "transparent",
+      lineHeight: "var(--sl-input-height-medium)",
+      minWidth: "0",
+    },
+    EditLabel: {
+      margin: "0",
+      fontSize: "var(--sl-font-size-small)",
+      color: "var(--sl-color-neutral-500)",
+    },
+    HelperText: {
+      paddingTop: "var(--sl-spacing-xx-small)",
+      margin: "0",
+      fontSize: "var(--sl-font-size-small)",
+      color: "var(--sl-color-neutral-500)",
+    },
+    ErrorText: {
+      margin: "0",
+      fontSize: "var(--sl-font-size-small)",
+      color: "var(--sqm-danger-color-text, #dc2626)",
+    },
+    ActionRow: {
+      display: "flex",
+      gap: "var(--sl-spacing-medium)",
+      alignItems: "center",
+    },
+    SaveButton: {
+      cursor: "pointer",
+      fontFamily: "var(--sl-font-sans)",
+      fontSize: "var(--sl-font-size-small)",
+      fontWeight: "600",
+      padding: "var(--sl-spacing-x-small) var(--sl-spacing-medium)",
+      borderRadius: "var(--sqm-border-radius-normal, 4px)",
+      border: "1px solid var(--sl-color-neutral-900)",
+      background: "var(--sl-color-neutral-900)",
+      color: "#fff",
+      "&:disabled": {
+        opacity: "0.5",
+        cursor: "default",
+      },
+    },
+    CancelButton: {
+      margin: "0",
+      fontSize: "var(--sl-font-size-small)",
+      fontWeight: "600",
+      cursor: "pointer",
+      background: "none",
+      border: "none",
+      fontFamily: "var(--sl-font-sans)",
+      color: "var(--sl-color-neutral-500)",
+      "&::part(label)": {
+        padding: "0",
+      },
+    },
+    LimitReachedContainer: {
+      display: "flex",
+      alignItems: "center",
+      gap: "var(--sl-spacing-x-small)",
+    },
+  };
+  const sheet = JSS.createStyleSheet(style);
+  const styleString = sheet.toString();
+  const errorMessageType = (validationError === null || validationError === void 0 ? void 0 : validationError.code) === "EXISTING_CODE_CONFLICT" ? "info" : "warning";
+  const showCharactersRemaining = charactersRemaining <= 14;
+  const editLimitMessage = global.intl.formatMessage({
+    id: "editLimitText",
+    defaultMessage: editLimitText,
+  }, { editsRemaining });
+  // Editing state
+  if (isEditing) {
+    return (index.h("div", { class: sheet.classes.Container },
+      index.h("style", { type: "text/css" },
+        styleString,
+        vanillaStyle),
+      index.h("p", { class: sheet.classes.EditLabel }, "Enter your link"),
+      index.h("div", { class: sheet.classes.EditInputWrapper },
+        index.h("span", { class: sheet.classes.DomainPrefix }, domainPrefix),
+        index.h("input", { class: sheet.classes.EditInput, type: "text", value: editValue, onInput: (e) => onEditValueChange(e.target.value), onKeyDown: (e) => {
+            if (e.key === "/" || e.key === "@")
+              e.preventDefault();
+          }, disabled: isSaving, maxLength: characterLimit })),
+      index.h("p", { class: sheet.classes.HelperText },
+        editLimitMessage,
+        " ",
+        charactersRemaining > 12 && minCharactersText,
+        showCharactersRemaining &&
+          ` Characters remaining: ${charactersRemaining}`),
+      validationError && (index.h("sqm-form-message", { type: errorMessageType, style: { paddingBottom: "var(--sl-spacing-xx-small)" } },
+        index.h("p", { part: "alert-title" }, validationError.title),
+        validationError.description)),
+      isValidating && index.h("p", { class: sheet.classes.HelperText }, "Validating..."),
+      index.h("div", { class: sheet.classes.ActionRow },
+        index.h("button", { class: sheet.classes.SaveButton, onClick: onSave, disabled: isSaving ||
+            isValidating ||
+            !!validationError ||
+            !editValue ||
+            editValue.length < minCharacters }, isSaving ? "Saving..." : saveLabelText),
+        index.h("sl-button", { type: "text", class: sheet.classes.CancelButton, onClick: onCancel, disabled: isSaving }, cancelLabelText))));
+  }
+  // Default / Customized / Limit reached states
+  return (index.h("div", { class: sheet.classes.Container },
+    index.h("style", { type: "text/css" },
+      styleString,
+      vanillaStyle),
+    index.h(copyTextView.CopyTextView, Object.assign({}, copyTextViewProps)),
+    allowCustomization &&
+      (customizeDisabled ? (index.h("sl-tooltip", { content: customizeDisabledTooltip, placement: "top", style: { display: "inline-block", width: "fit-content" } },
+        index.h("p", { class: sheet.classes.CustomizeLinkDisabled }, customizeLinkLabel))) : (index.h("div", { class: sheet.classes.LimitReachedContainer },
+        index.h("p", { class: limitReached
+            ? sheet.classes.CustomizeLinkDisabled
+            : sheet.classes.CustomizeLinkText, onClick: limitReached ? undefined : onCustomizeClick }, customizeLinkLabel),
+        allowCustomization && limitReached && (index.h("p", { class: sheet.classes.HelperText }, global.intl.formatMessage({
+          id: "editLimitReached",
+          defaultMessage: editLimitReachedText,
+        }, {
+          supportLink: (index.h("a", { target: "_blank", href: "https://help.impact.com/other/readme/get-help-and-support" }, supportLinkText)),
+        }))))))));
+}
+
+const MAX_EDITS = 5;
+const CHARACTER_LIMIT = 15;
+const MIN_CHARACTERS = 3;
+const MessageLinkQuery = index_module.dist.gql `
+  query ($programId: ID) {
+    user: viewer {
+      ... on User {
+        shareLink(programId: $programId)
+      }
+    }
+  }
+`;
+const WIDGET_ENGAGEMENT_EVENT = index_module.dist.gql `
+  mutation loadEvent($eventMeta: UserAnalyticsEvent!) {
+    createUserAnalyticsEvent(eventMeta: $eventMeta)
+  }
+`;
+const ADD_SHARE_LINK_CODE = index_module.dist.gql `
+  mutation ($addShareLinkCodeInput: AddShareLinkCodeInput!) {
+    addShareLinkCode(addShareLinkCodeInput: $addShareLinkCodeInput) {
+      linkCode {
+        linkCode
+        shortUrl
+        referralCode {
+          code
+        }
+      }
+    }
+  }
+`;
+const VALIDATE_LINK_CODE = index_module.dist.gql `
+  query validateLinkCode($linkCode: String!) {
+    validateLinkCode(linkCode: $linkCode) {
+      valid
+      invalidReason
+    }
+  }
+`;
+const GET_LINK_DOMAIN = index_module.dist.gql `
+  query getLinkDomain {
+    tenantSettings {
+      primaryLinkDomain {
+        host
+      }
+    }
+  }
+`;
+const SHARE_LINK_EDIT_COUNT = index_module.dist.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: "" };
+  }
+}
+function useShareLink(props) {
+  var _a, _b, _c, _d, _e, _f, _g;
+  const { programId = index_module.H() } = props;
+  const user = index_module.J();
+  const engagementMedium = index_module.B();
+  const contextData = index_module.Fn(useReferralCodes.REFERRAL_CODES_NAMESPACE);
+  const { data, refetch } = index_module.wn(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] = index_module.$e(WIDGET_ENGAGEMENT_EVENT);
+  const [setCopied] = index_module.$e(useReferralCodes.SET_CODE_COPIED);
+  const [addShareLinkCode, { loading: isSaving }] = index_module.$e(ADD_SHARE_LINK_CODE);
+  const [validateLinkCode] = index_module.Xe(VALIDATE_LINK_CODE);
+  const { refresh } = index_module.Qe();
+  const { data: linkDomainData } = index_module.wn(GET_LINK_DOMAIN, {}, !(user === null || user === void 0 ? void 0 : user.jwt) || !props.allowCustomization);
+  const { data: editCountData, refetch: refetchEditCount } = index_module.wn(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] = domContextHooks_module.useState(false);
+  const [isEditing, setIsEditing] = domContextHooks_module.useState(false);
+  const [editValue, setEditValue] = domContextHooks_module.useState("");
+  const [validationError, setValidationError] = domContextHooks_module.useState(null);
+  const [isValidating, setIsValidating] = domContextHooks_module.useState(false);
+  const debounceTimerRef = domContextHooks_module.useRef(undefined);
+  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 });
+      contextData.refresh();
+    }
+    // Should well supported: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard#browser_compatibility
+    // Only if called from a user-initiated event
+    navigator.clipboard.writeText(copyString);
+    setOpen(true);
+    setTimeout(() => setOpen(false), props.tooltiplifespan);
+    sendLoadEvent({
+      eventMeta: {
+        programId,
+        id: user === null || user === void 0 ? void 0 : user.id,
+        accountId: user === null || user === void 0 ? void 0 : user.accountId,
+        type: "USER_REFERRAL_PROGRAM_ENGAGEMENT_EVENT",
+        meta: {
+          engagementMedium,
+          shareMedium: "DIRECT",
+        },
+      },
+    });
+  }
+  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);
+    if (debounceTimerRef.current)
+      clearTimeout(debounceTimerRef.current);
+    if (!trimmed || trimmed.length < MIN_CHARACTERS) {
+      setIsValidating(false);
+      return;
+    }
+    setIsValidating(true);
+    debounceTimerRef.current = setTimeout(async () => {
+      var _a, _b;
+      try {
+        const result = await validateLinkCode({ linkCode: trimmed });
+        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
+      }
+      setIsValidating(false);
+    }, 2000);
+  }
+  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: "Error",
+        description: (e === null || e === void 0 ? void 0 : e.message) || "Failed to save custom link. Please try again.",
+      });
+    }
+  }
+  function onCancel() {
+    setIsEditing(false);
+    setEditValue("");
+    setValidationError(null);
+    setIsValidating(false);
+  }
+  return {
+    copyTextViewProps: {
+      ...props,
+      onClick,
+      open,
+      copyString,
+    },
+    minCharactersText: props.minCharactersText,
+    allowCustomization: props.allowCustomization,
+    customizeLinkLabel: props.customizeLinkButtonLabel,
+    saveLabelText: props.saveLabelText,
+    cancelLabelText: props.cancelLabelText,
+    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,
+  };
+}
+
+exports.ShareLinkView = ShareLinkView;
+exports.useShareLink = useShareLink;

package/dist/collection/components/sqm-share-link/ShareLink.stories.js

@@ -123,6 +123,7 @@ const defaultCustomizeProps = {
   supportLinkText: "Support",
   customizeDisabled: false,
   customizeDisabledTooltip: "Link customization is not available.",
+  minCharactersText: "Minimum 3 characters",
   onCustomizeClick: noopFn,
   onEditValueChange: noopFn,
   onSave: noopFn,

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

@@ -9,7 +9,7 @@ const vanillaStyle = `
   }
 `;
 export function ShareLinkView(props) {
-  const { copyTextViewProps, allowCustomization, customizeLinkLabel, saveLabelText, cancelLabelText, isEditing, editValue, domainPrefix, editsRemaining, maxEdits, limitReached, validationError, isValidating, isSaving, characterLimit, minCharacters, charactersRemaining, editLimitText, editLimitReachedText, supportLinkText, customizeDisabled, customizeDisabledTooltip, onCustomizeClick, onEditValueChange, onSave, onCancel, } = props;
+  const { copyTextViewProps, allowCustomization, customizeLinkLabel, saveLabelText, cancelLabelText, isEditing, editValue, domainPrefix, editsRemaining, maxEdits, limitReached, validationError, isValidating, isSaving, characterLimit, minCharacters, charactersRemaining, editLimitText, editLimitReachedText, supportLinkText, customizeDisabled, customizeDisabledTooltip, onCustomizeClick, onEditValueChange, onSave, onCancel, minCharactersText, } = props;
   const style = {
     Container: {
       display: "flex",
@@ -18,6 +18,7 @@ export function ShareLinkView(props) {
       width: "100%",
     },
     CustomizeLinkText: {
+      paddingTop: "var(--sl-spacing-xx-small)",
       margin: "0",
       fontSize: "var(--sl-font-size-small)",
       fontWeight: "600",
@@ -29,6 +30,7 @@ export function ShareLinkView(props) {
       },
     },
     CustomizeLinkDisabled: {
+      paddingTop: "var(--sl-spacing-xx-small)",
       margin: "0",
       fontSize: "var(--sl-font-size-small)",
       fontWeight: "600",
@@ -81,6 +83,7 @@ export function ShareLinkView(props) {
       color: "var(--sl-color-neutral-500)",
     },
     HelperText: {
+      paddingTop: "var(--sl-spacing-xx-small)",
       margin: "0",
       fontSize: "var(--sl-font-size-small)",
       color: "var(--sl-color-neutral-500)",
@@ -137,7 +140,6 @@ export function ShareLinkView(props) {
     id: "editLimitText",
     defaultMessage: editLimitText,
   }, { editsRemaining });
-  console.log(domainPrefix, "domain prefix");
   // Editing state
   if (isEditing) {
     return (h("div", { class: sheet.classes.Container },
@@ -153,6 +155,8 @@ export function ShareLinkView(props) {
           }, disabled: isSaving, maxLength: characterLimit })),
       h("p", { class: sheet.classes.HelperText },
         editLimitMessage,
+        " ",
+        charactersRemaining > 12 && minCharactersText,
         showCharactersRemaining &&
           ` Characters remaining: ${charactersRemaining}`),
       validationError && (h("sqm-form-message", { type: errorMessageType, style: { paddingBottom: "var(--sl-spacing-xx-small)" } },
@@ -183,7 +187,6 @@ export function ShareLinkView(props) {
           id: "editLimitReached",
           defaultMessage: editLimitReachedText,
         }, {
-          supportLink: (h("a", { target: "_blank", href: "https://help.impact.com/other/readme/get-help-and-support" },
-            h("p", null, supportLinkText))),
+          supportLink: (h("a", { target: "_blank", href: "https://help.impact.com/other/readme/get-help-and-support" }, supportLinkText)),
         }))))))));
 }

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

@@ -112,7 +112,7 @@ export class ShareLink {
      * @uiGroup Customizable Vanity Link
      * @requiredFlavor impact
      */
-    this.editLimitText = "You can edit your link up to {editsRemaining} more times.";
+    this.editLimitText = "You can edit your link up to {editsRemaining} more time(s).";
     /**
      * Description text shown when the link contains invalid special characters.
      *
@@ -179,6 +179,13 @@ export class ShareLink {
      * @requiredFlavor impact
      */
     this.saveLabelText = "Save";
+    /**
+     * @uiName Min characters text
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.minCharactersText = "Minimum 3 characters.";
     /**
      * Display text for the support link in the edit limit reached message
      *
@@ -680,7 +687,7 @@ export class ShareLink {
       },
       "attribute": "edit-limit-text",
       "reflect": false,
-      "defaultValue": "\"You can edit your link up to {editsRemaining} more times.\""
+      "defaultValue": "\"You can edit your link up to {editsRemaining} more time(s).\""
     },
     "invalidCharactersErrorDescription": {
       "type": "string",
@@ -901,6 +908,36 @@ export class ShareLink {
       "reflect": false,
       "defaultValue": "\"Save\""
     },
+    "minCharactersText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [{
+            "text": "Min characters text",
+            "name": "uiName"
+          }, {
+            "text": "string",
+            "name": "uiType"
+          }, {
+            "text": "Customizable Vanity Link",
+            "name": "uiGroup"
+          }, {
+            "text": "impact",
+            "name": "requiredFlavor"
+          }],
+        "text": ""
+      },
+      "attribute": "min-characters-text",
+      "reflect": false,
+      "defaultValue": "\"Minimum 3 characters.\""
+    },
     "supportLinkText": {
       "type": "string",
       "mutable": false,
@@ -936,7 +973,7 @@ export class ShareLink {
       "mutable": false,
       "complexType": {
         "original": "DemoData<ShareLinkViewProps>",
-        "resolved": "{ copyTextViewProps?: CopyTextViewProps; allowCustomization?: boolean; customizeLinkLabel?: string; saveLabelText?: string; cancelLabelText?: string; isEditing?: boolean; editValue?: string; domainPrefix?: string; editsRemaining?: number; maxEdits?: number; limitReached?: boolean; validationError?: ValidationErrorInfo; isValidating?: boolean; isSaving?: boolean; characterLimit?: number; minCharacters?: number; charactersRemaining?: number; editLimitText?: string; editLimitReachedText?: string; supportLinkText?: string; customizeDisabled?: boolean; customizeDisabledTooltip?: string; onCustomizeClick?: () => void; onEditValueChange?: (value: string) => void; onSave?: () => void; onCancel?: () => void; }",
+        "resolved": "{ copyTextViewProps?: CopyTextViewProps; allowCustomization?: boolean; customizeLinkLabel?: string; saveLabelText?: string; cancelLabelText?: string; isEditing?: boolean; editValue?: string; domainPrefix?: string; editsRemaining?: number; maxEdits?: number; limitReached?: boolean; validationError?: ValidationErrorInfo; isValidating?: boolean; isSaving?: boolean; characterLimit?: number; minCharacters?: number; charactersRemaining?: number; editLimitText?: string; editLimitReachedText?: string; minCharactersText?: string; supportLinkText?: string; customizeDisabled?: boolean; customizeDisabledTooltip?: string; onCustomizeClick?: () => void; onEditValueChange?: (value: string) => void; onSave?: () => void; onCancel?: () => void; }",
         "references": {
           "DemoData": {
             "location": "import",
@@ -1025,6 +1062,7 @@ function useDemoShareLink(props) {
     editLimitText: props.editLimitText,
     editLimitReachedText: props.editLimitReachedText,
     supportLinkText: props.supportLinkText,
+    minCharactersText: props.minCharactersText,
     customizeDisabled: false,
     customizeDisabledTooltip: (_a = props.customizeDisabledTooltip) !== null && _a !== void 0 ? _a : "Link customization is not available.",
     onCustomizeClick: () => {

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

@@ -221,7 +221,6 @@ export function useShareLink(props) {
     setValidationError(null);
     setIsValidating(false);
   }
-  console.log(validationError, "validation error state"); // TEMP --- IGNORE ---
   return {
     copyTextViewProps: {
       ...props,
@@ -229,6 +228,7 @@ export function useShareLink(props) {
       open,
       copyString,
     },
+    minCharactersText: props.minCharactersText,
     allowCustomization: props.allowCustomization,
     customizeLinkLabel: props.customizeLinkButtonLabel,
     saveLabelText: props.saveLabelText,