@funnest/charts-ui 0.3.0 → 0.5.0

package/dist/components/layout-menu.d.ts

@@ -0,0 +1,11 @@
+import type { MultiControls, WidgetContext } from '../context';
+import { type LayoutId } from '../layouts';
+/** Mini drawing of a split layout. */
+export declare function LayoutGlyph({ id }: {
+    id: LayoutId;
+}): import("preact").JSX.Element;
+/** Toolbar buttons of the multi-chart widget: split layout picker and pane sync toggles. */
+export declare function LayoutMenu({ ctx, multi }: {
+    ctx: WidgetContext;
+    multi: MultiControls;
+}): import("preact").JSX.Element;

package/dist/components/slot.d.ts

@@ -2,6 +2,7 @@
  * Mounts a persistent, host-owned element inside Preact-rendered UI. The element outlives
  * re-renders, so whatever the host app rendered into it (React, Vue, plain DOM) stays intact.
  */
-export declare function Slot({ el }: {
+export declare function Slot({ el, fixed }: {
     el: HTMLElement;
+    fixed?: boolean;
 }): import("preact").JSX.Element;

package/dist/context.d.ts

@@ -1,4 +1,5 @@
 import type { Chart, ChartLayout, ChartType, Datafeed, Drawing, DrawingType, IndicatorConfig, Locale, Resolution, SymbolInfo } from '@funnest/charts';
+import type { LayoutId } from './layouts';
 import type { WidgetStorage } from './storage';
 import type { Store } from './store';
 export interface UiState {
@@ -71,4 +72,34 @@ export interface WidgetContext {
     setSearchOpen(open: boolean): void;
     screenshot(): void;
     toggleFullscreen(): void;
+    /** Present in the multi-chart widget: split layout and sync controls for the toolbar. */
+    multi?: MultiControls | undefined;
+}
+/** What linked panes share in the multi-chart widget. */
+export interface LayoutSync {
+    /** Mirror the crosshair's time in every pane. */
+    crosshair: boolean;
+    /** Scroll/zoom every pane to the same time span. */
+    time: boolean;
+    /** Changing the symbol changes it in every pane. */
+    symbol: boolean;
+    /** Changing the interval changes it in every pane. */
+    interval: boolean;
+}
+export interface MultiState {
+    layout: LayoutId;
+    sync: LayoutSync;
+    /** Index of the pane the toolbar and drawing bar act on. */
+    active: number;
+    /** A pane temporarily filling the whole grid. */
+    maximized: number | null;
+    /** The container is too narrow to split: only the active pane shows, with pane tabs. */
+    narrow: boolean;
+}
+export interface MultiControls {
+    store: Store<MultiState>;
+    setLayout(layout: LayoutId): void;
+    setSync(patch: Partial<LayoutSync>): void;
+    activate(index: number): void;
+    toggleMaximize(index?: number): void;
 }

package/dist/i18n.d.ts

@@ -40,6 +40,7 @@ export declare const STRINGS: {
         settingHighLow: string;
         settingLastPrice: string;
         settingVolume: string;
+        settingNavButtons: string;
         settingGridH: string;
         settingGridV: string;
         resetDefaults: string;
@@ -93,6 +94,16 @@ export declare const STRINGS: {
         searching: string;
         searchHint: string;
         current: string;
+        layout: string;
+        sync: string;
+        syncCrosshair: string;
+        syncTime: string;
+        syncSymbol: string;
+        syncInterval: string;
+        syncHint: string;
+        maximizePane: string;
+        restorePane: string;
+        pane: string;
     };
     en: {
         searchSymbol: string;
@@ -134,6 +145,7 @@ export declare const STRINGS: {
         settingHighLow: string;
         settingLastPrice: string;
         settingVolume: string;
+        settingNavButtons: string;
         settingGridH: string;
         settingGridV: string;
         resetDefaults: string;
@@ -187,6 +199,16 @@ export declare const STRINGS: {
         searching: string;
         searchHint: string;
         current: string;
+        layout: string;
+        sync: string;
+        syncCrosshair: string;
+        syncTime: string;
+        syncSymbol: string;
+        syncInterval: string;
+        syncHint: string;
+        maximizePane: string;
+        restorePane: string;
+        pane: string;
     };
 };
 export type Strings = (typeof STRINGS)['ko'];

package/dist/icons.d.ts

@@ -37,3 +37,6 @@ export declare const CollapseLeftIcon: () => import("preact").JSX.Element;
 export declare const SettingsIcon: () => import("preact").JSX.Element;
 /** Funnest brand mark (brand/logo-mark.svg). Colors are fixed on purpose. */
 export declare const FunnestMark: () => import("preact").JSX.Element;
+export declare const LinkIcon: () => import("preact").JSX.Element;
+export declare const MaximizeIcon: () => import("preact").JSX.Element;
+export declare const RestoreIcon: () => import("preact").JSX.Element;

package/dist/index.d.ts

@@ -4,6 +4,10 @@
  * need no framework (React/Vue/Svelte/plain HTML all work).
  */
 export { createTradingChart, DEFAULT_FAVORITE_INTERVALS, DEFAULT_INTERVAL_GROUPS, DEFAULT_SEARCH_CATEGORIES, } from './trading-chart';
-export type { IntervalGroup, SearchCategory } from './context';
+export { createMultiChart } from './multi-chart';
+export type { MultiChart, MultiChartEvents, MultiChartOptions, MultiChartState, PaneSpec } from './multi-chart';
+export { LAYOUT_GROUPS, LAYOUTS, MAX_PANES, paneCount } from './layouts';
+export type { LayoutId, SplitNode, SplitSizes } from './layouts';
+export type { IntervalGroup, LayoutSync, SearchCategory } from './context';
 export type { ColorScheme, TradingChart, TradingChartOptions, TradingChartSlots } from './trading-chart';
 export { resolutionLabel } from './i18n';