@saasquatch/mint-components 2.1.8-21 → 2.1.8-22

package/dist/cjs/sqm-share-link.cjs.entry.js

@@ -0,0 +1,271 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-fd67d7bc.js');
+require('./global-746daf93.js');
+const domContextHooks_module = require('./dom-context-hooks.module-224e09d4.js');
+const index_module = require('./index.module-c79bd5b0.js');
+require('./GoogleFonts-039d880f.js');
+require('./jss-preset-default.esm-b48f0c33.js');
+require('./JSS-518e9b4d.js');
+require('./mixins-f51b04f1.js');
+const utils = require('./utils-e326d1b5.js');
+const cjs = require('./cjs-2bf512b9.js');
+require('./useReferralCodes-4304f68f.js');
+require('./copy-text-view-fd17b89a.js');
+const useShareLink = require('./useShareLink-1282123e.js');
+
+const ShareLink = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    /**
+     * Shown inside a tooltip after someone has successfully copied the link to their clipboard
+     *
+     * @uiName Tooltip text
+     */
+    this.tooltiptext = "Copied to Clipboard";
+    /**
+     * The number of milliseconds that the tooltip appears for
+     *
+     * @uiName Tooltip lifespan
+     */
+    this.tooltiplifespan = 1000;
+    /**
+     * Change the text alignment
+     *
+     * @uiName Share link alignment
+     * @uiType string
+     * @uiEnum ["left", "center", "right"]
+     * @uiEnumNames ["Left", "Center", "Right"]
+     * @uiGroup Style
+     */
+    this.textAlign = "left";
+    /**
+     * @uiName Copy button label
+     */
+    this.copyButtonLabel = "Copy Link";
+    /**
+     * The type of the button that is used (primary or secondary).
+     * @uiName Button Type
+     * @uiType string
+     * @uiEnum ["primary", "secondary"]
+     * @uiEnumNames ["Primary", "Secondary"]
+     * @uiGroup Style
+     */
+    this.buttonType = "primary";
+    /**
+     * Set the copy button style and placement
+     *
+     * @uiName Button style
+     * @uiType string
+     * @uiEnum ["icon", "button-outside", "button-below"]
+     * @uiEnumNames ["Icon", "Button outside", "Button below"]
+     * @uiGroup Style
+     */
+    this.buttonStyle = "icon";
+    /**
+     * Enable users to customize their referral link
+     *
+     * @uiName Customize URL
+     * @uiType boolean
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.customizeUrl = false;
+    /**
+     * Text shown below the share link input to trigger customization
+     *
+     * @uiName Customize link label
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.customizeLinkLabel = "Customize Link";
+    /**
+     * Text for the save button in editing mode
+     *
+     * @uiName Save button label
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.saveLabelText = "Save";
+    /**
+     * Text for the cancel button in editing mode
+     *
+     * @uiName Cancel button label
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.cancelLabelText = "Cancel";
+    /**
+     * Title text shown when the custom link is already taken
+     *
+     * @uiName Existing code conflict error title
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.existingCodeConflictErrorTitle = "This link is already taken";
+    /**
+     * Description text shown when the custom link is already taken
+     *
+     * @uiName Existing code conflict error description
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.existingCodeConflictErrorDescription = "Try adding numbers, a dash or underscore to create a unique link.";
+    /**
+     * Title text shown when the link contains invalid characters
+     *
+     * @uiName Invalid characters error title
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.invalidCharactersErrorTitle = "Please use only letters, numbers, dashes and underscores";
+    /**
+     * Description text shown when the link contains invalid characters
+     *
+     * @uiName Invalid characters error description
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.invalidCharactersErrorDescription = "Special characters can break the link when sharing.";
+    /**
+     * Title text shown when the link contains profanity
+     *
+     * @uiName Profanity error title
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.profanityErrorTitle = "Please try a different link";
+    /**
+     * Description text shown when the link contains profanity
+     *
+     * @uiName Profanity error description
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.profanityErrorDescription = "This link contains a restricted word.";
+    /**
+     * Text describing the edit limit
+     *
+     * @uiName Edit limit text
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.editLimitText = "You can edit your link up to 5 times.";
+    /**
+     * Message shown when the edit limit has been reached. Use {supportLink} as a placeholder for the support link.
+     *
+     * @uiName Edit limit reached text
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.editLimitReachedText = "5 edit limit reached. To make more changes, please contact {supportLink}.";
+    /**
+     * Display text for the support link in the edit limit reached message
+     *
+     * @uiName Support link text
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.supportLinkText = "Support";
+    /**
+     * Tooltip text shown when link customization is disabled
+     *
+     * @uiName Customize disabled tooltip
+     * @uiType string
+     * @uiGroup Customize Vanity Link
+     * @requiredFlavor impact
+     */
+    this.customizeDisabledTooltip = "Link customization is not available.";
+    domContextHooks_module.h$1(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const thisProps = utils.getProps(this);
+    const props = index_module.isDemo()
+      ? useDemoShareLink(thisProps)
+      : useShareLink.useShareLink(thisProps);
+    return index.h(useShareLink.ShareLinkView, Object.assign({}, props));
+  }
+};
+function useDemoShareLink(props) {
+  var _a;
+  const [open, setOpen] = domContextHooks_module.useState(false);
+  const [isEditing, setIsEditing] = domContextHooks_module.useState(false);
+  const [editValue, setEditValue] = domContextHooks_module.useState("");
+  const copyString = "https://www.example.com/sharelink/abc";
+  const domainPrefix = "https://www.example.com/";
+  const baseProps = {
+    copyTextViewProps: {
+      copyString,
+      tooltiptext: props.tooltiptext,
+      textAlign: props.textAlign,
+      buttonStyle: props.buttonStyle,
+      backgroundColor: props.backgroundColor,
+      textColor: props.textColor,
+      borderRadius: props.borderRadius,
+      buttonType: props.buttonType,
+      copyButtonLabel: props.copyButtonLabel,
+      borderColor: props.borderColor,
+      open,
+      onClick: () => {
+        navigator.clipboard.writeText(copyString);
+        setOpen(true);
+        setTimeout(() => setOpen(false), props.tooltiplifespan);
+      },
+    },
+    customizeUrl: props.customizeUrl,
+    customizeLinkLabel: props.customizeLinkLabel,
+    saveLabelText: props.saveLabelText,
+    cancelLabelText: props.cancelLabelText,
+    isEditing,
+    editValue,
+    domainPrefix,
+    editsRemaining: 5,
+    maxEdits: 5,
+    limitReached: false,
+    validationError: null,
+    isValidating: false,
+    isSaving: false,
+    characterLimit: 15,
+    minCharacters: 3,
+    charactersRemaining: 15 - editValue.length,
+    editLimitText: props.editLimitText,
+    editLimitReachedText: props.editLimitReachedText,
+    supportLinkText: props.supportLinkText,
+    customizeDisabled: false,
+    customizeDisabledTooltip: (_a = props.customizeDisabledTooltip) !== null && _a !== void 0 ? _a : "Link customization is not available.",
+    onCustomizeClick: () => {
+      setIsEditing(true);
+      setEditValue("");
+    },
+    onEditValueChange: (value) => {
+      setEditValue(value);
+    },
+    onSave: () => {
+      setIsEditing(false);
+    },
+    onCancel: () => {
+      setIsEditing(false);
+      setEditValue("");
+    },
+  };
+  return cjs.cjs(baseProps, props.demoData || {}, {
+    arrayMerge: (_, a) => a,
+  });
+}
+
+exports.sqm_share_link = ShareLink;