@prestack/thread-ui 0.0.1

package/dist/ui/i18n/parse.js

@@ -0,0 +1,249 @@
+export class MessageSyntaxError extends Error {
+    source;
+    position;
+    constructor(message, source, position) {
+        super(`${message} (at ${position} in ${JSON.stringify(source)})`);
+        this.name = 'MessageSyntaxError';
+        this.source = source;
+        this.position = position;
+    }
+}
+const ARG_TYPES = new Set(['number', 'date', 'time', 'money', 'plural', 'selectordinal', 'select']);
+class Parser {
+    #src;
+    #pos = 0;
+    constructor(src) {
+        this.#src = src;
+    }
+    parse() {
+        const nodes = this.#parseBody(false);
+        if (this.#pos < this.#src.length) {
+            throw new MessageSyntaxError('unexpected "}"', this.#src, this.#pos);
+        }
+        return nodes;
+    }
+    #parseBody(inSub) {
+        const nodes = [];
+        let text = '';
+        const flush = () => {
+            if (text !== '') {
+                nodes.push({ kind: 'text', value: text });
+                text = '';
+            }
+        };
+        while (this.#pos < this.#src.length) {
+            const ch = this.#src[this.#pos];
+            if (ch === "'") {
+                const next = this.#src[this.#pos + 1];
+                if (next === "'") {
+                    text += "'";
+                    this.#pos += 2;
+                    continue;
+                }
+                if (next === '{' || next === '}' || next === '#') {
+                    this.#pos += 1;
+                    while (this.#pos < this.#src.length) {
+                        if (this.#src[this.#pos] === "'") {
+                            if (this.#src[this.#pos + 1] === "'") {
+                                text += "'";
+                                this.#pos += 2;
+                                continue;
+                            }
+                            this.#pos += 1;
+                            break;
+                        }
+                        text += this.#src[this.#pos];
+                        this.#pos += 1;
+                    }
+                    continue;
+                }
+                text += "'";
+                this.#pos += 1;
+                continue;
+            }
+            if (ch === '#' && inSub) {
+                flush();
+                nodes.push({ kind: 'pound' });
+                this.#pos += 1;
+                continue;
+            }
+            if (ch === '}') {
+                if (inSub)
+                    break;
+                throw new MessageSyntaxError('unexpected "}"', this.#src, this.#pos);
+            }
+            if (ch === '{') {
+                flush();
+                nodes.push(this.#parseArg());
+                continue;
+            }
+            text += ch;
+            this.#pos += 1;
+        }
+        flush();
+        return nodes;
+    }
+    #parseArg() {
+        const start = this.#pos;
+        this.#pos += 1;
+        this.#skipWs();
+        const name = this.#readIdent();
+        if (name === '')
+            throw new MessageSyntaxError('expected an argument name', this.#src, start);
+        this.#skipWs();
+        if (this.#peek() === '}') {
+            this.#pos += 1;
+            return { kind: 'arg', name };
+        }
+        if (this.#peek() !== ',') {
+            throw new MessageSyntaxError(`expected "," or "}" after "${name}"`, this.#src, this.#pos);
+        }
+        this.#pos += 1;
+        this.#skipWs();
+        const type = this.#readIdent();
+        if (!ARG_TYPES.has(type)) {
+            throw new MessageSyntaxError(`unknown argument type "${type}"`, this.#src, this.#pos);
+        }
+        this.#skipWs();
+        if (type === 'plural' || type === 'selectordinal') {
+            return this.#parsePlural(name, type === 'selectordinal');
+        }
+        if (type === 'select') {
+            return this.#parseSelect(name);
+        }
+        let style;
+        if (this.#peek() === ',') {
+            this.#pos += 1;
+            this.#skipWs();
+            style = this.#readUntil('}').trim();
+        }
+        this.#expect('}');
+        if (type === 'money') {
+            if (style !== undefined && style !== '') {
+                throw new MessageSyntaxError('money takes no style — the currency travels with the value', this.#src, this.#pos);
+            }
+            return { kind: 'money', name };
+        }
+        if (type === 'number')
+            return style ? { kind: 'number', name, style } : { kind: 'number', name };
+        if (type === 'date')
+            return style ? { kind: 'date', name, style } : { kind: 'date', name };
+        return style ? { kind: 'time', name, style } : { kind: 'time', name };
+    }
+    #parsePlural(name, ordinal) {
+        if (this.#peek() !== ',') {
+            throw new MessageSyntaxError('expected "," before plural options', this.#src, this.#pos);
+        }
+        this.#pos += 1;
+        this.#skipWs();
+        let offset = 0;
+        if (this.#src.startsWith('offset:', this.#pos)) {
+            this.#pos += 'offset:'.length;
+            this.#skipWs();
+            const digits = this.#readWhile((c) => c >= '0' && c <= '9');
+            if (digits === '')
+                throw new MessageSyntaxError('expected a number after "offset:"', this.#src, this.#pos);
+            offset = Number(digits);
+            this.#skipWs();
+        }
+        const options = this.#parseOptions();
+        if (!options.has('other')) {
+            throw new MessageSyntaxError(`plural "${name}" is missing the required "other" branch`, this.#src, this.#pos);
+        }
+        return { kind: 'plural', name, ordinal, offset, options };
+    }
+    #parseSelect(name) {
+        if (this.#peek() !== ',') {
+            throw new MessageSyntaxError('expected "," before select options', this.#src, this.#pos);
+        }
+        this.#pos += 1;
+        this.#skipWs();
+        const options = this.#parseOptions();
+        if (!options.has('other')) {
+            throw new MessageSyntaxError(`select "${name}" is missing the required "other" branch`, this.#src, this.#pos);
+        }
+        return { kind: 'select', name, options };
+    }
+    #parseOptions() {
+        const options = new Map();
+        while (this.#pos < this.#src.length && this.#peek() !== '}') {
+            this.#skipWs();
+            if (this.#peek() === '}')
+                break;
+            const key = this.#readWhile((c) => !/\s/.test(c) && c !== '{');
+            if (key === '')
+                throw new MessageSyntaxError('expected an option key', this.#src, this.#pos);
+            if (options.has(key)) {
+                throw new MessageSyntaxError(`duplicate option "${key}"`, this.#src, this.#pos);
+            }
+            this.#skipWs();
+            this.#expect('{');
+            options.set(key, this.#parseBody(true));
+            this.#expect('}');
+            this.#skipWs();
+        }
+        this.#expect('}');
+        return options;
+    }
+    #peek() {
+        return this.#src[this.#pos];
+    }
+    #expect(ch) {
+        if (this.#src[this.#pos] !== ch) {
+            throw new MessageSyntaxError(`expected "${ch}"`, this.#src, this.#pos);
+        }
+        this.#pos += 1;
+    }
+    #skipWs() {
+        while (this.#pos < this.#src.length && /\s/.test(this.#src[this.#pos] ?? ''))
+            this.#pos += 1;
+    }
+    #readWhile(pred) {
+        let out = '';
+        while (this.#pos < this.#src.length) {
+            const c = this.#src[this.#pos];
+            if (c === undefined || !pred(c))
+                break;
+            out += c;
+            this.#pos += 1;
+        }
+        return out;
+    }
+    #readIdent() {
+        return this.#readWhile((c) => /[A-Za-z0-9_]/.test(c));
+    }
+    #readUntil(stop) {
+        return this.#readWhile((c) => c !== stop);
+    }
+}
+const cache = new Map();
+export function parseMessage(src) {
+    const hit = cache.get(src);
+    if (hit)
+        return hit;
+    const parsed = new Parser(src).parse();
+    cache.set(src, parsed);
+    return parsed;
+}
+export function messageArgs(src) {
+    const names = new Set();
+    const pass = (nodes) => {
+        for (const node of nodes) {
+            switch (node.kind) {
+                case 'text':
+                case 'pound':
+                    break;
+                case 'plural':
+                case 'select':
+                    names.add(node.name);
+                    for (const body of node.options.values())
+                        pass(body);
+                    break;
+                default:
+                    names.add(node.name);
+            }
+        }
+    };
+    pass(parseMessage(src));
+    return names;
+}

package/dist/ui/i18n/translator.d.ts

@@ -0,0 +1,10 @@
+import { type CatalogShape, type Locale, type Translator } from './types.ts';
+export declare class UnknownMessageKeyError extends Error {
+    readonly key: string;
+    constructor(key: string, locale: Locale);
+}
+export interface TranslatorOptions {
+    readonly locale: Locale;
+    readonly timeZone?: string;
+}
+export declare function createTranslator<C extends CatalogShape>(catalog: C, options: TranslatorOptions): Translator<C>;

package/dist/ui/i18n/translator.js

@@ -0,0 +1,22 @@
+import { formatMessage } from "./format.js";
+import { entryText } from "./types.js";
+export class UnknownMessageKeyError extends Error {
+    key;
+    constructor(key, locale) {
+        super(`no message "${key}" in locale "${locale}"`);
+        this.name = 'UnknownMessageKeyError';
+        this.key = key;
+    }
+}
+export function createTranslator(catalog, options) {
+    const translate = (key, params) => {
+        const entry = catalog[key];
+        if (entry === undefined)
+            throw new UnknownMessageKeyError(key, options.locale);
+        return formatMessage(entryText(entry), params ?? {}, {
+            locale: options.locale,
+            timeZone: options.timeZone,
+        });
+    };
+    return translate;
+}

package/dist/ui/i18n/types.d.ts

@@ -0,0 +1,33 @@
+import type { Money } from './parse.ts';
+export type { Money } from './parse.ts';
+export type Locale = string;
+type Trim<S extends string> = S extends ` ${infer R}` ? Trim<R> : S extends `${infer R} ` ? Trim<R> : S;
+type HasSubMessages<S extends string> = S extends `${string},plural${string}` ? true : S extends `${string}, plural${string}` ? true : S extends `${string},select${string}` ? true : S extends `${string}, select${string}` ? true : false;
+type ArgName<Inner extends string> = Inner extends `${infer N},${string}` ? Trim<N> : Trim<Inner>;
+type ArgValue<Inner extends string> = Inner extends `${string},${infer Rest}` ? Trim<Rest> extends `number${string}` ? number : Trim<Rest> extends `date${string}` ? Date | number : Trim<Rest> extends `time${string}` ? Date | number : Trim<Rest> extends `money${string}` ? Money : string | number : string | number;
+type SimpleParams<S extends string> = S extends `${string}{${infer Inner}}${infer Rest}` ? {
+    [K in ArgName<Inner>]: ArgValue<Inner>;
+} & SimpleParams<Rest> : unknown;
+type Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+export type MessageParams<S extends string> = Prettify<SimpleParams<S>>;
+declare const PARAMS: unique symbol;
+export interface DeclaredMessage<P extends Record<string, unknown>> {
+    readonly text: string;
+    readonly [PARAMS]?: P;
+}
+export declare function msg<P extends Record<string, unknown>>(text: string): DeclaredMessage<P>;
+export type MessageEntry = string | DeclaredMessage<Record<string, unknown>>;
+export interface RequiresExplicitParams {
+    readonly __error: 'plural/select messages must declare params: use msg<{ ... }>(text)';
+}
+export type ValidEntry<E> = E extends string ? HasSubMessages<E> extends true ? RequiresExplicitParams : E : E;
+export type CatalogShape = Readonly<Record<string, MessageEntry>>;
+export type ParamsOf<E> = E extends DeclaredMessage<infer P> ? P : E extends string ? MessageParams<E> : never;
+type HasNoKeys<T> = [keyof T] extends [never] ? true : false;
+export type Translator<C extends CatalogShape> = <K extends keyof C & string>(key: K, ...args: HasNoKeys<ParamsOf<C[K]>> extends true ? [params?: Record<string, never>] : [params: ParamsOf<C[K]>]) => string;
+export declare function entryText(entry: MessageEntry): string;
+export declare function defineCatalog<const C extends Record<string, MessageEntry>>(catalog: {
+    [K in keyof C]: ValidEntry<C[K]>;
+}): C;

package/dist/ui/i18n/types.js

@@ -0,0 +1,9 @@
+export function msg(text) {
+    return { text };
+}
+export function entryText(entry) {
+    return typeof entry === 'string' ? entry : entry.text;
+}
+export function defineCatalog(catalog) {
+    return catalog;
+}

package/dist/ui/icons.d.ts

@@ -0,0 +1,67 @@
+import type { Threaded } from '@prestack/thread/core/thread';
+export interface IconSet {
+    readonly name: string;
+    readonly module: string;
+    readonly size: number;
+    readonly nativeStroke?: number;
+    readonly viewBox: number;
+}
+export declare const ICON_TARGET: {
+    readonly size: 24;
+    readonly normalizedStroke: 1.75;
+};
+export declare const DEFAULT_ICON = "md";
+export declare function sizeRows(rows: readonly {
+    readonly id: string;
+    readonly is?: string;
+}[]): readonly {
+    readonly id: string;
+    readonly is: string;
+}[];
+export declare function sizeNamed(name: string): string;
+export declare function strokeFor(set: {
+    readonly viewBox: number;
+    readonly nativeStroke?: number;
+}, target?: number): number | undefined;
+export declare const BRAND_MODULE = "simple-icons";
+export declare function defineIconSet(set: IconSet): void;
+export declare function defineIcon(semantic: string, names: Readonly<Record<string, string>>): void;
+export declare function iconSets(): readonly IconSet[];
+export declare function iconSet(name: string): IconSet | undefined;
+export declare function iconNames(): readonly string[];
+export declare function iconIn(set: string, semantic: string): string | undefined;
+export declare function brandExport(brand: string): string;
+type Row = Omit<Threaded, 'at'> & {
+    readonly section?: string;
+    readonly is?: string;
+    readonly sets?: Readonly<Record<string, string>>;
+};
+export declare const SET_ROW = "library";
+export declare const SIZE_PREFIX = "icon-";
+export declare const holds: readonly Row[];
+export declare const ICONS: {
+    id: string;
+    at: string;
+    describes: string;
+    version: number;
+    cites: {
+        on: string;
+        said: string;
+    }[];
+    holds: readonly Row[];
+};
+export declare function drawnAs(set: string, semantic: string, by: string): string;
+export declare function setNamed(name: string): IconSet;
+export type IconComponent = (props: {
+    readonly size?: number;
+    readonly strokeWidth?: number;
+    readonly className?: string;
+    readonly 'aria-hidden'?: boolean;
+    readonly 'aria-label'?: string;
+    readonly role?: string;
+}) => unknown;
+export declare function installIcons(set: IconSet, drawn: Readonly<Record<string, IconComponent>>, sizes?: Readonly<Record<string, string>>): void;
+export declare function installedSet(): IconSet | undefined;
+export declare function iconSize(name?: string): number;
+export declare function drawnFor(semantic: string): IconComponent;
+export {};

package/dist/ui/icons.js

@@ -0,0 +1,249 @@
+const SETS = {
+    lucide: { name: 'lucide', module: 'lucide-react', size: 24, nativeStroke: 2, viewBox: 24 },
+    phosphor: { name: 'phosphor', module: '@phosphor-icons/react', size: 24, nativeStroke: 1.5, viewBox: 256 },
+    tabler: { name: 'tabler', module: '@tabler/icons-react', size: 24, nativeStroke: 2, viewBox: 24 },
+    heroicons: { name: 'heroicons', module: '@heroicons/react/24/outline', size: 24, nativeStroke: 1.5, viewBox: 24 },
+    feather: { name: 'feather', module: 'react-icons/fi', size: 24, nativeStroke: 2, viewBox: 24 },
+    remix: { name: 'remix', module: 'react-icons/ri', size: 24, viewBox: 24 },
+    bootstrap: { name: 'bootstrap', module: 'react-icons/bs', size: 16, viewBox: 16 },
+    material: { name: 'material', module: 'react-icons/md', size: 24, viewBox: 24 },
+    ionicons: { name: 'ionicons', module: 'react-icons/io5', size: 24, viewBox: 512 },
+};
+export const ICON_TARGET = { size: 24, normalizedStroke: 1.75 };
+export const DEFAULT_ICON = 'md';
+export function sizeRows(rows) {
+    return rows
+        .filter((row) => row.id !== SET_ROW && typeof row.is === 'string')
+        .map((row) => ({ id: row.id, is: row.is }));
+}
+export function sizeNamed(name) {
+    return name.startsWith(SIZE_PREFIX) ? name : `${SIZE_PREFIX}${name}`;
+}
+export function strokeFor(set, target = ICON_TARGET.normalizedStroke) {
+    if (set.nativeStroke === undefined)
+        return undefined;
+    return Number(((target * set.viewBox) / ICON_TARGET.size).toFixed(3));
+}
+export const BRAND_MODULE = 'simple-icons';
+const DRAWN = {
+    bell: { lucide: 'Bell' },
+    star: { lucide: 'Star' },
+    heart: { lucide: 'Heart' },
+    share: { lucide: 'Share2' },
+    bookmark: { lucide: 'Bookmark' },
+    send: { lucide: 'Send' },
+    attach: { lucide: 'Paperclip' },
+    play: { lucide: 'Play' },
+    pause: { lucide: 'Pause' },
+    chevronLeft: { lucide: 'ChevronLeft' },
+    chevronUp: { lucide: 'ChevronUp' },
+    arrowUp: { lucide: 'ArrowUp' },
+    arrowDown: { lucide: 'ArrowDown' },
+    list: { lucide: 'List' },
+    signOut: { lucide: 'LogOut' },
+    signIn: { lucide: 'LogIn' },
+    secure: { lucide: 'ShieldCheck' },
+    card: { lucide: 'CreditCard' },
+    place: { lucide: 'MapPin' },
+    phone: { lucide: 'Phone' },
+    globe: { lucide: 'Globe' },
+    unlock: { lucide: 'Unlock' },
+    warning: { lucide: 'CircleAlert' },
+    success: { lucide: 'CircleCheck' },
+    failure: { lucide: 'CircleX' },
+    help: { lucide: 'CircleHelp' },
+    save: { lucide: 'Save' },
+    undo: { lucide: 'Undo2' },
+    redo: { lucide: 'Redo2' },
+    zoomIn: { lucide: 'ZoomIn' },
+    zoomOut: { lucide: 'ZoomOut' },
+    folder: { lucide: 'Folder' },
+    document: { lucide: 'FileText' },
+    people: { lucide: 'Users' },
+    addPerson: { lucide: 'UserPlus' },
+    tag: { lucide: 'Tag' },
+    flag: { lucide: 'Flag' },
+    archive: { lucide: 'Archive' },
+    inbox: { lucide: 'Inbox' },
+    light: { lucide: 'Sun' },
+    dark: { lucide: 'Moon' },
+    sound: { lucide: 'Volume2' },
+    mute: { lucide: 'VolumeX' },
+    microphone: { lucide: 'Mic' },
+    camera: { lucide: 'Camera' },
+    close: { lucide: 'X', phosphor: 'X', tabler: 'IconX', heroicons: 'XMarkIcon', feather: 'FiX', remix: 'RiCloseLine', bootstrap: 'BsX', material: 'MdClose', ionicons: 'IoClose' },
+    search: { lucide: 'Search', phosphor: 'MagnifyingGlass', tabler: 'IconSearch', heroicons: 'MagnifyingGlassIcon', feather: 'FiSearch', remix: 'RiSearchLine', bootstrap: 'BsSearch', material: 'MdSearch', ionicons: 'IoSearch' },
+    check: { lucide: 'Check', phosphor: 'Check', tabler: 'IconCheck', heroicons: 'CheckIcon', feather: 'FiCheck', remix: 'RiCheckLine', bootstrap: 'BsCheck', material: 'MdCheck', ionicons: 'IoCheckmark' },
+    chevronDown: { lucide: 'ChevronDown', phosphor: 'CaretDown', tabler: 'IconChevronDown', heroicons: 'ChevronDownIcon', feather: 'FiChevronDown', remix: 'RiArrowDownSLine', bootstrap: 'BsChevronDown', material: 'MdKeyboardArrowDown', ionicons: 'IoChevronDown' },
+    chevronRight: { lucide: 'ChevronRight', phosphor: 'CaretRight', tabler: 'IconChevronRight', heroicons: 'ChevronRightIcon', feather: 'FiChevronRight', remix: 'RiArrowRightSLine', bootstrap: 'BsChevronRight', material: 'MdKeyboardArrowRight', ionicons: 'IoChevronForward' },
+    plus: { lucide: 'Plus', phosphor: 'Plus', tabler: 'IconPlus', heroicons: 'PlusIcon', feather: 'FiPlus', remix: 'RiAddLine', bootstrap: 'BsPlus', material: 'MdAdd', ionicons: 'IoAdd' },
+    minus: { lucide: 'Minus', phosphor: 'Minus', tabler: 'IconMinus', heroicons: 'MinusIcon', feather: 'FiMinus', remix: 'RiSubtractLine', bootstrap: 'BsDash', material: 'MdRemove', ionicons: 'IoRemove' },
+    menu: { lucide: 'Menu', phosphor: 'List', tabler: 'IconMenu2', heroicons: 'Bars3Icon', feather: 'FiMenu', remix: 'RiMenuLine', bootstrap: 'BsList', material: 'MdMenu', ionicons: 'IoMenu' },
+    more: { lucide: 'MoreHorizontal', phosphor: 'DotsThree', tabler: 'IconDots', heroicons: 'EllipsisHorizontalIcon', feather: 'FiMoreHorizontal', remix: 'RiMoreLine', bootstrap: 'BsThreeDots', material: 'MdMoreHoriz', ionicons: 'IoEllipsisHorizontal' },
+    user: { lucide: 'User', phosphor: 'User', tabler: 'IconUser', heroicons: 'UserIcon', feather: 'FiUser', remix: 'RiUserLine', bootstrap: 'BsPerson', material: 'MdPerson', ionicons: 'IoPerson' },
+    settings: { lucide: 'Settings', phosphor: 'Gear', tabler: 'IconSettings', heroicons: 'Cog6ToothIcon', feather: 'FiSettings', remix: 'RiSettingsLine', bootstrap: 'BsGear', material: 'MdSettings', ionicons: 'IoSettings' },
+    trash: { lucide: 'Trash2', phosphor: 'Trash', tabler: 'IconTrash', heroicons: 'TrashIcon', feather: 'FiTrash2', remix: 'RiDeleteBinLine', bootstrap: 'BsTrash', material: 'MdDelete', ionicons: 'IoTrash' },
+    edit: { lucide: 'Pencil', phosphor: 'PencilSimple', tabler: 'IconPencil', heroicons: 'PencilIcon', feather: 'FiEdit2', remix: 'RiPencilLine', bootstrap: 'BsPencil', material: 'MdEdit', ionicons: 'IoPencil' },
+    calendar: { lucide: 'Calendar', phosphor: 'Calendar', tabler: 'IconCalendar', heroicons: 'CalendarIcon', feather: 'FiCalendar', remix: 'RiCalendarLine', bootstrap: 'BsCalendar', material: 'MdCalendarToday', ionicons: 'IoCalendar' },
+    clock: { lucide: 'Clock', phosphor: 'Clock', tabler: 'IconClock', heroicons: 'ClockIcon', feather: 'FiClock', remix: 'RiTimeLine', bootstrap: 'BsClock', material: 'MdAccessTime', ionicons: 'IoTime' },
+    eye: { lucide: 'Eye', phosphor: 'Eye', tabler: 'IconEye', heroicons: 'EyeIcon', feather: 'FiEye', remix: 'RiEyeLine', bootstrap: 'BsEye', material: 'MdVisibility', ionicons: 'IoEye' },
+    eyeOff: { lucide: 'EyeOff', phosphor: 'EyeSlash', tabler: 'IconEyeOff', heroicons: 'EyeSlashIcon', feather: 'FiEyeOff', remix: 'RiEyeOffLine', bootstrap: 'BsEyeSlash', material: 'MdVisibilityOff', ionicons: 'IoEyeOff' },
+    alert: { lucide: 'TriangleAlert', phosphor: 'Warning', tabler: 'IconAlertTriangle', heroicons: 'ExclamationTriangleIcon', feather: 'FiAlertTriangle', remix: 'RiErrorWarningLine', bootstrap: 'BsExclamationTriangle', material: 'MdWarning', ionicons: 'IoWarning' },
+    info: { lucide: 'Info', phosphor: 'Info', tabler: 'IconInfoCircle', heroicons: 'InformationCircleIcon', feather: 'FiInfo', remix: 'RiInformationLine', bootstrap: 'BsInfoCircle', material: 'MdInfo', ionicons: 'IoInformationCircle' },
+    externalLink: { lucide: 'ExternalLink', phosphor: 'ArrowSquareOut', tabler: 'IconExternalLink', heroicons: 'ArrowTopRightOnSquareIcon', feather: 'FiExternalLink', remix: 'RiExternalLinkLine', bootstrap: 'BsBoxArrowUpRight', material: 'MdOpenInNew', ionicons: 'IoOpenOutline' },
+    copy: { lucide: 'Copy', phosphor: 'Copy', tabler: 'IconCopy', heroicons: 'DocumentDuplicateIcon', feather: 'FiCopy', remix: 'RiFileCopyLine', bootstrap: 'BsClipboard', material: 'MdContentCopy', ionicons: 'IoCopy' },
+    download: { lucide: 'Download', phosphor: 'DownloadSimple', tabler: 'IconDownload', heroicons: 'ArrowDownTrayIcon', feather: 'FiDownload', remix: 'RiDownloadLine', bootstrap: 'BsDownload', material: 'MdDownload', ionicons: 'IoDownload' },
+    upload: { lucide: 'Upload', phosphor: 'UploadSimple', tabler: 'IconUpload', heroicons: 'ArrowUpTrayIcon', feather: 'FiUpload', remix: 'RiUploadLine', bootstrap: 'BsUpload', material: 'MdUpload', ionicons: 'IoCloudUpload' },
+    filter: { lucide: 'Filter', phosphor: 'Funnel', tabler: 'IconFilter', heroicons: 'FunnelIcon', feather: 'FiFilter', remix: 'RiFilterLine', bootstrap: 'BsFunnel', material: 'MdFilterList', ionicons: 'IoFilter' },
+    home: { lucide: 'House', phosphor: 'House', tabler: 'IconHome', heroicons: 'HomeIcon', feather: 'FiHome', remix: 'RiHomeLine', bootstrap: 'BsHouse', material: 'MdHome', ionicons: 'IoHome' },
+    mail: { lucide: 'Mail', phosphor: 'Envelope', tabler: 'IconMail', heroicons: 'EnvelopeIcon', feather: 'FiMail', remix: 'RiMailLine', bootstrap: 'BsEnvelope', material: 'MdMail', ionicons: 'IoMail' },
+    lock: { lucide: 'Lock', phosphor: 'Lock', tabler: 'IconLock', heroicons: 'LockClosedIcon', feather: 'FiLock', remix: 'RiLockLine', bootstrap: 'BsLock', material: 'MdLock', ionicons: 'IoLockClosed' },
+    refresh: { lucide: 'RefreshCw', phosphor: 'ArrowsClockwise', tabler: 'IconRefresh', heroicons: 'ArrowPathIcon', feather: 'FiRefreshCw', remix: 'RiRefreshLine', bootstrap: 'BsArrowRepeat', material: 'MdRefresh', ionicons: 'IoRefresh' },
+    arrowLeft: { lucide: 'ArrowLeft', phosphor: 'ArrowLeft', tabler: 'IconArrowLeft', heroicons: 'ArrowLeftIcon', feather: 'FiArrowLeft', remix: 'RiArrowLeftLine', bootstrap: 'BsArrowLeft', material: 'MdArrowBack', ionicons: 'IoArrowBack' },
+    arrowRight: { lucide: 'ArrowRight', phosphor: 'ArrowRight', tabler: 'IconArrowRight', heroicons: 'ArrowRightIcon', feather: 'FiArrowRight', remix: 'RiArrowRightLine', bootstrap: 'BsArrowRight', material: 'MdArrowForward', ionicons: 'IoArrowForward' },
+};
+const REGISTRY = new Map(Object.entries(DRAWN));
+const SET_REGISTRY = new Map(Object.entries(SETS));
+export function defineIconSet(set) {
+    if (SET_REGISTRY.has(set.name))
+        throw new Error(`icon set "${set.name}" is already registered`);
+    SET_REGISTRY.set(set.name, set);
+}
+export function defineIcon(semantic, names) {
+    REGISTRY.set(semantic, { ...REGISTRY.get(semantic), ...names });
+}
+export function iconSets() {
+    return [...SET_REGISTRY.values()].sort((a, b) => (a.name < b.name ? -1 : a.name > b.name ? 1 : 0));
+}
+export function iconSet(name) {
+    return SET_REGISTRY.get(name);
+}
+export function iconNames() {
+    return [...REGISTRY.keys()].sort();
+}
+export function iconIn(set, semantic) {
+    return REGISTRY.get(semantic)?.[set];
+}
+export function brandExport(brand) {
+    return `si${brand.charAt(0).toUpperCase()}${brand.slice(1)}`;
+}
+const GROUPED = {
+    navigation: ['chevronUp', 'chevronDown', 'chevronLeft', 'chevronRight', 'arrowUp', 'arrowDown', 'arrowLeft', 'arrowRight', 'home', 'menu', 'more', 'externalLink', 'list'],
+    action: ['close', 'check', 'plus', 'minus', 'search', 'filter', 'edit', 'trash', 'save', 'undo', 'redo', 'copy', 'download', 'upload', 'share', 'send', 'attach', 'refresh', 'archive', 'zoomIn', 'zoomOut'],
+    status: ['alert', 'info', 'warning', 'success', 'failure', 'help', 'bell', 'flag', 'tag'],
+    account: ['user', 'people', 'addPerson', 'signIn', 'signOut', 'settings', 'lock', 'unlock', 'secure', 'eye', 'eyeOff'],
+    content: ['document', 'folder', 'inbox', 'mail', 'calendar', 'clock', 'bookmark', 'star', 'heart', 'card', 'place', 'phone', 'globe'],
+    media: ['play', 'pause', 'sound', 'mute', 'microphone', 'camera', 'light', 'dark'],
+};
+const sectionOf = (id) => {
+    for (const [name, held] of Object.entries(GROUPED))
+        if (held.includes(id))
+            return name;
+    return 'other';
+};
+export const SET_ROW = 'library';
+export const SIZE_PREFIX = 'icon-';
+export const holds = [
+    {
+        id: SET_ROW,
+        section: 'the library',
+        is: 'lucide',
+        describes: 'Which library every icon is drawn from. One name, because a set answers for the whole app — swapping it redraws every icon at once, and an icon a set does not carry is refused rather than quietly missing.',
+        version: 1,
+    },
+    {
+        id: `${SIZE_PREFIX}sm`,
+        section: 'size',
+        is: '16px',
+        describes: 'A symbol drawn inside a line of text, at the size that sits on the same baseline as the words around it.',
+        version: 1,
+    },
+    {
+        id: `${SIZE_PREFIX}md`,
+        section: 'size',
+        is: '24px',
+        describes: 'A symbol beside wording, at the size most controls use. What anything asking for an icon is drawn at unless it says otherwise.',
+        version: 1,
+    },
+    {
+        id: `${SIZE_PREFIX}lg`,
+        section: 'size',
+        is: '32px',
+        describes: 'A symbol standing on its own, where the drawing is the content rather than a marker beside it.',
+        version: 1,
+    },
+    ...Object.keys(DRAWN)
+        .sort((one, two) => {
+        const group = sectionOf(one) < sectionOf(two) ? -1 : sectionOf(one) > sectionOf(two) ? 1 : 0;
+        return group !== 0 ? group : one < two ? -1 : one > two ? 1 : 0;
+    })
+        .map((semantic) => ({
+        id: semantic,
+        section: sectionOf(semantic),
+        sets: DRAWN[semantic] ?? {},
+        describes: `The \`${semantic}\` icon, and what it is called in each library — so wording asks for the meaning and the set decides the drawing.`,
+        version: 1,
+    })),
+];
+export const ICONS = {
+    id: 'icon',
+    at: 'thread/ui/icons.ts',
+    describes: 'Every icon an app may draw and which library it is drawn from. A row is a meaning — close, search, the chevron that opens a thing — and holds what that meaning is called in each library, so an element asks for the meaning and never for a library’s own name for it. One row says which library answers, and changing it redraws the whole app. An icon nothing declares is refused rather than rendered as a gap, and an app adds its own rows to this same list.',
+    version: 1,
+    cites: [
+        {
+            on: '2026-08-28',
+            said: 'Same for icons. We define icons available in icons.ts AND we make UI read from there and icons.ts pick what icon from what library.',
+        },
+    ],
+    holds,
+};
+export function drawnAs(set, semantic, by) {
+    const held = REGISTRY.get(semantic);
+    if (held === undefined) {
+        const has = [...REGISTRY.keys()].sort().map((one) => `\`${one}\``);
+        throw new Error(`\`${by}\` asks for the \`${semantic}\` icon, and no row declares one by that name. ` +
+            `The declared icons are ${has.join(', ')}. Add a row for it, or name one that exists.`);
+    }
+    const drawn = held[set];
+    if (drawn !== undefined)
+        return drawn;
+    const has = Object.keys(held).sort().map((one) => `\`${one}\``);
+    throw new Error(`\`${by}\` asks for the \`${semantic}\` icon and the app draws from \`${set}\`, which does not carry it. ` +
+        `It is carried by ${has.join(', ')}. Add \`${set}\` to that row, or draw from a library that has it.`);
+}
+export function setNamed(name) {
+    const found = SET_REGISTRY.get(name);
+    if (found !== undefined)
+        return found;
+    const has = [...SET_REGISTRY.keys()].sort().map((one) => `\`${one}\``);
+    throw new Error(`\`${name}\` is named as the icon library, and no set by that name is registered. ` +
+        `The registered libraries are ${has.join(', ')}.`);
+}
+let installed;
+export function installIcons(set, drawn, sizes) {
+    installed = { set, drawn, ...(sizes === undefined ? {} : { sizes }) };
+}
+export function installedSet() {
+    return installed?.set;
+}
+export function iconSize(name = DEFAULT_ICON) {
+    const held = installed?.sizes?.[sizeNamed(name)];
+    if (held === undefined)
+        return ICON_TARGET.size;
+    const measured = Number.parseFloat(held);
+    return Number.isFinite(measured) ? measured : ICON_TARGET.size;
+}
+const NOT_INSTALLED = 'No icons are installed. The library an app draws from and the symbols it draws are generated ' +
+    'from the icon rows — run `thread icons` and import what it writes, beside the stylesheet. ' +
+    'Without it every icon renders as an empty box, which looks like a missing glyph and is a wiring gap.';
+export function drawnFor(semantic) {
+    if (installed === undefined)
+        throw new Error(NOT_INSTALLED);
+    const component = installed.drawn[semantic];
+    if (component !== undefined)
+        return component;
+    const has = Object.keys(installed.drawn).sort().map((one) => `\`${one}\``);
+    throw new Error(`\`${semantic}\` is asked for as an icon, and no row declares one by that name. ` +
+        `The declared icons are ${has.join(', ')}. Add a row for it, or name one that exists.`);
+}