openalgo-charts 2.4.7 → 2.4.8

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.
package/README.md CHANGED
@@ -2,23 +2,64 @@
2
2
 
3
3
  # OpenAlgo Charts
4
4
 
5
- **A from-scratch, dependency-free HTML5-canvas charting engine for OpenAlgo.**
5
+ **A JavaScript and TypeScript library for financial charts.**
6
6
 
7
- Professional interactive charts, 105 built-in indicators plus your own custom ones, 85 drawing tools, order flow, market replay, linked chart grids, on-chart trading, vector SVG export and an optional WebGL2 backend. Nine lazy-loaded tiers, zero runtime dependencies, 92.83 kB Brotli for the base engine, and a one-call widget tier that adds the toolbar, drawing rail, dialogs and shortcuts.
7
+ Show market prices, add indicators and drawings, set alerts, and replay historical
8
+ data in your web app. Use your own data and interface, or add the optional widget
9
+ for a toolbar, menus and dialogs. Built for OpenAlgo and custom trading apps,
10
+ with no runtime dependencies.
8
11
 
9
12
  [![npm version](https://img.shields.io/npm/v/openalgo-charts.svg?color=cb3837&label=npm)](https://www.npmjs.com/package/openalgo-charts)
10
13
  [![license](https://img.shields.io/badge/license-Apache--2.0-blue.svg)](./LICENSE)
11
- [![bundle](https://img.shields.io/badge/brotli-92.83%20kB%20base%20%C2%B7%20246.52%20kB%20all%20tiers-brightgreen.svg)](#size-budget)
12
- [![tests](https://img.shields.io/badge/engine%20tests-5841%20passing-brightgreen.svg)](#develop)
14
+ [![npm downloads](https://img.shields.io/npm/dm/openalgo-charts.svg?color=0ea5e9&label=npm%20downloads)](https://www.npmjs.com/package/openalgo-charts)
15
+ [![tests](https://img.shields.io/badge/engine%20tests-5854%20passing-brightgreen.svg)](#develop)
13
16
  [![dependencies](https://img.shields.io/badge/runtime%20deps-0-brightgreen.svg)](#principles)
14
17
 
15
18
  [**Documentation**](https://marketcalls.github.io/openalgo-charts/)  ·  [**Live examples**](https://marketcalls.github.io/openalgo-charts/examples)  ·  [**Getting started**](./docs/getting-started.md)  ·  [**Migrating to 2.0**](./docs/migrating-to-2.md)  ·  [**Architecture**](./ARCHITECTURE.md)
16
19
 
17
- <img src="docs/architecture-diagram.svg" alt="OpenAlgo Charts architecture: seven layers from the public API down to feeds and data, with 105 built-in plus custom indicators, 85 drawing tools, and a nine-tier bundle legend" width="920" />
18
-
19
20
  </div>
20
21
 
21
- ---
22
+ ## Install
23
+
24
+ ```bash
25
+ npm install openalgo-charts
26
+ ```
27
+
28
+ Current version: **2.4.8**. Hold the plot to move it in any direction; release to stop.
29
+ See the [changelog](./CHANGELOG.md) for release notes.
30
+
31
+ ## Quick start
32
+
33
+ Give the chart a container with a height:
34
+
35
+ ```html
36
+ <div id="chart" style="width:100%;height:420px"></div>
37
+ ```
38
+
39
+ Then create a chart and supply its data:
40
+
41
+ ```ts
42
+ import { createChart, generateBars } from 'openalgo-charts';
43
+
44
+ const container = document.getElementById('chart');
45
+ if (!container) throw new Error('Chart container not found');
46
+
47
+ const chart = createChart(container);
48
+ chart.addSeries('candlestick').setData(generateBars(1700000000, 200, 3600));
49
+ chart.fitContent();
50
+ ```
51
+
52
+ `generateBars` supplies sample prices. Replace them with data from your feed.
53
+ Bar timestamps use UTC seconds. See [getting started](./docs/getting-started.md)
54
+ for setup, [data feeds](https://marketcalls.github.io/openalgo-charts/docs/data-feeds/)
55
+ for live data, or [the widget example](#the-whole-terminal-in-one-call) for chart controls.
56
+
57
+ ## Architecture
58
+
59
+ <a href="docs/architecture-diagram.svg"><img src="docs/architecture-diagram.svg" alt="OpenAlgo Charts 2.4.8 architecture: host responsibilities, the base data-to-rendering pipeline with alerts and shared replay, and eight optional tiers including workspace storage, trading tools and the widget" width="920" /></a>
60
+
61
+ How data reaches the chart, what your app owns, and which features you can import.
62
+ [Open the full-size diagram](docs/architecture-diagram.svg).
22
63
 
23
64
  ## Walkthrough video
24
65
 
@@ -51,30 +92,6 @@ Every chart in the [live gallery](https://marketcalls.github.io/openalgo-charts/
51
92
  <img src="docs/demo4.png" alt="More live OpenAlgo Charts examples" width="49%" />
52
93
  </p>
53
94
 
54
- ## Install
55
-
56
- Current version: **2.4.7**.
57
-
58
- Drag a price or study-threshold alert line to preview a new level, then release
59
- to save it once. Escape cancels the draft; range bounds stay ordered. Stored
60
- thresholds and live evaluation remain unchanged during preview. See the
61
- [2.4.7 changelog](./CHANGELOG.md#247) and the [live example](https://marketcalls.github.io/openalgo-charts/examples/#alert-threshold-dragging).
62
-
63
- To try dragging locally, run the [yfinance reference host](./examples/yfinance/README.md),
64
- create a price alert from the chart context menu, and drag its dashed line or
65
- **Alert** badge. Study and range alerts use the same controls.
66
-
67
- ```bash
68
- npm install openalgo-charts
69
- ```
70
-
71
- ```ts
72
- import { createChart, generateBars } from 'openalgo-charts';
73
-
74
- const chart = createChart(document.getElementById('chart'));
75
- chart.addSeries('candlestick').setData(generateBars(1700000000, 200, 3600));
76
- ```
77
-
78
95
  ## Branding and optional watermark
79
96
 
80
97
  Version 2.1.9 adds default corner branding and an optional background
@@ -85,22 +102,22 @@ See the [branding guide](https://marketcalls.github.io/openalgo-charts/docs/bran
85
102
 
86
103
  ## No build step
87
104
 
88
- Every release is on unpkg and jsDelivr the moment it is published, because both sit
89
- in front of npm rather than being places you upload to. A chart is one HTML file:
105
+ You can also load the library from a CDN in a plain HTML page:
90
106
 
91
107
  ```html
92
108
  <div id="chart" style="width:100vw;height:100vh"></div>
93
109
  <script type="module">
94
- import { createChart } from 'https://unpkg.com/openalgo-charts@2.4.7/dist/openalgo-charts.mjs';
110
+ import { createChart, generateBars } from 'https://unpkg.com/openalgo-charts@2.4.8/dist/openalgo-charts.mjs';
95
111
  const chart = createChart(document.getElementById('chart'), { timezone: 'Asia/Kolkata' });
96
- chart.addSeries('candlestick').setData(bars);
112
+ chart.addSeries('candlestick').setData(generateBars(1700000000, 200, 3600));
113
+ chart.fitContent();
97
114
  </script>
98
115
  ```
99
116
 
100
- Each tier is its own file, so `openalgo-charts.indicators.mjs` next to it registers
101
- all 105 built-ins. Pin the version in anything you leave running. There is no
102
- stylesheet to load: the engine ships no DOM, and the one tier that does
103
- (`openalgo-charts/widget`) injects its own. See
117
+ Each optional tier has its own file. For example,
118
+ `openalgo-charts.indicators.mjs` registers all 105 built-in indicators. Pin the
119
+ version in production. The base chart needs no stylesheet; the widget adds its
120
+ own styles. See
104
121
  [Use from a CDN](https://marketcalls.github.io/openalgo-charts/docs/cdn).
105
122
 
106
123
  ## The whole terminal in one call
@@ -123,27 +140,34 @@ widget.chart; // the Chart underneath, every base API available
123
140
  widget.draw; // the DrawingController the rail drives
124
141
  ```
125
142
 
126
- `openalgo-charts/widget` is the optional interface tier and the only one that builds DOM: a top bar (symbol search, interval pills, chart type, Indicators, capture, settings, theme), the drawing rail with pins and flyouts, a status line, responsive mobile header and bottom controls, toasts, a right-click menu, a keymap with a `?` panel, and optional layout persistence. Every dialog is generated from a schema the engine already ships (`chartSettingsSchema`, the indicator descriptor, `drawingSettingsSchema`), so no control exists without something behind it, and the chrome takes its colours from the active `ChartTheme` through `--oac-` tokens, so `setTheme` recolours canvas and chrome together. It drives the engine only through the public API, and the build proves it: the ESLint tier ACL and `npm run shake` keep it out of every other bundle, and importing the module touches no DOM, so it can sit in code that also runs on a server. The guide is [`docs/widget.md`](./docs/widget.md).
143
+ The optional widget adds symbol search, interval and chart-type controls, a drawing
144
+ toolbar, settings, indicators, a status line, mobile controls and layout persistence.
145
+ Its dialogs use the chart's settings schemas and follow the active theme.
146
+
147
+ The widget uses the same public API as a custom interface. Your app supplies the
148
+ data feed and handles order requests; the widget does not choose a broker or send
149
+ orders on its own. See the [widget guide](./docs/widget.md).
127
150
 
128
151
  Widget controls and accessible labels accept a typed translation callback with English fallback. See [widget localization](./docs/widget-localization.md). The separate `openalgo-charts/workspace` tier provides validated named layouts, indicator templates and asynchronous storage, with an IndexedDB adapter and revision conflict detection. See [workspaces](./docs/workspaces.md).
129
152
 
130
153
  ## Tiers
131
154
 
132
- Import only what you use. Each tier is a separate bundle that registers into the base engine's registries, so the cost of a feature you don't load is zero.
155
+ Import only the features you need. A tier is a separate bundle of features.
156
+ Unused optional tiers stay out of the base chart download.
133
157
 
134
158
  | Import | Contents | Brotli |
135
159
  |---|---|---|
136
- | `openalgo-charts` | Engine, 13 chart types, panes &amp; scales, primitives, registries, chart state, chart linking, bar cache, interval registry, trading overlay, SVG export, render backend port, OpenAlgo feeds | 92.83 kB |
137
- | `openalgo-charts/indicators` | 105 built-in indicators, the `registerIndicator` contract for your own, and the Tier-2 (external-data) contract | 29.84 kB |
160
+ | `openalgo-charts` | Engine, 13 chart types, panes and scales, custom indicator registry, primitives, alerts, replay, comparisons, chart linking, state, feeds, bar cache, trading overlays, CSV and SVG export | 92.94 kB |
161
+ | `openalgo-charts/indicators` | 105 built-in indicators, calculation helpers and helpers for studies that use external data | 29.84 kB |
138
162
  | `openalgo-charts/draw` | 85 drawing tools + a headless drawing controller, clipboard, settings schema, level palette, freehand geometry and SVG icons | 35.43 kB |
139
163
  | `openalgo-charts/transform` | Heikin Ashi, Renko, Range bars, Line Break, Point &amp; Figure, Kagi, and symbol arithmetic (`AAPL/MSFT`) | 4.50 kB |
140
164
  | `openalgo-charts/profile` | Volume Profile, Market Profile (TPO) with compact pixel letters, Footprint, order flow | 14.96 kB |
141
- | `openalgo-charts/trade` | Order / position / bracket tools + DOM ladder | 8.01 kB |
142
- | `openalgo-charts/webgl` | WebGL2 series backend: batched, analytically anti-aliased GPU rendering of the standard chart types behind `renderer: 'auto'`, with a session-long fallback to the 2D path | 6.39 kB |
143
- | `openalgo-charts/widget` | The chart with its chrome in one call: `createWidget` adds a top bar, the drawing rail, a status line, the settings and indicator dialogs, drawing properties, a right-click menu, a keymap with a `?` panel and optional layout persistence. The only tier that ships DOM | 49.03 kB |
165
+ | `openalgo-charts/trade` | Order, position and bracket tools, plus a depth-of-market ladder | 8.01 kB |
166
+ | `openalgo-charts/webgl` | GPU drawing for supported series, with Canvas 2D fallback | 6.39 kB |
167
+ | `openalgo-charts/widget` | `createWidget`: toolbar, drawing controls, dialogs, mobile controls, status line, shortcuts and optional layout persistence | 49.03 kB |
144
168
  | `openalgo-charts/workspace` | Validated workspace and indicator-template documents, named catalogs with revision checks, asynchronous storage and an IndexedDB adapter; no DOM | 5.52 kB |
145
169
 
146
- Everything together is **246.52 kB Brotli**; a widget terminal with built-in indicators (base + draw + indicators + widget) is 207.13 kB. Figures are measured from the 2.4.7 release build. The trade tier is 8.01 kB on its own; base + trade costs 100.84 kB. Sizes use decimal kB.
170
+ Everything together is **246.63 kB Brotli**; a widget terminal with built-in indicators (base + draw + indicators + widget) is 207.24 kB. Figures are measured from the 2.4.8 release build. The trade tier is 8.01 kB on its own; base + trade costs 100.95 kB. Sizes use decimal kB.
147
171
 
148
172
  ## What's built
149
173
 
@@ -168,11 +192,28 @@ Every built-in is measured against its standard definition bar by bar, at severa
168
192
 
169
193
  The chart owns the whole lifecycle: series, pane placement, reference levels, fixed ranges (RSI 0..100), recompute on data change, teardown. Every plot gets colour, opacity, thickness, and line style for free, generated from the descriptor. Write your own with `registerIndicator`, or use the **Tier-2 contract** for indicators whose data arrives independently of the chart's bars (CVD or an external feed).
170
194
 
171
- The development data contract includes optional per-bar `oi` for open interest.
195
+ The bar data contract includes optional per-bar `oi` for open interest.
172
196
  It is a level, not a flow: folds retain the latest reading instead of summing it.
173
197
  Zero and absence remain distinct, and live quotes without a reading leave a gap.
174
198
  See [Open interest data](docs/open-interest.md).
175
199
 
200
+ ### Alerts
201
+
202
+ Set conditions on price, study values, drawing levels or bars. The chart evaluates
203
+ them and your app handles notification delivery. Alerts default to confirmed bar
204
+ closes and keep their state when restored.
205
+
206
+ Drag a price or study alert line to preview a new level, then release to save it.
207
+ Escape cancels the draft, and range bounds stay ordered. Stored thresholds and
208
+ live evaluation keep their original values during the drag. See the
209
+ [alert guide](https://marketcalls.github.io/openalgo-charts/docs/alerts/),
210
+ [2.4.7 changelog](./CHANGELOG.md#247) and
211
+ [live example](https://marketcalls.github.io/openalgo-charts/examples/#alert-threshold-dragging).
212
+
213
+ To try it locally, run the [yfinance reference host](./examples/yfinance/README.md),
214
+ create a price alert from the chart context menu, and drag its dashed line or
215
+ **Alert** badge. Study and range alerts use the same controls.
216
+
176
217
  ### Drawing tools
177
218
 
178
219
  ```ts
@@ -448,17 +489,17 @@ Enforced in CI by [`size-limit`](./.size-limit.json). Nothing is excluded, becau
448
489
 
449
490
  | Bundle | Limit | Actual |
450
491
  |---|---|---|
451
- | Base engine | 93.5 kB | 92.83 kB |
452
- | Base + trade | 101.5 kB | 100.84 kB |
492
+ | Base engine | 93.5 kB | 92.94 kB |
493
+ | Base + trade | 101.5 kB | 100.95 kB |
453
494
  | Indicators tier | 30 kB | 29.84 kB |
454
495
  | Draw tier | 36 kB | 35.43 kB |
455
496
  | Transform tier | 6 kB | 4.50 kB |
456
497
  | Profile tier | 15 kB | 14.96 kB |
457
498
  | WebGL2 tier | 7 kB | 6.39 kB |
458
499
  | Widget tier | 49.25 kB | 49.03 kB |
459
- | Widget terminal (base + draw + indicators + widget) | 207.75 kB | 207.13 kB |
500
+ | Widget terminal (base + draw + indicators + widget) | 207.75 kB | 207.24 kB |
460
501
  | Workspace tier | 6 kB | 5.52 kB |
461
- | **Everything** | 247.25 kB | 246.52 kB |
502
+ | **Everything** | 247.25 kB | 246.63 kB |
462
503
 
463
504
  ## Documentation
464
505
 
@@ -503,7 +544,7 @@ See [Contributing](./CONTRIBUTING.md) for setup, targeted checks, documentation
503
544
  ```bash
504
545
  npm install # install dev toolchain
505
546
  npm run typecheck # strict TypeScript check
506
- npm test # engine unit tests (Vitest): 5841 across 246 files
547
+ npm test # engine unit tests (Vitest): 5854 across 246 files
507
548
  npm run test:demo # reference-host tests: 401 across 31 files
508
549
  npm run test:endurance # node endurance-harness tests: 7 cases
509
550
  npm run build # Rollup -> dist/ (minified ESM per tier + types)
@@ -522,7 +563,7 @@ npm run verify # lint + types + unit + endurance harness + build + demo + dt
522
563
 
523
564
  ## Status &amp; limitations
524
565
 
525
- Version **2.4.7**. All engine build phases are implemented. Upgrading a 1.9.x host: [Migrating to 2.0](./docs/migrating-to-2.md).
566
+ Version **2.4.8**. All engine build phases are implemented. Upgrading a 1.9.x host: [Migrating to 2.0](./docs/migrating-to-2.md).
526
567
 
527
568
  Known gaps, stated plainly:
528
569
 
package/dist/index.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { TradingCapabilitySource as TradingCapabilitySource$1 } from 'openalgo-charts';
2
2
 
3
3
  /** Library version string. Matches package.json (including locally prepared releases). */
4
- declare const VERSION = "2.4.7";
4
+ declare const VERSION = "2.4.8";
5
5
  /** Returns the current library version. */
6
6
  declare function version(): string;
7
7
 
@@ -5491,6 +5491,7 @@ declare class Chart {
5491
5491
  */
5492
5492
  private readonly _onPointerUpNative;
5493
5493
  private readonly _onPointerCancel;
5494
+ private readonly _onLostPointerCapture;
5494
5495
  private _brandingHit;
5495
5496
  private readonly _onPointerLeave;
5496
5497
  private readonly _onWheel;