Skip to content

Repository navigation

docs: align README with org template #51

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
joeblau merged 1 commit into from
Oct 12, 2026
Merged

docs: align README with org template #51

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
105 changes: 40 additions & 65 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,61 +6,46 @@
</p>

<p align="center">
<a href="https://www.npmjs.com/package/@bloxwap/chart"><img alt="npm version" src="https://img.shields.io/npm/v/@bloxwap/chart?color=blue&style=flat-square"></a>
<a href="https://www.npmjs.com/package/@bloxwap/chart"><img alt="npm downloads" src="https://img.shields.io/npm/dm/@bloxwap/chart.svg?style=flat-square"></a>
<a href="https://codecov.io/gh/bloxwap/chart"><img alt="Codecov coverage" src="https://img.shields.io/codecov/c/github/bloxwap/chart?branch=main&style=flat-square"></a>
<a href="https://bundlejs.com/?q=@bloxwap/chart"><img alt="Bundle size" src="https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fdeno.bundlejs.com%2F%3Fq%3D%40bloxwap%2Fchart&amp;query=%24.size.compressedSize&amp;label=minzipped+size&amp;style=flat-square&amp;color=blue"></a>
<a href="https://www.npmjs.com/package/@bloxwap/chart"><img src="https://img.shields.io/npm/v/@bloxwap/chart?style=flat-square" alt="npm version"></a>
<a href="https://www.npmjs.com/package/@bloxwap/chart"><img src="https://img.shields.io/npm/dm/@bloxwap/chart?style=flat-square" alt="npm downloads"></a>
<a href="https://codecov.io/gh/bloxwap/chart"><img src="https://img.shields.io/codecov/c/github/bloxwap/chart?style=flat-square" alt="Codecov"></a>
<a href="https://bundlejs.com/?q=@bloxwap/chart"><img src="https://img.shields.io/bundlejs/size/@bloxwap/chart?style=flat-square" alt="bundle size"></a>
</p>

## Features

- **Zero runtime dependencies** — pure ESM, `sideEffects: false`, tree-shakable.
- **WASM + SIMD kernels** — hot math paths with automatic scalar-JS fallback.
- **Cross-environment** — injected DOM means the library never touches global
`document`/`window`; it runs in browsers, workers, SSR, and tests.
- **One consolidated config** — a single `ChartConfig` describes data, panes,
series, indicators, drawings, axes, crosshair, grid, theme, and watermark.
- **20 indicators** — moving averages, Bollinger Bands, VWAP, Ichimoku,
Supertrend, MACD, RSI, Stochastic, ADX, volume and more, with per-plot
styling, an indicator dialog, and a registry for custom ones.
- **Paging datafeed** — `@bloxwap/chart/datafeed` pages history in as the user
scrolls and folds live ticks into bars, replacing a TradingView UDF datafeed.
- **TradingView parity** — header bar, context menus, touch gestures, price
lines and markers, Heikin Ashi and hollow candles, and brand presets. See the
[migration guide](https://bloxwap.github.io/chart/docs/guides/tradingview-migration/).
- **89 drawing tools** — TradingView-style groups: lines, channels, pitchforks,
Fibonacci, Gann, harmonic patterns, Elliott waves, shapes, and annotations.
- **Display-P3 colors** — wide-gamut colors flow straight to the canvas, with
automatic label contrast.
- **Tested** — line, branch, and function coverage measured by `npm run coverage`, with a 100% target.

## Documentation

Browse the [documentation and interactive playground](https://bloxwap.github.io/chart/)
for guides, an API reference, and the complete chart controls.
- **Zero runtime dependencies.** Pure ESM, `sideEffects: false`, tree-shakable.
- **WASM + SIMD kernels.** Hot math paths with automatic scalar-JS fallback.
- **Cross-environment.** Injected DOM means the library never touches global `document`/`window`; it runs in browsers, workers, SSR, and tests.
- **One consolidated config.** A single `ChartConfig` describes data, panes, series, indicators, drawings, axes, crosshair, grid, theme, and watermark.
- **20 indicators.** Moving averages, Bollinger Bands, VWAP, Ichimoku, Supertrend, MACD, RSI, Stochastic, ADX, volume and more, with per-plot styling, an indicator dialog, and a registry for custom ones.
- **Paging datafeed.** `@bloxwap/chart/datafeed` pages history in as the user scrolls and folds live ticks into bars, replacing a TradingView UDF datafeed.
- **TradingView parity.** Header bar, context menus, touch gestures, price lines and markers, Heikin Ashi and hollow candles, and brand presets. See the [migration guide](https://bloxwap.github.io/chart/docs/guides/tradingview-migration/).
- **89 drawing tools.** TradingView-style groups: lines, channels, pitchforks, Fibonacci, Gann, harmonic patterns, Elliott waves, shapes, and annotations.
- **Display-P3 colors.** Wide-gamut colors flow straight to the canvas, with automatic label contrast.
- **Tested.** 100% line, branch, and function coverage enforcement.

## Installation

```sh
npm install @bloxwap/chart
```

## Release status

`0.3.0` is an early developer preview; expect breaking changes before `1.0`.

## Quick Example
## Usage

```ts
// 1. Import module
import { createChart, defineConfig } from '@bloxwap/chart';

// 2. Describe the chart in one config object
const config = defineConfig({
data: candles, // [{ time, open, high, low, close, volume? }] — UNIX seconds
data: candles, // [{ time, open, high, low, close, volume? }] (UNIX seconds)
series: { type: 'candlestick', upColor: 'color(display-p3 0 1 0.5)', downColor: '#ef5350' },
watermark: { visible: true, text: 'ACME', opacity: 0.08 },
});

// 3. Create the chart on a canvas
const chart = createChart({ container: document.querySelector('canvas')!, config });
await chart.ready; // WASM kernels live (or JS fallback chosen)

Expand All @@ -77,59 +62,49 @@ import { createChart, MockDocument } from '@bloxwap/chart';
const chart = createChart({ document: new MockDocument(), config: { data: candles } });
```

For custom indicators and drawings, icons, the settings card, and performance
tuning, see the [library API and features](packages/chart/README.md) and the
[performance measurements](packages/chart/PERFORMANCE.md).
For custom indicators and drawings, icons, the settings card, and performance tuning, see the [library API and features](packages/chart/README.md) and the [performance measurements](packages/chart/PERFORMANCE.md).

## Repository layout

| Workspace | Purpose |
| --- | --- |
| [`packages/chart`](packages/chart) | Published library, tests, icons, fonts, benchmarks, and build scripts |
| [`apps/docs`](apps/docs) | Fumadocs documentation and GitHub Pages site |
| [`apps/playground`](apps/playground) | Full interactive chart demo, also embedded in the docs |
## Documentation

The repository uses npm workspaces with one root lockfile. Each workspace declares
its own dependencies; the chart package has no runtime dependencies.
Guides, API reference, and the complete chart controls: **https://bloxwap.github.io/chart/**

## Development

Use Node.js 24 or newer. Run commands from the repository root:
The repository uses npm workspaces with one root lockfile. Each workspace declares its own dependencies; the chart package has no runtime dependencies.

```sh
npm ci
npm run docs:dev
npm test # build and run the library tests
npm run coverage # tests with 100% line, branch, and function coverage enforcement
npm run bench # calculation and rendering benchmarks
npm run demo # interactive playground at http://localhost:8641/demo/ (requires Bun)
npm run docs:dev # docs dev server at http://localhost:3902
npm run docs:check # check documentation types
npm run docs:build # export the docs and validate local links and assets
npm run docs:preview # serve the exported site locally
npm run pack:chart # build and package the library into packages/chart/*.tgz
```

Open http://localhost:3902. For the standalone playground, run `npm run demo`
(requires Bun) and open http://localhost:8641/demo/.
Requires Node.js 24 or newer.

## Repository layout

| Command | Purpose |
| Workspace | Purpose |
| --- | --- |
| `npm run build` | Generate icons, compile embedded WASM, and build the library |
| `npm test` | Build and run the library tests |
| `npm run coverage` | Check library test coverage |
| `npm run bench` | Run calculation and rendering benchmarks |
| `npm run demo` | Build and serve the interactive playground |
| `npm run docs:dev` | Build the embedded demo and start the docs dev server |
| `npm run docs:check` | Check documentation types |
| `npm run docs:build` | Export the docs and validate local links and assets |
| `npm run docs:preview` | Serve the exported site locally |
| `npm run pack:chart` | Build and package the library into `packages/chart/*.tgz` |
| [`packages/chart`](packages/chart) | Published library, tests, icons, fonts, benchmarks, and build scripts |
| [`apps/docs`](apps/docs) | Fumadocs documentation and GitHub Pages site |
| [`apps/playground`](apps/playground) | Full interactive chart demo, also embedded in the docs |

## GitHub Pages

The [documentation workflow](.github/workflows/docs.yml) validates pull requests
and deploys pushes to `main`. To check the project path locally:
The [documentation workflow](.github/workflows/docs.yml) validates pull requests and deploys pushes to `main`. To check the project path locally:

```sh
NEXT_PUBLIC_BASE_PATH=/chart npm run docs:build
npm run docs:preview
```

The static preview opens at http://localhost:3902/chart/. Stop the docs dev server
first, or use `PORT=3902 npm run docs:preview` to preview alongside it. See
[the docs development guide](apps/docs/README.md) for editing and deployment details.
The static preview opens at http://localhost:3902/chart/. Stop the docs dev server first, or use `PORT=3902 npm run docs:preview` to preview alongside it. See [the docs development guide](apps/docs/README.md) for editing and deployment details.

## License

Expand Down
Loading