@wick-charts/vue 0.3.3 → 0.3.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wick-charts/vue",
-  "version": "0.3.3",
+  "version": "0.3.4",
   "description": "High-performance canvas timeseries charts for Vue — candlestick, line, bar, pie. Tree-shakeable, zero runtime deps.",
   "license": "MIT",
   "repository": {
@@ -45,7 +45,7 @@
     "vue": ">=3.3.0"
   },
   "devDependencies": {
-    "@wick-charts/core": "^0.3.3"
+    "@wick-charts/core": "^0.3.4"
   },
   "scripts": {
     "build": "vite build"

package/src/ChartContainer.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import {
+  type AnimationsConfig,
   type AxisConfig,
   ChartInstance,
   type ChartOptions,
@@ -48,6 +49,19 @@ const props = withDefaults(
      * - `'inline'`: flex siblings above the canvas — the canvas (and grid) shift down.
      */
     headerLayout?: 'overlay' | 'inline';
+    /**
+     * Chart-level animation configuration. See `AnimationsConfig` for the full shape.
+     *
+     * Two layers — chart-level (this prop) sets defaults for every series; per-series
+     * options on `<LineSeries>`/`<CandlestickSeries>`/`<BarSeries>` override that
+     * default for that one series.
+     *
+     * Shorthands: `true` / omitted — built-in defaults; `false` — disables every
+     * animation category; `{ points: false }` / `{ viewport: false }` disables a
+     * category. Updating this prop calls `chart.setAnimations(...)` so the new
+     * durations take effect on the next animation / render.
+     */
+    animations?: boolean | AnimationsConfig;
     /**
      * Enable runtime performance instrumentation. Off by default. Read at mount only;
      * later changes are ignored.
@@ -138,6 +152,7 @@ onMounted(async () => {
   if (props.interactive !== undefined) options.interactive = props.interactive;
   if (props.grid !== undefined) options.grid = props.grid;
   if (perfAtMount !== undefined) options.perf = perfAtMount;
+  if (props.animations !== undefined) options.animations = props.animations;
   chart.value = new ChartInstance(containerRef.value, options);
 
   await nextTick();
@@ -187,6 +202,17 @@ watch(
   },
 );
 
+// Stringify the animations config so callers can pass a fresh object identity
+// without thrashing animator state when nothing has actually changed.
+watch(
+  () => JSON.stringify(props.animations),
+  () => {
+    if (chart.value && props.animations !== undefined) {
+      chart.value.setAnimations(props.animations);
+    }
+  },
+);
+
 // Re-apply padding on any input that affects it — including `headerExtra`,
 // so a runtime `headerLayout` toggle re-runs even when `padding` is undefined
 // (the default top=20 still needs the fold-in/out).

package/src/ui/TimeAxis.vue

@@ -101,7 +101,7 @@ const tickData = computed(() => {
         userSelect: 'none',
         whiteSpace: 'nowrap',
         opacity: entry.opacity,
-        transition: 'opacity 0.3s ease',
+        transition: 'opacity 0.25s ease',
         willChange: 'opacity',
       }"
     >

package/src/ui/YAxis.vue

@@ -109,7 +109,7 @@ const allTicks = computed(() => {
         fontVariantNumeric: 'tabular-nums',
         userSelect: 'none',
         opacity: entry.opacity,
-        transition: 'opacity 0.3s ease',
+        transition: 'opacity 0.25s ease',
         willChange: 'opacity',
       }"
     >