@vadem/ui 0.0.0-stage → 0.0.2

package/types/vadem-ui-chart.d.ts

@@ -0,0 +1,452 @@
+import * as i0 from "@angular/core";
+/**
+ * Framework-agnostic chart geometry: scales, ticks, stacking and SVG paths.
+ * No DOM access; every function is pure and unit-tested.
+ */
+export interface VdChartSeries {
+  name: string;
+  /** One value per category; `null` = missing (a gap, never zero). */
+  values: readonly (number | null)[];
+}
+export interface VdLinearScale {
+  domain: readonly [number, number];
+  range: readonly [number, number];
+  (value: number): number;
+}
+export declare function linearScale(domain: readonly [number, number], range: readonly [number, number]): VdLinearScale;
+/** Round numbers for an axis: 1, 2, 2.5 or 5 times a power of ten. Always includes zero. */
+export declare function niceTicks(min: number, max: number, target?: number): number[];
+export interface VdBand {
+  /** Start of each band. */
+  start: number;
+  /** Centre of each band. */
+  center: number;
+  /** Band width including its share of padding. */
+  step: number;
+}
+/** Evenly spaced bands across `range` for `count` categories. */
+export declare function bands(count: number, range: readonly [number, number]): VdBand[];
+/** Index of the band nearest to `position` (pointer or keyboard), clamped. */
+export declare function nearestIndex(position: number, count: number, range: readonly [number, number]): number;
+export interface VdStackSegment {
+  from: number;
+  to: number;
+}
+/** Stacks positive values upward and negative values downward from zero, per category. */
+export declare function stack(series: readonly VdChartSeries[], count: number): VdStackSegment[][];
+/** [min, max] over all values (stacked totals when `stacked`). */
+export declare function extent(series: readonly VdChartSeries[], count: number, stacked: boolean): readonly [number, number];
+/**
+ * A bar from `base` to `end` along the value axis, `thickness` wide, centred at `center` on the
+ * category axis. The data end is rounded (`radius`), the baseline end square.
+ */
+export declare function barPath(center: number, thickness: number, base: number, end: number, radius: number, orientation: 'vertical' | 'horizontal'): string;
+export type VdPoint = readonly [x: number, y: number] | null;
+/** Polyline through points; a `null` starts a new segment (missing data is a gap). */
+export declare function linePath(points: readonly VdPoint[]): string;
+/** Closed area between each continuous run of points and the baseline. */
+export declare function areaPath(points: readonly VdPoint[], baseline: number): string;
+type VdChartKind = 'bar' | 'line';
+/** Formats a value for tooltips and the table (full precision, locale-aware). */
+type VdChartFormat = (value: number) => string;
+/** Series identity: slot 1..8 for categorical, "accent" for a single series. */
+declare function seriesSlot(index: number, count: number): string;
+/**
+ * Shared chart chrome: figure with title, legend (2+ series), data-table toggle, tooltip and
+ * plot measurement. Charts project their SVG into it. Spec: specs/chart.md
+ */
+export declare class VdChartFrame {
+  readonly title: import("@angular/core").InputSignal<string>;
+  readonly description: import("@angular/core").InputSignal<string | undefined>;
+  readonly categories: import("@angular/core").InputSignal<readonly string[]>;
+  readonly series: import("@angular/core").InputSignal<readonly VdChartSeries[]>;
+  readonly kind: import("@angular/core").InputSignal<VdChartKind>;
+  readonly format: import("@angular/core").InputSignal<VdChartFormat | undefined>;
+  readonly categoryLabel: import("@angular/core").InputSignal<string | undefined>;
+  /** Highlighted category, driven by the chart (pointer or keyboard). */
+  readonly active: import("@angular/core").InputSignal<number>;
+  /** Tooltip anchor in plot pixels; null hides it. */
+  readonly tooltipX: import("@angular/core").InputSignal<number | null>;
+  readonly tooltipY: import("@angular/core").InputSignal<number>;
+  readonly tableLabel: import("@angular/core").InputSignal<string | undefined>;
+  readonly loading: import("@angular/core").InputSignal<boolean>;
+  protected readonly t: import("@angular/core").Signal<Pick<{
+    tableLabel: string;
+    categoryLabel: string;
+    trendSummary: (first: string, last: string, min: string, max: string) => string;
+  }, "tableLabel" | "categoryLabel">>;
+  private readonly locale;
+  readonly titleId: string;
+  readonly tableId: string;
+  readonly tableShown: import("@angular/core").WritableSignal<boolean>;
+  /** Measured plot width in CSS pixels (0 until the browser lays it out). */
+  readonly width: import("@angular/core").WritableSignal<number>;
+  /** Fired when the pointer leaves the plot; charts clear their highlight. */
+  readonly pointerLeave: import("@angular/core").OutputEmitterRef<void>;
+  private readonly plot;
+  private readonly numberFormat;
+  constructor();
+  protected slot(index: number): string;
+  valueText(value: number | null | undefined): string;
+  protected leave(): void;
+  /** The tooltip sits on the roomier side of its anchor. */
+  protected readonly tooltipSide: import("@angular/core").Signal<"start" | "end">;
+  static ɵfac: i0.ɵɵFactoryDeclaration<VdChartFrame, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<VdChartFrame, "vd-chart-frame", never, {
+    "title": {
+      "alias": "title";
+      "required": true;
+      "isSignal": true;
+    };
+    "description": {
+      "alias": "description";
+      "required": false;
+      "isSignal": true;
+    };
+    "categories": {
+      "alias": "categories";
+      "required": false;
+      "isSignal": true;
+    };
+    "series": {
+      "alias": "series";
+      "required": false;
+      "isSignal": true;
+    };
+    "kind": {
+      "alias": "kind";
+      "required": false;
+      "isSignal": true;
+    };
+    "format": {
+      "alias": "format";
+      "required": false;
+      "isSignal": true;
+    };
+    "categoryLabel": {
+      "alias": "categoryLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "active": {
+      "alias": "active";
+      "required": false;
+      "isSignal": true;
+    };
+    "tooltipX": {
+      "alias": "tooltipX";
+      "required": false;
+      "isSignal": true;
+    };
+    "tooltipY": {
+      "alias": "tooltipY";
+      "required": false;
+      "isSignal": true;
+    };
+    "tableLabel": {
+      "alias": "tableLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "loading": {
+      "alias": "loading";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "pointerLeave": "pointerLeave";
+  }, never, ["*"], true, never>;
+}
+/**
+ * Inputs, value scale and keyboard/pointer exploration shared by bar and line charts.
+ * Rendering stays in each chart's template.
+ */
+declare abstract class VdChartBase {
+  readonly title: import("@angular/core").InputSignal<string>;
+  readonly description: import("@angular/core").InputSignal<string | undefined>;
+  /** Category labels (x for columns and lines, y for horizontal bars). */
+  readonly categories: import("@angular/core").InputSignal<readonly string[]>;
+  readonly series: import("@angular/core").InputSignal<readonly VdChartSeries[]>;
+  /** Plot height in pixels, including the category axis band. */
+  readonly height: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  /** Full value text for tooltips, labels and the table. Defaults to Intl in the locale. */
+  readonly format: import("@angular/core").InputSignal<VdChartFormat | undefined>;
+  /** Short value text for axis ticks. Defaults to compact Intl notation. */
+  readonly axisFormat: import("@angular/core").InputSignal<VdChartFormat | undefined>;
+  readonly categoryLabel: import("@angular/core").InputSignal<string | undefined>;
+  /**
+   * Refetching: keep the previous render, muted and `aria-busy`, so the table view, focus and
+   * layout survive (dataviz: refetch keeps the frame, no skeleton).
+   */
+  readonly loading: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  protected readonly frame: import("@angular/core").Signal<VdChartFrame>;
+  /** Highlighted category (pointer or keyboard), -1 when none. */
+  protected readonly active: import("@angular/core").WritableSignal<number>;
+  /** Roving tab stop among category hit targets. */
+  protected readonly focusIndex: import("@angular/core").WritableSignal<number>;
+  protected readonly count: import("@angular/core").Signal<number>;
+  protected readonly width: import("@angular/core").Signal<number>;
+  protected abstract readonly stackedValues: () => boolean;
+  protected abstract extentOf(): readonly [number, number];
+  protected readonly ticks: import("@angular/core").Signal<number[]>;
+  private readonly compact;
+  private readonly locale;
+  protected localeCode(): string;
+  protected tickText(value: number): string;
+  /** Room for the widest tick label. */
+  protected readonly tickWidth: import("@angular/core").Signal<number>;
+  protected readonly categoryWidth: import("@angular/core").Signal<number>;
+  protected valueScale(range: readonly [number, number]): import("@vadem/ui/chart").VdLinearScale;
+  protected slot(index: number): string;
+  /** "Пн: Запити 4 200, Помилки 12" - the accessible name of one category. */
+  protected pointLabel(index: number): string;
+  /** Every `k`-th category label so labels never overlap. */
+  protected labelEvery(available: number): number;
+  protected pointerAt(position: number, range: readonly [number, number]): void;
+  protected onKeydown(event: KeyboardEvent, index: number): void;
+  protected onFocus(index: number): void;
+  protected onBlur(event: FocusEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<VdChartBase, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<VdChartBase, never, never, {
+    "title": {
+      "alias": "title";
+      "required": true;
+      "isSignal": true;
+    };
+    "description": {
+      "alias": "description";
+      "required": false;
+      "isSignal": true;
+    };
+    "categories": {
+      "alias": "categories";
+      "required": false;
+      "isSignal": true;
+    };
+    "series": {
+      "alias": "series";
+      "required": false;
+      "isSignal": true;
+    };
+    "height": {
+      "alias": "height";
+      "required": false;
+      "isSignal": true;
+    };
+    "format": {
+      "alias": "format";
+      "required": false;
+      "isSignal": true;
+    };
+    "axisFormat": {
+      "alias": "axisFormat";
+      "required": false;
+      "isSignal": true;
+    };
+    "categoryLabel": {
+      "alias": "categoryLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "loading": {
+      "alias": "loading";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+type VdBarOrientation = 'vertical' | 'horizontal';
+interface Mark {
+  d: string;
+  series: number;
+  category: number;
+}
+/**
+ * Bar / column chart: one series in the accent, several grouped or stacked in the categorical
+ * palette. Spec: specs/chart.md
+ */
+export declare class VdBarChart extends VdChartBase {
+  readonly orientation: import("@angular/core").InputSignal<"vertical" | "horizontal">;
+  /** Stack series (part-to-whole) instead of grouping them side by side. */
+  readonly stacked: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /**
+   * Emphasis form for a single series: keep one category in full colour and mute the rest.
+   * `'max'` picks the largest value.
+   */
+  readonly highlight: import("@angular/core").InputSignal<number | "max" | null>;
+  protected readonly highlighted: import("@angular/core").Signal<number>;
+  protected readonly stackedValues: () => boolean;
+  protected extentOf(): readonly [number, number];
+  private readonly vertical;
+  /** Plot box inside the SVG: [start, end] on each axis. */
+  protected readonly box: import("@angular/core").Signal<{
+    x0: number;
+    x1: number;
+    y0: number;
+    y1: number;
+  }>;
+  private readonly scale;
+  private readonly categoryRange;
+  private readonly bandList;
+  protected readonly marks: import("@angular/core").Signal<Mark[]>;
+  protected readonly tickMarks: import("@angular/core").Signal<{
+    value: number;
+    x1: number;
+    x2: number;
+    y1: number;
+    y2: number;
+    tx: number;
+    ty: number;
+    anchor: string;
+  }[]>;
+  protected readonly categoryTicks: import("@angular/core").Signal<{
+    index: number;
+    x: number;
+    y: number;
+    anchor: string;
+  }[]>;
+  /** Hit targets cover the whole band, bigger than the marks. */
+  protected readonly hits: import("@angular/core").Signal<{
+    index: number;
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+  }[]>;
+  protected readonly bandRect: import("@angular/core").Signal<{
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+  }>;
+  protected readonly tooltip: import("@angular/core").Signal<{
+    x: number;
+    y: number;
+  } | null>;
+  protected onPointer(event: PointerEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<VdBarChart, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<VdBarChart, "vd-bar-chart", never, {
+    "orientation": {
+      "alias": "orientation";
+      "required": false;
+      "isSignal": true;
+    };
+    "stacked": {
+      "alias": "stacked";
+      "required": false;
+      "isSignal": true;
+    };
+    "highlight": {
+      "alias": "highlight";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+/**
+ * Line chart for trends over ordered categories. One series gets a soft area wash; several use
+ * the categorical palette with a legend and direct end labels. Spec: specs/chart.md
+ */
+export declare class VdLineChart extends VdChartBase {
+  /** Soft area under a single series; ignored with several series. */
+  readonly area: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  protected readonly stackedValues: () => boolean;
+  protected extentOf(): readonly [number, number];
+  protected readonly showArea: import("@angular/core").Signal<boolean>;
+  private readonly labelled;
+  protected readonly box: import("@angular/core").Signal<{
+    x0: number;
+    x1: number;
+    y0: number;
+    y1: number;
+  }>;
+  private readonly scale;
+  /** Point positions: first and last categories sit on the plot edges. */
+  protected readonly xs: import("@angular/core").Signal<number[]>;
+  protected readonly step: import("@angular/core").Signal<number>;
+  private readonly points;
+  protected readonly lines: import("@angular/core").Signal<string[]>;
+  protected readonly areaD: import("@angular/core").Signal<string>;
+  protected readonly tickMarks: import("@angular/core").Signal<{
+    value: number;
+    y: number;
+  }[]>;
+  protected readonly categoryTicks: import("@angular/core").Signal<{
+    index: number;
+    x: number;
+  }[]>;
+  /** Active point of every series, else the last point (current period). */
+  protected readonly dots: import("@angular/core").Signal<{
+    x: number;
+    y: number;
+    series: number;
+  }[]>;
+  /** Names at line ends; labels that would collide fall back to the legend. */
+  protected readonly endLabels: import("@angular/core").Signal<{
+    series: number;
+    x: number;
+    y: number;
+  }[]>;
+  protected readonly tooltip: import("@angular/core").Signal<{
+    x: number;
+    y: number;
+  } | null>;
+  protected onPointer(event: PointerEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<VdLineChart, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<VdLineChart, "vd-line-chart", never, {
+    "area": {
+      "alias": "area";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+/**
+ * Word-sized trend: line in the de-emphasis ink, current (last) point in the accent.
+ * A single image with a spoken summary. Spec: specs/chart.md
+ */
+export declare class VdSparkline {
+  readonly values: import("@angular/core").InputSignal<readonly (number | null)[]>;
+  /** What the trend shows, e.g. "Дохід за 12 тижнів". */
+  readonly label: import("@angular/core").InputSignal<string>;
+  readonly format: import("@angular/core").InputSignal<VdChartFormat | undefined>;
+  readonly trendSummary: import("@angular/core").InputSignal<((first: string, last: string, min: string, max: string) => string) | undefined>;
+  protected readonly W = 120;
+  protected readonly H = 32;
+  protected readonly t: import("@angular/core").Signal<Pick<{
+    tableLabel: string;
+    categoryLabel: string;
+    trendSummary: (first: string, last: string, min: string, max: string) => string;
+  }, "trendSummary">>;
+  private readonly locale;
+  private readonly numbers;
+  private readonly points;
+  protected readonly line: import("@angular/core").Signal<string>;
+  protected readonly area: import("@angular/core").Signal<string>;
+  protected readonly last: import("@angular/core").Signal<readonly [x: number, y: number] | null>;
+  protected readonly summary: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<VdSparkline, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<VdSparkline, "vd-sparkline", never, {
+    "values": {
+      "alias": "values";
+      "required": false;
+      "isSignal": true;
+    };
+    "label": {
+      "alias": "label";
+      "required": true;
+      "isSignal": true;
+    };
+    "format": {
+      "alias": "format";
+      "required": false;
+      "isSignal": true;
+    };
+    "trendSummary": {
+      "alias": "trendSummary";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+export type { VdBarOrientation, VdChartFormat, VdChartKind };

package/types/vadem-ui-checkbox.d.ts

@@ -0,0 +1,20 @@
+import { VdFieldControlBase } from "@vadem/ui/field";
+import * as i0 from "@angular/core";
+/**
+ * Styles a native `<input type="checkbox">`. Checked state, keyboard and forms stay native.
+ * Spec: specs/checkbox.md
+ */
+export declare class VdCheckbox extends VdFieldControlBase {
+  /** Mixed state (e.g. "select all" with some items selected). Two-way bindable. */
+  readonly indeterminate: import("@angular/core").ModelSignal<boolean>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<VdCheckbox, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<VdCheckbox, "input[type=checkbox][vdCheckbox]", never, {
+    "indeterminate": {
+      "alias": "indeterminate";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "indeterminate": "indeterminateChange";
+  }, never, never, true, never>;
+}

package/types/vadem-ui-color-picker.d.ts

@@ -0,0 +1,171 @@
+import * as i0 from "@angular/core";
+import { OnInit, Signal } from "@angular/core";
+import { FormValueControl } from "@angular/forms/signals";
+/** Safe opaque sRGB HEX; no CSS functions, keywords, alpha or URLs are accepted. */
+declare function vdNormalizeHex(value: unknown): string | null;
+/** Maximum-contrast black/white foreground for arbitrary user color data. */
+declare function vdColorInk(value: string): '#000000' | '#FFFFFF';
+declare function vdColorPaletteKey(index: number, count: number, key: string, rtl: boolean): number | null;
+interface VdColorSwatch {
+  readonly value: string;
+  readonly label: string;
+}
+type VdColorPickerSize = 'sm' | 'md' | 'lg';
+export declare class VdColorPicker implements FormValueControl<string>, OnInit {
+  readonly value: import("@angular/core").ModelSignal<string>;
+  readonly swatches: import("@angular/core").InputSignal<readonly VdColorSwatch[]>;
+  readonly size: import("@angular/core").InputSignal<VdColorPickerSize>;
+  readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly readonly: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly invalid: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly touched: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly required: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly ariaLabel: import("@angular/core").InputSignal<string | undefined>;
+  readonly ariaLabelledby: import("@angular/core").InputSignal<string | undefined>;
+  readonly placeholder: import("@angular/core").InputSignal<string | undefined>;
+  readonly pickerLabel: import("@angular/core").InputSignal<string | undefined>;
+  readonly hexLabel: import("@angular/core").InputSignal<string | undefined>;
+  readonly paletteLabel: import("@angular/core").InputSignal<string | undefined>;
+  readonly applyLabel: import("@angular/core").InputSignal<string | undefined>;
+  readonly errorLabel: import("@angular/core").InputSignal<string | undefined>;
+  /** Text inputs resolved against the active VD_LOCALE. */
+  protected readonly t: Signal<Pick<{
+    placeholder: string;
+    pickerLabel: string;
+    hexLabel: string;
+    paletteLabel: string;
+    applyLabel: string;
+    errorLabel: string;
+  }, "placeholder" | "pickerLabel" | "hexLabel" | "paletteLabel" | "applyLabel" | "errorLabel">>;
+  readonly touch: import("@angular/core").OutputEmitterRef<void>;
+  readonly controlId: string;
+  protected readonly hexId: string;
+  protected readonly errorId: string;
+  protected readonly color: Signal<string | null>;
+  protected readonly draft: import("@angular/core").WritableSignal<string>;
+  protected readonly draftColor: Signal<string | null>;
+  protected readonly draftError: import("@angular/core").WritableSignal<boolean>;
+  protected readonly open: import("@angular/core").WritableSignal<boolean>;
+  protected readonly ink: typeof vdColorInk;
+  protected readonly palette: Signal<{
+    value: string;
+    label: string;
+  }[]>;
+  protected readonly paletteEntry: Signal<number>;
+  private readonly popup;
+  private readonly trigger;
+  private readonly hex;
+  private readonly host;
+  protected readonly field: import("@vadem/ui/field").VdFieldContext | null;
+  private readonly injector;
+  private readonly destroyRef;
+  private readonly formBound;
+  private readonly ngSource;
+  private readonly ngState;
+  protected readonly isDisabled: Signal<boolean>;
+  protected readonly locked: Signal<boolean>;
+  protected readonly isRequired: Signal<boolean>;
+  protected readonly showInvalid: Signal<boolean>;
+  private wasOpen;
+  private lastValue;
+  constructor();
+  ngOnInit(): void;
+  protected rememberState(): void;
+  protected toggle(): void;
+  protected triggerKey(event: KeyboardEvent): void;
+  protected onToggle(event: Event): void;
+  protected edit(event: Event): void;
+  protected validateOnBlur(): void;
+  protected apply(event?: Event): void;
+  protected commit(value: string): void;
+  protected paletteKey(event: KeyboardEvent, index: number): void;
+  protected leavePopup(event: FocusEvent): void;
+  protected onFocusOut(event: FocusEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<VdColorPicker, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<VdColorPicker, "vd-color-picker", never, {
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+    "swatches": {
+      "alias": "swatches";
+      "required": false;
+      "isSignal": true;
+    };
+    "size": {
+      "alias": "size";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+    "readonly": {
+      "alias": "readonly";
+      "required": false;
+      "isSignal": true;
+    };
+    "invalid": {
+      "alias": "invalid";
+      "required": false;
+      "isSignal": true;
+    };
+    "touched": {
+      "alias": "touched";
+      "required": false;
+      "isSignal": true;
+    };
+    "required": {
+      "alias": "required";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaLabel": {
+      "alias": "aria-label";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaLabelledby": {
+      "alias": "aria-labelledby";
+      "required": false;
+      "isSignal": true;
+    };
+    "placeholder": {
+      "alias": "placeholder";
+      "required": false;
+      "isSignal": true;
+    };
+    "pickerLabel": {
+      "alias": "pickerLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "hexLabel": {
+      "alias": "hexLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "paletteLabel": {
+      "alias": "paletteLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "applyLabel": {
+      "alias": "applyLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "errorLabel": {
+      "alias": "errorLabel";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "value": "valueChange";
+    "touch": "touch";
+  }, never, never, true, never>;
+}
+export type { VdColorPickerSize, VdColorSwatch };