@hanzo/build 0.2.79 → 0.2.80

package/README.md

@@ -226,10 +226,15 @@ are any member's.
 - Plugins: TypeScript connectors built on the platform, from source or from a
   description of an API; a failed build says why. Browse offers building one and
   lists what the deployment mounts.
-- Agents: Browse is the platform's presets whose tool calls run on the platform,
-  each a Use that opens a new agent written from it; Yours is the org's own —
-  model, instructions, tools, budget — created, edited (only what changed is
-  sent) and deleted.
+- Agents: Browse is every agent to start from — the host's default agents
+  (`cast`) and personas (`personas`), and the platform's presets whose tool
+  calls run on the platform — searched by name and filtered by category. Use
+  makes one agent of the org's own from one template (a name taken becomes
+  `-2`, `-3`), with its face, model and instructions, and opens its profile;
+  nothing is added in bulk. Start from scratch, Clone yourself (the person
+  signed in, with writing pasted or uploaded) and Create from a person make one
+  too. Yours is the org's own — model, instructions, tools, budget — created,
+  edited (only what changed is sent) and deleted.
 
 **New.** "What's up next?", and at the foot the composer: where the run runs
 (Cloud is the platform's sandbox with the codebase's environment; the org's

package/lib/api/agents.d.ts

@@ -1,6 +1,6 @@
 /**
- * Agents: the org's own — a model, instructions, the tools it may call and a
- * budget — and the presets one can start from.
+ * Agents: the org's own — a model, instructions, the tools it may call, a
+ * budget and a face — and the templates one is made from.
  *
  *   GET    /v1/agent                 {agents: [agent]}, without instructions
  *   POST   /v1/agent                 create → 201 agent
@@ -35,6 +35,8 @@ export interface Agent {
     task: number;
     spent: number;
     period: Period | '';
+    /** Its picture: an https link or a data URL; '' draws its emoji or initial. */
+    avatar: string;
     emoji: string;
 }
 export interface Preset {
@@ -52,6 +54,8 @@ export interface Draft {
     cap: string;
     task: string;
     period: Period;
+    /** Sent on create only: an https link or a data URL. */
+    avatar: string;
 }
 /** An agent's name, as the handler takes it. */
 export declare const NAME: RegExp;
@@ -86,29 +90,45 @@ export declare function profile(t: Target, ref: string): Promise<{
     agent: Agent;
     runs: Run[];
 }>;
-/** A default agent a host offers: a name, its line, its model and its instructions. */
+/** An agent to start from: a default agent, a persona or a preset. */
 export interface Cast {
+    /** The name it is made under. */
     name: string;
+    /** What Browse calls it. */
+    title: string;
     description: string;
+    /** What Browse lists it under. */
+    category: string;
     model: string;
     instructions: string;
-    /** Its face, an address of the host, when it has one. */
+    /** Reads the instructions, where they are a file the host serves. */
+    read?: () => Promise<string>;
+    /** Its face, an address of the host. */
     avatar?: string;
+    tools?: string[];
 }
-/** What a default agent may spend until its owner says otherwise, in dollars: each month, and one run. */
+/** What an agent made from a template may spend until its owner says otherwise, in dollars: each month, and one run. */
 export declare const CAST_CAP = "10";
 export declare const CAST_TASK = "1";
-/** The cast members the org has no agent for, by name in any case. */
-export declare const missing: (cast: readonly Cast[], have: readonly {
-    name: string;
-}[]) => Cast[];
-/** Create every cast member the org lacks, one at a time; the names made, and the first refusal, if any. */
-export declare function hire(t: Target, cast: readonly Cast[], have: readonly {
+/**
+ * A name the API takes: accents dropped, any other run of characters a dash,
+ * from a letter or digit, up to 64. "Spärck Jones" is Sparck-Jones.
+ */
+export declare const handle: (name: string) => string;
+/** `name`, or `name-2`, `name-3`… : the first the org has no agent called, in any case. */
+export declare function free(name: string, have: readonly {
     name: string;
-}[]): Promise<{
-    made: string[];
-    error: unknown;
-}>;
+}[]): string;
+/** An address of the page as an https link the API keeps, or '' (a page served over http has none). */
+export declare const link: (at: string | undefined, base: string) => string;
+/**
+ * Make the org's own agent from a template: under the first name the org has
+ * free (read now, so it is never one that exists), with its instructions read
+ * and its face linked. The template is not touched.
+ */
+export declare function use(t: Target, c: Cast, base: string): Promise<Agent>;
+/** Anyone as a template: their name, who they are, and writing of theirs to take the voice from. */
+export declare function person(name: string, about: string, writing: string, avatar?: string): Cast;
 export declare function create(t: Target, d: Draft): Promise<Agent>;
 /** The fields that differ from `was`, and nothing else: an omitted field keeps its value. */
 export declare function changes(was: Agent, d: Draft): Record<string, unknown>;
@@ -116,5 +136,5 @@ export declare function update(t: Target, was: Agent, d: Draft): Promise<Agent>;
 export declare function remove(t: Target, ref: string): Promise<void>;
 /** The presets that make a working agent. */
 export declare function presets(t: Target): Promise<Preset[]>;
-/** A new agent's draft from a preset. */
-export declare function fromPreset(p: Preset): Draft;
+/** A preset as a template. */
+export declare function fromPreset(p: Preset): Cast;

package/lib/api/agents.js

@@ -1,6 +1,6 @@
 /**
- * Agents: the org's own — a model, instructions, the tools it may call and a
- * budget — and the presets one can start from.
+ * Agents: the org's own — a model, instructions, the tools it may call, a
+ * budget and a face — and the templates one is made from.
  *
  *   GET    /v1/agent                 {agents: [agent]}, without instructions
  *   POST   /v1/agent                 create → 201 agent
@@ -47,6 +47,7 @@ export function agent(raw) {
         task: num(o.max_task_micro_usd),
         spent: num(o.consumed_micro_usd),
         period: PERIODS.includes(period) ? period : '',
+        avatar: str(o.avatar),
         emoji: str(o.emoji),
     };
 }
@@ -61,9 +62,10 @@ export function draft(a) {
         cap: dollars(a.cap),
         task: dollars(a.task),
         period: a.period || 'month',
+        avatar: a.avatar,
     };
 }
-export const EMPTY = { name: '', description: '', model: '', instructions: '', tools: [], cap: '', task: '', period: 'month' };
+export const EMPTY = { name: '', description: '', model: '', instructions: '', tools: [], cap: '', task: '', period: 'month', avatar: '' };
 /** Why a draft cannot be saved as it stands, or '' when it can. */
 export function refuse(d) {
     if (!NAME.test(d.name))
@@ -95,27 +97,52 @@ export async function profile(t, ref) {
     const raw = await call(t, 'GET', `/v1/agent/${seg(ref)}`);
     return { agent: agent(raw), runs: rows(obj(raw).recentRuns).map(run).filter((r) => r.id) };
 }
-/** What a default agent may spend until its owner says otherwise, in dollars: each month, and one run. */
+/** What an agent made from a template may spend until its owner says otherwise, in dollars: each month, and one run. */
 export const CAST_CAP = '10';
 export const CAST_TASK = '1';
-/** The cast members the org has no agent for, by name in any case. */
-export const missing = (cast, have) => {
-    const names = new Set(have.map((a) => a.name.toLowerCase()));
-    return cast.filter((c) => !names.has(c.name.toLowerCase()));
-};
-/** Create every cast member the org lacks, one at a time; the names made, and the first refusal, if any. */
-export async function hire(t, cast, have) {
-    const made = [];
-    for (const c of missing(cast, have)) {
-        try {
-            await create(t, { ...EMPTY, name: c.name, description: c.description, model: c.model, instructions: c.instructions, cap: CAST_CAP, task: CAST_TASK, period: 'month' });
-            made.push(c.name);
-        }
-        catch (error) {
-            return { made, error };
-        }
+/**
+ * A name the API takes: accents dropped, any other run of characters a dash,
+ * from a letter or digit, up to 64. "Spärck Jones" is Sparck-Jones.
+ */
+export const handle = (name) => name
+    .normalize('NFD')
+    .replace(/[\u0300-\u036f]/g, '')
+    .replace(/[^A-Za-z0-9._-]+/g, '-')
+    .replace(/^[^A-Za-z0-9]+/, '')
+    .slice(0, 64)
+    .replace(/-+$/, '');
+/** `name`, or `name-2`, `name-3`… : the first the org has no agent called, in any case. */
+export function free(name, have) {
+    const taken = new Set(have.map((a) => a.name.toLowerCase()));
+    if (!taken.has(name.toLowerCase()))
+        return name;
+    for (let i = 2;; i++) {
+        const next = `${name.slice(0, 63 - String(i).length)}-${i}`;
+        if (!taken.has(next.toLowerCase()))
+            return next;
     }
-    return { made, error: null };
+}
+/** An address of the page as an https link the API keeps, or '' (a page served over http has none). */
+export const link = (at, base) => {
+    if (!at)
+        return '';
+    const url = new URL(at, base).href;
+    return url.startsWith('https://') || url.startsWith('data:') ? url : '';
+};
+/**
+ * Make the org's own agent from a template: under the first name the org has
+ * free (read now, so it is never one that exists), with its instructions read
+ * and its face linked. The template is not touched.
+ */
+export async function use(t, c, base) {
+    const [have, instructions] = await Promise.all([agents(t), c.read ? c.read() : c.instructions]);
+    return create(t, { ...EMPTY, name: free(handle(c.name), have), description: c.description, model: c.model, instructions, tools: c.tools ?? [], cap: CAST_CAP, task: CAST_TASK, avatar: link(c.avatar, base) });
+}
+/** Anyone as a template: their name, who they are, and writing of theirs to take the voice from. */
+export function person(name, about, writing, avatar = '') {
+    const who = name.trim();
+    const lines = [`You are ${who}.`, about.trim(), writing.trim() && `Writing by ${who}:\n\n${writing.trim()}`];
+    return { name: who, title: who, description: about.trim(), category: 'Person', model: '', instructions: lines.filter(Boolean).join('\n\n'), avatar };
 }
 export async function create(t, d) {
     const why = refuse(d);
@@ -132,6 +159,8 @@ export async function create(t, d) {
     };
     if (d.model)
         body.model = d.model;
+    if (d.avatar)
+        body.avatar = d.avatar;
     return agent(await call(t, 'POST', '/v1/agent', body));
 }
 /** The fields that differ from `was`, and nothing else: an omitted field keeps its value. */
@@ -173,7 +202,7 @@ export async function presets(t) {
         .map((p) => ({ id: str(p.id), title: str(p.title), prompt: str(p.systemPrompt) }))
         .filter((p) => p.id);
 }
-/** A new agent's draft from a preset. */
+/** A preset as a template. */
 export function fromPreset(p) {
-    return { ...EMPTY, name: p.id, description: p.title, instructions: p.prompt };
+    return { name: p.id, title: p.title || p.id, description: p.title, category: 'Preset', model: '', instructions: p.prompt };
 }

package/lib/customize/agents.d.ts

@@ -1,4 +1,7 @@
+import { type Cast } from '../api/agents.ts';
 import { type Pane } from './ui.tsx';
+/** Categories as Browse offers them: the default agents' and presets' first, as listed, then the rest by how many each holds. */
+export declare function kinds(first: readonly Cast[], rest: readonly Cast[]): string[];
 export declare function Agents({ view, q, adding, onAdding, onView, onCount }: Pane): import("react").JSX.Element;
 /** One agent's page: who it is, what it runs on and reads, what it may call and spend, and what it has done. */
 export declare function Profile({ name }: {

package/lib/customize/agents.js

@@ -3,10 +3,12 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
  * Agents: the org's own — a model, instructions, the tools it may call, and
  * what it may spend.
  *
- * Browse is the platform's presets whose tool calls run on the platform;
- * starting from one opens a new agent written from it. Yours lists the org's
- * agents, and Add default agents makes every member of the host's cast the org
- * has none for (an org starts with none). Opening one is its profile page
+ * Browse is every agent there is to start from: the host's default agents
+ * (`cast`) and personas (`personas`), and the platform's presets whose tool
+ * calls run on the platform, by name and category. Use makes the org's own
+ * agent from one and opens it; nothing is added any other way, so an org starts
+ * with none. An agent is also made from scratch, from the person signed in
+ * (Clone yourself) or from anyone named. Yours lists the org's agents. Opening one is its profile page
  * (`-/customize/agents/<name>`): its face, part, model, instructions, tools,
  * budget and runs, edited in place, and only what changed is sent. An
  * agent calls only the tools it names, and only those that are on for the org,
@@ -15,11 +17,11 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
  * spend each period, and in one run.
  */
 import { SizableText, XStack, YStack } from '@hanzo/gui';
-import { ArrowLeft, Bot, Users } from '@hanzogui/lucide-icons-2';
+import { ArrowLeft, Upload } from '@hanzogui/lucide-icons-2';
 import { Button, Input, Switch, Textarea } from '@hanzo/ui';
 import { ModelPicker } from '@hanzo/ui/models';
-import { useEffect, useMemo, useState } from 'react';
-import { agents, ALL, create, draft, EMPTY, fromPreset, hire, missing, one, PERIODS, presets, profile, remove, update } from '../api/agents.js';
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { agents, ALL, create, draft, EMPTY, fromPreset, one, PERIODS, person, presets, profile, remove, update, use } from '../api/agents.js';
 import { models } from '../api/models.js';
 import { tools } from '../api/tools.js';
 import { useHost, useTarget } from '../host.js';
@@ -27,58 +29,106 @@ import { path } from '../route.js';
 import { useLoad } from './load.js';
 import { say } from './say.js';
 import { Add, Choice, Confirm, Empty, Failed, Field, Grid, Line, Mark, matches, mono, Part, Sheet, Soft, Tile, useCount, Visitor } from './ui.js';
+/** How many cards Browse draws at a time. */
+const PAGE = 60;
+const ANY = 'All';
+/** Categories as Browse offers them: the default agents' and presets' first, as listed, then the rest by how many each holds. */
+export function kinds(first, rest) {
+    const lead = [...new Set(first.map((c) => c.category))];
+    const count = new Map();
+    for (const c of rest)
+        if (!lead.includes(c.category))
+            count.set(c.category, (count.get(c.category) ?? 0) + 1);
+    return [ANY, ...lead, ...[...count.keys()].sort((a, b) => count.get(b) - count.get(a) || a.localeCompare(b))];
+}
 const money = (m) => `$${(m / 1_000_000).toFixed(m % 10_000 ? 4 : 2).replace(/\.?0+$/, '')}`;
 export function Agents({ view, q, adding, onAdding, onView, onCount }) {
     const host = useHost();
     const t = useTarget();
     const signed = Boolean(host.person);
+    const browsing = view === 'discover';
     const mine = useLoad(signed ? () => agents(t) : null, [], [t, signed]);
-    const offered = useLoad(view === 'discover' ? () => presets(t) : null, [], [t, view]);
+    const offered = useLoad(browsing ? () => presets(t) : null, [], [t, view]);
+    const figures = useLoad(browsing && host.personas ? host.personas : null, [], [view]);
     useCount(mine.value.length, onCount);
-    const [start, setStart] = useState(null);
     const [note, setNote] = useState('');
-    const [hiring, setHiring] = useState(false);
-    const cast = host.cast ?? [];
-    const lacking = missing(cast, mine.value);
-    // The host's cast, made in one press: each member the org has no agent for.
-    const addCast = async () => {
-        setHiring(true);
+    const [kind, setKind] = useState(ANY);
+    const [more, setMore] = useState(PAGE);
+    const [using, setUsing] = useState(null);
+    const [making, setMaking] = useState(null);
+    useEffect(() => setMore(PAGE), [q, kind]);
+    const opened = (a) => host.go(path({ kind: 'agent', name: a.name }));
+    const take = async (c) => {
+        setUsing(c);
         setNote('');
-        const { made, error } = await hire(t, cast, mine.value);
-        setHiring(false);
-        mine.reload();
-        setNote(error ? `${made.length ? `Added ${made.length}. ` : ''}${say(error)}` : `Added ${made.length} default ${made.length === 1 ? 'agent' : 'agents'}`);
-    };
-    const castButton = signed && lacking.length ? (_jsxs(Button, { size: "sm", variant: "outline", disabled: hiring, onPress: () => void addCast(), children: [_jsx(Users, { size: 14 }), " ", hiring ? 'Adding…' : lacking.length === cast.length ? 'Add default agents' : `Add ${lacking.length} default ${lacking.length === 1 ? 'agent' : 'agents'}`] })) : null;
-    const closeNew = () => {
-        setStart(null);
-        onAdding(false);
+        try {
+            opened(await use(t, c, window.location.href));
+        }
+        catch (e) {
+            setNote(say(e));
+        }
+        finally {
+            setUsing(null);
+        }
     };
-    const editor = adding || start ? (_jsx(Editor, { start: start ?? EMPTY, onClose: closeNew, onSaved: (a) => {
-            closeNew();
+    const editor = adding ? (_jsx(Editor, { onClose: () => onAdding(false), onSaved: (a) => {
+            onAdding(false);
             onView('yours');
             mine.reload();
             setNote(`${a.name} is saved`);
         } })) : null;
-    if (view === 'discover') {
-        const names = new Set(mine.value.map((a) => a.name));
-        const shown = offered.value.filter((p) => matches(q, p.id, p.title, p.prompt));
-        return (_jsxs(YStack, { gap: "$3", children: [_jsx(Line, { children: note }), _jsx(Part, { title: "Start from a preset", detail: "A ready agent from Hanzo. You can change it before you save it.", children: offered.error && !offered.value.length ? (_jsx(Failed, { error: offered.error, onRetry: offered.reload })) : offered.loading && !offered.value.length ? (_jsx(Soft, { children: "Loading presets\u2026" })) : !shown.length ? (_jsx(Soft, { children: offered.value.length ? `No preset matches “${q.trim()}”.` : 'There are no presets yet. Start from a blank agent with New agent.' })) : (_jsx(Grid, { label: "Presets", children: shown.map((p) => (_jsx(Tile, { title: p.title || p.id, detail: p.prompt, meta: `Preset ${p.id}`, mark: _jsx(Mark, { name: p.title || p.id, icon: _jsx(Bot, { size: 15 }) }), action: signed ? _jsx(Add, { name: p.title || p.id, label: "Use", added: names.has(p.id), onPress: () => setStart(fromPreset(p)) }) : undefined }, p.id))) })) }), editor] }));
+    if (browsing) {
+        const first = [...(host.cast ?? []), ...offered.value.map(fromPreset)];
+        const all = [...first, ...figures.value];
+        const shown = all.filter((c) => (kind === ANY || c.category === kind) && matches(q, c.title, c.name, c.description, c.category));
+        const failed = figures.error ?? offered.error;
+        return (_jsxs(YStack, { gap: "$3", children: [signed ? (_jsxs(XStack, { gap: "$2", flexWrap: "wrap", children: [_jsx(Button, { size: "sm", variant: "outline", onPress: () => onAdding(true), children: "Start from scratch" }), _jsx(Button, { size: "sm", variant: "outline", onPress: () => setMaking('self'), children: "Clone yourself" }), _jsx(Button, { size: "sm", variant: "outline", onPress: () => setMaking('person'), children: "Create from a person" })] })) : null, _jsx(XStack, { overflowX: "auto", overflowY: "hidden", pb: "$1", children: _jsx(Choice, { label: "Category", value: kind, options: kinds(first, figures.value).map((id) => ({ id, label: id })), onChange: setKind }) }), _jsx(Line, { children: note }), shown.length ? (_jsx(Grid, { label: "Agents to start from", children: shown.slice(0, more).map((c) => (_jsx(Tile, { title: c.title, detail: c.description === c.title || c.description === c.category ? undefined : c.description, meta: c.category, mark: _jsx(Mark, { name: c.title, size: 40, logo: c.avatar }), action: signed ? _jsx(Add, { name: c.title, label: "Use", added: false, busy: using !== null, onPress: () => void take(c) }) : undefined }, `${c.category}/${c.name}/${c.title}`))) })) : figures.loading || offered.loading ? null : (_jsx(Soft, { children: `No agent matches “${q.trim()}”.` })), shown.length > more ? (_jsx(XStack, { children: _jsx(Button, { size: "sm", variant: "ghost", onPress: () => setMore(more + PAGE), children: "More" }) })) : null, failed ? _jsx(Failed, { error: failed, onRetry: figures.error ? figures.reload : offered.reload }) : figures.loading || offered.loading ? _jsx(Soft, { children: "Loading\u2026" }) : null, editor, making ? _jsx(Person, { self: making === 'self', onClose: () => setMaking(null), onMade: opened }) : null] }));
     }
     if (!signed) {
         return _jsx(Visitor, { children: "Sign in to see your agents." });
     }
     const shown = mine.value.filter((a) => matches(q, a.name, a.description, a.model));
-    return (_jsxs(YStack, { gap: "$3", children: [_jsx(Line, { children: note }), mine.error && !mine.value.length ? (_jsx(Failed, { error: mine.error, onRetry: mine.reload })) : mine.loading && !mine.value.length ? (_jsx(Soft, { children: "Loading your agents\u2026" })) : !mine.value.length ? (_jsxs(Empty, { title: "No agents yet", detail: cast.length ? 'Add the default team, start from a preset, or give a new one a model, instructions and tools.' : 'Start from a preset, or give a new one a model, instructions and tools.', children: [castButton, _jsx(Button, { size: "sm", variant: "outline", onPress: () => onView('discover'), children: "Browse presets" }), _jsx(Button, { size: "sm", onPress: () => onAdding(true), children: "New agent" })] })) : !shown.length ? (_jsx(Soft, { children: `No agent of yours matches “${q.trim()}”.` })) : (_jsxs(_Fragment, { children: [castButton ? _jsx(XStack, { children: castButton }) : null, _jsx(Grid, { label: "Your agents", children: shown.map((a) => (_jsx(Tile, { title: a.name, detail: a.description || 'No description.', meta: [a.model, `${a.runs} ${a.runs === 1 ? 'run' : 'runs'}`, reach(a), a.cap ? `${money(a.spent)} of ${money(a.cap)} this ${a.period || 'period'}` : ''].filter(Boolean).join(' · '), mark: _jsx(Face, { agent: a, cast: cast }), onOpen: () => host.go(path({ kind: 'agent', name: a.name })) }, a.id || a.name))) })] })), editor] }));
+    return (_jsxs(YStack, { gap: "$3", children: [_jsx(Line, { children: note }), mine.error && !mine.value.length ? (_jsx(Failed, { error: mine.error, onRetry: mine.reload })) : mine.loading && !mine.value.length ? (_jsx(Soft, { children: "Loading your agents\u2026" })) : !mine.value.length ? (_jsxs(Empty, { title: "No agents yet", detail: "", children: [_jsx(Button, { size: "sm", variant: "outline", onPress: () => onView('discover'), children: "Browse agents" }), _jsx(Button, { size: "sm", onPress: () => onAdding(true), children: "New agent" })] })) : !shown.length ? (_jsx(Soft, { children: `No agent of yours matches “${q.trim()}”.` })) : (_jsx(Grid, { label: "Your agents", children: shown.map((a) => (_jsx(Tile, { title: a.name, detail: a.description || 'No description.', meta: [a.model, `${a.runs} ${a.runs === 1 ? 'run' : 'runs'}`, reach(a), a.cap ? `${money(a.spent)} of ${money(a.cap)} this ${a.period || 'period'}` : ''].filter(Boolean).join(' · '), mark: _jsx(Face, { agent: a, cast: host.cast ?? [] }), onOpen: () => opened(a) }, a.id || a.name))) })), editor] }));
+}
+/** Clone yourself, or anyone named: a name, who they are, and writing of theirs, pasted or uploaded. */
+function Person({ self, onClose, onMade }) {
+    const host = useHost();
+    const t = useTarget();
+    const me = self ? host.person : null;
+    const [name, setName] = useState(me?.name ?? '');
+    const [about, setAbout] = useState('');
+    const [writing, setWriting] = useState('');
+    const [working, setWorking] = useState(false);
+    const [note, setNote] = useState('');
+    const file = useRef(null);
+    const read = async (files) => {
+        const texts = await Promise.all([...(files ?? [])].map((f) => f.text()));
+        setWriting((w) => [w.trim(), ...texts.map((x) => x.trim())].filter(Boolean).join('\n\n'));
+    };
+    const save = async () => {
+        setWorking(true);
+        setNote('');
+        try {
+            onMade(await use(t, person(name, about, writing, me?.avatar), window.location.href));
+        }
+        catch (e) {
+            setNote(say(e));
+            setWorking(false);
+        }
+    };
+    return (_jsxs(Sheet, { title: self ? 'Clone yourself' : 'Create from a person', open: true, onOpenChange: (o) => !o && onClose(), children: [_jsx(Field, { label: "Name", children: _jsx(Input, { value: name, onChangeText: setName, "aria-label": "Name" }) }), _jsx(Field, { label: "Description", children: _jsx(Textarea, { value: about, onChangeText: setAbout, "aria-label": "Description", rows: 3 }) }), _jsx(Field, { label: "Writing", children: _jsx(Textarea, { value: writing, onChangeText: setWriting, "aria-label": "Writing", rows: 6 }) }), _jsxs(XStack, { children: [_jsxs(Button, { size: "sm", variant: "ghost", onPress: () => file.current?.click(), children: [_jsx(Upload, { size: 14 }), " Upload"] }), _jsx("input", { ref: file, type: "file", multiple: true, accept: ".txt,.md,.markdown,.csv,.json,.html,text/*", hidden: true, "aria-label": "Upload writing", onChange: (e) => {
+                            void read(e.currentTarget.files);
+                            e.currentTarget.value = '';
+                        } })] }), _jsx(Line, { children: note }), _jsxs(XStack, { gap: "$2", items: "center", children: [_jsx(XStack, { flex: 1 }), _jsx(Button, { size: "sm", variant: "ghost", onPress: onClose, children: "Cancel" }), _jsx(Button, { size: "sm", disabled: working || !name.trim(), onPress: () => void save(), children: "Create" })] })] }));
 }
 function reach(a) {
     if (a.tools.includes(ALL))
         return 'every tool';
     return a.tools.length === 1 ? '1 tool' : `${a.tools.length} tools`;
 }
-/** An agent's face: the cast member's picture, its emoji, or its initial. */
+/** An agent's face: its picture, the default agent's of its name, its emoji, or its initial. */
 function Face({ agent: a, cast, size = 32 }) {
-    const avatar = cast.find((c) => c.name.toLowerCase() === a.name.toLowerCase())?.avatar;
+    const avatar = a.avatar || cast.find((c) => c.name.toLowerCase() === a.name.toLowerCase())?.avatar;
     return _jsx(Mark, { name: a.name, size: size, logo: avatar, icon: a.emoji ? _jsx(SizableText, { size: size > 40 ? '$8' : '$4', children: a.emoji }) : undefined });
 }
 /** One agent's page: who it is, what it runs on and reads, what it may call and spend, and what it has done. */
@@ -95,12 +145,12 @@ export function Profile({ name }) {
                 }, onDeleted: back })) : null] }));
 }
 /** Write a new agent, or change one; an existing agent is read whole first, for its instructions. */
-function Editor({ agent, start, onClose, onSaved, onDeleted, }) {
+function Editor({ agent, onClose, onSaved, onDeleted, }) {
     const t = useTarget();
     const full = useLoad(agent ? () => one(t, agent.id || agent.name) : null, null, [t, agent?.id]);
     const catalog = useLoad(() => models(t), [], [t]);
     const on = useLoad(() => tools(t, { activated: true }), [], [t]);
-    const [d, setD] = useState(start ?? EMPTY);
+    const [d, setD] = useState(EMPTY);
     const [ready, setReady] = useState(!agent);
     const [working, setWorking] = useState(false);
     const [note, setNote] = useState('');

package/lib/customize/index.js

@@ -29,11 +29,9 @@ const LABEL = {
     plugins: { title: 'Plugins', says: 'Connectors you build in TypeScript.', add: 'Build plugin', find: 'Search plugins', icon: _jsx(Puzzle, { size: 15 }) },
     agents: { title: 'Agents', says: 'Agents with their own model, instructions and budget.', add: 'New agent', find: 'Search agents', icon: _jsx(Bot, { size: 15 }) },
 };
-/** Where a tab opens: an org's own agents (and the cast to add) for Agents; Browse for the rest, what there is to add being the page. */
-const opens = (tab) => (tab === 'agents' ? 'yours' : 'discover');
 export function Customize({ tab, view: first }) {
     const host = useHost();
-    const [view, setView] = useState(first ?? opens(tab));
+    const [view, setView] = useState(first ?? 'discover');
     const [q, setQ] = useState('');
     const [adding, setAdding] = useState(false);
     const [count, setCount] = useState(0);
@@ -41,7 +39,7 @@ export function Customize({ tab, view: first }) {
     const pick = (next) => {
         setQ('');
         setAdding(false);
-        setView(opens(next));
+        setView('discover');
         setCount(0);
         host.go(path({ kind: 'customize', tab: next }));
     };

package/lib/host.d.ts

@@ -107,8 +107,10 @@ export interface Host {
     browser?: Browser;
     /** The host's sidebar lists Settings' sections and Customize's tabs, so the pages draw neither. */
     sections?: boolean;
-    /** The default agents an org may add in one press (Customize › Agents). Absent, none are offered. */
+    /** The default agents Customize › Agents offers to start from. Absent, none. */
     cast?: readonly Cast[];
+    /** Every persona Customize › Agents offers to start from, read when Browse opens. Absent, none. */
+    personas?: () => Promise<readonly Cast[]>;
 }
 export declare function HostProvider({ host, children }: {
     host: Host;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/build",
-  "version": "0.2.79",
+  "version": "0.2.80",
   "type": "module",
   "license": "Apache-2.0 OR MIT",
   "description": "Hanzo Build — say what you want, watch it built, deployed and running. The builder as a component, mounted by the Hanzo app at hanzo.ai.",