@saasquatch/mint-components 2.2.0 → 2.3.0-1

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

@@ -1,173 +0,0 @@
-import { useMutation, useParent, useParentQueryValue, useParentValue, useUserIdentity, } from "@saasquatch/component-boilerplate";
-import { useEffect, useState } from "@saasquatch/universal-hooks";
-import { gql } from "graphql-request";
-import { TAX_CONTEXT_NAMESPACE, TAX_FORM_CONTEXT_NAMESPACE, USER_QUERY_NAMESPACE, } from "../data";
-import { TAX_FORM_UPDATED_EVENT_KEY } from "../eventKeys";
-import { taxTypeToName, validTaxDocument } from "../utils";
-const GET_TAX_DOCUMENT = gql `
-  mutation createImpactPublisherTaxDocument(
-    $vars: CreateImpactPublisherTaxDocumentInput!
-  ) {
-    createImpactPublisherTaxDocument(
-      createImpactPublisherTaxDocumentInput: $vars
-    ) {
-      documentUrl
-    }
-  }
-`;
-const COMPLETE_TAX_DOCUMENT = gql `
-  mutation completeImpactPublisherTaxDocument($vars: UserIdInput!) {
-    completeImpactPublisherTaxDocument(user: $vars) {
-      success
-    }
-  }
-`;
-export const DOCUSIGN_ERROR_STATES = [
-  "exception",
-  "decline",
-  "cancel",
-  "fax_pending",
-];
-export const DOCUSIGN_EXPIRED_STATES = ["ttl_expired", "session_timeout"];
-export const DOCUSIGN_SUCCESS_STATES = ["signing_complete", "viewing_complete"];
-export function useDocusignForm(props) {
-  var _a, _b, _c;
-  const user = useUserIdentity();
-  const context = useParentValue(TAX_FORM_CONTEXT_NAMESPACE);
-  const [step, setStep] = useParent(TAX_CONTEXT_NAMESPACE);
-  const { data, loading: userLoading, refetch, } = useParentQueryValue(USER_QUERY_NAMESPACE);
-  const publisher = (_b = (_a = data === null || data === void 0 ? void 0 : data.user) === null || _a === void 0 ? void 0 : _a.impactConnection) === null || _b === void 0 ? void 0 : _b.publisher;
-  const [createTaxDocument, { loading: documentLoading, data: document, errors: documentErrors },] = useMutation(GET_TAX_DOCUMENT);
-  const [completeTaxDocument, { loading: completeDocumentLoading, data: completeData, errors: completeErrors, },] = useMutation(COMPLETE_TAX_DOCUMENT);
-  const [docusignStatus, setDocusignStatus] = useState(undefined);
-  const [participantType, setParticipantType] = useState(undefined);
-  const [errors, setErrors] = useState({});
-  const [loading, setLoading] = useState(false);
-  const [showExitButton, setShowExitButton] = useState(false);
-  const [showModal, setShowModal] = useState(true);
-  // Only look at current document if it's valid (same as required type)
-  const existingDocumentType = validTaxDocument(publisher === null || publisher === void 0 ? void 0 : publisher.requiredTaxDocumentType) && (publisher === null || publisher === void 0 ? void 0 : publisher.currentTaxDocument)
-    ? publisher === null || publisher === void 0 ? void 0 : publisher.requiredTaxDocumentType : undefined;
-  const actualDocumentType = existingDocumentType ||
-    getDocumentType(participantType) || (publisher === null || publisher === void 0 ? void 0 : publisher.requiredTaxDocumentType);
-  useEffect(() => {
-    if (!existingDocumentType)
-      return;
-    if (existingDocumentType === "W8BEN") {
-      setParticipantType("individualParticipant");
-    }
-    else if (existingDocumentType === "W8BENE") {
-      setParticipantType("businessEntity");
-    }
-  }, [existingDocumentType]);
-  useEffect(() => {
-    // Skip if no publisher info
-    if (!user || !publisher)
-      return;
-    const fetchDocument = async () => {
-      try {
-        const result = await createTaxDocument({
-          vars: {
-            provider: "COMPLY_EXCHANGE",
-            user: {
-              id: user.id,
-              accountId: user.accountId,
-            },
-            ...(participantType
-              ? { isBusinessEntity: participantType === "businessEntity" }
-              : {}),
-          },
-        });
-        if (!result || result.message)
-          throw new Error();
-      }
-      catch (e) {
-        setErrors({ docusign: true });
-      }
-    };
-    fetchDocument();
-  }, [user, publisher, participantType]);
-  const completeDocument = async () => {
-    if (!user)
-      return;
-    try {
-      setLoading(true);
-      const result = await completeTaxDocument({
-        vars: {
-          id: user.id,
-          accountId: user.accountId,
-        },
-      });
-      if (!result || result.message)
-        throw new Error();
-      // @ts-expect-error: no data type for result
-      if (!result.completeImpactPublisherTaxDocument.success)
-        throw new Error();
-      // Fire form change event
-      window.dispatchEvent(new Event(TAX_FORM_UPDATED_EVENT_KEY));
-      setShowExitButton(true);
-    }
-    catch (e) {
-      setErrors({ general: true });
-    }
-    finally {
-      setLoading(false);
-    }
-  };
-  const progressStep = () => {
-    // return to dashboard
-    if (window.location.hash) {
-      window.location.hash = "";
-    }
-    else {
-      setStep(context.overrideNextStep ||
-        !!(publisher === null || publisher === void 0 ? void 0 : publisher.withdrawalSettings) ||
-        !(publisher === null || publisher === void 0 ? void 0 : publisher.brandedSignup)
-        ? "/dashboard"
-        : "/4");
-    }
-  };
-  const allLoading = userLoading || documentLoading || loading;
-  return {
-    states: {
-      step: step === null || step === void 0 ? void 0 : step.replace("/", ""),
-      hideSteps: context.hideSteps,
-      disabled: allLoading,
-      participantTypeDisabled: allLoading || !!existingDocumentType,
-      loading: userLoading || loading || completeDocumentLoading,
-      urlLoading: documentLoading,
-      loadingError: !!(documentErrors === null || documentErrors === void 0 ? void 0 : documentErrors.message),
-      formState: {
-        participantType,
-        taxFormExpired: DOCUSIGN_EXPIRED_STATES.includes(docusignStatus),
-        errors,
-      },
-      docusignStatus,
-      documentType: actualDocumentType,
-      documentTypeString: taxTypeToName(actualDocumentType),
-      showExitButton,
-      showModal,
-    },
-    data: {
-      taxForm: actualDocumentType,
-      documentUrl: (_c = document === null || document === void 0 ? void 0 : document.createImpactPublisherTaxDocument) === null || _c === void 0 ? void 0 : _c.documentUrl,
-    },
-    callbacks: {
-      setDocusignStatus,
-      completeDocument,
-      onExit: progressStep,
-      setParticipantType,
-      onModalClose: () => setShowModal(false),
-      onModalOpen: () => setShowModal(true),
-    },
-    text: props.getTextProps(),
-  };
-}
-function getDocumentType(p) {
-  if (p === "businessEntity")
-    return "W8BENE";
-  if (p === "individualParticipant")
-    return "W8BEN";
-  else
-    return undefined;
-}

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

@@ -1,191 +0,0 @@
-import { h } from "@stencil/core";
-import { intl } from "../../../global/global";
-import { createStyleSheet } from "../../../styling/JSS";
-import { FORM_STEPS } from "../data";
-const style = {
-  FormWrapper: {
-    display: "flex",
-    justifyContent: "flex-start",
-    flexDirection: "column",
-  },
-  RadioContainer: {
-    display: "flex",
-    alignItems: "flex-start",
-    justifyContent: "flex-start",
-    flexDirection: "column",
-    gap: "var(--sl-spacing-medium)",
-    marginBottom: "16px",
-    "& sl-radio::part(base)": {
-      alignItems: "start",
-    },
-  },
-  InnerRadioContainer: {
-    display: "flex",
-    flexDirection: "column",
-    gap: "var(--sl-spacing-medium)",
-    width: "100%",
-  },
-  RadioContent: {
-    display: "flex",
-    flexDirection: "column",
-    gap: "var(--sl-spacing-xx-small)",
-    fontSize: "var(--sl-font-size-small)",
-    color: "var(--sqm-text)",
-  },
-  TitleContainer: {
-    display: "flex",
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "flex-start",
-    gap: "var(--sl-spacing-small)",
-  },
-  TextContainer: {
-    display: "flex",
-    justifyContent: "flex-start",
-    flexDirection: "column",
-    gap: "24px",
-    paddingBottom: "16px",
-  },
-  BtnContainer: {
-    paddingTop: "36px",
-    display: "flex",
-    gap: "8px",
-  },
-  ErrorText: {
-    color: "var(--sqm-danger-color-text)",
-    marginTop: "10px",
-  },
-  DescriptionText: {
-    color: "var(--sqm-text-subdued)",
-  },
-  InfoWarningIcon: {
-    height: "26px",
-    width: "26px",
-  },
-  PageDescriptionText: {
-    color: "var(--sqm-text-subdued)",
-    fontSize: "var(--sl-font-size-medium)",
-    marginBottom: "var(--sl-spacing-small)",
-  },
-  PrimaryButton: {
-    "&::part(base)": {
-      background: "var(--sqm-primary-button-background)",
-      color: "var(--sqm-primary-button-color)",
-      borderColor: "var(--sqm-primary-button-color-border)",
-      borderRadius: "var(--sqm-primary-button-radius)",
-    },
-    "&::part(base):hover": {
-      backgroundColor: "var(--sqm-primary-button-background-hover)",
-      borderColor: "var(--sqm-primary-button-border-color-hover)",
-      color: "var(--sqm-primary-button-color-hover)",
-    },
-  },
-  SecondaryButton: {
-    "&::part(base)": {
-      background: "var(--sqm-secondary-button-background)",
-      color: "var(--sqm-secondary-button-color)",
-      borderColor: "var(--sqm-secondary-button-color-border)",
-      borderRadius: "var(--sqm-secondary-button-radius)",
-      width: "max-content",
-      display: "flex",
-      margin: "auto",
-    },
-    "&::part(base):hover": {
-      backgroundColor: "var(--sqm-secondary-button-background-hover)",
-      color: "var(--sqm-secondary-button-color-hover)",
-      borderColor: "var(--sqm-secondary-button-border-color-hover)",
-    },
-  },
-};
-const sheet = createStyleSheet(style);
-const styleString = sheet.toString();
-const vanillaStyle = `
-    :host{
-      display: block;   
-    }
-
-    hr {
-      border: var(--sqm-border-thickness, 1px) solid var(--sqm-border-color);
-    }
-
-    a {
-      color: inherit;
-      text-decoration: underline;
-      cursor: pointer;
-    }
-
-    * {
-       margin: 0;
-       padding: 0;
-       box-sizing: border-box;
-    }
-
-  `;
-export const IndirectTaxFormView = (props) => {
-  var _a;
-  const { states, states: { formState }, callbacks, text, refs, slots, } = props;
-  const { classes } = sheet;
-  return (h("sl-form", { class: classes.FormWrapper, "onSl-submit": callbacks.onSubmit, ref: (el) => (refs.formRef.current = el), novalidate: true },
-    h("style", { type: "text/css" },
-      styleString,
-      vanillaStyle),
-    h("div", { class: classes.TextContainer },
-      h("div", null,
-        !states.hideSteps && (h("p", null,
-          " ",
-          intl.formatMessage({
-            id: "formStep",
-            defaultMessage: text.formStep,
-          }, { step: states.step, count: FORM_STEPS }))),
-        h("h3", null, text.indirectTax),
-        h("p", { class: classes.PageDescriptionText }, text.taxAndPayoutsDescription),
-        h("p", { class: classes.DescriptionText }, text.indirectTaxDescription)),
-      states.loadingError && (h("div", null,
-        h("sqm-form-message", { type: "error" },
-          h("p", { part: "alert-title" }, text.error.loadingErrorAlertHeader),
-          intl.formatMessage({
-            id: "loadingErrorAlertDescription",
-            defaultMessage: text.error.loadingErrorAlertDescription,
-          }, {
-            supportLink: (h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
-          })))),
-      ((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.general) && (h("sqm-form-message", { type: "error" },
-        h("p", { part: "alert-title" }, text.error.generalTitle),
-        intl.formatMessage({
-          id: "generalDescription",
-          defaultMessage: text.error.generalDescription,
-        }, {
-          supportLink: (h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
-        }))),
-      states.isPartner && (h("sqm-form-message", { loading: states.loading, type: "info" },
-        h("p", { part: "alert-title" }, text.isPartnerAlertHeader),
-        intl.formatMessage({
-          id: "isPartnerAlertDescription",
-          defaultMessage: text.isPartnerAlertDescription,
-        }, {
-          supportLink: (h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
-        }))),
-      h("div", null,
-        h("h4", null, text.indirectTaxDetails))),
-    states.loading ? (h("sl-spinner", { style: { fontSize: "50px", margin: "40px" } })) : (h("div", null,
-      h("div", { class: classes.RadioContainer },
-        h("div", { class: classes.InnerRadioContainer },
-          h("sl-radio", { exportparts: "base: radio-base", name: "/checked", value: "notRegistered", id: "notRegistered", checked: formState.checked === "notRegistered", onInput: () => callbacks.onChange("notRegistered"), disabled: states.disabled || states.isPartner },
-            h("div", { class: classes.RadioContent },
-              text.notRegistered,
-              h("p", { class: classes.DescriptionText }, text.notRegisteredSubtext))),
-          h("sl-radio", { exportparts: "base: radio-base", name: "/checked", value: "otherRegion", id: "otherRegion", checked: formState.checked === "otherRegion", onInput: () => callbacks.onChange("otherRegion"), disabled: states.disabled || states.isPartner },
-            h("div", { class: classes.RadioContent },
-              text.otherRegion,
-              h("p", { class: classes.DescriptionText }, text.otherRegionSubtext))),
-          slots.registeredInDifferentCountryDetailsSlot)),
-      h("sqm-form-message", { type: "info" }, intl.formatMessage({
-        id: "cannotChangeInfoAlert",
-        defaultMessage: text.cannotChangeInfoAlert,
-      }, {
-        supportLink: (h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
-      })),
-      h("div", { class: classes.BtnContainer },
-        h("sl-button", { class: classes.PrimaryButton, type: "primary", disabled: states.disabled, submit: true, exportparts: "base: primarybutton-base" }, text.continueButton),
-        h("sl-button", { class: classes.SecondaryButton, type: "text", disabled: states.disabled, onClick: callbacks.onBack, exportparts: "base: secondarybutton-base" }, text.backButton))))));
-};