@saasquatch/mint-components 2.1.11-0 → 2.1.11-1

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

@@ -1,670 +0,0 @@
-import { isDemo } from "@saasquatch/component-boilerplate";
-import { useState, withHooks } from "@saasquatch/stencil-hooks";
-import { Component, Prop, h } from "@stencil/core";
-import deepmerge from "deepmerge";
-import { parseStates } from "../../utils/parseStates";
-import { getProps } from "../../utils/utils";
-import { PartnerInfoModalContentView, PartnerInfoModalView, } from "./sqm-partner-info-modal-view";
-import { usePartnerInfoModal, } from "./usePartnerInfoModal";
-/**
- * @uiName Partner Info Modal
- * @exampleGroup Tax and Cash
- * @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>
- */
-export class PartnerInfoModal {
-  constructor() {
-    /**
-     * Brand name shown in the modal header
-     *
-     * @uiName Brand name
-     */
-    this.brandName = "";
-    /**
-     * Header text when user has no existing partner
-     *
-     * @uiName New partner header
-     * @uiWidget textArea
-     */
-    this.modalHeader = "Let's get you ready for rewards";
-    /**
-     * Header text when user has an existing partner
-     *
-     * @uiName Existing partner header
-     * @uiWidget textArea
-     */
-    this.modalHeaderExistingPartner = "We found an existing account";
-    /**
-     * Description for new partner setup
-     *
-     * @uiName New partner description
-     * @uiWidget textArea
-     */
-    this.descriptionNewPartner = "Confirm your country and currency now to get your future rewards faster.";
-    /**
-     * Description for existing partner confirmation
-     *
-     * @uiName Existing partner description
-     * @uiWidget textArea
-     */
-    this.descriptionExistingPartner = "We found an account with this email on our referral program provider, impact.com. Please confirm your country and currency now to get your future rewards faster.";
-    /**
-     * Support description for existing partner confirmation
-     *
-     * @uiName Existing partner support description
-     * @uiWidget textArea
-     */
-    this.supportDescriptionExistingPartner = "If this is a mistake, please contact Support or sign up for this referral program with a different email.";
-    /**
-     * Edit the property called terms and conditions text to change what's displayed for {termsAndConditionsLink}.
-     * @uiName Terms and conditions checkbox
-     */
-    this.allowBankingCollection = "I have read the {termsAndConditionsLink} and allow impact.com to collect my tax and banking information";
-    /**
-     * The link text that appears in the terms and conditions checkbox
-     * @uiName Terms and conditions text
-     * @uiWidget textArea
-     */
-    this.termsAndConditionsLabel = "terms and conditions";
-    /**
-     * The link that appears in the terms and conditions checkbox
-     * @uiName Terms and conditions link
-     */
-    this.termsAndConditionsLink = "https://terms.advocate.impact.com/PayoutTermsAndConditions.html";
-    /**
-     * @uiName Country label
-     */
-    this.countryLabel = "Country";
-    /**
-     * @uiName Currency label
-     */
-    this.currencyLabel = "Currency";
-    /**
-     * @uiName Submit button label
-     */
-    this.submitButtonLabel = "Submit";
-    /**
-     * @uiName Confirm button label
-     */
-    this.confirmButtonLabel = "Confirm";
-    /**
-     * @uiName Search country placeholder
-     */
-    this.searchCountryPlaceholder = "Search for a country";
-    /**
-     * @uiName Search currency placeholder
-     */
-    this.searchCurrencyPlaceholder = "Search for a currency";
-    /**
-     * @uiName Network error text
-     * @uiWidget textArea
-     */
-    this.networkErrorText = "An error occurred. Please try again.";
-    /**
-     * @uiName Missing fields error text
-     * @uiWidget textArea
-     */
-    this.missingFieldsErrorText = "Please select both a country and currency.";
-    /**
-     * Used to render in another modal.
-     * @undocumented
-     */
-    this.inModal = false;
-    /**
-     * @undocumented
-     * @componentState { "title": "New partner", "props": { "states": { "open": true, "isExistingPartner": false } } }
-     * @componentState { "title": "Existing partner", "props": { "states": { "open": true, "isExistingPartner": true, "countryCode": "US", "currency": "USD" } } }
-     * @componentState { "title": "Connected (hidden)", "props": { "states": { "open": false } } }
-     */
-    this.stateController = "{}";
-    withHooks(this);
-  }
-  disconnectedCallback() { }
-  getTextProps() {
-    return getProps(this);
-  }
-  render() {
-    const props = isDemo()
-      ? useDemoPartnerInfoModal(this)
-      : usePartnerInfoModal(this);
-    if (this.inModal) {
-      return h(PartnerInfoModalContentView, Object.assign({}, props));
-    }
-    return h(PartnerInfoModalView, Object.assign({}, props));
-  }
-  static get is() { return "sqm-partner-info-modal"; }
-  static get encapsulation() { return "shadow"; }
-  static get properties() { return {
-    "brandName": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Brand name",
-            "name": "uiName"
-          }],
-        "text": "Brand name shown in the modal header"
-      },
-      "attribute": "brand-name",
-      "reflect": false,
-      "defaultValue": "\"\""
-    },
-    "modalHeader": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "New partner header",
-            "name": "uiName"
-          }, {
-            "text": "textArea",
-            "name": "uiWidget"
-          }],
-        "text": "Header text when user has no existing partner"
-      },
-      "attribute": "modal-header",
-      "reflect": false,
-      "defaultValue": "\"Let's get you ready for rewards\""
-    },
-    "modalHeaderExistingPartner": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Existing partner header",
-            "name": "uiName"
-          }, {
-            "text": "textArea",
-            "name": "uiWidget"
-          }],
-        "text": "Header text when user has an existing partner"
-      },
-      "attribute": "modal-header-existing-partner",
-      "reflect": false,
-      "defaultValue": "\"We found an existing account\""
-    },
-    "descriptionNewPartner": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "New partner description",
-            "name": "uiName"
-          }, {
-            "text": "textArea",
-            "name": "uiWidget"
-          }],
-        "text": "Description for new partner setup"
-      },
-      "attribute": "description-new-partner",
-      "reflect": false,
-      "defaultValue": "\"Confirm your country and currency now to get your future rewards faster.\""
-    },
-    "descriptionExistingPartner": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Existing partner description",
-            "name": "uiName"
-          }, {
-            "text": "textArea",
-            "name": "uiWidget"
-          }],
-        "text": "Description for existing partner confirmation"
-      },
-      "attribute": "description-existing-partner",
-      "reflect": false,
-      "defaultValue": "\"We found an account with this email on our referral program provider, impact.com. Please confirm your country and currency now to get your future rewards faster.\""
-    },
-    "supportDescriptionExistingPartner": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Existing partner support description",
-            "name": "uiName"
-          }, {
-            "text": "textArea",
-            "name": "uiWidget"
-          }],
-        "text": "Support description for existing partner confirmation"
-      },
-      "attribute": "support-description-existing-partner",
-      "reflect": false,
-      "defaultValue": "\"If this is a mistake, please contact Support or sign up for this referral program with a different email.\""
-    },
-    "allowBankingCollection": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Terms and conditions checkbox",
-            "name": "uiName"
-          }],
-        "text": "Edit the property called terms and conditions text to change what's displayed for {termsAndConditionsLink}."
-      },
-      "attribute": "allow-banking-collection",
-      "reflect": false,
-      "defaultValue": "\"I have read the {termsAndConditionsLink} and allow impact.com to collect my tax and banking information\""
-    },
-    "termsAndConditionsLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Terms and conditions text",
-            "name": "uiName"
-          }, {
-            "text": "textArea",
-            "name": "uiWidget"
-          }],
-        "text": "The link text that appears in the terms and conditions checkbox"
-      },
-      "attribute": "terms-and-conditions-label",
-      "reflect": false,
-      "defaultValue": "\"terms and conditions\""
-    },
-    "termsAndConditionsLink": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Terms and conditions link",
-            "name": "uiName"
-          }],
-        "text": "The link that appears in the terms and conditions checkbox"
-      },
-      "attribute": "terms-and-conditions-link",
-      "reflect": false,
-      "defaultValue": "\"https://terms.advocate.impact.com/PayoutTermsAndConditions.html\""
-    },
-    "countryLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Country label",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "country-label",
-      "reflect": false,
-      "defaultValue": "\"Country\""
-    },
-    "currencyLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Currency label",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "currency-label",
-      "reflect": false,
-      "defaultValue": "\"Currency\""
-    },
-    "submitButtonLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Submit button label",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "submit-button-label",
-      "reflect": false,
-      "defaultValue": "\"Submit\""
-    },
-    "confirmButtonLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Confirm button label",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "confirm-button-label",
-      "reflect": false,
-      "defaultValue": "\"Confirm\""
-    },
-    "searchCountryPlaceholder": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Search country placeholder",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "search-country-placeholder",
-      "reflect": false,
-      "defaultValue": "\"Search for a country\""
-    },
-    "searchCurrencyPlaceholder": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Search currency placeholder",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "search-currency-placeholder",
-      "reflect": false,
-      "defaultValue": "\"Search for a currency\""
-    },
-    "networkErrorText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Network error text",
-            "name": "uiName"
-          }, {
-            "text": "textArea",
-            "name": "uiWidget"
-          }],
-        "text": ""
-      },
-      "attribute": "network-error-text",
-      "reflect": false,
-      "defaultValue": "\"An error occurred. Please try again.\""
-    },
-    "missingFieldsErrorText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Missing fields error text",
-            "name": "uiName"
-          }, {
-            "text": "textArea",
-            "name": "uiWidget"
-          }],
-        "text": ""
-      },
-      "attribute": "missing-fields-error-text",
-      "reflect": false,
-      "defaultValue": "\"Please select both a country and currency.\""
-    },
-    "inModal": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": undefined,
-            "name": "undocumented"
-          }],
-        "text": "Used to render in another modal."
-      },
-      "attribute": "in-modal",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "stateController": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": undefined,
-            "name": "undocumented"
-          }, {
-            "text": "{ \"title\": \"New partner\", \"props\": { \"states\": { \"open\": true, \"isExistingPartner\": false } } }",
-            "name": "componentState"
-          }, {
-            "text": "{ \"title\": \"Existing partner\", \"props\": { \"states\": { \"open\": true, \"isExistingPartner\": true, \"countryCode\": \"US\", \"currency\": \"USD\" } } }",
-            "name": "componentState"
-          }, {
-            "text": "{ \"title\": \"Connected (hidden)\", \"props\": { \"states\": { \"open\": false } } }",
-            "name": "componentState"
-          }],
-        "text": ""
-      },
-      "attribute": "state-controller",
-      "reflect": false,
-      "defaultValue": "\"{}\""
-    },
-    "demoData": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "DemoData<PartnerInfoModalResult>",
-        "resolved": "{ states?: { open: boolean; loading: boolean; submitting: boolean; isExistingPartner: boolean; countryCode: string; currency: string; error: string; success: boolean; brandName: string; filteredCountries: { countryCode: string; displayName: string; }[]; filteredCurrencies: { currencyCode: string; displayName: string; }[]; allowBankingCollection: boolean; checkboxError: string; disabled: boolean; }; }",
-        "references": {
-          "DemoData": {
-            "location": "import",
-            "path": "../../global/demo"
-          },
-          "PartnerInfoModalResult": {
-            "location": "import",
-            "path": "./usePartnerInfoModal"
-          }
-        }
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "text": undefined,
-            "name": "undocumented"
-          }, {
-            "text": "object",
-            "name": "uiType"
-          }],
-        "text": ""
-      }
-    }
-  }; }
-}
-function useDemoPartnerInfoModal(props) {
-  const [countryCode, setCountryCode] = useState("US");
-  const [currency, setCurrency] = useState("");
-  const [error, setError] = useState("");
-  const [allowBankingCollection, setAllowBankingCollection] = useState(false);
-  const parsed = parseStates(props.stateController);
-  const stateOverride = (parsed === null || parsed === void 0 ? void 0 : parsed["sqm-partner-info-modal"]) || parsed || {};
-  // @ts-ignore
-  return deepmerge({
-    states: {
-      brandName: "Test Brand",
-      open: false,
-      loading: false,
-      submitting: false,
-      isExistingPartner: false,
-      countryCode,
-      currency,
-      error,
-      success: false,
-      filteredCountries: [],
-      filteredCurrencies: [],
-      allowBankingCollection,
-      checkboxError: "",
-      disabled: false,
-    },
-    callbacks: {
-      onCountryChange: (e) => {
-        var _a, _b;
-        const value = (_b = (_a = e === null || e === void 0 ? void 0 : e.detail) === null || _a === void 0 ? void 0 : _a.item) === null || _b === void 0 ? void 0 : _b.__value;
-        if (value) {
-          setCountryCode(value);
-          setCurrency("");
-        }
-      },
-      onCurrencyChange: (e) => {
-        var _a, _b;
-        const value = (_b = (_a = e === null || e === void 0 ? void 0 : e.detail) === null || _a === void 0 ? void 0 : _a.item) === null || _b === void 0 ? void 0 : _b.__value;
-        if (value)
-          setCurrency(value);
-      },
-      onCheckboxChange: (e) => {
-        setAllowBankingCollection(e.target.checked);
-      },
-      setCountrySearch: () => { },
-      setCurrencySearch: () => { },
-      onSubmit: () => {
-        if (!countryCode || !currency) {
-          setError(props.missingFieldsErrorText);
-          return;
-        }
-        setError("");
-      },
-      onClose: () => { },
-    },
-    text: {
-      modalHeader: props.modalHeader,
-      descriptionNewPartner: props.descriptionNewPartner,
-      descriptionExistingPartner: props.descriptionExistingPartner,
-      countryLabel: props.countryLabel,
-      currencyLabel: props.currencyLabel,
-      submitButtonLabel: props.submitButtonLabel,
-      confirmButtonLabel: props.confirmButtonLabel,
-      searchCountryPlaceholder: props.searchCountryPlaceholder,
-      searchCurrencyPlaceholder: props.searchCurrencyPlaceholder,
-      supportDescriptionExistingPartner: props.supportDescriptionExistingPartner,
-      modalHeaderExistingPartner: props.modalHeaderExistingPartner,
-    },
-  }, props.demoData || stateOverride, { arrayMerge: (_, a) => a });
-}