@retinalabsllc/zairusjs 11.0.5 → 11.0.10
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.d.mts +8 -0
- package/dist/index.d.ts +8 -0
- package/dist/index.js +68 -59
- package/dist/index.mjs +71 -60
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -265,6 +265,8 @@ interface UniversalWallet {
|
|
|
265
265
|
network: string;
|
|
266
266
|
address: string;
|
|
267
267
|
logoSrc: string;
|
|
268
|
+
networkLogoSrc?: string;
|
|
269
|
+
isActive?: boolean;
|
|
268
270
|
}
|
|
269
271
|
interface UniversalWalletPageProps {
|
|
270
272
|
headerTitle: string;
|
|
@@ -278,6 +280,12 @@ interface UniversalWalletPageProps {
|
|
|
278
280
|
renderQrCode?: (wallet: UniversalWallet) => React.ReactNode;
|
|
279
281
|
onDownloadPayId?: (wallet: UniversalWallet) => void;
|
|
280
282
|
onCopyAddress?: (wallet: UniversalWallet) => void;
|
|
283
|
+
onGeneratePhrase?: () => string;
|
|
284
|
+
onValidatePhrase?: (phrase: string) => boolean;
|
|
285
|
+
onSaveLocally?: (phrase: string, password: string) => Promise<{
|
|
286
|
+
success: boolean;
|
|
287
|
+
address?: string;
|
|
288
|
+
}>;
|
|
281
289
|
}
|
|
282
290
|
declare const UniversalWalletPage: React.FC<UniversalWalletPageProps>;
|
|
283
291
|
|
package/dist/index.d.ts
CHANGED
|
@@ -265,6 +265,8 @@ interface UniversalWallet {
|
|
|
265
265
|
network: string;
|
|
266
266
|
address: string;
|
|
267
267
|
logoSrc: string;
|
|
268
|
+
networkLogoSrc?: string;
|
|
269
|
+
isActive?: boolean;
|
|
268
270
|
}
|
|
269
271
|
interface UniversalWalletPageProps {
|
|
270
272
|
headerTitle: string;
|
|
@@ -278,6 +280,12 @@ interface UniversalWalletPageProps {
|
|
|
278
280
|
renderQrCode?: (wallet: UniversalWallet) => React.ReactNode;
|
|
279
281
|
onDownloadPayId?: (wallet: UniversalWallet) => void;
|
|
280
282
|
onCopyAddress?: (wallet: UniversalWallet) => void;
|
|
283
|
+
onGeneratePhrase?: () => string;
|
|
284
|
+
onValidatePhrase?: (phrase: string) => boolean;
|
|
285
|
+
onSaveLocally?: (phrase: string, password: string) => Promise<{
|
|
286
|
+
success: boolean;
|
|
287
|
+
address?: string;
|
|
288
|
+
}>;
|
|
281
289
|
}
|
|
282
290
|
declare const UniversalWalletPage: React.FC<UniversalWalletPageProps>;
|
|
283
291
|
|
package/dist/index.js
CHANGED
|
@@ -695,7 +695,7 @@ var ManagedToaster = () => {
|
|
|
695
695
|
);
|
|
696
696
|
};
|
|
697
697
|
|
|
698
|
-
// src/components/
|
|
698
|
+
// src/components/TextInput.tsx
|
|
699
699
|
var import_react12 = __toESM(require("react"));
|
|
700
700
|
var TextInput = ({
|
|
701
701
|
label,
|
|
@@ -1571,15 +1571,7 @@ var truncateAddress2 = (ref) => {
|
|
|
1571
1571
|
};
|
|
1572
1572
|
var WalletLogo = ({ src, alt, sizeClass = "w-10 h-10" }) => {
|
|
1573
1573
|
const [isLoaded, setIsLoaded] = (0, import_react27.useState)(false);
|
|
1574
|
-
return /* @__PURE__ */ import_react27.default.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden ${sizeClass}` }, !isLoaded && /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Loading03Icon, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ import_react27.default.createElement(
|
|
1575
|
-
"img",
|
|
1576
|
-
{
|
|
1577
|
-
src,
|
|
1578
|
-
alt,
|
|
1579
|
-
onLoad: () => setIsLoaded(true),
|
|
1580
|
-
className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}`
|
|
1581
|
-
}
|
|
1582
|
-
));
|
|
1574
|
+
return /* @__PURE__ */ import_react27.default.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden ${sizeClass}` }, !isLoaded && /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Loading03Icon, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ import_react27.default.createElement("img", { src, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
|
|
1583
1575
|
};
|
|
1584
1576
|
var UniversalWalletPage = ({
|
|
1585
1577
|
headerTitle,
|
|
@@ -1592,74 +1584,91 @@ var UniversalWalletPage = ({
|
|
|
1592
1584
|
renderQrCode,
|
|
1593
1585
|
onDownloadPayId,
|
|
1594
1586
|
onCopyAddress,
|
|
1595
|
-
onBack
|
|
1587
|
+
onBack,
|
|
1588
|
+
onGeneratePhrase,
|
|
1589
|
+
onValidatePhrase,
|
|
1590
|
+
onSaveLocally
|
|
1596
1591
|
}) => {
|
|
1597
1592
|
const onBackHandler = onBack ?? (() => {
|
|
1598
1593
|
if (typeof window !== "undefined") window.history.back();
|
|
1599
1594
|
});
|
|
1600
1595
|
const [selectedWallet, setSelectedWallet] = (0, import_react27.useState)(null);
|
|
1601
1596
|
const [localSearchQuery, setLocalSearchQuery] = (0, import_react27.useState)("");
|
|
1597
|
+
const [addModalOpen, setAddModalOpen] = (0, import_react27.useState)(false);
|
|
1598
|
+
const [importModalOpen, setImportModalOpen] = (0, import_react27.useState)(false);
|
|
1599
|
+
const [flowStep, setFlowStep] = (0, import_react27.useState)(1);
|
|
1600
|
+
const [generatedPhrase, setGeneratedPhrase] = (0, import_react27.useState)("");
|
|
1601
|
+
const [hasBackedUp, setHasBackedUp] = (0, import_react27.useState)(false);
|
|
1602
|
+
const [verifyPhraseInput, setVerifyPhraseInput] = (0, import_react27.useState)("");
|
|
1603
|
+
const [walletPassword, setWalletPassword] = (0, import_react27.useState)("");
|
|
1604
|
+
const [isProcessing, setIsProcessing] = (0, import_react27.useState)(false);
|
|
1602
1605
|
const filteredWallets = wallets.filter((wallet) => {
|
|
1603
1606
|
const q = localSearchQuery.toLowerCase();
|
|
1604
1607
|
return wallet.name.toLowerCase().includes(q) || wallet.currency.toLowerCase().includes(q) || wallet.network.toLowerCase().includes(q);
|
|
1605
1608
|
});
|
|
1606
|
-
const handleCopy = (
|
|
1607
|
-
if (
|
|
1608
|
-
|
|
1609
|
-
|
|
1610
|
-
|
|
1609
|
+
const handleCopy = (text, isWallet = true) => {
|
|
1610
|
+
if (typeof navigator !== "undefined" && navigator.clipboard) navigator.clipboard.writeText(text).catch(() => {
|
|
1611
|
+
});
|
|
1612
|
+
import_react_hot_toast6.default.success(isWallet ? "Address Copied" : "Copied to clipboard");
|
|
1613
|
+
};
|
|
1614
|
+
const startWalletGeneration = () => {
|
|
1615
|
+
if (onGeneratePhrase) setGeneratedPhrase(onGeneratePhrase());
|
|
1616
|
+
setHasBackedUp(false);
|
|
1617
|
+
setVerifyPhraseInput("");
|
|
1618
|
+
setWalletPassword("");
|
|
1619
|
+
setFlowStep(1);
|
|
1620
|
+
setAddModalOpen(true);
|
|
1621
|
+
};
|
|
1622
|
+
const handleCreationNext = () => {
|
|
1623
|
+
if (flowStep === 1) {
|
|
1624
|
+
if (!hasBackedUp) return import_react_hot_toast6.default.error("Please confirm you have backed up the phrase.");
|
|
1625
|
+
setFlowStep(2);
|
|
1626
|
+
} else if (flowStep === 2) {
|
|
1627
|
+
if (verifyPhraseInput.trim() !== generatedPhrase.trim()) return import_react_hot_toast6.default.error("Phrase does not match. Try again.");
|
|
1628
|
+
setFlowStep(3);
|
|
1611
1629
|
}
|
|
1612
|
-
import_react_hot_toast6.default.success("Copied");
|
|
1613
1630
|
};
|
|
1614
|
-
|
|
1615
|
-
"
|
|
1616
|
-
|
|
1617
|
-
|
|
1618
|
-
|
|
1619
|
-
|
|
1620
|
-
|
|
1621
|
-
"
|
|
1622
|
-
|
|
1631
|
+
const startWalletImport = () => {
|
|
1632
|
+
setVerifyPhraseInput("");
|
|
1633
|
+
setWalletPassword("");
|
|
1634
|
+
setFlowStep(1);
|
|
1635
|
+
setImportModalOpen(true);
|
|
1636
|
+
};
|
|
1637
|
+
const handleImportNext = () => {
|
|
1638
|
+
if (!verifyPhraseInput.trim()) return import_react_hot_toast6.default.error("Please enter phrase.");
|
|
1639
|
+
if (onValidatePhrase && !onValidatePhrase(verifyPhraseInput)) {
|
|
1640
|
+
return import_react_hot_toast6.default.error("Invalid recovery phrase. Please check your spelling.");
|
|
1641
|
+
}
|
|
1642
|
+
setFlowStep(2);
|
|
1643
|
+
};
|
|
1644
|
+
const handleSaveWallet = async (phrase) => {
|
|
1645
|
+
if (!walletPassword || walletPassword.length < 6) return import_react_hot_toast6.default.error("Password must be at least 6 characters.");
|
|
1646
|
+
setIsProcessing(true);
|
|
1647
|
+
try {
|
|
1648
|
+
if (onSaveLocally) {
|
|
1649
|
+
const res = await onSaveLocally(phrase, walletPassword);
|
|
1650
|
+
if (res.success) {
|
|
1651
|
+
import_react_hot_toast6.default.success("Wallet secured locally.");
|
|
1652
|
+
setAddModalOpen(false);
|
|
1653
|
+
setImportModalOpen(false);
|
|
1654
|
+
} else {
|
|
1655
|
+
import_react_hot_toast6.default.error("Failed to secure wallet.");
|
|
1656
|
+
}
|
|
1657
|
+
}
|
|
1658
|
+
} finally {
|
|
1659
|
+
setIsProcessing(false);
|
|
1660
|
+
}
|
|
1661
|
+
};
|
|
1662
|
+
return /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ import_react27.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] font-medium outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react27.default.createElement(ManagedToaster, null), !hideControls && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col sm:flex-row mb-4 items-center justify-between gap-4 w-full" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative w-full sm:w-96" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Search01Icon, size: 16, className: "text-neutral-400" })), /* @__PURE__ */ import_react27.default.createElement(
|
|
1623
1663
|
"input",
|
|
1624
1664
|
{
|
|
1625
1665
|
type: "text",
|
|
1626
1666
|
placeholder: "Search wallets by name or network...",
|
|
1627
1667
|
value: localSearchQuery,
|
|
1628
1668
|
onChange: (e) => setLocalSearchQuery(e.target.value),
|
|
1629
|
-
className: "w-full pl-10 pr-4 py-2 bg-white
|
|
1669
|
+
className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-[13px] text-black placeholder-neutral-400 outline-none transition-all duration-300 focus:border-black"
|
|
1630
1670
|
}
|
|
1631
|
-
))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ import_react27.default.createElement(PageSpinner3, null) : /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react27.default.createElement("div", null, filteredWallets.length === 0 ? /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No wallets found") : filteredWallets.map((wallet) => /* @__PURE__ */ import_react27.default.createElement(
|
|
1632
|
-
"div",
|
|
1633
|
-
{
|
|
1634
|
-
key: wallet.id,
|
|
1635
|
-
onClick: () => setSelectedWallet(wallet),
|
|
1636
|
-
className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
|
|
1637
|
-
},
|
|
1638
|
-
/* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react27.default.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-[13px] text-black truncate " }, wallet.name), /* @__PURE__ */ import_react27.default.createElement("p", { className: `text-[13px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, wallet.balance, " ", wallet.currency))),
|
|
1639
|
-
/* @__PURE__ */ import_react27.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[10px] tracking-wide text-neutral-600 bg-neutral-100 px-2.5 py-1 rounded-full " }, wallet.network))
|
|
1640
|
-
)))))), selectedWallet && /* @__PURE__ */ import_react27.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedWallet(null) }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react27.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Wallet Details"), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => setSelectedWallet(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-6" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ import_react27.default.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14 mb-4" }), /* @__PURE__ */ import_react27.default.createElement("h2", { className: `text-2xl text-black mb-2 transition-all duration-300 ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedWallet.balance, " ", selectedWallet.currency), /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full border border-neutral-200 mt-1 " }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, renderQrCode(selectedWallet)), /* @__PURE__ */ import_react27.default.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Address"), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-black truncate min-w-0 block" }, truncateAddress2(selectedWallet.address)), /* @__PURE__ */ import_react27.default.createElement(
|
|
1641
|
-
"button",
|
|
1642
|
-
{
|
|
1643
|
-
onClick: () => handleCopy(selectedWallet),
|
|
1644
|
-
className: "text-neutral-400 hover:text-black transition-colors outline-none"
|
|
1645
|
-
},
|
|
1646
|
-
/* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Copy01Icon, size: 14 })
|
|
1647
|
-
))), /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Name"), /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-black" }, selectedWallet.name))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react27.default.createElement(
|
|
1648
|
-
ThreeDActionButton,
|
|
1649
|
-
{
|
|
1650
|
-
onClick: () => onDownloadPayId && onDownloadPayId(selectedWallet),
|
|
1651
|
-
isLoading: isGeneratingStatement,
|
|
1652
|
-
className: "w-full"
|
|
1653
|
-
},
|
|
1654
|
-
"Generate Statement"
|
|
1655
|
-
), /* @__PURE__ */ import_react27.default.createElement(
|
|
1656
|
-
"button",
|
|
1657
|
-
{
|
|
1658
|
-
onClick: () => handleCopy(selectedWallet),
|
|
1659
|
-
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs tracking-wide transition-colors"
|
|
1660
|
-
},
|
|
1661
|
-
"Copy Wallet Address"
|
|
1662
|
-
)))))));
|
|
1671
|
+
)), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-2 shrink-0 self-end sm:self-auto" }, /* @__PURE__ */ import_react27.default.createElement("button", { onClick: startWalletGeneration, className: "w-10 h-10 bg-black text-white rounded-full flex items-center justify-center hover:bg-neutral-800 transition-colors shadow-sm outline-none", title: "Create Wallet" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.PlusSignIcon, size: 18 })), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: startWalletImport, className: "w-10 h-10 bg-white text-black border border-neutral-100 rounded-full flex items-center justify-center hover:bg-neutral-50 transition-colors shadow-sm outline-none", title: "Import Wallet" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Upload01Icon, size: 18 })))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ import_react27.default.createElement(PageSpinner3, null) : /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react27.default.createElement("div", null, filteredWallets.length === 0 ? /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No wallets found") : filteredWallets.map((wallet) => /* @__PURE__ */ import_react27.default.createElement("div", { key: wallet.id, onClick: () => setSelectedWallet(wallet), className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative shrink-0" }, /* @__PURE__ */ import_react27.default.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), wallet.networkLogoSrc && /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute -bottom-1 -right-1 w-4 h-4 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ import_react27.default.createElement("img", { src: wallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-[13px] text-black truncate" }, wallet.name), wallet.isActive !== void 0 && /* @__PURE__ */ import_react27.default.createElement("span", { className: `text-[9px] px-1.5 py-0.5 rounded-sm tracking-widest uppercase ${wallet.isActive ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-600"}` }, wallet.isActive ? "Active" : "Inactive")), /* @__PURE__ */ import_react27.default.createElement("p", { className: `text-[13px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, wallet.balance, " ", wallet.currency))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[10px] tracking-wide text-neutral-600 bg-neutral-100 px-2.5 py-1 rounded-full " }, wallet.network)))))))), addModalOpen && /* @__PURE__ */ import_react27.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setAddModalOpen(false) }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 border-b border-neutral-50" }, /* @__PURE__ */ import_react27.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, flowStep === 1 ? "Secret Recovery Phrase" : flowStep === 2 ? "Verify Phrase" : "Secure Wallet"), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => !isProcessing && setAddModalOpen(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "p-6" }, flowStep === 1 && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ import_react27.default.createElement(Banner, { type: "alert", title: "CRITICAL WARNING", message: "This phrase is the master key to your wallet. Anyone with these words has full control over your assets. Aeona cannot recover this if lost.", isDismissible: false }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "bg-neutral-50 p-4 rounded-xl border border-neutral-100" }, /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-sm leading-relaxed text-black font-mono tracking-wide selection:bg-neutral-200" }, generatedPhrase)), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center justify-between gap-2" }, /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => handleCopy(generatedPhrase, false), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Copy01Icon, size: 14 }), " Copy to Clipboard")), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-start gap-3 mt-2" }, /* @__PURE__ */ import_react27.default.createElement("input", { type: "checkbox", id: "backup-confirm", checked: hasBackedUp, onChange: (e) => setHasBackedUp(e.target.checked), className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer" }), /* @__PURE__ */ import_react27.default.createElement("label", { htmlFor: "backup-confirm", className: "text-xs text-neutral-600 cursor-pointer leading-relaxed" }, "I have securely copied and stored my recovery phrase.")), /* @__PURE__ */ import_react27.default.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "Continue")), flowStep === 2 && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-sm text-neutral-600" }, "Please paste your recovery phrase below to verify you have backed it up correctly."), /* @__PURE__ */ import_react27.default.createElement(TextInput, { label: "RECOVERY PHRASE", value: verifyPhraseInput, onChange: setVerifyPhraseInput, placeholder: "abandon abandon abandon..." }), /* @__PURE__ */ import_react27.default.createElement(ThreeDActionButton, { onClick: handleCreationNext, disabled: !verifyPhraseInput, className: "w-full mt-2" }, "Verify")), flowStep === 3 && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ import_react27.default.createElement(Banner, { type: "success", title: "Phrase Verified", message: "Your phrase is correct. Now set a local password to encrypt your wallet on this device.", isDismissible: false }), /* @__PURE__ */ import_react27.default.createElement(TextInput, { label: "LOCAL PASSWORD", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ import_react27.default.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet(generatedPhrase), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Save Wallet"))))), importModalOpen && /* @__PURE__ */ import_react27.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setImportModalOpen(false) }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 border-b border-neutral-50" }, /* @__PURE__ */ import_react27.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Import Wallet"), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => !isProcessing && setImportModalOpen(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "p-6" }, flowStep === 1 && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-sm text-neutral-600" }, "Enter your 12 or 24-word recovery phrase to restore your wallet on this device."), /* @__PURE__ */ import_react27.default.createElement(TextInput, { label: "RECOVERY PHRASE", value: verifyPhraseInput, onChange: setVerifyPhraseInput, placeholder: "abandon abandon abandon..." }), /* @__PURE__ */ import_react27.default.createElement(ThreeDActionButton, { onClick: handleImportNext, className: "w-full mt-2" }, "Continue")), flowStep === 2 && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-sm text-neutral-600" }, "Set a local password to encrypt this wallet on this specific browser."), /* @__PURE__ */ import_react27.default.createElement(TextInput, { label: "LOCAL PASSWORD", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ import_react27.default.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet(verifyPhraseInput), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Import Wallet"))))), selectedWallet && /* @__PURE__ */ import_react27.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedWallet(null) }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react27.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Wallet Details"), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => setSelectedWallet(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-6" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative mb-4" }, /* @__PURE__ */ import_react27.default.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14" }), selectedWallet.networkLogoSrc && /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute -bottom-1 -right-1 w-5 h-5 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ import_react27.default.createElement("img", { src: selectedWallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ import_react27.default.createElement("h2", { className: `text-2xl text-black mb-2 transition-all duration-300 ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedWallet.balance, " ", selectedWallet.currency), /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full border border-neutral-200 mt-1 " }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, renderQrCode(selectedWallet)), /* @__PURE__ */ import_react27.default.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Address"), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-black truncate min-w-0 block" }, truncateAddress2(selectedWallet.address)), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => handleCopy(selectedWallet.address, true), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Copy01Icon, size: 14 })))), /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Status"), selectedWallet.isActive ? /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-emerald-600 font-medium" }, "Active on this device") : /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-red-600 font-medium" }, "Inactive - Requires Import"))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react27.default.createElement(ThreeDActionButton, { onClick: () => onDownloadPayId && onDownloadPayId(selectedWallet), isLoading: isGeneratingStatement, className: "w-full" }, "Generate Statement"), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => handleCopy(selectedWallet.address, true), className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs tracking-wide transition-colors" }, "Copy Wallet Address")))))));
|
|
1663
1672
|
};
|
|
1664
1673
|
|
|
1665
1674
|
// src/components/UniversalCardPage.tsx
|
package/dist/index.mjs
CHANGED
|
@@ -623,7 +623,7 @@ var ManagedToaster = () => {
|
|
|
623
623
|
);
|
|
624
624
|
};
|
|
625
625
|
|
|
626
|
-
// src/components/
|
|
626
|
+
// src/components/TextInput.tsx
|
|
627
627
|
import React9 from "react";
|
|
628
628
|
var TextInput = ({
|
|
629
629
|
label,
|
|
@@ -1521,7 +1521,9 @@ import {
|
|
|
1521
1521
|
CancelCircleIcon as CancelCircleIcon3,
|
|
1522
1522
|
Loading03Icon as Loading03Icon5,
|
|
1523
1523
|
Copy01Icon as Copy01Icon2,
|
|
1524
|
-
ArrowLeft01Icon as ArrowLeft01Icon4
|
|
1524
|
+
ArrowLeft01Icon as ArrowLeft01Icon4,
|
|
1525
|
+
PlusSignIcon,
|
|
1526
|
+
Upload01Icon
|
|
1525
1527
|
} from "@hugeicons/core-free-icons";
|
|
1526
1528
|
var PageSpinner3 = () => /* @__PURE__ */ React17.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Loading03Icon5, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
1527
1529
|
var truncateAddress2 = (ref) => {
|
|
@@ -1530,15 +1532,7 @@ var truncateAddress2 = (ref) => {
|
|
|
1530
1532
|
};
|
|
1531
1533
|
var WalletLogo = ({ src, alt, sizeClass = "w-10 h-10" }) => {
|
|
1532
1534
|
const [isLoaded, setIsLoaded] = useState10(false);
|
|
1533
|
-
return /* @__PURE__ */ React17.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Loading03Icon5, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ React17.createElement(
|
|
1534
|
-
"img",
|
|
1535
|
-
{
|
|
1536
|
-
src,
|
|
1537
|
-
alt,
|
|
1538
|
-
onLoad: () => setIsLoaded(true),
|
|
1539
|
-
className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}`
|
|
1540
|
-
}
|
|
1541
|
-
));
|
|
1535
|
+
return /* @__PURE__ */ React17.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Loading03Icon5, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ React17.createElement("img", { src, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
|
|
1542
1536
|
};
|
|
1543
1537
|
var UniversalWalletPage = ({
|
|
1544
1538
|
headerTitle,
|
|
@@ -1551,74 +1545,91 @@ var UniversalWalletPage = ({
|
|
|
1551
1545
|
renderQrCode,
|
|
1552
1546
|
onDownloadPayId,
|
|
1553
1547
|
onCopyAddress,
|
|
1554
|
-
onBack
|
|
1548
|
+
onBack,
|
|
1549
|
+
onGeneratePhrase,
|
|
1550
|
+
onValidatePhrase,
|
|
1551
|
+
onSaveLocally
|
|
1555
1552
|
}) => {
|
|
1556
1553
|
const onBackHandler = onBack ?? (() => {
|
|
1557
1554
|
if (typeof window !== "undefined") window.history.back();
|
|
1558
1555
|
});
|
|
1559
1556
|
const [selectedWallet, setSelectedWallet] = useState10(null);
|
|
1560
1557
|
const [localSearchQuery, setLocalSearchQuery] = useState10("");
|
|
1558
|
+
const [addModalOpen, setAddModalOpen] = useState10(false);
|
|
1559
|
+
const [importModalOpen, setImportModalOpen] = useState10(false);
|
|
1560
|
+
const [flowStep, setFlowStep] = useState10(1);
|
|
1561
|
+
const [generatedPhrase, setGeneratedPhrase] = useState10("");
|
|
1562
|
+
const [hasBackedUp, setHasBackedUp] = useState10(false);
|
|
1563
|
+
const [verifyPhraseInput, setVerifyPhraseInput] = useState10("");
|
|
1564
|
+
const [walletPassword, setWalletPassword] = useState10("");
|
|
1565
|
+
const [isProcessing, setIsProcessing] = useState10(false);
|
|
1561
1566
|
const filteredWallets = wallets.filter((wallet) => {
|
|
1562
1567
|
const q = localSearchQuery.toLowerCase();
|
|
1563
1568
|
return wallet.name.toLowerCase().includes(q) || wallet.currency.toLowerCase().includes(q) || wallet.network.toLowerCase().includes(q);
|
|
1564
1569
|
});
|
|
1565
|
-
const handleCopy = (
|
|
1566
|
-
if (
|
|
1567
|
-
|
|
1568
|
-
|
|
1569
|
-
|
|
1570
|
+
const handleCopy = (text, isWallet = true) => {
|
|
1571
|
+
if (typeof navigator !== "undefined" && navigator.clipboard) navigator.clipboard.writeText(text).catch(() => {
|
|
1572
|
+
});
|
|
1573
|
+
toast5.success(isWallet ? "Address Copied" : "Copied to clipboard");
|
|
1574
|
+
};
|
|
1575
|
+
const startWalletGeneration = () => {
|
|
1576
|
+
if (onGeneratePhrase) setGeneratedPhrase(onGeneratePhrase());
|
|
1577
|
+
setHasBackedUp(false);
|
|
1578
|
+
setVerifyPhraseInput("");
|
|
1579
|
+
setWalletPassword("");
|
|
1580
|
+
setFlowStep(1);
|
|
1581
|
+
setAddModalOpen(true);
|
|
1582
|
+
};
|
|
1583
|
+
const handleCreationNext = () => {
|
|
1584
|
+
if (flowStep === 1) {
|
|
1585
|
+
if (!hasBackedUp) return toast5.error("Please confirm you have backed up the phrase.");
|
|
1586
|
+
setFlowStep(2);
|
|
1587
|
+
} else if (flowStep === 2) {
|
|
1588
|
+
if (verifyPhraseInput.trim() !== generatedPhrase.trim()) return toast5.error("Phrase does not match. Try again.");
|
|
1589
|
+
setFlowStep(3);
|
|
1570
1590
|
}
|
|
1571
|
-
toast5.success("Copied");
|
|
1572
1591
|
};
|
|
1573
|
-
|
|
1574
|
-
"
|
|
1575
|
-
|
|
1576
|
-
|
|
1577
|
-
|
|
1578
|
-
|
|
1579
|
-
|
|
1580
|
-
"
|
|
1581
|
-
|
|
1592
|
+
const startWalletImport = () => {
|
|
1593
|
+
setVerifyPhraseInput("");
|
|
1594
|
+
setWalletPassword("");
|
|
1595
|
+
setFlowStep(1);
|
|
1596
|
+
setImportModalOpen(true);
|
|
1597
|
+
};
|
|
1598
|
+
const handleImportNext = () => {
|
|
1599
|
+
if (!verifyPhraseInput.trim()) return toast5.error("Please enter phrase.");
|
|
1600
|
+
if (onValidatePhrase && !onValidatePhrase(verifyPhraseInput)) {
|
|
1601
|
+
return toast5.error("Invalid recovery phrase. Please check your spelling.");
|
|
1602
|
+
}
|
|
1603
|
+
setFlowStep(2);
|
|
1604
|
+
};
|
|
1605
|
+
const handleSaveWallet = async (phrase) => {
|
|
1606
|
+
if (!walletPassword || walletPassword.length < 6) return toast5.error("Password must be at least 6 characters.");
|
|
1607
|
+
setIsProcessing(true);
|
|
1608
|
+
try {
|
|
1609
|
+
if (onSaveLocally) {
|
|
1610
|
+
const res = await onSaveLocally(phrase, walletPassword);
|
|
1611
|
+
if (res.success) {
|
|
1612
|
+
toast5.success("Wallet secured locally.");
|
|
1613
|
+
setAddModalOpen(false);
|
|
1614
|
+
setImportModalOpen(false);
|
|
1615
|
+
} else {
|
|
1616
|
+
toast5.error("Failed to secure wallet.");
|
|
1617
|
+
}
|
|
1618
|
+
}
|
|
1619
|
+
} finally {
|
|
1620
|
+
setIsProcessing(false);
|
|
1621
|
+
}
|
|
1622
|
+
};
|
|
1623
|
+
return /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ React17.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] font-medium outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: ArrowLeft01Icon4, size: 16 }), " Back")), /* @__PURE__ */ React17.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React17.createElement(ManagedToaster, null), !hideControls && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col sm:flex-row mb-4 items-center justify-between gap-4 w-full" }, /* @__PURE__ */ React17.createElement("div", { className: "relative w-full sm:w-96" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Search01Icon2, size: 16, className: "text-neutral-400" })), /* @__PURE__ */ React17.createElement(
|
|
1582
1624
|
"input",
|
|
1583
1625
|
{
|
|
1584
1626
|
type: "text",
|
|
1585
1627
|
placeholder: "Search wallets by name or network...",
|
|
1586
1628
|
value: localSearchQuery,
|
|
1587
1629
|
onChange: (e) => setLocalSearchQuery(e.target.value),
|
|
1588
|
-
className: "w-full pl-10 pr-4 py-2 bg-white
|
|
1630
|
+
className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-[13px] text-black placeholder-neutral-400 outline-none transition-all duration-300 focus:border-black"
|
|
1589
1631
|
}
|
|
1590
|
-
))), /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ React17.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), /* @__PURE__ */ React17.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React17.createElement(PageSpinner3, null) : /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React17.createElement("div", null, filteredWallets.length === 0 ? /* @__PURE__ */ React17.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No wallets found") : filteredWallets.map((wallet) => /* @__PURE__ */ React17.createElement(
|
|
1591
|
-
"div",
|
|
1592
|
-
{
|
|
1593
|
-
key: wallet.id,
|
|
1594
|
-
onClick: () => setSelectedWallet(wallet),
|
|
1595
|
-
className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
|
|
1596
|
-
},
|
|
1597
|
-
/* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React17.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), /* @__PURE__ */ React17.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ React17.createElement("p", { className: "text-[13px] text-black truncate " }, wallet.name), /* @__PURE__ */ React17.createElement("p", { className: `text-[13px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, wallet.balance, " ", wallet.currency))),
|
|
1598
|
-
/* @__PURE__ */ React17.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[10px] tracking-wide text-neutral-600 bg-neutral-100 px-2.5 py-1 rounded-full " }, wallet.network))
|
|
1599
|
-
)))))), selectedWallet && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedWallet(null) }), /* @__PURE__ */ React17.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Wallet Details"), /* @__PURE__ */ React17.createElement("button", { onClick: () => setSelectedWallet(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: CancelCircleIcon3, size: 18 }))), /* @__PURE__ */ React17.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-6" }, /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ React17.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14 mb-4" }), /* @__PURE__ */ React17.createElement("h2", { className: `text-2xl text-black mb-2 transition-all duration-300 ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedWallet.balance, " ", selectedWallet.currency), /* @__PURE__ */ React17.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full border border-neutral-200 mt-1 " }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ React17.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, renderQrCode(selectedWallet)), /* @__PURE__ */ React17.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Address"), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[13px] text-black truncate min-w-0 block" }, truncateAddress2(selectedWallet.address)), /* @__PURE__ */ React17.createElement(
|
|
1600
|
-
"button",
|
|
1601
|
-
{
|
|
1602
|
-
onClick: () => handleCopy(selectedWallet),
|
|
1603
|
-
className: "text-neutral-400 hover:text-black transition-colors outline-none"
|
|
1604
|
-
},
|
|
1605
|
-
/* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Copy01Icon2, size: 14 })
|
|
1606
|
-
))), /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Name"), /* @__PURE__ */ React17.createElement("span", { className: "text-[13px] text-black" }, selectedWallet.name))), /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React17.createElement(
|
|
1607
|
-
ThreeDActionButton,
|
|
1608
|
-
{
|
|
1609
|
-
onClick: () => onDownloadPayId && onDownloadPayId(selectedWallet),
|
|
1610
|
-
isLoading: isGeneratingStatement,
|
|
1611
|
-
className: "w-full"
|
|
1612
|
-
},
|
|
1613
|
-
"Generate Statement"
|
|
1614
|
-
), /* @__PURE__ */ React17.createElement(
|
|
1615
|
-
"button",
|
|
1616
|
-
{
|
|
1617
|
-
onClick: () => handleCopy(selectedWallet),
|
|
1618
|
-
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs tracking-wide transition-colors"
|
|
1619
|
-
},
|
|
1620
|
-
"Copy Wallet Address"
|
|
1621
|
-
)))))));
|
|
1632
|
+
)), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-2 shrink-0 self-end sm:self-auto" }, /* @__PURE__ */ React17.createElement("button", { onClick: startWalletGeneration, className: "w-10 h-10 bg-black text-white rounded-full flex items-center justify-center hover:bg-neutral-800 transition-colors shadow-sm outline-none", title: "Create Wallet" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: PlusSignIcon, size: 18 })), /* @__PURE__ */ React17.createElement("button", { onClick: startWalletImport, className: "w-10 h-10 bg-white text-black border border-neutral-100 rounded-full flex items-center justify-center hover:bg-neutral-50 transition-colors shadow-sm outline-none", title: "Import Wallet" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Upload01Icon, size: 18 })))), /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ React17.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), /* @__PURE__ */ React17.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React17.createElement(PageSpinner3, null) : /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React17.createElement("div", null, filteredWallets.length === 0 ? /* @__PURE__ */ React17.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No wallets found") : filteredWallets.map((wallet) => /* @__PURE__ */ React17.createElement("div", { key: wallet.id, onClick: () => setSelectedWallet(wallet), className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React17.createElement("div", { className: "relative shrink-0" }, /* @__PURE__ */ React17.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), wallet.networkLogoSrc && /* @__PURE__ */ React17.createElement("div", { className: "absolute -bottom-1 -right-1 w-4 h-4 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ React17.createElement("img", { src: wallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ React17.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React17.createElement("p", { className: "text-[13px] text-black truncate" }, wallet.name), wallet.isActive !== void 0 && /* @__PURE__ */ React17.createElement("span", { className: `text-[9px] px-1.5 py-0.5 rounded-sm tracking-widest uppercase ${wallet.isActive ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-600"}` }, wallet.isActive ? "Active" : "Inactive")), /* @__PURE__ */ React17.createElement("p", { className: `text-[13px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, wallet.balance, " ", wallet.currency))), /* @__PURE__ */ React17.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[10px] tracking-wide text-neutral-600 bg-neutral-100 px-2.5 py-1 rounded-full " }, wallet.network)))))))), addModalOpen && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setAddModalOpen(false) }), /* @__PURE__ */ React17.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 border-b border-neutral-50" }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, flowStep === 1 ? "Secret Recovery Phrase" : flowStep === 2 ? "Verify Phrase" : "Secure Wallet"), /* @__PURE__ */ React17.createElement("button", { onClick: () => !isProcessing && setAddModalOpen(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: CancelCircleIcon3, size: 18 }))), /* @__PURE__ */ React17.createElement("div", { className: "p-6" }, flowStep === 1 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ React17.createElement(Banner, { type: "alert", title: "CRITICAL WARNING", message: "This phrase is the master key to your wallet. Anyone with these words has full control over your assets. Aeona cannot recover this if lost.", isDismissible: false }), /* @__PURE__ */ React17.createElement("div", { className: "bg-neutral-50 p-4 rounded-xl border border-neutral-100" }, /* @__PURE__ */ React17.createElement("p", { className: "text-sm leading-relaxed text-black font-mono tracking-wide selection:bg-neutral-200" }, generatedPhrase)), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between gap-2" }, /* @__PURE__ */ React17.createElement("button", { onClick: () => handleCopy(generatedPhrase, false), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Copy01Icon2, size: 14 }), " Copy to Clipboard")), /* @__PURE__ */ React17.createElement("div", { className: "flex items-start gap-3 mt-2" }, /* @__PURE__ */ React17.createElement("input", { type: "checkbox", id: "backup-confirm", checked: hasBackedUp, onChange: (e) => setHasBackedUp(e.target.checked), className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer" }), /* @__PURE__ */ React17.createElement("label", { htmlFor: "backup-confirm", className: "text-xs text-neutral-600 cursor-pointer leading-relaxed" }, "I have securely copied and stored my recovery phrase.")), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "Continue")), flowStep === 2 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React17.createElement("p", { className: "text-sm text-neutral-600" }, "Please paste your recovery phrase below to verify you have backed it up correctly."), /* @__PURE__ */ React17.createElement(TextInput, { label: "RECOVERY PHRASE", value: verifyPhraseInput, onChange: setVerifyPhraseInput, placeholder: "abandon abandon abandon..." }), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: handleCreationNext, disabled: !verifyPhraseInput, className: "w-full mt-2" }, "Verify")), flowStep === 3 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React17.createElement(Banner, { type: "success", title: "Phrase Verified", message: "Your phrase is correct. Now set a local password to encrypt your wallet on this device.", isDismissible: false }), /* @__PURE__ */ React17.createElement(TextInput, { label: "LOCAL PASSWORD", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet(generatedPhrase), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Save Wallet"))))), importModalOpen && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setImportModalOpen(false) }), /* @__PURE__ */ React17.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 border-b border-neutral-50" }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Import Wallet"), /* @__PURE__ */ React17.createElement("button", { onClick: () => !isProcessing && setImportModalOpen(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: CancelCircleIcon3, size: 18 }))), /* @__PURE__ */ React17.createElement("div", { className: "p-6" }, flowStep === 1 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ React17.createElement("p", { className: "text-sm text-neutral-600" }, "Enter your 12 or 24-word recovery phrase to restore your wallet on this device."), /* @__PURE__ */ React17.createElement(TextInput, { label: "RECOVERY PHRASE", value: verifyPhraseInput, onChange: setVerifyPhraseInput, placeholder: "abandon abandon abandon..." }), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: handleImportNext, className: "w-full mt-2" }, "Continue")), flowStep === 2 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React17.createElement("p", { className: "text-sm text-neutral-600" }, "Set a local password to encrypt this wallet on this specific browser."), /* @__PURE__ */ React17.createElement(TextInput, { label: "LOCAL PASSWORD", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet(verifyPhraseInput), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Import Wallet"))))), selectedWallet && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedWallet(null) }), /* @__PURE__ */ React17.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Wallet Details"), /* @__PURE__ */ React17.createElement("button", { onClick: () => setSelectedWallet(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: CancelCircleIcon3, size: 18 }))), /* @__PURE__ */ React17.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-6" }, /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ React17.createElement("div", { className: "relative mb-4" }, /* @__PURE__ */ React17.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14" }), selectedWallet.networkLogoSrc && /* @__PURE__ */ React17.createElement("div", { className: "absolute -bottom-1 -right-1 w-5 h-5 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ React17.createElement("img", { src: selectedWallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ React17.createElement("h2", { className: `text-2xl text-black mb-2 transition-all duration-300 ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedWallet.balance, " ", selectedWallet.currency), /* @__PURE__ */ React17.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full border border-neutral-200 mt-1 " }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ React17.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, renderQrCode(selectedWallet)), /* @__PURE__ */ React17.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Address"), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[13px] text-black truncate min-w-0 block" }, truncateAddress2(selectedWallet.address)), /* @__PURE__ */ React17.createElement("button", { onClick: () => handleCopy(selectedWallet.address, true), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Copy01Icon2, size: 14 })))), /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Status"), selectedWallet.isActive ? /* @__PURE__ */ React17.createElement("span", { className: "text-[13px] text-emerald-600 font-medium" }, "Active on this device") : /* @__PURE__ */ React17.createElement("span", { className: "text-[13px] text-red-600 font-medium" }, "Inactive - Requires Import"))), /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: () => onDownloadPayId && onDownloadPayId(selectedWallet), isLoading: isGeneratingStatement, className: "w-full" }, "Generate Statement"), /* @__PURE__ */ React17.createElement("button", { onClick: () => handleCopy(selectedWallet.address, true), className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs tracking-wide transition-colors" }, "Copy Wallet Address")))))));
|
|
1622
1633
|
};
|
|
1623
1634
|
|
|
1624
1635
|
// src/components/UniversalCardPage.tsx
|