tsichart-core 2.1.5 → 2.1.7

package/dist/index.d.ts

@@ -21,8 +21,71 @@ declare class Strings {
 }
 
 interface HorizontalMarker {
-    color: string;
     value: number;
+    color: string;
+    condition?: 'Greater Than' | 'Less Than';
+    opacity?: number;
+    label?: string;
+}
+
+/**
+ * Configuration options for the LineChart component.
+ *
+ * Provides type safety for LineChart-specific configuration with all properties being optional.
+ * Based on ChartOptions class, allowing partial configuration where defaults are applied internally.
+ *
+ * @remarks
+ * This type includes all properties from ChartOptions as optional fields:
+ * - **Appearance**: theme, color, legend, tooltip, grid, isArea, interpolationFunction
+ * - **Axis Configuration**: xAxisHidden, yAxisHidden, yAxisState, yExtent, aggTopMargin
+ * - **Brush Settings**: brushMoveAction, brushMoveEndAction, brushContextMenuActions, brushHandlesVisible,
+ *   brushRangeVisible, snapBrush, minBrushWidth, keepBrush, brushClearable, autoTriggerBrushContextMenu
+ * - **Interaction**: focusHidden, onMouseover, onMouseout, onSticky, onUnsticky, shouldSticky
+ * - **Markers**: markers, onMarkersChange, labelSeriesWithMarker
+ * - **Swim Lanes**: swimLaneOptions (for stacked charts with multiple y-axes)
+ * - **Time Configuration**: timeFrame, offset, is24HourTime, dateLocale, xAxisTimeFormat
+ * - **UI Controls**: hideChartControlPanel, suppressResizeListener
+ * - **Data Display**: includeEnvelope, includeDots
+ * - **Styling**: strings (for i18n), noAnimate
+ *
+ * @example
+ * ```typescript
+ * const lineChartOptions: ILineChartOptions = {
+ *   theme: 'dark',
+ *   legend: 'shown',
+ *   yAxisState: 'stacked',
+ *   brushHandlesVisible: true,
+ *   interpolationFunction: 'curveMonotoneX',
+ *   labelSeriesWithMarker: true
+ * };
+ * ```
+ */
+interface BackgroundBand {
+    y0: number;
+    y1: number;
+    color: string;
+    opacity?: number;
+    label?: string;
+}
+type ILineChartOptions = Partial<Omit<ChartOptions, 'onSelect' | 'onInput' | 'onKeydown' | 'onInstanceClick' | 'hierarchyOptions' | 'withContextMenu' | 'timeSeriesIdProperties' | 'isTemporal' | 'spMeasures' | 'scatterPlotRadius' | 'spAxisLabels'>> & {
+    backgroundBands?: BackgroundBand[];
+    horizontalMarkers?: HorizontalMarker[];
+    swimLaneOptions?: {
+        [laneIdx: number]: {
+            showBackgroundBands?: boolean;
+            backgroundBands?: BackgroundBand[];
+            horizontalMarkers?: HorizontalMarker[];
+            backgroundBandCondition?: BackgroundBandCondition;
+        };
+    };
+};
+
+interface BackgroundBandCondition {
+    condition: 'Greater Than' | 'Less Than';
+    thresholdValue: number;
+    color: string;
+    opacity?: number;
+    label?: string;
 }
 
 interface swimLaneOption {
@@ -31,6 +94,9 @@ interface swimLaneOption {
     onClick?: (lane: number) => any;
     collapseEvents?: string;
     horizontalMarkers?: Array<HorizontalMarker>;
+    showBackgroundBands?: boolean;
+    backgroundBands?: BackgroundBand[];
+    backgroundBandCondition?: BackgroundBandCondition;
 }
 declare class ChartOptions {
     aggTopMargin: number;
@@ -441,40 +507,6 @@ declare class LineChartData extends ChartComponentData {
     mergeDataToDisplayStateAndTimeArrays(data: any, aggregateExpressionOptions?: any): void;
 }
 
-/**
- * Configuration options for the LineChart component.
- *
- * Provides type safety for LineChart-specific configuration with all properties being optional.
- * Based on ChartOptions class, allowing partial configuration where defaults are applied internally.
- *
- * @remarks
- * This type includes all properties from ChartOptions as optional fields:
- * - **Appearance**: theme, color, legend, tooltip, grid, isArea, interpolationFunction
- * - **Axis Configuration**: xAxisHidden, yAxisHidden, yAxisState, yExtent, aggTopMargin
- * - **Brush Settings**: brushMoveAction, brushMoveEndAction, brushContextMenuActions, brushHandlesVisible,
- *   brushRangeVisible, snapBrush, minBrushWidth, keepBrush, brushClearable, autoTriggerBrushContextMenu
- * - **Interaction**: focusHidden, onMouseover, onMouseout, onSticky, onUnsticky, shouldSticky
- * - **Markers**: markers, onMarkersChange, labelSeriesWithMarker
- * - **Swim Lanes**: swimLaneOptions (for stacked charts with multiple y-axes)
- * - **Time Configuration**: timeFrame, offset, is24HourTime, dateLocale, xAxisTimeFormat
- * - **UI Controls**: hideChartControlPanel, suppressResizeListener
- * - **Data Display**: includeEnvelope, includeDots
- * - **Styling**: strings (for i18n), noAnimate
- *
- * @example
- * ```typescript
- * const lineChartOptions: ILineChartOptions = {
- *   theme: 'dark',
- *   legend: 'shown',
- *   yAxisState: 'stacked',
- *   brushHandlesVisible: true,
- *   interpolationFunction: 'curveMonotoneX',
- *   labelSeriesWithMarker: true
- * };
- * ```
- */
-type ILineChartOptions = Partial<Omit<ChartOptions, 'onSelect' | 'onInput' | 'onKeydown' | 'onInstanceClick' | 'hierarchyOptions' | 'withContextMenu' | 'timeSeriesIdProperties' | 'isTemporal' | 'spMeasures' | 'scatterPlotRadius' | 'spAxisLabels'>>;
-
 declare class LineChart extends TemporalXAxisComponent {
     private targetElement;
     private focus;
@@ -534,8 +566,19 @@ declare class LineChart extends TemporalXAxisComponent {
     private swimLaneContents;
     private originalSwimLanes;
     private originalSwimLaneOptions;
+    private _playbackMarker;
     constructor(renderTarget: Element);
     LineChart(): void;
+    /**
+     * Render colored horizontal background bands behind chart data, strictly between horizontal marker values.
+     * @param bands Array of BackgroundBand objects
+     * @param markers Array of horizontal marker objects (must be sorted by value ascending)
+     */
+    private ensureBackgroundBandsGroup;
+    private createAutoBandsFromMarkers;
+    private createBandFromCondition;
+    private drawBackgroundBands;
+    private renderSwimLaneBackgroundBands;
     getBrushPositions(): {
         leftPos: any;
         rightPos: any;
@@ -573,6 +616,14 @@ declare class LineChart extends TemporalXAxisComponent {
     exportMarkers(): void;
     private createOnMarkerChange;
     private renderMarker;
+    /**
+     * Moves or creates a persistent playback marker at the given time.
+     * Call this on each playback tick for smooth marker movement.
+     * @param millis The timestamp (in ms) to move the marker to.
+     * @param label Optional label for the marker.
+     */
+    updatePlaybackMarker(millis: number, label?: string): void;
+    removePlaybackMarker(): void;
     private sortMarkers;
     private getAllLinesTransitionsComplete;
     private importMarkers;
@@ -583,6 +634,7 @@ declare class LineChart extends TemporalXAxisComponent {
     private filteredValueExist;
     addMarker: () => void;
     private voronoiExists;
+    private focusVoronoiSite;
     private voronoiMousemove;
     private voronoiContextMenu;
     private voronoiClick;
@@ -1019,7 +1071,7 @@ declare class ModelSearch extends Component {
     private currentResultIndex;
     constructor(renderTarget: Element);
     ModelSearch(): void;
-    render(environmentFqdn: string, getToken: any, hierarchyData: any, chartOptions: any): void;
+    render(hierarchyData: any, chartOptions: any): void;
     handleKeydown(event: any, ap: any): void;
     private closeContextMenu;
     private stripHits;
@@ -2594,6 +2646,8 @@ declare class PlaybackControls extends Component {
     private playbackInterval;
     private playButton;
     private handleElement;
+    private decreasePlaybackSpeedButton;
+    private increasePlaybackSpeedButton;
     private controlsContainer;
     private track;
     private trackXOffset;
@@ -2678,6 +2732,7 @@ declare abstract class HistoryPlayback extends Component {
     protected renderBase(data: Array<TsqExpression>, chartOptions: any): void;
     pauseAvailabilityUpdates(): void;
     private onSelecTimestamp;
+    protected getMockDataForTimestamp(timeStamp: Date): Array<any>;
     private calcQueryWindow;
     protected drawBase(): void;
     private updateAvailability;
@@ -2686,7 +2741,14 @@ declare abstract class HistoryPlayback extends Component {
 declare class ProcessGraphic extends HistoryPlayback {
     private graphicSrc;
     constructor(renderTarget: Element);
-    render(environmentFqdn: string, getToken: () => Promise<string>, graphicSrc: string, data: Array<TsqExpression>, chartOptions: any): void;
+    render(graphicSrc: string, data: Array<TsqExpression>, chartOptions: any): void;
+    private externalOnSelectTimeStamp;
+    onReady: (() => void) | null;
+    private cleanup;
+    private initializeComponent;
+    private showErrorMessage;
+    private onSelectTimestamp;
+    setDataForTimestamp(data: Array<any>): void;
     protected loadResources(): Promise<GraphicInfo>;
     protected draw(): void;
     private getResizedImageDimensions;