@columenlabs/lumen-ui 0.1.82 → 0.1.83

package/dist/assistant/settings.js

@@ -2,6 +2,7 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 import { useQueryClient } from '@tanstack/react-query';
 import { CheckIcon, ExternalLinkIcon, GlobeIcon, KeyRoundIcon, LayersIcon, ReceiptIcon, SparklesIcon, Trash2Icon, WrenchIcon, } from 'lucide-react';
 import { useId, useState } from 'react';
+import { LumenChatgptSignin } from '../chatgpt-signin.js';
 import { LumenExpandList, LumenExpandRow } from '../expand-list.js';
 import { SaveButton } from '../form-issues.js';
 import { IconButton } from '../icon-button.js';
@@ -128,50 +129,10 @@ function CapInput({ label, value, onSave, }) {
     };
     return (_jsxs("div", { className: "flex items-center gap-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "$" }), _jsx(Input, { "aria-label": label, inputMode: "decimal", className: "h-8 w-20 text-right tabular-nums", value: text, onChange: (e) => setText(e.target.value), onBlur: commit, onKeyDown: (e) => e.key === 'Enter' && commit() }), _jsx("span", { className: "text-muted-foreground", children: "/ month" })] }));
 }
-/** A person's ChatGPT plan sign-in: opens in a new tab, finished by pasting back where it ended. */
+/** A person's ChatGPT plan sign-in, on the assistant's own routes. */
 function ChatgptSignin({ client, p }) {
     const { apply, refresh } = useApply(client);
-    const id = useId();
-    const [started, setStarted] = useState(null);
-    const [pasted, setPasted] = useState('');
-    const [busy, setBusy] = useState(false);
-    const signedIn = p.own.via === 'chatgpt';
-    const start = async () => {
-        // Open the tab inside the click, or the browser blocks it; point it once the address is known.
-        const tab = window.open('about:blank', '_blank');
-        if (tab)
-            tab.opener = null;
-        try {
-            const { url, redirect } = await client.startSignin(p.id);
-            if (tab)
-                tab.location.href = url;
-            else
-                window.open(url, '_blank', 'noopener');
-            setStarted(redirect);
-        }
-        catch (e) {
-            tab?.close();
-            lumenToast.error(errorText(e));
-        }
-    };
-    const finish = async () => {
-        setBusy(true);
-        if (await apply(`signin:${p.id}`, () => client.finishSignin(p.id, pasted.trim()), 'Signed in')) {
-            setPasted('');
-            setStarted(null);
-        }
-        setBusy(false);
-    };
-    const issues = [];
-    if (pasted.trim() && started && !pasted.trim().startsWith(started.split('/auth')[0] ?? ''))
-        issues.push({ where: 'Address', message: `It starts with ${started}`, target: id });
-    if (signedIn)
-        return (_jsxs("div", { className: "flex flex-col gap-3 border-b py-3 last:border-b-0", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "flex-1 font-medium text-sm", children: "Your ChatGPT plan" }), _jsx("span", { className: "text-muted-foreground text-xs", children: p.own.hint }), p.own.test && _jsx(TestBadge, { test: p.own.test })] }), _jsx(KeyTestLine, { test: testOf(p.own), run: () => client.testOwnKey(p.id).finally(refresh) }), _jsxs("div", { className: "flex justify-end gap-2", children: [_jsx(IconButton, { icon: Trash2Icon, label: "Sign out of ChatGPT", variant: "outline", onClick: () => void apply(`own:${p.id}`, () => client.ownKey(p.id, null), 'Signed out') }), _jsx(SaveButton, { issues: [], icon: KeyRoundIcon, label: "Sign in again", onSave: start })] }), started && (_jsx(SigninPaste, { id: id, redirect: started, pasted: pasted, setPasted: setPasted, issues: issues, busy: busy, finish: finish }))] }));
-    return (_jsxs("div", { className: "flex flex-col gap-3 border-b py-3 last:border-b-0", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(InfoLabel, { className: "flex-1 font-medium text-sm", info: "Run OpenAI models on your own ChatGPT plan instead of an API key.", children: "Your ChatGPT plan" }), _jsx(Badge, { variant: "outline", children: "Not signed in" })] }), _jsx("div", { className: "flex justify-end", children: _jsx(SaveButton, { issues: [], icon: ExternalLinkIcon, label: started ? 'Open the sign-in again' : 'Sign in with ChatGPT', onSave: start }) }), started && (_jsx(SigninPaste, { id: id, redirect: started, pasted: pasted, setPasted: setPasted, issues: issues, busy: busy, finish: finish }))] }));
-}
-/** Where the sign-in tab ends, and the box its address is pasted into. */
-function SigninPaste({ id, redirect, pasted, setPasted, issues, busy, finish, }) {
-    return (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { htmlFor: id, children: _jsx(InfoLabel, { info: `The sign-in ends on ${redirect}, a page that does not load. That is expected: copy the whole address from that tab's address bar.`, children: "Paste the address the sign-in ended on" }) }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Input, { id: id, autoComplete: "off", placeholder: `${redirect}?code=…`, className: "font-code text-xs", value: pasted, onChange: (e) => setPasted(e.target.value) }), _jsx(SaveButton, { issues: issues, busy: busy, disabled: !pasted.trim(), label: "Finish", onSave: finish })] })] }));
+    return (_jsx(LumenChatgptSignin, { state: p.own, start: () => client.startSignin(p.id), finish: (url) => apply(`signin:${p.id}`, () => client.finishSignin(p.id, url), 'Signed in'), signOut: () => apply(`own:${p.id}`, () => client.ownKey(p.id, null), 'Signed out'), test: () => client.testOwnKey(p.id).finally(refresh) }));
 }
 const ready = (_jsxs(Badge, { variant: "outline", className: "text-gain", children: [_jsx(CheckIcon, {}), "Ready"] }));
 const notSet = _jsx(Badge, { variant: "outline", children: "Not set" });

package/dist/chatgpt-signin.d.ts

@@ -0,0 +1,18 @@
+import type { KeyState } from '@columenlabs/lumen-ui-types/assistant';
+export interface LumenChatgptSigninProps {
+    /** The person's key state: signed in when `via` is `chatgpt`, `hint` the account's email. */
+    state: KeyState;
+    /** Starts a sign-in on the server: the address to open and the one it ends on. */
+    start: () => Promise<{
+        url: string;
+        redirect: string;
+    }>;
+    /** Finishes it from the pasted address; true once kept (the app says why when it is not). */
+    finish: (url: string) => Promise<boolean>;
+    /** Signs out (drops the sealed tokens). */
+    signOut: () => Promise<unknown>;
+    /** One free call that says whether the sign-in still works; the app refreshes its data after. */
+    test: () => Promise<unknown>;
+}
+/** Sign in with ChatGPT: opens in a new tab, finished by pasting back where it ended. */
+export declare function LumenChatgptSignin({ state, start, finish, signOut, test, }: LumenChatgptSigninProps): import("react").JSX.Element;

package/dist/chatgpt-signin.js

@@ -0,0 +1,64 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ExternalLinkIcon, KeyRoundIcon, Trash2Icon } from 'lucide-react';
+import { useId, useState } from 'react';
+import { SaveButton } from './form-issues.js';
+import { IconButton } from './icon-button.js';
+import { InfoLabel } from './info-tip.js';
+import { KeyTestLine, TestBadge, errorText } from './integrations.js';
+import { lumenToast } from './lumen-toast.js';
+import { Badge } from './ui/badge.js';
+import { Input } from './ui/input.js';
+import { Label } from './ui/label.js';
+const testOf = (k) => k.test
+    ? {
+        at: new Date(k.test.at).toISOString(),
+        ok: k.test.ok,
+        detail: k.test.detail,
+        error: k.test.ok ? null : k.test.detail,
+    }
+    : null;
+/** Sign in with ChatGPT: opens in a new tab, finished by pasting back where it ended. */
+export function LumenChatgptSignin({ state, start, finish, signOut, test, }) {
+    const id = useId();
+    const [started, setStarted] = useState(null);
+    const [pasted, setPasted] = useState('');
+    const [busy, setBusy] = useState(false);
+    const signedIn = state.via === 'chatgpt';
+    const open = async () => {
+        // Open the tab inside the click, or the browser blocks it; point it once the address is known.
+        const tab = window.open('about:blank', '_blank');
+        if (tab)
+            tab.opener = null;
+        try {
+            const { url, redirect } = await start();
+            if (tab)
+                tab.location.href = url;
+            else
+                window.open(url, '_blank', 'noopener');
+            setStarted(redirect);
+        }
+        catch (e) {
+            tab?.close();
+            lumenToast.error(errorText(e));
+        }
+    };
+    const done = async () => {
+        setBusy(true);
+        if (await finish(pasted.trim())) {
+            setPasted('');
+            setStarted(null);
+        }
+        setBusy(false);
+    };
+    const issues = [];
+    if (pasted.trim() && started && !pasted.trim().startsWith(started.split('/auth')[0] ?? ''))
+        issues.push({ where: 'Address', message: `It starts with ${started}`, target: id });
+    const paste = started && (_jsx(SigninPaste, { id: id, redirect: started, pasted: pasted, setPasted: setPasted, issues: issues, busy: busy, finish: done }));
+    if (signedIn)
+        return (_jsxs("div", { className: "flex flex-col gap-3 border-b py-3 last:border-b-0", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "flex-1 font-medium text-sm", children: "Your ChatGPT plan" }), _jsx("span", { className: "text-muted-foreground text-xs", children: state.hint }), state.test && _jsx(TestBadge, { test: state.test })] }), _jsx(KeyTestLine, { test: testOf(state), run: test }), _jsxs("div", { className: "flex justify-end gap-2", children: [_jsx(IconButton, { icon: Trash2Icon, label: "Sign out of ChatGPT", variant: "outline", onClick: () => void signOut() }), _jsx(SaveButton, { issues: [], icon: KeyRoundIcon, label: "Sign in again", onSave: open })] }), paste] }));
+    return (_jsxs("div", { className: "flex flex-col gap-3 border-b py-3 last:border-b-0", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(InfoLabel, { className: "flex-1 font-medium text-sm", info: "Run OpenAI models on your own ChatGPT plan instead of an API key.", children: "Your ChatGPT plan" }), _jsx(Badge, { variant: "outline", children: "Not signed in" })] }), _jsx("div", { className: "flex justify-end", children: _jsx(SaveButton, { issues: [], icon: ExternalLinkIcon, label: started ? 'Open the sign-in again' : 'Sign in with ChatGPT', onSave: open }) }), paste] }));
+}
+/** Where the sign-in tab ends, and the box its address is pasted into. */
+function SigninPaste({ id, redirect, pasted, setPasted, issues, busy, finish, }) {
+    return (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { htmlFor: id, children: _jsx(InfoLabel, { info: `The sign-in ends on ${redirect}, a page that does not load. That is expected: copy the whole address from that tab's address bar.`, children: "Paste the address the sign-in ended on" }) }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Input, { id: id, autoComplete: "off", placeholder: `${redirect}?code=…`, className: "font-code text-xs", value: pasted, onChange: (e) => setPasted(e.target.value) }), _jsx(SaveButton, { issues: issues, busy: busy, disabled: !pasted.trim(), label: "Finish", onSave: finish })] })] }));
+}

package/dist/index.d.ts

@@ -49,6 +49,7 @@ export { type Crumb, IconButton, type IconButtonProps, Page, PageBody, PageHeade
 export { DEFAULT_PREFS, deviceTimeZone, type Prefs, TIME_ZONES, type Theme, type TimeZoneId, getPrefs, resolvedTheme, setPref, timeZoneLabel, usePrefs, ASSISTANT_WIDTH, } from './prefs.js';
 export { KIT, type KitConfig, configureLumen } from './kit-config.js';
 export { ConnectionBlock, ErrorLine, IntegrationRow, KeyTestLine, type KeyTestResult, TestBadge, errorText, useClock, } from './integrations.js';
+export { LumenChatgptSignin, type LumenChatgptSigninProps } from './chatgpt-signin.js';
 export { LumenExpandList, LumenExpandRow } from './expand-list.js';
 export { LumenPager } from './pager.js';
 export { createDeskQueryClient } from './query-client.js';

package/dist/index.js

@@ -56,6 +56,7 @@ export { IconButton, Page, PageBody, PageHeader, } from './page.js';
 export { DEFAULT_PREFS, deviceTimeZone, TIME_ZONES, getPrefs, resolvedTheme, setPref, timeZoneLabel, usePrefs, ASSISTANT_WIDTH, } from './prefs.js';
 export { KIT, configureLumen } from './kit-config.js';
 export { ConnectionBlock, ErrorLine, IntegrationRow, KeyTestLine, TestBadge, errorText, useClock, } from './integrations.js';
+export { LumenChatgptSignin } from './chatgpt-signin.js';
 export { LumenExpandList, LumenExpandRow } from './expand-list.js';
 export { LumenPager } from './pager.js';
 export { createDeskQueryClient } from './query-client.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@columenlabs/lumen-ui",
-  "version": "0.1.82",
+  "version": "0.1.83",
   "description": "Lumen: shared React components (frame, views, widgets, charts, drawers).",
   "license": "MIT",
   "type": "module",
@@ -49,7 +49,7 @@
     "@codemirror/lang-javascript": "6.2.5",
     "@codemirror/lang-json": "6.0.2",
     "@codemirror/lang-sql": "6.10.0",
-    "@columenlabs/lumen-ui-types": "0.1.82",
+    "@columenlabs/lumen-ui-types": "0.1.83",
     "@dnd-kit/core": "6.3.1",
     "@dnd-kit/sortable": "10.0.0",
     "@dnd-kit/utilities": "3.2.2",