@afosto/checkout-ui 0.0.1-alpha.1

package/dist/CheckoutForm/CheckoutForm.js

@@ -0,0 +1,209 @@
+import { jsxs as l, jsx as r, Fragment as F } from "react/jsx-runtime";
+import { Box as pe, MultiStepForm as de } from "@afosto/components";
+import { useCheckout as me } from "../CheckoutStateProvider/CheckoutStateProvider.js";
+import "react";
+import { createPortal as be } from "react-dom";
+import { isDefined as Se, camelize as fe, wait as he } from "@afosto/utils";
+import { CheckoutFormSkeleton as ve } from "../CheckoutFormSkeleton/CheckoutFormSkeleton.js";
+import { CheckoutSubmitButton as Le } from "../CheckoutSubmitButton/CheckoutSubmitButton.js";
+import { CheckoutTermsAndPrivacyMessage as M } from "../CheckoutTermsAndPrivacyMessage/CheckoutTermsAndPrivacyMessage.js";
+import { getErrorMessage as ge } from "../utils/getErrorMessage.js";
+import { getValidationErrorMessage as ke } from "../utils/getValidationErrorMessage.js";
+import { validationTranslations as xe } from "../constants/validationTranslations.js";
+import { CheckoutErrorMessageAlert as Pe } from "../CheckoutErrorMessageAlert/CheckoutErrorMessageAlert.js";
+const h = {
+  cancelLabel: "Back to webshop",
+  downPaymentSubmitLabel: "Pay deposit & order",
+  nextStepLabel: "To {stepLabel}",
+  nextSubStepLabel: "Continue",
+  postPaidSubmitLabel: "Order with payment obligation",
+  previousStepLabel: "Back to {stepLabel}",
+  submitLabel: "Confirm and pay",
+  feedback: {
+    checkoutFailedTitle: "Could not proceed to payment",
+    checkoutFailedDescription: "Something went wrong while proceeding to the payment. Please try again."
+  },
+  validation: xe
+}, je = (B) => {
+  const {
+    activeStep: T,
+    autoComplete: D = "on",
+    defaultValues: E,
+    errorMessage: N,
+    formRef: v,
+    hideErrorMessage: V = !1,
+    hideForm: L = !1,
+    isLoading: A,
+    onNextStep: R,
+    onPreviousStep: O,
+    onCancel: u,
+    onSubmit: p,
+    steps: j,
+    submitLabel: d,
+    validationSchema: z,
+    translations: m = {},
+    sx: I = {},
+    ...G
+  } = B, n = me(), {
+    activeStep: q = 0,
+    defaultValues: H = [],
+    checkout: J,
+    errorMessage: K,
+    formRef: Q,
+    getNextStepLabel: U,
+    getPreviousStepLabel: W,
+    isLoading: X,
+    isProcessing: g,
+    nextStep: Y,
+    previousStep: Z,
+    setErrorMessage: k,
+    settings: _,
+    steps: $ = [],
+    subStep: ee,
+    submitButtonDisabled: te,
+    submitButtonPortalRef: x,
+    validationSchema: oe,
+    translations: b = {}
+  } = n, { vendor: P } = _?.links ?? {}, e = {
+    ...h,
+    ...b?.checkoutForm || {},
+    ...m || {},
+    feedback: {
+      ...h.feedback,
+      ...b?.checkoutForm?.feedback || {},
+      ...m?.feedback || {}
+    },
+    validation: {
+      ...h.validation,
+      ...b?.validation || {},
+      ...m?.validation || {}
+    }
+  }, s = A ?? X, c = T ?? q, ae = E ?? H, y = N ?? K, ne = R ?? Y, ie = O ?? Z, re = z ?? oe, S = (j ?? $ ?? []).map((t) => {
+    let o = typeof t.nextLabel == "function" ? t.nextLabel({ ...n, translations: e }) : t.nextLabel, a = typeof t.previousLabel == "function" ? t.previousLabel({ ...n, translations: e }) : t.previousLabel;
+    if (!o) {
+      const i = U();
+      i && (o = e.nextStepLabel.replace(
+        "{stepLabel}",
+        i
+      ));
+    }
+    if (!a) {
+      const i = W();
+      i && (a = e.previousStepLabel.replace(
+        "{stepLabel}",
+        i
+      ));
+    }
+    return {
+      ...t,
+      nextLabel: o,
+      previousLabel: a
+    };
+  }), C = c === S.length - 1, w = S[c]?.component, se = async (t, o) => ne(t, o, {
+    ...n,
+    translations: e
+  }), ce = (t) => ie(t, { ...n, translations: e }), le = () => {
+    if (u && typeof u == "function")
+      return u();
+  }, ue = async (t, o) => {
+    if (p && typeof p == "function")
+      return p(t, o, {
+        ...n,
+        translations: e
+      });
+    try {
+      await J(), k(null), await he(5e3);
+    } catch (a) {
+      const i = ge(a);
+      return k({
+        title: e.feedback?.checkoutFailedTitle,
+        description: i || e.feedback?.checkoutFailedDescription
+      }), Promise.reject(a);
+    }
+  }, f = typeof d == "function" ? d({ ...n, translations: e }) : d ?? (() => {
+    const { summary: t } = n, { agreementTemplate: o } = t || {}, a = fe(
+      o?.type?.toLowerCase() || ""
+    );
+    return a === "downPayment" ? e.downPaymentSubmitLabel : ["cod", "postPaid"].includes(a) ? e.postPaidSubmitLabel : e.submitLabel;
+  })();
+  return /* @__PURE__ */ l(pe, { sx: L ? { display: "none" } : I, children: [
+    /* @__PURE__ */ l(
+      de,
+      {
+        ...G,
+        actionsAlignment: "space-between",
+        actionsContainerProps: {
+          sx: {
+            flexDirection: { xs: "column-reverse", md: "row" },
+            gap: 1.5,
+            mt: 1
+          }
+        },
+        activeStep: c,
+        autoComplete: D,
+        cancelLabel: e.cancelLabel,
+        defaultValues: ae,
+        formRef: [
+          Q,
+          ...v ? [v] : []
+        ],
+        getErrorMessage: ke(e.validation),
+        hideActions: s,
+        onNextStep: se,
+        onPreviousStep: ce,
+        onCancel: le,
+        onSubmit: ue,
+        subStep: ee,
+        steps: S,
+        cancelButtonProps: {
+          ...c === 0 && Se(P) ? { href: P } : {},
+          disabled: g,
+          size: "large"
+        },
+        submitButtonProps: {
+          disabled: te,
+          loading: g,
+          size: "large"
+        },
+        submitLabel: f,
+        validationSchema: re,
+        children: [
+          !s && y && !V && /* @__PURE__ */ r(
+            Pe,
+            {
+              errorMessage: y,
+              sx: { mt: 1.5, mb: 3 }
+            }
+          ),
+          !s && w && /* @__PURE__ */ l(F, { children: [
+            /* @__PURE__ */ r(w, {}),
+            !L && x.current && be(
+              /* @__PURE__ */ l(F, { children: [
+                /* @__PURE__ */ r(Le, { sx: { mt: 0.5 } }),
+                C && /* @__PURE__ */ r(
+                  M,
+                  {
+                    submitLabel: f,
+                    sx: { mt: 3 }
+                  }
+                )
+              ] }),
+              x.current
+            )
+          ] }),
+          s && /* @__PURE__ */ r(ve, {})
+        ]
+      }
+    ),
+    C && /* @__PURE__ */ r(
+      M,
+      {
+        submitLabel: f,
+        sx: { display: { md: "none" }, mt: 3, textAlign: "center" }
+      }
+    )
+  ] });
+};
+export {
+  je as CheckoutForm
+};

package/dist/CheckoutForm/index.d.ts

@@ -0,0 +1,3 @@
+export { CheckoutForm } from './CheckoutForm';
+export type { CheckoutFormProps } from './CheckoutForm';
+//# sourceMappingURL=index.d.ts.map

package/dist/CheckoutForm/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../libs/checkout-ui/src/CheckoutForm/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/CheckoutForm/index.js

@@ -0,0 +1,4 @@
+import { CheckoutForm as e } from "./CheckoutForm.js";
+export {
+  e as CheckoutForm
+};

package/dist/CheckoutFormSkeleton/CheckoutFormSkeleton.d.ts

@@ -0,0 +1,4 @@
+import { BoxProps } from '@afosto/components';
+export type CheckoutFormSkeletonProps = Omit<BoxProps, 'ref'>;
+export declare const CheckoutFormSkeleton: (props: CheckoutFormSkeletonProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CheckoutFormSkeleton.d.ts.map

package/dist/CheckoutFormSkeleton/CheckoutFormSkeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckoutFormSkeleton.d.ts","sourceRoot":"","sources":["../../libs/checkout-ui/src/CheckoutFormSkeleton/CheckoutFormSkeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,QAAQ,EAAkB,MAAM,oBAAoB,CAAC;AAExE,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;AAE9D,eAAO,MAAM,oBAAoB,GAAI,OAAO,yBAAyB,qDAmEpE,CAAC"}

package/dist/CheckoutFormSkeleton/CheckoutFormSkeleton.js

@@ -0,0 +1,61 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { Box as r, Skeleton as i, Grid as h } from "@afosto/components";
+const x = (d) => /* @__PURE__ */ t(r, { ...d, children: [
+  /* @__PURE__ */ e(i, { height: 36, width: 200, sx: { mb: 2.5 } }),
+  /* @__PURE__ */ t(h, { container: !0, spacing: 2, children: [
+    /* @__PURE__ */ e(h, { item: !0, xs: 12, children: /* @__PURE__ */ t(r, { sx: { display: "flex", gap: 3 }, children: [
+      /* @__PURE__ */ t(r, { sx: { display: "flex", alignItems: "center", gap: 1.5 }, children: [
+        /* @__PURE__ */ e(i, { variant: "circular", height: 16, width: 16 }),
+        /* @__PURE__ */ e(i, { height: 32, width: 100 })
+      ] }),
+      /* @__PURE__ */ t(r, { sx: { display: "flex", alignItems: "center", gap: 1.5 }, children: [
+        /* @__PURE__ */ e(i, { variant: "circular", height: 16, width: 16 }),
+        /* @__PURE__ */ e(i, { height: 32, width: 100 })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ t(h, { item: !0, xs: 12, children: [
+      /* @__PURE__ */ e(i, { height: 24, width: 150 }),
+      /* @__PURE__ */ e(i, { height: 40 })
+    ] }),
+    /* @__PURE__ */ t(h, { item: !0, xs: 12, children: [
+      /* @__PURE__ */ e(i, { height: 24, width: 150 }),
+      /* @__PURE__ */ e(i, { height: 40 })
+    ] })
+  ] }),
+  /* @__PURE__ */ e(i, { height: 36, width: 200, sx: { mt: 6, mb: 2.5 } }),
+  /* @__PURE__ */ e(h, { container: !0, spacing: 2, children: /* @__PURE__ */ e(h, { item: !0, xs: 12, children: /* @__PURE__ */ e(i, { height: 40, sx: { mb: 2 } }) }) }),
+  /* @__PURE__ */ t(h, { container: !0, spacing: 2, children: [
+    /* @__PURE__ */ t(h, { item: !0, xs: 12, md: 4, children: [
+      /* @__PURE__ */ e(i, { height: 24, width: "50%" }),
+      /* @__PURE__ */ e(i, { height: 40, sx: { flex: 1 } })
+    ] }),
+    /* @__PURE__ */ t(h, { item: !0, xs: 12, md: 4, children: [
+      /* @__PURE__ */ e(i, { height: 24, width: "50%" }),
+      /* @__PURE__ */ e(i, { height: 40, sx: { flex: 1 } })
+    ] }),
+    /* @__PURE__ */ t(h, { item: !0, xs: 12, md: 4, children: [
+      /* @__PURE__ */ e(i, { height: 24, width: "50%" }),
+      /* @__PURE__ */ e(i, { height: 40, sx: { flex: 1 } })
+    ] })
+  ] }),
+  /* @__PURE__ */ e(i, { height: 24, width: 150, sx: { mt: 2 } }),
+  /* @__PURE__ */ e(i, { height: 40, sx: { mb: 2 } }),
+  /* @__PURE__ */ t(h, { container: !0, spacing: 2, children: [
+    /* @__PURE__ */ t(h, { item: !0, xs: 12, md: 6, children: [
+      /* @__PURE__ */ e(i, { height: 24, width: "50%" }),
+      /* @__PURE__ */ e(i, { height: 40, sx: { flex: 1 } })
+    ] }),
+    /* @__PURE__ */ t(h, { item: !0, xs: 12, md: 3, children: [
+      /* @__PURE__ */ e(i, { height: 24, width: "50%" }),
+      /* @__PURE__ */ e(i, { height: 40, sx: { flex: 1 } })
+    ] }),
+    /* @__PURE__ */ t(h, { item: !0, xs: 12, md: 3, children: [
+      /* @__PURE__ */ e(i, { height: 24, width: "50%" }),
+      /* @__PURE__ */ e(i, { height: 40, sx: { flex: 1 } })
+    ] })
+  ] }),
+  /* @__PURE__ */ e(r, { sx: { display: "flex", justifyContent: "flex-end", mt: 4 }, children: /* @__PURE__ */ e(i, { height: 60, sx: { width: { xs: "100%", md: 150 } } }) })
+] });
+export {
+  x as CheckoutFormSkeleton
+};

package/dist/CheckoutFormSkeleton/index.d.ts

@@ -0,0 +1,3 @@
+export { CheckoutFormSkeleton } from './CheckoutFormSkeleton';
+export type { CheckoutFormSkeletonProps } from './CheckoutFormSkeleton';
+//# sourceMappingURL=index.d.ts.map

package/dist/CheckoutFormSkeleton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../libs/checkout-ui/src/CheckoutFormSkeleton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,YAAY,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/CheckoutFormSkeleton/index.js

@@ -0,0 +1,4 @@
+import { CheckoutFormSkeleton as r } from "./CheckoutFormSkeleton.js";
+export {
+  r as CheckoutFormSkeleton
+};

package/dist/CheckoutInformationStep/CheckoutInformationStep.d.ts

@@ -0,0 +1,18 @@
+import { CheckoutContactInformationSectionProps } from '../CheckoutContactInformationSection/CheckoutContactInformationSection';
+import { CheckoutTypeSectionProps } from '../CheckoutTypeSection/CheckoutTypeSection';
+import { CheckoutBusinessInformationSectionProps } from '../CheckoutBusinessInformationSection';
+import { CheckoutShippingAddressSectionProps } from '../CheckoutShippingAddressSection/CheckoutShippingAddressSection';
+import { CheckoutBillingAddressSectionProps } from '../CheckoutBillingAddressSection/CheckoutBillingAddressSection';
+import { CheckoutExpressCheckoutSectionProps } from '../CheckoutExpressCheckoutSection/CheckoutExpressCheckoutSection';
+export interface CheckoutInformationStepProps {
+    translations?: {
+        billingAddressSection?: CheckoutBillingAddressSectionProps['translations'];
+        businessInformationSection?: CheckoutBusinessInformationSectionProps['translations'];
+        contactInformationSection?: CheckoutContactInformationSectionProps['translations'];
+        expressCheckoutSection?: CheckoutExpressCheckoutSectionProps['translations'];
+        shippingAddressSection?: CheckoutShippingAddressSectionProps['translations'];
+        typeSection?: CheckoutTypeSectionProps['translations'];
+    };
+}
+export declare const CheckoutInformationStep: (props: CheckoutInformationStepProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CheckoutInformationStep.d.ts.map

package/dist/CheckoutInformationStep/CheckoutInformationStep.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckoutInformationStep.d.ts","sourceRoot":"","sources":["../../libs/checkout-ui/src/CheckoutInformationStep/CheckoutInformationStep.tsx"],"names":[],"mappings":"AAGA,OAAO,EAEL,KAAK,sCAAsC,EAC5C,MAAM,wEAAwE,CAAC;AAChF,OAAO,EAEL,KAAK,wBAAwB,EAC9B,MAAM,4CAA4C,CAAC;AAEpD,OAAO,EAEL,KAAK,uCAAuC,EAC7C,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAEL,KAAK,mCAAmC,EACzC,MAAM,kEAAkE,CAAC;AAC1E,OAAO,EAEL,KAAK,kCAAkC,EACxC,MAAM,gEAAgE,CAAC;AACxE,OAAO,EAEL,KAAK,mCAAmC,EACzC,MAAM,kEAAkE,CAAC;AAE1E,MAAM,WAAW,4BAA4B;IAC3C,YAAY,CAAC,EAAE;QACb,qBAAqB,CAAC,EAAE,kCAAkC,CAAC,cAAc,CAAC,CAAC;QAC3E,0BAA0B,CAAC,EAAE,uCAAuC,CAAC,cAAc,CAAC,CAAC;QACrF,yBAAyB,CAAC,EAAE,sCAAsC,CAAC,cAAc,CAAC,CAAC;QACnF,sBAAsB,CAAC,EAAE,mCAAmC,CAAC,cAAc,CAAC,CAAC;QAC7E,sBAAsB,CAAC,EAAE,mCAAmC,CAAC,cAAc,CAAC,CAAC;QAC7E,WAAW,CAAC,EAAE,wBAAwB,CAAC,cAAc,CAAC,CAAC;KACxD,CAAC;CACH;AAED,eAAO,MAAM,uBAAuB,GAClC,OAAO,4BAA4B,qDAmDpC,CAAC"}

package/dist/CheckoutInformationStep/CheckoutInformationStep.js

@@ -0,0 +1,56 @@
+import { jsxs as u, Fragment as g, jsx as o } from "react/jsx-runtime";
+import { useFormContext as f, Collapse as i } from "@afosto/components";
+import { CheckoutContactInformationSection as C } from "../CheckoutContactInformationSection/CheckoutContactInformationSection.js";
+import { CheckoutTypeSection as k } from "../CheckoutTypeSection/CheckoutTypeSection.js";
+import { useCheckout as x } from "../CheckoutStateProvider/CheckoutStateProvider.js";
+import { CheckoutBusinessInformationSection as A } from "../CheckoutBusinessInformationSection/CheckoutBusinessInformationSection.js";
+import { CheckoutShippingAddressSection as y } from "../CheckoutShippingAddressSection/CheckoutShippingAddressSection.js";
+import { CheckoutBillingAddressSection as B } from "../CheckoutBillingAddressSection/CheckoutBillingAddressSection.js";
+import { CheckoutExpressCheckoutSection as I } from "../CheckoutExpressCheckoutSection/CheckoutExpressCheckoutSection.js";
+const P = (e) => {
+  const { translations: t = {} } = e || {}, { expressPaymentMethods: r, isSignedIn: a, settings: c } = x(), { isB2bExcluded: p, isB2cExcluded: m } = c || {}, { watch: d } = f(), [h, l, n] = d([
+    "organisation",
+    "type",
+    "sameBillingAsShippingAddress"
+  ]), s = l === "business", S = !(h?.type?.toLowerCase() === "shared") && !p && !m;
+  return /* @__PURE__ */ u(g, { children: [
+    !a && r.length > 0 && /* @__PURE__ */ o(
+      I,
+      {
+        translations: t.expressCheckoutSection,
+        sx: {
+          mb: 3
+        }
+      }
+    ),
+    /* @__PURE__ */ o(
+      C,
+      {
+        translations: t.contactInformationSection
+      }
+    ),
+    S && /* @__PURE__ */ o(k, { translations: t.typeSection }),
+    /* @__PURE__ */ o(i, { in: s, children: /* @__PURE__ */ o(
+      A,
+      {
+        translations: t.businessInformationSection
+      }
+    ) }),
+    /* @__PURE__ */ o(
+      y,
+      {
+        showOrganisationField: !n && s,
+        translations: t.shippingAddressSection
+      }
+    ),
+    /* @__PURE__ */ o(i, { in: !n, children: /* @__PURE__ */ o(
+      B,
+      {
+        translations: t.billingAddressSection
+      }
+    ) })
+  ] });
+};
+export {
+  P as CheckoutInformationStep
+};

package/dist/CheckoutInformationStep/index.d.ts

@@ -0,0 +1,3 @@
+export { CheckoutInformationStep } from './CheckoutInformationStep';
+export type { CheckoutInformationStepProps } from './CheckoutInformationStep';
+//# sourceMappingURL=index.d.ts.map

package/dist/CheckoutInformationStep/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../libs/checkout-ui/src/CheckoutInformationStep/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AACpE,YAAY,EAAE,4BAA4B,EAAE,MAAM,2BAA2B,CAAC"}

package/dist/CheckoutInformationStep/index.js

@@ -0,0 +1,4 @@
+import { CheckoutInformationStep as e } from "./CheckoutInformationStep.js";
+export {
+  e as CheckoutInformationStep
+};

package/dist/CheckoutIssuersField/CheckoutIssuersField.d.ts

@@ -0,0 +1,15 @@
+import { CheckoutPaymentMethodIssuer, DeepPartial } from '../types';
+declare const defaultTranslations: {
+    failedToSelectIssuerTitle: string;
+    failedToSelectIssuerDescription: string;
+    issuerFieldPlaceholder: string;
+};
+export interface CheckoutIssuersFieldProps {
+    disabled?: boolean;
+    name?: string;
+    issuers: CheckoutPaymentMethodIssuer[];
+    translations?: DeepPartial<typeof defaultTranslations>;
+}
+export declare const CheckoutIssuersField: (props: CheckoutIssuersFieldProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=CheckoutIssuersField.d.ts.map

package/dist/CheckoutIssuersField/CheckoutIssuersField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckoutIssuersField.d.ts","sourceRoot":"","sources":["../../libs/checkout-ui/src/CheckoutIssuersField/CheckoutIssuersField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,2BAA2B,EAC3B,WAAW,EAEZ,MAAM,UAAU,CAAC;AAQlB,QAAA,MAAM,mBAAmB;;;;CAKxB,CAAC;AAEF,MAAM,WAAW,yBAAyB;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,2BAA2B,EAAE,CAAC;IACvC,YAAY,CAAC,EAAE,WAAW,CAAC,OAAO,mBAAmB,CAAC,CAAC;CACxD;AAED,eAAO,MAAM,oBAAoB,GAAI,OAAO,yBAAyB,qDAwHpE,CAAC"}

package/dist/CheckoutIssuersField/CheckoutIssuersField.js

@@ -0,0 +1,83 @@
+import { jsx as l, jsxs as f } from "react/jsx-runtime";
+import { useFormContext as F, Fields as v, Typography as z, Box as I } from "@afosto/components";
+import { useCheckout as M } from "../CheckoutStateProvider/CheckoutStateProvider.js";
+import { getErrorMessage as V } from "../utils/getErrorMessage.js";
+import { camelize as g, capitalize as O } from "@afosto/utils";
+import { CHECKOUT_ISSUER_ICON_MAPPING as C } from "../constants/issuerIconMapping.js";
+const _ = {
+  failedToSelectIssuerTitle: "Issuer not selected",
+  failedToSelectIssuerDescription: "Something went wrong while selecting the issuer. Choose another issuer or try again.",
+  issuerFieldPlaceholder: "Choose a bank"
+}, D = (y) => {
+  const {
+    disabled: x,
+    name: n = "issuerId",
+    issuers: c = [],
+    translations: S = {}
+  } = y, {
+    activeStep: d,
+    addPaymentMethod: T,
+    setErrorMessage: u,
+    setIsProcessing: a,
+    translations: m
+  } = M(), { formProps: P, getValues: w, setValue: p, watch: b } = F(), { setData: k } = P || {}, [h] = b([n]), i = {
+    ..._,
+    ...m?.issuersField || {},
+    ...m?.feedback || {},
+    ...S || {}
+  }, E = async (e) => {
+    const r = h || "";
+    try {
+      u(null), a(!0);
+      const { value: s } = e.target, t = w();
+      p(n, s || ""), await T({
+        methodId: t.methodId,
+        issuerId: s
+      }), k((o) => (o.splice(d, 1, {
+        ...o[d],
+        issuerId: s || ""
+      }), o)), a(!1);
+    } catch (s) {
+      const t = V(s);
+      u({
+        title: i.failedToSelectIssuerTitle,
+        description: t ? O(t) : i.failedToSelectIssuerDescription
+      }), p(n, r), a(!1);
+    }
+  };
+  return /* @__PURE__ */ l(
+    v.Select,
+    {
+      displayEmpty: !0,
+      disabled: x,
+      name: n,
+      onChange: E,
+      options: c.map((e) => ({
+        ...e,
+        value: e.id
+      })),
+      placeholder: i.issuerFieldPlaceholder,
+      renderOption: (e) => {
+        const r = typeof e.value == "string" ? g(e.value?.toLowerCase() || "") : "", s = C[r];
+        return /* @__PURE__ */ f(I, { sx: { display: "flex", alignItems: "center" }, children: [
+          s && /* @__PURE__ */ l(s, { sx: { fontSize: 20, mr: 1.5 } }),
+          e.label || ""
+        ] });
+      },
+      renderValue: (e) => {
+        if (!e)
+          return /* @__PURE__ */ l(z, { color: "gray.600", children: i.issuerFieldPlaceholder });
+        const r = c.find((o) => o.id === e), s = typeof e == "string" ? g(e?.toLowerCase() || "") : "", t = C[s];
+        return /* @__PURE__ */ f(I, { sx: { display: "flex", alignItems: "center" }, children: [
+          t && /* @__PURE__ */ l(t, { sx: { fontSize: 20, mr: 1.5 } }),
+          r?.label || ""
+        ] });
+      },
+      value: h,
+      fullWidth: !0
+    }
+  );
+};
+export {
+  D as CheckoutIssuersField
+};

package/dist/CheckoutIssuersField/index.d.ts

@@ -0,0 +1,3 @@
+export { CheckoutIssuersField } from './CheckoutIssuersField';
+export type { CheckoutIssuersFieldProps } from './CheckoutIssuersField';
+//# sourceMappingURL=index.d.ts.map

package/dist/CheckoutIssuersField/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../libs/checkout-ui/src/CheckoutIssuersField/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,YAAY,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/CheckoutIssuersField/index.js

@@ -0,0 +1,4 @@
+import { CheckoutIssuersField as r } from "./CheckoutIssuersField.js";
+export {
+  r as CheckoutIssuersField
+};

package/dist/CheckoutItem/CheckoutItem.d.ts

@@ -0,0 +1,11 @@
+import { CardProps } from '@afosto/components';
+import { CheckoutBaseItem } from '../types';
+export interface CheckoutItemProps extends Omit<CardProps, 'variant'> {
+    currency?: string;
+    divider?: boolean;
+    item: CheckoutBaseItem;
+    locale?: string;
+    variant?: 'flat' | 'card';
+}
+export declare const CheckoutItem: (props: CheckoutItemProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CheckoutItem.d.ts.map

package/dist/CheckoutItem/CheckoutItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckoutItem.d.ts","sourceRoot":"","sources":["../../libs/checkout-ui/src/CheckoutItem/CheckoutItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,KAAK,SAAS,EAEf,MAAM,oBAAoB,CAAC;AAI5B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAEjD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,SAAS,EAAE,SAAS,CAAC;IACnE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,gBAAgB,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC3B;AA2DD,eAAO,MAAM,YAAY,GAAI,OAAO,iBAAiB,qDA+EpD,CAAC"}