@tollbooth-dpyc/web 0.1.0

package/dist/react/NostrProfilePanel.js

@@ -0,0 +1,116 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The patron's Nostr kind-0 profile — the self-sovereign home of their name
+ * and avatar. Edits publish a new signed kind-0, visible in every Nostr client.
+ * Without a signer the fields are read-only and the action explains why.
+ */
+import { useEffect, useId, useRef, useState } from "react";
+import { Camera, ChevronDown, Loader2, X } from "lucide-react";
+import { avatarFor, isAvatarUrl, setStoredAvatar, shortNpub } from "../avatar.js";
+import { tollboothConfig } from "../config.js";
+import { canSignProfile, fetchProfile, publishProfile } from "../nostrProfile.js";
+import { collapsedDisplayName, howToSetExplainer, publishControlDisabled, publishControlLabel, publishControlMode, } from "../profilePresentation.js";
+import Avatar from "./Avatar.js";
+import AvatarPicker from "./AvatarPicker.js";
+import { card, input, muted } from "./ui.js";
+const FIELDS = [
+    { key: "display_name", label: "Display name", placeholder: "Satoshi" },
+    { key: "lud16", label: "Lightning address (lud16)", placeholder: "you@walletofsatoshi.com" },
+    { key: "nip05", label: "NIP-05", placeholder: "name@domain.com" },
+    { key: "website", label: "Website", placeholder: "https://…" },
+    { key: "about", label: "About", placeholder: "A short bio…" },
+];
+export default function NostrProfilePanel({ npub }) {
+    const { appName } = tollboothConfig();
+    const [profile, setProfile] = useState({});
+    const [loading, setLoading] = useState(true);
+    const [expanded, setExpanded] = useState(false);
+    const [showPicker, setShowPicker] = useState(false);
+    const [showHowTo, setShowHowTo] = useState(false);
+    const [publishing, setPublishing] = useState(false);
+    const [msg, setMsg] = useState(null);
+    const [copied, setCopied] = useState(false);
+    const fieldsId = useId();
+    const explainerId = useId();
+    const howToRef = useRef(null);
+    const mode = publishControlMode(canSignProfile());
+    const explainer = howToSetExplainer(appName);
+    useEffect(() => {
+        let live = true;
+        setLoading(true);
+        fetchProfile(npub)
+            .then((p) => {
+            if (!live || !p)
+                return;
+            setProfile({ ...p, display_name: p.display_name || p.name || "" });
+            if (p.picture)
+                setStoredAvatar(npub, p.picture);
+        })
+            .finally(() => live && setLoading(false));
+        return () => {
+            live = false;
+        };
+    }, [npub]);
+    // Dismiss on outside tap or Escape — touch friendly, no hover.
+    useEffect(() => {
+        if (!showHowTo)
+            return;
+        const onPointer = (e) => {
+            if (e.target instanceof Node && !howToRef.current?.contains(e.target))
+                setShowHowTo(false);
+        };
+        const onKey = (e) => e.key === "Escape" && setShowHowTo(false);
+        document.addEventListener("mousedown", onPointer);
+        document.addEventListener("touchstart", onPointer);
+        document.addEventListener("keydown", onKey);
+        return () => {
+            document.removeEventListener("mousedown", onPointer);
+            document.removeEventListener("touchstart", onPointer);
+            document.removeEventListener("keydown", onKey);
+        };
+    }, [showHowTo]);
+    const set = (k, v) => setProfile((p) => ({ ...p, [k]: v }));
+    function pickAvatar(v) {
+        set("picture", v);
+        setStoredAvatar(npub, v);
+    }
+    function copyNpub() {
+        navigator.clipboard?.writeText(npub).then(() => {
+            setCopied(true);
+            setTimeout(() => setCopied(false), 1500);
+        }, () => { });
+    }
+    async function publish() {
+        setPublishing(true);
+        setMsg(null);
+        const picture = profile.picture ?? "";
+        const glyph = picture !== "" && !isAvatarUrl(picture);
+        try {
+            const r = await publishProfile({
+                ...profile,
+                name: profile.display_name,
+                // kind-0 picture is a URL; a glyph stays local to this site.
+                picture: glyph ? "" : picture,
+            });
+            const tail = glyph ? " (Emoji avatar kept local — a Nostr picture must be a URL.)" : "";
+            if (r.error)
+                setMsg({ ok: false, text: r.error });
+            else if ((r.ok ?? 0) > 0)
+                setMsg({ ok: true, text: `Published to ${r.ok}/${r.total} relays.${tail}` });
+            else
+                setMsg({ ok: false, text: `No relay accepted the event.${tail}` });
+        }
+        catch (e) {
+            setMsg({ ok: false, text: e.message });
+        }
+        finally {
+            setPublishing(false);
+        }
+    }
+    return (_jsxs("div", { className: `${card} p-4`, children: [_jsxs("div", { className: "flex items-start gap-3", children: [_jsxs("div", { className: "relative flex-none", children: [_jsx(Avatar, { value: profile.picture || avatarFor(npub), size: 56 }), _jsx("button", { type: "button", onClick: () => {
+                                    setExpanded(true);
+                                    setShowPicker((v) => !v);
+                                }, "aria-label": showPicker ? "Done changing avatar" : "Change avatar", "aria-expanded": showPicker, className: "absolute -bottom-0.5 -right-0.5 inline-flex h-6 w-6 items-center justify-center rounded-full border border-[var(--tb-line)] bg-[var(--tb-surface)] shadow-sm", children: _jsx(Camera, { className: "h-3.5 w-3.5", "aria-hidden": "true" }) })] }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [_jsx("div", { className: "text-sm font-medium truncate", children: collapsedDisplayName(profile.display_name ?? "") }), mode === "how-to-set" && (_jsx("span", { className: `text-[11px] px-1.5 py-0.5 rounded-md bg-[var(--tb-surface-2)] ${muted}`, children: "Read-only" }))] }), _jsx("button", { type: "button", onClick: copyNpub, title: "Copy full npub", className: `mt-0.5 font-mono text-xs ${muted}`, children: copied ? "Copied" : shortNpub(npub) })] }), _jsxs("button", { type: "button", onClick: () => setExpanded((v) => !v), "aria-expanded": expanded, "aria-controls": fieldsId, className: "flex-none inline-flex items-center gap-1 rounded-full border border-[var(--tb-line)] px-2.5 py-1.5 text-xs", children: [expanded ? "Hide" : "Edit", _jsx(ChevronDown, { className: `h-3.5 w-3.5 transition-transform ${expanded ? "rotate-180" : ""}`, "aria-hidden": "true" })] })] }), showPicker && (_jsx("div", { className: "mt-3", children: _jsx(AvatarPicker, { value: profile.picture ?? "", onChange: pickAvatar }) })), loading ? (_jsxs("div", { className: `flex items-center gap-1.5 text-xs py-2 mt-3 ${muted}`, children: [_jsx(Loader2, { className: "h-3.5 w-3.5 animate-spin" }), " Reading from relays\u2026"] })) : (_jsxs("div", { id: fieldsId, hidden: !expanded, className: expanded ? "mt-4 space-y-3" : undefined, children: [FIELDS.map((f) => (_jsxs("label", { className: `block text-xs ${muted}`, children: [f.label, f.key === "about" ? (_jsx("textarea", { value: profile[f.key] ?? "", onChange: (e) => set(f.key, e.target.value), rows: 2, className: `mt-1 ${input} font-sans resize-none`, placeholder: f.placeholder, readOnly: mode === "how-to-set" })) : (_jsx("input", { value: profile[f.key] ?? "", onChange: (e) => set(f.key, e.target.value), className: `mt-1 ${input} font-sans`, placeholder: f.placeholder, readOnly: mode === "how-to-set" }))] }, f.key))), msg && (_jsx("div", { className: `text-xs ${msg.ok ? "text-[var(--tb-ok)]" : "text-[var(--tb-err-ink)]"}`, children: msg.text })), _jsxs("div", { className: "relative flex items-center gap-3", ref: howToRef, children: [_jsx("button", { type: "button", onClick: () => (mode === "how-to-set" ? setShowHowTo((v) => !v) : void publish()), disabled: publishControlDisabled(mode, publishing), "aria-haspopup": mode === "how-to-set" ? "dialog" : undefined, "aria-expanded": mode === "how-to-set" ? showHowTo : undefined, className: mode === "publish"
+                                    ? "rounded-full bg-[var(--tb-accent)] px-4 py-2 text-sm font-medium text-[var(--tb-on-accent)] disabled:opacity-40"
+                                    : "rounded-full border border-[var(--tb-line)] px-4 py-2 text-sm", children: publishControlLabel(mode, publishing) }), showHowTo && mode === "how-to-set" && (_jsxs("div", { role: "dialog", "aria-modal": "false", "aria-labelledby": explainerId, className: `${card} absolute left-0 bottom-full z-20 mb-2 w-[min(100%,22rem)] p-3 shadow-lg`, children: [_jsxs("div", { className: "flex items-start justify-between gap-2 mb-2", children: [_jsx("div", { id: explainerId, className: "text-sm font-medium", children: explainer.title }), _jsx("button", { type: "button", onClick: () => setShowHowTo(false), "aria-label": "Close", className: muted, children: _jsx(X, { className: "h-3.5 w-3.5", "aria-hidden": "true" }) })] }), _jsx("div", { className: `space-y-2 text-xs leading-relaxed ${muted}`, children: explainer.paragraphs.map((p) => (_jsx("p", { children: p }, p.slice(0, 24)))) })] }))] })] }))] }));
+}

package/dist/react/NpubGate.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Sign in with an npub (a DM challenge) or an nsec (an in-browser session key).
+ *
+ *   begin → request_npub_proof → awaiting reply → receive_npub_proof → app
+ *
+ * Success is not a `verified` flag but "no `error` and a token came back".
+ */
+export default function NpubGate({ onLogin, startFresh, operatorHash, notice, }: {
+    onLogin: () => void;
+    /** Arrive with a key already made, for a first-timer who asked for one. */
+    startFresh?: boolean;
+    /** Operator fingerprint, shown so the patron can check who sent the DM. */
+    operatorHash?: string;
+    /** A routine re-auth prompt, drawn as a calm note rather than an error. */
+    notice?: string;
+}): import("react").JSX.Element;

package/dist/react/NpubGate.js

@@ -0,0 +1,159 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Sign in with an npub (a DM challenge) or an nsec (an in-browser session key).
+ *
+ *   begin → request_npub_proof → awaiting reply → receive_npub_proof → app
+ *
+ * Success is not a `verified` flag but "no `error` and a token came back".
+ */
+import { useEffect, useRef, useState } from "react";
+import { generateSecretKey, getPublicKey, nip19 } from "nostr-tools";
+import { tollboothConfig } from "../config.js";
+import { forgetRecentLogin, getLastTypedNpub, getValidRecentLogins, recordRecentLogin, setLastTypedNpub, setStoredNpub, setStoredProof, } from "../identity.js";
+import { setSessionNsec } from "../sessionNsec.js";
+import { readSignInFailure } from "../signInSituation.js";
+import { receiveNpubProof, requestNpubProof } from "../standardTools.js";
+import { card, errBox, ghost, input, muted, primary, warnBox } from "./ui.js";
+export default function NpubGate({ onLogin, startFresh = false, operatorHash, notice, }) {
+    const { appName } = tollboothConfig();
+    // Prefilled from what was typed last, NOT from the stored identity.
+    const [value, setValue] = useState(getLastTypedNpub());
+    const [stage, setStage] = useState("begin");
+    const [pendingProof, setPendingProof] = useState("");
+    const [busy, setBusy] = useState(false);
+    const [error, setError] = useState("");
+    const [note, setNote] = useState("");
+    const [recents, setRecents] = useState(() => getValidRecentLogins());
+    const [generatedHint, setGeneratedHint] = useState(false);
+    // Once, on arrival, and only into an empty field — a key generated over
+    // something already typed would be a key that ate their nsec.
+    const made = useRef(false);
+    useEffect(() => {
+        if (!startFresh || made.current || value.trim())
+            return;
+        made.current = true;
+        generateKey();
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [startFresh]);
+    const trimmed = value.trim();
+    const isNsec = trimmed.startsWith("nsec1") && trimmed.length > 8;
+    const isNpub = trimmed.startsWith("npub1") && trimmed.length >= 60;
+    const valid = isNsec || isNpub;
+    function reuseRecent(entry) {
+        setStoredNpub(entry.npub);
+        setStoredProof(entry.proof);
+        recordRecentLogin(entry.npub, entry.proof, Math.floor((entry.expiresAt - Date.now()) / 1000));
+        onLogin();
+    }
+    function forget(npub) {
+        forgetRecentLogin(npub);
+        setRecents(getValidRecentLogins());
+    }
+    function generateKey() {
+        setValue(nip19.nsecEncode(generateSecretKey()));
+        setGeneratedHint(true);
+        setError("");
+    }
+    // The session key proves the npub it derives to, so storing it at once takes
+    // nothing on trust.
+    function signInWithNsec() {
+        setError("");
+        try {
+            const decoded = nip19.decode(trimmed);
+            if (decoded.type !== "nsec")
+                throw new Error("Not a bech32 nsec");
+            const npub = nip19.npubEncode(getPublicKey(decoded.data));
+            setSessionNsec(trimmed);
+            setStoredNpub(npub);
+            setLastTypedNpub(npub);
+            onLogin();
+        }
+        catch (e) {
+            setError(`Couldn't read that nsec: ${e.message}`);
+        }
+    }
+    async function begin() {
+        if (!isNpub) {
+            setError("Enter a valid npub1… key.");
+            return;
+        }
+        setBusy(true);
+        setError("");
+        try {
+            const r = await requestNpubProof(trimmed, globalThis.location.origin, `You requested to sign in to ${appName} (${globalThis.location.host}).`);
+            if (r.error)
+                return setError(r.error);
+            if (!r.dpop_token)
+                return setError("The service did not return a session phrase. Try again.");
+            // Remembered for the field only. The identity is written by `finish()`,
+            // once the human has answered the DM.
+            setLastTypedNpub(trimmed);
+            setPendingProof(r.dpop_token);
+            setStage("awaiting");
+        }
+        catch (e) {
+            setError(e.message);
+        }
+        finally {
+            setBusy(false);
+        }
+    }
+    async function finish() {
+        setBusy(true);
+        setError("");
+        setStage("checking");
+        try {
+            const r = await receiveNpubProof(trimmed, pendingProof);
+            if (r.error) {
+                setError(r.error);
+                setStage("awaiting");
+                return;
+            }
+            const token = r.dpop_token || pendingProof;
+            const npub = r.proven_npub || trimmed;
+            setStoredNpub(npub);
+            setStoredProof(token);
+            if (r.expires_in_seconds && r.expires_in_seconds > 0) {
+                recordRecentLogin(npub, token, r.expires_in_seconds);
+                const h = Math.floor(r.expires_in_seconds / 3600);
+                setNote(`Proof cached for ~${h > 0 ? `${h}h` : `${Math.round(r.expires_in_seconds / 60)}m`}.`);
+            }
+            onLogin();
+        }
+        catch (e) {
+            setError(`Verification failed: ${e.message}`);
+            setStage("awaiting");
+        }
+        finally {
+            setBusy(false);
+        }
+    }
+    function reset() {
+        setStage("begin");
+        setPendingProof("");
+        setError("");
+    }
+    return (_jsxs("div", { className: "max-w-md mx-auto mt-12 px-4", children: [_jsxs("h1", { className: "text-xl font-semibold mb-1", children: ["Sign in to ", appName] }), _jsx("p", { className: `text-sm mb-5 ${muted}`, children: "Your Nostr npub is your identity. No email, no password." }), notice && _jsx("div", { className: `mb-5 ${warnBox}`, children: notice }), stage === "begin" && recents.length > 0 && (_jsxs("div", { className: "mb-5", children: [_jsx("div", { className: `text-xs uppercase tracking-wider mb-2 ${muted}`, children: "Recent identities" }), _jsx("div", { className: "space-y-1.5", children: recents.map((e) => (_jsxs("div", { className: "flex gap-1.5", children: [_jsxs("button", { type: "button", onClick: () => reuseRecent(e), disabled: busy, title: `Re-enter as ${e.npub} on the cached proof`, className: `${card} flex-1 flex items-center justify-between px-3 py-2.5 text-left hover:border-[var(--tb-accent)]`, children: [_jsxs("span", { className: "font-mono text-xs truncate", children: [e.npub.slice(0, 12), "\u2026", e.npub.slice(-6)] }), _jsxs("span", { className: `text-xs shrink-0 ml-2 ${muted}`, children: [ttl(e.expiresAt), " left"] })] }), _jsx("button", { type: "button", onClick: () => forget(e.npub), disabled: busy, title: "Forget this identity", "aria-label": "Forget this identity", className: `w-9 rounded-lg border border-[var(--tb-line)] ${muted}`, children: "\u00D7" })] }, e.npub))) })] })), _jsxs("div", { className: `${card} p-4 space-y-3`, children: [stage === "begin" ? (_jsxs(_Fragment, { children: [_jsx("label", { className: `block text-xs uppercase tracking-wider ${muted}`, htmlFor: "tb-npub-field", children: "Paste your npub or nsec" }), _jsx("input", { id: "tb-npub-field", type: isNsec ? "password" : "text", value: value, onChange: (e) => {
+                                    setValue(e.target.value);
+                                    setGeneratedHint(false);
+                                }, onKeyDown: (e) => {
+                                    if (e.key !== "Enter" || !valid || busy)
+                                        return;
+                                    if (isNsec)
+                                        signInWithNsec();
+                                    else
+                                        void begin();
+                                }, placeholder: "npub1\u2026 (DM challenge) or nsec1\u2026 (instant)", spellCheck: false, autoCapitalize: "off", autoCorrect: "off", className: input }), generatedHint && (_jsxs("div", { className: warnBox, children: ["New key generated. ", _jsx("b", { children: "Save this nsec" }), " somewhere safe \u2014 it's the only copy and it lives only in this browser."] })), _jsx("button", { type: "button", onClick: () => (isNsec ? signInWithNsec() : void begin()), disabled: !valid || busy, className: primary, children: busy ? "Sending…" : isNpub ? "Send proof DM" : "Sign in" }), _jsx("p", { className: `text-xs ${muted}`, children: isNsec
+                                    ? "Your nsec stays in this browser and signs each call."
+                                    : "We send a Nostr DM to your npub. Reply from your Nostr client — your signature is the proof." }), _jsx("button", { type: "button", onClick: generateKey, className: ghost, children: "Generate a new key" })] })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: `${warnBox} space-y-1.5`, children: [_jsx("div", { className: "font-medium", children: "DM sent \u2014 check your Nostr client." }), _jsx("div", { children: "Reply with any text. Your signature on that DM is the proof." }), operatorHash && (_jsxs("div", { children: ["Sender fingerprint: ", _jsxs("span", { className: "font-mono", children: ["\uD83D\uDD12 ", operatorHash] })] }))] }), pendingProof && (_jsxs("div", { className: "rounded-lg p-3 text-xs border border-[var(--tb-accent)] space-y-2", children: [_jsx("div", { className: `uppercase tracking-wider text-[10px] ${muted}`, children: "Confirmation code" }), _jsx("div", { className: "font-mono text-base select-all", children: pendingProof }), _jsxs("div", { className: `leading-relaxed ${muted}`, children: ["The same code appears in the DM. ", _jsx("b", { children: "Approve the DM only if the codes match." }), " If they differ \u2014 or the DM points you somewhere other than this site \u2014 do not reply."] })] })), _jsx("button", { type: "button", onClick: () => void finish(), disabled: busy, className: primary, children: busy ? "Checking…" : "I've replied — verify" }), _jsx("button", { type: "button", onClick: () => void begin(), disabled: busy, className: ghost, children: "Resend DM" }), _jsx("button", { type: "button", onClick: reset, disabled: busy, className: `w-full text-xs py-1.5 ${muted}`, children: "Use a different npub" })] })), error && _jsx(Trouble, { raw: error, appName: appName }), note && _jsx("div", { className: `text-xs text-center italic ${muted}`, children: note })] })] }));
+}
+/** A failure, read to the person: the lead first, the service's own words underneath. */
+function Trouble({ raw, appName }) {
+    const s = readSignInFailure(raw, appName);
+    return (_jsxs("div", { className: s.retryable ? warnBox : errBox, children: [s.lead, s.detail && _jsx("div", { className: "mt-2 font-mono text-[10px] leading-relaxed opacity-70", children: s.detail })] }));
+}
+function ttl(expiresAt) {
+    const min = Math.max(0, Math.floor((expiresAt - Date.now()) / 60000));
+    const hr = Math.floor(min / 60);
+    return hr >= 1 ? `${hr}h ${min % 60}m` : `${min}m`;
+}

package/dist/react/WalletCard.d.ts

@@ -0,0 +1,11 @@
+/**
+ * What the patron has to spend, and a way to add to it.
+ *
+ * Every figure is the service's answer or a dash. A balance nobody has read is
+ * unknown, and unknown is not zero: showing 0 to someone with funds would send
+ * them to buy credits they already own. The card offers round numbers to pay
+ * in and never guesses what anything costs.
+ */
+export default function WalletCard({ topUps }: {
+    topUps?: number[];
+}): import("react").JSX.Element;

package/dist/react/WalletCard.js

@@ -0,0 +1,82 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * What the patron has to spend, and a way to add to it.
+ *
+ * Every figure is the service's answer or a dash. A balance nobody has read is
+ * unknown, and unknown is not zero: showing 0 to someone with funds would send
+ * them to buy credits they already own. The card offers round numbers to pay
+ * in and never guesses what anything costs.
+ */
+import { useCallback, useEffect, useState } from "react";
+import { RefreshCw, Zap } from "lucide-react";
+import { tollboothConfig } from "../config.js";
+import { checkBalance, checkPayment, purchaseCredits } from "../standardTools.js";
+import { card, ghost, iconButton, muted, primary } from "./ui.js";
+const DEFAULT_TOP_UPS = [1_000, 5_000, 20_000];
+function sats(n) {
+    return n === null ? "—" : n.toLocaleString("en-US");
+}
+export default function WalletCard({ topUps = DEFAULT_TOP_UPS }) {
+    const { appName } = tollboothConfig();
+    const [balance, setBalance] = useState(null);
+    const [reachable, setReachable] = useState(true);
+    const [busy, setBusy] = useState(false);
+    const [invoice, setInvoice] = useState(null);
+    const [msg, setMsg] = useState("");
+    const load = useCallback(() => {
+        checkBalance()
+            .then((r) => {
+            setReachable(!r.error);
+            if (!r.error)
+                setBalance(r.balance_api_sats ?? 0);
+        })
+            .catch(() => setReachable(false));
+    }, []);
+    useEffect(load, [load]);
+    async function topUp(amount) {
+        setBusy(true);
+        setMsg("");
+        try {
+            const r = await purchaseCredits(amount);
+            if (r.error || !r.invoice_id) {
+                setMsg(r.error ?? "The service did not return an invoice. Try again.");
+                return;
+            }
+            setInvoice({
+                id: r.invoice_id,
+                link: r.checkout_link ?? r.lightning_invoice ?? r.payment_request ?? "",
+                sats: r.amount_sats ?? amount,
+            });
+        }
+        catch (e) {
+            setMsg(e.message);
+        }
+        finally {
+            setBusy(false);
+        }
+    }
+    async function confirm() {
+        if (!invoice)
+            return;
+        setBusy(true);
+        setMsg("");
+        try {
+            const r = await checkPayment(invoice.id);
+            if (r.status === "Settled") {
+                setInvoice(null);
+                setMsg(`Paid. ${sats(r.credits_granted ?? invoice.sats)} sats added.`);
+                load();
+            }
+            else {
+                setMsg(`Not paid yet — the invoice reads ${r.status ?? "unknown"}.`);
+            }
+        }
+        catch (e) {
+            setMsg(e.message);
+        }
+        finally {
+            setBusy(false);
+        }
+    }
+    return (_jsxs("section", { className: `${card} p-4`, children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: `text-sm ${muted}`, children: "Balance" }), _jsx("button", { type: "button", onClick: load, title: "Refresh", "aria-label": "Refresh balance", className: iconButton, children: _jsx(RefreshCw, { size: 14 }) })] }), _jsxs("div", { className: "mt-1 flex items-baseline gap-2", children: [_jsx("span", { className: "text-2xl font-semibold tabular-nums", children: sats(reachable ? balance : null) }), _jsx("span", { className: `text-sm ${muted}`, children: "sats" })] }), !reachable && _jsxs("p", { className: `mt-2 text-xs ${muted}`, children: [appName, " did not answer, so no balance is shown."] }), !invoice ? (_jsx("div", { className: "mt-4 flex gap-2", children: topUps.map((n) => (_jsxs("button", { type: "button", disabled: busy, onClick: () => topUp(n), className: ghost, children: ["+", n.toLocaleString("en-US")] }, n))) })) : (_jsxs("div", { className: "mt-4 space-y-2", children: [_jsxs("a", { href: invoice.link, target: "_blank", rel: "noreferrer", className: `${primary} flex items-center justify-center gap-2`, children: [_jsx(Zap, { size: 16 }), " Pay ", invoice.sats.toLocaleString("en-US"), " sats"] }), _jsxs("div", { className: "flex gap-2", children: [_jsx("button", { type: "button", disabled: busy, onClick: confirm, className: ghost, children: "I've paid \u2014 check" }), _jsx("button", { type: "button", onClick: () => setInvoice(null), className: `${ghost} w-auto px-4`, children: "Cancel" })] })] })), msg && _jsx("p", { className: `mt-3 text-xs ${muted}`, children: msg })] }));
+}

package/dist/react/index.d.ts

@@ -0,0 +1,6 @@
+export { default as Avatar } from "./Avatar.tsx";
+export { default as AvatarPicker } from "./AvatarPicker.tsx";
+export { default as NpubGate } from "./NpubGate.tsx";
+export { default as NostrProfilePanel } from "./NostrProfilePanel.tsx";
+export { default as WalletCard } from "./WalletCard.tsx";
+export { useSession, type Session } from "./useSession.ts";

package/dist/react/index.js

@@ -0,0 +1,6 @@
+export { default as Avatar } from "./Avatar.js";
+export { default as AvatarPicker } from "./AvatarPicker.js";
+export { default as NpubGate } from "./NpubGate.js";
+export { default as NostrProfilePanel } from "./NostrProfilePanel.js";
+export { default as WalletCard } from "./WalletCard.js";
+export { useSession } from "./useSession.js";

package/dist/react/ui.d.ts

@@ -0,0 +1,9 @@
+/** Class strings shared by the components, all coloured through theme.css tokens. */
+export declare const card = "rounded-2xl border border-[var(--tb-line)] bg-[var(--tb-surface)] text-[var(--tb-ink)]";
+export declare const input = "w-full rounded-lg px-3 py-2.5 text-sm bg-[var(--tb-surface)] text-[var(--tb-ink)] border border-[var(--tb-line)] focus:outline-none focus:border-[var(--tb-accent)] font-mono";
+export declare const primary = "w-full rounded-full bg-[var(--tb-accent)] text-[var(--tb-on-accent)] text-sm font-medium py-2.5 disabled:opacity-40 transition-opacity";
+export declare const ghost = "w-full rounded-full text-sm py-2 border border-[var(--tb-line)] text-[var(--tb-muted)] hover:bg-[var(--tb-surface-2)] disabled:opacity-40 transition-colors";
+export declare const iconButton = "inline-flex items-center justify-center rounded-full p-2 text-[var(--tb-muted)] hover:bg-[var(--tb-surface-2)] disabled:opacity-40 transition-colors";
+export declare const muted = "text-[var(--tb-muted)]";
+export declare const errBox = "rounded-lg p-3 text-xs bg-[var(--tb-err-bg)] border border-[var(--tb-err-line)] text-[var(--tb-err-ink)]";
+export declare const warnBox = "rounded-lg p-3 text-xs bg-[var(--tb-warn-bg)] border border-[var(--tb-warn-line)] text-[var(--tb-warn-ink)]";

package/dist/react/ui.js

@@ -0,0 +1,9 @@
+/** Class strings shared by the components, all coloured through theme.css tokens. */
+export const card = "rounded-2xl border border-[var(--tb-line)] bg-[var(--tb-surface)] text-[var(--tb-ink)]";
+export const input = "w-full rounded-lg px-3 py-2.5 text-sm bg-[var(--tb-surface)] text-[var(--tb-ink)] border border-[var(--tb-line)] focus:outline-none focus:border-[var(--tb-accent)] font-mono";
+export const primary = "w-full rounded-full bg-[var(--tb-accent)] text-[var(--tb-on-accent)] text-sm font-medium py-2.5 disabled:opacity-40 transition-opacity";
+export const ghost = "w-full rounded-full text-sm py-2 border border-[var(--tb-line)] text-[var(--tb-muted)] hover:bg-[var(--tb-surface-2)] disabled:opacity-40 transition-colors";
+export const iconButton = "inline-flex items-center justify-center rounded-full p-2 text-[var(--tb-muted)] hover:bg-[var(--tb-surface-2)] disabled:opacity-40 transition-colors";
+export const muted = "text-[var(--tb-muted)]";
+export const errBox = "rounded-lg p-3 text-xs bg-[var(--tb-err-bg)] border border-[var(--tb-err-line)] text-[var(--tb-err-ink)]";
+export const warnBox = "rounded-lg p-3 text-xs bg-[var(--tb-warn-bg)] border border-[var(--tb-warn-line)] text-[var(--tb-warn-ink)]";

package/dist/react/useSession.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Who is signed in, in one place, so every screen re-renders when it changes.
+ *
+ * Two ways to be signed in, and they are not the same: a session nsec that
+ * signs a fresh proof per call and never lapses while the tab lives, or a
+ * cached DM proof that expires. `canSign` tells them apart for the pages that
+ * need to.
+ */
+export interface Session {
+    npub: string;
+    signedIn: boolean;
+    canSign: boolean;
+    /** Set when a cached proof lapses: a calm prompt to sign in again. */
+    notice: string;
+    /** Call after a successful sign-in so the whole app notices. */
+    refresh: () => void;
+    signOut: () => void;
+}
+export declare function useSession(): Session;

package/dist/react/useSession.js

@@ -0,0 +1,39 @@
+/**
+ * Who is signed in, in one place, so every screen re-renders when it changes.
+ *
+ * Two ways to be signed in, and they are not the same: a session nsec that
+ * signs a fresh proof per call and never lapses while the tab lives, or a
+ * cached DM proof that expires. `canSign` tells them apart for the pages that
+ * need to.
+ */
+import { useCallback, useEffect, useState } from "react";
+import { onProofExpired } from "../client.js";
+import { currentClaim, logOut } from "../identity.js";
+import { canSignFor, isProven } from "../signedIn.js";
+function read() {
+    if (typeof globalThis.localStorage === "undefined")
+        return { npub: "", signedIn: false, canSign: false };
+    const claim = currentClaim();
+    return { npub: claim.npub, signedIn: isProven(claim), canSign: canSignFor(claim) };
+}
+export function useSession() {
+    const [state, setState] = useState(read);
+    const [notice, setNotice] = useState("");
+    const refresh = useCallback(() => {
+        setState(read());
+        setNotice("");
+    }, []);
+    const signOut = useCallback(() => {
+        logOut();
+        setState(read());
+        setNotice("");
+    }, []);
+    useEffect(() => onProofExpired(() => {
+        // A tab that can sign for THIS npub lost nothing.
+        if (canSignFor(currentClaim()))
+            return;
+        setNotice("Your session lapsed while you were away. Sign in again to carry on.");
+        setState(read());
+    }), []);
+    return { ...state, notice, refresh, signOut };
+}

package/dist/sessionNsec.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Session nsec — a freshly generated (or pasted) key kept in the browser to
+ * sign a kind-27235 identity proof on every paid call (Tactic 2 in the wheel's
+ * `identity_proof`).
+ *
+ * Threat model, named at the sign-in gate when the patron picks this path:
+ *   - Stored unencrypted in localStorage. XSS on this origin can take it.
+ *     Accepted for one-tap sign-in; a patron wanting stronger isolation signs
+ *     in with an npub and answers the DM instead.
+ *   - Kept only so a reload survives. Cleared on sign-out.
+ */
+export declare function getSessionNsec(): string | null;
+export declare function setSessionNsec(nsecBech32: string): void;
+export declare function clearSessionNsec(): void;
+/** The 32-byte scalar `finalizeEvent` wants. Throws if absent or malformed. */
+export declare function getSessionNsecBytes(): Uint8Array;
+export declare function hasSessionNsec(): boolean;
+/**
+ * The npub the stored session nsec derives to, or null. Checked against the
+ * signed-in npub before signing, so a key left from a previous identity never
+ * signs for this one.
+ */
+export declare function sessionNsecNpub(): string | null;

package/dist/sessionNsec.js

@@ -0,0 +1,59 @@
+/**
+ * Session nsec — a freshly generated (or pasted) key kept in the browser to
+ * sign a kind-27235 identity proof on every paid call (Tactic 2 in the wheel's
+ * `identity_proof`).
+ *
+ * Threat model, named at the sign-in gate when the patron picks this path:
+ *   - Stored unencrypted in localStorage. XSS on this origin can take it.
+ *     Accepted for one-tap sign-in; a patron wanting stronger isolation signs
+ *     in with an npub and answers the DM instead.
+ *   - Kept only so a reload survives. Cleared on sign-out.
+ */
+import { getPublicKey, nip19 } from "nostr-tools";
+import { readStored, removeStored, writeStored } from "./storage.js";
+const NAME = "session_nsec:v1";
+export function getSessionNsec() {
+    return readStored(NAME) || null;
+}
+export function setSessionNsec(nsecBech32) {
+    if (!nsecBech32 || !nsecBech32.startsWith("nsec1")) {
+        throw new Error("Expected a bech32 nsec1… string");
+    }
+    try {
+        nip19.decode(nsecBech32);
+    }
+    catch (e) {
+        throw new Error(`Invalid nsec: ${e.message}`);
+    }
+    writeStored(NAME, nsecBech32);
+}
+export function clearSessionNsec() {
+    removeStored(NAME);
+}
+/** The 32-byte scalar `finalizeEvent` wants. Throws if absent or malformed. */
+export function getSessionNsecBytes() {
+    const nsec = getSessionNsec();
+    if (!nsec)
+        throw new Error("No session nsec set");
+    const decoded = nip19.decode(nsec);
+    if (decoded.type !== "nsec" || !(decoded.data instanceof Uint8Array)) {
+        throw new Error("Stored value is not a valid nsec");
+    }
+    return decoded.data;
+}
+export function hasSessionNsec() {
+    return !!getSessionNsec();
+}
+/**
+ * The npub the stored session nsec derives to, or null. Checked against the
+ * signed-in npub before signing, so a key left from a previous identity never
+ * signs for this one.
+ */
+export function sessionNsecNpub() {
+    try {
+        return nip19.npubEncode(getPublicKey(getSessionNsecBytes()));
+    }
+    catch {
+        return null;
+    }
+}

package/dist/signInSituation.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Reading a sign-in failure back to the human who caused none of it.
+ *
+ * Every operator draws its relay set from the DPYC Oracle at cold start. A
+ * container that has just woken has nothing cached, so the first sign-in
+ * against it is one Oracle blip away from failing — and what the patron was
+ * shown was the SDK's internal diagnosis, addressed to whoever maintains the
+ * SDK. To the person signing in it read as "your key is broken", which it is
+ * not: the next attempt usually works.
+ *
+ * So lead with what happened and what to do, and keep the original text
+ * underneath rather than swallowing it. Interpreting an error is not hiding it.
+ */
+export interface Situation {
+    /** What to say first. One sentence, addressed to the person, not the log. */
+    lead: string;
+    /** True when trying the same thing again is genuinely likely to work. */
+    retryable: boolean;
+    /** The service's own words, kept verbatim. Empty when `lead` already is them. */
+    detail: string;
+}
+export declare function readSignInFailure(raw: string, appName?: string): Situation;

package/dist/signInSituation.js

@@ -0,0 +1,42 @@
+/**
+ * Reading a sign-in failure back to the human who caused none of it.
+ *
+ * Every operator draws its relay set from the DPYC Oracle at cold start. A
+ * container that has just woken has nothing cached, so the first sign-in
+ * against it is one Oracle blip away from failing — and what the patron was
+ * shown was the SDK's internal diagnosis, addressed to whoever maintains the
+ * SDK. To the person signing in it read as "your key is broken", which it is
+ * not: the next attempt usually works.
+ *
+ * So lead with what happened and what to do, and keep the original text
+ * underneath rather than swallowing it. Interpreting an error is not hiding it.
+ */
+/** Substrings that identify a service that is awake but not yet ready. */
+const WARMING = [
+    "relay registry unreachable",
+    "cannot reach oracle",
+    "persistence layer unreachable",
+    "service unavailable",
+    "only bootstrap tools",
+];
+const UNREACHABLE = ["failed to fetch", "networkerror", "load failed", "timeout", "timed out"];
+export function readSignInFailure(raw, appName = "The service") {
+    const detail = (raw || "").trim() || "The service gave no reason.";
+    const hay = detail.toLowerCase();
+    if (WARMING.some((s) => hay.includes(s))) {
+        return {
+            lead: `${appName} was still waking up and could not reach the relay directory. ` +
+                "Nothing is wrong with your key — try again in a few seconds.",
+            retryable: true,
+            detail,
+        };
+    }
+    if (UNREACHABLE.some((s) => hay.includes(s))) {
+        return {
+            lead: `${appName} could not be reached from this device. Check the connection and try again.`,
+            retryable: true,
+            detail,
+        };
+    }
+    return { lead: detail, retryable: false, detail: "" };
+}