@zeniai/web-components 3.17.10 → 3.17.12

package/dist/VendorFiling1099EditablePage-CXt3gLm6.js

@@ -1,842 +0,0 @@
-import { j as t, u as Re, g as ke, h as We, F as ze, m as Oe } from "./vendor-.pnpm-B2klaOGU.js";
-import { useState as Me, useRef as O, useEffect as B } from "react";
-import i from "@emotion/styled";
-import { u as ae, a as de, R as p, j0 as He, j1 as qe, j2 as U, j3 as ce, aS as j, hh as Ee, hi as G, D as l, S as o, aI as V, C as T, aE as Ue, e as _e, fo as De, iO as Ge, ik as Ke, fp as Qe, iP as Ze, iQ as Je, aB as Xe, ao as Ye, dU as et, b as tt, fi as ot, j4 as st, ap as lt, _ as nt, o as ue, aA as rt } from "./index-DcL7gbcq.js";
-import { L as it } from "./LabeledDropDownFormattedTextField-CIQ8budF.js";
-const oe = {
-  paddingTopBottom: new p(l[3], l[3]),
-  paddingLeftRight: new p(l[3], l[8]),
-  paddingLeftRightSubPage: new p(l[3], l[8]),
-  marginLeftSubtitle: new p(l[4], l[8]),
-  marginTopSubtitle: new p(l[4], l[3]),
-  largeLabelWidth: new p(160, 210, 230),
-  paddingBottom: new p(l[3], l[2]),
-  customTitleFont: new p(l[4], l[5]),
-  customTitleMarginBottom: new p(l[0], l[3]),
-  customTitleMarginLeft: new p(l[3], l[8])
-}, v = (e, n) => `${e}.${n}`;
-function at(e) {
-  const { loadingState: n } = e;
-  return /* @__PURE__ */ t.jsx(
-    dt,
-    {
-      ...e,
-      isDisabled: e.isDisabled || n === "In-Progress" ? "disabled" : void 0
-    }
-  );
-}
-function dt({
-  googleAPIKey: e,
-  addressToEdit: n,
-  sectionId: a,
-  isDisabled: m,
-  style: H
-}) {
-  const z = ae(), u = de.getLocalizedStrings().companyPassport, g = oe.largeLabelWidth.value(z);
-  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-    /* @__PURE__ */ t.jsx(se, { type: "hidden", value: "noAutoFill" }),
-    /* @__PURE__ */ t.jsx(ct, { style: H, children: /* @__PURE__ */ t.jsxs(ut, { children: [
-      /* @__PURE__ */ t.jsx(
-        He,
-        {
-          isDisabled: m,
-          label: {
-            label: u.address.street,
-            width: g,
-            showBullet: !0
-          },
-          addressField: {
-            name: v(a, "street"),
-            defaultValue: {
-              addressString: n?.street[0] ?? "",
-              addressValue: n != null ? ce(n) : void 0
-            },
-            placeholder: U(u.address.street),
-            registerOptions: {
-              required: !0,
-              validate: ($) => $ != null ? !!$.addressString : !1
-            },
-            autoComplete: "new-password",
-            googleAPIKey: e,
-            addressFormatter: qe
-          },
-          style: {
-            border: "none",
-            width: "100%",
-            outline: "none"
-          }
-        }
-      ),
-      /* @__PURE__ */ t.jsx(
-        j,
-        {
-          isDisabled: m,
-          label: {
-            label: u.address.suite,
-            width: g,
-            showBullet: !0
-          },
-          style: {
-            wordBreak: "break-word",
-            width: "100%",
-            outline: "none"
-          },
-          text: {
-            type: "text",
-            name: v(a, "suite"),
-            defaultValue: n?.street[1],
-            placeholder: u.address.suitePlaceholder,
-            autoComplete: "new-password"
-          }
-        }
-      ),
-      /* @__PURE__ */ t.jsx(
-        j,
-        {
-          isDisabled: m,
-          label: {
-            label: u.address.city,
-            width: g,
-            showBullet: !0
-          },
-          style: {
-            width: "100%",
-            outline: "none"
-          },
-          text: {
-            type: "text",
-            name: v(a, "city"),
-            defaultValue: n?.city,
-            placeholder: U(u.address.city),
-            autoComplete: "new-password",
-            options: {
-              required: !0
-            }
-          }
-        }
-      ),
-      /* @__PURE__ */ t.jsx(
-        j,
-        {
-          isDisabled: m,
-          label: {
-            label: u.address.state,
-            width: g,
-            showBullet: !0
-          },
-          style: {
-            width: "100%",
-            outline: "none"
-          },
-          text: {
-            type: "text",
-            name: v(a, "state"),
-            defaultValue: n?.state,
-            placeholder: U(u.address.state),
-            autoComplete: "new-password",
-            options: {
-              required: !0
-            }
-          }
-        }
-      ),
-      /* @__PURE__ */ t.jsx(se, { readOnly: !0, value: "noAutoFill" }),
-      /* @__PURE__ */ t.jsx(
-        Ee,
-        {
-          isDisabled: m,
-          label: {
-            label: u.address.country,
-            width: g,
-            showBullet: !0
-          },
-          style: {
-            width: "100%",
-            outline: "none"
-          },
-          countrySelectField: {
-            name: v(a, "country"),
-            placeholder: u.address.countryPlaceholder,
-            defaultValue: G(n?.country),
-            registerOptions: {
-              validate: ($) => !!($ != null && $.selectedOption)
-            }
-          }
-        }
-      ),
-      /* @__PURE__ */ t.jsx(
-        j,
-        {
-          isDisabled: m,
-          label: {
-            label: u.address.zipCode,
-            width: g,
-            showBullet: !0
-          },
-          style: {
-            width: "100%",
-            outline: "none"
-          },
-          text: {
-            type: "text",
-            name: v(a, "postalCode"),
-            defaultValue: n?.postalCode,
-            placeholder: u.address.zipCodePlaceHolder,
-            autoComplete: "new-password",
-            options: {
-              required: !0
-            }
-          }
-        }
-      ),
-      /* @__PURE__ */ t.jsx(
-        j,
-        {
-          isDisabled: m,
-          label: {
-            label: u.address.secondaryInfo,
-            width: g,
-            showBullet: !0
-          },
-          style: {
-            paddingBottom: oe.paddingBottom.valuePx(z),
-            width: "100%",
-            outline: "none"
-          },
-          text: {
-            type: "text",
-            name: v(a, "secondaryInfo"),
-            defaultValue: n?.street[2],
-            placeholder: u.address.secondaryInfoPlaceholder,
-            autoComplete: "new-password"
-          }
-        }
-      )
-    ] }) })
-  ] });
-}
-const ct = i.div`
-  display: flex;
-  flex-direction: column;
-  margin-left: ${o.sp3};
-`, ut = i.div`
-  display: flex;
-  flex-direction: column;
-  background-color: ${(e) => e.theme.colors.grey5};
-  border-radius: ${o.sp2};
-  padding-right: ${o.sp2};
-`, se = i.input`
-  display: none;
-`, pt = i.div`
-  display: flex;
-  flex-direction: column;
-  row-gap: ${o.sp7};
-  margin-bottom: ${o.sp4};
-`, gt = i.div`
-  display: flex;
-  flex-direction: column;
-  row-gap: ${o.sp3};
-`, ht = i.div`
-  border: 1px solid ${(e) => e.theme.colors.grey3};
-  filter: drop-shadow(
-    ${o.sp0} 2px ${o.sp1} ${T.boxShadowElevation}
-  );
-  border-radius: ${o.sp2};
-  background: ${(e) => e.theme.colors.grey5};
-`, mt = i.div`
-  margin-left: ${o.sp3};
-`, _ = i.div`
-  padding: ${o.sp3};
-  display: flex;
-  justify-content: space-between;
-  border-bottom: 1px solid ${(e) => e.theme.colors.grey3};
-`, xt = () => /* @__PURE__ */ t.jsx(pt, { children: [...Array(1)].map((e, n) => /* @__PURE__ */ t.jsxs(gt, { children: [
-  /* @__PURE__ */ t.jsx(
-    V,
-    {
-      style: { marginBottom: o.sp4 },
-      width: 120,
-      height: l[4]
-    }
-  ),
-  /* @__PURE__ */ t.jsxs(ht, { children: [
-    [...Array(5)].map((a, m) => /* @__PURE__ */ t.jsxs(_, { children: [
-      /* @__PURE__ */ t.jsx(V, { width: 70, height: l[4] }),
-      /* @__PURE__ */ t.jsx(V, { width: 140, height: l[4] })
-    ] }, m)),
-    /* @__PURE__ */ t.jsx(_, { children: /* @__PURE__ */ t.jsx(V, { width: 120, height: l[4] }) }),
-    /* @__PURE__ */ t.jsx(mt, { children: [...Array(7)].map((a, m) => /* @__PURE__ */ t.jsxs(_, { children: [
-      /* @__PURE__ */ t.jsx(V, { width: 70, height: l[4] }),
-      /* @__PURE__ */ t.jsx(V, { width: 140, height: l[4] })
-    ] }, m)) })
-  ] })
-] }, n)) }), w = {
-  largeLabelWidth: new p(130, 200, 300),
-  labelMarginLeft: new p(l[3], l[4]),
-  labelMarginTop: new p(l[2], l[3]),
-  labelMarginBottom: new p(l[2], l[3]),
-  containerPaddingLeft: new p(l[3], l[6], l[8]),
-  containerPaddingRight: new p(l[3], l[6], l[8]),
-  marginRight: new p(l[2], l[3])
-}, yt = {
-  zIndex: 2,
-  minHeight: 62
-}, s = "vendor1099FilingSectionId", pe = "legalName", ge = "email", he = "phone", me = "taxClassification", xe = "tinType", ye = "tinValue", ft = "street", bt = "suite", wt = "city", $t = "state", vt = "country", St = "countryCode", jt = "postalCode", Ct = "secondaryInfo", D = (e) => `${e}_form`, P = (e, n) => `${e}.${n}`, { spendManagement: Ft, common: r } = de.getLocalizedStrings(), S = Ft.billPay.vendorCreation, R = r.labels, le = r.footer, Zt = (e) => {
-  const n = ae(), a = new AbortController(), m = Re(), H = a.signal, {
-    onVendorFiling1099UploadDetailsSave: z,
-    vendorId: u,
-    vendorFiling1099UploadDetailsViewState: g,
-    onSaveChangesToLocalStore: $,
-    vendorFiling1099UploadDetails: C,
-    fetchVendorFetchStatus: K,
-    onAddressEditHandler: fe,
-    goBackToListPage: Q,
-    onResetVendorFiling1099FormStatus: be,
-    googleAPIKey: we
-  } = e, {
-    vendor1099DetailsSaveStatus: I,
-    vendor1099DetailsLocalData: c,
-    w9FormUploadStatus: Z
-  } = g, [J, X] = Me(
-    C.addressStatus?.addressToCreate ?? {
-      street: [],
-      city: "",
-      state: "",
-      country: "",
-      countryCode: "",
-      postalCode: ""
-    }
-  ), Y = O(null), { vendorTypeList: q } = C, N = O(null), A = O(null), ee = O(!1);
-  B(() => {
-    A.current === null && c.legalName != r.strings.empty && g.vendor1099DetailsAutoFilledValues?.legalName === !0 && (A.current = c.legalName);
-  }, [c.legalName]), B(() => {
-    N.current === null && c.legalName !== r.strings.empty && (N.current = c.legalName);
-  }, [c.legalName]), B(() => {
-    C?.addressStatus?.addressToCreate && g.vendor1099DetailsAutoFilledValues?.address === !0 && ee.current === !1 && (X(
-      C.addressStatus.addressToCreate
-    ), ee.current = !0);
-  }, [
-    C,
-    g.vendor1099DetailsAutoFilledValues?.address
-  ]);
-  const x = ke({
-    mode: "onSubmit",
-    defaultValues: ie(
-      c,
-      q ?? [],
-      J
-    ),
-    values: ie(
-      c,
-      q ?? [],
-      J
-    )
-  }), { isValid: $e } = x.formState, ve = x.handleSubmit(() => {
-    $e && (fe(x.getValues()), z(u, H));
-  }), { vendor1099DetailsAutoFilledValues: f } = g, Se = () => f?.tin.type === !0 || f?.tin.value === !0 || f?.legalName === !0 || f?.taxClassification === !0, je = async (y, d) => {
-    if (y != null) {
-      const h = { ...d }, Ve = h[s].legalName, Pe = h[s].email, Te = h[s].phone, Ie = h[s].taxClassification, Ne = h[s].tinType, te = h[s].tinValue, Ae = {
-        legalName: Ve ?? r.strings.empty,
-        vendorId: u,
-        contact: {
-          email: Pe ?? r.strings.empty,
-          phone: Te ?? r.strings.empty,
-          fullName: c.contact?.fullName ?? r.strings.empty,
-          id: c.contact?.id ?? r.strings.empty
-        },
-        taxClassification: Ie.selectedType ?? r.strings.empty,
-        tin: {
-          type: Ne ?? null,
-          value: te ?? null
-        },
-        tinValue: te ?? null
-      };
-      if (y.includes(`${s}.street`) && d.vendor1099FilingSectionId.street != null) {
-        const { addressValue: L } = d.vendor1099FilingSectionId.street, Be = x.getValues(
-          `${s}.country`
-        ), E = G(L?.country);
-        x.setValue(s, {
-          ...d[s],
-          street: d.vendor1099FilingSectionId.street,
-          city: L?.locality ?? "",
-          state: L?.administrativeAreaLevel1 ?? "",
-          country: E,
-          countryCode: L?.countryCode ?? "",
-          postalCode: L?.postalCode ?? "",
-          secondaryInfo: d.vendor1099FilingSectionId.secondaryInfo ?? "",
-          suite: d.vendor1099FilingSectionId.suite ?? ""
-        }), Oe(
-          x.formState.errors,
-          `${s}.city`
-        ) && L?.locality && x.trigger(`${s}.city`), Be.selectedOption !== E.selectedOption && x.setValue(
-          `${s}.country`,
-          E
-        );
-      } else y === "vendor1099FilingSectionId.country" && d[s].country.selectedOption != null && x.setValue(
-        `${s}.countryCode`,
-        et(d[s].country.selectedOption)
-      );
-      $(Ae);
-    }
-  };
-  B(() => {
-    const y = x.watch((d, { name: h }) => {
-      h != null && d != null && ((h.startsWith(`${s}.street`) || h.startsWith(`${s}.city`) || h.startsWith(`${s}.state`) || h.startsWith(`${s}.country`) || h.startsWith(`${s}.postalCode`)) && d[s] != null && X({
-        street: [
-          d[s].street?.addressString ?? r.strings.empty,
-          d[s].suite ?? r.strings.empty,
-          d[s].secondaryInfo ?? r.strings.empty
-        ],
-        city: d[s].city ?? r.strings.empty,
-        state: d[s].state ?? r.strings.empty,
-        country: d[s].country?.selectedOption ?? r.strings.empty,
-        countryCode: d[s].countryCode,
-        postalCode: d[s].postalCode ?? r.strings.empty
-      }), We(
-        () => je(
-          h,
-          d
-        )
-      ));
-    });
-    return () => {
-      y.unsubscribe();
-    };
-  });
-  const F = w.largeLabelWidth.value(n), Ce = I.error?.message ?? r.strings.empty, Fe = I.error?.title ?? r.strings.empty, Le = () => I?.fetchState === "In-Progress" || K?.fetchState === "In-Progress" || Z?.fetchState === "In-Progress", b = K?.fetchState === "In-Progress" || Z?.fetchState === "In-Progress";
-  return B(() => () => {
-    a.abort(), be();
-  }, []), /* @__PURE__ */ t.jsx(Vt, { windowSize: n, children: /* @__PURE__ */ t.jsxs(Lt, { windowSize: n, children: [
-    /* @__PURE__ */ t.jsxs(Pt, { windowSize: n, ref: Y, children: [
-      /* @__PURE__ */ t.jsx(
-        Ue,
-        {
-          title: (g.vendor1099DetailsAutoFilledValues?.legalName === !0 ? A.current : N.current) ?? r.strings.empty,
-          backgroundColor: m.colors.grey4,
-          leftSideComponent: /* @__PURE__ */ t.jsx(t.Fragment, {}),
-          rightSideComponent: /* @__PURE__ */ t.jsx(
-            It,
-            {
-              windowSize: n,
-              onClick: Q,
-              "data-testid": _e(
-                "vendor-filling-1099-details-editable-page-close-icon"
-              )
-            }
-          ),
-          scrollableContent: Y,
-          enableTitleOnScroll: !0,
-          scrollThreshold: 50,
-          source: "VendorFiling1099EditablePage"
-        }
-      ),
-      b === !0 ? /* @__PURE__ */ t.jsx(ne, { windowSize: n, isLoading: b, children: /* @__PURE__ */ t.jsx(xt, {}) }) : /* @__PURE__ */ t.jsxs(ne, { windowSize: n, isLoading: b, children: [
-        n === "small" ? /* @__PURE__ */ t.jsx(Nt, { windowSize: n, children: g.vendor1099DetailsAutoFilledValues?.legalName === !0 ? A.current : N.current }) : /* @__PURE__ */ t.jsx(At, { children: g.vendor1099DetailsAutoFilledValues?.legalName === !0 ? A.current : N.current }),
-        I.fetchState === "Error" ? /* @__PURE__ */ t.jsxs(Bt, { children: [
-          /* @__PURE__ */ t.jsx(zt, {}),
-          /* @__PURE__ */ t.jsxs(Rt, { children: [
-            /* @__PURE__ */ t.jsx(kt, { children: Fe }),
-            /* @__PURE__ */ t.jsx(Wt, { children: Ce })
-          ] })
-        ] }) : null,
-        Se() && /* @__PURE__ */ t.jsxs(Ht, { children: [
-          /* @__PURE__ */ t.jsx(W, {}),
-          /* @__PURE__ */ t.jsx(qt, { children: S.vendorDetails.banner })
-        ] }),
-        /* @__PURE__ */ t.jsx(ze, { ...x, children: /* @__PURE__ */ t.jsx(
-          "form",
-          {
-            id: D(s),
-            onSubmit: ve,
-            children: /* @__PURE__ */ t.jsxs(Tt, { isLoading: b, children: [
-              /* @__PURE__ */ t.jsx(M, { children: f?.legalName === !0 && !b ? /* @__PURE__ */ t.jsx(W, {}) : null }),
-              /* @__PURE__ */ t.jsx(
-                j,
-                {
-                  label: {
-                    label: R.legalName,
-                    width: F,
-                    style: {
-                      marginLeft: o.sp4
-                    }
-                  },
-                  style: {
-                    width: "auto",
-                    borderTopLeftRadius: o.sp2,
-                    borderTopRightRadius: o.sp2
-                  },
-                  text: {
-                    type: "text",
-                    name: P(s, pe),
-                    defaultValue: c.legalName,
-                    placeholder: S.vendorDetails.legalNamePlaceHolder,
-                    options: {
-                      required: !0,
-                      validate: (y) => y !== r.strings.empty
-                    }
-                  }
-                }
-              ),
-              /* @__PURE__ */ t.jsx(k, {}),
-              /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-                /* @__PURE__ */ t.jsx(
-                  j,
-                  {
-                    label: {
-                      label: R.email,
-                      width: F,
-                      style: {
-                        marginLeft: o.sp4
-                      }
-                    },
-                    style: { width: "auto" },
-                    text: {
-                      type: "email",
-                      name: P(s, ge),
-                      defaultValue: c.contact?.email,
-                      placeholder: S.vendorDetails.emailPlaceHolder,
-                      options: {
-                        required: !1
-                      }
-                    }
-                  }
-                ),
-                /* @__PURE__ */ t.jsx(k, {}),
-                /* @__PURE__ */ t.jsx(
-                  De,
-                  {
-                    label: {
-                      label: R.phone,
-                      width: F,
-                      style: {
-                        marginLeft: o.sp4
-                      }
-                    },
-                    text: {
-                      name: P(s, he),
-                      placeholder: S.vendorDetails.phonePlaceHolder,
-                      defaultValue: c.contact?.phone,
-                      autoComplete: "off",
-                      options: {
-                        required: !1
-                      }
-                    },
-                    style: { width: "auto" }
-                  }
-                ),
-                /* @__PURE__ */ t.jsx(k, {})
-              ] }),
-              /* @__PURE__ */ t.jsxs(Et, { isLoading: b, children: [
-                /* @__PURE__ */ t.jsx(M, { children: f?.taxClassification === !0 && !b ? /* @__PURE__ */ t.jsx(W, {}) : null }),
-                /* @__PURE__ */ t.jsxs(re, { children: [
-                  /* @__PURE__ */ t.jsx(
-                    Ot,
-                    {
-                      width: F,
-                      windowSize: n,
-                      children: R.taxClassification
-                    }
-                  ),
-                  /* @__PURE__ */ t.jsx(
-                    Mt,
-                    {
-                      size: n,
-                      labelWidth: F,
-                      children: /* @__PURE__ */ t.jsx(
-                        Ge,
-                        {
-                          name: P(
-                            s,
-                            me
-                          ),
-                          value: {
-                            allTypes: q?.map((y) => ({
-                              code: y.code,
-                              name: y.name,
-                              label: y.name
-                            })) ?? [],
-                            selectedType: c.taxClassification
-                          },
-                          placeholderLabel: S.vendorDetails.taxClassificationPlaceHolder
-                        }
-                      )
-                    }
-                  )
-                ] })
-              ] }),
-              /* @__PURE__ */ t.jsx(k, {}),
-              /* @__PURE__ */ t.jsx(M, { children: (f?.tin.type === !0 || f?.tin.value === !0) && !b ? /* @__PURE__ */ t.jsx(W, {}) : null }),
-              /* @__PURE__ */ t.jsx(re, { children: /* @__PURE__ */ t.jsx(
-                it,
-                {
-                  name: P(s, xe),
-                  menuPlacement: "auto",
-                  style: {
-                    height: o.sp6,
-                    width: "100%",
-                    marginLeft: o.sp4
-                  },
-                  dropdownStyle: { width: "40%" },
-                  defaultValue: {
-                    dropDownValue: c.tin?.type ?? r.strings.empty,
-                    dropDownList: [
-                      {
-                        code: r.texts.ein,
-                        label: r.texts.ein.toUpperCase()
-                      },
-                      {
-                        code: r.texts.ssn,
-                        label: r.texts.ssn.toUpperCase()
-                      }
-                    ]
-                  },
-                  registerOptions: {
-                    required: !1
-                  },
-                  label: {
-                    width: F
-                  },
-                  placeholderLabel: S.placeholders.tinType,
-                  formattedText: {
-                    type: "text",
-                    name: P(s, ye),
-                    placeholder: S.placeholders.tinValue,
-                    format: c.tin?.type === r.texts.ssn ? Ze : Je,
-                    registerOptions: {
-                      required: !!c?.tin?.type,
-                      pattern: c.tin?.type === r.texts.ssn ? Ke : Qe
-                    },
-                    style: {
-                      width: "100%",
-                      height: o.sp6
-                    },
-                    defaultValue: c.tin?.value ?? r.strings.empty,
-                    maxLength: 9,
-                    allowLeadingZeros: !0,
-                    autoComplete: "new-password",
-                    isDisabled: c.tin?.type === null ? "disabled" : void 0
-                  }
-                }
-              ) }),
-              /* @__PURE__ */ t.jsx(k, {}),
-              /* @__PURE__ */ t.jsxs(Ut, { children: [
-                /* @__PURE__ */ t.jsx(M, { children: f?.address === !0 && !b ? /* @__PURE__ */ t.jsx(W, {}) : null }),
-                /* @__PURE__ */ t.jsx(
-                  Xe,
-                  {
-                    label: R.address,
-                    style: {
-                      marginLeft: o.sp4,
-                      marginTop: w.labelMarginTop.value(n),
-                      marginBottom: o.sp2
-                    }
-                  }
-                ),
-                /* @__PURE__ */ t.jsx(
-                  at,
-                  {
-                    googleAPIKey: we,
-                    formId: D(s),
-                    addressToEdit: C?.addressStatus?.addressToCreate,
-                    sectionId: s
-                  }
-                )
-              ] })
-            ] })
-          }
-        ) })
-      ] })
-    ] }),
-    /* @__PURE__ */ t.jsx(
-      Ye,
-      {
-        separatorStyle: { marginRight: o.sp4 },
-        formId: D(s),
-        cancelBtn: {
-          label: le.cancel,
-          style: { width: "83px" },
-          onClick: Q
-        },
-        primaryBtn: {
-          label: le.save,
-          isLoading: I.fetchState === "In-Progress",
-          style: { width: "83px" },
-          isDisabled: Le()
-        },
-        style: yt
-      }
-    )
-  ] }) });
-}, Lt = i.div`
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  justify-content: space-between;
-`, Vt = i.div`
-  height: 100%;
-`, ne = i.div`
-  padding-left: ${(e) => w.containerPaddingLeft.valuePx(e.windowSize)};
-  padding-right: ${(e) => w.containerPaddingRight.valuePx(e.windowSize)};
-  height: ${(e) => e.isLoading ? void 0 : "100%"};
-  padding-bottom: 112px;
-`, Pt = i.div`
-  display: flex;
-  flex-direction: column;
-  background-color: ${(e) => e.theme.colors.grey4};
-  overflow-x: hidden;
-  height: 100%;
-  width: 100%;
-`, Tt = i.div`
-  display: flex;
-  flex-direction: column;
-  background-color: ${(e) => e.isLoading ? void 0 : e.theme.colors.grey5};
-  border: ${(e) => e.isLoading ? void 0 : `1px solid ${e.theme.colors.grey3}`};
-  box-shadow: ${(e) => e.isLoading ? void 0 : `${o.sp0} 2px ${o.sp1} ${e.theme.colors.dropShadowNormal}`};
-  border-radius: ${o.sp2};
-  position: relative;
-`, k = i.div`
-  display: flex;
-  flex: 1;
-  background-color: ${(e) => e.theme.colors.grey3};
-  min-height: 1px;
-  max-height: 1px;
-`, It = i(tt)`
-  cursor: pointer;
-  color: ${(e) => e.theme.colors.hero};
-  width: ${o.sp4};
-  height: ${o.sp4};
-  min-height: ${o.sp4};
-  &:hover {
-    color: ${(e) => e.theme.colors.primary};
-  }
-`, Nt = i(ot)`
-  color: ${(e) => e.theme.colors.primary};
-  margin-bottom: ${o.sp0};
-  margin-right: ${o.sp3};
-`, At = i(st)`
-  color: ${(e) => e.theme.colors.primary};
-  margin-bottom: ${o.sp4};
-`, Bt = i.div`
-  background-color: ${T.alertLight};
-  border: 1px solid ${T.brandColorGoldDark};
-  border-radius: ${o.sp2};
-  display: flex;
-  gap: ${o.sp2};
-  padding: ${o.sp3} ${o.sp4};
-  margin-bottom: ${o.sp3};
-`, Rt = i.div`
-  display: flex;
-  flex-direction: column;
-`, kt = i(nt)`
-  color: ${T.brandColorGoldDark};
-`, Wt = i(ue)`
-  color: ${T.brandColorGoldDark};
-`, zt = i(lt)`
-  width: ${o.sp4};
-  min-height: ${o.sp4};
-  width: ${o.sp4};
-  height: ${o.sp4};
-  color: ${T.brandColorGoldDark};
-`, re = i.div`
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-  height: ${o.sp8};
-  width: 100%;
-  &:hover {
-    z-index: 1;
-    outline: 1px solid ${(e) => e.theme.colors.primary};
-    input {
-      background-color: ${(e) => e.theme.colors.background};
-    }
-  }
-
-  :first-of-type {
-    border-top-left-radius: inherit;
-    border-top-right-radius: inherit;
-  }
-
-  :last-of-type {
-    border-bottom-left-radius: inherit;
-    border-bottom-right-radius: inherit;
-  }
-`, Ot = i(ue)`
-  width: ${(e) => e.width}px;
-  color: ${(e) => e.theme.colors.hero};
-  margin: ${(e) => `${w.labelMarginTop.valuePx(e.windowSize)} ${w.labelMarginLeft.valuePx(
-  e.windowSize
-)} ${w.labelMarginBottom.valuePx(
-  e.windowSize
-)} ${w.labelMarginLeft.valuePx(e.windowSize)}`};
-  padding-right: ${o.sp5};
-`, Mt = i.div`
-  width: ${(e) => e.labelWidth != null ? `calc(100% - ${e.labelWidth}px)` : "100%"};
-  display: flex;
-  flex-grow: ${(e) => e.size === "small" ? 1 : 0};
-  align-items: center;
-  margin-right: ${o.sp2};
-`, W = i(rt)`
-  color: ${(e) => e.theme.colors.primary};
-  width: ${o.sp3};
-  height: ${o.sp3};
-`, Ht = i.div`
-  display: flex;
-  gap: ${o.sp2};
-  border: 1px solid ${(e) => e.theme.colors.grey3};
-  padding: ${o.sp3};
-  border-radius: ${o.sp2};
-  align-items: center;
-  margin: ${o.sp3};
-  margin-left: ${o.sp0};
-  margin-right: ${o.sp0};
-`, qt = i.span`
-  color: ${(e) => e.theme.colors.hero};
-`, Et = i.div`
-  position: relative;
-`, M = i.div`
-  position: absolute;
-  top: 20px;
-  left: -${o.sp4};
-`, Ut = i.div`
-  display: flex;
-  position: relative;
-  width: 100%;
-  flex-direction: column;
-  z-index: unset;
-
-  &:hover {
-    outline: 1px solid ${(e) => e.theme.colors.primary};
-    border-bottom-left-radius: inherit;
-    border-bottom-right-radius: inherit;
-  }
-`, ie = (e, n, a) => ({
-  //vendor details
-  [s]: {
-    [pe]: e.legalName ?? r.strings.empty,
-    [ge]: e.contact?.email ?? r.strings.empty,
-    [he]: e.contact?.phone ?? r.strings.empty,
-    [me]: {
-      selectedType: e.taxClassification,
-      allTypes: n
-    },
-    [xe]: e.tin?.type ?? null,
-    [ye]: e.tin?.value ?? null,
-    //address details
-    [ft]: {
-      addressString: a?.street[0] ?? "",
-      addressValue: a != null ? ce(a) : void 0
-    },
-    [wt]: a?.city ?? "",
-    [$t]: a?.state ?? "",
-    [vt]: G(a?.country),
-    [St]: a?.countryCode ?? "",
-    [jt]: a?.postalCode ?? "",
-    [Ct]: a?.street[2] ?? "",
-    [bt]: a?.street[1] ?? ""
-  }
-});
-export {
-  Zt as default,
-  D as uniqueFormName
-};