@hanzo/ui-shadcn 5.7.2

package/dist/src/billing/components/account-members.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"account-members.d.ts","sourceRoot":"","sources":["../../../../src/billing/components/account-members.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAEjE,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,oBAAoB,EAAE,CAAA;IAC/B,QAAQ,EAAE,WAAW,CAAA;IACrB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAC9D,YAAY,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACrE,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;CAC/C;AAiBD,wBAAgB,cAAc,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,mBAAmB,2CA8I1G"}

package/dist/src/billing/components/account-members.js

@@ -0,0 +1,63 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+const ROLES = ['owner', 'admin', 'viewer'];
+function roleBadgeClass(role) {
+    switch (role) {
+        case 'owner':
+            return 'bg-brand/20 text-brand';
+        case 'admin':
+            return 'bg-amber-500/20 text-amber-400';
+        case 'viewer':
+            return 'bg-text-dim/20 text-text-muted';
+    }
+}
+const INPUT_CLASS = 'rounded-lg border border-border bg-bg-input px-3 py-2 text-sm text-text outline-none transition focus:border-brand';
+export function AccountMembers({ members, userRole, onInvite, onChangeRole, onRemove }) {
+    const canManage = userRole === 'owner' || userRole === 'admin';
+    const [inviteEmail, setInviteEmail] = React.useState('');
+    const [inviteRole, setInviteRole] = React.useState('viewer');
+    const [inviting, setInviting] = React.useState(false);
+    const [busyId, setBusyId] = React.useState(null);
+    const handleInvite = React.useCallback(async () => {
+        if (!inviteEmail.includes('@') || !onInvite)
+            return;
+        setInviting(true);
+        try {
+            await onInvite(inviteEmail, inviteRole);
+            setInviteEmail('');
+            setInviteRole('viewer');
+        }
+        finally {
+            setInviting(false);
+        }
+    }, [inviteEmail, inviteRole, onInvite]);
+    const handleChangeRole = React.useCallback(async (memberId, role) => {
+        if (!onChangeRole)
+            return;
+        setBusyId(memberId);
+        try {
+            await onChangeRole(memberId, role);
+        }
+        finally {
+            setBusyId(null);
+        }
+    }, [onChangeRole]);
+    const handleRemove = React.useCallback(async (memberId) => {
+        if (!onRemove)
+            return;
+        setBusyId(memberId);
+        try {
+            await onRemove(memberId);
+        }
+        finally {
+            setBusyId(null);
+        }
+    }, [onRemove]);
+    return (_jsx("div", { className: "space-y-4", children: _jsxs("div", { className: "overflow-hidden rounded-xl border border-border bg-bg-card", children: [_jsxs("div", { className: "border-b border-border p-4", children: [_jsx("h3", { className: "text-lg font-semibold text-text", children: "Team members" }), _jsx("p", { className: "text-sm text-text-muted", children: canManage
+                                ? 'Manage who has access to this billing account.'
+                                : 'View members of this billing account.' })] }), canManage && onInvite && (_jsxs("div", { className: "flex flex-wrap items-end gap-3 border-b border-border p-4", children: [_jsxs("div", { className: "flex-1 min-w-[200px]", children: [_jsx("label", { className: "mb-1 block text-xs font-medium text-text-muted", children: "Email address" }), _jsx("input", { type: "email", value: inviteEmail, onChange: (e) => setInviteEmail(e.target.value), placeholder: "colleague@company.com", className: `${INPUT_CLASS} w-full` })] }), _jsxs("div", { className: "w-32", children: [_jsx("label", { className: "mb-1 block text-xs font-medium text-text-muted", children: "Role" }), _jsx("select", { value: inviteRole, onChange: (e) => setInviteRole(e.target.value), className: `${INPUT_CLASS} w-full`, children: ROLES.map((r) => (_jsx("option", { value: r, children: r.charAt(0).toUpperCase() + r.slice(1) }, r))) })] }), _jsx("button", { type: "button", disabled: !inviteEmail.includes('@') || inviting, onClick: handleInvite, className: "rounded-lg bg-text px-4 py-2 text-sm font-medium text-bg transition hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-60", children: inviting ? 'Inviting...' : 'Invite' })] })), _jsx("div", { className: "divide-y divide-border", children: members.length === 0 ? (_jsx("div", { className: "p-6 text-sm text-text-muted", children: "No members yet." })) : (members.map((member) => {
+                        const isBusy = busyId === member.id;
+                        return (_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3 p-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-brand/20 text-sm font-bold text-brand", children: (member.name || member.email).charAt(0).toUpperCase() }), _jsxs("div", { children: [_jsx("p", { className: "text-sm font-medium text-text", children: member.name || member.email }), _jsxs("div", { className: "flex items-center gap-2 text-xs text-text-muted", children: [_jsx("span", { children: member.email }), _jsx("span", { className: `rounded-full px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide ${roleBadgeClass(member.role)}`, children: member.role }), _jsxs("span", { children: ["Joined ", new Date(member.addedAt).toLocaleDateString('en-US')] })] })] })] }), canManage && (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("select", { value: member.role, onChange: (e) => handleChangeRole(member.id, e.target.value), disabled: isBusy, className: "rounded-md border border-border bg-bg-input px-2 py-1 text-xs text-text outline-none transition focus:border-brand disabled:cursor-not-allowed disabled:opacity-60", children: ROLES.map((r) => (_jsx("option", { value: r, children: r.charAt(0).toUpperCase() + r.slice(1) }, r))) }), _jsx("button", { type: "button", disabled: isBusy, onClick: () => handleRemove(member.id), className: "rounded-md border border-rose-500/30 px-3 py-1.5 text-xs font-medium text-rose-500 transition hover:bg-rose-500/10 disabled:cursor-not-allowed disabled:opacity-60", children: isBusy ? 'Removing...' : 'Remove' })] }))] }, member.id));
+                    })) })] }) }));
+}

package/dist/src/billing/components/account-switcher.d.ts

@@ -0,0 +1,9 @@
+import type { BillingAccount } from '../types';
+export interface AccountSwitcherProps {
+    accounts: BillingAccount[];
+    activeAccountId: string | null;
+    onSwitch: (accountId: string) => void;
+    onCreate?: () => void;
+}
+export declare function AccountSwitcher({ accounts, activeAccountId, onSwitch, onCreate }: AccountSwitcherProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=account-switcher.d.ts.map

package/dist/src/billing/components/account-switcher.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"account-switcher.d.ts","sourceRoot":"","sources":["../../../../src/billing/components/account-switcher.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAe,MAAM,UAAU,CAAA;AAE3D,MAAM,WAAW,oBAAoB;IACnC,QAAQ,EAAE,cAAc,EAAE,CAAA;IAC1B,eAAe,EAAE,MAAM,GAAG,IAAI,CAAA;IAC9B,QAAQ,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAA;IACrC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CACtB;AAyBD,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,eAAe,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,oBAAoB,kDA8HtG"}

package/dist/src/billing/components/account-switcher.js

@@ -0,0 +1,52 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+function roleBadgeClass(role) {
+    switch (role) {
+        case 'owner':
+            return 'bg-brand/20 text-brand';
+        case 'admin':
+            return 'bg-amber-500/20 text-amber-400';
+        case 'viewer':
+            return 'bg-text-dim/20 text-text-muted';
+    }
+}
+function planBadgeClass(_plan) {
+    return 'bg-text-dim/20 text-text-muted';
+}
+function formatBalance(balance, currency) {
+    return new Intl.NumberFormat('en-US', {
+        style: 'currency',
+        currency: currency.toUpperCase(),
+        minimumFractionDigits: 2,
+    }).format(balance / 100);
+}
+export function AccountSwitcher({ accounts, activeAccountId, onSwitch, onCreate }) {
+    const [open, setOpen] = React.useState(false);
+    const ref = React.useRef(null);
+    // Close dropdown on outside click
+    React.useEffect(() => {
+        function handleClick(e) {
+            if (ref.current && !ref.current.contains(e.target)) {
+                setOpen(false);
+            }
+        }
+        if (open) {
+            document.addEventListener('mousedown', handleClick);
+            return () => document.removeEventListener('mousedown', handleClick);
+        }
+    }, [open]);
+    const active = accounts.find((a) => a.id === activeAccountId) ?? accounts[0] ?? null;
+    if (accounts.length === 0 && !onCreate)
+        return null;
+    return (_jsxs("div", { ref: ref, className: "relative mb-4", children: [_jsxs("button", { type: "button", onClick: () => setOpen((v) => !v), className: "flex w-full items-center justify-between rounded-xl border border-border bg-bg-card px-4 py-3 text-left transition hover:bg-bg-elevated", children: [active ? (_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-lg bg-brand/20 text-sm font-bold text-brand", children: active.orgName.charAt(0).toUpperCase() }), _jsxs("div", { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-sm font-semibold text-text", children: active.name }), _jsx("span", { className: `rounded-full px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide ${planBadgeClass(active.plan)}`, children: active.plan }), _jsx("span", { className: `rounded-full px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide ${roleBadgeClass(active.role)}`, children: active.role })] }), _jsxs("span", { className: "text-xs text-text-muted", children: [active.orgName, " \u00B7 ", formatBalance(active.balance, active.currency)] })] })] })) : (_jsx("span", { className: "text-sm text-text-muted", children: "No billing account" })), _jsx("svg", { className: `h-4 w-4 text-text-muted transition-transform ${open ? 'rotate-180' : ''}`, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19 9l-7 7-7-7" }) })] }), open && (_jsxs("div", { className: "absolute left-0 right-0 z-50 mt-1 overflow-hidden rounded-xl border border-border bg-bg-card shadow-lg", children: [_jsx("div", { className: "max-h-72 overflow-y-auto divide-y divide-border", children: accounts.map((account) => {
+                            const isActive = account.id === activeAccountId;
+                            return (_jsxs("button", { type: "button", onClick: () => {
+                                    onSwitch(account.id);
+                                    setOpen(false);
+                                }, className: `flex w-full items-center gap-3 px-4 py-3 text-left transition hover:bg-bg-elevated ${isActive ? 'bg-bg-elevated' : ''}`, children: [_jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-lg bg-brand/20 text-sm font-bold text-brand", children: account.orgName.charAt(0).toUpperCase() }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-sm font-medium text-text truncate", children: account.name }), _jsx("span", { className: `shrink-0 rounded-full px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide ${planBadgeClass(account.plan)}`, children: account.plan }), _jsx("span", { className: `shrink-0 rounded-full px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide ${roleBadgeClass(account.role)}`, children: account.role })] }), _jsxs("span", { className: "text-xs text-text-muted", children: [account.orgName, " \u00B7 ", formatBalance(account.balance, account.currency)] })] }), isActive && (_jsx("svg", { className: "h-4 w-4 shrink-0 text-brand", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M5 13l4 4L19 7" }) }))] }, account.id));
+                        }) }), onCreate && (_jsx("div", { className: "border-t border-border p-2", children: _jsxs("button", { type: "button", onClick: () => {
+                                onCreate();
+                                setOpen(false);
+                            }, className: "flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm text-text-muted transition hover:bg-bg-elevated hover:text-text", children: [_jsx("svg", { className: "h-4 w-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 4v16m8-8H4" }) }), "Create billing account"] }) }))] }))] }));
+}

package/dist/src/billing/components/animated-card.d.ts

@@ -0,0 +1,9 @@
+export interface AnimatedCardProps {
+    number: string;
+    name: string;
+    expiry: string;
+    cvv: string;
+    cvvFocused: boolean;
+}
+export declare function AnimatedCard({ number, name, expiry, cvv, cvvFocused }: AnimatedCardProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=animated-card.d.ts.map

package/dist/src/billing/components/animated-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"animated-card.d.ts","sourceRoot":"","sources":["../../../../src/billing/components/animated-card.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;IACd,GAAG,EAAE,MAAM,CAAA;IACX,UAAU,EAAE,OAAO,CAAA;CACpB;AAqGD,wBAAgB,YAAY,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,EAAE,iBAAiB,2CAyKxF"}

package/dist/src/billing/components/animated-card.js

@@ -0,0 +1,161 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function detectNetwork(digits) {
+    if (digits.startsWith('4'))
+        return 'visa';
+    if (/^5[1-5]/.test(digits) || /^2[2-7]/.test(digits))
+        return 'mastercard';
+    if (/^3[47]/.test(digits))
+        return 'amex';
+    if (/^6(?:011|5)/.test(digits))
+        return 'discover';
+    return 'unknown';
+}
+// ── SVG logos (inline, no external deps) ─────────────────────────────────
+function VisaLogo() {
+    return (_jsx("svg", { viewBox: "0 0 60 20", width: "60", height: "20", "aria-label": "Visa", children: _jsx("text", { x: "0", y: "16", fontFamily: "Arial Black, sans-serif", fontWeight: "900", fontSize: "18", fill: "white", letterSpacing: "-1", children: "VISA" }) }));
+}
+function MastercardLogo() {
+    return (_jsxs("svg", { viewBox: "0 0 48 30", width: "48", height: "30", "aria-label": "Mastercard", children: [_jsx("circle", { cx: "15", cy: "15", r: "14", fill: "#eb001b", opacity: "0.9" }), _jsx("circle", { cx: "33", cy: "15", r: "14", fill: "#f79e1b", opacity: "0.9" }), _jsx("path", { d: "M24 4.8a14 14 0 0 1 0 20.4A14 14 0 0 1 24 4.8z", fill: "#ff5f00", opacity: "0.9" })] }));
+}
+function AmexLogo() {
+    return (_jsxs("svg", { viewBox: "0 0 70 20", width: "70", height: "20", "aria-label": "American Express", children: [_jsx("text", { x: "0", y: "15", fontFamily: "Arial, sans-serif", fontWeight: "700", fontSize: "13", fill: "white", letterSpacing: "0.5", children: "AMERICAN" }), _jsx("text", { x: "0", y: "28", fontFamily: "Arial, sans-serif", fontWeight: "700", fontSize: "13", fill: "white", letterSpacing: "0.5", children: "EXPRESS" })] }));
+}
+function DiscoverLogo() {
+    return (_jsxs("svg", { viewBox: "0 0 80 22", width: "80", height: "22", "aria-label": "Discover", children: [_jsx("text", { x: "0", y: "16", fontFamily: "Arial, sans-serif", fontWeight: "700", fontSize: "14", fill: "white", children: "DISCOVER" }), _jsx("circle", { cx: "72", cy: "11", r: "9", fill: "#f76f20" })] }));
+}
+function NetworkLogo({ network }) {
+    if (network === 'visa')
+        return _jsx(VisaLogo, {});
+    if (network === 'mastercard')
+        return _jsx(MastercardLogo, {});
+    if (network === 'amex')
+        return _jsx(AmexLogo, {});
+    if (network === 'discover')
+        return _jsx(DiscoverLogo, {});
+    return null;
+}
+// ── Chip SVG ──────────────────────────────────────────────────────────────
+function ChipIcon() {
+    return (_jsxs("svg", { width: "44", height: "34", viewBox: "0 0 44 34", fill: "none", "aria-hidden": "true", children: [_jsx("rect", { x: "0.5", y: "0.5", width: "43", height: "33", rx: "5.5", fill: "#c8a951", stroke: "#b8993e" }), _jsx("rect", { x: "14", y: "0.5", width: "16", height: "33", fill: "#b8993e", opacity: "0.5" }), _jsx("rect", { x: "0.5", y: "11", width: "43", height: "12", fill: "#b8993e", opacity: "0.5" }), _jsx("rect", { x: "14", y: "11", width: "16", height: "12", fill: "#c8a951", opacity: "0.8" }), _jsx("line", { x1: "14", y1: "0.5", x2: "14", y2: "33.5", stroke: "#a08030", strokeWidth: "0.5" }), _jsx("line", { x1: "30", y1: "0.5", x2: "30", y2: "33.5", stroke: "#a08030", strokeWidth: "0.5" }), _jsx("line", { x1: "0.5", y1: "11", x2: "43.5", y2: "11", stroke: "#a08030", strokeWidth: "0.5" }), _jsx("line", { x1: "0.5", y1: "23", x2: "43.5", y2: "23", stroke: "#a08030", strokeWidth: "0.5" })] }));
+}
+// ── Number masking ────────────────────────────────────────────────────────
+function maskNumber(digits, network) {
+    const len = network === 'amex' ? 15 : 16;
+    const padded = digits.padEnd(len, '\u2022');
+    if (network === 'amex') {
+        // 4-6-5 format
+        return `${padded.slice(0, 4)} ${padded.slice(4, 10)} ${padded.slice(10, 15)}`;
+    }
+    // 4-4-4-4 format, mask all but last 4
+    const groups = [
+        padded.slice(0, 4),
+        padded.slice(4, 8),
+        padded.slice(8, 12),
+        padded.slice(12, 16),
+    ];
+    return groups
+        .map((g, i) => (i < 3 ? g.replace(/\d/g, '\u2022') : g))
+        .join('  ');
+}
+// ── Animated card ─────────────────────────────────────────────────────────
+export function AnimatedCard({ number, name, expiry, cvv, cvvFocused }) {
+    const digits = number.replace(/\D/g, '');
+    const network = detectNetwork(digits);
+    const maskedNum = maskNumber(digits, network);
+    const displayName = name.trim() || 'YOUR NAME';
+    const displayExpiry = expiry || 'MM/YY';
+    const displayCvv = cvv ? cvv.replace(/./g, '\u2022') : '\u2022\u2022\u2022';
+    // Card dimensions: standard 85.6mm x 53.98mm ratio
+    const cardStyle = {
+        perspective: '1000px',
+        width: '340px',
+        height: '215px',
+    };
+    const innerStyle = {
+        position: 'relative',
+        width: '100%',
+        height: '100%',
+        transformStyle: 'preserve-3d',
+        transition: 'transform 0.6s cubic-bezier(0.4, 0, 0.2, 1)',
+        transform: cvvFocused ? 'rotateY(180deg)' : 'rotateY(0deg)',
+    };
+    const faceBase = {
+        position: 'absolute',
+        inset: 0,
+        backfaceVisibility: 'hidden',
+        WebkitBackfaceVisibility: 'hidden',
+        borderRadius: '16px',
+        overflow: 'hidden',
+    };
+    const frontStyle = {
+        ...faceBase,
+        background: 'linear-gradient(135deg, #1a1a2e 0%, #16213e 40%, #0f3460 100%)',
+        boxShadow: '0 20px 60px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.08)',
+    };
+    const backStyle = {
+        ...faceBase,
+        background: 'linear-gradient(135deg, #12121f 0%, #1a1a2e 100%)',
+        boxShadow: '0 20px 60px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.08)',
+        transform: 'rotateY(180deg)',
+    };
+    return (_jsx("div", { style: cardStyle, role: "img", "aria-label": "Payment card preview", children: _jsxs("div", { style: innerStyle, children: [_jsxs("div", { style: frontStyle, children: [_jsx("div", { style: {
+                                position: 'absolute', inset: 0,
+                                background: 'linear-gradient(135deg, rgba(255,255,255,0.12) 0%, transparent 50%)',
+                                pointerEvents: 'none',
+                            } }), _jsxs("div", { style: { position: 'absolute', top: '22px', left: '22px', right: '22px', display: 'flex', alignItems: 'center', justifyContent: 'space-between' }, children: [_jsx(ChipIcon, {}), _jsx(NetworkLogo, { network: network })] }), _jsx("div", { style: {
+                                position: 'absolute',
+                                top: '50%',
+                                left: '22px',
+                                right: '22px',
+                                transform: 'translateY(-50%)',
+                                fontFamily: 'ui-monospace, SFMono-Regular, Menlo, monospace',
+                                fontSize: '18px',
+                                fontWeight: '600',
+                                letterSpacing: '0.18em',
+                                color: 'rgba(255,255,255,0.92)',
+                                textShadow: '0 1px 3px rgba(0,0,0,0.4)',
+                            }, children: maskedNum }), _jsxs("div", { style: {
+                                position: 'absolute',
+                                bottom: '22px',
+                                left: '22px',
+                                right: '22px',
+                                display: 'flex',
+                                alignItems: 'flex-end',
+                                justifyContent: 'space-between',
+                            }, children: [_jsxs("div", { children: [_jsx("div", { style: { fontSize: '9px', color: 'rgba(255,255,255,0.5)', textTransform: 'uppercase', letterSpacing: '0.1em', marginBottom: '3px' }, children: "Card holder" }), _jsx("div", { style: { fontSize: '13px', fontWeight: '600', color: 'rgba(255,255,255,0.9)', textTransform: 'uppercase', letterSpacing: '0.05em', maxWidth: '180px', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }, children: displayName })] }), _jsxs("div", { style: { textAlign: 'right' }, children: [_jsx("div", { style: { fontSize: '9px', color: 'rgba(255,255,255,0.5)', textTransform: 'uppercase', letterSpacing: '0.1em', marginBottom: '3px' }, children: "Expires" }), _jsx("div", { style: { fontFamily: 'ui-monospace, monospace', fontSize: '13px', fontWeight: '600', color: 'rgba(255,255,255,0.9)' }, children: displayExpiry })] })] })] }), _jsxs("div", { style: backStyle, children: [_jsx("div", { style: {
+                                position: 'absolute',
+                                top: '40px',
+                                left: 0,
+                                right: 0,
+                                height: '46px',
+                                background: 'linear-gradient(180deg, #1a1a1a 0%, #111 50%, #1a1a1a 100%)',
+                            } }), _jsxs("div", { style: {
+                                position: 'absolute',
+                                top: '108px',
+                                left: '22px',
+                                right: '22px',
+                                display: 'flex',
+                                alignItems: 'center',
+                                gap: '12px',
+                            }, children: [_jsx("div", { style: {
+                                        flex: 1,
+                                        height: '40px',
+                                        background: 'repeating-linear-gradient(90deg, #e8e0d0 0px, #e8e0d0 8px, #d4cabb 8px, #d4cabb 10px)',
+                                        borderRadius: '4px',
+                                        display: 'flex',
+                                        alignItems: 'center',
+                                        paddingLeft: '8px',
+                                    }, children: _jsx("span", { style: { fontFamily: 'cursive, serif', fontSize: '12px', color: '#555', opacity: 0.6 }, children: "Authorized signature" }) }), _jsxs("div", { style: {
+                                        width: '60px',
+                                        height: '40px',
+                                        background: 'white',
+                                        borderRadius: '4px',
+                                        display: 'flex',
+                                        flexDirection: 'column',
+                                        alignItems: 'center',
+                                        justifyContent: 'center',
+                                        boxShadow: cvvFocused ? '0 0 0 2px #6366f1, 0 0 12px rgba(99,102,241,0.4)' : 'none',
+                                        transition: 'box-shadow 0.3s ease',
+                                    }, children: [_jsx("span", { style: { fontSize: '9px', color: '#888', marginBottom: '2px' }, children: "CVV" }), _jsx("span", { style: { fontFamily: 'ui-monospace, monospace', fontSize: '14px', fontWeight: '700', color: '#111', letterSpacing: '0.1em' }, children: displayCvv })] })] }), _jsx("div", { style: { position: 'absolute', bottom: '18px', right: '22px', opacity: 0.7 }, children: _jsx(NetworkLogo, { network: network }) })] })] }) }));
+}

package/dist/src/billing/components/billing-settings.d.ts

@@ -0,0 +1,26 @@
+import type { SpendAlert, BillingAccountMember, BillingRole, BusinessProfile, TaxSettings, ComplianceItem, SubscriptionDiscount, DiscountCode } from '../types';
+type SubTab = 'alerts' | 'team' | 'business' | 'tax' | 'support' | 'promotions';
+export interface BillingSettingsProps {
+    spendAlerts: SpendAlert[];
+    onCreateSpendAlert?: (title: string, threshold: number) => Promise<void>;
+    onUpdateSpendAlert?: (id: string, title: string, threshold: number) => Promise<void>;
+    onDeleteSpendAlert?: (id: string) => Promise<void>;
+    accountMembers: BillingAccountMember[];
+    userRole: BillingRole;
+    onInviteMember?: (email: string, role: BillingRole) => Promise<void>;
+    onChangeMemberRole?: (memberId: string, role: BillingRole) => Promise<void>;
+    onRemoveMember?: (memberId: string) => Promise<void>;
+    businessProfile: BusinessProfile;
+    onSaveBusinessProfile?: (profile: BusinessProfile) => Promise<void>;
+    taxSettings: TaxSettings;
+    complianceItems: ComplianceItem[];
+    onToggleAutomaticTax?: (enabled: boolean) => Promise<void>;
+    currentSupportTier?: string;
+    onSubscribeSupport?: (tierId: string) => Promise<void>;
+    discount?: SubscriptionDiscount | null;
+    onApplyDiscount?: (code: string) => Promise<DiscountCode | null>;
+    defaultSubTab?: SubTab;
+}
+export declare function BillingSettings(props: BillingSettingsProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=billing-settings.d.ts.map

package/dist/src/billing/components/billing-settings.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"billing-settings.d.ts","sourceRoot":"","sources":["../../../../src/billing/components/billing-settings.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EACV,UAAU,EACV,oBAAoB,EACpB,WAAW,EACX,eAAe,EACf,WAAW,EACX,cAAc,EACd,oBAAoB,EACpB,YAAY,EACb,MAAM,UAAU,CAAA;AAEjB,KAAK,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,UAAU,GAAG,KAAK,GAAG,SAAS,GAAG,YAAY,CAAA;AAE/E,MAAM,WAAW,oBAAoB;IACnC,WAAW,EAAE,UAAU,EAAE,CAAA;IACzB,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACxE,kBAAkB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACpF,kBAAkB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAClD,cAAc,EAAE,oBAAoB,EAAE,CAAA;IACtC,QAAQ,EAAE,WAAW,CAAA;IACrB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACpE,kBAAkB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAC3E,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACpD,eAAe,EAAE,eAAe,CAAA;IAChC,qBAAqB,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACnE,WAAW,EAAE,WAAW,CAAA;IACxB,eAAe,EAAE,cAAc,EAAE,CAAA;IACjC,oBAAoB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAC1D,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACtD,QAAQ,CAAC,EAAE,oBAAoB,GAAG,IAAI,CAAA;IACtC,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,YAAY,GAAG,IAAI,CAAC,CAAA;IAChE,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB;AAWD,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,2CAyD1D"}

package/dist/src/billing/components/billing-settings.js

@@ -0,0 +1,23 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { SpendAlertsPanel } from './spend-alerts';
+import { AccountMembers } from './account-members';
+import { BusinessProfilePanel } from './business-profile-panel';
+import { TaxCompliancePanel } from './tax-compliance-panel';
+import { SupportTiersPanel } from './support-tiers-panel';
+import { PromotionsPanel } from './promotions-panel';
+const subTabs = [
+    { id: 'alerts', label: 'Spend Alerts' },
+    { id: 'team', label: 'Team' },
+    { id: 'business', label: 'Business Info' },
+    { id: 'tax', label: 'Tax & Compliance' },
+    { id: 'support', label: 'Support' },
+    { id: 'promotions', label: 'Promotions' },
+];
+export function BillingSettings(props) {
+    const [active, setActive] = useState(props.defaultSubTab ?? 'alerts');
+    return (_jsxs("div", { children: [_jsx("div", { className: "mb-6 flex flex-wrap gap-1 rounded-xl bg-bg-card p-1 border border-border", children: subTabs.map(t => (_jsx("button", { type: "button", onClick: () => setActive(t.id), className: `rounded-lg px-3 py-2 text-sm font-medium transition ${active === t.id
+                        ? 'bg-bg-elevated text-text'
+                        : 'text-text-muted hover:text-text-secondary'}`, children: t.label }, t.id))) }), active === 'alerts' && (_jsx(SpendAlertsPanel, { alerts: props.spendAlerts, onCreateAlert: props.onCreateSpendAlert, onUpdateAlert: props.onUpdateSpendAlert, onDeleteAlert: props.onDeleteSpendAlert })), active === 'team' && (_jsx(AccountMembers, { members: props.accountMembers, userRole: props.userRole, onInvite: props.onInviteMember, onChangeRole: props.onChangeMemberRole, onRemove: props.onRemoveMember })), active === 'business' && (_jsx(BusinessProfilePanel, { profile: props.businessProfile, onSave: props.onSaveBusinessProfile })), active === 'tax' && (_jsx(TaxCompliancePanel, { taxSettings: props.taxSettings, complianceItems: props.complianceItems, onToggleAutomaticTax: props.onToggleAutomaticTax })), active === 'support' && (_jsx(SupportTiersPanel, { currentTier: props.currentSupportTier, onSubscribe: props.onSubscribeSupport })), active === 'promotions' && (_jsx(PromotionsPanel, { discount: props.discount ?? null, onApplyDiscount: props.onApplyDiscount }))] }));
+}

package/dist/src/billing/components/billing-workspace.d.ts

@@ -0,0 +1,28 @@
+import type { BillingMetric, BusinessProfile, ComplianceItem, Invoice, PaymentMethod, Subscription, SubscriptionHistory, SubscriptionPlan, TaxSettings, RetentionOffer } from '../types';
+type WorkspaceTab = 'overview' | 'payment' | 'invoices' | 'business' | 'compliance';
+export interface BillingWorkspaceProps {
+    subscription: Subscription;
+    plans: SubscriptionPlan[];
+    usageMetrics?: BillingMetric[];
+    retentionOffers?: RetentionOffer[];
+    subscriptionHistory?: SubscriptionHistory[];
+    paymentMethods?: PaymentMethod[];
+    invoices?: Invoice[];
+    businessProfile: BusinessProfile;
+    taxSettings: TaxSettings;
+    complianceItems: ComplianceItem[];
+    defaultTab?: WorkspaceTab;
+    onUpgrade?: (planId: string) => Promise<void>;
+    onDowngrade?: (planId: string) => Promise<void>;
+    onCancel?: (reason: string, feedback?: string) => Promise<void>;
+    onAcceptOffer?: (offerId: string) => Promise<void>;
+    onAddPaymentMethod?: (method: PaymentMethod) => Promise<void>;
+    onRemovePaymentMethod?: (id: string) => Promise<void>;
+    onSetDefaultPaymentMethod?: (id: string) => Promise<void>;
+    onDownloadInvoice?: (invoice: Invoice) => Promise<void>;
+    onSaveBusinessProfile?: (profile: BusinessProfile) => Promise<void>;
+    onToggleAutomaticTax?: (enabled: boolean) => Promise<void>;
+}
+export declare function BillingWorkspace(props: BillingWorkspaceProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=billing-workspace.d.ts.map

package/dist/src/billing/components/billing-workspace.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"billing-workspace.d.ts","sourceRoot":"","sources":["../../../../src/billing/components/billing-workspace.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EACV,aAAa,EACb,eAAe,EACf,cAAc,EACd,OAAO,EACP,aAAa,EACb,YAAY,EACZ,mBAAmB,EACnB,gBAAgB,EAChB,WAAW,EACX,cAAc,EACf,MAAM,UAAU,CAAA;AAEjB,KAAK,YAAY,GACb,UAAU,GACV,SAAS,GACT,UAAU,GACV,UAAU,GACV,YAAY,CAAA;AAEhB,MAAM,WAAW,qBAAqB;IACpC,YAAY,EAAE,YAAY,CAAA;IAC1B,KAAK,EAAE,gBAAgB,EAAE,CAAA;IACzB,YAAY,CAAC,EAAE,aAAa,EAAE,CAAA;IAC9B,eAAe,CAAC,EAAE,cAAc,EAAE,CAAA;IAClC,mBAAmB,CAAC,EAAE,mBAAmB,EAAE,CAAA;IAC3C,cAAc,CAAC,EAAE,aAAa,EAAE,CAAA;IAChC,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAA;IACpB,eAAe,EAAE,eAAe,CAAA;IAChC,WAAW,EAAE,WAAW,CAAA;IACxB,eAAe,EAAE,cAAc,EAAE,CAAA;IACjC,UAAU,CAAC,EAAE,YAAY,CAAA;IAEzB,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAC7C,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAC/C,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAC/D,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAElD,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAC7D,qBAAqB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACrD,yBAAyB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAEzD,iBAAiB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACvD,qBAAqB,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACnE,oBAAoB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;CAC3D;AAUD,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,2CAiG5D"}

package/dist/src/billing/components/billing-workspace.js

@@ -0,0 +1,22 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { InvoiceManager } from './invoice-manager';
+import { PaymentMethodManager } from './payment-manager';
+import { SubscriptionPortal } from './subscription-portal';
+import { BusinessProfilePanel } from './business-profile-panel';
+import { TaxCompliancePanel } from './tax-compliance-panel';
+const tabs = [
+    { id: 'overview', label: 'Overview' },
+    { id: 'payment', label: 'Payment methods' },
+    { id: 'invoices', label: 'Invoices' },
+    { id: 'business', label: 'Business info' },
+    { id: 'compliance', label: 'Tax & compliance' },
+];
+export function BillingWorkspace(props) {
+    const { subscription, plans, usageMetrics, retentionOffers, subscriptionHistory, paymentMethods, invoices, businessProfile, taxSettings, complianceItems, defaultTab = 'overview', onUpgrade, onDowngrade, onCancel, onAcceptOffer, onAddPaymentMethod, onRemovePaymentMethod, onSetDefaultPaymentMethod, onDownloadInvoice, onSaveBusinessProfile, onToggleAutomaticTax, } = props;
+    const [activeTab, setActiveTab] = React.useState(defaultTab);
+    return (_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "overflow-hidden rounded-2xl border border-zinc-200 bg-gradient-to-b from-zinc-50 to-white", children: [_jsxs("div", { className: "border-b border-zinc-200 px-4 py-4", children: [_jsx("h2", { className: "text-2xl font-semibold text-zinc-900", children: "Billing workspace" }), _jsx("p", { className: "text-sm text-zinc-500", children: "Run subscription, invoicing, payment, business profile, and compliance operations from one surface." })] }), _jsx("div", { className: "flex flex-wrap gap-2 p-3", children: tabs.map((tab) => (_jsx("button", { type: "button", onClick: () => setActiveTab(tab.id), className: `rounded-lg px-3 py-1.5 text-sm transition ${activeTab === tab.id
+                                ? 'bg-zinc-900 text-white'
+                                : 'text-zinc-600 hover:bg-zinc-100'}`, children: tab.label }, tab.id))) })] }), activeTab === 'overview' ? (_jsx(SubscriptionPortal, { subscription: subscription, availablePlans: plans, usageMetrics: usageMetrics, retentionOffers: retentionOffers, subscriptionHistory: subscriptionHistory, onUpgrade: onUpgrade, onDowngrade: onDowngrade, onCancel: onCancel, onAcceptOffer: onAcceptOffer })) : null, activeTab === 'payment' ? (_jsx(PaymentMethodManager, { paymentMethods: paymentMethods, onAdd: onAddPaymentMethod, onRemove: onRemovePaymentMethod, onSetDefault: onSetDefaultPaymentMethod })) : null, activeTab === 'invoices' ? (_jsx(InvoiceManager, { invoices: invoices, onDownload: onDownloadInvoice })) : null, activeTab === 'business' ? (_jsx(BusinessProfilePanel, { profile: businessProfile, onSave: onSaveBusinessProfile })) : null, activeTab === 'compliance' ? (_jsx(TaxCompliancePanel, { taxSettings: taxSettings, complianceItems: complianceItems, onToggleAutomaticTax: onToggleAutomaticTax })) : null] }));
+}

package/dist/src/billing/components/business-profile-panel.d.ts

@@ -0,0 +1,7 @@
+import type { BusinessProfile } from '../types';
+export interface BusinessProfilePanelProps {
+    profile: BusinessProfile;
+    onSave?: (profile: BusinessProfile) => Promise<void>;
+}
+export declare function BusinessProfilePanel(props: BusinessProfilePanelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=business-profile-panel.d.ts.map

package/dist/src/billing/components/business-profile-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"business-profile-panel.d.ts","sourceRoot":"","sources":["../../../../src/billing/components/business-profile-panel.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE/C,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE,eAAe,CAAA;IACxB,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;CACrD;AAID,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,2CAgLpE"}

package/dist/src/billing/components/business-profile-panel.js

@@ -0,0 +1,45 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+const INPUT_CLASS = 'w-full rounded-lg border border-border bg-bg-input px-3 py-2 text-sm text-text outline-none transition focus:border-brand';
+export function BusinessProfilePanel(props) {
+    const { profile, onSave } = props;
+    const [draft, setDraft] = React.useState(profile);
+    const [saving, setSaving] = React.useState(false);
+    React.useEffect(() => {
+        setDraft(profile);
+    }, [profile]);
+    const hasFinanceAndLegal = (draft.contacts || []).some((contact) => contact.role === 'finance' || contact.role === 'legal');
+    const handleSave = React.useCallback(async () => {
+        if (!onSave)
+            return;
+        setSaving(true);
+        try {
+            await onSave(draft);
+        }
+        finally {
+            setSaving(false);
+        }
+    }, [draft, onSave]);
+    return (_jsx("div", { className: "space-y-4", children: _jsxs("div", { className: "overflow-hidden rounded-xl border border-border bg-bg-card", children: [_jsxs("div", { className: "border-b border-border p-4", children: [_jsx("h3", { className: "text-lg font-semibold text-text", children: "Business profile" }), _jsx("p", { className: "text-sm text-text-muted", children: "Keep your legal and support details accurate for invoices, tax, and compliance workflows." })] }), _jsxs("div", { className: "grid gap-4 p-4 md:grid-cols-2", children: [_jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "font-medium text-text-secondary", children: "Legal name" }), _jsx("input", { value: draft.legalName, onChange: (e) => setDraft((prev) => ({ ...prev, legalName: e.target.value })), className: INPUT_CLASS })] }), _jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "font-medium text-text-secondary", children: "Display name" }), _jsx("input", { value: draft.displayName, onChange: (e) => setDraft((prev) => ({ ...prev, displayName: e.target.value })), className: INPUT_CLASS })] }), _jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "font-medium text-text-secondary", children: "Website" }), _jsx("input", { value: draft.website || '', onChange: (e) => setDraft((prev) => ({ ...prev, website: e.target.value })), className: INPUT_CLASS })] }), _jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "font-medium text-text-secondary", children: "Support email" }), _jsx("input", { value: draft.supportEmail || '', onChange: (e) => setDraft((prev) => ({ ...prev, supportEmail: e.target.value })), className: INPUT_CLASS })] }), _jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "font-medium text-text-secondary", children: "Statement descriptor" }), _jsx("input", { value: draft.statementDescriptor || '', onChange: (e) => setDraft((prev) => ({ ...prev, statementDescriptor: e.target.value })), className: INPUT_CLASS })] }), _jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "font-medium text-text-secondary", children: "Tax ID" }), _jsx("input", { value: draft.taxId || '', onChange: (e) => setDraft((prev) => ({ ...prev, taxId: e.target.value })), className: INPUT_CLASS })] })] }), _jsxs("div", { className: "border-t border-border bg-bg-elevated p-4", children: [_jsx("p", { className: "mb-2 text-sm font-medium text-text-secondary", children: "Registered address" }), _jsxs("div", { className: "grid gap-3 md:grid-cols-2", children: [_jsx("input", { value: draft.registeredAddress.line1, onChange: (e) => setDraft((prev) => ({
+                                        ...prev,
+                                        registeredAddress: { ...prev.registeredAddress, line1: e.target.value },
+                                    })), placeholder: "Line 1", className: `${INPUT_CLASS} text-sm` }), _jsx("input", { value: draft.registeredAddress.line2 || '', onChange: (e) => setDraft((prev) => ({
+                                        ...prev,
+                                        registeredAddress: { ...prev.registeredAddress, line2: e.target.value },
+                                    })), placeholder: "Line 2", className: `${INPUT_CLASS} text-sm` }), _jsx("input", { value: draft.registeredAddress.city, onChange: (e) => setDraft((prev) => ({
+                                        ...prev,
+                                        registeredAddress: { ...prev.registeredAddress, city: e.target.value },
+                                    })), placeholder: "City", className: `${INPUT_CLASS} text-sm` }), _jsx("input", { value: draft.registeredAddress.state || '', onChange: (e) => setDraft((prev) => ({
+                                        ...prev,
+                                        registeredAddress: { ...prev.registeredAddress, state: e.target.value },
+                                    })), placeholder: "State/Province", className: `${INPUT_CLASS} text-sm` }), _jsx("input", { value: draft.registeredAddress.zip, onChange: (e) => setDraft((prev) => ({
+                                        ...prev,
+                                        registeredAddress: { ...prev.registeredAddress, zip: e.target.value },
+                                    })), placeholder: "Postal code", className: `${INPUT_CLASS} text-sm` }), _jsx("input", { value: draft.registeredAddress.country, onChange: (e) => setDraft((prev) => ({
+                                        ...prev,
+                                        registeredAddress: { ...prev.registeredAddress, country: e.target.value },
+                                    })), placeholder: "Country", className: `${INPUT_CLASS} text-sm` })] })] }), _jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3 border-t border-border p-4", children: [_jsx("p", { className: "text-xs text-text-muted", children: hasFinanceAndLegal
+                                ? 'Finance and legal contacts are configured.'
+                                : 'Tip: add at least one finance or legal contact for smooth audits.' }), _jsx("button", { type: "button", onClick: handleSave, disabled: !onSave || saving, className: "rounded-lg bg-text px-3 py-2 text-sm font-medium text-bg transition hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-60", children: saving ? 'Saving\u2026' : 'Save profile' })] })] }) }));
+}

package/dist/src/billing/components/card-form.d.ts

@@ -0,0 +1,18 @@
+export interface CardFormProps {
+    /** Called with tokenization result when card is saved */
+    onSuccess: (result: {
+        token: string;
+        brand: string;
+        last4: string;
+        expiryMonth: string;
+        expiryYear: string;
+        provider: string;
+    }) => Promise<void>;
+    /** Base URL for commerce API, e.g. https://api.hanzo.ai/api/v1 */
+    apiBaseUrl?: string;
+    /** Auth token for API calls */
+    authToken?: string;
+    disabled?: boolean;
+}
+export declare function CardForm({ onSuccess, apiBaseUrl, authToken, disabled }: CardFormProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=card-form.d.ts.map

package/dist/src/billing/components/card-form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-form.d.ts","sourceRoot":"","sources":["../../../../src/billing/components/card-form.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,aAAa;IAC5B,yDAAyD;IACzD,SAAS,EAAE,CAAC,MAAM,EAAE;QAClB,KAAK,EAAE,MAAM,CAAA;QACb,KAAK,EAAE,MAAM,CAAA;QACb,KAAK,EAAE,MAAM,CAAA;QACb,WAAW,EAAE,MAAM,CAAA;QACnB,UAAU,EAAE,MAAM,CAAA;QAClB,QAAQ,EAAE,MAAM,CAAA;KACjB,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACnB,kEAAkE;IAClE,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAyDD,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,aAAa,2CAmMrF"}