@heyramzi/ui 2.4.0 → 2.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/src/charts/area-chart.svelte +11 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@heyramzi/ui",
3
- "version": "2.4.0",
3
+ "version": "2.5.0",
4
4
  "description": "Svelte 5 UI for apps: primitives, effects and animations, plus tasks, charts, slides, an editor, onboarding and a canvas as subpaths.",
5
5
  "homepage": "https://ui.heyramzi.com",
6
6
  "license": "MIT",
package/src/charts/area-chart.svelte CHANGED
@@ -45,6 +45,8 @@
45
45
  xTicks?: number;
46
46
  /** A target drawn across the plot, like the deal a cost runs up to. */
47
47
  reference?: ChartReference;
48
+ /** The headline while no point is hovered, like a period total. Defaults to the last point. */
49
+ resting?: { value: number; label: string };
48
50
  class?: string;
49
51
  }
50
52
 
@@ -65,6 +67,7 @@
65
67
  formatX = (v) => String(v),
66
68
  xTicks = 6,
67
69
  reference,
70
+ resting,
68
71
  class: className,
69
72
  }: Props = $props();
70
73
 
@@ -127,7 +130,14 @@
127
130
  aria-label="Area chart"
128
131
  onpointerleave={() => (active = null)}
129
132
  >
130
- {#if figureRows && display}
133
+ {#if resting && !active && series[0]}
134
+ <Figure
135
+ series={[{ value: resting.value, label: series[0].label, color: series[0].color }]}
136
+ eyebrow={resting.label}
137
+ format={formatValue}
138
+ size="md"
139
+ />
140
+ {:else if figureRows && display}
131
141
  <Figure series={figureRows} eyebrow={formatX(display[xKey])} format={formatValue} size="md" />
132
142
  {:else}
133
143
  <Figure value="—" eyebrow="Latest" size="md" />