# Source: `components/velin-sparkline.js` ## Description Tiny inline-SVG line chart for KPI tiles, live dashboards, and "this week" trends. Renders into light DOM (no Shadow) so theme tokens cascade in for stroke color via `currentColor`. Animates the stroke draw-in once on mount using the chart-animation utility classes; calling `update(values)` swaps the path and runs a short value-bump on the host. Attributes: values CSV or JSON-array of numbers width viewBox width (default 320) height viewBox height (default 96) min/max clamp range (optional; otherwise derived from values) area truthy enables the gradient area fill glow truthy enables continuous drop-shadow pulse animate "draw" (default) or "none" label accessible label; sets role=img + aria-label Public API: element.update(values: number[]): replaces the path with a new dataset. element.values: number[] reflect getter/setter. ## Accessibility WCAG contract status: **pass** (framework target: AAA). - **Roles:** `img`, `presentation` - **Required attributes:** `label` - **Notes:** Uses label, aria-label, or figcaption aria-labelledby. ## Attributes | Attribute | Notes | | --- | --- | | `values` | Observed — triggers `attributeChangedCallback` when changed | | `width` | Observed — triggers `attributeChangedCallback` when changed | | `height` | Observed — triggers `attributeChangedCallback` when changed | | `min` | Observed — triggers `attributeChangedCallback` when changed | | `max` | Observed — triggers `attributeChangedCallback` when changed | | `area` | Observed — triggers `attributeChangedCallback` when changed | | `glow` | Observed — triggers `attributeChangedCallback` when changed | | `animate` | Observed — triggers `attributeChangedCallback` when changed | | `label` | Observed — triggers `attributeChangedCallback` when changed | ## Events _None._ ## CSS parts _None._ ## Slots _None._ ## Public API | Kind | Name | | --- | --- | | Method | `update()` | | Property | `values` | | Property | `values (setter)` |