@coin-voyage/paykit 2.4.0-beta.8 → 2.4.1-beta.0

package/dist/assets/icons.d.ts

@@ -28,6 +28,9 @@ export declare const AuthIcon: ({ ...props }: {
 export declare const ErrorIcon: ({ ...props }: {
     [x: string]: any;
 }) => import("react/jsx-runtime").JSX.Element;
+export declare const WarningIcon: ({ ...props }: {
+    [x: string]: any;
+}) => import("react/jsx-runtime").JSX.Element;
 export declare const CreditCardIcon: ({ ...props }: {
     [x: string]: any;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons.js

@@ -41,6 +41,9 @@ export const AuthIcon = ({ ...props }) => (_jsx("div", { ...props, style: {
 export const ErrorIcon = ({ ...props }) => {
     return (_jsx("svg", { "aria-hidden": "true", width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9 18C13.9706 18 18 13.9706 18 9C18 4.02944 13.9706 0 9 0C4.02944 0 0 4.02944 0 9C0 13.9706 4.02944 18 9 18ZM6.70711 5.29289C6.31658 4.90237 5.68342 4.90237 5.29289 5.29289C4.90237 5.68342 4.90237 6.31658 5.29289 6.70711L7.58579 9L5.29289 11.2929C4.90237 11.6834 4.90237 12.3166 5.29289 12.7071C5.68342 13.0976 6.31658 13.0976 6.70711 12.7071L9 10.4142L11.2929 12.7071C11.6834 13.0976 12.3166 13.0976 12.7071 12.7071C13.0976 12.3166 13.0976 11.6834 12.7071 11.2929L10.4142 9L12.7071 6.70711C13.0976 6.31658 13.0976 5.68342 12.7071 5.29289C12.3166 4.90237 11.6834 4.90237 11.2929 5.29289L9 7.58579L6.70711 5.29289Z", fill: "currentColor" }) }));
 };
+export const WarningIcon = ({ ...props }) => {
+    return (_jsxs("svg", { "aria-hidden": "true", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", ...props, children: [_jsx("circle", { cx: "12", cy: "12", r: "10" }), _jsx("line", { x1: "12", x2: "12", y1: "8", y2: "12" }), _jsx("line", { x1: "12", x2: "12.01", y1: "16", y2: "16" })] }));
+};
 export const CreditCardIcon = ({ ...props }) => {
     return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", ...props, children: [_jsx("rect", { width: "20", height: "14", x: "2", y: "5", rx: "2" }), _jsx("line", { x1: "2", x2: "22", y1: "10", y2: "10" })] }));
 };

package/dist/components/Pages/Confirmation/index.js

@@ -7,7 +7,7 @@ import useLocales from "../../../hooks/useLocales";
 import usePayContext from "../../contexts/pay/index";
 import { ModalContent, ModalH1, PageContent } from "../../ui/Modal/styles";
 import PoweredByFooter from "../../ui/PoweredByFooter/index";
-import { AnimationContainer, ErrorIcon, InsetContainer, Link, Spinner, SuccessIcon } from "./styles";
+import { AnimationContainer, ErrorIcon, InsetContainer, Link, Spinner, SuccessIcon, WarningIcon } from "./styles";
 export default function Confirmation() {
     const locales = useLocales();
     const { paymentState, onSuccess, options } = usePayContext();
@@ -19,7 +19,7 @@ export default function Confirmation() {
             onSuccess();
         }
     }, [uiState, onSuccess]);
-    return (_jsx(PageContent, { "$center": true, children: _jsxs(ModalContent, { "$center": true, style: { paddingBottom: 0 }, children: [_jsx(AnimationContainer, { children: _jsxs(InsetContainer, { children: [_jsx(Spinner, { "$status": uiState === "loading" }), _jsx(SuccessIcon, { "$status": uiState === "success" }), _jsx(ErrorIcon, { "$status": uiState === "error" })] }) }), _jsx(ModalH1, { children: title }), txURL && (_jsxs(Link, { href: txURL, target: "_blank", rel: "noopener noreferrer", children: [_jsx(ExternalLinkIcon, { width: 14, height: 14, fillOpacity: 0.9 }), "view transaction"] })), _jsx(PoweredByFooter, {})] }) }));
+    return (_jsx(PageContent, { "$center": true, children: _jsxs(ModalContent, { "$center": true, style: { paddingBottom: 0 }, children: [_jsx(AnimationContainer, { children: _jsxs(InsetContainer, { children: [_jsx(Spinner, { "$status": uiState === "loading" }), _jsx(SuccessIcon, { "$status": uiState === "success" }), _jsx(ErrorIcon, { "$status": uiState === "error" }), _jsx(WarningIcon, { "$status": uiState === "warning" })] }) }), _jsx(ModalH1, { children: title }), txURL && (_jsxs(Link, { href: txURL, target: "_blank", rel: "noopener noreferrer", children: [_jsx(ExternalLinkIcon, { width: 14, height: 14, fillOpacity: 0.9 }), "view transaction"] })), _jsx(PoweredByFooter, {})] }) }));
 }
 function getConfirmationState(payOrder, isDeposit, locales, optimisticConfirmation) {
     if (!payOrder) {
@@ -39,6 +39,13 @@ function getConfirmationState(payOrder, isDeposit, locales, optimisticConfirmati
             uiState: "error",
         };
     }
+    if (payOrder.status === PayOrderStatus.PARTIAL_PAYMENT) {
+        return {
+            title: "Partial payment received",
+            uiState: "warning",
+            txURL: sourceTxURL,
+        };
+    }
     if (payOrder.status === PayOrderStatus.AWAITING_CONFIRMATION ||
         payOrder.status === PayOrderStatus.OPTIMISTIC_CONFIRMED) {
         return {

package/dist/components/Pages/Confirmation/styles.d.ts

@@ -3,5 +3,6 @@ declare const InsetContainer: any;
 declare const Link: any;
 declare const SuccessIcon: any;
 declare const ErrorIcon: any;
+declare const WarningIcon: any;
 declare const Spinner: any;
-export { AnimationContainer, ErrorIcon, InsetContainer, Link, Spinner, SuccessIcon };
+export { AnimationContainer, ErrorIcon, InsetContainer, Link, Spinner, SuccessIcon, WarningIcon };

package/dist/components/Pages/Confirmation/styles.js

@@ -1,5 +1,5 @@
 import { motion } from "framer-motion";
-import { ErrorIcon as ErrorIconSVG, LoadingCircleIcon, TickIcon } from "../../../assets/icons";
+import { ErrorIcon as ErrorIconSVG, LoadingCircleIcon, TickIcon, WarningIcon as WarningIconSVG, } from "../../../assets/icons";
 import styled from "../../../styles/styled/index";
 const AnimationContainer = styled(motion.div) `
   position: relative;
@@ -51,6 +51,14 @@ const ErrorIcon = styled(ErrorIconSVG) `
   opacity: ${(props) => (props.$status ? 1 : 0)};
   transform: scale(${(p) => (p.$status ? 1 : 0.5)});
 `;
+const WarningIcon = styled(WarningIconSVG) `
+  color: var(--ck-body-color-warning);
+  transition: all 0.2s ease-in-out;
+  position: absolute;
+
+  opacity: ${(props) => (props.$status ? 1 : 0)};
+  transform: scale(${(p) => (p.$status ? 1 : 0.5)});
+`;
 const Spinner = styled(LoadingCircleIcon) `
   position: absolute;
 
@@ -76,4 +84,4 @@ const Spinner = styled(LoadingCircleIcon) `
     }
   }
 `;
-export { AnimationContainer, ErrorIcon, InsetContainer, Link, Spinner, SuccessIcon };
+export { AnimationContainer, ErrorIcon, InsetContainer, Link, Spinner, SuccessIcon, WarningIcon };

package/dist/hooks/usePayStatus.d.ts

@@ -3,6 +3,8 @@ import type { PayOrderStatus } from "@coin-voyage/shared/types";
  *
  * Status values:
  * - `PENDING` - the user has not paid yet
+ * - `FAILED` - the payOrder is finalized and failed before completing execution.
+ * - `PARTIAL_PAYMENT` - the payOrder received an insufficient amount and is shown as a terminal partial-payment state.
  * - `AWAITING_PAYMENT` - the user has requested payment details but not yet executed the payment.
  * - `AWAITING_CONFIRMATION` - the user has paid & payment is in progress. This status
  *    typically lasts a few seconds.

package/dist/hooks/usePayStatus.js

@@ -3,6 +3,8 @@ import usePayContext from "../components/contexts/pay";
  *
  * Status values:
  * - `PENDING` - the user has not paid yet
+ * - `FAILED` - the payOrder is finalized and failed before completing execution.
+ * - `PARTIAL_PAYMENT` - the payOrder received an insufficient amount and is shown as a terminal partial-payment state.
  * - `AWAITING_PAYMENT` - the user has requested payment details but not yet executed the payment.
  * - `AWAITING_CONFIRMATION` - the user has paid & payment is in progress. This status
  *    typically lasts a few seconds.

package/dist/hooks/usePaymentLifecycle.js

@@ -18,6 +18,7 @@ export function usePaymentLifecycle(order, handlers) {
             return false;
         const startedStatus = [
             ...completedStates,
+            PayOrderStatus.PARTIAL_PAYMENT,
             PayOrderStatus.AWAITING_CONFIRMATION,
             PayOrderStatus.OPTIMISTIC_CONFIRMED,
             PayOrderStatus.EXECUTING_ORDER,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@coin-voyage/paykit",
   "description": "Seamless crypto payments. Onboard users from any chain, any coin into your app with one click.",
-  "version": "2.4.0-beta.8",
+  "version": "2.4.1-beta.0",
   "private": false,
   "sideEffects": false,
   "author": "Lars <lars@coinvoyage.io>",
@@ -63,8 +63,8 @@
     "@stripe/crypto": "0.0.4",
     "styled-components": "^5.3.11",
     "uuid": "13.0.0",
-    "@coin-voyage/shared": "2.4.0-beta.6",
-    "@coin-voyage/crypto": "2.4.0-beta.0"
+    "@coin-voyage/crypto": "2.4.0",
+    "@coin-voyage/shared": "2.4.1-beta.0"
   },
   "devDependencies": {
     "@types/qrcode": "1.5.5",