@mintmoney/react 0.1.0-alpha-1 → 0.1.0-alpha.11

package/dist/esm/api/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/api/types.ts"],"names":[],"mappings":""}

package/dist/esm/checkout/container.js

@@ -0,0 +1,10 @@
+import { styled } from "styled-components";
+export const ModalViewContainer = styled.div`
+  position: relative;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  gap: 24px;
+  width: 100%;
+`;
+//# sourceMappingURL=container.js.map

package/dist/esm/checkout/container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"container.js","sourceRoot":"","sources":["../../../src/checkout/container.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;CAO3C,CAAC"}

package/dist/esm/checkout/index.js

@@ -0,0 +1,44 @@
+"use client";
+import {
+  jsx as _jsx,
+  Fragment as _Fragment,
+  jsxs as _jsxs,
+} from "react/jsx-runtime";
+import { useState, cloneElement } from "react";
+import { StyledButton } from "../components/index.js";
+import { CheckoutModal } from "./modal.js";
+export function Checkout({ createPayment, asChild, children }) {
+  const [isOpen, openModal] = useState(false);
+  const [payment, setPayment] = useState(null);
+  const handleCheckout = async () => {
+    try {
+      const payment = await createPayment();
+      setPayment(payment);
+      openModal(true);
+    } catch (error) {
+      console.error("Error creating payment:", error);
+    }
+  };
+  const trigger =
+    asChild && children
+      ? cloneElement(children, {
+          onClick: handleCheckout,
+        })
+      : _jsx(StyledButton, {
+          variant: "primary",
+          onClick: handleCheckout,
+          children: "Pay Now",
+        });
+  return _jsxs(_Fragment, {
+    children: [
+      trigger,
+      payment &&
+        _jsx(CheckoutModal, {
+          open: isOpen,
+          onOpenChange: openModal,
+          payment: payment,
+        }),
+    ],
+  });
+}
+//# sourceMappingURL=index.js.map

package/dist/esm/checkout/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/checkout/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAa,MAAM,OAAO,CAAC;AAG1D,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAEtD,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAS3C,MAAM,UAAU,QAAQ,CAAC,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAiB;IAC1E,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IACrD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAiB,IAAI,CAAC,CAAC;IAE7D,MAAM,cAAc,GAAG,KAAK,IAAI,EAAE;QAChC,IAAI,CAAC;YACH,MAAM,OAAO,GAAG,MAAM,aAAa,EAAE,CAAC;YACtC,UAAU,CAAC,OAAO,CAAC,CAAC;YACpB,SAAS,CAAC,IAAI,CAAC,CAAC;QAClB,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,OAAO,CAAC,KAAK,CAAC,yBAAyB,EAAE,KAAK,CAAC,CAAC;QAClD,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,OAAO,GACX,OAAO,IAAI,QAAQ,CAAC,CAAC,CAAC,CACpB,YAAY,CAAC,QAA8B,EAAE;QAC3C,OAAO,EAAE,cAAc;KACxB,CAAC,CACH,CAAC,CAAC,CAAC,CACF,KAAC,YAAY,IAAC,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,cAAc,wBAE1C,CAChB,CAAC;IAEJ,OAAO,CACL,8BACG,OAAO,EAEP,OAAO,IAAI,CACV,KAAC,aAAa,IACZ,IAAI,EAAE,MAAM,EACZ,YAAY,EAAE,SAAS,EACvB,OAAO,EAAE,OAAO,GAChB,CACH,IACA,CACJ,CAAC;AACJ,CAAC"}

package/dist/esm/checkout/modal.js

@@ -0,0 +1,76 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { ModalWithView } from "../components/modals/modal-with-views.js";
+import { ModalBackButton } from "./views/back.js";
+import { CardIntentViewContent } from "./views/card-intent/details.js";
+import { CryptontentSelectCurrencyViewContent } from "./views/crypto-intent/curreny.js";
+import { CryptoIntentDirectDetailsViewContent } from "./views/crypto-intent/direct-details.js";
+import { CryptoIntentViewContent } from "./views/crypto-intent/methods.js";
+import { CryptoIntentPaymentStatusViewContent } from "./views/crypto-intent/processing.js";
+import { CryptoIntentPaymentSuccessViewContent } from "./views/crypto-intent/success.js";
+import { InitialiseCheckoutViewContent } from "./views/initial.js";
+import { MethodSelectViewContent } from "./views/method-select.js";
+export const CheckoutModal = (props) => {
+  return _jsx(ModalWithView, {
+    className: "mm-checkout-modal",
+    initialView: "initial",
+    isOpen: props.open,
+    onOpenChange: props.onOpenChange,
+    views: {
+      initial: {
+        title: "",
+        content: () =>
+          _jsx(InitialiseCheckoutViewContent, { payment: props.payment }),
+      },
+      methods: {
+        title: "Order Summary",
+        content: () => _jsx(MethodSelectViewContent, {}),
+      },
+      cryptoIntent: {
+        title: "Pay with Crypto",
+        content: () => _jsx(CryptoIntentViewContent, {}),
+        footer: () => _jsx(ModalBackButton, { view: "methods" }),
+      },
+      cryptoIntentSelectCurrency: {
+        title: "Select Currency",
+        content: () => _jsx(CryptontentSelectCurrencyViewContent, {}),
+        footer: () => _jsx(ModalBackButton, { view: "cryptoIntent" }),
+      },
+      cryptoIntentDirectDetails: {
+        title: "Pay Direct",
+        content: () => _jsx(CryptoIntentDirectDetailsViewContent, {}),
+        footer: () => _jsx(ModalBackButton, { view: "cryptoIntent" }),
+      },
+      cryptoIntentPaymentStatus: {
+        title: "Payment Processing",
+        content: () => _jsx(CryptoIntentPaymentStatusViewContent, {}),
+      },
+      cryptoIntentPaymentSuccess: {
+        title: "Payment Successful",
+        content: () =>
+          _jsx(CryptoIntentPaymentSuccessViewContent, {
+            onClose: props.onOpenChange,
+          }),
+      },
+      cardIntent: {
+        title: "Pay by Card",
+        content: () => _jsx(CardIntentViewContent, {}),
+        footer: () => _jsx(ModalBackButton, { view: "methods" }),
+      },
+      success: {
+        title: "Payment Successful",
+        header: () =>
+          _jsx("p", { className: "", children: "Transfer complete" }),
+        content: () => _jsx(_Fragment, {}),
+        footer: () => _jsx("button", { className: "", children: "Success" }),
+      },
+      failed: {
+        title: "Payment Failed",
+        header: () => _jsx("p", { className: "", children: "Failed" }),
+        content: () => _jsx(_Fragment, {}),
+        navigateButtonPosition: "center",
+        navigateShouldGoToView: "methods",
+      },
+    },
+  });
+};
+//# sourceMappingURL=modal.js.map

package/dist/esm/checkout/modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal.js","sourceRoot":"","sources":["../../../src/checkout/modal.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,0CAA0C,CAAC;AAEzE,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,EAAE,oCAAoC,EAAE,MAAM,kCAAkC,CAAC;AACxF,OAAO,EAAE,oCAAoC,EAAE,MAAM,yCAAyC,CAAC;AAC/F,OAAO,EAAE,uBAAuB,EAAE,MAAM,kCAAkC,CAAC;AAC3E,OAAO,EAAE,oCAAoC,EAAE,MAAM,qCAAqC,CAAC;AAC3F,OAAO,EAAE,qCAAqC,EAAE,MAAM,kCAAkC,CAAC;AACzF,OAAO,EAAE,6BAA6B,EAAE,MAAM,oBAAoB,CAAC;AACnE,OAAO,EAAE,uBAAuB,EAAE,MAAM,0BAA0B,CAAC;AAQnE,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAyB,EAAE,EAAE;IACzD,OAAO,CACL,KAAC,aAAa,IACZ,SAAS,EAAC,mBAAmB,EAC7B,WAAW,EAAC,SAAS,EACrB,MAAM,EAAE,KAAK,CAAC,IAAI,EAClB,YAAY,EAAE,KAAK,CAAC,YAAY,EAChC,KAAK,EAAE;YACL,OAAO,EAAE;gBACP,KAAK,EAAE,EAAE;gBACT,OAAO,EAAE,GAAG,EAAE,CAAC,CACb,KAAC,6BAA6B,IAAC,OAAO,EAAE,KAAK,CAAC,OAAO,GAAI,CAC1D;aACF;YACD,OAAO,EAAE;gBACP,KAAK,EAAE,eAAe;gBACtB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAC,uBAAuB,KAAG;aAC3C;YACD,YAAY,EAAE;gBACZ,KAAK,EAAE,iBAAiB;gBACxB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAC,uBAAuB,KAAG;gBAC1C,MAAM,EAAE,GAAG,EAAE,CAAC,KAAC,eAAe,IAAC,IAAI,EAAC,SAAS,GAAG;aACjD;YACD,0BAA0B,EAAE;gBAC1B,KAAK,EAAE,iBAAiB;gBACxB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAC,oCAAoC,KAAG;gBACvD,MAAM,EAAE,GAAG,EAAE,CAAC,KAAC,eAAe,IAAC,IAAI,EAAC,cAAc,GAAG;aACtD;YACD,yBAAyB,EAAE;gBACzB,KAAK,EAAE,YAAY;gBACnB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAC,oCAAoC,KAAG;gBACvD,MAAM,EAAE,GAAG,EAAE,CAAC,KAAC,eAAe,IAAC,IAAI,EAAC,cAAc,GAAG;aACtD;YACD,yBAAyB,EAAE;gBACzB,KAAK,EAAE,oBAAoB;gBAC3B,OAAO,EAAE,GAAG,EAAE,CAAC,KAAC,oCAAoC,KAAG;aACxD;YACD,0BAA0B,EAAE;gBAC1B,KAAK,EAAE,oBAAoB;gBAC3B,OAAO,EAAE,GAAG,EAAE,CAAC,CACb,KAAC,qCAAqC,IACpC,OAAO,EAAE,KAAK,CAAC,YAAY,GAC3B,CACH;aACF;YACD,UAAU,EAAE;gBACV,KAAK,EAAE,aAAa;gBACpB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAC,qBAAqB,KAAG;gBACxC,MAAM,EAAE,GAAG,EAAE,CAAC,KAAC,eAAe,IAAC,IAAI,EAAC,SAAS,GAAG;aACjD;YACD,OAAO,EAAE;gBACP,KAAK,EAAE,oBAAoB;gBAC3B,MAAM,EAAE,GAAG,EAAE,CAAC,YAAG,SAAS,EAAC,EAAE,kCAAsB;gBACnD,OAAO,EAAE,GAAG,EAAE,CAAC,mBAAK;gBACpB,MAAM,EAAE,GAAG,EAAE,CAAC,iBAAQ,SAAS,EAAC,EAAE,wBAAiB;aACpD;YACD,MAAM,EAAE;gBACN,KAAK,EAAE,gBAAgB;gBACvB,MAAM,EAAE,GAAG,EAAE,CAAC,YAAG,SAAS,EAAC,EAAE,uBAAW;gBACxC,OAAO,EAAE,GAAG,EAAE,CAAC,mBAAK;gBACpB,sBAAsB,EAAE,QAAQ;gBAChC,sBAAsB,EAAE,SAAS;aAClC;SACF,GACD,CACH,CAAC;AACJ,CAAC,CAAC"}

package/dist/esm/checkout/views/back.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useModalWithView, StyledButton } from "../../components/index.js";
+const ModalBackButton = ({ view }) => {
+  const { goToView } = useModalWithView();
+  return _jsx(StyledButton, {
+    onClick: () => goToView(view),
+    variant: "secondary",
+    children: "Back",
+  });
+};
+export { ModalBackButton };
+//# sourceMappingURL=back.js.map

package/dist/esm/checkout/views/back.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"back.js","sourceRoot":"","sources":["../../../../src/checkout/views/back.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAM3E,MAAM,eAAe,GAAG,CAAC,EAAE,IAAI,EAAmB,EAAE,EAAE;IACpD,MAAM,EAAE,QAAQ,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAExC,OAAO,CACL,KAAC,YAAY,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,WAAW,qBAElD,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,eAAe,EAAE,CAAC"}

package/dist/esm/checkout/views/card-intent/details.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from "react";
+import { StyledButton } from "../../../components/buttons/index.js";
+import { useMintMoneyConfig } from "../../../context.js";
+import { ModalViewContainer } from "../../container.js";
+const CardIntentViewContent = () => {
+  const modalRef = useRef(null);
+  const config = useMintMoneyConfig();
+  return _jsx(ModalViewContainer, {
+    ref: modalRef,
+    children: _jsxs("div", {
+      className: "button-group",
+      children: [
+        _jsx(StyledButton, {
+          variant: "primary",
+          theme: config.theme,
+          children: "Connect Wallet",
+        }),
+        _jsx(StyledButton, {
+          variant: "primary",
+          theme: config.theme,
+          children: "Direct Payment",
+        }),
+      ],
+    }),
+  });
+};
+export { CardIntentViewContent };
+//# sourceMappingURL=details.js.map

package/dist/esm/checkout/views/card-intent/details.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"details.js","sourceRoot":"","sources":["../../../../../src/checkout/views/card-intent/details.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,YAAY,EAAE,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAExD,MAAM,qBAAqB,GAAG,GAAG,EAAE;IACjC,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC9C,MAAM,MAAM,GAAG,kBAAkB,EAAE,CAAC;IAEpC,OAAO,CACL,KAAC,kBAAkB,IAAC,GAAG,EAAE,QAAQ,YAC/B,eAAK,SAAS,EAAC,cAAc,aAC3B,KAAC,YAAY,IAAC,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,+BAEtC,EACf,KAAC,YAAY,IAAC,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,+BAEtC,IACX,GACa,CACtB,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,qBAAqB,EAAE,CAAC"}

package/dist/esm/checkout/views/crypto-intent/curreny.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from "react";
+import {
+  useModalWithView,
+  SelectableList,
+  Text,
+  Loader,
+} from "../../../components/index.js";
+import { useMintMoneyConfig } from "../../../context.js";
+import {
+  useCheckoutStore,
+  ACTIONS,
+  createCheckoutCryptoPaymentAttempt,
+} from "../../../state/checkout/store.js";
+import { ModalViewContainer } from "../../container.js";
+const CryptontentSelectCurrencyViewContent = () => {
+  const modalRef = useRef(null);
+  const { goToView } = useModalWithView();
+  const { checkout, cryptoCurrencies, loading } = useCheckoutStore();
+  const config = useMintMoneyConfig();
+  const isLoading =
+    loading[ACTIONS.GET_CRYPTO_CURRENCIES] ||
+    loading[ACTIONS.CREATE_PAYMENT_ATTEMPT];
+  if (checkout && !checkout.checkout_config.crypto?.enabled)
+    goToView("failed", { reason: "crypto_not_enabled" });
+  const handleSelectCurrency = async (currency) => {
+    await createCheckoutCryptoPaymentAttempt(currency);
+    goToView("cryptoIntentDirectDetails");
+  };
+  if (isLoading) return _jsx(Loader, {});
+  return _jsxs(ModalViewContainer, {
+    ref: modalRef,
+    children: [
+      _jsx(Text, {
+        size: "base",
+        color: config.theme.font.color.tertiary,
+        weight: "normal",
+        children: "Select a currency to complete payment with.",
+      }),
+      _jsx(SelectableList, {
+        items: cryptoCurrencies ?? [],
+        getKey: (currency) => currency.asset,
+        getLabel: (currency) => `${currency.chain_name} ${currency.asset_name}`,
+        onSelect: handleSelectCurrency,
+      }),
+    ],
+  });
+};
+export { CryptontentSelectCurrencyViewContent };
+//# sourceMappingURL=curreny.js.map

package/dist/esm/checkout/views/crypto-intent/curreny.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"curreny.js","sourceRoot":"","sources":["../../../../../src/checkout/views/crypto-intent/curreny.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAG/B,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,IAAI,EACJ,MAAM,GACP,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AACzD,OAAO,EACL,gBAAgB,EAChB,OAAO,EACP,kCAAkC,GACnC,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAExD,MAAM,oCAAoC,GAAG,GAAG,EAAE;IAChD,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC9C,MAAM,EAAE,QAAQ,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACxC,MAAM,EAAE,QAAQ,EAAE,gBAAgB,EAAE,OAAO,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACnE,MAAM,MAAM,GAAG,kBAAkB,EAAE,CAAC;IAEpC,MAAM,SAAS,GACb,OAAO,CAAC,OAAO,CAAC,qBAAqB,CAAC;QACtC,OAAO,CAAC,OAAO,CAAC,sBAAsB,CAAC,CAAC;IAE1C,IAAI,QAAQ,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,MAAM,EAAE,OAAO;QACvD,QAAQ,CAAC,QAAQ,EAAE,EAAE,MAAM,EAAE,oBAAoB,EAAE,CAAC,CAAC;IAEvD,MAAM,oBAAoB,GAAG,KAAK,EAAE,QAAwB,EAAE,EAAE;QAC9D,MAAM,kCAAkC,CAAC,QAAQ,CAAC,CAAC;QACnD,QAAQ,CAAC,2BAA2B,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,IAAI,SAAS;QAAE,OAAO,KAAC,MAAM,KAAG,CAAC;IAEjC,OAAO,CACL,MAAC,kBAAkB,IAAC,GAAG,EAAE,QAAQ,aAC/B,KAAC,IAAI,IACH,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EACvC,MAAM,EAAE,QAAQ,4DAGX,EAEP,KAAC,cAAc,IACb,KAAK,EAAE,gBAAgB,IAAI,EAAE,EAC7B,MAAM,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAK,EACpC,QAAQ,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC,GAAG,QAAQ,CAAC,UAAU,IAAI,QAAQ,CAAC,UAAU,EAAE,EACvE,QAAQ,EAAE,oBAAoB,GAC9B,IACiB,CACtB,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,oCAAoC,EAAE,CAAC"}

package/dist/esm/checkout/views/crypto-intent/direct-details.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from "react";
+//@ts-expect-error import error
+import { QRCode } from "react-qr-code";
+import {
+  useModalWithView,
+  StyledButton,
+  Text,
+} from "../../../components/index.js";
+import { useMintMoneyConfig } from "../../../context.js";
+import { useCheckoutStore } from "../../../state/checkout/store.js";
+import { ModalViewContainer } from "../../container.js";
+const CryptoIntentDirectDetailsViewContent = () => {
+  const modalRef = useRef(null);
+  const { goToView } = useModalWithView();
+  const { cryptoPaymentAttempt } = useCheckoutStore();
+  const config = useMintMoneyConfig();
+  const handleConfirm = () => {
+    goToView("cryptoIntentPaymentStatus");
+  };
+  if (!cryptoPaymentAttempt) {
+    return null;
+  }
+  const copyToClipboard = async () => {
+    await navigator.clipboard.writeText(
+      cryptoPaymentAttempt.destination_address,
+    );
+  };
+  return _jsxs(ModalViewContainer, {
+    ref: modalRef,
+    children: [
+      _jsx(Text, {
+        size: "base",
+        weight: "normal",
+        color: config.theme.font.color.secondary,
+        children: "Scan the QR code or copy the address to send payment.",
+      }),
+      _jsx("div", {
+        className: "mm-qr-container",
+        children: _jsx(QRCode, {
+          value: cryptoPaymentAttempt.destination_address,
+          size: 160,
+        }),
+      }),
+      _jsxs("div", {
+        className: "mm-address-container",
+        children: [
+          _jsx(Text, {
+            size: "sm",
+            weight: "light",
+            color: config.theme.font.color.tertiary,
+            children: cryptoPaymentAttempt.destination_address,
+          }),
+          _jsx("button", {
+            className: "copy-button",
+            onClick: copyToClipboard,
+            children: "Copy",
+          }),
+        ],
+      }),
+      _jsx(StyledButton, {
+        onClick: handleConfirm,
+        variant: "primary",
+        children: "Confirm",
+      }),
+    ],
+  });
+};
+export { CryptoIntentDirectDetailsViewContent };
+//# sourceMappingURL=direct-details.js.map

package/dist/esm/checkout/views/crypto-intent/direct-details.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"direct-details.js","sourceRoot":"","sources":["../../../../../src/checkout/views/crypto-intent/direct-details.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,+BAA+B;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAEvC,OAAO,EACL,gBAAgB,EAChB,YAAY,EACZ,IAAI,GACL,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAExD,MAAM,oCAAoC,GAAG,GAAG,EAAE;IAChD,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC9C,MAAM,EAAE,QAAQ,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACxC,MAAM,EAAE,oBAAoB,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACpD,MAAM,MAAM,GAAG,kBAAkB,EAAE,CAAC;IAEpC,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,QAAQ,CAAC,2BAA2B,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC1B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,eAAe,GAAG,KAAK,IAAI,EAAE;QACjC,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CACjC,oBAAoB,CAAC,mBAAmB,CACzC,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,MAAC,kBAAkB,IAAC,GAAG,EAAE,QAAQ,aAC/B,KAAC,IAAI,IACH,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,QAAQ,EACf,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,sEAGnC,EAEP,cAAK,SAAS,EAAC,iBAAiB,YAC9B,KAAC,MAAM,IAAC,KAAK,EAAE,oBAAoB,CAAC,mBAAmB,EAAE,IAAI,EAAE,GAAG,GAAI,GAClE,EAEN,eAAK,SAAS,EAAC,sBAAsB,aACnC,KAAC,IAAI,IAAC,IAAI,EAAC,IAAI,EAAC,MAAM,EAAC,OAAO,EAAC,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,YACnE,oBAAoB,CAAC,mBAAmB,GACpC,EACP,iBAAQ,SAAS,EAAC,aAAa,EAAC,OAAO,EAAE,eAAe,qBAE/C,IACL,EAEN,KAAC,YAAY,IAAC,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,SAAS,wBAEzC,IACI,CACtB,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,oCAAoC,EAAE,CAAC"}

package/dist/esm/checkout/views/crypto-intent/methods.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useRef } from "react";
+import { useModalWithView, SelectableList } from "../../../components/index.js";
+import { ModalViewContainer } from "../../container.js";
+const CryptoIntentViewContent = () => {
+  const modalRef = useRef(null);
+  const { goToView } = useModalWithView();
+  const methods = [
+    {
+      key: "wallet",
+      label: "Connect Wallet",
+      view: "cryptoIntentSelectCurrency",
+    },
+    {
+      key: "direct",
+      label: "Direct Payment",
+      view: "cryptoIntentSelectCurrency",
+    },
+  ];
+  const handleMethodSelect = () => {
+    goToView("cryptoIntentSelectCurrency");
+  };
+  return _jsx(ModalViewContainer, {
+    ref: modalRef,
+    children: _jsx(SelectableList, {
+      items: methods,
+      getKey: (method) => method.key,
+      getLabel: (method) => method.label,
+      onSelect: handleMethodSelect,
+    }),
+  });
+};
+export { CryptoIntentViewContent };
+//# sourceMappingURL=methods.js.map

package/dist/esm/checkout/views/crypto-intent/methods.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"methods.js","sourceRoot":"","sources":["../../../../../src/checkout/views/crypto-intent/methods.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAChF,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAExD,MAAM,uBAAuB,GAAG,GAAG,EAAE;IACnC,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC9C,MAAM,EAAE,QAAQ,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAQxC,MAAM,OAAO,GAAuB;QAClC;YACE,GAAG,EAAE,QAAQ;YACb,KAAK,EAAE,gBAAgB;YACvB,IAAI,EAAE,4BAA4B;SACnC;QACD;YACE,GAAG,EAAE,QAAQ;YACb,KAAK,EAAE,gBAAgB;YACvB,IAAI,EAAE,4BAA4B;SACnC;KACF,CAAC;IAEF,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC9B,QAAQ,CAAC,4BAA4B,CAAC,CAAC;IACzC,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,kBAAkB,IAAC,GAAG,EAAE,QAAQ,YAC/B,KAAC,cAAc,IACb,KAAK,EAAE,OAAO,EACd,MAAM,EAAE,CAAC,MAAwB,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAChD,QAAQ,EAAE,CAAC,MAAwB,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EACpD,QAAQ,EAAE,kBAAkB,GAC5B,GACiB,CACtB,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,uBAAuB,EAAE,CAAC"}

package/dist/esm/checkout/views/crypto-intent/processing.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect } from "react";
+import { useModalWithView, Loader, Text } from "../../../components/index.js";
+import { useMintMoneyConfig } from "../../../context.js";
+import { getPayment } from "../../../state/checkout/store.js";
+const POLL_INTERVAL = 5000;
+const CryptoIntentPaymentStatusViewContent = () => {
+  const { goToView } = useModalWithView();
+  const config = useMintMoneyConfig();
+  useEffect(() => {
+    let isMounted = true;
+    const pollPaymentStatus = async () => {
+      try {
+        const updatedPayment = await getPayment();
+        if (!updatedPayment || !isMounted) return;
+        if (updatedPayment.status === "paid") {
+          goToView("cryptoIntentPaymentSuccess");
+        } else if (updatedPayment.status === "failed") {
+          goToView("failed");
+        }
+      } catch (error) {
+        console.error("Error fetching payment status:", error);
+      }
+    };
+    void pollPaymentStatus();
+    const interval = setInterval(
+      async () => await pollPaymentStatus(),
+      POLL_INTERVAL,
+    );
+    return () => {
+      isMounted = false;
+      clearInterval(interval);
+    };
+  }, []);
+  return _jsxs("div", {
+    className: "loading-container",
+    children: [
+      _jsx(Loader, { asChild: true }),
+      _jsx(Text, {
+        size: "base",
+        color: config.theme.font.color.tertiary,
+        children: "Payment pending...",
+      }),
+    ],
+  });
+};
+export { CryptoIntentPaymentStatusViewContent };
+//# sourceMappingURL=processing.js.map

package/dist/esm/checkout/views/crypto-intent/processing.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"processing.js","sourceRoot":"","sources":["../../../../../src/checkout/views/crypto-intent/processing.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,gBAAgB,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,8BAA8B,CAAC;AAC9E,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,kCAAkC,CAAC;AAE9D,MAAM,aAAa,GAAG,IAAI,CAAC;AAE3B,MAAM,oCAAoC,GAAG,GAAG,EAAE;IAChD,MAAM,EAAE,QAAQ,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACxC,MAAM,MAAM,GAAG,kBAAkB,EAAE,CAAC;IAEpC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,SAAS,GAAG,IAAI,CAAC;QAErB,MAAM,iBAAiB,GAAG,KAAK,IAAI,EAAE;YACnC,IAAI,CAAC;gBACH,MAAM,cAAc,GAAG,MAAM,UAAU,EAAE,CAAC;gBAC1C,IAAI,CAAC,cAAc,IAAI,CAAC,SAAS;oBAAE,OAAO;gBAE1C,IAAI,cAAc,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;oBACrC,QAAQ,CAAC,4BAA4B,CAAC,CAAC;gBACzC,CAAC;qBAAM,IAAI,cAAc,CAAC,MAAM,KAAK,QAAQ,EAAE,CAAC;oBAC9C,QAAQ,CAAC,QAAQ,CAAC,CAAC;gBACrB,CAAC;YACH,CAAC;YAAC,OAAO,KAAK,EAAE,CAAC;gBACf,OAAO,CAAC,KAAK,CAAC,gCAAgC,EAAE,KAAK,CAAC,CAAC;YACzD,CAAC;QACH,CAAC,CAAC;QAEF,KAAK,iBAAiB,EAAE,CAAC;QACzB,MAAM,QAAQ,GAAG,WAAW,CAC1B,KAAK,IAAI,EAAE,CAAC,MAAM,iBAAiB,EAAE,EACrC,aAAa,CACd,CAAC;QAEF,OAAO,GAAG,EAAE;YACV,SAAS,GAAG,KAAK,CAAC;YAClB,aAAa,CAAC,QAAQ,CAAC,CAAC;QAC1B,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,eAAK,SAAS,EAAC,mBAAmB,aAChC,KAAC,MAAM,IAAC,OAAO,EAAE,IAAI,GAAI,EACzB,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,mCAElD,IACH,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,oCAAoC,EAAE,CAAC"}

package/dist/esm/checkout/views/crypto-intent/success.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import {
+  StyledButton,
+  CheckMarkIcon,
+  useModalWithView,
+} from "../../../components/index.js";
+import { resetCheckoutStore } from "../../../state/checkout/store.js";
+import { ModalViewContainer } from "../../container.js";
+const CryptoIntentPaymentSuccessViewContent = ({ onClose }) => {
+  const { goToView } = useModalWithView();
+  const handleClose = () => {
+    resetCheckoutStore();
+    goToView("initial");
+    onClose(false);
+  };
+  return _jsxs(ModalViewContainer, {
+    style: { justifyContent: "flex-end" },
+    children: [
+      _jsx("div", {
+        style: {
+          position: "absolute",
+          top: "calc(50% - 24px)",
+          left: "50%",
+          transform: "translate(-50%, -50%)",
+        },
+        children: _jsx(CheckMarkIcon, { size: 64 }),
+      }),
+      _jsx(StyledButton, {
+        style: { marginTop: "auto" },
+        variant: "primary",
+        onClick: handleClose,
+        children: "Complete",
+      }),
+    ],
+  });
+};
+export { CryptoIntentPaymentSuccessViewContent };
+//# sourceMappingURL=success.js.map

package/dist/esm/checkout/views/crypto-intent/success.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"success.js","sourceRoot":"","sources":["../../../../../src/checkout/views/crypto-intent/success.tsx"],"names":[],"mappings":";AAEA,OAAO,EACL,YAAY,EACZ,aAAa,EACb,gBAAgB,GACjB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAMxD,MAAM,qCAAqC,GAAG,CAAC,EAAE,OAAO,EAAS,EAAE,EAAE;IACnE,MAAM,EAAE,QAAQ,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAExC,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,kBAAkB,EAAE,CAAC;QACrB,QAAQ,CAAC,SAAS,CAAC,CAAC;QACpB,OAAO,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC,CAAC;IAEF,OAAO,CACL,MAAC,kBAAkB,IAAC,KAAK,EAAE,EAAE,cAAc,EAAE,UAAU,EAAE,aACvD,cACE,KAAK,EAAE;oBACL,QAAQ,EAAE,UAAU;oBACpB,GAAG,EAAE,kBAAkB;oBACvB,IAAI,EAAE,KAAK;oBACX,SAAS,EAAE,uBAAuB;iBACnC,YAED,KAAC,aAAa,IAAC,IAAI,EAAE,EAAE,GAAI,GACvB,EACN,KAAC,YAAY,IACX,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,EAC5B,OAAO,EAAE,SAAS,EAClB,OAAO,EAAE,WAAW,yBAGP,IACI,CACtB,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,qCAAqC,EAAE,CAAC"}

package/dist/esm/checkout/views/initial.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { Loader, useModalWithView } from "../../components/index.js";
+import {
+  ACTIONS,
+  initialiseStore,
+  useCheckoutStore,
+} from "../../state/checkout/store.js";
+const InitialiseCheckoutViewContent = (props) => {
+  const { goToView } = useModalWithView();
+  const { error, checkout, payment } = useCheckoutStore();
+  const [loading, setLoading] = useState(true);
+  useEffect(() => {
+    const setup = async () => {
+      await initialiseStore(props.payment);
+    };
+    void setup();
+    const timeout = setTimeout(() => setLoading(false), 1500);
+    return () => clearTimeout(timeout);
+  }, [props.payment]);
+  useEffect(() => {
+    const hasErrors =
+      error[ACTIONS.GET_CHECKOUT_CONFIG] || error[ACTIONS.CREATE_PAYMENT];
+    if (hasErrors) {
+      goToView("failed", { reason: "get_checkout" });
+      return;
+    }
+    if (checkout && payment && !loading) {
+      goToView("methods");
+    }
+  }, [error, checkout, payment, loading]);
+  return loading ? _jsx(Loader, {}) : null;
+};
+export { InitialiseCheckoutViewContent };
+//# sourceMappingURL=initial.js.map

package/dist/esm/checkout/views/initial.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"initial.js","sourceRoot":"","sources":["../../../../src/checkout/views/initial.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAG5C,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EACL,OAAO,EACP,eAAe,EACf,gBAAgB,GACjB,MAAM,+BAA+B,CAAC;AAMvC,MAAM,6BAA6B,GAAG,CAAC,KAAmB,EAAE,EAAE;IAC5D,MAAM,EAAE,QAAQ,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACxC,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAExD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAE7C,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,KAAK,GAAG,KAAK,IAAI,EAAE;YACvB,MAAM,eAAe,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QACvC,CAAC,CAAC;QAEF,KAAK,KAAK,EAAE,CAAC;QAEb,MAAM,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,CAAC;QAE1D,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAEpB,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,SAAS,GACb,KAAK,CAAC,OAAO,CAAC,mBAAmB,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;QAEtE,IAAI,SAAS,EAAE,CAAC;YACd,QAAQ,CAAC,QAAQ,EAAE,EAAE,MAAM,EAAE,cAAc,EAAE,CAAC,CAAC;YAC/C,OAAO;QACT,CAAC;QAED,IAAI,QAAQ,IAAI,OAAO,IAAI,CAAC,OAAO,EAAE,CAAC;YACpC,QAAQ,CAAC,SAAS,CAAC,CAAC;QACtB,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC;IAExC,OAAO,OAAO,CAAC,CAAC,CAAC,KAAC,MAAM,KAAG,CAAC,CAAC,CAAC,IAAI,CAAC;AACrC,CAAC,CAAC;AAEF,OAAO,EAAE,6BAA6B,EAAE,CAAC"}

package/dist/esm/checkout/views/method-select.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useRef } from "react";
+import { useModalWithView, SelectableList } from "../../components/index.js";
+import {
+  useCheckoutStore,
+  ACTIONS,
+  setCheckoutMethod,
+} from "../../state/checkout/store.js";
+import { ModalViewContainer } from "../container.js";
+const MethodSelectViewContent = () => {
+  const { goToView } = useModalWithView();
+  const modalRef = useRef(null);
+  const { methods, loading } = useCheckoutStore();
+  const handleSelectMethod = (method) => {
+    setCheckoutMethod(method);
+    goToView(method.intentName);
+  };
+  return _jsx(ModalViewContainer, {
+    ref: modalRef,
+    children: _jsx(SelectableList, {
+      title: "Select payment method",
+      items: methods || [],
+      getKey: (method) => method.name,
+      getLabel: (method) => method.name,
+      onSelect: handleSelectMethod,
+      loading: loading[ACTIONS.GET_CHECKOUT_CONFIG],
+    }),
+  });
+};
+export { MethodSelectViewContent };
+//# sourceMappingURL=method-select.js.map

package/dist/esm/checkout/views/method-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"method-select.js","sourceRoot":"","sources":["../../../../src/checkout/views/method-select.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC7E,OAAO,EACL,gBAAgB,EAChB,OAAO,EACP,iBAAiB,GAClB,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAErD,MAAM,uBAAuB,GAAG,GAAG,EAAE;IACnC,MAAM,EAAE,QAAQ,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACxC,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC9C,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAEhD,MAAM,kBAAkB,GAAG,CAAC,MAAsB,EAAE,EAAE;QACpD,iBAAiB,CAAC,MAAM,CAAC,CAAC;QAC1B,QAAQ,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;IAC9B,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,kBAAkB,IAAC,GAAG,EAAE,QAAQ,YAC/B,KAAC,cAAc,IACb,KAAK,EAAE,uBAAuB,EAC9B,KAAK,EAAE,OAAO,IAAI,EAAE,EACpB,MAAM,EAAE,CAAC,MAAsB,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAC/C,QAAQ,EAAE,CAAC,MAAsB,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EACjD,QAAQ,EAAE,kBAAkB,EAC5B,OAAO,EAAE,OAAO,CAAC,OAAO,CAAC,mBAAmB,CAAC,GAC7C,GACiB,CACtB,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,uBAAuB,EAAE,CAAC"}

package/dist/esm/components/buttons/index.js

@@ -1,25 +1,46 @@
 import { styled } from "styled-components";
-const StyledButton = styled.button `
+const StyledButton = styled.button`
   width: 100%;
-  padding: 16px 24px; /* Adjusted padding for better spacing */
-  border-radius: 32px; /* Fully rounded corners */
-  border: 2px solid ${({ theme }) => theme.default.borderColor};
-  background-color: ${({ theme }) => theme.default.backgroundColor};
-  color: ${({ theme }) => theme.default.textColor};
+  height: 48px;
+  padding: 10px 16px;
+  border-radius: 48px;
+  font-family: var(--mm-font-family);
+  border: 2px solid
+    ${({ theme, variant = "primary" }) =>
+      theme?.btn?.[variant]?.default.borderColor};
+  background-color: ${({ theme, variant = "primary" }) =>
+    theme?.btn?.[variant]?.default.backgroundColor};
+  color: ${({ theme, variant = "primary" }) =>
+    theme?.btn?.[variant]?.default.textColor};
   transition: all 0.3s ease-in-out;
+  font-size: 16px;
+  font-weight: 700;
+  text-align: center;
+  line-height: 28px;
+
+  transition:
+    background-color 0.3s ease-in-out,
+    border-color 0.3s ease-in-out,
+    color 0.3s ease-in-out;
 
   &:hover {
-    background-color: ${({ theme }) => theme.hover.backgroundColor};
-    border-color: ${({ theme }) => theme.hover.borderColor};
-    color: ${({ theme }) => theme.hover.textColor};
+    background-color: ${({ theme, variant = "primary" }) =>
+      theme?.btn?.[variant]?.hover.backgroundColor};
+    border-color: ${({ theme, variant = "primary" }) =>
+      theme?.btn?.[variant]?.hover.borderColor};
+    color: ${({ theme, variant = "primary" }) =>
+      theme?.btn?.[variant]?.hover.textColor};
   }
 
   &:disabled {
-    background-color: ${({ theme }) => theme.disabled.backgroundColor};
-    border-color: ${({ theme }) => theme.disabled.borderColor};
-    color: ${({ theme }) => theme.disabled.textColor};
+    background-color: ${({ theme, variant = "primary" }) =>
+      theme?.btn?.[variant]?.disabled.backgroundColor};
+    border-color: ${({ theme, variant = "primary" }) =>
+      theme?.btn?.[variant]?.disabled.borderColor};
+    color: ${({ theme, variant = "primary" }) =>
+      theme?.btn?.[variant]?.disabled.textColor};
     cursor: not-allowed;
   }
 `;
 export { StyledButton };
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/esm/components/buttons/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/buttons/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAqB3C,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAmB;;;;sBAI/B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW;sBACxC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,eAAe;WACvD,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS;;;;wBAIzB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,eAAe;oBAC9C,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,WAAW;aAC7C,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS;;;;wBAIzB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,eAAe;oBACjD,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,WAAW;aAChD,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,SAAS;;;CAGnD,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/buttons/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAS3C,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAmB;;;;;;;MAO/C,CAAC,EAAE,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,EAAE,EAAE,CACnC,KAAK,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,WAAW;sBAC1B,CAAC,EAAE,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,EAAE,EAAE,CACrD,KAAK,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,eAAe;WACvC,CAAC,EAAE,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,EAAE,EAAE,CAC1C,KAAK,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,SAAS;;;;;;;;;;;;;wBAapB,CAAC,EAAE,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,EAAE,EAAE,CACrD,KAAK,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,eAAe;oBAC9B,CAAC,EAAE,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,EAAE,EAAE,CACjD,KAAK,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,WAAW;aACjC,CAAC,EAAE,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,EAAE,EAAE,CAC1C,KAAK,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS;;;;wBAIpB,CAAC,EAAE,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,EAAE,EAAE,CACrD,KAAK,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,QAAQ,CAAC,eAAe;oBACjC,CAAC,EAAE,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,EAAE,EAAE,CACjD,KAAK,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,QAAQ,CAAC,WAAW;aACpC,CAAC,EAAE,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,EAAE,EAAE,CAC1C,KAAK,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,QAAQ,CAAC,SAAS;;;CAG9C,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,CAAC"}