stz-chart-maker 2.2.0 → 2.3.1

package/README.md

@@ -29,19 +29,28 @@
 
 ## Quick Start
 
-```JSX
+```tsx
+import { useMemo, useState } from 'react';
 import { ChartWrapper } from 'stz-chart-maker';
 import { Chart } from 'react-chartjs-2';
 
-const chart = ChartWrapper
-  .create('bar', ['A', 'B', 'C'], [{ data: [10, 20, 30] }])
-  .addZoom(true)
-  .addDataLabels(true)
-  .build('basic-bar');
+const labels = ['A', 'B', 'C'];
+const datasets = [{ label: 'Sales', data: [10, 20, 30] }];
+
+const [chart] = useState(() =>
+  ChartWrapper.create('line', labels, datasets)
+    .addZoom(true)
+    .addDataLabels(true)
+);
 
-<Chart {...chart} />;
+const config = useMemo(() => chart.build('sales'), [chart]);
+
+return <Chart {...config} />;
 ```
 
+`build()`는 호출할 때마다 새 설정 객체를 만들고, `id`를 생략하면 내부적으로 랜덤 `_chartId`를 생성합니다.  
+그래서 React에서는 `return <Chart {...chart.build()} />;`보다 `useMemo(() => chart.build('sales'), [chart])`처럼 안정적인 `id`와 함께 메모이즈해서 쓰는 편이 안전합니다.
+
 ## Configuration (Browser)
 
 `stz-chart-maker`는 런타임에 설정 파일을 직접 읽지 않습니다.  

package/dist/index.d.ts

@@ -451,6 +451,8 @@ type Constructor<TType extends ChartType, TInstance> = new (type: TType, labels:
 interface ChartBuilder<TType extends string> {
     setPlugin(plugins: any): this;
     removePlugin(pluginId: string): this;
+    clone(): this;
+    copy(): this;
     build(id?: string): ChartConfig;
     makeConfig(id?: string): ChartConfig;
     hasPlugin(pluginId: string): boolean;
@@ -682,6 +684,11 @@ declare abstract class Chart<TType extends ChartType, TOptions extends CustomCha
     static create<TType extends ChartType>(type: TType, labels: (string | number)[], datasets: CustomChartDatasets<TType>[], options?: CustomChartOptions<TType>, plugins?: Plugin$1): TType extends keyof ChartBuilderMap ? ChartBuilderMap[TType] : ChartBuilder<TType>;
     static register<TType extends ChartType, TInstance>(type: TType, wrapperClass: Constructor<TType, TInstance>): void;
     static has(type: ChartType): boolean;
+    protected cloneValue<T>(value: T): T;
+    protected clonePlugins<TPlugins>(plugins: TPlugins): TPlugins;
+    clone(): this;
+    copy(): this;
+    protected mergePlugins<TPlugin>(plugins: TPlugin[] | undefined, required: TPlugin[]): TPlugin[];
     protected abstract normalize(): void;
     protected abstract configAop(config: any): any;
     abstract build(id?: string): ChartConfig;