Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@toast-ui/chart

Package Overview
Dependencies
Maintainers
2
Versions
35
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@toast-ui/chart - npm Package Compare versions

Comparing version 4.0.0-alpha.4 to 4.0.0-beta.0

1

dist/esm/animator.d.ts

@@ -30,3 +30,4 @@ import Chart from "./charts/chart";

next(timestamp: number): void;
cancelAnimFrame(): void;
}
export {};

10

dist/esm/animator.js

@@ -44,5 +44,3 @@ import { isNull } from "./helpers/utils";

this.anims = [];
if (this.requestId) {
window.cancelAnimationFrame(this.requestId);
}
this.cancelAnimFrame();
this.state = 'IDLE';

@@ -93,2 +91,3 @@ this.requestId = null;

if (anim.completed) {
this.cancelAnimFrame();
anim.onCompleted();

@@ -100,2 +99,7 @@ anim.chart.eventBus.emit('animationCompleted', anim.requester);

}
cancelAnimFrame() {
if (this.requestId) {
window.cancelAnimationFrame(this.requestId);
}
}
}

2

dist/esm/charts/areaChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { AreaChartOptions, AreaSeriesData, AreaSeriesInput, PlotLine, PlotBand } from "../../types/options";
export interface AreaChartProps {
el: Element;
el: HTMLElement;
options: AreaChartOptions;

@@ -6,0 +6,0 @@ data: AreaSeriesData;

4

dist/esm/charts/areaChart.js

@@ -50,6 +50,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -56,0 +56,0 @@ }

4

dist/esm/charts/barChart.js

@@ -49,6 +49,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -55,0 +55,0 @@ }

2

dist/esm/charts/boxPlotChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { BoxPlotSeriesType, BoxPlotSeriesData, BoxPlotChartOptions } from "../../types/options";
export interface BoxPlotChartProps {
el: Element;
el: HTMLElement;
options: BoxPlotChartOptions;

@@ -6,0 +6,0 @@ data: BoxPlotSeriesData;

4

dist/esm/charts/boxPlotChart.js

@@ -38,6 +38,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -44,0 +44,0 @@ }

2

dist/esm/charts/bubbleChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { BubbleSeriesData, BaseOptions, BubbleSeriesDataType, BubbleSeriesInput, BubbleChartOptions } from "../../types/options";
export interface BubbleChartProps {
el: Element;
el: HTMLElement;
options: BaseOptions;

@@ -6,0 +6,0 @@ data: BubbleSeriesData;

4

dist/esm/charts/bubbleChart.js

@@ -38,6 +38,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -44,0 +44,0 @@ }

2

dist/esm/charts/bulletChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { BulletChartOptions, BulletSeriesType, BulletSeriesData } from "../../types/options";
export interface BulletChartProps {
el: Element;
el: HTMLElement;
options: BulletChartOptions;

@@ -6,0 +6,0 @@ data: BulletSeriesData;

4

dist/esm/charts/bulletChart.js

@@ -34,6 +34,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -40,0 +40,0 @@ }

6

dist/esm/charts/chart.d.ts

@@ -28,3 +28,3 @@ import Store from "../store/store";

animator: Animator;
readonly el: Element;
readonly el: HTMLElement;
ctx: CanvasRenderingContext2D;

@@ -43,3 +43,3 @@ painter: any;

resizeChartSize(): void;
private throttleResizeEvent;
private debounceResizeEvent;
setResizeEvent(): void;

@@ -91,2 +91,4 @@ clearResizeEvent(): void;

setTooltipOffset(offset: Partial<Point>): void;
private setResizeEventListeners;
protected dispatchOptionsEvent(eventName: 'initOptions' | 'updateOptions', options: Options): void;
}

102

dist/esm/charts/chart.js

@@ -7,3 +7,3 @@ import Store from '../store/store';

import legend from '../store/legend';
import optionsStore, { useResponsive } from '../store/options';
import optionsStore from '../store/options';
import theme from '../store/theme';

@@ -14,6 +14,26 @@ import EventEmitter from '../eventEmitter';

import Animator from '../animator';
import { debounce, isBoolean, isNumber, isUndefined, pick, throttle } from '../helpers/utils';
import { debounce, isBoolean, isNumber, isUndefined, pick, isAutoValue } from '../helpers/utils';
import { responderDetectors } from '../responderDetectors';
import { message } from '../message';
export const DEFAULT_ANIM_DURATION = 500;
function getUsingContainerSize(eventName, usingContainerSize, width, height) {
const { width: usingContainerWidth, height: usingContainerHeight } = usingContainerSize;
const isAutoWidth = isAutoValue(width);
const isAutoHeight = isAutoValue(height);
return eventName === 'updateOptions'
? {
width:
!isUndefined(width) && usingContainerWidth !== isAutoWidth
? isAutoWidth
: usingContainerWidth,
height:
!isUndefined(height) && usingContainerHeight !== isAutoHeight
? isAutoHeight
: usingContainerHeight,
}
: {
width: isAutoWidth,
height: isAutoHeight,
};
}
export default class Chart {

@@ -29,5 +49,5 @@ constructor(props) {

};
this.throttleResizeEvent = throttle(() => {
this.debounceResizeEvent = debounce(() => {
this.resizeChartSize();
}, 200);
}, 100);
/**

@@ -173,2 +193,28 @@ * Get checked legend chart type and label, checked state.

};
this.setResizeEventListeners = (eventName, options) => {
var _a, _b, _c, _d;
const { usingContainerSize } = this.store.state;
const { width: usingContainerWidth, height: usingContainerHeight } = usingContainerSize;
const width =
(_b = (_a = options) === null || _a === void 0 ? void 0 : _a.chart) === null ||
_b === void 0
? void 0
: _b.width;
const height =
(_d = (_c = options) === null || _c === void 0 ? void 0 : _c.chart) === null ||
_d === void 0
? void 0
: _d.height;
const isAutoWidth = isAutoValue(width);
const isAutoHeight = isAutoValue(height);
if ((usingContainerWidth || usingContainerHeight) && isNumber(width) && isNumber(height)) {
this.clearResizeEvent();
} else if (!(usingContainerWidth || usingContainerHeight) && (isAutoWidth || isAutoHeight)) {
this.setResizeEvent();
}
this.store.dispatch(
'setUsingContainerSize',
getUsingContainerSize(eventName, usingContainerSize, width, height)
);
};
const { el, options, series, categories } = props;

@@ -194,3 +240,3 @@ this.el = el;

if (this.animationControlFlag.resizing) {
duration = isBoolean(options.responsive)
duration = isUndefined(options.responsive)
? this.getAnimationDuration()

@@ -200,2 +246,3 @@ : this.getAnimationDuration(

);
this.animationControlFlag.resizing = false;
}

@@ -224,2 +271,3 @@ this.eventBus.emit('loopStart');

setTimeout(() => {
var _a, _b, _c, _d;
this.initialize();

@@ -229,3 +277,16 @@ this.store.observe(() => {

});
if (useResponsive(options)) {
if (
isAutoValue(
(_b = (_a = options) === null || _a === void 0 ? void 0 : _a.chart) === null ||
_b === void 0
? void 0
: _b.width
) ||
isAutoValue(
(_d = (_c = options) === null || _c === void 0 ? void 0 : _c.chart) === null ||
_d === void 0
? void 0
: _d.height
)
) {
this.setResizeEvent();

@@ -249,3 +310,2 @@ }

}
this.animationControlFlag.resizing = false;
this.animationControlFlag.updating = false;

@@ -257,4 +317,11 @@ return duration;

const { offsetWidth, offsetHeight } = this.el;
const { width, height } = this.store.state.chart;
if ((!offsetWidth && !offsetHeight) || (offsetWidth === width && offsetHeight === height)) {
const {
usingContainerSize: { width: usingContainerWidth, height: usingContainerHeight },
chart: { width, height },
} = this.store.state;
if (
(!usingContainerWidth && !usingContainerHeight) ||
(!offsetWidth && !offsetHeight) ||
(offsetWidth === width && offsetHeight === height)
) {
this.animationControlFlag.resizing = false;

@@ -264,10 +331,13 @@ return;

this.eventBus.emit('resetHoveredSeries');
this.store.dispatch('setChartSize', { width: offsetWidth, height: offsetHeight });
this.store.dispatch('setChartSize', {
width: usingContainerWidth ? offsetWidth : width,
height: usingContainerHeight ? offsetHeight : height,
});
this.draw();
}
setResizeEvent() {
window.addEventListener('resize', this.throttleResizeEvent);
window.addEventListener('resize', this.debounceResizeEvent);
}
clearResizeEvent() {
window.removeEventListener('resize', this.throttleResizeEvent);
window.removeEventListener('resize', this.debounceResizeEvent);
}

@@ -366,2 +436,10 @@ handleEvent(event) {

}
dispatchOptionsEvent(eventName, options) {
this.setResizeEventListeners(eventName, options);
const { offsetWidth, offsetHeight } = this.el;
this.store.dispatch(eventName, {
options,
containerSize: { width: offsetWidth, height: offsetHeight },
});
}
}

4

dist/esm/charts/columnChart.js

@@ -48,6 +48,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -54,0 +54,0 @@ }

2

dist/esm/charts/columnLineChart.d.ts

@@ -5,3 +5,3 @@ import Chart, { AddSeriesDataInfo } from "./chart";

export interface ColumnLineChartProps {
el: Element;
el: HTMLElement;
options: ColumnLineChartOptions;

@@ -8,0 +8,0 @@ data: ColumnLineData;

4

dist/esm/charts/columnLineChart.js

@@ -60,6 +60,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -66,0 +66,0 @@ }

2

dist/esm/charts/heatmapChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { HeatmapChartOptions, HeatmapSeriesData, HeatmapSeriesDataType } from "../../types/options";
export interface HeatmapChartProps {
el: Element;
el: HTMLElement;
options: HeatmapChartOptions;

@@ -6,0 +6,0 @@ data: HeatmapSeriesData;

4

dist/esm/charts/heatmapChart.js

@@ -55,6 +55,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -61,0 +61,0 @@ }

2

dist/esm/charts/lineAreaChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { LineAreaChartOptions, LineAreaData, LineSeriesDataType, PlotBand, PlotLine } from "../../types/options";
export interface LineAreaChartProps {
el: Element;
el: HTMLElement;
options: LineAreaChartOptions;

@@ -6,0 +6,0 @@ data: LineAreaData;

4

dist/esm/charts/lineAreaChart.js

@@ -51,6 +51,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -57,0 +57,0 @@ }

4

dist/esm/charts/lineChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { LineChartOptions, LineSeriesData, LineSeriesDataType, LineSeriesInput, PlotLine, PlotBand } from "../../types/options";
export interface LineChartProps {
el: Element;
el: HTMLElement;
options: LineChartOptions;

@@ -21,4 +21,4 @@ data: LineSeriesData;

showSeriesLabel: () => void;
setOptions: (options: LineChartOptions) => void;
updateOptions: (options: LineChartOptions) => void;
setOptions: (options: LineChartOptions) => void;
}

8

dist/esm/charts/lineChart.js

@@ -48,8 +48,8 @@ import Chart from './chart';

};
this.setOptions = (options) => {
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};
this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
};
}

@@ -56,0 +56,0 @@ initialize() {

2

dist/esm/charts/lineScatterChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { CoordinateDataType, LineScatterChartOptions, LineScatterData } from "../../types/options";
export interface LineScatterChartProps {
el: Element;
el: HTMLElement;
options: LineScatterChartOptions;

@@ -6,0 +6,0 @@ data: LineScatterData;

4

dist/esm/charts/lineScatterChart.js

@@ -44,6 +44,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -50,0 +50,0 @@ }

2

dist/esm/charts/nestedPieChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { NestedPieChartOptions, NestedPieSeriesData, NestedPieSeriesType } from "../../types/options";
export interface NestedPieChartProps {
el: Element;
el: HTMLElement;
options: NestedPieChartOptions;

@@ -6,0 +6,0 @@ data: NestedPieSeriesData;

4

dist/esm/charts/nestedPieChart.js

@@ -33,6 +33,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -39,0 +39,0 @@ }

2

dist/esm/charts/pieChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { PieChartOptions, PieSeriesData, PieSeriesType } from "../../types/options";
export interface PieChartProps {
el: Element;
el: HTMLElement;
options: PieChartOptions;

@@ -6,0 +6,0 @@ data: PieSeriesData;

4

dist/esm/charts/pieChart.js

@@ -33,6 +33,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -39,0 +39,0 @@ }

2

dist/esm/charts/radarChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { RadarChartOptions, RadarSeriesData, RadarSeriesInput } from "../../types/options";
export interface RadarChartProps {
el: Element;
el: HTMLElement;
options: RadarChartOptions;

@@ -6,0 +6,0 @@ data: RadarSeriesData;

4

dist/esm/charts/radarChart.js

@@ -36,6 +36,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -42,0 +42,0 @@ }

2

dist/esm/charts/scatterChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { CoordinateDataType, ScatterChartOptions, ScatterSeriesData, ScatterSeriesInput } from "../../types/options";
export interface ScatterChartProps {
el: Element;
el: HTMLElement;
options: ScatterChartOptions;

@@ -6,0 +6,0 @@ data: ScatterSeriesData;

4

dist/esm/charts/scatterChart.js

@@ -39,6 +39,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -45,0 +45,0 @@ }

2

dist/esm/charts/treemapChart.d.ts
import Chart, { AddSeriesDataInfo } from "./chart";
import { TreemapChartOptions, TreemapSeriesData, TreemapSeriesType } from "../../types/options";
export interface TreemapChartProps {
el: Element;
el: HTMLElement;
options: TreemapChartOptions;

@@ -6,0 +6,0 @@ data: TreemapSeriesData;

4

dist/esm/charts/treemapChart.js

@@ -37,6 +37,6 @@ import Chart from './chart';

this.setOptions = (options) => {
this.store.dispatch('initOptions', options);
this.dispatchOptionsEvent('initOptions', options);
};
this.updateOptions = (options) => {
this.store.dispatch('updateOptions', options);
this.dispatchOptionsEvent('updateOptions', options);
};

@@ -43,0 +43,0 @@ }

4

dist/esm/component/areaSeries.d.ts

@@ -46,3 +46,3 @@ import Component from "./component";

tooltip?: import("../../types/options").BaseTooltipOptions | undefined;
responsive?: boolean | import("../../types/options").ResponsiveObjectType | undefined;
responsive?: import("../../types/options").ResponsiveObjectType | undefined;
} | {

@@ -58,3 +58,3 @@ series?: LineAreaChartSeriesOptions | undefined;

tooltip?: import("../../types/options").BaseTooltipOptions | undefined;
responsive?: boolean | import("../../types/options").ResponsiveObjectType | undefined;
responsive?: import("../../types/options").ResponsiveObjectType | undefined;
};

@@ -61,0 +61,0 @@ render(chartState: ChartState<AreaChartOptions | LineAreaChartOptions>, computed: any): void;

14

dist/esm/component/boxSeries.d.ts

@@ -65,3 +65,3 @@ import Component from "./component";

tooltip?: import("../../types/options").BaseTooltipOptions | undefined;
responsive?: boolean | import("../../types/options").ResponsiveObjectType | undefined;
responsive?: import("../../types/options").ResponsiveObjectType | undefined;
} | {

@@ -79,3 +79,3 @@ series?: (BoxSeriesOptions & {

theme?: import("../../types/theme").BaseThemeOptions | undefined;
responsive?: boolean | import("../../types/options").ResponsiveObjectType | undefined;
responsive?: import("../../types/options").ResponsiveObjectType | undefined;
} | {

@@ -91,3 +91,3 @@ series?: ColumnLineChartSeriesOptions | undefined;

theme?: import("../../types/theme").BaseThemeOptions | undefined;
responsive?: boolean | import("../../types/options").ResponsiveObjectType | undefined;
responsive?: import("../../types/options").ResponsiveObjectType | undefined;
};

@@ -136,4 +136,4 @@ render<T extends BarChartOptions | ColumnChartOptions | ColumnLineChartOptions>(chartState: ChartState<T>, computed: any): void;

active?: boolean | undefined;
chartType?: "area" | "line" | "boxPlot" | "bullet" | "pie" | "heatmap" | "bar" | "column" | "scatter" | "bubble" | "radar" | "treemap" | undefined;
iconType?: "triangle" | "circle" | "line" | "rect" | "pentagon" | "star" | "diamond" | "cross" | "hexagon" | "spectrum" | undefined;
chartType?: "area" | "line" | "boxPlot" | "bullet" | "pie" | "heatmap" | "bar" | "column" | "bubble" | "radar" | "scatter" | "treemap" | undefined;
iconType?: "triangle" | "circle" | "line" | "rect" | "spectrum" | "pentagon" | "star" | "diamond" | "cross" | "hexagon" | undefined;
useScatterChartIcon?: boolean | undefined;

@@ -190,4 +190,4 @@ }[];

active?: boolean | undefined;
chartType?: "area" | "line" | "boxPlot" | "bullet" | "pie" | "heatmap" | "bar" | "column" | "scatter" | "bubble" | "radar" | "treemap" | undefined;
iconType?: "triangle" | "circle" | "line" | "rect" | "pentagon" | "star" | "diamond" | "cross" | "hexagon" | "spectrum" | undefined;
chartType?: "area" | "line" | "boxPlot" | "bullet" | "pie" | "heatmap" | "bar" | "column" | "bubble" | "radar" | "scatter" | "treemap" | undefined;
iconType?: "triangle" | "circle" | "line" | "rect" | "spectrum" | "pentagon" | "star" | "diamond" | "cross" | "hexagon" | undefined;
useScatterChartIcon?: boolean | undefined;

@@ -194,0 +194,0 @@ }[];

3

dist/esm/component/boxSeries.js

@@ -186,3 +186,4 @@ import Component from './component';

const { layout, series, axes, stackSeries, legend, theme } = chartState;
if (stackSeries && stackSeries[this.name]) {
this.isShow = !(stackSeries && stackSeries[this.name]);
if (!this.isShow) {
return;

@@ -189,0 +190,0 @@ }

3

dist/esm/component/boxStackSeries.js

@@ -99,3 +99,4 @@ import BoxSeries, { isLeftBottomSide, SeriesDirection } from './boxSeries';

const { viewRange } = computed;
if (!stackSeries[this.name]) {
this.isShow = !!stackSeries[this.name];
if (!this.isShow) {
return;

@@ -102,0 +103,0 @@ }

5

dist/esm/component/exportMenu.d.ts

@@ -24,3 +24,4 @@ import Component from "./component";

onClickExportButton: (ev: any) => void;
getExportMenuEl(chartWidth: number): HTMLDivElement;
applyExportButtonPanelStyle(chartWidth: number): void;
makeExportMenuButton(): HTMLDivElement;
initialize({ chartEl }: {

@@ -34,4 +35,4 @@ chartEl: any;

render({ options, layout, chart, series, categories, theme }: ChartState<Options>): void;
makePanelBorderStyle(): string;
makePanelWrapperStyle(chartWidth: number): string;
makePanelStyle(type: 'header' | 'body'): string;
}

29

dist/esm/component/exportMenu.js

@@ -42,12 +42,17 @@ import Component from './component';

}
getExportMenuEl(chartWidth) {
const { top, left } = this.chartEl.getBoundingClientRect();
const topPosition = top + padding.Y + BUTTON_RECT_SIZE + 5;
const leftPosition = left + chartWidth - EXPORT_MENU_WIDTH - padding.X;
applyExportButtonPanelStyle(chartWidth) {
const exportMenu = this.exportMenuEl.querySelector('.export-menu');
const exportMenuTitle = this.exportMenuEl.querySelector('.export-menu-title');
const menuBtnWrapper = this.exportMenuEl.querySelector('.export-menu-btn-wrapper');
exportMenu.setAttribute('style', this.makePanelWrapperStyle(chartWidth));
exportMenuTitle.setAttribute('style', this.makePanelStyle('header'));
menuBtnWrapper.setAttribute('style', this.makePanelStyle('body'));
}
makeExportMenuButton() {
const el = document.createElement('div');
el.onclick = this.onClickExportButton;
el.innerHTML = `
<div class="export-menu" style="top: ${topPosition}px; left: ${leftPosition}px; ${this.makePanelBorderStyle()}">
<p class="export-menu-title" style="${this.makePanelStyle('header')}">Export to</p>
<div class="export-menu-btn-wrapper" style="${this.makePanelStyle('body')}">
<div class="export-menu">
<p class="export-menu-title">Export to</p>
<div class="export-menu-btn-wrapper">
<button class="export-menu-btn" id="xls">xls</button>

@@ -66,2 +71,3 @@ <button class="export-menu-btn" id="csv">csv</button>

this.name = 'exportMenu';
this.exportMenuEl = this.makeExportMenuButton();
}

@@ -94,3 +100,3 @@ onClick({ responders }) {

);
this.exportMenuEl = this.getExportMenuEl(chart.width);
this.applyExportButtonPanelStyle(chart.width);
this.rect = layout.exportMenu;

@@ -116,5 +122,8 @@ this.models.exportMenuButton = [

}
makePanelBorderStyle() {
makePanelWrapperStyle(chartWidth) {
const { top, left } = this.chartEl.getBoundingClientRect();
const topPosition = top + padding.Y + BUTTON_RECT_SIZE + 5;
const leftPosition = left + chartWidth - EXPORT_MENU_WIDTH - padding.X;
const { borderRadius, borderWidth, borderColor } = this.theme.panel;
return `border: ${borderWidth}px solid ${borderColor}; border-radius: ${borderRadius}px;`;
return `top: ${topPosition}px; left: ${leftPosition}px; border: ${borderWidth}px solid ${borderColor}; border-radius: ${borderRadius}px;`;
}

@@ -121,0 +130,0 @@ makePanelStyle(type) {

4

dist/esm/component/pieSeries.d.ts

@@ -53,3 +53,3 @@ import Component from "./component";

plot?: Partial<import("../../types/options").Size> | undefined;
responsive?: boolean | import("../../types/options").ResponsiveObjectType | undefined;
responsive?: import("../../types/options").ResponsiveObjectType | undefined;
};

@@ -92,3 +92,3 @@ makeRenderOptions(options: PieChartOptions): RenderOptions;

color?: string | undefined;
}) | SelectSectorStyle, "lineWidth" | "strokeStyle" | "shadowColor" | "shadowOffsetX" | "shadowOffsetY" | "shadowBlur">[];
}) | SelectSectorStyle, "lineWidth" | "shadowColor" | "shadowBlur" | "strokeStyle" | "shadowOffsetX" | "shadowOffsetY">[];
radius: {

@@ -95,0 +95,0 @@ inner: number;

4

dist/esm/component/treemapSeries.d.ts

@@ -30,3 +30,3 @@ import Component from "./component";

};
getRespondersWithTheme(responders: TreemapRectResponderModel[], type: RespondersThemeType): ((Pick<TreemapRectModel, "label" | "style" | "x" | "y" | "opacity" | "type" | "width" | "height" | "color" | "thickness" | "colorRatio" | "id" | "parentId" | "hasChild" | "indexes" | "depth" | "ratio" | "colorValue"> & {
getRespondersWithTheme(responders: TreemapRectResponderModel[], type: RespondersThemeType): ((Pick<TreemapRectModel, "label" | "style" | "color" | "x" | "y" | "opacity" | "type" | "width" | "height" | "thickness" | "colorRatio" | "id" | "parentId" | "hasChild" | "indexes" | "depth" | "ratio" | "colorValue"> & {
index?: number | undefined;

@@ -39,3 +39,3 @@ data?: Partial<TooltipData> | undefined;

borderWidth?: number | undefined;
}) | (Pick<TreemapRectModel, "label" | "style" | "x" | "y" | "opacity" | "type" | "width" | "height" | "color" | "thickness" | "colorRatio" | "id" | "parentId" | "hasChild" | "indexes" | "depth" | "ratio" | "colorValue"> & {
}) | (Pick<TreemapRectModel, "label" | "style" | "color" | "x" | "y" | "opacity" | "type" | "width" | "height" | "thickness" | "colorRatio" | "id" | "parentId" | "hasChild" | "indexes" | "depth" | "ratio" | "colorValue"> & {
index?: number | undefined;

@@ -42,0 +42,0 @@ data?: Partial<TooltipData> | undefined;

9

dist/esm/helpers/calculator.js

@@ -7,2 +7,3 @@ import * as arrayUtil from './arrayUtil';

export const LABEL_ANCHOR_POINT = crispPixel(TICK_SIZE * 2 + getTextHeight(DEFAULT_LABEL_TEXT) / 2);
let ctx;
function getDecimalLength(value) {

@@ -137,3 +138,5 @@ var _a, _b;

export function getTextWidth(text, font = DEFAULT_LABEL_TEXT) {
const ctx = document.createElement('canvas').getContext('2d');
if (!ctx) {
ctx = document.createElement('canvas').getContext('2d');
}
ctx.font = font;

@@ -143,3 +146,5 @@ return Math.ceil(ctx.measureText(text).width);

export function getTextHeight(font = DEFAULT_LABEL_TEXT) {
const ctx = document.createElement('canvas').getContext('2d');
if (!ctx) {
ctx = document.createElement('canvas').getContext('2d');
}
ctx.font = font;

@@ -146,0 +151,0 @@ const matches = ctx.font.match(/\d+/);

4

dist/esm/helpers/coordinate.d.ts

@@ -8,8 +8,8 @@ import { CoordinateDataType, Point, Rect } from "../../types/options";

export declare function isCoordinateSeries(series: Series): true | ({
data: import("../../types/options").ScatterSeriesType[];
data: import("../../types/options").BubbleSeriesType[];
colors?: string[] | undefined;
} & import("../../types/store/store").SeriesGroup) | ({
data: import("../../types/options").BubbleSeriesType[];
data: import("../../types/options").ScatterSeriesType[];
colors?: string[] | undefined;
} & import("../../types/store/store").SeriesGroup) | undefined;
export declare function isModelExistingInRect(rect: Rect, point: Point): boolean;

10

dist/esm/helpers/dataLabels.js

@@ -53,6 +53,7 @@ import { isFunction, includes, isBoolean, isString } from './utils';

visible: isBoolean((_a = stackTotal) === null || _a === void 0 ? void 0 : _a.visible)
? (_b = stackTotal) === null || _b === void 0
? void 0
: _b.visible
? stackTotal.visible
: true,
formatter: isFunction((_b = stackTotal) === null || _b === void 0 ? void 0 : _b.formatter)
? stackTotal.formatter
: formatter,
};

@@ -307,3 +308,2 @@ }

const { type, value, direction, name, theme } = rect;
const { formatter } = dataLabelOptions;
const horizontal = isHorizontal(direction);

@@ -313,2 +313,4 @@ const labelPosition = horizontal

: makeVerticalRectLabelInfo(rect, dataLabelOptions);
const formatter =
type === 'stackTotal' ? dataLabelOptions.stackTotal.formatter : dataLabelOptions.formatter;
return Object.assign(Object.assign({ type: type }, labelPosition), {

@@ -315,0 +317,0 @@ text: isString(value) ? value : formatter(value),

3

dist/esm/helpers/utils.d.ts

@@ -0,1 +1,2 @@

import { ChartSizeInput } from "../../types/options";
export declare function isExist(value: unknown): boolean;

@@ -38,1 +39,3 @@ export declare function isDate(value: unknown): value is Date;

export declare function calculateSizeWithPercentString(size: number, value: string | number): number;
export declare function getInitialSize(size?: ChartSizeInput): number;
export declare function isAutoValue(value?: ChartSizeInput): boolean;

8

dist/esm/helpers/utils.js

@@ -111,3 +111,3 @@ export function isExist(value) {

window.clearTimeout(timer);
timer = window.setTimeout(function () {
timer = window.setTimeout(() => {
fn(...args);

@@ -239,1 +239,7 @@ }, delay);

}
export function getInitialSize(size) {
return isNumber(size) ? size : 0;
}
export function isAutoValue(value) {
return value === 'auto';
}

1

dist/esm/store/axes.js

@@ -306,3 +306,2 @@ import {

}
this.notify(state, 'layout');
state.axes = axesState;

@@ -309,0 +308,0 @@ },

11

dist/esm/store/layout.js

@@ -378,5 +378,5 @@ import { extend } from './store';

var _a, _b, _c, _d, _e, _f, _g, _h, _j;
const { legend: legendState, theme } = state;
const {
legend: { align },
legend: legendState,
theme,
circleLegend: circleLegendState,

@@ -495,3 +495,8 @@ series,

});
const circleLegend = getCircleLegendRect(xAxis, yAxis, align, circleLegendState.width);
const circleLegend = getCircleLegendRect(
xAxis,
yAxis,
legendState.align,
circleLegendState.width
);
const plot = getPlotRect(xAxis, yAxis, optionSize.plot);

@@ -498,0 +503,0 @@ extend(state.layout, {

53

dist/esm/store/legend.js

@@ -1,2 +0,2 @@

import { isUndefined, sum, includes, deepMergedCopy } from '../helpers/utils';
import { isUndefined, sum, includes, deepMergedCopy, isNumber } from '../helpers/utils';
import {

@@ -15,12 +15,13 @@ LEGEND_CHECKBOX_SIZE,

import { defaultTheme } from '../helpers/theme';
function calculateLegendWidth(defaultWidth, legendWidths, options, align, visible) {
var _a, _b, _c, _d, _e;
function calculateLegendWidth({
defaultWidth,
legendWidths,
useSpectrumLegend,
options,
align,
visible,
}) {
var _a, _b;
const verticalAlign = isVerticalAlign(align);
const legendOptions = (_a = options) === null || _a === void 0 ? void 0 : _a.legend;
const useColorValue =
((_d =
(_c = (_b = options) === null || _b === void 0 ? void 0 : _b.series) === null || _c === void 0
? void 0
: _c.useColorValue),
_d !== null && _d !== void 0 ? _d : false);
let legendWidth = defaultWidth;

@@ -30,9 +31,9 @@ if (!visible) {

}
if ((_e = legendOptions) === null || _e === void 0 ? void 0 : _e.width) {
if ((_b = legendOptions) === null || _b === void 0 ? void 0 : _b.width) {
return legendOptions.width;
}
if (useColorValue && verticalAlign) {
if (useSpectrumLegend && verticalAlign) {
const labelAreaWidth = sum(legendWidths);
legendWidth = Math.max(getInitialWidth(options) / 4, labelAreaWidth);
} else if (useColorValue && !verticalAlign) {
} else if (useSpectrumLegend && !verticalAlign) {
const spectrumAreaWidth =

@@ -45,3 +46,3 @@ spectrumLegendTooltip.PADDING * 2 +

legendWidth = Math.max(...legendWidths) + spectrumAreaWidth;
} else if (!useColorValue && verticalAlign) {
} else if (!useSpectrumLegend && verticalAlign) {
legendWidth = sum(legendWidths) + LEGEND_ITEM_MARGIN_X * (legendWidths.length - 1);

@@ -146,7 +147,6 @@ } else {

function getInitialWidth(options) {
var _a, _b;
return (
(_b = (_a = options.chart) === null || _a === void 0 ? void 0 : _a.width),
_b !== null && _b !== void 0 ? _b : 0
);
var _a;
return isNumber((_a = options.chart) === null || _a === void 0 ? void 0 : _a.width)
? options.chart.width
: 0;
}

@@ -212,3 +212,7 @@ function getLegendDataAppliedTheme(data, series) {

setLegendLayout({ state, initStoreState }) {
const { legend: legendData, series, options } = state;
const {
legend: { data: legendData, useSpectrumLegend },
series,
options,
} = state;
const align = getAlign(options);

@@ -218,4 +222,11 @@ const visible = showLegend(options, series);

const initialWidth = Math.min(getInitialWidth(options) / 10, 150);
const legendWidths = legendData.data.map(({ width }) => width);
const legendWidth = calculateLegendWidth(initialWidth, legendWidths, options, align, visible);
const legendWidths = legendData.map(({ width }) => width);
const legendWidth = calculateLegendWidth({
defaultWidth: initialWidth,
legendWidths,
useSpectrumLegend,
options,
align,
visible,
});
const isNestedPieChart = hasNestedPieSeries(initStoreState.series);

@@ -222,0 +233,0 @@ const circleLegendWidth = isVerticalAlign(align)

3

dist/esm/store/options.d.ts

@@ -1,4 +0,3 @@

import { StoreModule, Options } from "../../types/store/store";
export declare function useResponsive(options: Options): boolean;
import { StoreModule } from "../../types/store/store";
declare const optionsData: StoreModule;
export default optionsData;

45

dist/esm/store/options.js

@@ -1,2 +0,2 @@

import { deepCopy, isUndefined, deepMergedCopy } from '../helpers/utils';
import { deepCopy, deepMergedCopy } from '../helpers/utils';
function getOptionsBySize(size, options) {

@@ -11,7 +11,17 @@ var _a;

}
export function useResponsive(options) {
function getSize(usingContainerSize, containerSize, chartSize) {
var _a, _b;
return isUndefined((_a = options) === null || _a === void 0 ? void 0 : _a.responsive)
? true
: !!((_b = options) === null || _b === void 0 ? void 0 : _b.responsive);
const { width: usingContainerWidth, height: usingContainerHeight } = usingContainerSize;
return {
width: usingContainerWidth
? containerSize.width
: (_a = chartSize) === null || _a === void 0
? void 0
: _a.width,
height: usingContainerHeight
? containerSize.height
: (_b = chartSize) === null || _b === void 0
? void 0
: _b.height,
};
}

@@ -26,5 +36,2 @@ const optionsData = {

setOptions({ state }) {
if (!useResponsive(state.options)) {
return;
}
const { width, height } = state.chart;

@@ -36,14 +43,22 @@ if (width < 0 || height < 0) {

},
initOptions({ initStoreState, state }, options) {
initOptions({ initStoreState, state }, { options, containerSize }) {
initStoreState.options = options;
state.originalOptions = deepCopy(options);
const { width, height } = state.originalOptions.chart;
this.dispatch('setChartSize', { width, height });
const { usingContainerSize, originalOptions } = state;
const size = getSize(usingContainerSize, containerSize, {
width: originalOptions.chart.width,
height: originalOptions.chart.height,
});
this.dispatch('setChartSize', size);
},
updateOptions({ state, initStoreState }, options) {
updateOptions({ state, initStoreState }, { options, containerSize }) {
var _a, _b;
initStoreState.options = deepMergedCopy(initStoreState.options, options);
state.originalOptions = deepMergedCopy(state.originalOptions, options);
const width = state.originalOptions.chart.width;
const height = state.originalOptions.chart.height;
this.dispatch('setChartSize', { width, height });
const { usingContainerSize, originalOptions } = state;
const size = getSize(usingContainerSize, containerSize, {
width: (_a = originalOptions.chart) === null || _a === void 0 ? void 0 : _a.width,
height: (_b = originalOptions.chart) === null || _b === void 0 ? void 0 : _b.height,
});
this.dispatch('setChartSize', size);
this.dispatch('initThemeState');

@@ -50,0 +65,0 @@ },

61

dist/esm/store/root.js

@@ -0,7 +1,45 @@

import { getInitialSize, isAutoValue } from '../helpers/utils';
function initialSize(containerEl, { width, height }) {
return {
width: width === 0 ? containerEl.offsetWidth : width,
height: height === 0 ? containerEl.offsetHeight : height,
};
}
const root = {
name: 'root',
// 파라메터로 data 초기 데이터도 받아야 한다.
state: ({ options }) => ({
chart: Object.assign({ width: 0, height: 0 }, options.chart),
}),
state: ({ options }) => {
var _a, _b, _c, _d, _e, _f, _g, _h;
return {
chart: Object.assign(Object.assign({}, options.chart), {
width: getInitialSize(
(_b = (_a = options) === null || _a === void 0 ? void 0 : _a.chart) === null ||
_b === void 0
? void 0
: _b.width
),
height: getInitialSize(
(_d = (_c = options) === null || _c === void 0 ? void 0 : _c.chart) === null ||
_d === void 0
? void 0
: _d.height
),
}),
usingContainerSize: {
width: isAutoValue(
(_f = (_e = options) === null || _e === void 0 ? void 0 : _e.chart) === null ||
_f === void 0
? void 0
: _f.width
),
height: isAutoValue(
(_h = (_g = options) === null || _g === void 0 ? void 0 : _g.chart) === null ||
_h === void 0
? void 0
: _h.height
),
},
container: {},
};
},
action: {

@@ -13,14 +51,9 @@ setChartSize({ state }, size) {

initChartSize({ state }, containerEl) {
if (state.chart.width === 0 || state.chart.height === 0) {
const { width, height } = state.chart;
if (width === 0 || height === 0) {
if (containerEl.parentNode) {
this.dispatch('setChartSize', {
width: containerEl.offsetWidth,
height: containerEl.offsetHeight,
});
this.dispatch('setChartSize', initialSize(containerEl, { width, height }));
} else {
setTimeout(() => {
this.dispatch('setChartSize', {
width: containerEl.offsetWidth,
height: containerEl.offsetHeight,
});
this.dispatch('setChartSize', initialSize(containerEl, { width, height }));
}, 0);

@@ -30,4 +63,8 @@ }

},
setUsingContainerSize({ state }, { width, height }) {
state.usingContainerSize.width = width;
state.usingContainerSize.height = height;
},
},
};
export default root;

43

dist/esm/store/stackSeriesData.js

@@ -125,23 +125,25 @@ import { extend } from './store';

}
function initStackSeries(series, options) {
const stackSeries = {};
Object.keys(series).forEach((seriesName) => {
const chartType = seriesName;
const stackOption = pickStackOption(options);
if (stackOption) {
if (!stackSeries[chartType]) {
stackSeries[chartType] = {};
}
stackSeries[chartType].stack = initializeStack(stackOption);
}
});
return stackSeries;
}
const stackSeriesData = {
name: 'stackSeriesData',
state: ({ series, options }) => {
const stackSeries = {};
Object.keys(series).forEach((seriesName) => {
const chartType = seriesName;
const stackOption = pickStackOption(options);
if (stackOption) {
if (!stackSeries[chartType]) {
stackSeries[chartType] = {};
}
stackSeries[chartType].stack = initializeStack(stackOption);
}
});
return {
stackSeries,
};
},
state: ({ series, options }) => ({
stackSeries: initStackSeries(series, options),
}),
action: {
setStackSeriesData({ state }) {
const { series, stackSeries, options } = state;
const stackOption = pickStackOption(options);
const newStackSeries = {};

@@ -152,2 +154,11 @@ Object.keys(series).forEach((seriesName) => {

const { data, seriesCount, seriesGroupCount } = seriesData;
if (stackOption) {
if (!stackSeries[seriesName]) {
stackSeries[seriesName] = {};
}
stackSeries[seriesName].stack = initializeStack(stackOption);
} else {
stackSeries[seriesName] = null;
delete stackSeries[seriesName];
}
const { stack } = stackSeries[seriesName] || {};

@@ -154,0 +165,0 @@ const diverging = !!((_a = options.series) === null || _a === void 0

2

dist/toastui-chart.min.js.LICENSE.txt
/*!
* TOAST UI Chart 4th Edition
* @version 4.0.0-alpha.4 | Tue Dec 08 2020
* @version 4.0.0-beta.0 | Thu Dec 10 2020
* @author NHN. FE Development Lab <dl_javascript@nhn.com>

@@ -5,0 +5,0 @@ * @license MIT

2

package.json
{
"name": "@toast-ui/chart",
"version": "4.0.0-alpha.4",
"version": "4.0.0-beta.0",
"description": "TOAST UI Application: Chart",

@@ -5,0 +5,0 @@ "main": "dist/toastui-chart.js",

4

types/components/dataLabels.d.ts

@@ -5,3 +5,3 @@ import {

DataLabelPieSeriesName,
SubDataLabel,
StackTotalDataLabel,
BoxSeriesDataType,

@@ -47,3 +47,3 @@ } from '@t/options';

> & {
stackTotal?: Required<SubDataLabel>;
stackTotal?: Required<StackTotalDataLabel>;
pieSeriesName?: DataLabelPieSeriesName;

@@ -50,0 +50,0 @@ };

54

types/index.d.ts

@@ -8,3 +8,2 @@ import {

LineChartOptions,
LineSeriesData,
LineSeriesDataType,

@@ -29,5 +28,18 @@ Size,

ColumnLineChartOptions,
BaseOptions,
AreaSeriesData,
BoxSeriesData,
BoxPlotChartOptions,
BoxPlotSeriesData,
BubbleSeriesData,
BulletSeriesData,
ColumnLineData,
LineAreaData,
LineScatterData,
PieSeriesData,
NestedPieSeriesData,
RadarSeriesData,
ScatterSeriesData,
BoxPlotSeriesType,
BoxPlotSeriesData,
BoxPlotChartOptions,
LineSeriesData,
} from '@t/options';

@@ -50,3 +62,3 @@ import { LineChartProps } from '@src/charts/lineChart';

import { CheckedLegendType } from '@t/components/legend';
import { Options } from '@t/store/store';
import { Options, HeatmapSeriesData, TreemapSeriesData } from '@t/store/store';
import { CustomEventType, EventListener } from '@src/eventEmitter';

@@ -346,4 +358,36 @@ import { BoxPlotChartProps } from '@src/charts/boxPlotChart';

export { LineChartOptions, LineSeriesData };
export {
BaseOptions,
AreaChartOptions,
AreaSeriesData,
BarChartOptions,
BoxSeriesData,
BoxPlotChartOptions,
BoxPlotSeriesData,
BubbleSeriesData,
BulletChartOptions,
BulletSeriesData,
ColumnChartOptions,
ColumnLineChartOptions,
ColumnLineData,
HeatmapChartOptions,
HeatmapSeriesData,
LineChartOptions,
LineSeriesData,
LineAreaChartOptions,
LineAreaData,
LineScatterChartOptions,
LineScatterData,
PieChartOptions,
PieSeriesData,
NestedPieChartOptions,
NestedPieSeriesData,
RadarChartOptions,
RadarSeriesData,
ScatterChartOptions,
ScatterSeriesData,
TreemapChartOptions,
TreemapSeriesData,
};
export default tui.Chart;

26

types/options.d.ts

@@ -170,6 +170,13 @@ import { Categories, RawSeries, Options } from '@t/store/store';

type ChartSizeInput = number | 'auto';
type ChartSize = {
width?: ChartSizeInput;
height?: ChartSizeInput;
};
export type BaseChartOptions = {
title?: string | TitleOption;
animation?: AnimationOptions;
} & BaseSizeOptions;
} & ChartSize;

@@ -291,3 +298,3 @@ export interface Scale {

type ResponsiveOptions = boolean | ResponsiveObjectType;
type ResponsiveOptions = ResponsiveObjectType;

@@ -315,3 +322,3 @@ interface BaseLegendOptions {

export interface HeatmapChartOptions extends BaseOptions {
yAxis?: BaseAxisOptions & { date: DateOption };
yAxis?: BaseAxisOptions & { date?: DateOption };
theme?: HeatmapChartThemeOptions;

@@ -358,2 +365,3 @@ series?: BaseSeriesOptions & { shift?: boolean; dataLabels?: DataLabelOptions };

line?: Pick<LineTypeSeriesOptions, 'spline' | 'showDot'>;
dataLabels?: DataLabelOptions;
} & BaseSeriesOptions;

@@ -520,3 +528,3 @@

export interface ChartProps<T> {
el: Element;
el: HTMLElement;
series: RawSeries;

@@ -536,4 +544,5 @@ categories?: Categories;

export type SubDataLabel = {
export type StackTotalDataLabel = {
visible?: boolean;
formatter?: Formatter;
};

@@ -555,3 +564,3 @@

export interface BoxDataLabels extends DataLabelOptions {
stackTotal?: SubDataLabel;
stackTotal?: StackTotalDataLabel;
}

@@ -594,2 +603,3 @@ export interface PieDataLabels extends DataLabelOptions {

dataLabels?: DataLabelOptions;
eventDetectType?: BoxTypeEventDetectType;
} & BaseSeriesOptions;

@@ -621,4 +631,4 @@

export type NestedPieSeriesOptions = Record<string, PieSeriesOptions & BaseSeriesOptions> &
BaseSeriesOptions & { dataLabels?: DataLabelOptions };
export type NestedPieSeriesOptions = Record<string, PieSeriesOptions> &
BaseSeriesOptions & { dataLabels?: PieDataLabels };

@@ -625,0 +635,0 @@ export interface NestedPieChartOptions extends BaseOptions {

7

types/store/store.d.ts

@@ -282,2 +282,7 @@ import {

originalOptions: T;
container: Size;
usingContainerSize: {
width: boolean;
height: boolean;
};
}

@@ -377,1 +382,3 @@

}[keyof T];
type UsingContainerSize = { width: boolean; height: boolean };
dist/toastui-chart.min.css

Sorry, the diff of this file is not supported yet

dist/toastui-chart.min.js

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc