tickup 1.0.0

package/CHANGELOG.md

@@ -0,0 +1,21 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
+and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## [Unreleased]
+
+- **Rebrand:** npm package **`tickup`** with React surface **`TickUp*`** (`TickUpStage`, `TickUpHost`, `TickUpCommand`, …). Bundles: `dist/tickup.{es,cjs}.js`, `dist/tickup-full.{es,cjs}.js`. Build env: `TICKUP_LIB_ENTRY`, `TICKUP_SKIP_OBFUSCATE`.
+- **Prime:** `chartOptions.base.engine` (`standard` \| `prime`), **`TickUpPrime`** / **`TickUpStandardEngine`** exports, **`ref.setEngine`**, neon canvas + glass toolbars; **`TickUpPrimeTier`** (`productId: 'prime'`) replaces the previous licensed shell name.
+- **Public release scope:** docs and the reference example emphasize **Pulse, Flow, Command, Desk**; Prime engine/tier are documented in the Prime repository docs.
+- Documentation shipped in the npm package under `documentation/` for offline / IDE browsing.
+- Symbol search: `onSymbolSearch` may return `false` or reject to revert the toolbar to the last good symbol.
+- **Advanced Interval Selection:** Categorized, searchable dropdown in the top bar; supports numerous timeframes (Intraday, Daily, Weekly, Monthly) with Portal-based rendering.
+- **Data-feed handler:** `onIntervalSearch` callback for intercepting timeframe changes; supports asynchronous data replacement with built-in UI revert logic on failure.
+- **Drawing API Extensions:** Added `getSelectedDrawing`, `getSelectedDrawingId`, `selectShape`, `unselectShape`, and `updateSelectedShape` to the imperative handle; `setInteractionMode(Mode)` now fully supports programmatically starting any interactive drawing tool.
+
+## [0.1.0] - 2026
+
+- Initial public release on npm: dual entry `tickup` and `tickup/full`, TypeScript declarations in `dist/`.

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Bar Damri
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,55 @@
+# 🚀 TickUp Charts
+
+## High-Performance React Financial Charts for the Modern Web
+
+TickUp is a lightning-fast, Canvas 2D-based charting library for React. Built for speed and precision, it handles thousands of data points with zero lag, providing a professional trading experience out of the box.
+
+## 🌐 VIEW LIVE SHOWCASE & DOCUMENTATION
+
+[Experience the performance and explore the full API documentation.](https://github.com/BARDAMRI/tickup-charts/blob/main/documentation/README.md)
+
+## 📸 Visual Showcase
+
+### 💎 The Prime Experience
+
+The optional Prime engine adds high-fidelity neon aesthetics and professional rendering profiles.
+
+![Prime Hero](./assets/showcase/hero-prime-neon.png)
+
+### 📊 Core vs. Prime
+
+| Standard Core | Prime Turbo Mode |
+| --- | --- |
+| Clean, functional, and fast. | Neon glow, pro indicators, and high-density mode. |
+| ![Core](./assets/showcase/compare-standard.png) | ![Prime](./assets/showcase/compare-prime.png) |
+
+## ✨ Key Features
+
+- Canvas 2D Engine: Ultra-smooth rendering without WebGL complexity.
+- Pro Drawing Tools: Trend lines, Fibonacci, shapes, and full imperative API.
+- Live Data Flow: Seamless WebSocket integration (replace/append/merge).
+- Financial Tier Layouts: Built-in products like Pulse, Flow, Command, and Desk.
+
+## 🛠️ Quick Start
+
+```bash
+npm install tickup react react-dom styled-components
+```
+
+## 📖 Documentation
+
+- [Quick Start Guide](./documentation/03-quick-start.md)
+- [Imperative API Reference](./documentation/06-imperative-api.md)
+- [Live Data & Updates](./documentation/07-data-and-live-updates.md)
+
+## 💎 Go Premium
+
+Need the neon glow and advanced pro indicators? Check out [TickUp Prime](https://github.com/BARDAMRI/tickup-prime).
+
+## 🗺️ Roadmap
+
+- Q2 2026: Advanced Indicators (Ichimoku, SuperTrend).
+- Q3 2026: WebGL Rendering Engine for 1M+ points.
+- Q4 2026: Collaborative Drawing Tools.
+
+Contact: [bardamri1702@gmail.com](mailto:bardamri1702@gmail.com) | [GitHub](https://github.com/BARDAMRI)

package/dist/branding/TickUpAttribution.d.ts

@@ -0,0 +1,11 @@
+import { ChartTheme } from '../types/types';
+export type TickUpAttributionProps = {
+    themeVariant: ChartTheme;
+    /** e.g. product label shown next to the mark */
+    productLabel?: string;
+    className?: string;
+};
+/**
+ * Footer attribution for embedded charts (copyright + brand mark). Theme-aware.
+ */
+export declare function TickUpAttribution({ themeVariant, productLabel, className }: TickUpAttributionProps): import("react/jsx-runtime").JSX.Element;

package/dist/branding/TickUpMark.d.ts

@@ -0,0 +1,15 @@
+import { ChartTheme } from '../types/types';
+/** @deprecated Use {@link ChartTheme} */
+export type TickUpThemeVariant = ChartTheme;
+type TickUpMarkProps = {
+    variant: ChartTheme;
+    /** Total height in px */
+    height?: number;
+    className?: string;
+    'aria-hidden'?: boolean;
+};
+/**
+ * Optional DOM wordmark (e.g. marketing). Theme-aware full logos.
+ */
+export declare function TickUpMark({ variant, height, className, 'aria-hidden': ariaHidden, }: TickUpMarkProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/branding/tickupBrandAssets.d.ts

@@ -0,0 +1,12 @@
+/** Toolbar / attribution wordmark — light surfaces */
+export declare const TICKUP_WORDMARK_URL_LIGHT: string;
+/** Mid-tone / grey shell or marketing blocks */
+export declare const TICKUP_WORDMARK_URL_GREY: string;
+/** Toolbar / attribution wordmark — dark surfaces */
+export declare const TICKUP_WORDMARK_URL_DARK: string;
+/** In-canvas watermark on light / grey plot */
+export declare const TICKUP_WATERMARK_URL_LIGHT: string;
+/** In-canvas watermark on dark plot */
+export declare const TICKUP_WATERMARK_URL_DARK: string;
+/** Grey chart theme — same glyph weight as light plots */
+export declare const TICKUP_WATERMARK_URL_GREY: string;

package/dist/branding/tickupWatermark.d.ts

@@ -0,0 +1,28 @@
+import { ChartTheme } from '../types/types';
+export type TickUpWatermarkTheme = ChartTheme;
+export declare enum TickUpWatermarkPlacement {
+    center = "center",
+    bottomRight = "bottom-right",
+    bottomLeft = "bottom-left",
+    topRight = "top-right",
+    topLeft = "top-left"
+}
+export type TickUpWatermarkImages = {
+    light: HTMLImageElement;
+    dark: HTMLImageElement;
+    grey: HTMLImageElement;
+};
+/**
+ * Loads the bundled TickUp mark images once (for canvas drawImage).
+ */
+export declare function loadTickUpWatermarkImages(): Promise<TickUpWatermarkImages | null>;
+export type DrawWatermarkOptions = {
+    maxWidthFrac?: number;
+    opacity?: number;
+    padding?: number;
+    placement?: TickUpWatermarkPlacement;
+};
+/**
+ * Draws the mark on the canvas (before series). Opacity is caller-controlled.
+ */
+export declare function drawTickUpWatermark(ctx: CanvasRenderingContext2D, cssWidth: number, cssHeight: number, theme: TickUpWatermarkTheme, images: TickUpWatermarkImages | null, options?: DrawWatermarkOptions): void;

package/dist/components/Canvas/Axes/XAxis.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { TimeRange } from "../../../types/Graph";
+import { AxesStyleOptions, TimeDetailLevel } from "../../../types/chartOptions";
+import { CanvasSizes } from "../../../types/types";
+interface XAxisProps {
+    canvasSizes: CanvasSizes;
+    parentContainerRef: React.RefObject<HTMLDivElement | null>;
+    xAxisHeight: number;
+    visibleRange: TimeRange;
+    timeDetailLevel: TimeDetailLevel;
+    timeFormat12h: boolean;
+    formatting: AxesStyleOptions;
+    dateFormat?: string;
+    locale: string;
+    timezone?: string;
+}
+export default function XAxis({ canvasSizes, xAxisHeight, visibleRange, timeDetailLevel, timeFormat12h, formatting, dateFormat, locale, timezone }: XAxisProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Canvas/Axes/YAxis.d.ts

@@ -0,0 +1,12 @@
+import { AxesStyleOptions } from "../../../types/chartOptions";
+import { AxesPosition } from "../../../types/types";
+interface YAxisProps {
+    yAxisPosition: AxesPosition;
+    xAxisHeight: number;
+    minPrice: number;
+    maxPrice: number;
+    numberOfYTicks: number;
+    formatting: AxesStyleOptions;
+}
+export default function YAxis({ yAxisPosition, minPrice, maxPrice, numberOfYTicks, formatting }: YAxisProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Canvas/ChartCanvas.d.ts

@@ -0,0 +1,40 @@
+import React from 'react';
+import { ChartOptions } from "../../types/chartOptions";
+import { Interval } from "../../types/Interval";
+import { PriceRange, TimeRange } from "../../types/Graph";
+import { CanvasSizes, ChartTheme, DeepRequired, WindowSpreadOptions } from "../../types/types";
+import { IDrawingShape } from "../Drawing/IDrawingShape";
+interface ChartCanvasProps {
+    intervalsArray: Interval[];
+    drawings: IDrawingShape[];
+    setDrawings: (drawings: IDrawingShape[] | ((prev: IDrawingShape[]) => IDrawingShape[])) => void;
+    selectedIndex: number | null;
+    /** Hit-tested on mousedown in Select / Edit shape modes (top-most drawing wins). */
+    setSelectedIndex?: (index: number | null) => void;
+    /** Double-click shape, or context-menu on selected shape — opens properties UI. */
+    onRequestShapeProperties?: (drawingIndex: number) => void;
+    visibleRange: TimeRange;
+    setVisibleRange: (range: TimeRange | ((prev: TimeRange) => TimeRange)) => void;
+    visiblePriceRange: PriceRange;
+    chartOptions: DeepRequired<ChartOptions>;
+    canvasSizes: CanvasSizes;
+    parentContainerRef?: React.RefObject<HTMLDivElement>;
+    windowSpread: WindowSpreadOptions;
+    /** Draw bundled TickUp marks inside plot / histogram (no DOM footer). */
+    showBrandWatermark?: boolean;
+    /** Matches chart `base.theme` for choosing light / dark / grey mark artwork. */
+    brandTheme?: ChartTheme;
+}
+export interface ChartCanvasHandle {
+    getCanvasSize(): {
+        width: number;
+        height: number;
+        dpr: number;
+    };
+    /** Main OHLC canvas (for snapshots); does not include histogram or drawings layers. */
+    getMainCanvasElement(): HTMLCanvasElement | null;
+    clearCanvas(): void;
+    redrawCanvas(): void;
+}
+export declare const ChartCanvas: React.ForwardRefExoticComponent<ChartCanvasProps & React.RefAttributes<ChartCanvasHandle>>;
+export {};

package/dist/components/Canvas/ChartStage.d.ts

@@ -0,0 +1,5 @@
+/**
+ * @deprecated Use {@link TickUpStage} from the same folder. Kept for backward compatibility.
+ */
+export { TickUpStage as ChartStage, type TickUpStageHandle as ChartStageHandle } from './TickUpStage';
+export type { TickUpStageProps as ChartStageProps } from './TickUpStage';

package/dist/components/Canvas/TickUpStage.d.ts

@@ -0,0 +1,122 @@
+import React from 'react';
+import { PriceRange, TimeRange } from "../../types/Graph";
+import { Interval } from "../../types/Interval";
+import { ChartOptions, ChartType, TimeDetailLevel } from "../../types/chartOptions";
+import { DeepRequired, ChartTheme } from "../../types/types";
+import { IDrawingShape } from "../Drawing/IDrawingShape";
+import { type DrawingInput, type DrawingPatch, type DrawingSpec } from "../Drawing/drawHelper";
+import { RangeKey } from '../Toolbar/RangeSelector';
+import { Mode } from '../../contexts/ModeContext';
+import type { LiveDataPlacement, LiveDataApplyResult } from "../../types/liveData";
+import type { ChartContextInfo } from "../../types/chartContext";
+import { type DrawingQuery, type DrawingSnapshot } from "../Drawing/drawingQuery";
+export interface TickUpStageProps {
+    intervalsArray: Interval[];
+    numberOfYTicks: number;
+    timeDetailLevel: TimeDetailLevel;
+    timeFormat12h: boolean;
+    selectedIndex: number | null;
+    setSelectedIndex?: (index: number | null) => void;
+    chartOptions: DeepRequired<ChartOptions>;
+    showTopBar?: boolean;
+    showLeftBar?: boolean;
+    handleChartTypeChange: (newType: ChartType) => void;
+    openSettingsMenu: () => void;
+    showSettingsBar: boolean;
+    /** Called when the toolbar refresh control is used; parent can reload remote data. */
+    onRefreshRequest?: () => void | Promise<void>;
+    /** Toggles app/chart theme (wired from host, e.g. TickUp shell). */
+    onToggleTheme?: () => void;
+    symbol?: string;
+    defaultSymbol?: string;
+    onSymbolChange?: (symbol: string) => void;
+    onSymbolSearch?: (symbol: string) => void | boolean | Promise<void | boolean>;
+    /** Current interval (e.g. '5m') */
+    interval?: string;
+    /** Notified when user picks a timeframe button or code calls setInterval(...) */
+    onIntervalChange?: (tf: string) => void;
+    /** Current range (e.g. '1M') */
+    range?: RangeKey;
+    /** Notified when user picks a range button or code calls setRange(...) */
+    onRangeChange?: (range: RangeKey) => void;
+    /** Optional explicit initial range name if any. */
+    initialRange?: RangeKey;
+    /** Sync with app chart theme for fullscreen modals */
+    themeVariant?: ChartTheme;
+    showBrandWatermark?: boolean;
+    /** Search/validation flow for interval changes (e.g. swap data feed). */
+    onIntervalSearch?: (tf: string) => void | boolean | Promise<void | boolean>;
+}
+export interface TickUpStageHandle {
+    /** Accepts a shape class instance or a plain {@link DrawingSpec} (`{ type, points, style?, id? }`). */
+    addShape: (shape: DrawingInput) => void;
+    /**
+     * Full replace: pass an instance or a {@link DrawingSpec} (id in spec is ignored; {@code shapeId} wins).
+     * Partial update: pass a {@link DrawingPatch} only (`{ style?, points?, symbol?, size? }`) — same as {@link patchShape}.
+     */
+    updateShape: (shapeId: string, newShape: DrawingInput | DrawingPatch) => void;
+    /** Merge geometry/style into the drawing with the given id (in-place mutation + state refresh). */
+    patchShape: (shapeId: string, patch: DrawingPatch) => void;
+    /** Replace all drawings with instances built from specs (e.g. hydrate from saved JSON). */
+    setDrawingsFromSpecs: (specs: DrawingSpec[]) => void;
+    deleteShape: (shapeId: string) => void;
+    addInterval: (interval: Interval) => void;
+    updateInterval: (index: number, newInterval: Interval) => void;
+    deleteInterval: (index: number) => void;
+    applyLiveData: (updates: Interval | Interval[], placement: LiveDataPlacement) => LiveDataApplyResult;
+    /** Pans/zooms the time axis so the full loaded series is visible. */
+    fitVisibleRangeToData: () => void;
+    /**
+     * If the last bar sits past the right edge of the visible window, pans the window right by the
+     * smallest amount that brings it into view while keeping the same time span when possible.
+     * No-op when the latest data is already visible — avoids the jump of {@link fitVisibleRangeToData}.
+     */
+    nudgeVisibleTimeRangeToLatest: (options?: {
+        trailingPaddingSec?: number;
+    }) => void;
+    getMainCanvasElement: () => HTMLCanvasElement | null;
+    getViewInfo: () => {
+        intervals: Interval[];
+        drawings: IDrawingShape[];
+        visibleRange: TimeRange & {
+            startIndex: number;
+            endIndex: number;
+        };
+        visiblePriceRange: PriceRange;
+        canvasSize: {
+            width: number;
+            height: number;
+            dpr: number;
+        };
+    };
+    /** Plain snapshots (safe to JSON.stringify). Omit query to return all, in z-order. */
+    getDrawings: (query?: DrawingQuery) => DrawingSnapshot[];
+    getDrawingById: (id: string) => DrawingSnapshot | null;
+    /** Live shape instances matching the query (same references as chart state). */
+    getDrawingInstances: (query?: DrawingQuery) => IDrawingShape[];
+    /** Get the snapshot of the currently selected drawing (if any). */
+    getSelectedDrawing: () => DrawingSnapshot | null;
+    /** Get the ID of the currently selected drawing (if any). */
+    getSelectedDrawingId: () => string | null;
+    /** Select a drawing by its unique ID. */
+    selectShape: (id: string) => void;
+    /** Clear any currently active drawing selection. */
+    unselectShape: () => void;
+    /** Update the properties of the currently selected drawing (shortcut for patchShape + getSelectedDrawingId). */
+    updateSelectedShape: (patch: DrawingPatch) => void;
+    /** Layout, visible ranges, symbol, canvas metrics — for host analysis. */
+    getChartContext: () => ChartContextInfo;
+    getCanvasSize: () => {
+        width: number;
+        height: number;
+        dpr: number;
+    };
+    clearCanvas: () => void;
+    redrawCanvas: () => void;
+    reloadCanvas: () => void;
+    /** Same behavior as the package drawing toolbar; requires {@link ModeProvider} above the stage. */
+    setInteractionMode: (mode: Mode) => void;
+    /** Deletes the shape at {@link selectedIndex}, if any, and clears selection. */
+    deleteSelectedDrawing: () => void;
+}
+export declare const TickUpStage: React.ForwardRefExoticComponent<TickUpStageProps & React.RefAttributes<TickUpStageHandle>>;

package/dist/components/Canvas/utils/GraphDraw.d.ts

@@ -0,0 +1,13 @@
+import type { ChartOptions, ChartRenderContext } from "../../../types/chartOptions";
+import { PriceRange } from "../../../types/Graph";
+import { DeepRequired } from "../../../types/types";
+/**
+ * Draws horizontal and vertical grid lines on the canvas.
+ * Respects options.base.style.showGrid to be shown or hidden.
+ */
+export declare function drawGrid(ctx: CanvasRenderingContext2D, canvasWidth: number, canvasHeight: number, options: DeepRequired<ChartOptions>): void;
+export declare function drawCandlestickChart(ctx: CanvasRenderingContext2D, context: ChartRenderContext, options: DeepRequired<ChartOptions>, visiblePriceRange: PriceRange): void;
+export declare function drawLineChart(ctx: CanvasRenderingContext2D, context: ChartRenderContext, style: DeepRequired<ChartOptions>, visiblePriceRange: PriceRange): void;
+export declare function drawAreaChart(ctx: CanvasRenderingContext2D, context: ChartRenderContext, options: DeepRequired<ChartOptions>, visiblePriceRange: PriceRange): void;
+export declare function drawBarChart(ctx: CanvasRenderingContext2D, context: ChartRenderContext, options: DeepRequired<ChartOptions>, visiblePriceRange: PriceRange): void;
+export declare function drawHistogramChart(ctx: CanvasRenderingContext2D, context: ChartRenderContext, options: DeepRequired<ChartOptions>): void;

package/dist/components/Canvas/utils/GraphHelpers.d.ts

@@ -0,0 +1,60 @@
+import { PriceRange, TimeRange } from "../../../types/Graph";
+import type { Interval } from "../../../types/Interval";
+/**
+ * Calculates the startTime coordinate of the start of a time interval.
+ * @param tStart - start time of the interval (timestamp in seconds)
+ * @param clientWidth - endTime of the canvas in pixels
+ * @param visibleRange - currently visible time range
+ */
+export declare const xFromStart: (tStart: number, clientWidth: number, visibleRange: TimeRange) => number;
+/**
+ * Calculates the startTime coordinate of the center of a time interval.
+ * @param tStart - start time of the interval (timestamp in seconds)
+ * @param intervalSeconds - duration of the interval in seconds
+ * @param clientWidth - endTime of the canvas in pixels
+ * @param visibleRange - currently visible time range
+ */
+export declare const xFromCenter: (tStart: number, intervalSeconds: number, clientWidth: number, visibleRange: TimeRange) => number;
+/**
+ * Converts a price value into a vertical pixel coordinate.
+ * The startPrice=0 is at the top of the canvas, so higher prices map to lower startPrice values.
+ * @param p - price to convert
+ * @param clientHeight - endPrice of the canvas in pixels
+ * @param price - currently visible price range
+ */
+export declare const priceToY: (p: number, clientHeight: number, price: PriceRange) => number;
+/**
+ * Converts a time value (timestamp) into a horizontal pixel coordinate.
+ * @param time - timestamp to convert
+ * @param clientWidth - endTime of the canvas in pixels
+ * @param visibleRange - currently visible time range
+ */
+export declare const timeToX: (time: number, clientWidth: number, visibleRange: TimeRange) => number;
+/**
+ * Converts a horizontal pixel coordinate (from a mouse event) into a time value (timestamp).
+ * This is the inverse of timeToX.
+ */
+export declare const xToTime: (x: number, clientWidth: number, visibleRange: TimeRange) => number;
+/**
+ * Converts a vertical pixel coordinate (from a mouse event) into a price value.
+ * This is the inverse of priceToY.
+ */
+export declare const yToPrice: (y: number, clientHeight: number, priceRange: PriceRange) => number;
+/**
+ * Linear interpolation between startPrice and endPrice by a factor of t (0 <= t <= 1)
+ * @param y1 - start value
+ * @param y2 - end value
+ * @param t - interpolation factor (0 = startPrice, 1 = endPrice)
+ */
+export declare function lerp(y1: number, y2: number, t: number): number;
+/**
+ * Given a sorted array of intervals, an interval duration, and a time,
+ * returns the interpolated close value at that time.
+ * If the time is before the first interval or after the last, returns the closest close value.
+ * Uses binary search for efficiency.
+ * @param all - sorted array of intervals
+ * @param intervalSeconds - duration of each interval in seconds
+ * @param timeSec - time to interpolate at (timestamp in seconds)
+ * @returns interpolated close value
+ */
+export declare const interpolatedCloseAtTime: (all: Interval[], intervalSeconds: number, timeSec: number) => number;

package/dist/components/Canvas/utils/drawDrawings.d.ts

@@ -0,0 +1,4 @@
+import { ChartRenderContext } from '../../../types/chartOptions';
+import { PriceRange } from '../../../types/Graph';
+import { IDrawingShape } from "../../Drawing/IDrawingShape";
+export declare function drawDrawings(ctx: CanvasRenderingContext2D, drawings: IDrawingShape[], selectedIndex: number | null, renderContext: ChartRenderContext, visiblePriceRange: PriceRange): void;

package/dist/components/Canvas/utils/drawOverlay.d.ts

@@ -0,0 +1,44 @@
+import { OverlayCalcSpec, OverlayKind, OverlayOptions, OverlayPriceKey, OverlaySeries, OverlayWithCalc } from "../../../types/overlay";
+import type { Interval } from "../../../types/Interval";
+import type { ChartRenderContext } from "../../../types/chartOptions";
+import type { PriceRange } from "../../../types/Graph";
+import { DeepPartial, DeepRequired } from "../../../types/types";
+/** Factory helpers for calculation specs */
+export declare const OverlaySpecs: {
+    readonly close: () => OverlayCalcSpec;
+    readonly open: () => OverlayCalcSpec;
+    readonly high: () => OverlayCalcSpec;
+    readonly low: () => OverlayCalcSpec;
+    readonly sma: (period: number, price?: OverlayPriceKey) => OverlayCalcSpec;
+    readonly ema: (period: number, price?: OverlayPriceKey) => OverlayCalcSpec;
+    readonly wma: (period: number, price?: OverlayPriceKey) => OverlayCalcSpec;
+    readonly vwap: () => OverlayCalcSpec;
+    readonly bbandsMid: (period: number, price?: OverlayPriceKey) => OverlayCalcSpec;
+    readonly bbandsUpper: (period: number, stddev?: number, price?: OverlayPriceKey) => OverlayCalcSpec;
+    readonly bbandsLower: (period: number, stddev?: number, price?: OverlayPriceKey) => OverlayCalcSpec;
+};
+/**
+ * Build an OverlayWithCalc from style + calc, with optional flags.
+ * Example:
+ *   makeOverlay({ lineColor: '#f90', lineWidth: 2, lineStyle: 'solid' }, OverlaySpecs.sma(20))
+ */
+export declare function makeOverlay(style?: DeepRequired<OverlayOptions>, calc?: OverlayCalcSpec, extras?: Pick<OverlayWithCalc, 'connectNulls' | 'useCenterX'>): OverlayWithCalc;
+/**
+ * Currying helper: create a family of overlays sharing the same style.
+ * Example:
+ *   const withOrange = withOverlayStyle({ lineColor: '#f90', lineWidth: 2, lineStyle: 'solid' });
+ *   const sma20 = withOrange(OverlaySpecs.sma(20));
+ */
+export declare function withOverlayStyle(style?: DeepPartial<OverlayOptions>): (calc?: OverlayCalcSpec, extras?: Pick<OverlayWithCalc, "connectNulls" | "useCenterX">) => OverlayWithCalc;
+export declare function computeSeriesBySpec(intervals: Interval[], spec: OverlayCalcSpec): (number | null)[];
+export declare function drawOverlays(ctx: CanvasRenderingContext2D, context: ChartRenderContext, visiblePriceRange: PriceRange, seriesList: OverlaySeries[]): void;
+/**
+ * Draw overlays directly from user options (OverlayWithCalc[]).
+ * Computes series values internally from intervals and forwards them to drawOverlays.
+ */
+export declare function drawOverlaysFromOptions(ctx: CanvasRenderingContext2D, context: ChartRenderContext, visiblePriceRange: PriceRange, overlays: OverlayWithCalc[] | undefined): void;
+/** Convenience: quick overlay creator with defaults.
+ *  Example: overlay('sma', { lineColor: '#f90' }, { connectNulls: false })
+ */
+export declare function overlay(kindOrSpec?: OverlayCalcSpec | OverlayKind | OverlayPriceKey, style?: DeepPartial<OverlayOptions>, extras?: Pick<OverlayWithCalc, 'connectNulls' | 'useCenterX'>): OverlayWithCalc;
+export declare function drawOverlay(ctx: CanvasRenderingContext2D, context: ChartRenderContext, visiblePriceRange: PriceRange, overlaysOrKind?: OverlayWithCalc[] | OverlayCalcSpec | OverlayKind, style?: DeepRequired<OverlayOptions>, extras?: Pick<OverlayWithCalc, 'connectNulls' | 'useCenterX'>): void;

package/dist/components/Canvas/utils/formatters.d.ts

@@ -0,0 +1,34 @@
+import { AxesUnitPlacement, CurrencyDisplay, NumberNotation, PriceMetricKind } from '../../../types/chartOptions';
+export interface FormatNumberOptions {
+    fractionDigits?: number;
+    decimalSeparator?: string;
+    thousandsSeparator?: string;
+    locale?: string;
+    style?: 'decimal' | 'currency' | 'percent';
+    currency?: string;
+    currencyDisplay?: CurrencyDisplay;
+    minimumFractionDigits?: number;
+    maximumFractionDigits?: number;
+    maximumSignificantDigits?: number;
+    notation?: NumberNotation;
+    tickSize?: number;
+    unit?: string;
+    unitPlacement?: AxesUnitPlacement;
+    conversionRate?: number;
+    displayCurrency?: string;
+    metricType?: PriceMetricKind;
+    showSign?: boolean;
+}
+/**
+ * Powerful number formatter using Intl.NumberFormat with custom separator support.
+ */
+export declare function formatNumber(value: number, options?: FormatNumberOptions): string;
+/**
+ * Handle localized numeric input.
+ * Example: '1.200,50' in de-DE -> 1200.5
+ */
+export declare function parseNumber(input: string, locale?: string, decimalSeparator?: string): number | null;
+/**
+ * Normalize a value for the clipboard, stripping all formatting for programmatic use.
+ */
+export declare function normalizeClipboardValue(value: string | number): string;

package/dist/components/Canvas/utils/generateTicks.d.ts

@@ -0,0 +1,9 @@
+import { DrawTicksOptions, Tick, TimeRange } from "../../../types/Graph";
+import { TimeDetailLevel, AxesStyleOptions } from "../../../types/chartOptions";
+import { AxesPosition } from "../../../types/types";
+export declare function generateAndDrawTimeTicks(canvas: HTMLCanvasElement, timeRange: TimeRange, numberOfXTicks: number, 
+/** User's regional date format string (e.g. 'dd/MM/yyyy', 'MMM d, yyyy'). Used to determine date order on day-level ticks. */
+dateFormat: string, timeFormat12h: boolean, xAxisHeight: number, strokeStyle: string, timeDetailLevel: TimeDetailLevel, options: DrawTicksOptions, locale?: string, timezone?: string, 
+/** Prefer layout width from {@link getBoundingClientRect} so ticks match the visible span even when `clientWidth` is briefly 0. */
+cssWidthOverride?: number): Tick[];
+export declare function generateAndDrawYTicks(canvas: HTMLCanvasElement, minValue: number, maxValue: number, numberOfYTicks: number, yAxisPosition?: AxesPosition, tickColor?: string, labelColor?: string, labelFont?: string, tickLength?: number, labelOffset?: number, formatting?: Partial<AxesStyleOptions>): void;

package/dist/components/Canvas/utils/helpers.d.ts

@@ -0,0 +1,6 @@
+import { Interval } from "../../../types/Interval";
+import { PriceRange } from "../../../types/Graph";
+/** Typical bar spacing in seconds (median of successive `t` deltas), aligned with {@link TickUpStage} / pan-zoom. */
+export declare function getBarIntervalSeconds(arr: Interval[], fallbackSeconds?: number): number;
+export declare function findPriceRange(allCandles: Interval[], startIndex: number, endIndex: number): PriceRange;
+export declare function isPointNearLine(px: number, py: number, x1: number, y1: number, x2: number, y2: number, tolerance: number): boolean;

package/dist/components/Common/AlertModal.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { type AlertThemeVariant } from './AlertModal.styles';
+interface AlertModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    title: string;
+    message: string | React.ReactNode;
+    themeVariant?: AlertThemeVariant;
+    /** If true, the modal renders within a portal to the document body. Defaults to true. */
+    usePortal?: boolean;
+}
+export declare const AlertModal: React.FC<AlertModalProps>;
+export {};

package/dist/components/Common/AlertModal.styles.d.ts

@@ -0,0 +1,13 @@
+import { ChartTheme } from '../../types/types';
+export type AlertThemeVariant = ChartTheme;
+interface ThemeProps {
+    $variant: AlertThemeVariant;
+}
+export declare const AlertOverlay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ThemeProps>> & string;
+export declare const AlertContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ThemeProps>> & string;
+export declare const AlertHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ThemeProps>> & string;
+export declare const AlertTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, ThemeProps>> & string;
+export declare const AlertBody: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ThemeProps>> & string;
+export declare const AlertFooter: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ThemeProps>> & string;
+export declare const AlertButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, ThemeProps>> & string;
+export {};

package/dist/components/DefaultData.d.ts

@@ -0,0 +1,3 @@
+import { DeepRequired } from "../types/types";
+import { ChartOptions } from "../types/chartOptions";
+export declare const DEFAULT_GRAPH_OPTIONS: DeepRequired<ChartOptions>;

package/dist/components/Drawing/AngleShape.d.ts

@@ -0,0 +1,37 @@
+import { IDrawingShape } from './IDrawingShape';
+import { ChartRenderContext } from '../../types/chartOptions';
+import { PriceRange } from '../../types/Graph';
+import { AngleShapeArgs, DrawingPoint, DrawingStyleOptions, FinalDrawingStyle } from '../../types/Drawings';
+import { ShapeType } from './types';
+export declare class AngleShape implements IDrawingShape {
+    args: AngleShapeArgs;
+    styleOptions: DrawingStyleOptions;
+    id: string;
+    type: ShapeType;
+    style: DrawingStyleOptions;
+    points: DrawingPoint[];
+    constructor(args: AngleShapeArgs, styleOptions: DrawingStyleOptions, id?: string | undefined);
+    /**
+     * Strokes only (legs + arc). Labels are drawn via {@link drawLabelOverlay} so they can render
+     * after other shapes and stay above crossing lines.
+     */
+    drawGeometry(ctx: CanvasRenderingContext2D, renderContext: ChartRenderContext, visiblePriceRange: PriceRange, style: FinalDrawingStyle): void;
+    /** Degree label + legible backing; call after all shape geometry (see drawDrawings). */
+    drawLabelOverlay(ctx: CanvasRenderingContext2D, renderContext: ChartRenderContext, visiblePriceRange: PriceRange, style: FinalDrawingStyle): void;
+    draw(ctx: CanvasRenderingContext2D, renderContext: ChartRenderContext, visiblePriceRange: PriceRange, style: FinalDrawingStyle): void;
+    isHit(px: number, py: number, renderContext: ChartRenderContext, visiblePriceRange: PriceRange): boolean;
+    private angleArcParams;
+    private drawAngleArcOnly;
+    private drawAngleLabelOnly;
+    private isPointNearLine;
+    private calculateAngle;
+    addPoint(point: DrawingPoint): void;
+    /** After vertex + first ray are fixed (2 points), track the second ray endpoint. */
+    updateSecondRayEnd(point: DrawingPoint): void;
+    setPoints(points: DrawingPoint[]): void;
+    setPointAt(index: number, point: DrawingPoint): void;
+    getPoints(): DrawingPoint[];
+    setFirstPoint(point: DrawingPoint): void;
+    /** Phase 1: vertex (index 0) + first ray end (index 1), same behavior as a 2-point line. */
+    updateLastPoint(point: DrawingPoint): void;
+}