@ponchia/ui 0.5.0 → 0.6.3

package/classes/index.d.ts

@@ -34,6 +34,11 @@ export declare const cls: {
   readonly numPos: 'ui-num--pos';
   readonly numNeg: 'ui-num--neg';
   readonly numMuted: 'ui-num--muted';
+  readonly delta: 'ui-delta';
+  readonly deltaUp: 'ui-delta--up';
+  readonly deltaDown: 'ui-delta--down';
+  readonly deltaFlat: 'ui-delta--flat';
+  readonly deltaInvert: 'ui-delta--invert';
   readonly badge: 'ui-badge';
   readonly badgeAccent: 'ui-badge--accent';
   readonly badgeSuccess: 'ui-badge--success';
@@ -99,7 +104,7 @@ export declare const cls: {
   readonly alert: 'ui-alert';
   readonly alertTitle: 'ui-alert__title';
   readonly alertBody: 'ui-alert__body';
-  readonly alertDismiss: 'ui-alert__dismiss';
+  readonly alertClose: 'ui-alert__close';
   readonly alertAccent: 'ui-alert--accent';
   readonly alertSuccess: 'ui-alert--success';
   readonly alertWarning: 'ui-alert--warning';
@@ -123,10 +128,14 @@ export declare const cls: {
   readonly progressIndeterminate: 'ui-progress--indeterminate';
   readonly meter: 'ui-meter';
   readonly meterFill: 'ui-meter__fill';
+  readonly meterRow: 'ui-meter__row';
+  readonly meterLabel: 'ui-meter__label';
+  readonly meterValue: 'ui-meter__value';
   readonly meterAccent: 'ui-meter--accent';
   readonly meterSuccess: 'ui-meter--success';
   readonly meterWarning: 'ui-meter--warning';
   readonly meterDanger: 'ui-meter--danger';
+  readonly meterInfo: 'ui-meter--info';
   readonly steps: 'ui-steps';
   readonly stepsItem: 'ui-steps__item';
   readonly stepsItemDone: 'ui-steps__item--done';
@@ -181,12 +190,12 @@ export declare const cls: {
   readonly tableComfortable: 'ui-table--comfortable';
   readonly tableLined: 'ui-table--lined';
   readonly tableWrap: 'ui-table-wrap';
+  readonly tableLoading: 'ui-table-wrap--loading';
   readonly tableEmpty: 'ui-table__empty';
   readonly tableSort: 'ui-table__sort';
   readonly tableSelect: 'ui-table__select';
   readonly tableToolbar: 'ui-table__toolbar';
   readonly tableSelectable: 'ui-table--selectable';
-  readonly tableLoading: 'ui-table--loading';
   readonly panel: 'ui-panel';
   readonly panelHead: 'ui-panel__head';
   readonly surface: 'ui-surface';
@@ -237,7 +246,7 @@ export declare const cls: {
   readonly reportNumbered: 'ui-report--numbered';
   readonly reportCover: 'ui-report__cover';
   readonly reportCoverCompact: 'ui-report__cover--compact';
-  readonly reportHeader: 'ui-report__header';
+  readonly reportHead: 'ui-report__head';
   readonly reportTitle: 'ui-report__title';
   readonly reportSubtitle: 'ui-report__subtitle';
   readonly reportMeta: 'ui-report__meta';
@@ -253,14 +262,10 @@ export declare const cls: {
   readonly reportSources: 'ui-report__sources';
   readonly reportAppendix: 'ui-report__appendix';
   readonly reportFootnotes: 'ui-report__footnotes';
-  readonly chart: 'ui-chart';
-  readonly chartCaption: 'ui-chart__caption';
-  readonly chartPlot: 'ui-chart__plot';
-  readonly chartBar: 'ui-chart__bar';
-  readonly chartLabel: 'ui-chart__label';
-  readonly chartTrack: 'ui-chart__track';
-  readonly chartFill: 'ui-chart__fill';
-  readonly chartFallback: 'ui-chart__fallback';
+  readonly compare: 'ui-compare';
+  readonly compare2up: 'ui-compare--2up';
+  readonly compareCol: 'ui-compare__col';
+  readonly compareHead: 'ui-compare__head';
   readonly legend: 'ui-legend';
   readonly legendVertical: 'ui-legend--vertical';
   readonly legendCompact: 'ui-legend--compact';
@@ -338,6 +343,7 @@ export declare const cls: {
   readonly bracketNote: 'ui-bracket-note';
   readonly bracketNoteLabel: 'ui-bracket-note__label';
   readonly bracketNoteAccent: 'ui-bracket-note--accent';
+  readonly bracketNoteSuccess: 'ui-bracket-note--success';
   readonly bracketNoteWarning: 'ui-bracket-note--warning';
   readonly bracketNoteDanger: 'ui-bracket-note--danger';
   readonly bracketNoteInfo: 'ui-bracket-note--info';
@@ -383,12 +389,62 @@ export declare const cls: {
   readonly sourceCardActions: 'ui-source-card__actions';
   readonly provenance: 'ui-provenance';
   readonly provenanceItem: 'ui-provenance__item';
+  readonly src: 'ui-src';
   readonly srcVerified: 'ui-src--verified';
   readonly srcUnverified: 'ui-src--unverified';
   readonly srcGenerated: 'ui-src--generated';
   readonly srcReviewed: 'ui-src--reviewed';
   readonly srcStale: 'ui-src--stale';
   readonly srcConflict: 'ui-src--conflict';
+  readonly diff: 'ui-diff';
+  readonly diffSplit: 'ui-diff--split';
+  readonly diffPane: 'ui-diff__pane';
+  readonly diffHunk: 'ui-diff__hunk';
+  readonly diffHead: 'ui-diff__head';
+  readonly diffRow: 'ui-diff__row';
+  readonly diffRowAdd: 'ui-diff__row--add';
+  readonly diffRowRemove: 'ui-diff__row--remove';
+  readonly diffRowContext: 'ui-diff__row--context';
+  readonly diffLn: 'ui-diff__ln';
+  readonly diffCode: 'ui-diff__code';
+  readonly code: 'ui-code';
+  readonly codeNumbered: 'ui-code--numbered';
+  readonly codeHead: 'ui-code__head';
+  readonly codeBody: 'ui-code__body';
+  readonly codeLine: 'ui-code__line';
+  readonly codeLineAdd: 'ui-code__line--add';
+  readonly codeLineRemove: 'ui-code__line--remove';
+  readonly codeLineHl: 'ui-code__line--hl';
+  readonly spark: 'ui-spark';
+  readonly sparkBar: 'ui-spark__bar';
+  readonly sparkBarAccent: 'ui-spark__bar--accent';
+  readonly sparkBarPos: 'ui-spark__bar--pos';
+  readonly sparkBarNeg: 'ui-spark__bar--neg';
+  readonly sidenote: 'ui-sidenote';
+  readonly marginnote: 'ui-marginnote';
+  readonly sidenoteRef: 'ui-sidenote__ref';
+  readonly textref: 'ui-textref';
+  readonly bullet: 'ui-bullet';
+  readonly bulletMeasure: 'ui-bullet__measure';
+  readonly bulletMeasureAccent: 'ui-bullet__measure--accent';
+  readonly bulletMeasurePos: 'ui-bullet__measure--pos';
+  readonly bulletMeasureNeg: 'ui-bullet__measure--neg';
+  readonly bulletTarget: 'ui-bullet__target';
+  readonly bulletLabel: 'ui-bullet__label';
+  readonly term: 'ui-term';
+  readonly def: 'ui-def';
+  readonly glossary: 'ui-glossary';
+  readonly glossaryTerm: 'ui-glossary__term';
+  readonly glossaryDef: 'ui-glossary__def';
+  readonly toc: 'ui-toc';
+  readonly tocTitle: 'ui-toc__title';
+  readonly tocList: 'ui-toc__list';
+  readonly tocLink: 'ui-toc__link';
+  readonly tree: 'ui-tree';
+  readonly treeBranch: 'ui-tree__branch';
+  readonly treeLeaf: 'ui-tree__leaf';
+  readonly treeSummary: 'ui-tree__summary';
+  readonly treeLabel: 'ui-tree__label';
   readonly state: 'ui-state';
   readonly stateLabel: 'ui-state__label';
   readonly stateDetail: 'ui-state__detail';
@@ -416,7 +472,7 @@ export declare const cls: {
   readonly toolCallStatus: 'ui-tool-call__status';
   readonly toolCallBody: 'ui-tool-call__body';
   readonly inspector: 'ui-inspector';
-  readonly inspectorHeader: 'ui-inspector__header';
+  readonly inspectorHead: 'ui-inspector__head';
   readonly inspectorBody: 'ui-inspector__body';
   readonly property: 'ui-property';
   readonly propertyLabel: 'ui-property__label';
@@ -463,7 +519,6 @@ export declare const cls: {
   readonly appShellFull: 'ui-app-shell--full';
   readonly appRail: 'ui-app-rail';
   readonly appRailBrand: 'ui-app-rail__brand';
-  readonly appRailToggle: 'ui-app-rail__toggle';
   readonly appRailFoot: 'ui-app-rail__foot';
   readonly appRailAccount: 'ui-app-rail__account';
   readonly appTopbar: 'ui-app-topbar';
@@ -509,6 +564,16 @@ export interface BadgeOpts {
 export interface NumOpts {
   tone?: 'pos' | 'neg' | 'muted';
 }
+export interface DeltaOpts {
+  /** Trend direction — sets the arrow glyph and the conventional tone. */
+  dir?: 'up' | 'down' | 'flat';
+  /** Swap only the tone when `up` is the bad direction (latency, error rate, cost). */
+  invert?: boolean;
+}
+export interface CompareOpts {
+  /** Pin exactly two equal columns (hard before/after) instead of the auto-fitting set. */
+  cols?: 2;
+}
 export interface ChipOpts {
   accent?: boolean;
 }
@@ -552,7 +617,7 @@ export interface ProgressOpts {
   indeterminate?: boolean;
 }
 export interface MeterOpts {
-  tone?: 'accent' | 'success' | 'warning' | 'danger';
+  tone?: 'accent' | 'success' | 'warning' | 'danger' | 'info';
 }
 export interface DotspinnerOpts {
   size?: 'sm' | 'lg';
@@ -621,7 +686,7 @@ export interface MarkOpts {
   motion?: 'draw';
 }
 export interface BracketNoteOpts {
-  tone?: 'accent' | 'warning' | 'danger' | 'info';
+  tone?: 'accent' | 'success' | 'warning' | 'danger' | 'info';
 }
 export interface ConnectorOpts {
   tone?: 'accent' | 'muted' | 'success' | 'warning' | 'danger' | 'info';
@@ -677,12 +742,40 @@ export interface OriginLabelOpts {
   /** Accent-tint the label for AI/model-generated origin (vs a neutral tag). */
   ai?: boolean;
 }
+export interface DiffOpts {
+  /** Two side-by-side `.ui-diff__pane` columns (old | new) instead of the unified view. */
+  split?: boolean;
+}
+export interface DiffRowOpts {
+  /** The host-classified change kind — sets the tint and the +/− gutter glyph. */
+  change?: 'add' | 'remove' | 'context';
+}
+export interface CodeOpts {
+  /** Show the line-number gutter (counts each `.ui-code__line`). */
+  numbered?: boolean;
+}
+export interface CodeLineOpts {
+  /** The host-classified line state — `hl` is a neutral highlight, not a change.
+   *  `remove` matches `ui.diffRow`'s verb (was `del`) so the two change-review
+   *  surfaces share one vocabulary. */
+  change?: 'add' | 'remove' | 'hl';
+}
+export interface SparkBarOpts {
+  /** Emphasise / tone a single bar. The meaning must still be in the spark's aria-label. */
+  tone?: 'accent' | 'pos' | 'neg';
+}
+export interface BulletMeasureOpts {
+  /** Emphasise / tone the measure bar. The meaning must still be in the bullet's aria-label. */
+  tone?: 'accent' | 'pos' | 'neg';
+}
 
 export interface Ui {
   button(opts?: ButtonOpts): string;
   card(opts?: CardOpts): string;
   badge(opts?: BadgeOpts): string;
   num(opts?: NumOpts): string;
+  delta(opts?: DeltaOpts): string;
+  compare(opts?: CompareOpts): string;
   chip(opts?: ChipOpts): string;
   link(opts?: LinkOpts): string;
   dot(opts?: DotOpts): string;
@@ -718,9 +811,35 @@ export interface Ui {
   citation(opts?: CitationOpts): string;
   source(opts?: SourceOpts): string;
   provenance(opts?: ProvenanceOpts): string;
+  diff(opts?: DiffOpts): string;
+  diffRow(opts?: DiffRowOpts): string;
+  code(opts?: CodeOpts): string;
+  codeLine(opts?: CodeLineOpts): string;
+  sparkBar(opts?: SparkBarOpts): string;
+  bulletMeasure(opts?: BulletMeasureOpts): string;
   state(opts?: StateOpts): string;
   originLabel(opts?: OriginLabelOpts): string;
 }
 
 export declare const ui: Ui;
 export default ui;
+
+/** Min/max for the value-bearing fills; defaults to 0–100. */
+export interface ValueRangeOpts {
+  min?: number;
+  max?: number;
+}
+/** ARIA + style bundle to spread onto a `ui-meter`/`ui-progress` host. */
+export interface ValueAttrs {
+  role: 'meter' | 'progressbar';
+  'aria-valuenow': number;
+  'aria-valuemin': number;
+  'aria-valuemax': number;
+  style: { '--value': number };
+}
+export interface Attrs {
+  meter(value: number, opts?: ValueRangeOpts): ValueAttrs;
+  progress(value: number, opts?: ValueRangeOpts): ValueAttrs;
+}
+/** Set the painted value AND its ARIA together so they cannot drift. */
+export declare const attrs: Attrs;