@dwlf/charting 1.0.0 → 1.1.0

package/dist/index.d.ts

@@ -0,0 +1,56 @@
+export { default as DWLFChart } from './components/DWLFChart';
+export type { DwlfChartHandle, DWLFChartProps, AxisColorConfig } from './components/DWLFChart';
+export type { Candle, ChartSpec, LinePoint, OhlcPoint, PaneGuide, PaneSpec, SeriesSpec, SeriesType, SeriesStyle, TooltipFormatter, PaneComputedScale, AnnotationType, LineStyle, AnnotationBase, HLineAnnotation, VLineAnnotation, TextAnnotation, TrendLineAnnotation, RayAnnotation, CrossLineAnnotation, RectangleAnnotation, EmojiAnnotation, TimeRangeAnnotation, ArrowAnnotation, ChannelAnnotation, FibRetracementAnnotation, MeasureAnnotation, AlertLineAnnotation, BrushPoint, BrushAnnotation, PitchforkAnnotation, FibExtensionAnnotation, OrderBlockAnnotation, FairValueGapAnnotation, BosLineAnnotation, Annotation, } from './charting/types';
+export { FIB_LEVELS_DEFAULT, FIB_EXTENSIONS_DEFAULT } from './charting/types';
+export { default as useCandlestickChart } from './hooks/useCandlestickChart.js';
+export { default as useChartLayout } from './hooks/useChartLayout.js';
+export { default as useChartPanZoom } from './hooks/useChartPanZoom.js';
+export { default as useChartPanZoomVirtual } from './hooks/useChartPanZoomVirtual.js';
+export { default as useContainerSize } from './hooks/useContainerSize.js';
+export { default as useOverlayToggles } from './hooks/useOverlayToggles.js';
+export { default as useChartAnimations, INDICATOR_ANIMATION_ORDER } from './hooks/useChartAnimations';
+export type { ChartAnimationPhase, ChartAnimationState, ChartAnimationControls, UseChartAnimationsOptions, } from './hooks/useChartAnimations';
+export * from './utils/indicators.js';
+export { default as AnnotationLayer } from './components/overlays/AnnotationLayer';
+export { createHLineAnnotation, createVLineAnnotation, createTextAnnotation, createTrendLineAnnotation, createRayAnnotation, createCrossLineAnnotation, createRectangleAnnotation, createEmojiAnnotation, createTimeRangeAnnotation, createArrowAnnotation, createChannelAnnotation, createFibRetracementAnnotation, createMeasureAnnotation, createAlertLineAnnotation, createBrushAnnotation, createPitchforkAnnotation, createFibExtensionAnnotation, createOrderBlockAnnotation, createFairValueGapAnnotation, createBosLineAnnotation, ANNOTATION_COLORS, } from './components/overlays/AnnotationLayer';
+export type { AnnotationLayerProps } from './components/overlays/AnnotationLayer';
+export { default as HLineAnnotationView } from './components/overlays/HLineAnnotationView';
+export type { HLineAnnotationViewProps } from './components/overlays/HLineAnnotationView';
+export { default as VLineAnnotationView } from './components/overlays/VLineAnnotationView';
+export type { VLineAnnotationViewProps } from './components/overlays/VLineAnnotationView';
+export { default as TextAnnotationView } from './components/overlays/TextAnnotationView';
+export type { TextAnnotationViewProps } from './components/overlays/TextAnnotationView';
+export { default as TrendLineAnnotationView } from './components/overlays/TrendLineAnnotationView';
+export type { TrendLineAnnotationViewProps } from './components/overlays/TrendLineAnnotationView';
+export { default as RayAnnotationView } from './components/overlays/RayAnnotationView';
+export type { RayAnnotationViewProps } from './components/overlays/RayAnnotationView';
+export { default as CrossLineAnnotationView } from './components/overlays/CrossLineAnnotationView';
+export type { CrossLineAnnotationViewProps } from './components/overlays/CrossLineAnnotationView';
+export { default as RectangleAnnotationView } from './components/overlays/RectangleAnnotationView';
+export type { RectangleAnnotationViewProps } from './components/overlays/RectangleAnnotationView';
+export { default as EmojiAnnotationView } from './components/overlays/EmojiAnnotationView';
+export type { EmojiAnnotationViewProps } from './components/overlays/EmojiAnnotationView';
+export { default as TimeRangeAnnotationView } from './components/overlays/TimeRangeAnnotationView';
+export type { TimeRangeAnnotationViewProps } from './components/overlays/TimeRangeAnnotationView';
+export { default as ArrowAnnotationView } from './components/overlays/ArrowAnnotationView';
+export type { ArrowAnnotationViewProps } from './components/overlays/ArrowAnnotationView';
+export { default as ChannelAnnotationView } from './components/overlays/ChannelAnnotationView';
+export type { ChannelAnnotationViewProps } from './components/overlays/ChannelAnnotationView';
+export { default as FibRetracementAnnotationView } from './components/overlays/FibRetracementAnnotationView';
+export type { FibRetracementAnnotationViewProps } from './components/overlays/FibRetracementAnnotationView';
+export { default as MeasureAnnotationView } from './components/overlays/MeasureAnnotationView';
+export type { MeasureAnnotationViewProps } from './components/overlays/MeasureAnnotationView';
+export { default as AlertLineAnnotationView } from './components/overlays/AlertLineAnnotationView';
+export type { AlertLineAnnotationViewProps } from './components/overlays/AlertLineAnnotationView';
+export { default as BrushAnnotationView } from './components/overlays/BrushAnnotationView';
+export type { BrushAnnotationViewProps } from './components/overlays/BrushAnnotationView';
+export { default as PitchforkAnnotationView } from './components/overlays/PitchforkAnnotationView';
+export type { PitchforkAnnotationViewProps } from './components/overlays/PitchforkAnnotationView';
+export { default as FibExtensionAnnotationView } from './components/overlays/FibExtensionAnnotationView';
+export type { FibExtensionAnnotationViewProps } from './components/overlays/FibExtensionAnnotationView';
+export { default as OrderBlockAnnotationView } from './components/overlays/OrderBlockAnnotationView';
+export type { OrderBlockAnnotationViewProps } from './components/overlays/OrderBlockAnnotationView';
+export { default as FairValueGapAnnotationView } from './components/overlays/FairValueGapAnnotationView';
+export type { FairValueGapAnnotationViewProps } from './components/overlays/FairValueGapAnnotationView';
+export { default as BosLineAnnotationView } from './components/overlays/BosLineAnnotationView';
+export type { BosLineAnnotationViewProps } from './components/overlays/BosLineAnnotationView';

package/dist/index.js

@@ -5963,7 +5963,7 @@ const pi = {
   return !Number.isFinite(c) || c === 1 / 0 ? 6 : Math.max(4, Math.min(18, c * 0.5));
 }, Li = (e, t, r, c, n) => {
   var P;
-  const l = e.style ?? {}, s = l.lineWidth ?? 1.5, u = l.color ?? "#6b7280", i = l.opacity ?? 1, o = l.dashed ? "4 4" : void 0, m = n && n.phase !== "complete", a = ((P = n == null ? void 0 : n.layerOpacities) == null ? void 0 : P[e.key]) ?? (m ? 0 : 1), p = i * a;
+  const l = e.style ?? {}, s = l.lineWidth ?? 1.5, u = l.color ?? e.color ?? "#6b7280", i = l.opacity ?? 1, o = l.dashed ? "4 4" : void 0, m = n && n.phase !== "complete", a = ((P = n == null ? void 0 : n.layerOpacities) == null ? void 0 : P[e.key]) ?? (m ? 0 : 1), p = i * a;
   if (e.type === "hist") {
     let D = 1 / 0;
     for (let M = 1; M < t.length; M += 1) {
@@ -5991,7 +5991,7 @@ const pi = {
   const l = n == null ? void 0 : n.phase;
   if (l && l !== "events" && l !== "annotations" && l !== "complete")
     return null;
-  const s = hr(t, c), u = ((M = e.style) == null ? void 0 : M.markerShape) ?? "circle", i = ((L = e.style) == null ? void 0 : L.markerSize) ?? 6, o = ((N = e.style) == null ? void 0 : N.color) ?? "#fbbf24", m = ((x = e.style) == null ? void 0 : x.markerOffsetY) ?? 0, a = ((f = e.style) == null ? void 0 : f.markerFontSize) ?? 10, p = ((Y = e.style) == null ? void 0 : Y.markerTextColor) ?? o, g = ((_ = e.style) == null ? void 0 : _.markerTextOffsetY) ?? 0, h = /* @__PURE__ */ new Map(), P = /* @__PURE__ */ new Map();
+  const s = hr(t, c), u = ((M = e.style) == null ? void 0 : M.markerShape) ?? "circle", i = ((L = e.style) == null ? void 0 : L.markerSize) ?? 6, o = ((N = e.style) == null ? void 0 : N.color) ?? e.color ?? "#fbbf24", m = ((x = e.style) == null ? void 0 : x.markerOffsetY) ?? 0, a = ((f = e.style) == null ? void 0 : f.markerFontSize) ?? 10, p = ((Y = e.style) == null ? void 0 : Y.markerTextColor) ?? o, g = ((_ = e.style) == null ? void 0 : _.markerTextOffsetY) ?? 0, h = /* @__PURE__ */ new Map(), P = /* @__PURE__ */ new Map();
   let D = 0;
   if (t.forEach((w) => {
     if (!Number.isFinite(w == null ? void 0 : w.t) || !Number.isFinite(w == null ? void 0 : w.v))
@@ -6080,7 +6080,7 @@ const pi = {
   }) });
 }, Ai = (e, t, r, c, n, l, s) => {
   var L;
-  const i = Si(t, c, n) / 2, o = ((L = e.style) == null ? void 0 : L.color) ?? (l ? "#22c55e" : "#16a34a"), m = ze.color(o), p = m ? m.darker(1.2).formatHex() : l ? "#ef4444" : "#b91c1c", g = o;
+  const i = Si(t, c, n) / 2, o = ((L = e.style) == null ? void 0 : L.color) ?? e.color ?? (l ? "#22c55e" : "#16a34a"), m = ze.color(o), p = m ? m.darker(1.2).formatHex() : l ? "#ef4444" : "#b91c1c", g = o;
   let h = t;
   (s == null ? void 0 : s.phase) === "background" || (s == null ? void 0 : s.phase) === "idle" ? h = [] : (s == null ? void 0 : s.phase) === "candles" && (h = t.slice(0, s.candleRevealIndex + 1));
   const P = (N) => {
@@ -6182,28 +6182,28 @@ const pi = {
 }, Bi = (e, t, r, c, n, l) => !Array.isArray(e.data) || e.data.length === 0 || (l == null ? void 0 : l.phase) === "loading" ? null : e.type === "ohlc" && dr(e.data) ? Ai(e, e.data, t, r, c, n, l) : e.type === "marker" ? Vi(e, e.data, t, r, l) : e.type === "position" ? _i(e, e.data, t, r, c) : ur(e.data) ? Li(e, e.data, t, r, l) : null, zt = (e, t) => {
   var n, l, s, u, i, o, m, a, p, g, h, P, D;
   if (!Array.isArray(e.data) || e.data.length === 0)
-    return { key: e.key, color: (n = e.style) == null ? void 0 : n.color, value: null, display: "—", raw: null };
+    return { key: e.key, color: ((n = e.style) == null ? void 0 : n.color) ?? e.color, value: null, display: "—", raw: null };
   if (e.type === "ohlc" && dr(e.data)) {
     const F = Ei(e.data, t);
     if (!F)
-      return { key: e.key, color: (l = e.style) == null ? void 0 : l.color, value: null, display: "—", raw: null };
+      return { key: e.key, color: ((l = e.style) == null ? void 0 : l.color) ?? e.color, value: null, display: "—", raw: null };
     const b = e.tooltipFormatter ? e.tooltipFormatter(F) : `O ${et(F.o)}  H ${et(F.h)}  L ${et(F.l)}  C ${et(F.c)}`;
-    return { key: e.key, color: (s = e.style) == null ? void 0 : s.color, value: F.c ?? null, display: b, raw: F };
+    return { key: e.key, color: ((s = e.style) == null ? void 0 : s.color) ?? e.color, value: F.c ?? null, display: b, raw: F };
   }
   if (e.type === "marker") {
     const F = e.data.filter((f) => Number.isFinite(f == null ? void 0 : f.t) && Number.isFinite(f == null ? void 0 : f.v));
     if (!F.length)
-      return { key: e.key, color: (u = e.style) == null ? void 0 : u.color, value: null, display: "—", raw: null };
+      return { key: e.key, color: ((u = e.style) == null ? void 0 : u.color) ?? e.color, value: null, display: "—", raw: null };
     const b = F.map((f) => ({ t: f.t, v: f.v })), M = tr(b, t);
     if (!M)
-      return { key: e.key, color: (i = e.style) == null ? void 0 : i.color, value: null, display: "—", raw: null };
+      return { key: e.key, color: ((i = e.style) == null ? void 0 : i.color) ?? e.color, value: null, display: "—", raw: null };
     const L = F.find((f) => f.t === M.t && f.v === M.v) ?? null, N = e.tooltipFormatter ? e.tooltipFormatter(L ?? M) : L != null && L.label ? `${L.label} ${et(M.v)}` : et(M.v), x = (L == null ? void 0 : L.color) ?? ((o = e.style) == null ? void 0 : o.color);
     return { key: e.key, color: x, value: M.v ?? null, display: N, raw: L ?? M };
   }
   if (e.type === "position") {
     const F = e.data.filter((N) => Number.isFinite(N == null ? void 0 : N.start) && Number.isFinite(N == null ? void 0 : N.entry) && Number.isFinite(N == null ? void 0 : N.stop) && Number.isFinite(N == null ? void 0 : N.target));
     if (!F.length)
-      return { key: e.key, color: (m = e.style) == null ? void 0 : m.color, value: null, display: "—", raw: null };
+      return { key: e.key, color: ((m = e.style) == null ? void 0 : m.color) ?? e.color, value: null, display: "—", raw: null };
     const b = F.reduce((N, x) => {
       const f = Math.abs(x.start - t), Y = Number.isFinite(x.end ?? NaN) ? Math.abs(x.end - t) : f, _ = Math.min(f, Y);
       if (!N)
@@ -6212,19 +6212,19 @@ const pi = {
       return _ < E ? x : N;
     }, null);
     if (!b)
-      return { key: e.key, color: (a = e.style) == null ? void 0 : a.color, value: null, display: "—", raw: null };
+      return { key: e.key, color: ((a = e.style) == null ? void 0 : a.color) ?? e.color, value: null, display: "—", raw: null };
     const M = e.tooltipFormatter ? e.tooltipFormatter(b) : `Entry ${et(b.entry)}  Stop ${et(b.stop)}  Target ${et(b.target)}`, L = ((p = e.style) == null ? void 0 : p.color) ?? ((g = e.style) == null ? void 0 : g.riskColor) ?? "rgba(239, 68, 68, 0.8)";
     return { key: e.key, color: L, value: b.entry ?? null, display: M, raw: b };
   }
   if (ur(e.data)) {
     const F = tr(e.data, t);
     if (!F)
-      return { key: e.key, color: (h = e.style) == null ? void 0 : h.color, value: null, display: "—", raw: null };
+      return { key: e.key, color: ((h = e.style) == null ? void 0 : h.color) ?? e.color, value: null, display: "—", raw: null };
     const b = e.tooltipFormatter ? e.tooltipFormatter(F) : et(F.v);
-    return { key: e.key, color: (P = e.style) == null ? void 0 : P.color, value: F.v ?? null, display: b, raw: F };
+    return { key: e.key, color: ((P = e.style) == null ? void 0 : P.color) ?? e.color, value: F.v ?? null, display: b, raw: F };
   }
   const r = e.data.find((F) => F && typeof F.t == "number"), c = e.tooltipFormatter ? e.tooltipFormatter(r) : "—";
-  return { key: e.key, color: (D = e.style) == null ? void 0 : D.color, value: null, display: c, raw: r };
+  return { key: e.key, color: ((D = e.style) == null ? void 0 : D.color) ?? e.color, value: null, display: c, raw: r };
 }, gs = pr(function({
   spec: t,
   darkMode: r = !1,

package/dist/utils/indicators.d.ts

@@ -0,0 +1,40 @@
+/**
+ * Technical Indicator Calculations
+ * Pure utility functions for calculating various technical indicators
+ */
+/**
+ * Calculate Simple Moving Average values for chart data.
+ * This function is intended to be used externally to calculate SMA data
+ * before passing it to the chart component.
+ *
+ * @param {Array<{ date: string, open: number, high: number, low: number, close: number }>} data
+ * @param {number} period
+ * @returns {Array<{ x: string, y: number }>}
+ */
+export function calculateSMA(data: Array<{
+    date: string;
+    open: number;
+    high: number;
+    low: number;
+    close: number;
+}>, period: number): Array<{
+    x: string;
+    y: number;
+}>;
+/**
+ * Calculate Exponential Moving Average values for chart data.
+ *
+ * @param {Array<{ date: string, open: number, high: number, low: number, close: number }>} data
+ * @param {number} period
+ * @returns {Array<{ x: string, y: number }>}
+ */
+export function calculateEMA(data: Array<{
+    date: string;
+    open: number;
+    high: number;
+    low: number;
+    close: number;
+}>, period: number): Array<{
+    x: string;
+    y: number;
+}>;

package/package.json

@@ -1,12 +1,14 @@
 {
   "name": "@dwlf/charting",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "React charting library for financial data — candlestick charts, annotations, overlays, and interaction hooks.",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
+  "types": "dist/index.d.ts",
   "exports": {
     ".": {
+      "types": "./dist/index.d.ts",
       "import": "./dist/index.js",
       "require": "./dist/index.cjs"
     },
@@ -81,6 +83,7 @@
     "semantic-release": "^23.1.1",
     "typescript": "^5.6.3",
     "vite": "^6.0.0",
+    "vite-plugin-dts": "^4.5.4",
     "vitest": "^2.1.3"
   }
 }