@adia-ai/web-components 0.4.6 → 0.4.8

package/components/card/class.js

@@ -0,0 +1,68 @@
+/**
+ * Non-side-effect class export for `<card-ui>`.
+ *
+ * Importing this file gives you the class(es) without auto-registering the tag.
+ * Useful for test isolation, subclassing with tag-name override, or selective
+ * composition.
+ *
+ * The auto-register path stays at `@adia-ai/web-components/components/card`
+ * (which imports this file + calls `defineIfFree()`).
+ *
+ * @see ../../USAGE.md#registration--auto-vs-explicit
+ */
+
+/**
+ * <card-ui> — Bordered container with header, body, and footer.
+ *
+ * Usage:
+ *   <card-ui>
+ *     <header>
+ *       <span slot="heading">Title</span>
+ *       <span slot="description">Subtitle text</span>
+ *       <button-ui slot="action" variant="ghost" icon="dots-three"></button-ui>
+ *     </header>
+ *     <section>Body content</section>
+ *     <footer>
+ *       <span slot="description">Footer note</span>
+ *       <button-ui slot="action" text="Save" variant="primary"></button-ui>
+ *     </footer>
+ *   </card-ui>
+ *
+ * Attributes:
+ *   variant   — "default" | "outlined" | "filled" | "ghost"
+ *   size      — "sm" | "md" | "lg" (controls padding + font scale)
+ *   elevation — 0-3 (shadow depth)
+ *   raw       — strips all chrome (border, bg, shadow, padding)
+ *   draggable — enables drag handle + cursor:grab; wires the draggable trait
+ */
+
+import { UIElement } from '../../core/element.js';
+import { draggable } from '../../traits/draggable/draggable.js';
+
+export class UICard extends UIElement {
+  static properties = {
+    variant:   { type: String,  default: 'default', reflect: true },
+    size:      { type: String,  default: '',         reflect: true },
+    elevation: { type: Number,  default: 1,          reflect: true },
+    raw:       { type: Boolean, default: false,       reflect: true },
+    draggable: { type: Boolean, default: false,       reflect: true },
+  };
+
+  static template = () => null;
+
+  #dragAttached = false;
+
+  connected() {
+    if (this.draggable && !this.#dragAttached) {
+      this.addTrait(draggable);
+      this.#dragAttached = true;
+    }
+  }
+
+  updated(changed) {
+    if (changed.has('draggable') && this.draggable && !this.#dragAttached) {
+      this.addTrait(draggable);
+      this.#dragAttached = true;
+    }
+  }
+}

package/components/chart/chart.a2ui.json

@@ -133,6 +133,7 @@
   "x-adiaui": {
     "anti_patterns": [],
     "category": "agent",
+    "composes": [],
     "events": {
       "chart-hover": {
         "description": "Fires when the pointer enters a datum (bar / dot / slice). Detail includes {label, value, pct, series, slot, pointerX, pointerY}. Only re-fires when the hovered datum changes — moving inside the same datum is quiet."

package/components/chart/chart.d.ts

@@ -0,0 +1,55 @@
+/**
+ * `<chart-ui>` — Declarative SVG chart supporting 18 types: bar, line, pie, donut, radar, sparkline, segments, area, scatter, radial-bar, gauge, stacked-bar, grouped-bar, multi-line, funnel, treemap, sankey, and composed.
+ *
+ * @see https://ui-kit.exe.xyz/site/components/chart
+ *
+ * Type declarations generated by scripts/build/dts-codegen.mjs from
+ * the component's `.a2ui.json` sidecar. Edit the source `.yaml`,
+ * run `npm run build:components`, then `npm run codegen:dts` to
+ * regenerate; or hand-author this file fully if rich event types are
+ * needed beyond what the yaml `events:` block can express.
+ */
+
+import { UIElement } from '../../core/element.js';
+
+export type ChartHoverEvent = CustomEvent<unknown>;
+export type ChartLeaveEvent = CustomEvent<unknown>;
+export type ChartSelectEvent = CustomEvent<unknown>;
+
+export class UIChart extends UIElement {
+  /** Chart type. All 18 enum values have dedicated render paths in chart.js. */
+  type: 'bar' | 'line' | 'pie' | 'donut' | 'radar' | 'sparkline' | 'segments' | 'area' | 'scatter' | 'radial-bar' | 'gauge' | 'stacked-bar' | 'grouped-bar' | 'multi-line' | 'funnel' | 'treemap' | 'sankey' | 'composed';
+  /** DEPRECATED (OD-CHART-02). Parents should size the chart directly (width/height on the enclosing card or container). Still honored for back-compat; emits a one-shot console.warn per instance when set. */
+  aspect: 'std' | 'wide' | 'square' | 'tall';
+  /** Color scheme */
+  color: 'accent' | 'success' | 'warning' | 'danger' | 'info';
+  /** Number-format mode applied to axis labels + value overlays + donut total + gauge value + treemap value + funnel value + internal tooltip. `abbr` is the legacy 1.2K / 3M format; `decimal` fixes 2 decimals; `currency` prefixes via `--chart-currency-prefix` token (default "$"); `percent` multiplies × 100 and adds a % suffix. */
+  format: 'abbr' | 'decimal' | 'currency' | 'percent';
+  /** DEPRECATED (OD-CHART-02). Place chart titles in an enclosing card-ui's `<header><span slot="heading">...</span></header>` instead. Still honored for back-compat; emits a one-shot console.warn per instance when set. Used as the chart's `aria-label` when no explicit label is provided. */
+  heading: string;
+  /** When true, suppress the overlaid average line */
+  hideAverage: boolean;
+  /** Hide gridlines */
+  hideGrid: boolean;
+  /** Hide value labels */
+  hideValues: boolean;
+  /** Bar corner radius (null = let CSS tokens decide) */
+  radius: number;
+  /** Chart size */
+  size: 'sm' | 'md' | 'lg';
+  /** Line smoothing factor */
+  smooth: number;
+  /** Data key for x-axis (category) values */
+  x: string;
+  /** Y-axis key(s), comma-separated for multi-series */
+  y: string;
+
+  addEventListener<K extends keyof HTMLElementEventMap>(
+    type: K,
+    listener: (this: UIChart, ev: HTMLElementEventMap[K]) => unknown,
+    options?: boolean | AddEventListenerOptions,
+  ): void;
+  addEventListener(type: 'chart-hover', listener: (ev: ChartHoverEvent) => unknown, options?: boolean | AddEventListenerOptions): void;
+  addEventListener(type: 'chart-leave', listener: (ev: ChartLeaveEvent) => unknown, options?: boolean | AddEventListenerOptions): void;
+  addEventListener(type: 'chart-select', listener: (ev: ChartSelectEvent) => unknown, options?: boolean | AddEventListenerOptions): void;
+}