acttrader-charts 1.0.11 → 1.0.13

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
@@ -218,7 +218,7 @@ When `enableTrading` is on and live BID/ASK data is streaming, hovering / activa
218
218
  | `theme` | | `"dark"` | `"dark"` or `"light"` |
219
219
  | `series` | | `"candlestick"` | Initial chart type |
220
220
  | `showVolume` | | `true` | Show volume overlay |
221
- | `showUI` | | `true` | Render top / bottom / left bars |
221
+ | `showUI` | | `true` | Render top / bottom / left bars. When `false`, the loading overlay is also suppressed (mobile wrappers provide their own) |
222
222
  | `showDrawingTools` | | `true` | Show drawing toolbar and pencil button |
223
223
  | `timeframe` | | `"1D"` | Initial timeframe |
224
224
  | `duration` | | — | Initial active duration button |
@@ -295,12 +295,15 @@ import { DEFAULT_UI_CONFIG } from 'acttrader-charts';
295
295
  | Component key | Configurable properties |
296
296
  |---|---|
297
297
  | `drawingToolbar` | `iconBtnSize`, `iconFontSize`, `iconFontFamily`, `flyoutLabelFontSize`, `flyoutLabelFontFamily`, `shortcutFontSize`, `soonBadgeFontSize`, `flyoutHeadingFontSize`, `flyoutHeadingLetterSpacing`, `scrollBtnHeight`, `scrollBtnFontSize`, `barPadding`, `btnGap` |
298
- | `topBar` | `height`, `dropBtnFontSize`, `dropBtnFontFamily`, `drawBtnSize`, `drawBtnIconFontSize`, `flyoutRowFontSize`, `flyoutRowFontFamily`, `flyoutCategoryFontSize`, `flyoutCategoryLetterSpacing`, `flyoutCheckFontSize`, `streamDotSize` |
298
+ | `topBar` | `height`, `dropBtnFontSize`, `dropBtnFontFamily`, `drawBtnSize`, `drawBtnIconFontSize`, `iconBtnSize`, `mobileIconBtnSize`, `mobileDrawBtnIconSize`, `flyoutRowFontSize`, `flyoutRowFontFamily`, `flyoutCategoryFontSize`, `flyoutCategoryLetterSpacing`, `flyoutCheckFontSize`, `streamDotSize` |
299
299
  | `bottomBar` | `height`, `btnFontSize`, `btnFontFamily` |
300
300
  | `priceAxis` | `fontSize`, `fontFamily` |
301
301
  | `timeAxis` | `fontSize`, `fontFamily` |
302
302
  | `crosshair` | `labelHeight`, `labelPaddingX`, `fontSize`, `fontFamily` |
303
303
  | `indicatorOverlay` | `pillFontSize`, `pillFontFamily`, `dotFontSize`, `pillIconFontSize`, `collapseBtnFontSize`, `collapseBtnFontFamily`, `dropdownRowFontSize`, `dropdownRowFontFamily`, `dropdownIconFontSize` |
304
+ | `tradeButton` | `size`, `mobileSize`, `iconSize`, `mobileIconSize` |
305
+
306
+ **Mobile icon sizing:** When the chart container is narrower than `drawingToolbar.mobileBreakpoint` (default `480`), the top-bar icon buttons (settings, fullscreen, drawing toggle) and the floating trade ⊕ button use their mobile sizes automatically. Defaults: top-bar icon buttons grow `26px → 28px` (icon SVG +2px), trade button grows `22px → 24px` (icon `14px → 16px`). Override any of these values via `uiConfig.topBar.mobileIconBtnSize`, `uiConfig.topBar.mobileDrawBtnIconSize`, or `uiConfig.tradeButton.mobileSize` / `mobileIconSize`.
304
307
 
305
308
  **Example:**
306
309
 
@@ -324,6 +327,7 @@ import {
324
327
  DEFAULT_TOP_BAR_CONFIG,
325
328
  DEFAULT_PRICE_AXIS_CONFIG,
326
329
  DEFAULT_CROSSHAIR_CONFIG,
330
+ DEFAULT_TRADE_BUTTON_CONFIG,
327
331
  // ...
328
332
  } from 'acttrader-charts';
329
333
  ```
@@ -472,6 +476,8 @@ chart.setLoading(loading: boolean): this
472
476
  ```ts
473
477
  chart.setSeries(series: SeriesType): this
474
478
  chart.setTheme('dark' | 'light'): this
479
+ chart.setTimeframe(tf: Timeframe): this // change timeframe and reload data
480
+ chart.setThemeOverrides(overrides: ChartConfig['themeOverrides']): this // update per-theme color overrides at runtime
475
481
  chart.setVolume(show: boolean): this
476
482
  ```
477
483
 
@@ -49,6 +49,12 @@ interface TopBarUiConfig {
49
49
  drawBtnSize: string;
50
50
  /** Font size for the icon inside the drawing toggle button */
51
51
  drawBtnIconFontSize: string;
52
+ /** Size (width = height) of icon-only buttons (settings, fullscreen) — desktop */
53
+ iconBtnSize: string;
54
+ /** Size (width = height) of icon-only buttons — mobile override */
55
+ mobileIconBtnSize: string;
56
+ /** SVG icon dimension inside the drawing toggle button — mobile override */
57
+ mobileDrawBtnIconSize: string;
52
58
  /** Font size for flyout list rows */
53
59
  flyoutRowFontSize: string;
54
60
  /** Font family for flyout list rows */
@@ -112,6 +118,16 @@ interface IndicatorOverlayUiConfig {
112
118
  /** Font size for gear ⚙ and remove ✕ icons inside dropdown rows */
113
119
  dropdownIconFontSize: string;
114
120
  }
121
+ interface TradeButtonUiConfig {
122
+ /** Button diameter (px) — desktop */
123
+ size: number;
124
+ /** Button diameter (px) — mobile override */
125
+ mobileSize: number;
126
+ /** SVG icon dimension (px) — desktop */
127
+ iconSize: number;
128
+ /** SVG icon dimension (px) — mobile override */
129
+ mobileIconSize: number;
130
+ }
115
131
  interface UiConfig {
116
132
  drawingToolbar: DrawingToolbarUiConfig;
117
133
  topBar: TopBarUiConfig;
@@ -120,6 +136,7 @@ interface UiConfig {
120
136
  timeAxis: TimeAxisUiConfig;
121
137
  crosshair: CrosshairUiConfig;
122
138
  indicatorOverlay: IndicatorOverlayUiConfig;
139
+ tradeButton: TradeButtonUiConfig;
123
140
  }
124
141
  declare const DEFAULT_DRAWING_TOOLBAR_CONFIG: DrawingToolbarUiConfig;
125
142
  declare const DEFAULT_TOP_BAR_CONFIG: TopBarUiConfig;
@@ -128,6 +145,7 @@ declare const DEFAULT_PRICE_AXIS_CONFIG: PriceAxisUiConfig;
128
145
  declare const DEFAULT_TIME_AXIS_CONFIG: TimeAxisUiConfig;
129
146
  declare const DEFAULT_CROSSHAIR_CONFIG: CrosshairUiConfig;
130
147
  declare const DEFAULT_INDICATOR_OVERLAY_CONFIG: IndicatorOverlayUiConfig;
148
+ declare const DEFAULT_TRADE_BUTTON_CONFIG: TradeButtonUiConfig;
131
149
  declare const DEFAULT_UI_CONFIG: UiConfig;
132
150
  type DeepPartial$1<T> = {
133
151
  [K in keyof T]?: T[K] extends object ? DeepPartial$1<T[K]> : T[K];
@@ -1222,4 +1240,4 @@ declare class MACD implements IIndicator {
1222
1240
  render(ctx: CanvasRenderingContext2D, results: IndicatorResult[], scale: ScaleManager, viewport: Viewport, paneHeight: number, rangeOverride?: PriceRange): void;
1223
1241
  }
1224
1242
 
1225
- export { type IndicatorResult as $, type AnyLevel as A, BollingerBands as B, type ChartConfig as C, type DrawingToolType as D, DEFAULT_LABELS as E, DEFAULT_PRICE_AXIS_CONFIG as F, DEFAULT_TIME_AXIS_CONFIG as G, DEFAULT_TOP_BAR_CONFIG as H, type IIndicator as I, DEFAULT_UI_CONFIG as J, type DataLoaderParams as K, type DeepPartial$1 as L, type DeepPartialChartTheme as M, type DialogLabels as N, type OHLCVBar as O, type PriceRange as P, type DrawingToolbarColors as Q, type DrawingToolbarLabels as R, type SeriesType as S, type TradeLevelType as T, type DrawingToolbarUiConfig as U, type Viewport as V, type Duration as W, EMA as X, type IndicatorOverlayColors as Y, type IndicatorOverlayUiConfig as Z, type IndicatorParams as _, type ChartEventMap as a, type IndicatorStateEntry as a0, LIGHT_THEME as a1, MACD as a2, type OhlcLabels as a3, type OrderSubmit as a4, type Padding as a5, type PendingOrderLevel as a6, type PositionLevel as a7, type PositionRenderStyle as a8, type PriceAxisUiConfig as a9, RSI as aa, SMA as ab, type Theme as ac, type TimeAxisUiConfig as ad, type Timeframe as ae, type TopBarColors as af, type TopBarLabels as ag, type TopBarUiConfig as ah, type TradeDisplayFilter as ai, type TradeLabels as aj, type TradeLevel as ak, type TradeLevelColors as al, type TradePanelColors as am, type UiConfig as an, deepMergeTheme as ao, resolveCssVarsInTheme as ap, resolveLabels as aq, resolveUiConfig as ar, type PriceSource as as, type ChartState as b, type IDrawing as c, type IWebSocketAdapter as d, type DrawingPoint as e, ScaleManager as f, type DrawingHandle as g, type SerializedDrawing as h, type Tick as i, type StreamStatus as j, type ActiveIndicatorState as k, type BottomBarColors as l, type BottomBarLabels as m, type BottomBarUiConfig as n, type CanvasColorSettings as o, type ChartLabels as p, type ChartMiscLabels as q, type ChartTheme as r, type ChartThemeUi as s, type CrosshairPosition as t, type CrosshairUiConfig as u, DARK_THEME as v, DEFAULT_BOTTOM_BAR_CONFIG as w, DEFAULT_CROSSHAIR_CONFIG as x, DEFAULT_DRAWING_TOOLBAR_CONFIG as y, DEFAULT_INDICATOR_OVERLAY_CONFIG as z };
1243
+ export { type IndicatorOverlayUiConfig as $, type AnyLevel as A, BollingerBands as B, type ChartConfig as C, type DrawingToolType as D, DEFAULT_INDICATOR_OVERLAY_CONFIG as E, DEFAULT_LABELS as F, DEFAULT_PRICE_AXIS_CONFIG as G, DEFAULT_TIME_AXIS_CONFIG as H, type IIndicator as I, DEFAULT_TOP_BAR_CONFIG as J, DEFAULT_TRADE_BUTTON_CONFIG as K, DEFAULT_UI_CONFIG as L, type DataLoaderParams as M, type DeepPartial$1 as N, type OHLCVBar as O, type PriceRange as P, type DeepPartialChartTheme as Q, type DialogLabels as R, type SeriesType as S, type Timeframe as T, type DrawingToolbarColors as U, type Viewport as V, type DrawingToolbarLabels as W, type DrawingToolbarUiConfig as X, type Duration as Y, EMA as Z, type IndicatorOverlayColors as _, type ChartEventMap as a, type IndicatorParams as a0, type IndicatorResult as a1, type IndicatorStateEntry as a2, LIGHT_THEME as a3, MACD as a4, type OhlcLabels as a5, type OrderSubmit as a6, type Padding as a7, type PendingOrderLevel as a8, type PositionLevel as a9, type PositionRenderStyle as aa, type PriceAxisUiConfig as ab, RSI as ac, SMA as ad, type Theme as ae, type TimeAxisUiConfig as af, type TopBarColors as ag, type TopBarLabels as ah, type TopBarUiConfig as ai, type TradeButtonUiConfig as aj, type TradeDisplayFilter as ak, type TradeLabels as al, type TradeLevel as am, type TradeLevelColors as an, type TradePanelColors as ao, type UiConfig as ap, deepMergeTheme as aq, resolveCssVarsInTheme as ar, resolveLabels as as, resolveUiConfig as at, type PriceSource as au, type ChartState as b, type IDrawing as c, type IWebSocketAdapter as d, type TradeLevelType as e, type DrawingPoint as f, ScaleManager as g, type DrawingHandle as h, type SerializedDrawing as i, type Tick as j, type StreamStatus as k, type ActiveIndicatorState as l, type BottomBarColors as m, type BottomBarLabels as n, type BottomBarUiConfig as o, type CanvasColorSettings as p, type ChartLabels as q, type ChartMiscLabels as r, type ChartTheme as s, type ChartThemeUi as t, type CrosshairPosition as u, type CrosshairUiConfig as v, DARK_THEME as w, DEFAULT_BOTTOM_BAR_CONFIG as x, DEFAULT_CROSSHAIR_CONFIG as y, DEFAULT_DRAWING_TOOLBAR_CONFIG as z };
@@ -49,6 +49,12 @@ interface TopBarUiConfig {
49
49
  drawBtnSize: string;
50
50
  /** Font size for the icon inside the drawing toggle button */
51
51
  drawBtnIconFontSize: string;
52
+ /** Size (width = height) of icon-only buttons (settings, fullscreen) — desktop */
53
+ iconBtnSize: string;
54
+ /** Size (width = height) of icon-only buttons — mobile override */
55
+ mobileIconBtnSize: string;
56
+ /** SVG icon dimension inside the drawing toggle button — mobile override */
57
+ mobileDrawBtnIconSize: string;
52
58
  /** Font size for flyout list rows */
53
59
  flyoutRowFontSize: string;
54
60
  /** Font family for flyout list rows */
@@ -112,6 +118,16 @@ interface IndicatorOverlayUiConfig {
112
118
  /** Font size for gear ⚙ and remove ✕ icons inside dropdown rows */
113
119
  dropdownIconFontSize: string;
114
120
  }
121
+ interface TradeButtonUiConfig {
122
+ /** Button diameter (px) — desktop */
123
+ size: number;
124
+ /** Button diameter (px) — mobile override */
125
+ mobileSize: number;
126
+ /** SVG icon dimension (px) — desktop */
127
+ iconSize: number;
128
+ /** SVG icon dimension (px) — mobile override */
129
+ mobileIconSize: number;
130
+ }
115
131
  interface UiConfig {
116
132
  drawingToolbar: DrawingToolbarUiConfig;
117
133
  topBar: TopBarUiConfig;
@@ -120,6 +136,7 @@ interface UiConfig {
120
136
  timeAxis: TimeAxisUiConfig;
121
137
  crosshair: CrosshairUiConfig;
122
138
  indicatorOverlay: IndicatorOverlayUiConfig;
139
+ tradeButton: TradeButtonUiConfig;
123
140
  }
124
141
  declare const DEFAULT_DRAWING_TOOLBAR_CONFIG: DrawingToolbarUiConfig;
125
142
  declare const DEFAULT_TOP_BAR_CONFIG: TopBarUiConfig;
@@ -128,6 +145,7 @@ declare const DEFAULT_PRICE_AXIS_CONFIG: PriceAxisUiConfig;
128
145
  declare const DEFAULT_TIME_AXIS_CONFIG: TimeAxisUiConfig;
129
146
  declare const DEFAULT_CROSSHAIR_CONFIG: CrosshairUiConfig;
130
147
  declare const DEFAULT_INDICATOR_OVERLAY_CONFIG: IndicatorOverlayUiConfig;
148
+ declare const DEFAULT_TRADE_BUTTON_CONFIG: TradeButtonUiConfig;
131
149
  declare const DEFAULT_UI_CONFIG: UiConfig;
132
150
  type DeepPartial$1<T> = {
133
151
  [K in keyof T]?: T[K] extends object ? DeepPartial$1<T[K]> : T[K];
@@ -1222,4 +1240,4 @@ declare class MACD implements IIndicator {
1222
1240
  render(ctx: CanvasRenderingContext2D, results: IndicatorResult[], scale: ScaleManager, viewport: Viewport, paneHeight: number, rangeOverride?: PriceRange): void;
1223
1241
  }
1224
1242
 
1225
- export { type IndicatorResult as $, type AnyLevel as A, BollingerBands as B, type ChartConfig as C, type DrawingToolType as D, DEFAULT_LABELS as E, DEFAULT_PRICE_AXIS_CONFIG as F, DEFAULT_TIME_AXIS_CONFIG as G, DEFAULT_TOP_BAR_CONFIG as H, type IIndicator as I, DEFAULT_UI_CONFIG as J, type DataLoaderParams as K, type DeepPartial$1 as L, type DeepPartialChartTheme as M, type DialogLabels as N, type OHLCVBar as O, type PriceRange as P, type DrawingToolbarColors as Q, type DrawingToolbarLabels as R, type SeriesType as S, type TradeLevelType as T, type DrawingToolbarUiConfig as U, type Viewport as V, type Duration as W, EMA as X, type IndicatorOverlayColors as Y, type IndicatorOverlayUiConfig as Z, type IndicatorParams as _, type ChartEventMap as a, type IndicatorStateEntry as a0, LIGHT_THEME as a1, MACD as a2, type OhlcLabels as a3, type OrderSubmit as a4, type Padding as a5, type PendingOrderLevel as a6, type PositionLevel as a7, type PositionRenderStyle as a8, type PriceAxisUiConfig as a9, RSI as aa, SMA as ab, type Theme as ac, type TimeAxisUiConfig as ad, type Timeframe as ae, type TopBarColors as af, type TopBarLabels as ag, type TopBarUiConfig as ah, type TradeDisplayFilter as ai, type TradeLabels as aj, type TradeLevel as ak, type TradeLevelColors as al, type TradePanelColors as am, type UiConfig as an, deepMergeTheme as ao, resolveCssVarsInTheme as ap, resolveLabels as aq, resolveUiConfig as ar, type PriceSource as as, type ChartState as b, type IDrawing as c, type IWebSocketAdapter as d, type DrawingPoint as e, ScaleManager as f, type DrawingHandle as g, type SerializedDrawing as h, type Tick as i, type StreamStatus as j, type ActiveIndicatorState as k, type BottomBarColors as l, type BottomBarLabels as m, type BottomBarUiConfig as n, type CanvasColorSettings as o, type ChartLabels as p, type ChartMiscLabels as q, type ChartTheme as r, type ChartThemeUi as s, type CrosshairPosition as t, type CrosshairUiConfig as u, DARK_THEME as v, DEFAULT_BOTTOM_BAR_CONFIG as w, DEFAULT_CROSSHAIR_CONFIG as x, DEFAULT_DRAWING_TOOLBAR_CONFIG as y, DEFAULT_INDICATOR_OVERLAY_CONFIG as z };
1243
+ export { type IndicatorOverlayUiConfig as $, type AnyLevel as A, BollingerBands as B, type ChartConfig as C, type DrawingToolType as D, DEFAULT_INDICATOR_OVERLAY_CONFIG as E, DEFAULT_LABELS as F, DEFAULT_PRICE_AXIS_CONFIG as G, DEFAULT_TIME_AXIS_CONFIG as H, type IIndicator as I, DEFAULT_TOP_BAR_CONFIG as J, DEFAULT_TRADE_BUTTON_CONFIG as K, DEFAULT_UI_CONFIG as L, type DataLoaderParams as M, type DeepPartial$1 as N, type OHLCVBar as O, type PriceRange as P, type DeepPartialChartTheme as Q, type DialogLabels as R, type SeriesType as S, type Timeframe as T, type DrawingToolbarColors as U, type Viewport as V, type DrawingToolbarLabels as W, type DrawingToolbarUiConfig as X, type Duration as Y, EMA as Z, type IndicatorOverlayColors as _, type ChartEventMap as a, type IndicatorParams as a0, type IndicatorResult as a1, type IndicatorStateEntry as a2, LIGHT_THEME as a3, MACD as a4, type OhlcLabels as a5, type OrderSubmit as a6, type Padding as a7, type PendingOrderLevel as a8, type PositionLevel as a9, type PositionRenderStyle as aa, type PriceAxisUiConfig as ab, RSI as ac, SMA as ad, type Theme as ae, type TimeAxisUiConfig as af, type TopBarColors as ag, type TopBarLabels as ah, type TopBarUiConfig as ai, type TradeButtonUiConfig as aj, type TradeDisplayFilter as ak, type TradeLabels as al, type TradeLevel as am, type TradeLevelColors as an, type TradePanelColors as ao, type UiConfig as ap, deepMergeTheme as aq, resolveCssVarsInTheme as ar, resolveLabels as as, resolveUiConfig as at, type PriceSource as au, type ChartState as b, type IDrawing as c, type IWebSocketAdapter as d, type TradeLevelType as e, type DrawingPoint as f, ScaleManager as g, type DrawingHandle as h, type SerializedDrawing as i, type Tick as j, type StreamStatus as k, type ActiveIndicatorState as l, type BottomBarColors as m, type BottomBarLabels as n, type BottomBarUiConfig as o, type CanvasColorSettings as p, type ChartLabels as q, type ChartMiscLabels as r, type ChartTheme as s, type ChartThemeUi as t, type CrosshairPosition as u, type CrosshairUiConfig as v, DARK_THEME as w, DEFAULT_BOTTOM_BAR_CONFIG as x, DEFAULT_CROSSHAIR_CONFIG as y, DEFAULT_DRAWING_TOOLBAR_CONFIG as z };