dist upd

dist/components/grid.d.ts

@@ -0,0 +1,14 @@
+import { GridOptions, SvgElParams } from '../types';
+import * as d3 from 'd3';
+export declare class Grid {
+    private _d3;
+    private _svgEl;
+    private _svgElParams;
+    protected gridOptions: GridOptions;
+    constructor(_d3: typeof d3, _svgEl: d3.Selection<SVGElement, unknown, null, undefined>, _svgElParams: SvgElParams, _gridOptions: GridOptions);
+    protected setOptionDefaults(gridOptions: GridOptions): GridOptions;
+    render(): void;
+    renderGridLinesX(): void;
+    renderGridLinesY(): void;
+    updateStylesOfTicks(): void;
+}

dist/index.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="lodash" />
 import VueChartwerkPodMixin from './VueChartwerkPodMixin';
 import { PodState } from './state';
+import { Grid } from './components/grid';
 import { Margin, TimeSerie, Options, TickOrientation, TimeFormat, BrushOrientation, AxisFormat, CrosshairOrientation, SvgElementAttributes, KeyEvent, PanOrientation, yAxisOrientation, ScrollPanOrientation, AxisOption } from './types';
 import { palette } from './colors';
 import * as d3 from 'd3';
@@ -13,7 +14,7 @@ declare abstract class ChartwerkPod<T extends TimeSerie, O extends Options> {
     protected brush?: d3.BrushBehavior<unknown>;
     protected zoom?: any;
     protected svg?: d3.Selection<SVGElement, unknown, null, undefined>;
-    protected state?: PodState;
+    protected state?: PodState<T, O>;
     protected clipPath?: any;
     protected isPanning: boolean;
     protected isBrushing: boolean;
@@ -31,9 +32,7 @@ declare abstract class ChartwerkPod<T extends TimeSerie, O extends Options> {
     protected readonly d3: typeof d3;
     protected deltaYTransform: number;
     protected debouncedRender: import("lodash").DebouncedFunc<any>;
-    private _xScale;
-    private _yScale;
-    private _y1Scale;
+    protected grid: Grid;
     constructor(_d3: typeof d3, el: HTMLElement, _series: T[], _options: O);
     protected addEventListeners(): void;
     protected removeEventListeners(): void;
@@ -51,7 +50,8 @@ declare abstract class ChartwerkPod<T extends TimeSerie, O extends Options> {
     }): void;
     abstract hideSharedCrosshair(): void;
     protected initPodState(): void;
-    protected renderSvg(): void;
+    protected initComponents(): void;
+    protected createSvg(): void;
     protected renderGrid(): void;
     protected renderAxes(): void;
     protected renderXAxis(): void;
@@ -83,13 +83,6 @@ declare abstract class ChartwerkPod<T extends TimeSerie, O extends Options> {
     get xScale(): d3.ScaleLinear<number, number>;
     get yScale(): d3.ScaleLinear<number, number>;
     protected get y1Scale(): d3.ScaleLinear<number, number>;
-    filterSerieByYAxisOrientation(serie: T, orientation: yAxisOrientation): boolean;
-    get minValue(): number;
-    get maxValue(): number;
-    get y1MinValue(): number;
-    get y1MaxValue(): number;
-    get minValueX(): number;
-    get maxValueX(): number;
     getd3TimeRangeEvery(count: number): d3.TimeInterval;
     get serieTimestampRange(): number | undefined;
     getAxisTicksFormatter(axisOptions: AxisOption): (d: any, i: number) => any;
@@ -100,9 +93,8 @@ declare abstract class ChartwerkPod<T extends TimeSerie, O extends Options> {
     get height(): number;
     get legendRowPositionY(): number;
     get margin(): Margin;
-    get isSeriesUnavailable(): boolean;
-    formatedBound(alias: string, target: string): string;
-    protected clearScaleCache(shouldClearState?: boolean): void;
+    formattedBound(alias: string, target: string): string;
+    protected clearState(): void;
     protected getSerieColor(idx: number): string;
     protected get seriesTargetsWithBounds(): any[];
     protected get visibleSeries(): any[];

dist/state.d.ts

@@ -1,10 +1,33 @@
-import { Options } from './types';
-export declare class PodState {
+import { TimeSerie, Options, yAxisOrientation } from './types';
+import * as d3 from 'd3';
+export declare class PodState<T extends TimeSerie, O extends Options> {
+    protected _d3: typeof d3;
+    protected boxParams: {
+        height: number;
+        width: number;
+    };
+    protected series: T[];
+    protected options: O;
     private _xValueRange;
     private _yValueRange;
     private _y1ValueRange;
     private _transform;
-    constructor(options: Options);
+    private _xScale;
+    private _yScale;
+    private _y1Scale;
+    constructor(_d3: typeof d3, boxParams: {
+        height: number;
+        width: number;
+    }, series: T[], options: O);
+    protected setInitialRanges(): void;
+    protected initScales(): void;
+    protected setYScale(): void;
+    protected setXScale(): void;
+    protected setY1Scale(): void;
+    clearState(): void;
+    get yScale(): d3.ScaleLinear<number, number>;
+    get xScale(): d3.ScaleLinear<number, number>;
+    get y1Scale(): d3.ScaleLinear<number, number>;
     get xValueRange(): [number, number] | undefined;
     get yValueRange(): [number, number] | undefined;
     get y1ValueRange(): [number, number] | undefined;
@@ -21,4 +44,12 @@ export declare class PodState {
         y?: number;
         k?: number;
     });
+    getMinValueY(): number;
+    getMaxValueY(): number;
+    getMinValueX(): number;
+    getMaxValueX(): number;
+    getMinValueY1(): number;
+    getMaxValueY1(): number;
+    get isSeriesUnavailable(): boolean;
+    protected filterSerieByYAxisOrientation(serie: T, orientation: yAxisOrientation): boolean;
 }

dist/types.d.ts

@@ -40,16 +40,7 @@ export declare type Options = {
         y?: AxisOption;
         y1?: AxisOption;
     };
-    grid?: {
-        x?: {
-            isActive?: boolean;
-            ticksCount?: number;
-        };
-        y?: {
-            isActive?: boolean;
-            ticksCount?: number;
-        };
-    };
+    grid?: GridOptions;
     crosshair?: {
         orientation?: CrosshairOrientation;
         color?: string;
@@ -103,6 +94,16 @@ export declare type Options = {
     renderTicksfromTimestamps?: boolean;
     renderLegend?: boolean;
 };
+export declare type GridOptions = {
+    x?: {
+        enabled?: boolean;
+        ticksCount?: number;
+    };
+    y?: {
+        enabled?: boolean;
+        ticksCount?: number;
+    };
+};
 export declare type AxisOption = {
     isActive?: boolean;
     ticksCount?: number;
@@ -173,3 +174,9 @@ export declare enum yAxisOrientation {
     RIGHT = "right",
     BOTH = "both"
 }
+export declare type SvgElParams = {
+    height: number;
+    width: number;
+    xScale: d3.ScaleLinear<number, number>;
+    yScale: d3.ScaleLinear<number, number>;
+};

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@chartwerk/core",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {