Utility Plugins

This collection of plugins adds essential quality-of-life features to your Velo Plot application, focusing on accessibility, internationalization, and user productivity.

Keyboard Shortcuts (PluginKeyboard)

Provides a centralized system for managing keyboard interactions.

Features

• ✅ Global & Scoped Hotkeys: Register shortcuts that work anywhere or only when the chart is focused.
• ✅ Customizable Bindings: Override any default behavior (zoom, pan, reset).
• ✅ Conflict Resolution: Robust handling of overlapping key combinations.

Basic Usage

import { PluginKeyboard } from 'velo-plot/plugins/keyboard';

await chart.use(PluginKeyboard({
  extraShortcuts: [
    { key: 'Cmd+S', action: () => chart.snapshot.downloadSnapshot() },
    { key: 'R', action: () => chart.resetZoom() }
  ]
}));

---

Internationalization (PluginI18n)

Enables localization for date formats, number separators, and UI strings (tooltips, labels).

Features

• ✅ Multi-locale Support: Switch between languages at runtime.
• ✅ Date/Time Localization: Respects regional calendar and time formats.
• ✅ Scientifc Notation: Localized decimal points and thousand separators.

Basic Usage

import { PluginI18n } from 'velo-plot/plugins/i18n';

await chart.use(PluginI18n({
  locale: 'de-DE', // German formatting
  customLocales: {
    'fr-FR': { number: { thousand: ' ', decimal: ',' } }
  }
}));

---

Clipboard Manager (PluginClipboard)

Allows users to copy chart data directly to their system clipboard for use in Excel or other office tools.

Features

• ✅ Copy-Paste Integration: Standard Ctrl+C support for selected data regions.
• ✅ Multiple Formats: Copy as CSV, plain text, or JSON.
• ✅ Visual Feedback: Built-in notifications when data is copied successfully.

Basic Usage

import { PluginClipboard } from 'velo-plot/plugins/clipboard';

await chart.use(PluginClipboard({
  format: 'csv',
  includeHeaders: true,
  notify: true
}));

---

Loading Indicators (PluginLoading)

Shows a customizable loading state while data is being fetched or processed.

Basic Usage

import { PluginLoading } from 'velo-plot/plugins/loading';

await chart.use(PluginLoading({
  type: 'spinner',
  color: '#00f2ff',
  message: 'Loading massive dataset...'
}));

// Trigger state
chart.setLoading(true);

Known limitations

• Bundle entry — pick velo-plot, velo-plot/trading, velo-plot/scientific, or velo-plot/full. See Bundle Architecture.
• WebGPU renderer (renderer: 'webgpu') requires an extended bundle entry and is experimental — use WebGL (default) for production.
• SVG — exportSVG() and renderer: 'svg' require an extended bundle. LaTeX labels and contour overlays are partial; 3D is not supported in SVG. See SVG examples.
• See Plugin status registry for plugin maturity (complete, partial, experimental).