@visuno/angular 0.0.0-stage → 0.1.0

package/terminal-stream/terminal-stream.component.d.ts

@@ -0,0 +1,110 @@
+import { AfterViewInit, EventEmitter, OnDestroy } from '@angular/core';
+import * as i0 from "@angular/core";
+/** ok is green, bad is red, muted is grey. */
+export type TerminalTone = 'ok' | 'bad' | 'muted';
+/** A line of output, or `{ text, tone }` to colour it. */
+export type TerminalLine = string | {
+    text: string;
+    tone?: TerminalTone;
+};
+/** running shows a spinner; ok a check; failed its exit code in red; stopped a Stopped tag. */
+export type TerminalCommandStatus = 'running' | 'ok' | 'failed' | 'stopped';
+/** A shell command the agent ran, with its streamed output. */
+export interface TerminalCommand {
+    kind?: 'command';
+    /** Like "npm run build". */
+    command: string;
+    /** What it printed so far. Longer than `tail` + 1 lines, all but the last `tail` fold. */
+    output?: TerminalLine[];
+    status: TerminalCommandStatus;
+    /** Shown when it failed, as "Exit 1". */
+    exitCode?: number;
+    /** How long it has taken, like "6.1 s". */
+    duration?: string;
+}
+/** A line from the agent between commands, like what went wrong and what it will do about it. */
+export interface TerminalNote {
+    kind: 'note';
+    text: string;
+}
+/** A file the agent edits between commands. */
+export interface TerminalEdit {
+    kind: 'edit';
+    file: string;
+    /** Lines added and removed, shown once it is done. */
+    added?: number;
+    removed?: number;
+    /** The changed lines, each starting with "-" (removed, red) or "+" (added, green). */
+    diff?: string[];
+    status?: 'running' | 'done' | 'stopped';
+}
+export type TerminalEntry = TerminalCommand | TerminalNote | TerminalEdit;
+export type TerminalStatus = 'running' | 'passed' | 'failed' | 'stopped';
+export interface TerminalLabels {
+    running?: string;
+    passed?: string;
+    failed?: string;
+    stopped?: string;
+    stop?: string;
+    copy?: string;
+    copied?: string;
+    more?: (n: number) => string;
+    fewer?: string;
+    edit?: string;
+}
+export declare class TerminalStreamComponent implements AfterViewInit, OnDestroy {
+    /** The working directory, shown in the header, like "~/acme/web". */
+    cwd: string;
+    /** Commands, notes and edits, oldest first. */
+    entries: TerminalEntry[];
+    /** The run as a whole. Left out, it is derived from the entries. */
+    status?: TerminalStatus;
+    /** How long the run has taken, like "0:18". Shown beside Running and in the summary. */
+    elapsed?: string;
+    /** The line at the foot once the run is over; false hides it. */
+    summary?: string | false;
+    /** How many lines a folded output keeps showing. */
+    tail: number;
+    /** Whether the output has been copied (shows the Copied tooltip/check). */
+    copied: boolean;
+    /** Overrides for the labels. */
+    labels: TerminalLabels;
+    className?: string;
+    /** Emitted by the Stop button while the run is going. */
+    stop: EventEmitter<void>;
+    /** Emitted with the whole run as text when it is copied. */
+    copy: EventEmitter<string>;
+    private bodyRef?;
+    /** Which folded commands (by entry index) are open. */
+    readonly open: Set<number>;
+    private pinned;
+    private mo?;
+    private ro?;
+    get L(): Required<TerminalLabels>;
+    get hasStop(): boolean;
+    private get commands();
+    get state(): TerminalStatus;
+    get running(): boolean;
+    get stateLabel(): string;
+    get foot(): string | false;
+    kindOf(e: TerminalEntry): 'note' | 'edit' | 'command';
+    asNote(e: TerminalEntry): TerminalNote;
+    asEdit(e: TerminalEntry): TerminalEdit;
+    asCommand(e: TerminalEntry): TerminalCommand;
+    dataS(e: TerminalCommand): string;
+    private out;
+    folds(e: TerminalCommand): boolean;
+    hidden(e: TerminalCommand): TerminalLine[];
+    shown(e: TerminalCommand): TerminalLine[];
+    lineText(l: TerminalLine): string;
+    toneClass(l: TerminalLine): string;
+    more(n: number): string;
+    toggle(i: number): void;
+    private text;
+    copyAll(): void;
+    onScroll(): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TerminalStreamComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TerminalStreamComponent, "vo-terminal-stream", never, { "cwd": { "alias": "cwd"; "required": false; }; "entries": { "alias": "entries"; "required": false; }; "status": { "alias": "status"; "required": false; }; "elapsed": { "alias": "elapsed"; "required": false; }; "summary": { "alias": "summary"; "required": false; }; "tail": { "alias": "tail"; "required": false; }; "copied": { "alias": "copied"; "required": false; }; "labels": { "alias": "labels"; "required": false; }; "className": { "alias": "className"; "required": false; }; }, { "stop": "stop"; "copy": "copy"; }, never, never, true, never>;
+}

package/thinking/thinking.component.d.ts

@@ -0,0 +1,63 @@
+import { AfterViewInit, EventEmitter, OnChanges, OnDestroy, SimpleChanges } from '@angular/core';
+import { ReducedMotionService } from '../core/reduced-motion.service';
+import * as i0 from "@angular/core";
+/** One step in the trace: what the agent does, and what it found. */
+export interface ThinkingStep {
+    /** What the agent does, like "Measure the plan cards". */
+    label: string;
+    /** running spins and shimmers, retry waits out a problem in amber, done turns into a check. */
+    state: 'running' | 'retry' | 'done';
+    /** What the step found, or what it waits on, under it. Opens and crossfades when it changes. */
+    result?: string;
+    /** More detail shown on hover of the result, like the measured values. */
+    resultTip?: string;
+    /** How long the step took, like "1.3s", shown at its right once it is done. */
+    time?: string;
+}
+/** One word of a finished result, carrying its own entrance delay. */
+interface ResultWord {
+    text: string;
+    delay: number;
+}
+/** The live trace of what the agent is doing, folded away once it is done. */
+export declare class ThinkingComponent implements AfterViewInit, OnChanges, OnDestroy {
+    private readonly reduced;
+    /** The steps the agent has taken so far. */
+    steps: ThinkingStep[];
+    /** Spins, counts seconds and keeps the trace open while true. */
+    running: boolean;
+    /** Seconds to show. Leave it out to let it count while running. */
+    seconds?: number;
+    /** The header while it runs, like "Checking the pricing page". */
+    title: string;
+    /** The header once it is done. Defaults to the number of steps. */
+    summary?: string;
+    /** Folds the trace away a moment after it finishes. */
+    collapseWhenDone: boolean;
+    /** Whether the trace is open. Leave it out to let the header toggle it. */
+    open?: boolean;
+    /** The open state the trace starts in when uncontrolled. */
+    defaultOpen: boolean;
+    /** Emitted when the header toggles the trace. */
+    openChange: EventEmitter<boolean>;
+    isOpen: boolean;
+    private counted;
+    private secondTimer?;
+    private collapseTimer?;
+    private viewReady;
+    constructor(reduced: ReducedMotionService);
+    get done(): boolean;
+    get secs(): number;
+    get headerText(): string;
+    ngAfterViewInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    stepClass(s: ThinkingStep): string;
+    words(text: string): ResultWord[];
+    toggle(): void;
+    private startSeconds;
+    private scheduleCollapse;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ThinkingComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ThinkingComponent, "vo-thinking", never, { "steps": { "alias": "steps"; "required": false; }; "running": { "alias": "running"; "required": false; }; "seconds": { "alias": "seconds"; "required": false; }; "title": { "alias": "title"; "required": false; }; "summary": { "alias": "summary"; "required": false; }; "collapseWhenDone": { "alias": "collapseWhenDone"; "required": false; }; "open": { "alias": "open"; "required": false; }; "defaultOpen": { "alias": "defaultOpen"; "required": false; }; }, { "openChange": "openChange"; }, never, never, true, never>;
+}
+export {};

package/thinking-states/thinking-states.component.d.ts

@@ -0,0 +1,51 @@
+import { OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core';
+import { ReducedMotionService } from '../core/reduced-motion.service';
+import * as i0 from "@angular/core";
+export type ThinkingVariant = 'orbit' | 'morph' | 'scan' | 'stream' | 'matrix' | 'stack' | 'pulse' | 'wave' | 'bounce' | 'spiral';
+type GridKind = 'orbit' | 'morph' | 'scan' | 'stream' | 'spiral';
+/** One dot in a grid mark: its part classes and optional animation delay. */
+interface Dot {
+    cls: string;
+    delay: number | null;
+}
+/** Ten thinking indicators to pick from, each a small mark beside a status line. */
+export declare class ThinkingStatesComponent implements OnInit, OnChanges, OnDestroy {
+    private readonly reduced;
+    /** Which indicator to show. */
+    variant: ThinkingVariant;
+    /** The status lines. With more than one, they take turns unless `current` is set. */
+    steps: string[];
+    /** Index of the line to show. Leave it out to let the lines take turns. */
+    current?: number;
+    /** Milliseconds each line shows for when they take turns. */
+    interval: number;
+    /** Seconds at the end of the line. Counts by itself when left out; false hides it. */
+    seconds?: number | false;
+    /** The whole current line (for the screen reader). */
+    text: string;
+    /** What is painted now (the typed prefix in Stream, otherwise the whole line). */
+    shown: string;
+    /** Seconds shown, or null when hidden. */
+    secs: number | null;
+    private auto;
+    private counted;
+    private typed;
+    private rotateTimer?;
+    private secondTimer?;
+    private typeTimer?;
+    constructor(reduced: ReducedMotionService);
+    get gridKind(): GridKind;
+    get dots(): Dot[];
+    get matrix(): number[];
+    get stack(): number[];
+    get wave(): number[];
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    private startRotation;
+    private startSeconds;
+    private updateText;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ThinkingStatesComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ThinkingStatesComponent, "vo-thinking-states", never, { "variant": { "alias": "variant"; "required": false; }; "steps": { "alias": "steps"; "required": false; }; "current": { "alias": "current"; "required": false; }; "interval": { "alias": "interval"; "required": false; }; "seconds": { "alias": "seconds"; "required": false; }; }, {}, never, never, true, never>;
+}
+export {};

package/thread-panel/thread-panel.component.d.ts

@@ -0,0 +1,75 @@
+import { AfterViewInit, EventEmitter, OnChanges, OnDestroy, SimpleChanges } from '@angular/core';
+import * as i0 from "@angular/core";
+/** A file or page the agent used, shown as a chip above its reply. */
+export interface ThreadSource {
+    label: string;
+    /** The tooltip shown on hover. Defaults to the label. */
+    tip?: string;
+    onClick?: () => void;
+}
+export interface ThreadMessage {
+    /** Keeps the message in place when the list changes. Defaults to its position. */
+    id?: string;
+    from: 'user' | 'agent';
+    text: string;
+    /** Files or pages the agent used, shown as chips above its reply. */
+    sources?: ThreadSource[];
+    /** Shows a shimmering "Thinking" (or `text`, if given) while the agent works on a reply. */
+    thinking?: boolean;
+}
+export interface Thread {
+    id: string;
+    title: string;
+    /** The dot in front of the title, any CSS colour, like 'var(--vo-ok-mark)'. Defaults to a quiet grey. */
+    color?: string;
+    messages: ThreadMessage[];
+}
+/** The underline position under the open tab. */
+interface Ink {
+    left: number;
+    width: number;
+}
+export declare class ThreadPanelComponent implements OnChanges, AfterViewInit, OnDestroy {
+    threads: Thread[];
+    /** The id of the open thread. Leave it out to let the tabs switch it. */
+    value?: string;
+    defaultValue?: string;
+    valueChange: EventEmitter<string>;
+    /** Called with the reply and the open thread's id. Add the message to that thread to show it. */
+    sendMessage: EventEmitter<{
+        text: string;
+        threadId: string;
+    }>;
+    /** The reply being written. Leave it out to let the field keep its own. */
+    draftInput?: string;
+    defaultDraft: string;
+    draftChange: EventEmitter<string>;
+    placeholder: string;
+    /** Sits flat in a chat column (the default). Set false to give it a card of its own. */
+    bare: boolean;
+    className?: string;
+    private tabsRef;
+    private readonly motion;
+    ink: Ink;
+    private first;
+    private curUncontrolled?;
+    private draftUncontrolled;
+    private ro?;
+    get rootClass(): string;
+    get cur(): string;
+    get thread(): Thread | undefined;
+    get draft(): string;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    /** The underline slides to the open tab, 10px in from each side. */
+    private place;
+    setCur(id: string): void;
+    onInput(e: Event): void;
+    send(e: Event): void;
+    delay(i: number): number;
+    messageKey(m: ThreadMessage, i: number): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ThreadPanelComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ThreadPanelComponent, "vo-thread-panel", never, { "threads": { "alias": "threads"; "required": true; }; "value": { "alias": "value"; "required": false; }; "defaultValue": { "alias": "defaultValue"; "required": false; }; "draftInput": { "alias": "draftInput"; "required": false; }; "defaultDraft": { "alias": "defaultDraft"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "bare": { "alias": "bare"; "required": false; }; "className": { "alias": "className"; "required": false; }; }, { "valueChange": "valueChange"; "sendMessage": "sendMessage"; "draftChange": "draftChange"; }, never, never, true, never>;
+}
+export {};

package/toast/toast.component.d.ts

@@ -0,0 +1,56 @@
+import { EventEmitter, OnChanges, OnDestroy, SimpleChanges } from '@angular/core';
+import { type VoIconName } from '../core/icon.component';
+import * as i0 from "@angular/core";
+/** Tone of the toast: picks the icon and its colour. */
+export type ToastTone = 'success' | 'error' | 'info' | 'loading';
+/** The action button shown before the close button, like Undo or Retry. */
+export interface ToastAction {
+    label: string;
+    onClick: () => void;
+    variant?: 'ghost' | 'primary' | 'ink';
+    /** Swaps the label for a spinner. */
+    busy?: boolean;
+}
+/** The data for one toast. */
+export interface ToastData {
+    /** A new id slides a new toast in and the old one away. Keep the id to change the text in place. */
+    id: string | number;
+    /** Picks the icon and its colour. loading spins. */
+    tone?: ToastTone;
+    title: string;
+    /** The quieter line under the title. */
+    description?: string;
+    action?: ToastAction;
+}
+interface ToneStyle {
+    icon: VoIconName | null;
+    color: string;
+    bg: string;
+}
+/** A toast kept on screen, with its exit state while it leaves. */
+interface Shown {
+    toast: ToastData;
+    leaving: boolean;
+    key: string;
+}
+export declare class ToastComponent implements OnChanges, OnDestroy {
+    /** The toast to show, or null for none. */
+    toast: ToastData | null;
+    /** Emitted by the close button. The toast leaves either way. */
+    dismiss: EventEmitter<string | number>;
+    private readonly motion;
+    /** The toasts rendered now: the current one plus any still playing their exit. */
+    shown: Shown[];
+    private closed;
+    private curId;
+    private timers;
+    tone(t: ToastData): ToneStyle;
+    ngOnChanges(changes: SimpleChanges): void;
+    private scheduleRemoval;
+    runAction(a: ToastAction): void;
+    close(t: ToastData): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToastComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToastComponent, "vo-toast", never, { "toast": { "alias": "toast"; "required": false; }; }, { "dismiss": "dismiss"; }, never, never, true, never>;
+}
+export {};

package/toast-stack/toast-stack.component.d.ts

@@ -0,0 +1,72 @@
+import { AfterViewChecked, ElementRef, EventEmitter, OnChanges, OnDestroy, QueryList, SimpleChanges } from '@angular/core';
+import { type VoIconName } from '../core/icon.component';
+import * as i0 from "@angular/core";
+/** Tone of a stacked toast: colours the round icon badge. */
+export type ToastStackTone = 'neutral' | 'ok' | 'warn' | 'bad' | 'merge' | 'blue' | 'purple' | 'green' | 'orange' | 'red' | 'yellow' | 'pink' | 'teal';
+/** The data for one toast in the stack. */
+export interface StackToast {
+    id: string | number;
+    /** The icon in the round badge. */
+    icon: VoIconName;
+    /** Colours the badge. Defaults to neutral. */
+    tone?: ToastStackTone;
+    title: string;
+    /** The quiet line under the title. */
+    detail?: string;
+    /** Like "now" or "2m". */
+    time?: string;
+}
+/** The inline style a toast is placed with. */
+interface Placement {
+    transform: string;
+    opacity: number;
+    filter: string;
+    zIndex: number;
+}
+export declare class ToastStackComponent implements OnChanges, AfterViewChecked, OnDestroy {
+    /** Oldest first. The last one sits in front. */
+    toasts: StackToast[];
+    /** Fans the stack out. Leave it out (null) to fan it while the pointer is over it. */
+    expanded: boolean | null;
+    /** How many toasts stay mounted. Older ones drop off the back. */
+    max: number;
+    /** Emitted when a toast's close button is pressed. */
+    dismiss: EventEmitter<string | number>;
+    cards: QueryList<ElementRef<HTMLDivElement>>;
+    private readonly motion;
+    /** The toasts shown now (live, front first in the DOM order below), plus any leaving. */
+    rows: {
+        toast: StackToast;
+        style: Placement;
+        inert: boolean;
+    }[];
+    private hover;
+    private focused;
+    private live;
+    private placed;
+    private leaving;
+    private heights;
+    private prevIds;
+    private rafs;
+    private timers;
+    fanh: number | null;
+    get fan(): boolean;
+    tone(t: StackToast): [string, string];
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewChecked(): void;
+    private idOf;
+    private sync;
+    private frontHeights;
+    /** Where a toast sits: `i` counts from the front (0 = front). */
+    private place;
+    private rebuild;
+    onEnter(): void;
+    onLeave(): void;
+    onFocusIn(): void;
+    onFocusOut(e: FocusEvent): void;
+    onDismiss(t: StackToast): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToastStackComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToastStackComponent, "vo-toast-stack", never, { "toasts": { "alias": "toasts"; "required": false; }; "expanded": { "alias": "expanded"; "required": false; }; "max": { "alias": "max"; "required": false; }; }, { "dismiss": "dismiss"; }, never, never, true, never>;
+}
+export {};