@tolle_/tolle-ui 18.2.28 → 18.2.30

package/lib/tool.component.d.ts

@@ -0,0 +1,158 @@
+import { EventEmitter, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core';
+import { type VariantProps } from 'class-variance-authority';
+import * as i0 from "@angular/core";
+declare const toolStateVariants: (props?: ({
+    state?: "error" | "success" | "pending" | "running" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type ToolStateProps = VariantProps<typeof toolStateVariants>;
+/** Lifecycle of a tool call. */
+export type ToolState = NonNullable<ToolStateProps['state']>;
+/**
+ * Coordinates a `tolle-tool` with its header, input and output.
+ *
+ * Header/input/output are OnPush siblings projected into the tool, so the
+ * shared open + state they render from is published here.
+ *
+ * Provided on `ToolComponent`, so each tool call gets its own instance.
+ */
+export declare class ToolService {
+    private readonly openSource;
+    /** Emits whether the tool call is expanded. */
+    readonly open$: import("rxjs").Observable<boolean>;
+    private readonly stateSource;
+    /** Emits the tool call's lifecycle state. */
+    readonly state$: import("rxjs").Observable<ToolState>;
+    /** True while the tool call is expanded. */
+    get open(): boolean;
+    /** The tool call's current state. */
+    get state(): ToolState;
+    setOpen(value: boolean): void;
+    toggle(): void;
+    setState(state: ToolState): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToolService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ToolService>;
+}
+declare const toolVariants: (props?: ({
+    state?: "error" | "success" | "pending" | "running" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type ToolProps = VariantProps<typeof toolVariants>;
+/**
+ * A collapsible record of one tool/function call: what was invoked, the
+ * arguments it received and the result it returned.
+ *
+ * Compose it from `tolle-tool-header`, `tolle-tool-input` and
+ * `tolle-tool-output`.
+ * @new
+ */
+export declare class ToolComponent implements OnInit, OnChanges, OnDestroy {
+    /** Lifecycle of the call, driving the header chip and border. @default 'pending' */
+    state: ToolState;
+    /** Whether the call's input and output are expanded. @default false */
+    open: boolean;
+    /** Extra Tailwind classes merged onto the tool via `cn()` (last-wins). */
+    class: string;
+    /** Emitted with the new state whenever the call is expanded or collapsed. */
+    openChange: EventEmitter<boolean>;
+    private readonly service;
+    private readonly cdr;
+    private readonly subscriptions;
+    /** True while an `open` input is being pushed into the service. */
+    private applyingInput;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    private applyInput;
+    ngOnDestroy(): void;
+    get computedClass(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToolComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToolComponent, "tolle-tool", never, { "state": { "alias": "state"; "required": false; }; "open": { "alias": "open"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, { "openChange": "openChange"; }, never, ["*"], true, never>;
+}
+/** Clickable header of a `tolle-tool`: the tool's name plus its state chip. */
+export declare class ToolHeaderComponent implements OnChanges, OnInit, OnDestroy {
+    /**
+     * Angular writes a bound `class` input through its styling path, which does
+     * not mark an OnPush component dirty — without this hook the component keeps
+     * rendering the class it was born with.
+     */
+    ngOnChanges(): void;
+    /** Name of the tool that was called. @default '' */
+    name: string;
+    /** Remixicon class shown before the tool name. @default 'ri-tools-line' */
+    icon: string;
+    /** Overrides the chip text; defaults to a label derived from the state. @default '' */
+    stateLabelOverride: string;
+    /** Extra Tailwind classes merged onto the header via `cn()` (last-wins). */
+    class: string;
+    /** Extra Tailwind classes merged onto the state chip via `cn()` (last-wins). */
+    chipClassName: string;
+    private readonly service;
+    private readonly cdr;
+    private readonly subscriptions;
+    open: boolean;
+    state: ToolState;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    get stateIcon(): string;
+    get stateLabel(): string;
+    get chipClass(): string;
+    get computedClass(): string;
+    onToggle(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToolHeaderComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToolHeaderComponent, "tolle-tool-header", never, { "name": { "alias": "name"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "stateLabelOverride": { "alias": "stateLabelOverride"; "required": false; }; "class": { "alias": "class"; "required": false; }; "chipClassName": { "alias": "chipClassName"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+/**
+ * Base for the two payload panels. Owns the shared "visible only while the
+ * tool is expanded" wiring and the payload-to-text formatting.
+ *
+ * Decorated with a selector-less `@Directive()` because it uses Angular
+ * features (DI and lifecycle hooks) on behalf of its subclasses.
+ */
+export declare abstract class ToolPayloadBase implements OnChanges, OnInit, OnDestroy {
+    /**
+     * Angular writes a bound `class` input through its styling path, which does
+     * not mark an OnPush component dirty — without this hook subclasses keep
+     * rendering the class they were born with.
+     */
+    ngOnChanges(): void;
+    /** Payload to render; objects are pretty-printed as JSON, strings are shown as-is. */
+    payload: unknown;
+    protected readonly service: ToolService;
+    private readonly cdr;
+    private readonly subscriptions;
+    open: boolean;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /** True once there is a payload worth rendering. */
+    get hasPayload(): boolean;
+    /** The payload as display text. Falls back to `String()` for cyclic values. */
+    get formatted(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToolPayloadBase, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ToolPayloadBase, never, never, {}, {}, never, never, false, never>;
+}
+/** Arguments the tool was called with. Visible while the `tolle-tool` is expanded. */
+export declare class ToolInputComponent extends ToolPayloadBase {
+    /** Arguments passed to the tool; objects are pretty-printed as JSON. @default null */
+    payload: unknown;
+    /** Heading above the payload. @default 'Parameters' */
+    label: string;
+    /** Extra Tailwind classes merged onto the panel via `cn()` (last-wins). */
+    class: string;
+    get computedClass(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToolInputComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToolInputComponent, "tolle-tool-input", never, { "payload": { "alias": "payload"; "required": false; }; "label": { "alias": "label"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+/** Result the tool returned. Visible while the `tolle-tool` is expanded. */
+export declare class ToolOutputComponent extends ToolPayloadBase {
+    /** Result returned by the tool; objects are pretty-printed as JSON. @default null */
+    payload: unknown;
+    /** Heading above the payload. @default 'Result' */
+    label: string;
+    /** Styles the payload as a failure. @default false */
+    error: boolean;
+    /** Extra Tailwind classes merged onto the panel via `cn()` (last-wins). */
+    class: string;
+    get payloadClass(): string;
+    get computedClass(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToolOutputComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToolOutputComponent, "tolle-tool-output", never, { "payload": { "alias": "payload"; "required": false; }; "label": { "alias": "label"; "required": false; }; "error": { "alias": "error"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+export {};

package/lib/typography.component.d.ts

@@ -0,0 +1,32 @@
+import { OnChanges } from '@angular/core';
+import { type VariantProps } from 'class-variance-authority';
+import * as i0 from "@angular/core";
+declare const typographyVariants: (props?: ({
+    variant?: "muted" | "blockquote" | "code" | "h1" | "h2" | "h3" | "h4" | "p" | "small" | "lead" | "large" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type TypographyProps = VariantProps<typeof typographyVariants>;
+/**
+ * Applies the theme's type scale to projected content. Renders the semantically
+ * correct host tag for the chosen `variant` (`h1`–`h4`, `blockquote`, `code`,
+ * otherwise `p`), so headings stay real headings for assistive tech.
+ * @new
+ */
+export declare class TypographyComponent implements OnChanges {
+    private readonly cdr;
+    /**
+     * Angular writes a bound `class` input through its styling path, which does
+     * not mark an OnPush component dirty — without this hook the component keeps
+     * rendering the class it was born with.
+     */
+    ngOnChanges(): void;
+    /** Type scale step; also selects the rendered HTML tag. @default 'p' */
+    variant: TypographyProps['variant'];
+    /** Extra Tailwind classes merged onto the element via `cn()` (last-wins). */
+    class: string;
+    /** True for the variants that have no dedicated tag and render as `<p>`. */
+    get isParagraph(): boolean;
+    get computedClass(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TypographyComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TypographyComponent, "tolle-typography", never, { "variant": { "alias": "variant"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+export {};

package/lib/utils/color.d.ts

@@ -78,10 +78,24 @@ export declare const BASE_PALETTES: Record<string, BasePalette>;
 /** Emit the `:root` + `.dark` neutral-token block for a base color id. */
 export declare function generateBaseCss(baseId: string): string;
 /**
- * Derive 5 harmonious chart colors from one base hex — the base hue plus
- * analogous hues at ±30°/±60°, with paired lightness shifts for separation.
- * Returns RGB triplets for `--chart-1`…`--chart-5`.
+ * Derive 5 chart colors from one base hex, spreading hues widely and
+ * alternating lightness so adjacent series stay separable — including for
+ * red-green colour blindness, where hue alone carries almost no information and
+ * the lightness difference does the work.
+ *
+ * `mode` re-steps the ramp for the target surface. Dark is NOT a lightened flip
+ * of light: its usable lightness band is both narrower and lower.
+ *
+ * NOTE: a palette derived from an arbitrary brand hue cannot be *guaranteed*
+ * colour-blind-safe — five hues spread from one starting point will, for some
+ * bases, put a confusable pair next to each other. The shipped defaults in
+ * `theme.css` are a fixed, validated palette; prefer those unless brand-matched
+ * charts matter more than guaranteed separation. Whatever you use, keep the
+ * legend and direct labels on, so colour is never the only channel.
+ */
+export declare function generateChartRamp(hex: string, mode?: 'light' | 'dark'): string[];
+/**
+ * Emit the `:root` + `.dark` `--chart-1…5` block for a chart base color, with
+ * each mode re-stepped for its own surface.
  */
-export declare function generateChartRamp(hex: string): string[];
-/** Emit the `:root` + `.dark` `--chart-1…5` block for a chart base color. */
 export declare function generateChartCss(hex: string): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tolle_/tolle-ui",
-  "version": "18.2.28",
+  "version": "18.2.30",
   "publishConfig": {
     "access": "public"
   },

package/public-api.d.ts

@@ -83,3 +83,53 @@ export * from './lib/phone-number.service';
 export * from './lib/country-codes.service';
 export * from './lib/resizable-panel.component';
 export * from './lib/resizable-panel-item.component';
+export * from './lib/aspect-ratio.component';
+export * from './lib/resizable.component';
+export * from './lib/context-menu.component';
+export * from './lib/context-menu-trigger.directive';
+export * from './lib/context-menu.service';
+export * from './lib/select.service';
+export * from './lib/radio-service';
+export * from './lib/types/date-range';
+export * from './lib/spinner.component';
+export * from './lib/kbd.component';
+export * from './lib/item.component';
+export * from './lib/native-select.component';
+export * from './lib/typography.component';
+export * from './lib/field.component';
+export * from './lib/input-group.component';
+export * from './lib/table.component';
+export * from './lib/menubar.component';
+export * from './lib/navigation-menu.component';
+export * from './lib/command.service';
+export * from './lib/command.component';
+export * from './lib/command-dialog.component';
+export * from './lib/combobox.component';
+export * from './lib/message-scroller.service';
+export * from './lib/message-scroller.component';
+export * from './lib/message.component';
+export * from './lib/bubble.component';
+export * from './lib/marker.component';
+export * from './lib/attachment.component';
+export * from './lib/conversation.component';
+export * from './lib/prompt-input.component';
+export * from './lib/reasoning.component';
+export * from './lib/tool.component';
+export * from './lib/sources.component';
+export * from './lib/suggestion.component';
+export * from './lib/inline-citation.component';
+export * from './lib/shimmer.component';
+export * from './lib/task.component';
+export * from './lib/chain-of-thought.component';
+export * from './lib/plan.component';
+export * from './lib/queue.component';
+export * from './lib/checkpoint.component';
+export * from './lib/confirmation.component';
+export * from './lib/context.component';
+export * from './lib/model-selector.component';
+export * from './lib/chart.service';
+export * from './lib/chart.component';
+export * from './lib/chart-pie.component';
+export * from './lib/direction.component';
+export * from './lib/time-picker.component';
+export * from './lib/date-time-picker.component';