@retinalabsllc/zairusjs 9.0.10 → 9.0.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +12 -15
- package/dist/index.mjs +13 -16
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1725,34 +1725,34 @@ var PinDialerBottomSheet = ({
|
|
|
1725
1725
|
if (!isVerifying) onClose();
|
|
1726
1726
|
}
|
|
1727
1727
|
}
|
|
1728
|
-
), /* @__PURE__ */ import_react31.default.createElement("div", { className: "relative w-full max-w-md mx-auto bg-white rounded-t-3xl shadow-2xl p-6 pb-12 animate-in slide-in-from-bottom-full duration-300" }, /* @__PURE__ */ import_react31.default.createElement("h3", { className: "text-center font-medium text-black mb-
|
|
1728
|
+
), /* @__PURE__ */ import_react31.default.createElement("div", { className: "relative w-full max-w-md mx-auto bg-white rounded-t-3xl shadow-2xl p-6 pb-12 animate-in slide-in-from-bottom-full duration-300" }, /* @__PURE__ */ import_react31.default.createElement("h3", { className: "text-center font-medium text-2xl text-black mb-2 tracking-tight" }, title), /* @__PURE__ */ import_react31.default.createElement("p", { className: "text-center text-[13px] text-neutral-500 mb-6 tracking-tight" }, "Confirm your account pin to continue"), /* @__PURE__ */ import_react31.default.createElement("div", { className: "flex justify-center gap-4 mb-8" }, [0, 1, 2, 3].map((i) => /* @__PURE__ */ import_react31.default.createElement(
|
|
1729
1729
|
"div",
|
|
1730
1730
|
{
|
|
1731
1731
|
key: i,
|
|
1732
|
-
className: `w-3
|
|
1732
|
+
className: `w-3 h-3 rounded-full transition-colors duration-200 ${pin.length > i ? "bg-black" : "bg-neutral-200"}`
|
|
1733
1733
|
}
|
|
1734
1734
|
))), isVerifying && /* @__PURE__ */ import_react31.default.createElement("div", { className: "absolute inset-0 bg-white/80 backdrop-blur-sm z-10 flex flex-col items-center justify-center rounded-t-3xl" }, /* @__PURE__ */ import_react31.default.createElement(import_react32.HugeiconsIcon, { icon: import_core_free_icons11.Loading03Icon, size: 32, className: "animate-spin text-black mb-2" })), /* @__PURE__ */ import_react31.default.createElement("div", { className: "grid grid-cols-3 gap-y-4 gap-x-6 max-w-65 mx-auto" }, [1, 2, 3, 4, 5, 6, 7, 8, 9].map((num) => /* @__PURE__ */ import_react31.default.createElement(
|
|
1735
1735
|
"button",
|
|
1736
1736
|
{
|
|
1737
1737
|
key: num,
|
|
1738
1738
|
onClick: () => handlePinPress(num),
|
|
1739
|
-
className: "w-
|
|
1739
|
+
className: "w-14 h-14 rounded-full flex items-center justify-center text-xl text-black hover:bg-neutral-100 transition-colors mx-auto outline-none active:scale-95"
|
|
1740
1740
|
},
|
|
1741
1741
|
num
|
|
1742
1742
|
)), /* @__PURE__ */ import_react31.default.createElement("div", null), " ", /* @__PURE__ */ import_react31.default.createElement(
|
|
1743
1743
|
"button",
|
|
1744
1744
|
{
|
|
1745
1745
|
onClick: () => handlePinPress(0),
|
|
1746
|
-
className: "w-
|
|
1746
|
+
className: "w-14 h-14 rounded-full flex items-center justify-center text-xl text-black hover:bg-neutral-100 transition-colors mx-auto outline-none active:scale-95"
|
|
1747
1747
|
},
|
|
1748
1748
|
"0"
|
|
1749
1749
|
), /* @__PURE__ */ import_react31.default.createElement(
|
|
1750
1750
|
"button",
|
|
1751
1751
|
{
|
|
1752
1752
|
onClick: () => handlePinPress("del"),
|
|
1753
|
-
className: "w-
|
|
1753
|
+
className: "w-14 h-14 rounded-full flex items-center justify-center text-black hover:bg-neutral-100 transition-colors mx-auto outline-none active:scale-95"
|
|
1754
1754
|
},
|
|
1755
|
-
/* @__PURE__ */ import_react31.default.createElement(import_react32.HugeiconsIcon, { icon: import_core_free_icons11.
|
|
1755
|
+
/* @__PURE__ */ import_react31.default.createElement(import_react32.HugeiconsIcon, { icon: import_core_free_icons11.CancelCircleIcon, size: 20 })
|
|
1756
1756
|
))));
|
|
1757
1757
|
};
|
|
1758
1758
|
|
|
@@ -1829,7 +1829,7 @@ var UniversalCardPage = ({
|
|
|
1829
1829
|
const displayCardNumber = isRevealed ? cardNumber : `\u2022\u2022\u2022\u2022 \u2022\u2022\u2022\u2022 \u2022\u2022\u2022\u2022 ${cardNumber.slice(-4)}`;
|
|
1830
1830
|
const displayExpiry = isRevealed ? expiry : "\u2022\u2022/\u2022\u2022";
|
|
1831
1831
|
const displayCvv = isRevealed ? cvv : "\u2022\u2022\u2022";
|
|
1832
|
-
return /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full flex flex-col items-center animate-in fade-in duration-300 pb-12" }, /* @__PURE__ */ import_react33.default.createElement("
|
|
1832
|
+
return /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full flex flex-col items-center animate-in fade-in duration-300 pb-12" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full pt-6 pb-2 flex justify-center", style: { perspective: "1000px" } }, /* @__PURE__ */ import_react33.default.createElement(
|
|
1833
1833
|
"div",
|
|
1834
1834
|
{
|
|
1835
1835
|
onClick: () => {
|
|
@@ -1837,12 +1837,12 @@ var UniversalCardPage = ({
|
|
|
1837
1837
|
},
|
|
1838
1838
|
className: `relative w-full max-w-85 transition-transform duration-700 ${!isBgLoaded ? "cursor-wait" : "cursor-pointer"}`,
|
|
1839
1839
|
style: {
|
|
1840
|
-
height:
|
|
1840
|
+
height: 1985,
|
|
1841
1841
|
transformStyle: "preserve-3d",
|
|
1842
1842
|
transform: isFlipped ? "rotateY(180deg)" : "rotateY(0deg)"
|
|
1843
1843
|
}
|
|
1844
1844
|
},
|
|
1845
|
-
!isBgLoaded && /* @__PURE__ */ import_react33.default.createElement("div", { className: "absolute inset-0 w-full h-full bg-white rounded-2xl flex items-center justify-center z-50
|
|
1845
|
+
!isBgLoaded && /* @__PURE__ */ import_react33.default.createElement("div", { className: "absolute inset-0 w-full h-full bg-white rounded-2xl flex items-center justify-center z-50 " }, /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons12.Loading03Icon, size: 28, className: "animate-spin text-black" })),
|
|
1846
1846
|
/* @__PURE__ */ import_react33.default.createElement(
|
|
1847
1847
|
"div",
|
|
1848
1848
|
{
|
|
@@ -1856,7 +1856,7 @@ var UniversalCardPage = ({
|
|
|
1856
1856
|
style: { backgroundImage: `url(${cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
1857
1857
|
}
|
|
1858
1858
|
),
|
|
1859
|
-
/* @__PURE__ */ import_react33.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex justify-between items-start w-full" }, /* @__PURE__ */ import_react33.default.createElement("div", null, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[12px] text-white/70 font-medium" }, "Prepaid Card")), companyLogoSrc && /* @__PURE__ */ import_react33.default.createElement("img", { src: companyLogoSrc, alt: "Company Logo", className: "h-8 max-h-8 object-contain opacity-90" })), /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[10px] text-white/60 tracking-widest uppercase" }, "Card Number"), /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[14px] text-white tracking-widest font-light" }, displayCardNumber)), networkLogoSrc && /* @__PURE__ */ import_react33.default.createElement("img", { src: networkLogoSrc, alt: "Network Logo", className: "h-
|
|
1859
|
+
/* @__PURE__ */ import_react33.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex justify-between items-start w-full" }, /* @__PURE__ */ import_react33.default.createElement("div", null, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[12px] text-white/70 font-medium" }, "Prepaid Card")), companyLogoSrc && /* @__PURE__ */ import_react33.default.createElement("img", { src: companyLogoSrc, alt: "Company Logo", className: "h-8 max-h-8 object-contain opacity-90" })), /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[10px] text-white/60 tracking-widest uppercase" }, "Card Number"), /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[14px] text-white tracking-widest font-light" }, displayCardNumber)), networkLogoSrc && /* @__PURE__ */ import_react33.default.createElement("img", { src: networkLogoSrc, alt: "Network Logo", className: "h-10 object-contain opacity-90" })))
|
|
1860
1860
|
),
|
|
1861
1861
|
/* @__PURE__ */ import_react33.default.createElement(
|
|
1862
1862
|
"div",
|
|
@@ -1874,8 +1874,7 @@ var UniversalCardPage = ({
|
|
|
1874
1874
|
style: { backgroundImage: `url(${cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
1875
1875
|
}
|
|
1876
1876
|
),
|
|
1877
|
-
/* @__PURE__ */ import_react33.default.createElement("div", { className: "
|
|
1878
|
-
/* @__PURE__ */ import_react33.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-end" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full text-center mb-6" }, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-white text-3xl font-serif italic tracking-wide opacity-90" }, cardHolderName)), /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex justify-between w-full max-w-[80%]" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest uppercase" }, "Expiry"), /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[14px] text-white font-light" }, displayExpiry)), /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest uppercase" }, "CVV"), /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[14px] text-white font-light" }, displayCvv))))
|
|
1877
|
+
/* @__PURE__ */ import_react33.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-end" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full text-center mb-6" }, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-white text-3xl italic tracking-wide opacity-90" }, cardHolderName)), /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex justify-between w-full max-w-[80%]" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest uppercase" }, "Expiry"), /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[14px] text-white font-light" }, displayExpiry)), /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest uppercase" }, "CVV"), /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[14px] text-white font-light" }, displayCvv))))
|
|
1879
1878
|
)
|
|
1880
1879
|
)), /* @__PURE__ */ import_react33.default.createElement("p", { className: "text-xs text-neutral-400 mb-6" }, "Tap to flip card"), /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full flex flex-col gap-4" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react33.default.createElement(
|
|
1881
1880
|
MenuRow,
|
|
@@ -1915,8 +1914,6 @@ var UniversalCardPage = ({
|
|
|
1915
1914
|
title: "Delete card",
|
|
1916
1915
|
subtitle: "Permanently delete card",
|
|
1917
1916
|
onClick: () => setShowDeleteDialog(true),
|
|
1918
|
-
iconColor: "text-red-500",
|
|
1919
|
-
titleColor: "text-red-500",
|
|
1920
1917
|
isLast: true
|
|
1921
1918
|
}
|
|
1922
1919
|
))), /* @__PURE__ */ import_react33.default.createElement(
|
|
@@ -2090,7 +2087,7 @@ var MenuRow2 = ({ icon, title, subtitle, onClick, iconColor = "text-black", titl
|
|
|
2090
2087
|
onClick,
|
|
2091
2088
|
className: `flex items-center p-4 cursor-pointer hover:bg-neutral-50 transition-colors ${!isLast ? "" : ""}`
|
|
2092
2089
|
},
|
|
2093
|
-
/* @__PURE__ */ import_react35.default.createElement("div", { className: "w-9 h-9 rounded-full flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon, size: 16, className: iconColor })),
|
|
2090
|
+
/* @__PURE__ */ import_react35.default.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon, size: 16, className: iconColor })),
|
|
2094
2091
|
/* @__PURE__ */ import_react35.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react35.default.createElement("p", { className: `text-[13px] font-medium truncate ${titleColor}` }, title), /* @__PURE__ */ import_react35.default.createElement("p", { className: "text-[11px] text-neutral-500 truncate" }, subtitle)),
|
|
2095
2092
|
/* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon: import_core_free_icons13.ArrowRight01Icon, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
|
|
2096
2093
|
);
|
package/dist/index.mjs
CHANGED
|
@@ -1653,7 +1653,7 @@ var ConfirmationDialog = ({
|
|
|
1653
1653
|
// src/components/PinDialerBottomSheet.tsx
|
|
1654
1654
|
import React19, { useState as useState11, useEffect as useEffect8 } from "react";
|
|
1655
1655
|
import { HugeiconsIcon as HugeiconsIcon13 } from "@hugeicons/react";
|
|
1656
|
-
import { Loading03Icon as Loading03Icon7,
|
|
1656
|
+
import { Loading03Icon as Loading03Icon7, CancelCircleIcon as CancelCircleIcon4 } from "@hugeicons/core-free-icons";
|
|
1657
1657
|
var PinDialerBottomSheet = ({
|
|
1658
1658
|
isOpen,
|
|
1659
1659
|
title = "Enter PIN to Continue",
|
|
@@ -1688,34 +1688,34 @@ var PinDialerBottomSheet = ({
|
|
|
1688
1688
|
if (!isVerifying) onClose();
|
|
1689
1689
|
}
|
|
1690
1690
|
}
|
|
1691
|
-
), /* @__PURE__ */ React19.createElement("div", { className: "relative w-full max-w-md mx-auto bg-white rounded-t-3xl shadow-2xl p-6 pb-12 animate-in slide-in-from-bottom-full duration-300" }, /* @__PURE__ */ React19.createElement("h3", { className: "text-center font-medium text-black mb-
|
|
1691
|
+
), /* @__PURE__ */ React19.createElement("div", { className: "relative w-full max-w-md mx-auto bg-white rounded-t-3xl shadow-2xl p-6 pb-12 animate-in slide-in-from-bottom-full duration-300" }, /* @__PURE__ */ React19.createElement("h3", { className: "text-center font-medium text-2xl text-black mb-2 tracking-tight" }, title), /* @__PURE__ */ React19.createElement("p", { className: "text-center text-[13px] text-neutral-500 mb-6 tracking-tight" }, "Confirm your account pin to continue"), /* @__PURE__ */ React19.createElement("div", { className: "flex justify-center gap-4 mb-8" }, [0, 1, 2, 3].map((i) => /* @__PURE__ */ React19.createElement(
|
|
1692
1692
|
"div",
|
|
1693
1693
|
{
|
|
1694
1694
|
key: i,
|
|
1695
|
-
className: `w-3
|
|
1695
|
+
className: `w-3 h-3 rounded-full transition-colors duration-200 ${pin.length > i ? "bg-black" : "bg-neutral-200"}`
|
|
1696
1696
|
}
|
|
1697
1697
|
))), isVerifying && /* @__PURE__ */ React19.createElement("div", { className: "absolute inset-0 bg-white/80 backdrop-blur-sm z-10 flex flex-col items-center justify-center rounded-t-3xl" }, /* @__PURE__ */ React19.createElement(HugeiconsIcon13, { icon: Loading03Icon7, size: 32, className: "animate-spin text-black mb-2" })), /* @__PURE__ */ React19.createElement("div", { className: "grid grid-cols-3 gap-y-4 gap-x-6 max-w-65 mx-auto" }, [1, 2, 3, 4, 5, 6, 7, 8, 9].map((num) => /* @__PURE__ */ React19.createElement(
|
|
1698
1698
|
"button",
|
|
1699
1699
|
{
|
|
1700
1700
|
key: num,
|
|
1701
1701
|
onClick: () => handlePinPress(num),
|
|
1702
|
-
className: "w-
|
|
1702
|
+
className: "w-14 h-14 rounded-full flex items-center justify-center text-xl text-black hover:bg-neutral-100 transition-colors mx-auto outline-none active:scale-95"
|
|
1703
1703
|
},
|
|
1704
1704
|
num
|
|
1705
1705
|
)), /* @__PURE__ */ React19.createElement("div", null), " ", /* @__PURE__ */ React19.createElement(
|
|
1706
1706
|
"button",
|
|
1707
1707
|
{
|
|
1708
1708
|
onClick: () => handlePinPress(0),
|
|
1709
|
-
className: "w-
|
|
1709
|
+
className: "w-14 h-14 rounded-full flex items-center justify-center text-xl text-black hover:bg-neutral-100 transition-colors mx-auto outline-none active:scale-95"
|
|
1710
1710
|
},
|
|
1711
1711
|
"0"
|
|
1712
1712
|
), /* @__PURE__ */ React19.createElement(
|
|
1713
1713
|
"button",
|
|
1714
1714
|
{
|
|
1715
1715
|
onClick: () => handlePinPress("del"),
|
|
1716
|
-
className: "w-
|
|
1716
|
+
className: "w-14 h-14 rounded-full flex items-center justify-center text-black hover:bg-neutral-100 transition-colors mx-auto outline-none active:scale-95"
|
|
1717
1717
|
},
|
|
1718
|
-
/* @__PURE__ */ React19.createElement(HugeiconsIcon13, { icon:
|
|
1718
|
+
/* @__PURE__ */ React19.createElement(HugeiconsIcon13, { icon: CancelCircleIcon4, size: 20 })
|
|
1719
1719
|
))));
|
|
1720
1720
|
};
|
|
1721
1721
|
|
|
@@ -1792,7 +1792,7 @@ var UniversalCardPage = ({
|
|
|
1792
1792
|
const displayCardNumber = isRevealed ? cardNumber : `\u2022\u2022\u2022\u2022 \u2022\u2022\u2022\u2022 \u2022\u2022\u2022\u2022 ${cardNumber.slice(-4)}`;
|
|
1793
1793
|
const displayExpiry = isRevealed ? expiry : "\u2022\u2022/\u2022\u2022";
|
|
1794
1794
|
const displayCvv = isRevealed ? cvv : "\u2022\u2022\u2022";
|
|
1795
|
-
return /* @__PURE__ */ React20.createElement("div", { className: "w-full flex flex-col items-center animate-in fade-in duration-300 pb-12" }, /* @__PURE__ */ React20.createElement("
|
|
1795
|
+
return /* @__PURE__ */ React20.createElement("div", { className: "w-full flex flex-col items-center animate-in fade-in duration-300 pb-12" }, /* @__PURE__ */ React20.createElement("div", { className: "w-full pt-6 pb-2 flex justify-center", style: { perspective: "1000px" } }, /* @__PURE__ */ React20.createElement(
|
|
1796
1796
|
"div",
|
|
1797
1797
|
{
|
|
1798
1798
|
onClick: () => {
|
|
@@ -1800,12 +1800,12 @@ var UniversalCardPage = ({
|
|
|
1800
1800
|
},
|
|
1801
1801
|
className: `relative w-full max-w-85 transition-transform duration-700 ${!isBgLoaded ? "cursor-wait" : "cursor-pointer"}`,
|
|
1802
1802
|
style: {
|
|
1803
|
-
height:
|
|
1803
|
+
height: 1985,
|
|
1804
1804
|
transformStyle: "preserve-3d",
|
|
1805
1805
|
transform: isFlipped ? "rotateY(180deg)" : "rotateY(0deg)"
|
|
1806
1806
|
}
|
|
1807
1807
|
},
|
|
1808
|
-
!isBgLoaded && /* @__PURE__ */ React20.createElement("div", { className: "absolute inset-0 w-full h-full bg-white rounded-2xl flex items-center justify-center z-50
|
|
1808
|
+
!isBgLoaded && /* @__PURE__ */ React20.createElement("div", { className: "absolute inset-0 w-full h-full bg-white rounded-2xl flex items-center justify-center z-50 " }, /* @__PURE__ */ React20.createElement(HugeiconsIcon14, { icon: Loading03Icon8, size: 28, className: "animate-spin text-black" })),
|
|
1809
1809
|
/* @__PURE__ */ React20.createElement(
|
|
1810
1810
|
"div",
|
|
1811
1811
|
{
|
|
@@ -1819,7 +1819,7 @@ var UniversalCardPage = ({
|
|
|
1819
1819
|
style: { backgroundImage: `url(${cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
1820
1820
|
}
|
|
1821
1821
|
),
|
|
1822
|
-
/* @__PURE__ */ React20.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ React20.createElement("div", { className: "flex justify-between items-start w-full" }, /* @__PURE__ */ React20.createElement("div", null, /* @__PURE__ */ React20.createElement("span", { className: "text-[12px] text-white/70 font-medium" }, "Prepaid Card")), companyLogoSrc && /* @__PURE__ */ React20.createElement("img", { src: companyLogoSrc, alt: "Company Logo", className: "h-8 max-h-8 object-contain opacity-90" })), /* @__PURE__ */ React20.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ React20.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React20.createElement("span", { className: "text-[10px] text-white/60 tracking-widest uppercase" }, "Card Number"), /* @__PURE__ */ React20.createElement("span", { className: "text-[14px] text-white tracking-widest font-light" }, displayCardNumber)), networkLogoSrc && /* @__PURE__ */ React20.createElement("img", { src: networkLogoSrc, alt: "Network Logo", className: "h-
|
|
1822
|
+
/* @__PURE__ */ React20.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ React20.createElement("div", { className: "flex justify-between items-start w-full" }, /* @__PURE__ */ React20.createElement("div", null, /* @__PURE__ */ React20.createElement("span", { className: "text-[12px] text-white/70 font-medium" }, "Prepaid Card")), companyLogoSrc && /* @__PURE__ */ React20.createElement("img", { src: companyLogoSrc, alt: "Company Logo", className: "h-8 max-h-8 object-contain opacity-90" })), /* @__PURE__ */ React20.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ React20.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React20.createElement("span", { className: "text-[10px] text-white/60 tracking-widest uppercase" }, "Card Number"), /* @__PURE__ */ React20.createElement("span", { className: "text-[14px] text-white tracking-widest font-light" }, displayCardNumber)), networkLogoSrc && /* @__PURE__ */ React20.createElement("img", { src: networkLogoSrc, alt: "Network Logo", className: "h-10 object-contain opacity-90" })))
|
|
1823
1823
|
),
|
|
1824
1824
|
/* @__PURE__ */ React20.createElement(
|
|
1825
1825
|
"div",
|
|
@@ -1837,8 +1837,7 @@ var UniversalCardPage = ({
|
|
|
1837
1837
|
style: { backgroundImage: `url(${cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
1838
1838
|
}
|
|
1839
1839
|
),
|
|
1840
|
-
/* @__PURE__ */ React20.createElement("div", { className: "
|
|
1841
|
-
/* @__PURE__ */ React20.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-end" }, /* @__PURE__ */ React20.createElement("div", { className: "w-full text-center mb-6" }, /* @__PURE__ */ React20.createElement("span", { className: "text-white text-3xl font-serif italic tracking-wide opacity-90" }, cardHolderName)), /* @__PURE__ */ React20.createElement("div", { className: "flex justify-between w-full max-w-[80%]" }, /* @__PURE__ */ React20.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React20.createElement("span", { className: "text-[9px] text-white/60 tracking-widest uppercase" }, "Expiry"), /* @__PURE__ */ React20.createElement("span", { className: "text-[14px] text-white font-light" }, displayExpiry)), /* @__PURE__ */ React20.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React20.createElement("span", { className: "text-[9px] text-white/60 tracking-widest uppercase" }, "CVV"), /* @__PURE__ */ React20.createElement("span", { className: "text-[14px] text-white font-light" }, displayCvv))))
|
|
1840
|
+
/* @__PURE__ */ React20.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-end" }, /* @__PURE__ */ React20.createElement("div", { className: "w-full text-center mb-6" }, /* @__PURE__ */ React20.createElement("span", { className: "text-white text-3xl italic tracking-wide opacity-90" }, cardHolderName)), /* @__PURE__ */ React20.createElement("div", { className: "flex justify-between w-full max-w-[80%]" }, /* @__PURE__ */ React20.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React20.createElement("span", { className: "text-[9px] text-white/60 tracking-widest uppercase" }, "Expiry"), /* @__PURE__ */ React20.createElement("span", { className: "text-[14px] text-white font-light" }, displayExpiry)), /* @__PURE__ */ React20.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React20.createElement("span", { className: "text-[9px] text-white/60 tracking-widest uppercase" }, "CVV"), /* @__PURE__ */ React20.createElement("span", { className: "text-[14px] text-white font-light" }, displayCvv))))
|
|
1842
1841
|
)
|
|
1843
1842
|
)), /* @__PURE__ */ React20.createElement("p", { className: "text-xs text-neutral-400 mb-6" }, "Tap to flip card"), /* @__PURE__ */ React20.createElement("div", { className: "w-full flex flex-col gap-4" }, /* @__PURE__ */ React20.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ React20.createElement(
|
|
1844
1843
|
MenuRow,
|
|
@@ -1878,8 +1877,6 @@ var UniversalCardPage = ({
|
|
|
1878
1877
|
title: "Delete card",
|
|
1879
1878
|
subtitle: "Permanently delete card",
|
|
1880
1879
|
onClick: () => setShowDeleteDialog(true),
|
|
1881
|
-
iconColor: "text-red-500",
|
|
1882
|
-
titleColor: "text-red-500",
|
|
1883
1880
|
isLast: true
|
|
1884
1881
|
}
|
|
1885
1882
|
))), /* @__PURE__ */ React20.createElement(
|
|
@@ -2064,7 +2061,7 @@ var MenuRow2 = ({ icon, title, subtitle, onClick, iconColor = "text-black", titl
|
|
|
2064
2061
|
onClick,
|
|
2065
2062
|
className: `flex items-center p-4 cursor-pointer hover:bg-neutral-50 transition-colors ${!isLast ? "" : ""}`
|
|
2066
2063
|
},
|
|
2067
|
-
/* @__PURE__ */ React21.createElement("div", { className: "w-9 h-9 rounded-full flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon15, { icon, size: 16, className: iconColor })),
|
|
2064
|
+
/* @__PURE__ */ React21.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon15, { icon, size: 16, className: iconColor })),
|
|
2068
2065
|
/* @__PURE__ */ React21.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React21.createElement("p", { className: `text-[13px] font-medium truncate ${titleColor}` }, title), /* @__PURE__ */ React21.createElement("p", { className: "text-[11px] text-neutral-500 truncate" }, subtitle)),
|
|
2069
2066
|
/* @__PURE__ */ React21.createElement(HugeiconsIcon15, { icon: ArrowRight01Icon3, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
|
|
2070
2067
|
);
|