@shadow-corp/nearconnect 1.0.0

package/build/ui/TransactionModal.d.ts

@@ -0,0 +1,84 @@
+import { Modal, ModalOptions } from "./Modal";
+import { Transaction } from "../types";
+/**
+ * Transaction action display info
+ */
+interface ActionDisplay {
+    type: string;
+    title: string;
+    description: string;
+    details?: Record<string, string>;
+}
+/**
+ * Transaction modal view states
+ */
+type TransactionView = "review" | "signing" | "success" | "error";
+/**
+ * Transaction modal options
+ */
+export interface TransactionModalOptions extends ModalOptions {
+    transaction: Transaction;
+    walletName: string;
+    walletIcon?: string;
+    receiverId: string;
+    onConfirm: () => void;
+    onReject: () => void;
+    estimatedGas?: string;
+    estimatedDeposit?: string;
+}
+/**
+ * Transaction modal state
+ */
+interface TransactionState {
+    view: TransactionView;
+    error: {
+        title: string;
+        message: string;
+    } | null;
+    txHash?: string;
+}
+/**
+ * Transaction confirmation modal
+ */
+export declare class TransactionModal extends Modal {
+    protected readonly txOptions: Required<TransactionModalOptions>;
+    protected state: TransactionState;
+    protected actions: ActionDisplay[];
+    constructor(options: TransactionModalOptions);
+    /**
+     * Parse transaction actions for display
+     */
+    private parseActions;
+    /**
+     * Format yoctoNEAR to NEAR
+     */
+    private formatNear;
+    /**
+     * Format gas units to TGas
+     */
+    private formatGas;
+    protected render(): string;
+    private renderHeader;
+    private renderBody;
+    private renderReview;
+    private renderAction;
+    private renderSigning;
+    private renderSuccess;
+    private renderError;
+    private renderFooter;
+    protected setupHandlers(): void;
+    private handleAction;
+    /**
+     * Show signing state
+     */
+    showSigning(): void;
+    /**
+     * Show success state
+     */
+    showSuccess(txHash?: string): void;
+    /**
+     * Show error state
+     */
+    showError(title: string, message: string): void;
+}
+export {};

package/build/ui/TransactionModal.js

@@ -0,0 +1,406 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TransactionModal = void 0;
+const Modal_1 = require("./Modal");
+const icons_1 = require("./icons");
+/**
+ * Transaction confirmation modal
+ */
+class TransactionModal extends Modal_1.Modal {
+    txOptions;
+    state;
+    actions;
+    constructor(options) {
+        super({
+            ...options,
+            ariaLabel: "Transaction confirmation",
+        });
+        this.txOptions = {
+            ...this.options,
+            transaction: options.transaction,
+            walletName: options.walletName,
+            walletIcon: options.walletIcon ?? "",
+            receiverId: options.receiverId,
+            onConfirm: options.onConfirm,
+            onReject: options.onReject,
+            estimatedGas: options.estimatedGas ?? "~0.001 NEAR",
+            estimatedDeposit: options.estimatedDeposit ?? "0 NEAR",
+        };
+        this.state = {
+            view: "review",
+            error: null,
+        };
+        this.actions = this.parseActions(options.transaction);
+    }
+    /**
+     * Parse transaction actions for display
+     */
+    parseActions(tx) {
+        if (!tx.actions)
+            return [];
+        const results = [];
+        for (const action of tx.actions) {
+            // Handle both string and object action formats
+            if (typeof action === "string") {
+                results.push({
+                    type: action,
+                    title: action,
+                    description: "Transaction action",
+                });
+                continue;
+            }
+            const actionType = Object.keys(action)[0];
+            const actionData = action[actionType];
+            switch (actionType) {
+                case "FunctionCall":
+                case "functionCall": {
+                    const fc = actionData;
+                    const details = {};
+                    if (fc.deposit && fc.deposit !== "0")
+                        details["Deposit"] = this.formatNear(fc.deposit);
+                    if (fc.gas)
+                        details["Gas"] = this.formatGas(fc.gas);
+                    results.push({
+                        type: "Function Call",
+                        title: fc.methodName ?? "Function Call",
+                        description: `Call method on ${this.txOptions.receiverId}`,
+                        details: Object.keys(details).length > 0 ? details : undefined,
+                    });
+                    break;
+                }
+                case "Transfer":
+                case "transfer": {
+                    const t = actionData;
+                    results.push({
+                        type: "Transfer",
+                        title: "Transfer NEAR",
+                        description: `Send to ${this.txOptions.receiverId}`,
+                        details: {
+                            Amount: this.formatNear(t.deposit ?? "0"),
+                        },
+                    });
+                    break;
+                }
+                case "AddKey":
+                case "addKey":
+                    results.push({
+                        type: "Add Key",
+                        title: "Add Access Key",
+                        description: "Add a new access key to your account",
+                    });
+                    break;
+                case "DeleteKey":
+                case "deleteKey":
+                    results.push({
+                        type: "Delete Key",
+                        title: "Delete Access Key",
+                        description: "Remove an access key from your account",
+                    });
+                    break;
+                case "CreateAccount":
+                case "createAccount":
+                    results.push({
+                        type: "Create Account",
+                        title: "Create Account",
+                        description: `Create new account: ${this.txOptions.receiverId}`,
+                    });
+                    break;
+                case "DeleteAccount":
+                case "deleteAccount":
+                    results.push({
+                        type: "Delete Account",
+                        title: "⚠️ Delete Account",
+                        description: "Permanently delete this account",
+                    });
+                    break;
+                case "DeployContract":
+                case "deployContract":
+                    results.push({
+                        type: "Deploy Contract",
+                        title: "Deploy Contract",
+                        description: `Deploy contract to ${this.txOptions.receiverId}`,
+                    });
+                    break;
+                case "Stake":
+                case "stake": {
+                    const s = actionData;
+                    results.push({
+                        type: "Stake",
+                        title: "Stake NEAR",
+                        description: "Stake tokens with a validator",
+                        details: {
+                            Amount: this.formatNear(s.stake ?? "0"),
+                        },
+                    });
+                    break;
+                }
+                default:
+                    results.push({
+                        type: actionType,
+                        title: actionType,
+                        description: "Transaction action",
+                    });
+            }
+        }
+        return results;
+    }
+    /**
+     * Format yoctoNEAR to NEAR
+     */
+    formatNear(yocto) {
+        try {
+            const value = BigInt(yocto);
+            const near = Number(value) / 1e24;
+            if (near < 0.001 && near > 0) {
+                return "< 0.001 NEAR";
+            }
+            return `${near.toFixed(4)} NEAR`;
+        }
+        catch {
+            return yocto;
+        }
+    }
+    /**
+     * Format gas units to TGas
+     */
+    formatGas(gas) {
+        try {
+            const value = BigInt(gas);
+            const tgas = Number(value) / 1e12;
+            return `${tgas.toFixed(0)} TGas`;
+        }
+        catch {
+            return gas;
+        }
+    }
+    render() {
+        return `
+      <div class="nc-modal-overlay">
+        <div class="nc-modal">
+          ${this.renderHeader()}
+          ${this.renderBody()}
+          ${this.renderFooter()}
+        </div>
+      </div>
+    `;
+    }
+    renderHeader() {
+        const { view } = this.state;
+        let title = "Review Transaction";
+        if (view === "signing")
+            title = "Signing...";
+        if (view === "success")
+            title = "Transaction Sent";
+        if (view === "error")
+            title = "Transaction Failed";
+        return `
+      <div class="nc-header">
+        <h2 class="nc-header-title">${title}</h2>
+        <button class="nc-header-btn nc-header-btn--close" aria-label="Close">${icons_1.icons.close}</button>
+      </div>
+    `;
+    }
+    renderBody() {
+        switch (this.state.view) {
+            case "review":
+                return this.renderReview();
+            case "signing":
+                return this.renderSigning();
+            case "success":
+                return this.renderSuccess();
+            case "error":
+                return this.renderError();
+            default:
+                return this.renderReview();
+        }
+    }
+    renderReview() {
+        const { walletName, walletIcon, receiverId, estimatedGas, estimatedDeposit } = this.txOptions;
+        return `
+      <div class="nc-body">
+        <div class="nc-tx-wallet">
+          ${walletIcon ? `<img class="nc-tx-wallet-icon" src="${walletIcon}" alt="" />` : ""}
+          <span class="nc-tx-wallet-name">${walletName}</span>
+        </div>
+
+        <div class="nc-tx-target">
+          <span class="nc-tx-target-label">To</span>
+          <span class="nc-tx-target-value">${receiverId}</span>
+        </div>
+
+        <div class="nc-tx-actions">
+          ${this.actions.map((action) => this.renderAction(action)).join("")}
+        </div>
+
+        <div class="nc-tx-summary">
+          <div class="nc-tx-summary-row">
+            <span class="nc-tx-summary-label">Estimated Gas</span>
+            <span class="nc-tx-summary-value">${estimatedGas}</span>
+          </div>
+          ${estimatedDeposit !== "0 NEAR"
+            ? `
+          <div class="nc-tx-summary-row">
+            <span class="nc-tx-summary-label">Total Deposit</span>
+            <span class="nc-tx-summary-value nc-tx-summary-value--highlight">${estimatedDeposit}</span>
+          </div>
+          `
+            : ""}
+        </div>
+      </div>
+    `;
+    }
+    renderAction(action) {
+        const detailsHtml = action.details
+            ? Object.entries(action.details)
+                .map(([key, value]) => `
+          <div class="nc-tx-action-detail">
+            <span class="nc-tx-action-detail-key">${key}</span>
+            <span class="nc-tx-action-detail-value">${value}</span>
+          </div>
+        `)
+                .join("")
+            : "";
+        return `
+      <div class="nc-tx-action">
+        <div class="nc-tx-action-header">
+          <span class="nc-tx-action-type">${action.type}</span>
+          <span class="nc-tx-action-title">${action.title}</span>
+        </div>
+        <p class="nc-tx-action-desc">${action.description}</p>
+        ${detailsHtml ? `<div class="nc-tx-action-details">${detailsHtml}</div>` : ""}
+      </div>
+    `;
+    }
+    renderSigning() {
+        const { walletName, walletIcon } = this.txOptions;
+        return `
+      <div class="nc-body">
+        <div class="nc-connecting">
+          ${walletIcon ? `<img class="nc-connecting-icon" src="${walletIcon}" alt="${walletName}" />` : '<div class="nc-spinner"></div>'}
+          <p class="nc-connecting-title">Confirm in ${walletName}</p>
+          <p class="nc-connecting-message">
+            Please review and approve the transaction in your wallet
+          </p>
+        </div>
+      </div>
+    `;
+    }
+    renderSuccess() {
+        const { txHash } = this.state;
+        const explorerUrl = `https://nearblocks.io/txns/${txHash}`;
+        return `
+      <div class="nc-body">
+        <div class="nc-tx-result nc-tx-result--success">
+          <div class="nc-tx-result-icon">${icons_1.icons.success}</div>
+          <p class="nc-tx-result-title">Transaction Sent</p>
+          <p class="nc-tx-result-message">Your transaction has been submitted to the network</p>
+          ${txHash
+            ? `
+          <a
+            class="nc-btn nc-btn--secondary"
+            href="${explorerUrl}"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            View on Explorer ${icons_1.icons.external}
+          </a>
+          `
+            : ""}
+        </div>
+      </div>
+    `;
+    }
+    renderError() {
+        const { error } = this.state;
+        if (!error)
+            return "";
+        return `
+      <div class="nc-body">
+        <div class="nc-error">
+          <div class="nc-error-icon">${icons_1.icons.error}</div>
+          <p class="nc-error-title">${error.title}</p>
+          <p class="nc-error-message">${error.message}</p>
+          <div class="nc-error-actions">
+            <button class="nc-btn nc-btn--secondary" data-action="retry">
+              Try Again
+            </button>
+            <button class="nc-btn nc-btn--primary" data-action="close">
+              Close
+            </button>
+          </div>
+        </div>
+      </div>
+    `;
+    }
+    renderFooter() {
+        const { view } = this.state;
+        if (view !== "review")
+            return "";
+        return `
+      <div class="nc-footer" style="justify-content: stretch; gap: var(--nc-spacing-sm);">
+        <button class="nc-btn nc-btn--secondary" data-action="reject" style="flex: 1;">
+          Reject
+        </button>
+        <button class="nc-btn nc-btn--primary" data-action="confirm" style="flex: 1;">
+          Confirm
+        </button>
+      </div>
+    `;
+    }
+    setupHandlers() {
+        super.setupHandlers();
+        // Action buttons
+        this.root.querySelectorAll("[data-action]").forEach((btn) => {
+            this.addListener(btn, "click", () => {
+                const action = btn.getAttribute("data-action");
+                this.handleAction(action);
+            });
+        });
+    }
+    handleAction(action) {
+        switch (action) {
+            case "confirm":
+                this.state.view = "signing";
+                this.update();
+                this.txOptions.onConfirm();
+                break;
+            case "reject":
+                this.txOptions.onReject();
+                this.close();
+                break;
+            case "retry":
+                this.state.view = "review";
+                this.state.error = null;
+                this.update();
+                break;
+            case "close":
+                this.close();
+                break;
+        }
+    }
+    /**
+     * Show signing state
+     */
+    showSigning() {
+        this.state.view = "signing";
+        this.update();
+    }
+    /**
+     * Show success state
+     */
+    showSuccess(txHash) {
+        this.state.view = "success";
+        this.state.txHash = txHash;
+        this.update();
+    }
+    /**
+     * Show error state
+     */
+    showError(title, message) {
+        this.state.view = "error";
+        this.state.error = { title, message };
+        this.update();
+    }
+}
+exports.TransactionModal = TransactionModal;
+//# sourceMappingURL=TransactionModal.js.map

package/build/ui/TransactionModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransactionModal.js","sourceRoot":"","sources":["../../src/ui/TransactionModal.ts"],"names":[],"mappings":"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"}

package/build/ui/WalletSelectorModal.d.ts

@@ -0,0 +1,97 @@
+import { Modal, ModalOptions } from "./Modal";
+import { WalletManifest } from "../types";
+/**
+ * Wallet categories for grouping
+ */
+export type WalletCategory = "recent" | "browser" | "mobile" | "hardware" | "other";
+/**
+ * Extended wallet info with UI metadata
+ */
+export interface WalletUIInfo extends WalletManifest {
+    category?: WalletCategory;
+    isInstalled?: boolean;
+    isRecent?: boolean;
+}
+/**
+ * View states for the modal
+ */
+type ModalView = "list" | "connecting" | "error" | "help" | "settings";
+/**
+ * Wallet selector modal options
+ */
+export interface WalletSelectorOptions extends ModalOptions {
+    wallets: WalletManifest[];
+    recentWalletIds?: string[];
+    showSearch?: boolean;
+    showHelp?: boolean;
+    groupByCategory?: boolean;
+    onSelect: (walletId: string) => void;
+    onAddDebugWallet?: (manifest: string) => Promise<WalletManifest>;
+    onRemoveDebugWallet?: (walletId: string) => Promise<void>;
+}
+/**
+ * Modal state
+ */
+interface ModalState {
+    view: ModalView;
+    wallets: WalletUIInfo[];
+    filteredWallets: WalletUIInfo[];
+    searchQuery: string;
+    selectedWallet: WalletUIInfo | null;
+    error: {
+        title: string;
+        message: string;
+    } | null;
+}
+/**
+ * Wallet selector modal component
+ */
+export declare class WalletSelectorModal extends Modal {
+    protected readonly selectorOptions: Required<WalletSelectorOptions>;
+    protected state: ModalState;
+    constructor(options: WalletSelectorOptions);
+    /**
+     * Process wallets with categories and metadata
+     */
+    private processWallets;
+    /**
+     * Categorize wallet by type
+     */
+    private categorizeWallet;
+    /**
+     * Filter wallets by search query
+     */
+    private filterWallets;
+    /**
+     * Group wallets by category
+     */
+    private groupWallets;
+    /**
+     * Get category display name
+     */
+    private getCategoryName;
+    protected render(): string;
+    private renderHeader;
+    private renderBody;
+    private renderWalletList;
+    private renderWalletItem;
+    private getWalletHost;
+    private renderConnecting;
+    private renderError;
+    private renderHelp;
+    private renderSettings;
+    private renderFooter;
+    protected setupHandlers(): void;
+    private selectWallet;
+    private handleAction;
+    private addDebugWallet;
+    /**
+     * Show error state
+     */
+    showError(title: string, message: string): void;
+    /**
+     * Show connecting state for a wallet
+     */
+    showConnecting(walletId: string): void;
+}
+export {};