stz-chart-maker 1.0.1

package/dist/index.d.ts

@@ -0,0 +1,1022 @@
+import { ChartType, PluginOptionsByType, ChartOptions, GridLineOptions, FontSpec, Tick, Chart, ChartDataset, Plugin as Plugin$1, TooltipItem } from 'chart.js';
+import { ZoomPluginOptions } from 'chartjs-plugin-zoom/types/options';
+import { DeepPartial as DeepPartial$1 } from 'chart.js/dist/types/utils';
+
+/**
+ * ═════════════════════════════════════════════════════════════
+ * 📄 FILE     : zoomType.ts
+ * 📁 PACKAGE  : chartjs-toolbox-
+ * 👤 AUTHOR   : stz
+ * 🕒 CREATED  : 25. 8. 8.
+ * ═════════════════════════════════════════════════════════════
+ * ═════════════════════════════════════════════════════════════
+ * 📝 DESCRIPTION
+ *   -
+ * ═════════════════════════════════════════════════════════════
+ * ═════════════════════════════════════════════════════════════
+ * 🔄 CHANGE LOG
+ *   - DATE : 2025/08/08 | Author : stz | 최초 생성
+ * ═════════════════════════════════════════════════════════════
+ */
+
+interface PanOptions {
+    enabled: boolean;
+    mode?: 'x' | 'y' | 'xy';
+    modifierKey?: 'ctrl' | 'alt' | 'shift' | 'meta' | null;
+    scaleMode?: 'x' | 'y' | 'xy' | undefined;
+    overScaleMode?: 'x' | 'y' | 'xy' | undefined;
+    threshold?: number;
+}
+interface ZoomLimit {
+    min?: number;
+    max?: number;
+}
+type ZoomLimits = Record<string, ZoomLimit>;
+interface CustomZoomType<TType extends ChartType = ChartType> extends PluginOptionsByType<TType> {
+    zoom: ZoomPluginOptions;
+    pan?: PanOptions;
+    zoomLimits?: ZoomLimits;
+}
+type DeepPartialZoomType = DeepPartial$1<CustomZoomType>;
+
+interface DataLabelsContext {
+    chart: any;
+    dataset: any;
+    dataIndex: number;
+    datasetIndex: number;
+}
+interface DataLabels {
+    align: Position;
+    anchor: Position;
+    backgroundColor: string;
+    borderColor: string;
+    borderRadius: number;
+    borderWidth: number | ((ctx: DataLabelsContext) => number);
+    color: string | ((ctx: DataLabelsContext) => string);
+    display: boolean | ((ctx: DataLabelsContext) => boolean);
+    formatter: (value: any, ctx: DataLabelsContext) => string | number;
+    textStrokeColor: string | ((ctx: DataLabelsContext) => string);
+    textStrokeWidth: number | ((ctx: DataLabelsContext) => number);
+    textShadowBlur: number;
+    textShadowColor: string;
+}
+type PartialDataLabels = Partial<DataLabels>;
+
+/** ■■■■■■■■■■■■■■■■공통으로 사용하는 타입을 선언해놓습니다.■■■■■■■■■■■■■■■■*/
+
+interface ChartBuilder$1<TType extends ChartType> {
+    setPlugin(plugins: any): this;
+    removePlugin(pluginId: string): this;
+    build(id?: string): any;
+}
+type Position = 'start' | 'center' | 'end' | 'left' | 'right' | 'top' | 'bottom';
+type CartesianChartType = 'line' | 'bar' | 'scatter' | 'bubble';
+type Color = string | CanvasGradient | CanvasPattern;
+type Mode = 'default' | 'resize' | 'reset' | 'none' | 'hide' | 'show' | 'active';
+type DeepPartial<T> = {
+    [P in keyof T]?: T[P] extends object ? (T[P] extends Function ? T[P] : DeepPartial<T[P]>) : T[P];
+};
+type Override<T, U> = Omit<T, keyof U> & U;
+interface SettingOptions {
+    img: string;
+    iconSize: {
+        w: number;
+        h: number;
+    };
+    radiusExtra: number;
+    offset: {
+        right: number;
+        top: number;
+    };
+    colors: {
+        fill: string;
+        fillHover: string;
+        stroke: string;
+        strokeHover: string;
+    };
+    borderWidth: {
+        normal: number;
+        hover: number;
+    };
+    cursor: string;
+    onClick: (args: {
+        chart: Chart;
+        event: MouseEvent;
+    }) => void;
+}
+interface CommonCartesianTitleConfig {
+    display?: boolean;
+    align?: Position;
+    text?: string | string[];
+    color?: string;
+    font?: FontSpec;
+    padding?: {
+        top?: number;
+        bottom?: number;
+        left?: number;
+        right?: number;
+    };
+}
+interface CommonCartesian {
+    bounds: string;
+    clip: boolean;
+    position: Position;
+    stack: string;
+    stackWeight: number;
+    axis: string;
+    offset: boolean;
+    title: CommonCartesianTitleConfig;
+}
+interface CommonTicks {
+    backdropColor?: Color;
+    backdropPadding?: number;
+    callback?: (value: string | number, index: number, ticks: Tick[]) => string | number | null;
+    display?: boolean;
+    color?: Color;
+    font?: FontSpec;
+    major?: object;
+    padding?: number;
+    showLabelBackdrop?: boolean;
+    textStrokeColor?: Color;
+    textStrokeWidth?: number;
+    z?: number;
+}
+interface CommonCartesianTicks extends CommonTicks {
+    align?: Position;
+    crossAlign?: 'near' | 'center' | 'far';
+    sampleSize?: number;
+    autoSkip?: true;
+    autoSkipPadding?: number;
+    includeBounds?: boolean;
+    labelOffset?: number;
+    maxRotation?: number;
+    mirror?: boolean;
+    padding?: number;
+    maxTicksLimit?: number;
+}
+interface CommonAxes {
+    type: string;
+    alignToPixels: boolean;
+    backgroundColor: string | CanvasGradient | CanvasPattern;
+    border: object;
+    display: boolean;
+    grid: GridLineOptions;
+    min: number;
+    max: number;
+    reverse: boolean;
+    stacked: boolean | string;
+    suggestedMax: number;
+    suggestedMin: number;
+    ticks: object;
+    weight: number;
+}
+interface CommonCartesianAxes extends Omit<CommonAxes, 'ticks'>, Partial<CommonCartesian> {
+    type: 'category' | 'linear' | 'logarithmic' | 'time' | 'timeseries';
+    ticks?: CommonCartesianTicks;
+}
+type DeepPartialCartesianAxes = DeepPartial<CommonCartesianAxes>;
+type DeepPartialPluginOptions<T extends ChartType> = DeepPartial<PluginOptionsByType<T>>;
+interface CommonAxesSacels {
+    [key: string]: DeepPartialCartesianAxes;
+}
+type CustomOptionPlugins<TType extends ChartType = ChartType> = Partial<PluginOptionsByType<TType>> & {
+    zoom?: DeepPartialZoomType;
+    datalabels?: PartialDataLabels;
+    settingsIcon?: {
+        iconSize?: Record<'w' | 'h', number>;
+        img?: string;
+        radiusExtra?: number;
+        offset?: Record<'right' | 'top', number>;
+        colors?: {
+            fill?: string;
+            fillHover?: string;
+            stroke?: string;
+            strokeHover?: string;
+        };
+        borderWidth?: Record<'normal' | 'hover', number>;
+        cursor?: string;
+        onClick?: (chart: Chart<TType>, event: MouseEvent) => void;
+    };
+    htmlLegend: HtmlLegendOptions;
+};
+type CustomChartOptions<TType extends ChartType = ChartType> = Override<ChartOptions<TType>, {
+    scales?: CommonAxesSacels;
+    plugins?: CustomOptionPlugins<TType>;
+    layout?: {
+        padding?: {
+            top?: number;
+            bottom?: number;
+            left?: number;
+            right?: number;
+        };
+    };
+}> & {
+    _mounted?: (chart: Chart<TType>) => void;
+    _chartId?: string;
+};
+type CustomBarChartOptions = CustomChartOptions<'bar'>;
+type CustomLineChartOptions = CustomChartOptions<'line'>;
+type CustomPieChartOptions = CustomChartOptions<'pie'>;
+type CartesianDataset<TType extends CartesianChartType = CartesianChartType> = ChartDataset<TType, (number | null)[]> & {
+    yAxisID?: string;
+    xAxisID?: string;
+    stack?: string;
+    order?: number;
+    DATASET_ID?: string;
+};
+type Constructor<TType extends ChartType, TInstance> = new (type: TType, labels: (string | number)[], datasets: TType extends CartesianChartType ? CartesianDataset<TType>[] : ChartDataset<TType, (number | null)[]>[], options?: CustomChartOptions<TType>, plugins?: []) => TInstance;
+type CustomCartesianDataset<TType extends CartesianChartType = CartesianChartType> = ChartDataset<TType, (number | null)[]> & {
+    yAxisID?: string;
+    xAxisID?: string;
+    stack?: string;
+    order?: number;
+    _dskey?: string;
+    image?: string;
+    images?: string[];
+};
+type HtmlLegendOptions = {
+    containerID: string;
+    className?: {
+        list?: string;
+        item?: string;
+        box?: string;
+        text?: string;
+    };
+    styles?: {
+        text?: Record<string, string>;
+        textHidden?: Record<string, string>;
+        box?: (item: any, type: string, chart: Chart) => Record<string, string | number>;
+    };
+    getItemText?: (item: any) => string;
+    getDatasetType?: (chart: Chart, item: Record<string, any>) => string | undefined;
+};
+interface CartesianChartBuilder<TType extends CartesianChartType> extends ChartBuilder$1<TType> {
+    makeConfig(id?: string): any;
+    hasPlugin(pluginId: string): boolean;
+    setScales(scales: CommonAxesSacels): this;
+    setAxisTitle(axis: 'x' | 'y', titleConfig: CommonCartesianTitleConfig): this;
+    setGridOptions(axis: 'x' | 'y', gridOptions: {
+        display?: boolean;
+        color?: string;
+        lineWidth?: number;
+    }): this;
+    addZoom(defaultZoom?: boolean, zoomOption?: object): this;
+    addDataLabels(defultDataLabels?: boolean, dataLabelsOptions?: PartialDataLabels): this;
+    setYAxisForDataset(datasetIndex: number, axisId?: string): this;
+    setAxisRange(axis: 'x' | 'y', min?: number, max?: number): this;
+    setYAxisID(datasetIndex: number, axisID: string): this;
+    setAxisPosition(axis: string, position: 'left' | 'right'): this;
+    setPadding(padding: any): this;
+    setBackgroundAlpha(alpha: number): this;
+    setParsingKey(xAxisKey: string | false, yAxisKey: string | false): this;
+    setDatasetParsing(datasetIndex: number, xAxisKey: string | false, yAxisKey: string | false): this;
+    setAllDatasetsParsing(xAxisKey: string | false, yAxisKey: string | false): this;
+    customLegend(obj: HtmlLegendOptions): this;
+}
+interface BarChartBuilder extends CartesianChartBuilder<'bar'> {
+    setBarThickness(datasetIndex: number, thickness: number): this;
+    setAllBarThickness(thickness: number): this;
+    setMaxBarThickness(datasetIndex: number, maxThickness: number): this;
+    setAllMaxBarThickness(maxThickness: number): this;
+    setBarPercentage(datasetIndex: number, percentage: number): this;
+    setAllBarPercentage(percentage: number): this;
+    setCategoryPercentage(datasetIndex: number, percentage: number): this;
+    setAllCategoryPercentage(percentage: number): this;
+    setBorderWidth(datasetIndex: number, borderWidth: number): this;
+    setAllBorderWidth(borderWidth: number): this;
+    setBorderRadius(datasetIndex: number, borderRadius: number): this;
+    setAllBorderRadius(borderRadius: number): this;
+    setStacked(isStacked: boolean): this;
+    setBarImg(axis: string): this;
+}
+interface LineChartBuilder extends CartesianChartBuilder<'line'> {
+    setFill(datasetIndex: number, enable: boolean, backgroundColor?: string): this;
+    setAllFill(enable: boolean, backgroundColor?: string): this;
+    setTension(datasetIndex: number, tension: number): this;
+    setAllTension(tension: number): this;
+    setBorderWidth(datasetIndex: number, borderWidth: number): this;
+    setAllBorderWidth(borderWidth: number): this;
+    setPointRadius(datasetIndex: number, radius: number): this;
+    setAllPointRadius(radius: number): this;
+    setPointHoverRadius(datasetIndex: number, hoverRadius: number): this;
+    setAllPointHoverRadius(hoverRadius: number): this;
+}
+
+type Types_BarChartBuilder = BarChartBuilder;
+type Types_CartesianChartBuilder<TType extends CartesianChartType> = CartesianChartBuilder<TType>;
+type Types_CartesianChartType = CartesianChartType;
+type Types_CartesianDataset<TType extends CartesianChartType = CartesianChartType> = CartesianDataset<TType>;
+type Types_Color = Color;
+type Types_CommonAxes = CommonAxes;
+type Types_CommonAxesSacels = CommonAxesSacels;
+type Types_CommonCartesian = CommonCartesian;
+type Types_CommonCartesianAxes = CommonCartesianAxes;
+type Types_CommonCartesianTicks = CommonCartesianTicks;
+type Types_CommonCartesianTitleConfig = CommonCartesianTitleConfig;
+type Types_CommonTicks = CommonTicks;
+type Types_Constructor<TType extends ChartType, TInstance> = Constructor<TType, TInstance>;
+type Types_CustomBarChartOptions = CustomBarChartOptions;
+type Types_CustomCartesianDataset<TType extends CartesianChartType = CartesianChartType> = CustomCartesianDataset<TType>;
+type Types_CustomChartOptions<TType extends ChartType = ChartType> = CustomChartOptions<TType>;
+type Types_CustomLineChartOptions = CustomLineChartOptions;
+type Types_CustomOptionPlugins<TType extends ChartType = ChartType> = CustomOptionPlugins<TType>;
+type Types_CustomPieChartOptions = CustomPieChartOptions;
+type Types_DeepPartial<T> = DeepPartial<T>;
+type Types_DeepPartialCartesianAxes = DeepPartialCartesianAxes;
+type Types_DeepPartialPluginOptions<T extends ChartType> = DeepPartialPluginOptions<T>;
+type Types_HtmlLegendOptions = HtmlLegendOptions;
+type Types_LineChartBuilder = LineChartBuilder;
+type Types_Mode = Mode;
+type Types_Position = Position;
+type Types_SettingOptions = SettingOptions;
+declare namespace Types {
+  export type { Types_BarChartBuilder as BarChartBuilder, Types_CartesianChartBuilder as CartesianChartBuilder, Types_CartesianChartType as CartesianChartType, Types_CartesianDataset as CartesianDataset, ChartBuilder$1 as ChartBuilder, Types_Color as Color, Types_CommonAxes as CommonAxes, Types_CommonAxesSacels as CommonAxesSacels, Types_CommonCartesian as CommonCartesian, Types_CommonCartesianAxes as CommonCartesianAxes, Types_CommonCartesianTicks as CommonCartesianTicks, Types_CommonCartesianTitleConfig as CommonCartesianTitleConfig, Types_CommonTicks as CommonTicks, Types_Constructor as Constructor, Types_CustomBarChartOptions as CustomBarChartOptions, Types_CustomCartesianDataset as CustomCartesianDataset, Types_CustomChartOptions as CustomChartOptions, Types_CustomLineChartOptions as CustomLineChartOptions, Types_CustomOptionPlugins as CustomOptionPlugins, Types_CustomPieChartOptions as CustomPieChartOptions, Types_DeepPartial as DeepPartial, Types_DeepPartialCartesianAxes as DeepPartialCartesianAxes, Types_DeepPartialPluginOptions as DeepPartialPluginOptions, Types_HtmlLegendOptions as HtmlLegendOptions, Types_LineChartBuilder as LineChartBuilder, Types_Mode as Mode, Types_Position as Position, Types_SettingOptions as SettingOptions };
+}
+
+interface ChartConfig {
+    _chartId: string;
+    type: ChartType;
+    data: any;
+    options: any;
+    plugins?: any;
+}
+interface ChartBuilder<TType extends ChartType> {
+    setPlugin(plugins: any): this;
+    removePlugin(pluginId: string): this;
+    build(id?: string): ChartConfig;
+}
+declare abstract class ChartWrapper<TType extends ChartType> implements ChartBuilder<TType> {
+    protected type: TType;
+    protected labels: (string | number)[];
+    protected datasets: ChartDataset<TType, (number | null)[]>[];
+    protected options: CustomChartOptions<TType>;
+    protected plugins?: any | undefined;
+    static registry: Map<string, Constructor<any, any>>;
+    constructor(type: TType, labels: (string | number)[], datasets: ChartDataset<TType, (number | null)[]>[], options: CustomChartOptions<TType>, plugins?: any | undefined);
+    static create<TType extends ChartType>(type: TType, labels: (string | number)[], datasets: ChartDataset<TType, (number | null)[]>[], options?: CustomChartOptions<TType>, plugins?: any): ChartBuilder<TType>;
+    protected abstract normalize(): void;
+    protected abstract configAop(config: any): any;
+    static register<TType extends ChartType, TInstance>(type: TType, wrapperClass: Constructor<TType, TInstance>): void;
+    /**
+     * 플러그인을 추가합니다.
+     * @param plugin
+     * @param replaceIfExists
+     *
+     */
+    setPlugin(plugin: any, replaceIfExists?: boolean): this;
+    /**
+     * 차트 설정 객체를 생성합니다.
+     * @param {string} id
+     * @returns {ChartConfig}
+     * @Description 레거시 지원용
+     */
+    makeConfig(id?: string): ChartConfig;
+    /**
+     * 플러그인을 제거합니다.
+     * @param pluginId
+     */
+    removePlugin(pluginId: string): this;
+    /**
+     * 플러그인이 존재하는지 확인합니다.
+     * @param pluginId
+     */
+    hasPlugin(pluginId: string): boolean;
+    build(id?: string): ChartConfig;
+}
+
+interface ZoomRangeSliderColors {
+    sliderTrackColor?: string;
+    sliderActiveColor?: string;
+    sliderHandleColor?: string;
+    sliderHandleBorderColor?: string;
+    sliderHandleHoverColor?: string;
+}
+interface ZoomRangeSliderVar {
+    min: number;
+    isDragging: boolean;
+    circlePosition: number | null;
+}
+interface ZoomRangeSliderPlugin {
+    id: 'zoomRangeSlider';
+    var: ZoomRangeSliderVar;
+    afterDatasetDraw(chart: Chart, args: any, options: any): void;
+    afterUpdate(chart: Chart, args: any, options: any): void;
+    afterEvent(chart: Chart, args: any, options: any): void;
+}
+
+declare abstract class CartesianChartWrapper<TType extends CartesianChartType> extends ChartWrapper<TType> implements CartesianChartBuilder<TType> {
+    readonly type: TType;
+    private _chartId?;
+    protected constructor(type: TType, labels: (string | number)[], datasets: CustomCartesianDataset<TType>[], options?: CustomChartOptions<TType>, plugins?: Plugin);
+    get chartId(): string;
+    set chartId(value: string);
+    protected requireLabels(): boolean;
+    protected decorateDataset(ds: any, idx: number): void;
+    protected mustHavePlugins(): {
+        id: string;
+        afterDraw(chart: any, args: any, options: any): void;
+    }[];
+    protected isLine(): boolean;
+    protected isScatter(): boolean;
+    protected isBar(): boolean;
+    protected normalize(): void;
+    protected configAop(config: any): any;
+    makeConfig(id?: string): {
+        _chartId: any;
+        type: any;
+        data: any;
+        options: any;
+        plugins: any;
+    };
+    /**
+     *  Cartesian chart type을 체크 합니다.
+     * @private
+     * *
+     * @remarks cartesina 차트의 타입인지 확인합니다
+     * @example
+     * @since 1.0.0
+     * @category Chart
+     * @defaultValue
+     *
+     */
+    private isCartesianChartType;
+    /**
+     * 카테시안 차트의 스케일을 설정합니다.
+     * @param scales
+     * *
+     * @remarks 카테시안 차트의 스케일을 설정합니다. 이 메소드는 차트의 축을 정의하는데 사용됩니다.
+     * @example
+     * @since 1.0.0
+     * @category Scales
+     * @defaultValue
+     *
+     */
+    setScales(scales: CommonAxesSacels): this;
+    /**
+     * 카테시안 차트의 축 제목을 설정합니다.
+     * @param axis
+     * @param titleConfig
+     * *
+     * @remarks 원하는 축의 제목을 설정합니다.
+     * @example
+     * @since 1.0.0
+     * @category Scales
+     * @defaultValue
+     *
+     */
+    setAxisTitle(axis: 'x' | 'y', titleConfig: CommonCartesianTitleConfig): this;
+    /**
+     * 카테시안 차트의 그리드 옵션을 설정합니다.
+     * @param axis
+     * @param gridOptions
+     * *
+     * @remarks 차트 뒷 배경의 그리드(선) 옵션을 설정합니다.
+     * @example
+     * @since 1.0.0
+     * @category Scales
+     * @defaultValue
+     *
+     */
+    setGridOptions(axis: 'x' | 'y', gridOptions: {
+        display?: boolean;
+        color?: string;
+        lineWidth?: number;
+    }): this;
+    /**
+     * 줌 기능을 추가합니다.
+     * @param defaultZoom
+     * @param zoomOption
+     * *
+     * @remarks 차트의 줌 기능을 추가합니다. 해당 기능은 플러그인 설치가 필요합니다.
+     * @example
+     * @since 1.0.0
+     * @category Plugins
+     * @defaultValue defaultZoom = false
+     *
+     */
+    addZoom(defaultZoom?: boolean, zoomOption?: object): this;
+    /**
+     * 데이터 라벨 플러그인을 추가합니다.
+     * @param defultDataLabels
+     * @param dataLabelsOptions
+     * @Description 차트에 데이터 라벨을 추가합니다. 기본 옵션을 사용하거나 사용자 정의 옵션을 적용할 수 있습니다.
+     * @Category Plugins
+     * @since 1.0.0
+     * @defaultValue defultDataLabels = false
+     */
+    addDataLabels(defultDataLabels: boolean | undefined, dataLabelsOptions: PartialDataLabels): this;
+    /**
+     * 데이터셋에 y축을 설정합니다.
+     * @param datasetIndex
+     * @param axisId
+     * *
+     * @remarks 각 데이터셋의 축을 설정합니다.
+     * @example
+     * @since 1.0.0
+     * @category Scales
+     * @defaultValue axisId = 'y'
+     *
+     */
+    setYAxisForDataset(datasetIndex: number, axisId?: string): this;
+    /**
+     * y1 축을 보장합니다.
+     * @private
+     * *
+     * @remarks y1 축이 없을 경우 기본 구조를 추가합니다. 이 메소드는 y1 축을 사용하는 차트에서 필요합니다.
+     * @example
+     * @since 1.0.0
+     * @category Scales
+     * @defaultValue
+     *
+     */
+    private ensureY1AxisExists;
+    /**
+     * 카테시안 차트의 축 범위를 설정합니다.
+     * @param axis
+     * @param min
+     * @param max
+     *
+     * *
+     * @remarks 해당 차트의 스케일을 min, max 를 입력 받은 값으로 고정합니다.
+     * @example
+     * @since 1.0.0
+     * @category Scales
+     * @defaultValue
+     *
+     */
+    setAxisRange(axis: 'x' | 'y', min?: number, max?: number): this;
+    /**
+     * 데이터셋의 yAxisID를 설정합니다.
+     * @param datasetIndex
+     * @param axisID
+     * *
+     * @remarks 각 데이터셋의 축 아이디를 변경합니다.
+     * @example
+     * @since 1.0.0
+     * @category Scales
+     * @defaultValue
+     *
+     */
+    setYAxisID(datasetIndex: number, axisID: string): this;
+    /**
+     * 축의 위치를 설정합니다.
+     * @param axis
+     * @param position
+     * *
+     * @remarks 해당하는 축의 위치를 변경합니다.
+     * @example
+     * @since 1.0.0
+     * @category Scales
+     * @defaultValue
+     *
+     */
+    setAxisPosition(axis: string, position: 'left' | 'right'): this;
+    /**
+     * 축에 이미지를 추가합니다.
+     * @param {string} axis
+     * @Deprecated
+     */
+    setAddImg(axis: string): this;
+    /**
+     * 범위 슬라이더를 추가합니다.
+     * @param options - 슬라이더 커스터마이징 옵션
+     * @Deprecated
+     */
+    addRangeSlider(colors?: ZoomRangeSliderColors): this;
+    setPadding(padding: any): this;
+    setBackgroundAlpha(alpha: number): this;
+    /**
+     * 색상에 알파 값을 추가합니다.
+     * @param color
+     * @param alpha
+     * @private
+     */
+    private addAlphaToColor;
+    /**
+     *
+     * @param {string | false} xAxisKey
+     * @param {string | false} yAxisKey
+     * @description
+     * @Category options
+     * @Since 1.0.0
+     */
+    setParsingKey(xAxisKey: string | false, yAxisKey: string | false): this;
+    setDatasetParsing(datasetIndex: number, xAxisKey: string | false, yAxisKey: string | false): this;
+    setAllDatasetsParsing(xAxisKey: string | false, yAxisKey: string | false): this;
+    customLegend(obj: HtmlLegendOptions): this;
+}
+
+declare enum ChartTypes {
+    BAR = "bar",
+    LINE = "line",
+    DOUGHNUT = "doughnut",
+    PIE = "pie",
+    RADAR = "radar",
+    BUBBLE = "bubble",
+    SCATTER = "scatter",
+    TREE = "tree"
+}
+
+declare class BarChartWrapper extends CartesianChartWrapper<'bar'> implements BarChartBuilder {
+    constructor(type: ChartTypes.BAR, labels: (string | number)[], datasets: CartesianDataset<ChartTypes.BAR>[], options?: CustomBarChartOptions, plugins?: any);
+    protected requireLabels(): boolean;
+    makeConfig(id?: string): {
+        _chartId: any;
+        type: any;
+        data: any;
+        options: any;
+        plugins: any;
+    };
+    /**
+     *
+     * @param {number} datasetIndex
+     * @param {number} thickness
+     * @description 데이터셋의 Bar Thickness를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setBarThickness(datasetIndex: number, thickness: number): this;
+    /**
+     *
+     * @param {number} thickness
+     * @description 모든 데이터셋의 Bar Thickness를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setAllBarThickness(thickness: number): this;
+    /**
+     *
+     * @param {number} datasetIndex
+     * @param {number} maxThickness
+     * @description 데이터셋의 Max Bar Thickness를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setMaxBarThickness(datasetIndex: number, maxThickness: number): this;
+    /**
+     *
+     * @param {number} maxThickness
+     * @description 모든 데이터셋의 Max Bar Thickness를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setAllMaxBarThickness(maxThickness: number): this;
+    /**
+     *
+     * @param {number} datasetIndex
+     * @param {number} percentage
+     * @description 데이터셋의 Bar Percentage를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setBarPercentage(datasetIndex: number, percentage: number): this;
+    /**
+     *
+     * @param {number} percentage
+     * @description 모든 데이터셋의 Bar Percentage를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setAllBarPercentage(percentage: number): this;
+    /**
+     *
+     * @param {number} datasetIndex
+     * @param {number} percentage
+     * @description 데이터셋의 Category Percentage를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setCategoryPercentage(datasetIndex: number, percentage: number): this;
+    /**
+     *
+     * @param {number} percentage
+     * @description 모든 데이터셋의 Category Percentage를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setAllCategoryPercentage(percentage: number): this;
+    /**
+     *
+     * @param {number} datasetIndex
+     * @param {number} borderWidth
+     * @description 데이터셋의 Border Width 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setBorderWidth(datasetIndex: number, borderWidth: number): this;
+    /**
+     *
+     * @param {number} borderWidth
+     * @description 모든 데이터셋의 Border Width 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setAllBorderWidth(borderWidth: number): this;
+    /**
+     *
+     * @param {number} datasetIndex
+     * @param {number} borderRadius
+     * @description 데이터셋의 Border Radius 를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setBorderRadius(datasetIndex: number, borderRadius: number): this;
+    /**
+     *
+     * @param {number} borderRadius
+     * @description 모든 데이터셋의 Border Radius 를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setAllBorderRadius(borderRadius: number): this;
+    /**
+     *
+     * @param {boolean} isStacked
+     * @description 모든 축에 대해 Stacked 옵션을 설정합니다.
+     * @Since 1.0.0
+     * @category scales
+     */
+    setStacked(isStacked: boolean): this;
+    /**
+     *
+     * @param {string} axis
+     * @description 축에 이미지를 설정합니다. 축이 이미 존재하는 경우 경고 메시지를 출력합니다.
+     * @Since 1.0.0
+     * @category plugins
+     * @Returns {this}
+     */
+    setBarImg(axis: string): this;
+}
+
+declare class LineChartWrapper extends CartesianChartWrapper<'line'> implements LineChartBuilder {
+    constructor(type: ChartTypes.LINE, labels: (string | number)[], datasets: CartesianDataset<'line'>[], options?: CustomChartOptions<'line'>);
+    protected requireLabels(): boolean;
+    makeConfig(id?: string): {
+        _chartId: any;
+        type: any;
+        data: any;
+        options: any;
+        plugins: any;
+    };
+    /**
+     *
+     * @param {number} datasetIndex
+     * @param {boolean} enable
+     * @param {string} backgroundColor
+     * @description 데이터셋의 Fill 설정을 합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setFill(datasetIndex: number, enable: boolean, backgroundColor?: string): this;
+    /**
+     *
+     * @param {boolean} enable
+     * @param {string} backgroundColor
+     * @description 모든 데이터셋의 Fill 설정을 합니다.
+     * @Since 1.0.0
+     * @category dataset
+     *
+     */
+    setAllFill(enable: boolean, backgroundColor?: string): this;
+    /**
+     *
+     * @param {number} datasetIndex
+     * @param {number} tension
+     * @description 라인 차트의 곡률을 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setTension(datasetIndex: number, tension: number): this;
+    /**
+     *
+     * @param {number} tension
+     * @description 모든 데이터셋의 곡률을 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     *
+     */
+    setAllTension(tension: number): this;
+    /**
+     *
+     * @param {number} datasetIndex
+     * @param {number} borderWidth
+     * @description 데이터셋의 Border Width를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setBorderWidth(datasetIndex: number, borderWidth: number): this;
+    setAllBorderWidth(borderWidth: number): this;
+    /**
+     *
+     * @param {number} datasetIndex
+     * @param {number} radius
+     * @description 라인 차트의 Point Radius를 설정합니다.
+     */
+    setPointRadius(datasetIndex: number, radius: number): this;
+    /**
+     *
+     * @param {number} radius
+     * @description 모든 라인 차트의 Point Radius를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setAllPointRadius(radius: number): this;
+    /**
+     *
+     * @param {number} datasetIndex
+     * @param {number} hoverRadius
+     * @description 데이터셋의 Point Hover Radius를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     */
+    setPointHoverRadius(datasetIndex: number, hoverRadius: number): this;
+    /**
+     *
+     * @param {number} hoverRadius
+     * @description 모든 데이터셋의 Point Hover Radius를 설정합니다.
+     * @Since 1.0.0
+     * @category dataset
+     *
+     */
+    setAllPointHoverRadius(hoverRadius: number): this;
+}
+
+declare const noDataPlugin: {
+    id: string;
+    beforeUpdate: (chart: any) => void;
+    afterDraw: (chart: any) => void;
+    beforeDestroy(chart: any): void;
+};
+declare const zoomResetPlugin: {
+    id: string;
+    afterDraw(chart: any, args: any, options: any): void;
+    afterEvent(chart: any, args: any): void;
+};
+declare const doughnutCenterTextPlugin: {
+    id: string;
+    afterDraw(chart: any): void;
+};
+declare const loadingPlugin: {
+    id: string;
+    beforeInit(chart: any, args: any, options: any): void;
+    beforeDraw(chart: any): void;
+    startLoadingAnimation(chart: any): void;
+};
+declare const customLegend: {
+    id: string;
+    _Default: {
+        containerID: string;
+        className: {
+            list: string;
+            item: string;
+            box: string;
+            text: string;
+        };
+        styles: {
+            text: {
+                textDecoration: string;
+                color: string;
+            };
+            textHidden: {
+                textDecoration: string;
+                color: string;
+            };
+            box: (item: any, type: any) => {
+                width: string;
+                height: string;
+                borderRadius: string;
+                borderWidth: string;
+                backgroundColor: any;
+                borderColor: any;
+            };
+        };
+        getItemText: (item: any) => any;
+        getDatasetType: (chart: Chart, item: Record<string, any>) => ChartType | undefined;
+    };
+    _fnc: (chart: Chart, id: string, options: {
+        className: {
+            list: string;
+        };
+    }) => HTMLDivElement | undefined;
+    afterUpdate(chart: any, args: any, options: any): void;
+};
+declare const chartMountPlugin: {
+    id: string;
+    afterDraw(chart: any, args: any, options: any): void;
+};
+declare const blinkPlugin: Plugin$1;
+declare const makeCenterHtml: (percent: number, ok?: number, warn?: number, ng?: number) => string;
+declare const barScaleImgPlugin: {
+    id: string;
+    beforeDatasetsDraw(chart: any, args: any, options: any): void;
+};
+declare const changeSetting: {
+    id: string;
+    _Default: SettingOptions;
+    afterInit(chart: any, args: any, options: any): void;
+    beforeDraw(chart: any): void;
+    afterDestroy(chart: any): void;
+};
+declare const zoomRangeSlider: {
+    id: string;
+    var: {
+        min: number;
+        isDragging: boolean;
+        circlePosition: number | null;
+    };
+    afterDatasetDraw(chart: any, args: any, options: any): void;
+    afterUpdate(chart: any, args: any, options: any): void;
+    afterEvent(chart: any, args: any, options: any): void;
+};
+declare const CreateZoomRangeSlider: (colors?: ZoomRangeSliderColors) => ZoomRangeSliderPlugin;
+
+declare const defaultBarTooltipCallback: (context: TooltipItem<"bar">) => string;
+declare const defaultBarScales: CommonAxesSacels;
+declare const createDefaultBarOptions: (userOptions?: CustomBarChartOptions, defaultScales?: CommonAxesSacels) => CustomBarChartOptions;
+
+declare const defaultLineTooltipCallback: (context: TooltipItem<"line">) => string;
+declare const defaultLineScales: CommonAxesSacels;
+declare const createDefaultLineOptions: (userOptions?: CustomLineChartOptions, defaultScales?: CommonAxesSacels) => CustomLineChartOptions;
+
+declare const LocalDefaults_CreateZoomRangeSlider: typeof CreateZoomRangeSlider;
+declare const LocalDefaults_barScaleImgPlugin: typeof barScaleImgPlugin;
+declare const LocalDefaults_blinkPlugin: typeof blinkPlugin;
+declare const LocalDefaults_changeSetting: typeof changeSetting;
+declare const LocalDefaults_chartMountPlugin: typeof chartMountPlugin;
+declare const LocalDefaults_createDefaultBarOptions: typeof createDefaultBarOptions;
+declare const LocalDefaults_createDefaultLineOptions: typeof createDefaultLineOptions;
+declare const LocalDefaults_customLegend: typeof customLegend;
+declare const LocalDefaults_defaultBarScales: typeof defaultBarScales;
+declare const LocalDefaults_defaultBarTooltipCallback: typeof defaultBarTooltipCallback;
+declare const LocalDefaults_defaultLineScales: typeof defaultLineScales;
+declare const LocalDefaults_defaultLineTooltipCallback: typeof defaultLineTooltipCallback;
+declare const LocalDefaults_doughnutCenterTextPlugin: typeof doughnutCenterTextPlugin;
+declare const LocalDefaults_loadingPlugin: typeof loadingPlugin;
+declare const LocalDefaults_makeCenterHtml: typeof makeCenterHtml;
+declare const LocalDefaults_noDataPlugin: typeof noDataPlugin;
+declare const LocalDefaults_zoomRangeSlider: typeof zoomRangeSlider;
+declare const LocalDefaults_zoomResetPlugin: typeof zoomResetPlugin;
+declare namespace LocalDefaults {
+  export {
+    LocalDefaults_CreateZoomRangeSlider as CreateZoomRangeSlider,
+    LocalDefaults_barScaleImgPlugin as barScaleImgPlugin,
+    LocalDefaults_blinkPlugin as blinkPlugin,
+    LocalDefaults_changeSetting as changeSetting,
+    LocalDefaults_chartMountPlugin as chartMountPlugin,
+    LocalDefaults_createDefaultBarOptions as createDefaultBarOptions,
+    LocalDefaults_createDefaultLineOptions as createDefaultLineOptions,
+    LocalDefaults_customLegend as customLegend,
+    LocalDefaults_defaultBarScales as defaultBarScales,
+    LocalDefaults_defaultBarTooltipCallback as defaultBarTooltipCallback,
+    LocalDefaults_defaultLineScales as defaultLineScales,
+    LocalDefaults_defaultLineTooltipCallback as defaultLineTooltipCallback,
+    LocalDefaults_doughnutCenterTextPlugin as doughnutCenterTextPlugin,
+    LocalDefaults_loadingPlugin as loadingPlugin,
+    LocalDefaults_makeCenterHtml as makeCenterHtml,
+    LocalDefaults_noDataPlugin as noDataPlugin,
+    LocalDefaults_zoomRangeSlider as zoomRangeSlider,
+    LocalDefaults_zoomResetPlugin as zoomResetPlugin,
+  };
+}
+
+declare class ChartFactory {
+    private static registry;
+    static register<TType extends ChartType, TInstance>(type: TType, wrapperClass: Constructor<TType, TInstance>): void;
+    static create<TType extends ChartType>(type: TType, ...args: ConstructorParameters<Constructor<TType, any>>): any;
+    static has(type: ChartType): boolean;
+    static clear(): void;
+}
+
+declare class ChartInstance {
+    private static map;
+    static register(id: string, instance: Chart): void;
+    static get(id: string): Chart | undefined;
+    static getChart(id: string): Chart;
+    static unregister(id: string): boolean;
+    static has(id: string): boolean;
+    static clear(): void;
+    static update(id: string, instance: Chart, mode?: Mode): void;
+    static resize(id: string): void;
+}
+
+declare const ChartToolBox: {
+    setErrorLog(enabled: boolean): void;
+    setDebugLog(enabled: boolean): void;
+};
+declare const T$: {
+    readonly create: typeof ChartWrapper.create;
+    readonly register: typeof ChartWrapper.register;
+    readonly ChartWrapper: typeof ChartWrapper;
+    readonly CartesianChartWrapper: typeof CartesianChartWrapper;
+    readonly BarChartWrapper: typeof BarChartWrapper;
+    readonly LineChartWrapper: typeof LineChartWrapper;
+    readonly defaultTypes: typeof Types;
+    readonly defaultsOptions: typeof LocalDefaults;
+    readonly toolBox: {
+        setErrorLog(enabled: boolean): void;
+        setDebugLog(enabled: boolean): void;
+    };
+};
+
+export { BarChartWrapper, CartesianChartWrapper, ChartFactory, ChartInstance, ChartToolBox, ChartWrapper, CreateZoomRangeSlider, LineChartWrapper, T$, barScaleImgPlugin, blinkPlugin, changeSetting, chartMountPlugin, createDefaultBarOptions, createDefaultLineOptions, customLegend, T$ as default, defaultBarScales, defaultBarTooltipCallback, defaultLineScales, defaultLineTooltipCallback, doughnutCenterTextPlugin, loadingPlugin, makeCenterHtml, noDataPlugin, zoomRangeSlider, zoomResetPlugin };
+export type { BarChartBuilder, CartesianChartBuilder, CartesianChartType, CartesianDataset, ChartBuilder$1 as ChartBuilder, Color, CommonAxes, CommonAxesSacels, CommonCartesian, CommonCartesianAxes, CommonCartesianTicks, CommonCartesianTitleConfig, CommonTicks, Constructor, CustomBarChartOptions, CustomCartesianDataset, CustomChartOptions, CustomLineChartOptions, CustomOptionPlugins, CustomPieChartOptions, DeepPartial, DeepPartialCartesianAxes, DeepPartialPluginOptions, HtmlLegendOptions, LineChartBuilder, Mode, Position, SettingOptions };