@plasmicpkgs/react-chartjs-2 1.0.1 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/common.d.ts +22 -1
- package/dist/react-chartjs-2.cjs.development.js +67 -15
- package/dist/react-chartjs-2.cjs.development.js.map +1 -1
- package/dist/react-chartjs-2.cjs.production.min.js +1 -1
- package/dist/react-chartjs-2.cjs.production.min.js.map +1 -1
- package/dist/react-chartjs-2.esm.js +67 -15
- package/dist/react-chartjs-2.esm.js.map +1 -1
- package/dist/simple-bar/SimpleBar.d.ts +5 -3
- package/package.json +6 -4
package/dist/common.d.ts
CHANGED
|
@@ -1,3 +1,11 @@
|
|
|
1
|
+
import { Plugin } from "chart.js/dist/types";
|
|
2
|
+
export declare const baseOptions: {
|
|
3
|
+
responsive: boolean;
|
|
4
|
+
chartArea: {};
|
|
5
|
+
};
|
|
6
|
+
/**
|
|
7
|
+
* These are hand-picked from the Tailwind palette.
|
|
8
|
+
*/
|
|
1
9
|
export declare const defaultColors: string[];
|
|
2
10
|
export declare function useIsClient(): boolean;
|
|
3
11
|
export interface BaseChartProps {
|
|
@@ -18,7 +26,16 @@ export interface PrepDataOpts {
|
|
|
18
26
|
extras?: (field: string) => {};
|
|
19
27
|
opacity?: number;
|
|
20
28
|
}
|
|
21
|
-
|
|
29
|
+
/**
|
|
30
|
+
* Returns a color from the default color palette.
|
|
31
|
+
*
|
|
32
|
+
* Tries to pick "different" colors that are somewhat spread out on the palette. With a higher 'total' colors requested, the colors will be packed more closely together.
|
|
33
|
+
*
|
|
34
|
+
* We prefer starting from blue when possible. This only starts getting pushed down toward yellow if too many colors requested.
|
|
35
|
+
*
|
|
36
|
+
* If too many colors are requested, it will recycle.
|
|
37
|
+
*/
|
|
38
|
+
export declare function getDefaultColor(index: number, total: number, opacity?: number): string;
|
|
22
39
|
export declare function prepData({ data, labelField, chosenFields, scatterSeries }: BaseChartProps, { isScatter, preferNonNumericAsLabel, extras, opacity }?: PrepDataOpts): {
|
|
23
40
|
datasets: {
|
|
24
41
|
label: string;
|
|
@@ -35,10 +52,13 @@ export declare function prepData({ data, labelField, chosenFields, scatterSeries
|
|
|
35
52
|
label: string;
|
|
36
53
|
data: any[];
|
|
37
54
|
backgroundColor: string;
|
|
55
|
+
borderWidth: number;
|
|
56
|
+
borderColor: string;
|
|
38
57
|
}[];
|
|
39
58
|
};
|
|
40
59
|
export declare function prepOptions({ interactive, title }: BaseChartProps): ({
|
|
41
60
|
responsive: boolean;
|
|
61
|
+
chartArea: {};
|
|
42
62
|
} | {
|
|
43
63
|
interaction: {
|
|
44
64
|
mode: "index";
|
|
@@ -55,3 +75,4 @@ export declare function prepOptions({ interactive, title }: BaseChartProps): ({
|
|
|
55
75
|
};
|
|
56
76
|
interaction?: undefined;
|
|
57
77
|
})[];
|
|
78
|
+
export declare const ChartAreaPlugin: Plugin;
|
|
@@ -35,7 +35,16 @@ function _extends() {
|
|
|
35
35
|
return _extends.apply(this, arguments);
|
|
36
36
|
}
|
|
37
37
|
|
|
38
|
-
var
|
|
38
|
+
var baseOptions = {
|
|
39
|
+
responsive: true,
|
|
40
|
+
chartArea: {
|
|
41
|
+
// backgroundColor: "#f8fafc",
|
|
42
|
+
}
|
|
43
|
+
};
|
|
44
|
+
/**
|
|
45
|
+
* These are hand-picked from the Tailwind palette.
|
|
46
|
+
*/
|
|
47
|
+
var defaultColors = ["hsla(25,95%,53%,1.0)", "hsla(38,92%,50%,1.0)", "hsla(45,93%,47%,1.0)", "hsla(84,81%,44%,1.0)", "hsla(142,71%,45%,1.0)", "hsla(160,84%,39%,1.0)", "hsla(173,80%,40%,1.0)", "hsla(199,89%,48%,1.0)", "hsla(217,91%,60%,1.0)", "hsla(239,84%,67%,1.0)", "hsla(258,90%,66%,1.0)", "hsla(271,91%,65%,1.0)", "hsla(292,84%,61%,1.0)", "hsla(293,69%,49%,1.0)", "hsla(295,72%,40%,1.0)", "hsla(295,70%,33%,1.0)"];
|
|
39
48
|
function useIsClient() {
|
|
40
49
|
var _useState = React.useState(false),
|
|
41
50
|
loaded = _useState[0],
|
|
@@ -45,11 +54,30 @@ function useIsClient() {
|
|
|
45
54
|
});
|
|
46
55
|
return loaded;
|
|
47
56
|
}
|
|
48
|
-
function
|
|
49
|
-
|
|
50
|
-
|
|
57
|
+
function range(total) {
|
|
58
|
+
return Array.from(Array(total).keys());
|
|
59
|
+
}
|
|
60
|
+
/**
|
|
61
|
+
* Returns a color from the default color palette.
|
|
62
|
+
*
|
|
63
|
+
* Tries to pick "different" colors that are somewhat spread out on the palette. With a higher 'total' colors requested, the colors will be packed more closely together.
|
|
64
|
+
*
|
|
65
|
+
* We prefer starting from blue when possible. This only starts getting pushed down toward yellow if too many colors requested.
|
|
66
|
+
*
|
|
67
|
+
* If too many colors are requested, it will recycle.
|
|
68
|
+
*/
|
|
69
|
+
function getDefaultColor(index, total, opacity) {
|
|
70
|
+
var preferredStart = 7;
|
|
71
|
+
var end = defaultColors.length - 1;
|
|
72
|
+
var start = Math.max(0, Math.min(preferredStart, end - total));
|
|
73
|
+
var stops = total > defaultColors.length ? range(defaultColors.length) : range(total).map(function (_, i) {
|
|
74
|
+
return Math.round(start + 1.0 * i / (total - 1) * (end - start));
|
|
75
|
+
});
|
|
76
|
+
var selected = defaultColors[stops[index % stops.length]];
|
|
77
|
+
if (opacity === undefined) {
|
|
78
|
+
return selected;
|
|
51
79
|
}
|
|
52
|
-
return
|
|
80
|
+
return selected.replace("1.0", "" + opacity);
|
|
53
81
|
}
|
|
54
82
|
function prepData(_ref, _temp) {
|
|
55
83
|
var _data$;
|
|
@@ -84,6 +112,7 @@ function prepData(_ref, _temp) {
|
|
|
84
112
|
}] : undefined;
|
|
85
113
|
return {
|
|
86
114
|
datasets: ((_scatterSeries2 = scatterSeries) != null ? _scatterSeries2 : []).map(function (series, index) {
|
|
115
|
+
var _scatterSeries3;
|
|
87
116
|
return _extends({}, extras == null ? void 0 : extras(series.name), {
|
|
88
117
|
label: series.name,
|
|
89
118
|
data: data.map(function (item) {
|
|
@@ -93,7 +122,7 @@ function prepData(_ref, _temp) {
|
|
|
93
122
|
y: (_item$series$fields$2 = item[series.fields[1]]) != null ? _item$series$fields$2 : 0
|
|
94
123
|
};
|
|
95
124
|
}),
|
|
96
|
-
backgroundColor: getDefaultColor(index, opacity)
|
|
125
|
+
backgroundColor: getDefaultColor(index, ((_scatterSeries3 = scatterSeries) != null ? _scatterSeries3 : []).length, opacity)
|
|
97
126
|
});
|
|
98
127
|
})
|
|
99
128
|
};
|
|
@@ -112,7 +141,9 @@ function prepData(_ref, _temp) {
|
|
|
112
141
|
var _item$key2;
|
|
113
142
|
return (_item$key2 = item[key]) != null ? _item$key2 : 0;
|
|
114
143
|
}),
|
|
115
|
-
backgroundColor: getDefaultColor(index,
|
|
144
|
+
backgroundColor: getDefaultColor(index, (chosenFields != null ? chosenFields : autoChosenFields).length, 1),
|
|
145
|
+
borderWidth: 2,
|
|
146
|
+
borderColor: getDefaultColor(index, (chosenFields != null ? chosenFields : autoChosenFields).length, 1)
|
|
116
147
|
});
|
|
117
148
|
})
|
|
118
149
|
};
|
|
@@ -143,14 +174,34 @@ function prepOptions(_ref3) {
|
|
|
143
174
|
}
|
|
144
175
|
} : {}];
|
|
145
176
|
}
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
177
|
+
var ChartAreaPlugin = {
|
|
178
|
+
id: "chartAreaPlugin",
|
|
179
|
+
// eslint-disable-next-line object-shorthand
|
|
180
|
+
beforeDraw: function beforeDraw(chart) {
|
|
181
|
+
var chartAreaOptions = chart.config.options.chartArea;
|
|
182
|
+
if (chartAreaOptions && chartAreaOptions.backgroundColor) {
|
|
183
|
+
var ctx = chart.canvas.getContext("2d");
|
|
184
|
+
var chartArea = chart.chartArea;
|
|
185
|
+
if (ctx) {
|
|
186
|
+
ctx.save();
|
|
187
|
+
ctx.fillStyle = chartAreaOptions.backgroundColor;
|
|
188
|
+
// eslint-disable-next-line max-len
|
|
189
|
+
ctx.fillRect(chartArea.left, chartArea.top, chartArea.right - chartArea.left, chartArea.bottom - chartArea.top);
|
|
190
|
+
ctx.restore();
|
|
191
|
+
}
|
|
192
|
+
}
|
|
193
|
+
}
|
|
149
194
|
};
|
|
195
|
+
|
|
150
196
|
var stackedOptions = {
|
|
151
197
|
scales: {
|
|
152
198
|
x: {
|
|
153
|
-
stacked: true
|
|
199
|
+
stacked: true,
|
|
200
|
+
ticks: {
|
|
201
|
+
major: {
|
|
202
|
+
enabled: false
|
|
203
|
+
}
|
|
204
|
+
}
|
|
154
205
|
},
|
|
155
206
|
y: {
|
|
156
207
|
stacked: true
|
|
@@ -179,14 +230,14 @@ function SimpleBar(props) {
|
|
|
179
230
|
className = props.className;
|
|
180
231
|
var isClient = useIsClient();
|
|
181
232
|
React.useEffect(function () {
|
|
182
|
-
chart_js.Chart.register(chart_js.CategoryScale, chart_js.LinearScale, chart_js.BarElement, chart_js.Title, chart_js.Tooltip, chart_js.Legend);
|
|
233
|
+
chart_js.Chart.register(ChartAreaPlugin, chart_js.CategoryScale, chart_js.LinearScale, chart_js.BarElement, chart_js.Title, chart_js.Tooltip, chart_js.Legend);
|
|
183
234
|
}, []);
|
|
184
235
|
if (!isClient) {
|
|
185
236
|
return null;
|
|
186
237
|
}
|
|
187
238
|
var normalized = prepData(props, {
|
|
188
239
|
preferNonNumericAsLabel: true,
|
|
189
|
-
opacity:
|
|
240
|
+
opacity: 1
|
|
190
241
|
});
|
|
191
242
|
var options = prepOptions(props);
|
|
192
243
|
return React__default.createElement("div", {
|
|
@@ -203,7 +254,7 @@ function SimpleLine(props) {
|
|
|
203
254
|
className = props.className;
|
|
204
255
|
var isClient = useIsClient();
|
|
205
256
|
React.useEffect(function () {
|
|
206
|
-
chart_js.Chart.register(chart_js.CategoryScale, chart_js.LinearScale, chart_js.PointElement, chart_js.LineElement, chart_js.Title, chart_js.Tooltip, chart_js.Filler, chart_js.Legend);
|
|
257
|
+
chart_js.Chart.register(ChartAreaPlugin, chart_js.CategoryScale, chart_js.LinearScale, chart_js.PointElement, chart_js.LineElement, chart_js.Title, chart_js.Tooltip, chart_js.Filler, chart_js.Legend);
|
|
207
258
|
}, []);
|
|
208
259
|
if (!isClient) {
|
|
209
260
|
return null;
|
|
@@ -212,6 +263,7 @@ function SimpleLine(props) {
|
|
|
212
263
|
extras: function extras(field) {
|
|
213
264
|
return {
|
|
214
265
|
fill: fill,
|
|
266
|
+
pointRadius: 0,
|
|
215
267
|
yAxisID: field === secondAxisField ? "y1" : "y"
|
|
216
268
|
};
|
|
217
269
|
}
|
|
@@ -245,7 +297,7 @@ function SimpleScatter(props) {
|
|
|
245
297
|
var className = props.className;
|
|
246
298
|
var isClient = useIsClient();
|
|
247
299
|
React.useEffect(function () {
|
|
248
|
-
chart_js.Chart.register(chart_js.LinearScale, chart_js.PointElement, chart_js.LineElement, chart_js.Tooltip, chart_js.Legend);
|
|
300
|
+
chart_js.Chart.register(ChartAreaPlugin, chart_js.LinearScale, chart_js.PointElement, chart_js.LineElement, chart_js.Tooltip, chart_js.Legend);
|
|
249
301
|
}, []);
|
|
250
302
|
if (!isClient) {
|
|
251
303
|
return null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-chartjs-2.cjs.development.js","sources":["../src/utils.ts","../src/common.ts","../src/simple-bar/SimpleBar.tsx","../src/simple-line/SimpleLine.tsx","../src/simple-scatter/SimpleScatter.tsx","../src/simple-chart/SimpleChart.tsx","../src/simple-chart/index.tsx","../src/index.tsx"],"sourcesContent":["import {\n ComponentMeta,\n default as registerComponent,\n} from \"@plasmicapp/host/registerComponent\";\nimport {\n default as registerGlobalContext,\n GlobalContextMeta,\n} from \"@plasmicapp/host/registerGlobalContext\";\nimport { default as registerToken } from \"@plasmicapp/host/registerToken\";\nimport React from \"react\";\n\nexport type Registerable = {\n registerComponent: typeof registerComponent;\n registerGlobalContext: typeof registerGlobalContext;\n registerToken: typeof registerToken;\n};\n\nexport function makeRegisterComponent<T extends React.ComponentType<any>>(\n component: T,\n meta: ComponentMeta<React.ComponentProps<T>>\n) {\n return function (loader?: Registerable) {\n registerComponentHelper(loader, component, meta);\n };\n}\n\nexport function makeRegisterGlobalContext<T extends React.ComponentType<any>>(\n component: T,\n meta: GlobalContextMeta<React.ComponentProps<T>>\n) {\n return function (loader?: Registerable) {\n if (loader) {\n loader.registerGlobalContext(component, meta);\n } else {\n registerGlobalContext(component, meta);\n }\n };\n}\n\nexport function registerComponentHelper<T extends React.ComponentType<any>>(\n loader: Registerable | undefined,\n component: T,\n meta: ComponentMeta<React.ComponentProps<T>>\n) {\n if (loader) {\n loader.registerComponent(component, meta);\n } else {\n registerComponent(component, meta);\n }\n}\n\ntype ReactElt = {\n children: ReactElt | ReactElt[];\n props: {\n children: ReactElt | ReactElt[];\n [prop: string]: any;\n } | null;\n type: React.ComponentType<any> | null;\n key: string | null;\n} | null;\n\nexport function traverseReactEltTree(\n children: React.ReactNode,\n callback: (elt: ReactElt) => void\n) {\n const rec = (elts: ReactElt | ReactElt[] | null) => {\n (Array.isArray(elts) ? elts : [elts]).forEach((elt) => {\n if (elt) {\n callback(elt);\n if (elt.children) {\n rec(elt.children);\n }\n if (elt.props?.children && elt.props.children !== elt.children) {\n rec(elt.props.children);\n }\n }\n });\n };\n rec(children as any);\n}\n\nexport function asArray<T>(x: T[] | T | undefined | null) {\n if (Array.isArray(x)) {\n return x;\n } else if (x == null) {\n return [];\n } else {\n return [x];\n }\n}\n","import { useEffect, useState } from \"react\";\nimport { baseOptions } from \"./simple-bar/SimpleBar\";\n\nexport const defaultColors = [\n \"rgba(255, 99, 132, 0.2)\",\n \"rgba(54, 162, 235, 0.2)\",\n \"rgba(255, 206, 86, 0.2)\",\n \"rgba(75, 192, 192, 0.2)\",\n \"rgba(153, 102, 255, 0.2)\",\n \"rgba(255, 159, 64, 0.2)\",\n];\n\nexport function useIsClient() {\n const [loaded, setLoaded] = useState(false);\n useEffect(() => {\n setLoaded(true);\n });\n return loaded;\n}\n\nexport interface BaseChartProps {\n className?: string;\n data?: Record<string, any>[];\n labelField?: string;\n interactive?: boolean;\n title?: string;\n chosenFields?: string[];\n scatterSeries?: { name: string; fields: [string, string] }[];\n}\n\nexport interface PrepDataOpts {\n isScatter?: boolean;\n preferNonNumericAsLabel?: boolean;\n extras?: (field: string) => {};\n opacity?: number;\n}\n\nexport function getDefaultColor(index: number, opacity = 0.2) {\n return defaultColors[index % defaultColors.length].replace(\n \"0.2\",\n \"\" + opacity\n );\n}\n\nexport function prepData(\n { data = [], labelField, chosenFields, scatterSeries }: BaseChartProps,\n { isScatter, preferNonNumericAsLabel, extras, opacity }: PrepDataOpts = {}\n) {\n const fields = Object.keys(data[0] ?? {});\n const isFieldAllNumericOrNil = new Map(\n fields.map((key) => [key, data.every((item) => !isNaN(item[key] ?? 0))])\n );\n const realLabelField =\n labelField ??\n (preferNonNumericAsLabel\n ? fields.find((field) => !isFieldAllNumericOrNil.get(field))\n : fields[0]);\n const numericFields = fields.filter((field) =>\n isFieldAllNumericOrNil.get(field)\n );\n if (isScatter) {\n scatterSeries = isScatter\n ? scatterSeries ?? [\n {\n name: `${numericFields[0]}-${numericFields[1]}`,\n fields: [numericFields[0], numericFields[1]] as [string, string],\n },\n ]\n : undefined;\n return {\n datasets: (scatterSeries ?? []).map((series, index) => ({\n ...extras?.(series.name),\n label: series.name,\n data: data.map((item) => ({\n x: item[series.fields[0]] ?? 0,\n y: item[series.fields[1]] ?? 0,\n })),\n backgroundColor: getDefaultColor(index, opacity),\n })),\n };\n } else {\n const autoChosenFields = numericFields.filter(\n (field) => field !== realLabelField\n );\n return {\n labels: realLabelField\n ? data.map((item) => item[realLabelField])\n : undefined,\n datasets: (chosenFields ?? autoChosenFields).map((key, index) => {\n return {\n ...extras?.(key),\n label: key,\n data: data.map((item) => item[key] ?? 0),\n backgroundColor: getDefaultColor(index, opacity),\n };\n }),\n };\n }\n}\n\n// additional styling\n\n/*\n elements: {\n bar: {\n borderWidth: 2,\n },\n },\n\n */\n\nexport function prepOptions({ interactive = true, title }: BaseChartProps) {\n return [\n baseOptions,\n interactive\n ? {\n interaction: {\n mode: \"index\" as const,\n intersect: false,\n },\n }\n : {},\n title ? { title: { display: true, text: title } } : {},\n ];\n}\n","import {\n BarElement,\n CategoryScale,\n Chart as ChartJS,\n Legend,\n LinearScale,\n Title,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Bar } from \"react-chartjs-2\";\nimport { BaseChartProps, prepData, prepOptions, useIsClient } from \"../common\";\n\nexport const baseOptions = {\n responsive: true,\n};\n\nexport const stackedOptions = {\n scales: {\n x: {\n stacked: true,\n },\n y: {\n stacked: true,\n },\n },\n};\n\nexport const vertOptions = {\n plugins: {\n legend: {\n position: \"top\" as const,\n },\n },\n};\nexport const horizOptions = {\n indexAxis: \"y\" as const,\n plugins: {\n legend: {\n position: \"right\" as const,\n },\n },\n};\n\nexport interface SimpleBarProps extends BaseChartProps {\n direction?: \"vertical\" | \"horizontal\";\n stacked?: boolean;\n}\n\nexport function SimpleBar(props: SimpleBarProps) {\n const { direction = \"vertical\", stacked, className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n CategoryScale,\n LinearScale,\n BarElement,\n Title,\n Tooltip,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, {\n preferNonNumericAsLabel: true,\n opacity: 0.5,\n });\n const options = prepOptions(props);\n return (\n <div className={className}>\n <Bar\n options={deepmerge.all([\n ...options,\n direction === \"vertical\" ? vertOptions : horizOptions,\n stacked ? stackedOptions : {},\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import {\n CategoryScale,\n Chart as ChartJS,\n Filler,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n Title,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Line } from \"react-chartjs-2\";\nimport { BaseChartProps, prepData, prepOptions, useIsClient } from \"../common\";\n\nexport interface SimpleLineProps extends BaseChartProps {\n fill?: boolean;\n secondAxisField?: string;\n}\n\nexport function SimpleLine(props: SimpleLineProps) {\n const { secondAxisField, fill, className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n CategoryScale,\n LinearScale,\n PointElement,\n LineElement,\n Title,\n Tooltip,\n Filler,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, {\n extras: (field) => ({\n fill,\n yAxisID: field === secondAxisField ? \"y1\" : \"y\",\n }),\n });\n const options = prepOptions(props);\n return (\n <div className={className}>\n <Line\n options={deepmerge.all([\n ...options,\n secondAxisField\n ? {\n scales: {\n y: {\n type: \"linear\" as const,\n display: true,\n position: \"left\" as const,\n },\n y1: {\n type: \"linear\" as const,\n display: true,\n position: \"right\" as const,\n grid: {\n drawOnChartArea: false,\n },\n },\n },\n }\n : {},\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import {\n Chart as ChartJS,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Scatter } from \"react-chartjs-2\";\nimport { BaseChartProps, prepData, prepOptions, useIsClient } from \"../common\";\n\nexport interface SimpleScatterProps extends BaseChartProps {}\n\nexport function SimpleScatter(props: SimpleScatterProps) {\n const { className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(LinearScale, PointElement, LineElement, Tooltip, Legend);\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, { isScatter: true, opacity: 1 });\n const options = prepOptions(props);\n console.log(\"!!\", normalized, options);\n return (\n <div className={className}>\n <Scatter\n options={deepmerge.all([\n ...options,\n {\n scales: {\n y: {\n beginAtZero: true,\n },\n },\n },\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import React, { ReactElement } from \"react\";\nimport { SimpleBar, SimpleBarProps } from \"../simple-bar/SimpleBar\";\nimport { SimpleLine, SimpleLineProps } from \"../simple-line/SimpleLine\";\nimport {\n SimpleScatter,\n SimpleScatterProps,\n} from \"../simple-scatter/SimpleScatter\";\n\nexport type SimpleChartProps = {\n type?: \"bar\" | \"line\" | \"scatter\";\n} & (SimpleBarProps | SimpleLineProps | SimpleScatterProps);\n\nexport function SimpleChart(props: SimpleChartProps): ReactElement {\n switch (props.type ?? \"bar\") {\n case \"bar\":\n return <SimpleBar {...(props as any)} />;\n case \"line\":\n return <SimpleLine {...(props as any)} />;\n case \"scatter\":\n return <SimpleScatter {...(props as any)} />;\n }\n}\n","import { ComponentMeta } from \"@plasmicapp/host/registerComponent\";\nimport { Registerable, registerComponentHelper } from \"../utils\";\nimport { SimpleChart, SimpleChartProps } from \"./SimpleChart\";\n\nexport * from \"./SimpleChart\";\nexport default SimpleChart;\n\nconst simpleChartMeta: ComponentMeta<SimpleChartProps> = {\n name: \"hostless-react-chartjs-2-simple-chart\",\n displayName: \"Chart\",\n props: {\n type: {\n type: \"choice\",\n options: [\n {\n value: \"bar\",\n label: \"Bar\",\n },\n {\n value: \"line\",\n label: \"Line\",\n },\n {\n value: \"scatter\",\n label: \"Scatter\",\n },\n ],\n defaultValueHint: \"bar\",\n },\n data: {\n type: \"exprEditor\" as any,\n description: \"The data as an array of objects\",\n defaultExpr: JSON.stringify([\n {\n region: \"APAC\",\n revenue: 3294,\n spend: 2675,\n },\n {\n region: \"EMEA\",\n revenue: 3245,\n spend: 3895,\n },\n {\n region: \"LATAM\",\n revenue: 2165,\n spend: 3498,\n },\n {\n region: \"AMER\",\n revenue: 3215,\n spend: 1656,\n },\n ]),\n },\n labelField: {\n type: \"choice\",\n hidden: (props) => props.type === \"scatter\",\n options: (props) => (props.data?.[0] ? Object.keys(props.data[0]) : []),\n },\n title: \"string\",\n fill: {\n type: \"boolean\",\n hidden: (props) => props.type !== \"line\",\n },\n // TODO\n // datasets: {\n // type: \"array\",\n // unstable__keyFunc: (x) => x.key,\n // unstable__minimalValue: (_props, ctx) => null,\n // itemType: {\n // type: \"object\",\n // fields: {\n // label: \"string\",\n // fieldId: \"string\",\n // hidden: {\n // type: \"boolean\",\n // },\n // },\n // },\n // },\n },\n\n defaultStyles: {\n width: \"stretch\",\n },\n\n importName: \"SimpleChart\",\n importPath: \"@plasmicpkgs/react-chartjs-2/dist/simple-chart/SimpleChart\",\n};\n\nexport function registerSimpleChart(loader?: Registerable) {\n registerComponentHelper(loader, SimpleChart, simpleChartMeta);\n}\n","import { registerSimpleChart } from \"./simple-chart\";\nimport { Registerable } from \"./utils\";\n\nexport function registerAll(loader?: Registerable) {\n registerSimpleChart(loader);\n}\n"],"names":["registerComponentHelper","loader","component","meta","registerComponent","defaultColors","useIsClient","useState","loaded","setLoaded","useEffect","getDefaultColor","index","opacity","length","replace","prepData","data","labelField","chosenFields","scatterSeries","isScatter","preferNonNumericAsLabel","extras","fields","Object","keys","isFieldAllNumericOrNil","Map","map","key","every","item","isNaN","realLabelField","find","field","get","numericFields","filter","name","undefined","datasets","series","label","x","y","backgroundColor","autoChosenFields","labels","prepOptions","interactive","title","baseOptions","interaction","mode","intersect","display","text","responsive","stackedOptions","scales","stacked","vertOptions","plugins","legend","position","horizOptions","indexAxis","SimpleBar","props","direction","className","isClient","ChartJS","register","CategoryScale","LinearScale","BarElement","Title","Tooltip","Legend","normalized","options","React","Bar","deepmerge","all","SimpleLine","secondAxisField","fill","PointElement","LineElement","Filler","yAxisID","Line","type","y1","grid","drawOnChartArea","SimpleScatter","console","log","Scatter","beginAtZero","SimpleChart","simpleChartMeta","displayName","value","defaultValueHint","description","defaultExpr","JSON","stringify","region","revenue","spend","hidden","defaultStyles","width","importName","importPath","registerSimpleChart","registerAll"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"react-chartjs-2.cjs.development.js","sources":["../src/utils.ts","../src/common.ts","../src/simple-bar/SimpleBar.tsx","../src/simple-line/SimpleLine.tsx","../src/simple-scatter/SimpleScatter.tsx","../src/simple-chart/SimpleChart.tsx","../src/simple-chart/index.tsx","../src/index.tsx"],"sourcesContent":["import {\n ComponentMeta,\n default as registerComponent,\n} from \"@plasmicapp/host/registerComponent\";\nimport {\n default as registerGlobalContext,\n GlobalContextMeta,\n} from \"@plasmicapp/host/registerGlobalContext\";\nimport { default as registerToken } from \"@plasmicapp/host/registerToken\";\nimport React from \"react\";\n\nexport type Registerable = {\n registerComponent: typeof registerComponent;\n registerGlobalContext: typeof registerGlobalContext;\n registerToken: typeof registerToken;\n};\n\nexport function makeRegisterComponent<T extends React.ComponentType<any>>(\n component: T,\n meta: ComponentMeta<React.ComponentProps<T>>\n) {\n return function (loader?: Registerable) {\n registerComponentHelper(loader, component, meta);\n };\n}\n\nexport function makeRegisterGlobalContext<T extends React.ComponentType<any>>(\n component: T,\n meta: GlobalContextMeta<React.ComponentProps<T>>\n) {\n return function (loader?: Registerable) {\n if (loader) {\n loader.registerGlobalContext(component, meta);\n } else {\n registerGlobalContext(component, meta);\n }\n };\n}\n\nexport function registerComponentHelper<T extends React.ComponentType<any>>(\n loader: Registerable | undefined,\n component: T,\n meta: ComponentMeta<React.ComponentProps<T>>\n) {\n if (loader) {\n loader.registerComponent(component, meta);\n } else {\n registerComponent(component, meta);\n }\n}\n\ntype ReactElt = {\n children: ReactElt | ReactElt[];\n props: {\n children: ReactElt | ReactElt[];\n [prop: string]: any;\n } | null;\n type: React.ComponentType<any> | null;\n key: string | null;\n} | null;\n\nexport function traverseReactEltTree(\n children: React.ReactNode,\n callback: (elt: ReactElt) => void\n) {\n const rec = (elts: ReactElt | ReactElt[] | null) => {\n (Array.isArray(elts) ? elts : [elts]).forEach((elt) => {\n if (elt) {\n callback(elt);\n if (elt.children) {\n rec(elt.children);\n }\n if (elt.props?.children && elt.props.children !== elt.children) {\n rec(elt.props.children);\n }\n }\n });\n };\n rec(children as any);\n}\n\nexport function asArray<T>(x: T[] | T | undefined | null) {\n if (Array.isArray(x)) {\n return x;\n } else if (x == null) {\n return [];\n } else {\n return [x];\n }\n}\n","import { Plugin } from \"chart.js/dist/types\";\nimport { useEffect, useState } from \"react\";\n\nexport const baseOptions = {\n responsive: true,\n chartArea: {\n // backgroundColor: \"#f8fafc\",\n },\n};\n\n/**\n * These are hand-picked from the Tailwind palette.\n */\nexport const defaultColors = [\n \"hsla(25,95%,53%,1.0)\",\n \"hsla(38,92%,50%,1.0)\",\n \"hsla(45,93%,47%,1.0)\",\n \"hsla(84,81%,44%,1.0)\",\n \"hsla(142,71%,45%,1.0)\",\n \"hsla(160,84%,39%,1.0)\",\n \"hsla(173,80%,40%,1.0)\",\n \"hsla(199,89%,48%,1.0)\",\n \"hsla(217,91%,60%,1.0)\",\n \"hsla(239,84%,67%,1.0)\",\n \"hsla(258,90%,66%,1.0)\",\n \"hsla(271,91%,65%,1.0)\",\n \"hsla(292,84%,61%,1.0)\",\n \"hsla(293,69%,49%,1.0)\",\n \"hsla(295,72%,40%,1.0)\",\n \"hsla(295,70%,33%,1.0)\",\n];\n\nexport function useIsClient() {\n const [loaded, setLoaded] = useState(false);\n useEffect(() => {\n setLoaded(true);\n });\n return loaded;\n}\n\nexport interface BaseChartProps {\n className?: string;\n data?: Record<string, any>[];\n labelField?: string;\n interactive?: boolean;\n title?: string;\n chosenFields?: string[];\n scatterSeries?: { name: string; fields: [string, string] }[];\n}\n\nexport interface PrepDataOpts {\n isScatter?: boolean;\n preferNonNumericAsLabel?: boolean;\n extras?: (field: string) => {};\n opacity?: number;\n}\n\nfunction range(total: number) {\n return Array.from(Array(total).keys());\n}\n\n/**\n * Returns a color from the default color palette.\n *\n * Tries to pick \"different\" colors that are somewhat spread out on the palette. With a higher 'total' colors requested, the colors will be packed more closely together.\n *\n * We prefer starting from blue when possible. This only starts getting pushed down toward yellow if too many colors requested.\n *\n * If too many colors are requested, it will recycle.\n */\nexport function getDefaultColor(\n index: number,\n total: number,\n opacity?: number\n) {\n const preferredStart = 7;\n const end = defaultColors.length - 1;\n const start = Math.max(0, Math.min(preferredStart, end - total));\n const stops =\n total > defaultColors.length\n ? range(defaultColors.length)\n : range(total).map((_, i) =>\n Math.round(start + ((1.0 * i) / (total - 1)) * (end - start))\n );\n const selected = defaultColors[stops[index % stops.length]];\n if (opacity === undefined) {\n return selected;\n }\n return selected.replace(\"1.0\", \"\" + opacity);\n}\n\nexport function prepData(\n { data = [], labelField, chosenFields, scatterSeries }: BaseChartProps,\n { isScatter, preferNonNumericAsLabel, extras, opacity }: PrepDataOpts = {}\n) {\n const fields = Object.keys(data[0] ?? {});\n const isFieldAllNumericOrNil = new Map(\n fields.map((key) => [key, data.every((item) => !isNaN(item[key] ?? 0))])\n );\n const realLabelField =\n labelField ??\n (preferNonNumericAsLabel\n ? fields.find((field) => !isFieldAllNumericOrNil.get(field))\n : fields[0]);\n const numericFields = fields.filter((field) =>\n isFieldAllNumericOrNil.get(field)\n );\n if (isScatter) {\n scatterSeries = isScatter\n ? scatterSeries ?? [\n {\n name: `${numericFields[0]}-${numericFields[1]}`,\n fields: [numericFields[0], numericFields[1]] as [string, string],\n },\n ]\n : undefined;\n return {\n datasets: (scatterSeries ?? []).map((series, index) => ({\n ...extras?.(series.name),\n label: series.name,\n data: data.map((item) => ({\n x: item[series.fields[0]] ?? 0,\n y: item[series.fields[1]] ?? 0,\n })),\n backgroundColor: getDefaultColor(\n index,\n (scatterSeries ?? []).length,\n opacity\n ),\n })),\n };\n } else {\n const autoChosenFields = numericFields.filter(\n (field) => field !== realLabelField\n );\n return {\n labels: realLabelField\n ? data.map((item) => item[realLabelField])\n : undefined,\n datasets: (chosenFields ?? autoChosenFields).map((key, index) => {\n return {\n ...extras?.(key),\n label: key,\n data: data.map((item) => item[key] ?? 0),\n backgroundColor: getDefaultColor(\n index,\n (chosenFields ?? autoChosenFields).length,\n 1\n ),\n borderWidth: 2,\n borderColor: getDefaultColor(\n index,\n (chosenFields ?? autoChosenFields).length,\n 1\n ),\n };\n }),\n };\n }\n}\n\n// additional styling\n\n/*\n elements: {\n bar: {\n borderWidth: 2,\n },\n },\n\n */\n\nexport function prepOptions({ interactive = true, title }: BaseChartProps) {\n return [\n baseOptions,\n interactive\n ? {\n interaction: {\n mode: \"index\" as const,\n intersect: false,\n },\n }\n : {},\n title ? { title: { display: true, text: title } } : {},\n ];\n}\n\nexport const ChartAreaPlugin: Plugin = {\n id: \"chartAreaPlugin\",\n // eslint-disable-next-line object-shorthand\n beforeDraw: (chart) => {\n const chartAreaOptions = (chart.config.options as any).chartArea;\n if (chartAreaOptions && chartAreaOptions.backgroundColor) {\n const ctx = chart.canvas.getContext(\"2d\");\n const { chartArea } = chart;\n if (ctx) {\n ctx.save();\n ctx.fillStyle = chartAreaOptions.backgroundColor;\n // eslint-disable-next-line max-len\n ctx.fillRect(\n chartArea.left,\n chartArea.top,\n chartArea.right - chartArea.left,\n chartArea.bottom - chartArea.top\n );\n ctx.restore();\n }\n }\n },\n};\n","import {\n BarElement,\n CategoryScale,\n Chart as ChartJS,\n Legend,\n LinearScale,\n Title,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Bar } from \"react-chartjs-2\";\nimport {\n BaseChartProps,\n ChartAreaPlugin,\n prepData,\n prepOptions,\n useIsClient,\n} from \"../common\";\n\nexport const stackedOptions = {\n scales: {\n x: {\n stacked: true,\n ticks: {\n major: {\n enabled: false,\n },\n },\n },\n y: {\n stacked: true,\n },\n },\n};\n\nexport const vertOptions = {\n plugins: {\n legend: {\n position: \"top\" as const,\n },\n },\n};\nexport const horizOptions = {\n indexAxis: \"y\" as const,\n plugins: {\n legend: {\n position: \"right\" as const,\n },\n },\n};\n\nexport interface SimpleBarProps extends BaseChartProps {\n direction?: \"vertical\" | \"horizontal\";\n stacked?: boolean;\n}\n\nexport function SimpleBar(props: SimpleBarProps) {\n const { direction = \"vertical\", stacked, className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n ChartAreaPlugin,\n CategoryScale,\n LinearScale,\n BarElement,\n Title,\n Tooltip,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, {\n preferNonNumericAsLabel: true,\n opacity: 1,\n });\n const options = prepOptions(props);\n return (\n <div className={className}>\n <Bar\n options={deepmerge.all([\n ...options,\n direction === \"vertical\" ? vertOptions : horizOptions,\n stacked ? stackedOptions : {},\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import {\n CategoryScale,\n Chart as ChartJS,\n Filler,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n Title,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Line } from \"react-chartjs-2\";\nimport {\n BaseChartProps,\n ChartAreaPlugin,\n prepData,\n prepOptions,\n useIsClient,\n} from \"../common\";\n\nexport interface SimpleLineProps extends BaseChartProps {\n fill?: boolean;\n secondAxisField?: string;\n}\n\nexport function SimpleLine(props: SimpleLineProps) {\n const { secondAxisField, fill, className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n ChartAreaPlugin,\n CategoryScale,\n LinearScale,\n PointElement,\n LineElement,\n Title,\n Tooltip,\n Filler,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, {\n extras: (field) => ({\n fill,\n pointRadius: 0,\n yAxisID: field === secondAxisField ? \"y1\" : \"y\",\n }),\n });\n const options = prepOptions(props);\n return (\n <div className={className}>\n <Line\n options={deepmerge.all([\n ...options,\n secondAxisField\n ? {\n scales: {\n y: {\n type: \"linear\" as const,\n display: true,\n position: \"left\" as const,\n },\n y1: {\n type: \"linear\" as const,\n display: true,\n position: \"right\" as const,\n grid: {\n drawOnChartArea: false,\n },\n },\n },\n }\n : {},\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import {\n Chart as ChartJS,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Scatter } from \"react-chartjs-2\";\nimport {\n BaseChartProps,\n ChartAreaPlugin,\n prepData,\n prepOptions,\n useIsClient,\n} from \"../common\";\n\nexport interface SimpleScatterProps extends BaseChartProps {}\n\nexport function SimpleScatter(props: SimpleScatterProps) {\n const { className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n ChartAreaPlugin,\n LinearScale,\n PointElement,\n LineElement,\n Tooltip,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, { isScatter: true, opacity: 1 });\n const options = prepOptions(props);\n console.log(\"!!\", normalized, options);\n return (\n <div className={className}>\n <Scatter\n options={deepmerge.all([\n ...options,\n {\n scales: {\n y: {\n beginAtZero: true,\n },\n },\n },\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import React, { ReactElement } from \"react\";\nimport { SimpleBar, SimpleBarProps } from \"../simple-bar/SimpleBar\";\nimport { SimpleLine, SimpleLineProps } from \"../simple-line/SimpleLine\";\nimport {\n SimpleScatter,\n SimpleScatterProps,\n} from \"../simple-scatter/SimpleScatter\";\n\nexport type SimpleChartProps = {\n type?: \"bar\" | \"line\" | \"scatter\";\n} & (SimpleBarProps | SimpleLineProps | SimpleScatterProps);\n\nexport function SimpleChart(props: SimpleChartProps): ReactElement {\n switch (props.type ?? \"bar\") {\n case \"bar\":\n return <SimpleBar {...(props as any)} />;\n case \"line\":\n return <SimpleLine {...(props as any)} />;\n case \"scatter\":\n return <SimpleScatter {...(props as any)} />;\n }\n}\n","import { ComponentMeta } from \"@plasmicapp/host/registerComponent\";\nimport { Registerable, registerComponentHelper } from \"../utils\";\nimport { SimpleChart, SimpleChartProps } from \"./SimpleChart\";\n\nexport * from \"./SimpleChart\";\nexport default SimpleChart;\n\nconst simpleChartMeta: ComponentMeta<SimpleChartProps> = {\n name: \"hostless-react-chartjs-2-simple-chart\",\n displayName: \"Chart\",\n props: {\n type: {\n type: \"choice\",\n options: [\n {\n value: \"bar\",\n label: \"Bar\",\n },\n {\n value: \"line\",\n label: \"Line\",\n },\n {\n value: \"scatter\",\n label: \"Scatter\",\n },\n ],\n defaultValueHint: \"bar\",\n },\n data: {\n type: \"exprEditor\" as any,\n description: \"The data as an array of objects\",\n defaultExpr: JSON.stringify([\n {\n region: \"APAC\",\n revenue: 3294,\n spend: 2675,\n },\n {\n region: \"EMEA\",\n revenue: 3245,\n spend: 3895,\n },\n {\n region: \"LATAM\",\n revenue: 2165,\n spend: 3498,\n },\n {\n region: \"AMER\",\n revenue: 3215,\n spend: 1656,\n },\n ]),\n },\n labelField: {\n type: \"choice\",\n hidden: (props) => props.type === \"scatter\",\n options: (props) => (props.data?.[0] ? Object.keys(props.data[0]) : []),\n },\n title: \"string\",\n fill: {\n type: \"boolean\",\n hidden: (props) => props.type !== \"line\",\n },\n // TODO\n // datasets: {\n // type: \"array\",\n // unstable__keyFunc: (x) => x.key,\n // unstable__minimalValue: (_props, ctx) => null,\n // itemType: {\n // type: \"object\",\n // fields: {\n // label: \"string\",\n // fieldId: \"string\",\n // hidden: {\n // type: \"boolean\",\n // },\n // },\n // },\n // },\n },\n\n defaultStyles: {\n width: \"stretch\",\n },\n\n importName: \"SimpleChart\",\n importPath: \"@plasmicpkgs/react-chartjs-2/dist/simple-chart/SimpleChart\",\n};\n\nexport function registerSimpleChart(loader?: Registerable) {\n registerComponentHelper(loader, SimpleChart, simpleChartMeta);\n}\n","import { registerSimpleChart } from \"./simple-chart\";\nimport { Registerable } from \"./utils\";\n\nexport function registerAll(loader?: Registerable) {\n registerSimpleChart(loader);\n}\n"],"names":["registerComponentHelper","loader","component","meta","registerComponent","baseOptions","responsive","chartArea","defaultColors","useIsClient","useState","loaded","setLoaded","useEffect","range","total","Array","from","keys","getDefaultColor","index","opacity","preferredStart","end","length","start","Math","max","min","stops","map","_","i","round","selected","undefined","replace","prepData","data","labelField","chosenFields","scatterSeries","isScatter","preferNonNumericAsLabel","extras","fields","Object","isFieldAllNumericOrNil","Map","key","every","item","isNaN","realLabelField","find","field","get","numericFields","filter","name","datasets","series","label","x","y","backgroundColor","autoChosenFields","labels","borderWidth","borderColor","prepOptions","interactive","title","interaction","mode","intersect","display","text","ChartAreaPlugin","id","beforeDraw","chart","chartAreaOptions","config","options","ctx","canvas","getContext","save","fillStyle","fillRect","left","top","right","bottom","restore","stackedOptions","scales","stacked","ticks","major","enabled","vertOptions","plugins","legend","position","horizOptions","indexAxis","SimpleBar","props","direction","className","isClient","ChartJS","register","CategoryScale","LinearScale","BarElement","Title","Tooltip","Legend","normalized","React","Bar","deepmerge","all","SimpleLine","secondAxisField","fill","PointElement","LineElement","Filler","pointRadius","yAxisID","Line","type","y1","grid","drawOnChartArea","SimpleScatter","console","log","Scatter","beginAtZero","SimpleChart","simpleChartMeta","displayName","value","defaultValueHint","description","defaultExpr","JSON","stringify","region","revenue","spend","hidden","defaultStyles","width","importName","importPath","registerSimpleChart","registerAll"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("@plasmicapp/host/registerComponent"));require("@plasmicapp/host/registerGlobalContext");var r=require("react"),n=e(r),a=require("chart.js"),
|
|
1
|
+
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("@plasmicapp/host/registerComponent"));require("@plasmicapp/host/registerGlobalContext");var r=require("react"),n=e(r),a=require("chart.js"),l=e(require("deepmerge")),i=require("react-chartjs-2");function o(){return(o=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}var s={responsive:!0,chartArea:{}},c=["hsla(25,95%,53%,1.0)","hsla(38,92%,50%,1.0)","hsla(45,93%,47%,1.0)","hsla(84,81%,44%,1.0)","hsla(142,71%,45%,1.0)","hsla(160,84%,39%,1.0)","hsla(173,80%,40%,1.0)","hsla(199,89%,48%,1.0)","hsla(217,91%,60%,1.0)","hsla(239,84%,67%,1.0)","hsla(258,90%,66%,1.0)","hsla(271,91%,65%,1.0)","hsla(292,84%,61%,1.0)","hsla(293,69%,49%,1.0)","hsla(295,72%,40%,1.0)","hsla(295,70%,33%,1.0)"];function u(){var e=r.useState(!1),t=e[0],n=e[1];return r.useEffect((function(){n(!0)})),t}function d(e){return Array.from(Array(e).keys())}function p(e,t,r){var n=c.length-1,a=Math.max(0,Math.min(7,n-t)),l=t>c.length?d(c.length):d(t).map((function(e,r){return Math.round(a+1*r/(t-1)*(n-a))})),i=c[l[e%l.length]];return void 0===r?i:i.replace("1.0",""+r)}function f(e,t){var r,n,a,l=e.data,i=void 0===l?[]:l,s=e.labelField,c=e.chosenFields,u=e.scatterSeries,d=void 0===t?{}:t,f=d.isScatter,h=d.preferNonNumericAsLabel,v=d.extras,m=d.opacity,g=Object.keys(null!=(r=i[0])?r:{}),y=new Map(g.map((function(e){return[e,i.every((function(t){var r;return!isNaN(null!=(r=t[e])?r:0)}))]}))),b=null!=s?s:h?g.find((function(e){return!y.get(e)})):g[0],E=g.filter((function(e){return y.get(e)}));if(f)return{datasets:(null!=(a=u=f?null!=(n=u)?n:[{name:E[0]+"-"+E[1],fields:[E[0],E[1]]}]:void 0)?a:[]).map((function(e,t){var r;return o({},null==v?void 0:v(e.name),{label:e.name,data:i.map((function(t){var r,n;return{x:null!=(r=t[e.fields[0]])?r:0,y:null!=(n=t[e.fields[1]])?n:0}})),backgroundColor:p(t,(null!=(r=u)?r:[]).length,m)})}))};var A=E.filter((function(e){return e!==b}));return{labels:b?i.map((function(e){return e[b]})):void 0,datasets:(null!=c?c:A).map((function(e,t){return o({},null==v?void 0:v(e),{label:e,data:i.map((function(t){var r;return null!=(r=t[e])?r:0})),backgroundColor:p(t,(null!=c?c:A).length,1),borderWidth:2,borderColor:p(t,(null!=c?c:A).length,1)})}))}}function h(e){var t=e.interactive,r=e.title;return[s,void 0===t||t?{interaction:{mode:"index",intersect:!1}}:{},r?{title:{display:!0,text:r}}:{}]}var v={id:"chartAreaPlugin",beforeDraw:function(e){var t=e.config.options.chartArea;if(t&&t.backgroundColor){var r=e.canvas.getContext("2d"),n=e.chartArea;r&&(r.save(),r.fillStyle=t.backgroundColor,r.fillRect(n.left,n.top,n.right-n.left,n.bottom-n.top),r.restore())}}},m={scales:{x:{stacked:!0,ticks:{major:{enabled:!1}}},y:{stacked:!0}}},g={plugins:{legend:{position:"top"}}},y={indexAxis:"y",plugins:{legend:{position:"right"}}};function b(e){var t=e.direction,o=void 0===t?"vertical":t,s=e.stacked,c=e.className,d=u();if(r.useEffect((function(){a.Chart.register(v,a.CategoryScale,a.LinearScale,a.BarElement,a.Title,a.Tooltip,a.Legend)}),[]),!d)return null;var p=f(e,{preferNonNumericAsLabel:!0,opacity:1}),b=h(e);return n.createElement("div",{className:c},n.createElement(i.Bar,{options:l.all([].concat(b,["vertical"===o?g:y,s?m:{}])),data:p}))}function E(e){var t=e.secondAxisField,o=e.fill,s=e.className,c=u();if(r.useEffect((function(){a.Chart.register(v,a.CategoryScale,a.LinearScale,a.PointElement,a.LineElement,a.Title,a.Tooltip,a.Filler,a.Legend)}),[]),!c)return null;var d=f(e,{extras:function(e){return{fill:o,pointRadius:0,yAxisID:e===t?"y1":"y"}}}),p=h(e);return n.createElement("div",{className:s},n.createElement(i.Line,{options:l.all([].concat(p,[t?{scales:{y:{type:"linear",display:!0,position:"left"},y1:{type:"linear",display:!0,position:"right",grid:{drawOnChartArea:!1}}}}:{}])),data:d}))}function A(e){var t=e.className,o=u();if(r.useEffect((function(){a.Chart.register(v,a.LinearScale,a.PointElement,a.LineElement,a.Tooltip,a.Legend)}),[]),!o)return null;var s=f(e,{isScatter:!0,opacity:1}),c=h(e);return console.log("!!",s,c),n.createElement("div",{className:t},n.createElement(i.Scatter,{options:l.all([].concat(c,[{scales:{y:{beginAtZero:!0}}}])),data:s}))}function C(e){var t;switch(null!=(t=e.type)?t:"bar"){case"bar":return n.createElement(b,Object.assign({},e));case"line":return n.createElement(E,Object.assign({},e));case"scatter":return n.createElement(A,Object.assign({},e))}}var x={name:"hostless-react-chartjs-2-simple-chart",displayName:"Chart",props:{type:{type:"choice",options:[{value:"bar",label:"Bar"},{value:"line",label:"Line"},{value:"scatter",label:"Scatter"}],defaultValueHint:"bar"},data:{type:"exprEditor",description:"The data as an array of objects",defaultExpr:JSON.stringify([{region:"APAC",revenue:3294,spend:2675},{region:"EMEA",revenue:3245,spend:3895},{region:"LATAM",revenue:2165,spend:3498},{region:"AMER",revenue:3215,spend:1656}])},labelField:{type:"choice",hidden:function(e){return"scatter"===e.type},options:function(e){var t;return null!=(t=e.data)&&t[0]?Object.keys(e.data[0]):[]}},title:"string",fill:{type:"boolean",hidden:function(e){return"line"!==e.type}}},defaultStyles:{width:"stretch"},importName:"SimpleChart",importPath:"@plasmicpkgs/react-chartjs-2/dist/simple-chart/SimpleChart"};exports.registerAll=function(e){!function(e){!function(e,r,n){e?e.registerComponent(r,n):t(r,n)}(e,C,x)}(e)};
|
|
2
2
|
//# sourceMappingURL=react-chartjs-2.cjs.production.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-chartjs-2.cjs.production.min.js","sources":["../src/common.ts","../src/simple-bar/SimpleBar.tsx","../src/simple-line/SimpleLine.tsx","../src/simple-scatter/SimpleScatter.tsx","../src/simple-chart/SimpleChart.tsx","../src/simple-chart/index.tsx","../src/index.tsx","../src/utils.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { baseOptions } from \"./simple-bar/SimpleBar\";\n\nexport const defaultColors = [\n \"rgba(255, 99, 132, 0.2)\",\n \"rgba(54, 162, 235, 0.2)\",\n \"rgba(255, 206, 86, 0.2)\",\n \"rgba(75, 192, 192, 0.2)\",\n \"rgba(153, 102, 255, 0.2)\",\n \"rgba(255, 159, 64, 0.2)\",\n];\n\nexport function useIsClient() {\n const [loaded, setLoaded] = useState(false);\n useEffect(() => {\n setLoaded(true);\n });\n return loaded;\n}\n\nexport interface BaseChartProps {\n className?: string;\n data?: Record<string, any>[];\n labelField?: string;\n interactive?: boolean;\n title?: string;\n chosenFields?: string[];\n scatterSeries?: { name: string; fields: [string, string] }[];\n}\n\nexport interface PrepDataOpts {\n isScatter?: boolean;\n preferNonNumericAsLabel?: boolean;\n extras?: (field: string) => {};\n opacity?: number;\n}\n\nexport function getDefaultColor(index: number, opacity = 0.2) {\n return defaultColors[index % defaultColors.length].replace(\n \"0.2\",\n \"\" + opacity\n );\n}\n\nexport function prepData(\n { data = [], labelField, chosenFields, scatterSeries }: BaseChartProps,\n { isScatter, preferNonNumericAsLabel, extras, opacity }: PrepDataOpts = {}\n) {\n const fields = Object.keys(data[0] ?? {});\n const isFieldAllNumericOrNil = new Map(\n fields.map((key) => [key, data.every((item) => !isNaN(item[key] ?? 0))])\n );\n const realLabelField =\n labelField ??\n (preferNonNumericAsLabel\n ? fields.find((field) => !isFieldAllNumericOrNil.get(field))\n : fields[0]);\n const numericFields = fields.filter((field) =>\n isFieldAllNumericOrNil.get(field)\n );\n if (isScatter) {\n scatterSeries = isScatter\n ? scatterSeries ?? [\n {\n name: `${numericFields[0]}-${numericFields[1]}`,\n fields: [numericFields[0], numericFields[1]] as [string, string],\n },\n ]\n : undefined;\n return {\n datasets: (scatterSeries ?? []).map((series, index) => ({\n ...extras?.(series.name),\n label: series.name,\n data: data.map((item) => ({\n x: item[series.fields[0]] ?? 0,\n y: item[series.fields[1]] ?? 0,\n })),\n backgroundColor: getDefaultColor(index, opacity),\n })),\n };\n } else {\n const autoChosenFields = numericFields.filter(\n (field) => field !== realLabelField\n );\n return {\n labels: realLabelField\n ? data.map((item) => item[realLabelField])\n : undefined,\n datasets: (chosenFields ?? autoChosenFields).map((key, index) => {\n return {\n ...extras?.(key),\n label: key,\n data: data.map((item) => item[key] ?? 0),\n backgroundColor: getDefaultColor(index, opacity),\n };\n }),\n };\n }\n}\n\n// additional styling\n\n/*\n elements: {\n bar: {\n borderWidth: 2,\n },\n },\n\n */\n\nexport function prepOptions({ interactive = true, title }: BaseChartProps) {\n return [\n baseOptions,\n interactive\n ? {\n interaction: {\n mode: \"index\" as const,\n intersect: false,\n },\n }\n : {},\n title ? { title: { display: true, text: title } } : {},\n ];\n}\n","import {\n BarElement,\n CategoryScale,\n Chart as ChartJS,\n Legend,\n LinearScale,\n Title,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Bar } from \"react-chartjs-2\";\nimport { BaseChartProps, prepData, prepOptions, useIsClient } from \"../common\";\n\nexport const baseOptions = {\n responsive: true,\n};\n\nexport const stackedOptions = {\n scales: {\n x: {\n stacked: true,\n },\n y: {\n stacked: true,\n },\n },\n};\n\nexport const vertOptions = {\n plugins: {\n legend: {\n position: \"top\" as const,\n },\n },\n};\nexport const horizOptions = {\n indexAxis: \"y\" as const,\n plugins: {\n legend: {\n position: \"right\" as const,\n },\n },\n};\n\nexport interface SimpleBarProps extends BaseChartProps {\n direction?: \"vertical\" | \"horizontal\";\n stacked?: boolean;\n}\n\nexport function SimpleBar(props: SimpleBarProps) {\n const { direction = \"vertical\", stacked, className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n CategoryScale,\n LinearScale,\n BarElement,\n Title,\n Tooltip,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, {\n preferNonNumericAsLabel: true,\n opacity: 0.5,\n });\n const options = prepOptions(props);\n return (\n <div className={className}>\n <Bar\n options={deepmerge.all([\n ...options,\n direction === \"vertical\" ? vertOptions : horizOptions,\n stacked ? stackedOptions : {},\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import {\n CategoryScale,\n Chart as ChartJS,\n Filler,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n Title,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Line } from \"react-chartjs-2\";\nimport { BaseChartProps, prepData, prepOptions, useIsClient } from \"../common\";\n\nexport interface SimpleLineProps extends BaseChartProps {\n fill?: boolean;\n secondAxisField?: string;\n}\n\nexport function SimpleLine(props: SimpleLineProps) {\n const { secondAxisField, fill, className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n CategoryScale,\n LinearScale,\n PointElement,\n LineElement,\n Title,\n Tooltip,\n Filler,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, {\n extras: (field) => ({\n fill,\n yAxisID: field === secondAxisField ? \"y1\" : \"y\",\n }),\n });\n const options = prepOptions(props);\n return (\n <div className={className}>\n <Line\n options={deepmerge.all([\n ...options,\n secondAxisField\n ? {\n scales: {\n y: {\n type: \"linear\" as const,\n display: true,\n position: \"left\" as const,\n },\n y1: {\n type: \"linear\" as const,\n display: true,\n position: \"right\" as const,\n grid: {\n drawOnChartArea: false,\n },\n },\n },\n }\n : {},\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import {\n Chart as ChartJS,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Scatter } from \"react-chartjs-2\";\nimport { BaseChartProps, prepData, prepOptions, useIsClient } from \"../common\";\n\nexport interface SimpleScatterProps extends BaseChartProps {}\n\nexport function SimpleScatter(props: SimpleScatterProps) {\n const { className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(LinearScale, PointElement, LineElement, Tooltip, Legend);\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, { isScatter: true, opacity: 1 });\n const options = prepOptions(props);\n console.log(\"!!\", normalized, options);\n return (\n <div className={className}>\n <Scatter\n options={deepmerge.all([\n ...options,\n {\n scales: {\n y: {\n beginAtZero: true,\n },\n },\n },\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import React, { ReactElement } from \"react\";\nimport { SimpleBar, SimpleBarProps } from \"../simple-bar/SimpleBar\";\nimport { SimpleLine, SimpleLineProps } from \"../simple-line/SimpleLine\";\nimport {\n SimpleScatter,\n SimpleScatterProps,\n} from \"../simple-scatter/SimpleScatter\";\n\nexport type SimpleChartProps = {\n type?: \"bar\" | \"line\" | \"scatter\";\n} & (SimpleBarProps | SimpleLineProps | SimpleScatterProps);\n\nexport function SimpleChart(props: SimpleChartProps): ReactElement {\n switch (props.type ?? \"bar\") {\n case \"bar\":\n return <SimpleBar {...(props as any)} />;\n case \"line\":\n return <SimpleLine {...(props as any)} />;\n case \"scatter\":\n return <SimpleScatter {...(props as any)} />;\n }\n}\n","import { ComponentMeta } from \"@plasmicapp/host/registerComponent\";\nimport { Registerable, registerComponentHelper } from \"../utils\";\nimport { SimpleChart, SimpleChartProps } from \"./SimpleChart\";\n\nexport * from \"./SimpleChart\";\nexport default SimpleChart;\n\nconst simpleChartMeta: ComponentMeta<SimpleChartProps> = {\n name: \"hostless-react-chartjs-2-simple-chart\",\n displayName: \"Chart\",\n props: {\n type: {\n type: \"choice\",\n options: [\n {\n value: \"bar\",\n label: \"Bar\",\n },\n {\n value: \"line\",\n label: \"Line\",\n },\n {\n value: \"scatter\",\n label: \"Scatter\",\n },\n ],\n defaultValueHint: \"bar\",\n },\n data: {\n type: \"exprEditor\" as any,\n description: \"The data as an array of objects\",\n defaultExpr: JSON.stringify([\n {\n region: \"APAC\",\n revenue: 3294,\n spend: 2675,\n },\n {\n region: \"EMEA\",\n revenue: 3245,\n spend: 3895,\n },\n {\n region: \"LATAM\",\n revenue: 2165,\n spend: 3498,\n },\n {\n region: \"AMER\",\n revenue: 3215,\n spend: 1656,\n },\n ]),\n },\n labelField: {\n type: \"choice\",\n hidden: (props) => props.type === \"scatter\",\n options: (props) => (props.data?.[0] ? Object.keys(props.data[0]) : []),\n },\n title: \"string\",\n fill: {\n type: \"boolean\",\n hidden: (props) => props.type !== \"line\",\n },\n // TODO\n // datasets: {\n // type: \"array\",\n // unstable__keyFunc: (x) => x.key,\n // unstable__minimalValue: (_props, ctx) => null,\n // itemType: {\n // type: \"object\",\n // fields: {\n // label: \"string\",\n // fieldId: \"string\",\n // hidden: {\n // type: \"boolean\",\n // },\n // },\n // },\n // },\n },\n\n defaultStyles: {\n width: \"stretch\",\n },\n\n importName: \"SimpleChart\",\n importPath: \"@plasmicpkgs/react-chartjs-2/dist/simple-chart/SimpleChart\",\n};\n\nexport function registerSimpleChart(loader?: Registerable) {\n registerComponentHelper(loader, SimpleChart, simpleChartMeta);\n}\n","import { registerSimpleChart } from \"./simple-chart\";\nimport { Registerable } from \"./utils\";\n\nexport function registerAll(loader?: Registerable) {\n registerSimpleChart(loader);\n}\n","import {\n ComponentMeta,\n default as registerComponent,\n} from \"@plasmicapp/host/registerComponent\";\nimport {\n default as registerGlobalContext,\n GlobalContextMeta,\n} from \"@plasmicapp/host/registerGlobalContext\";\nimport { default as registerToken } from \"@plasmicapp/host/registerToken\";\nimport React from \"react\";\n\nexport type Registerable = {\n registerComponent: typeof registerComponent;\n registerGlobalContext: typeof registerGlobalContext;\n registerToken: typeof registerToken;\n};\n\nexport function makeRegisterComponent<T extends React.ComponentType<any>>(\n component: T,\n meta: ComponentMeta<React.ComponentProps<T>>\n) {\n return function (loader?: Registerable) {\n registerComponentHelper(loader, component, meta);\n };\n}\n\nexport function makeRegisterGlobalContext<T extends React.ComponentType<any>>(\n component: T,\n meta: GlobalContextMeta<React.ComponentProps<T>>\n) {\n return function (loader?: Registerable) {\n if (loader) {\n loader.registerGlobalContext(component, meta);\n } else {\n registerGlobalContext(component, meta);\n }\n };\n}\n\nexport function registerComponentHelper<T extends React.ComponentType<any>>(\n loader: Registerable | undefined,\n component: T,\n meta: ComponentMeta<React.ComponentProps<T>>\n) {\n if (loader) {\n loader.registerComponent(component, meta);\n } else {\n registerComponent(component, meta);\n }\n}\n\ntype ReactElt = {\n children: ReactElt | ReactElt[];\n props: {\n children: ReactElt | ReactElt[];\n [prop: string]: any;\n } | null;\n type: React.ComponentType<any> | null;\n key: string | null;\n} | null;\n\nexport function traverseReactEltTree(\n children: React.ReactNode,\n callback: (elt: ReactElt) => void\n) {\n const rec = (elts: ReactElt | ReactElt[] | null) => {\n (Array.isArray(elts) ? elts : [elts]).forEach((elt) => {\n if (elt) {\n callback(elt);\n if (elt.children) {\n rec(elt.children);\n }\n if (elt.props?.children && elt.props.children !== elt.children) {\n rec(elt.props.children);\n }\n }\n });\n };\n rec(children as any);\n}\n\nexport function asArray<T>(x: T[] | T | undefined | null) {\n if (Array.isArray(x)) {\n return x;\n } else if (x == null) {\n return [];\n } else {\n return [x];\n }\n}\n"],"names":["defaultColors","useIsClient","useState","loaded","setLoaded","useEffect","getDefaultColor","index","opacity","length","replace","prepData","data","labelField","chosenFields","scatterSeries","isScatter","preferNonNumericAsLabel","extras","fields","Object","keys","isFieldAllNumericOrNil","Map","map","key","every","item","isNaN","realLabelField","find","field","get","numericFields","filter","datasets","name","undefined","series","label","x","y","backgroundColor","autoChosenFields","labels","prepOptions","interactive","title","baseOptions","interaction","mode","intersect","display","text","responsive","stackedOptions","scales","stacked","vertOptions","plugins","legend","position","horizOptions","indexAxis","SimpleBar","props","direction","className","isClient","ChartJS","register","CategoryScale","LinearScale","BarElement","Title","Tooltip","Legend","normalized","options","React","Bar","deepmerge","all","SimpleLine","secondAxisField","fill","PointElement","LineElement","Filler","yAxisID","Line","type","y1","grid","drawOnChartArea","SimpleScatter","console","log","Scatter","beginAtZero","SimpleChart","simpleChartMeta","displayName","value","defaultValueHint","description","defaultExpr","JSON","stringify","region","revenue","spend","hidden","_props$data","defaultStyles","width","importName","importPath","loader","component","meta","registerComponent","registerComponentHelper","registerSimpleChart"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"react-chartjs-2.cjs.production.min.js","sources":["../src/common.ts","../src/simple-bar/SimpleBar.tsx","../src/simple-line/SimpleLine.tsx","../src/simple-scatter/SimpleScatter.tsx","../src/simple-chart/SimpleChart.tsx","../src/simple-chart/index.tsx","../src/index.tsx","../src/utils.ts"],"sourcesContent":["import { Plugin } from \"chart.js/dist/types\";\nimport { useEffect, useState } from \"react\";\n\nexport const baseOptions = {\n responsive: true,\n chartArea: {\n // backgroundColor: \"#f8fafc\",\n },\n};\n\n/**\n * These are hand-picked from the Tailwind palette.\n */\nexport const defaultColors = [\n \"hsla(25,95%,53%,1.0)\",\n \"hsla(38,92%,50%,1.0)\",\n \"hsla(45,93%,47%,1.0)\",\n \"hsla(84,81%,44%,1.0)\",\n \"hsla(142,71%,45%,1.0)\",\n \"hsla(160,84%,39%,1.0)\",\n \"hsla(173,80%,40%,1.0)\",\n \"hsla(199,89%,48%,1.0)\",\n \"hsla(217,91%,60%,1.0)\",\n \"hsla(239,84%,67%,1.0)\",\n \"hsla(258,90%,66%,1.0)\",\n \"hsla(271,91%,65%,1.0)\",\n \"hsla(292,84%,61%,1.0)\",\n \"hsla(293,69%,49%,1.0)\",\n \"hsla(295,72%,40%,1.0)\",\n \"hsla(295,70%,33%,1.0)\",\n];\n\nexport function useIsClient() {\n const [loaded, setLoaded] = useState(false);\n useEffect(() => {\n setLoaded(true);\n });\n return loaded;\n}\n\nexport interface BaseChartProps {\n className?: string;\n data?: Record<string, any>[];\n labelField?: string;\n interactive?: boolean;\n title?: string;\n chosenFields?: string[];\n scatterSeries?: { name: string; fields: [string, string] }[];\n}\n\nexport interface PrepDataOpts {\n isScatter?: boolean;\n preferNonNumericAsLabel?: boolean;\n extras?: (field: string) => {};\n opacity?: number;\n}\n\nfunction range(total: number) {\n return Array.from(Array(total).keys());\n}\n\n/**\n * Returns a color from the default color palette.\n *\n * Tries to pick \"different\" colors that are somewhat spread out on the palette. With a higher 'total' colors requested, the colors will be packed more closely together.\n *\n * We prefer starting from blue when possible. This only starts getting pushed down toward yellow if too many colors requested.\n *\n * If too many colors are requested, it will recycle.\n */\nexport function getDefaultColor(\n index: number,\n total: number,\n opacity?: number\n) {\n const preferredStart = 7;\n const end = defaultColors.length - 1;\n const start = Math.max(0, Math.min(preferredStart, end - total));\n const stops =\n total > defaultColors.length\n ? range(defaultColors.length)\n : range(total).map((_, i) =>\n Math.round(start + ((1.0 * i) / (total - 1)) * (end - start))\n );\n const selected = defaultColors[stops[index % stops.length]];\n if (opacity === undefined) {\n return selected;\n }\n return selected.replace(\"1.0\", \"\" + opacity);\n}\n\nexport function prepData(\n { data = [], labelField, chosenFields, scatterSeries }: BaseChartProps,\n { isScatter, preferNonNumericAsLabel, extras, opacity }: PrepDataOpts = {}\n) {\n const fields = Object.keys(data[0] ?? {});\n const isFieldAllNumericOrNil = new Map(\n fields.map((key) => [key, data.every((item) => !isNaN(item[key] ?? 0))])\n );\n const realLabelField =\n labelField ??\n (preferNonNumericAsLabel\n ? fields.find((field) => !isFieldAllNumericOrNil.get(field))\n : fields[0]);\n const numericFields = fields.filter((field) =>\n isFieldAllNumericOrNil.get(field)\n );\n if (isScatter) {\n scatterSeries = isScatter\n ? scatterSeries ?? [\n {\n name: `${numericFields[0]}-${numericFields[1]}`,\n fields: [numericFields[0], numericFields[1]] as [string, string],\n },\n ]\n : undefined;\n return {\n datasets: (scatterSeries ?? []).map((series, index) => ({\n ...extras?.(series.name),\n label: series.name,\n data: data.map((item) => ({\n x: item[series.fields[0]] ?? 0,\n y: item[series.fields[1]] ?? 0,\n })),\n backgroundColor: getDefaultColor(\n index,\n (scatterSeries ?? []).length,\n opacity\n ),\n })),\n };\n } else {\n const autoChosenFields = numericFields.filter(\n (field) => field !== realLabelField\n );\n return {\n labels: realLabelField\n ? data.map((item) => item[realLabelField])\n : undefined,\n datasets: (chosenFields ?? autoChosenFields).map((key, index) => {\n return {\n ...extras?.(key),\n label: key,\n data: data.map((item) => item[key] ?? 0),\n backgroundColor: getDefaultColor(\n index,\n (chosenFields ?? autoChosenFields).length,\n 1\n ),\n borderWidth: 2,\n borderColor: getDefaultColor(\n index,\n (chosenFields ?? autoChosenFields).length,\n 1\n ),\n };\n }),\n };\n }\n}\n\n// additional styling\n\n/*\n elements: {\n bar: {\n borderWidth: 2,\n },\n },\n\n */\n\nexport function prepOptions({ interactive = true, title }: BaseChartProps) {\n return [\n baseOptions,\n interactive\n ? {\n interaction: {\n mode: \"index\" as const,\n intersect: false,\n },\n }\n : {},\n title ? { title: { display: true, text: title } } : {},\n ];\n}\n\nexport const ChartAreaPlugin: Plugin = {\n id: \"chartAreaPlugin\",\n // eslint-disable-next-line object-shorthand\n beforeDraw: (chart) => {\n const chartAreaOptions = (chart.config.options as any).chartArea;\n if (chartAreaOptions && chartAreaOptions.backgroundColor) {\n const ctx = chart.canvas.getContext(\"2d\");\n const { chartArea } = chart;\n if (ctx) {\n ctx.save();\n ctx.fillStyle = chartAreaOptions.backgroundColor;\n // eslint-disable-next-line max-len\n ctx.fillRect(\n chartArea.left,\n chartArea.top,\n chartArea.right - chartArea.left,\n chartArea.bottom - chartArea.top\n );\n ctx.restore();\n }\n }\n },\n};\n","import {\n BarElement,\n CategoryScale,\n Chart as ChartJS,\n Legend,\n LinearScale,\n Title,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Bar } from \"react-chartjs-2\";\nimport {\n BaseChartProps,\n ChartAreaPlugin,\n prepData,\n prepOptions,\n useIsClient,\n} from \"../common\";\n\nexport const stackedOptions = {\n scales: {\n x: {\n stacked: true,\n ticks: {\n major: {\n enabled: false,\n },\n },\n },\n y: {\n stacked: true,\n },\n },\n};\n\nexport const vertOptions = {\n plugins: {\n legend: {\n position: \"top\" as const,\n },\n },\n};\nexport const horizOptions = {\n indexAxis: \"y\" as const,\n plugins: {\n legend: {\n position: \"right\" as const,\n },\n },\n};\n\nexport interface SimpleBarProps extends BaseChartProps {\n direction?: \"vertical\" | \"horizontal\";\n stacked?: boolean;\n}\n\nexport function SimpleBar(props: SimpleBarProps) {\n const { direction = \"vertical\", stacked, className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n ChartAreaPlugin,\n CategoryScale,\n LinearScale,\n BarElement,\n Title,\n Tooltip,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, {\n preferNonNumericAsLabel: true,\n opacity: 1,\n });\n const options = prepOptions(props);\n return (\n <div className={className}>\n <Bar\n options={deepmerge.all([\n ...options,\n direction === \"vertical\" ? vertOptions : horizOptions,\n stacked ? stackedOptions : {},\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import {\n CategoryScale,\n Chart as ChartJS,\n Filler,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n Title,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Line } from \"react-chartjs-2\";\nimport {\n BaseChartProps,\n ChartAreaPlugin,\n prepData,\n prepOptions,\n useIsClient,\n} from \"../common\";\n\nexport interface SimpleLineProps extends BaseChartProps {\n fill?: boolean;\n secondAxisField?: string;\n}\n\nexport function SimpleLine(props: SimpleLineProps) {\n const { secondAxisField, fill, className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n ChartAreaPlugin,\n CategoryScale,\n LinearScale,\n PointElement,\n LineElement,\n Title,\n Tooltip,\n Filler,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, {\n extras: (field) => ({\n fill,\n pointRadius: 0,\n yAxisID: field === secondAxisField ? \"y1\" : \"y\",\n }),\n });\n const options = prepOptions(props);\n return (\n <div className={className}>\n <Line\n options={deepmerge.all([\n ...options,\n secondAxisField\n ? {\n scales: {\n y: {\n type: \"linear\" as const,\n display: true,\n position: \"left\" as const,\n },\n y1: {\n type: \"linear\" as const,\n display: true,\n position: \"right\" as const,\n grid: {\n drawOnChartArea: false,\n },\n },\n },\n }\n : {},\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import {\n Chart as ChartJS,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Scatter } from \"react-chartjs-2\";\nimport {\n BaseChartProps,\n ChartAreaPlugin,\n prepData,\n prepOptions,\n useIsClient,\n} from \"../common\";\n\nexport interface SimpleScatterProps extends BaseChartProps {}\n\nexport function SimpleScatter(props: SimpleScatterProps) {\n const { className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n ChartAreaPlugin,\n LinearScale,\n PointElement,\n LineElement,\n Tooltip,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, { isScatter: true, opacity: 1 });\n const options = prepOptions(props);\n console.log(\"!!\", normalized, options);\n return (\n <div className={className}>\n <Scatter\n options={deepmerge.all([\n ...options,\n {\n scales: {\n y: {\n beginAtZero: true,\n },\n },\n },\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import React, { ReactElement } from \"react\";\nimport { SimpleBar, SimpleBarProps } from \"../simple-bar/SimpleBar\";\nimport { SimpleLine, SimpleLineProps } from \"../simple-line/SimpleLine\";\nimport {\n SimpleScatter,\n SimpleScatterProps,\n} from \"../simple-scatter/SimpleScatter\";\n\nexport type SimpleChartProps = {\n type?: \"bar\" | \"line\" | \"scatter\";\n} & (SimpleBarProps | SimpleLineProps | SimpleScatterProps);\n\nexport function SimpleChart(props: SimpleChartProps): ReactElement {\n switch (props.type ?? \"bar\") {\n case \"bar\":\n return <SimpleBar {...(props as any)} />;\n case \"line\":\n return <SimpleLine {...(props as any)} />;\n case \"scatter\":\n return <SimpleScatter {...(props as any)} />;\n }\n}\n","import { ComponentMeta } from \"@plasmicapp/host/registerComponent\";\nimport { Registerable, registerComponentHelper } from \"../utils\";\nimport { SimpleChart, SimpleChartProps } from \"./SimpleChart\";\n\nexport * from \"./SimpleChart\";\nexport default SimpleChart;\n\nconst simpleChartMeta: ComponentMeta<SimpleChartProps> = {\n name: \"hostless-react-chartjs-2-simple-chart\",\n displayName: \"Chart\",\n props: {\n type: {\n type: \"choice\",\n options: [\n {\n value: \"bar\",\n label: \"Bar\",\n },\n {\n value: \"line\",\n label: \"Line\",\n },\n {\n value: \"scatter\",\n label: \"Scatter\",\n },\n ],\n defaultValueHint: \"bar\",\n },\n data: {\n type: \"exprEditor\" as any,\n description: \"The data as an array of objects\",\n defaultExpr: JSON.stringify([\n {\n region: \"APAC\",\n revenue: 3294,\n spend: 2675,\n },\n {\n region: \"EMEA\",\n revenue: 3245,\n spend: 3895,\n },\n {\n region: \"LATAM\",\n revenue: 2165,\n spend: 3498,\n },\n {\n region: \"AMER\",\n revenue: 3215,\n spend: 1656,\n },\n ]),\n },\n labelField: {\n type: \"choice\",\n hidden: (props) => props.type === \"scatter\",\n options: (props) => (props.data?.[0] ? Object.keys(props.data[0]) : []),\n },\n title: \"string\",\n fill: {\n type: \"boolean\",\n hidden: (props) => props.type !== \"line\",\n },\n // TODO\n // datasets: {\n // type: \"array\",\n // unstable__keyFunc: (x) => x.key,\n // unstable__minimalValue: (_props, ctx) => null,\n // itemType: {\n // type: \"object\",\n // fields: {\n // label: \"string\",\n // fieldId: \"string\",\n // hidden: {\n // type: \"boolean\",\n // },\n // },\n // },\n // },\n },\n\n defaultStyles: {\n width: \"stretch\",\n },\n\n importName: \"SimpleChart\",\n importPath: \"@plasmicpkgs/react-chartjs-2/dist/simple-chart/SimpleChart\",\n};\n\nexport function registerSimpleChart(loader?: Registerable) {\n registerComponentHelper(loader, SimpleChart, simpleChartMeta);\n}\n","import { registerSimpleChart } from \"./simple-chart\";\nimport { Registerable } from \"./utils\";\n\nexport function registerAll(loader?: Registerable) {\n registerSimpleChart(loader);\n}\n","import {\n ComponentMeta,\n default as registerComponent,\n} from \"@plasmicapp/host/registerComponent\";\nimport {\n default as registerGlobalContext,\n GlobalContextMeta,\n} from \"@plasmicapp/host/registerGlobalContext\";\nimport { default as registerToken } from \"@plasmicapp/host/registerToken\";\nimport React from \"react\";\n\nexport type Registerable = {\n registerComponent: typeof registerComponent;\n registerGlobalContext: typeof registerGlobalContext;\n registerToken: typeof registerToken;\n};\n\nexport function makeRegisterComponent<T extends React.ComponentType<any>>(\n component: T,\n meta: ComponentMeta<React.ComponentProps<T>>\n) {\n return function (loader?: Registerable) {\n registerComponentHelper(loader, component, meta);\n };\n}\n\nexport function makeRegisterGlobalContext<T extends React.ComponentType<any>>(\n component: T,\n meta: GlobalContextMeta<React.ComponentProps<T>>\n) {\n return function (loader?: Registerable) {\n if (loader) {\n loader.registerGlobalContext(component, meta);\n } else {\n registerGlobalContext(component, meta);\n }\n };\n}\n\nexport function registerComponentHelper<T extends React.ComponentType<any>>(\n loader: Registerable | undefined,\n component: T,\n meta: ComponentMeta<React.ComponentProps<T>>\n) {\n if (loader) {\n loader.registerComponent(component, meta);\n } else {\n registerComponent(component, meta);\n }\n}\n\ntype ReactElt = {\n children: ReactElt | ReactElt[];\n props: {\n children: ReactElt | ReactElt[];\n [prop: string]: any;\n } | null;\n type: React.ComponentType<any> | null;\n key: string | null;\n} | null;\n\nexport function traverseReactEltTree(\n children: React.ReactNode,\n callback: (elt: ReactElt) => void\n) {\n const rec = (elts: ReactElt | ReactElt[] | null) => {\n (Array.isArray(elts) ? elts : [elts]).forEach((elt) => {\n if (elt) {\n callback(elt);\n if (elt.children) {\n rec(elt.children);\n }\n if (elt.props?.children && elt.props.children !== elt.children) {\n rec(elt.props.children);\n }\n }\n });\n };\n rec(children as any);\n}\n\nexport function asArray<T>(x: T[] | T | undefined | null) {\n if (Array.isArray(x)) {\n return x;\n } else if (x == null) {\n return [];\n } else {\n return [x];\n }\n}\n"],"names":["baseOptions","responsive","chartArea","defaultColors","useIsClient","useState","loaded","setLoaded","useEffect","range","total","Array","from","keys","getDefaultColor","index","opacity","end","length","start","Math","max","min","stops","map","_","i","round","selected","undefined","replace","prepData","data","labelField","chosenFields","scatterSeries","isScatter","preferNonNumericAsLabel","extras","fields","Object","isFieldAllNumericOrNil","Map","key","every","item","isNaN","realLabelField","find","field","get","numericFields","filter","datasets","name","series","label","x","y","backgroundColor","autoChosenFields","labels","borderWidth","borderColor","prepOptions","interactive","title","interaction","mode","intersect","display","text","ChartAreaPlugin","id","beforeDraw","chart","chartAreaOptions","config","options","ctx","canvas","getContext","save","fillStyle","fillRect","left","top","right","bottom","restore","stackedOptions","scales","stacked","ticks","major","enabled","vertOptions","plugins","legend","position","horizOptions","indexAxis","SimpleBar","props","direction","className","isClient","ChartJS","register","CategoryScale","LinearScale","BarElement","Title","Tooltip","Legend","normalized","React","Bar","deepmerge","all","SimpleLine","secondAxisField","fill","PointElement","LineElement","Filler","pointRadius","yAxisID","Line","type","y1","grid","drawOnChartArea","SimpleScatter","console","log","Scatter","beginAtZero","SimpleChart","simpleChartMeta","displayName","value","defaultValueHint","description","defaultExpr","JSON","stringify","region","revenue","spend","hidden","_props$data","defaultStyles","width","importName","importPath","loader","component","meta","registerComponent","registerComponentHelper","registerSimpleChart"],"mappings":"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"}
|
|
@@ -28,7 +28,16 @@ function _extends() {
|
|
|
28
28
|
return _extends.apply(this, arguments);
|
|
29
29
|
}
|
|
30
30
|
|
|
31
|
-
var
|
|
31
|
+
var baseOptions = {
|
|
32
|
+
responsive: true,
|
|
33
|
+
chartArea: {
|
|
34
|
+
// backgroundColor: "#f8fafc",
|
|
35
|
+
}
|
|
36
|
+
};
|
|
37
|
+
/**
|
|
38
|
+
* These are hand-picked from the Tailwind palette.
|
|
39
|
+
*/
|
|
40
|
+
var defaultColors = ["hsla(25,95%,53%,1.0)", "hsla(38,92%,50%,1.0)", "hsla(45,93%,47%,1.0)", "hsla(84,81%,44%,1.0)", "hsla(142,71%,45%,1.0)", "hsla(160,84%,39%,1.0)", "hsla(173,80%,40%,1.0)", "hsla(199,89%,48%,1.0)", "hsla(217,91%,60%,1.0)", "hsla(239,84%,67%,1.0)", "hsla(258,90%,66%,1.0)", "hsla(271,91%,65%,1.0)", "hsla(292,84%,61%,1.0)", "hsla(293,69%,49%,1.0)", "hsla(295,72%,40%,1.0)", "hsla(295,70%,33%,1.0)"];
|
|
32
41
|
function useIsClient() {
|
|
33
42
|
var _useState = useState(false),
|
|
34
43
|
loaded = _useState[0],
|
|
@@ -38,11 +47,30 @@ function useIsClient() {
|
|
|
38
47
|
});
|
|
39
48
|
return loaded;
|
|
40
49
|
}
|
|
41
|
-
function
|
|
42
|
-
|
|
43
|
-
|
|
50
|
+
function range(total) {
|
|
51
|
+
return Array.from(Array(total).keys());
|
|
52
|
+
}
|
|
53
|
+
/**
|
|
54
|
+
* Returns a color from the default color palette.
|
|
55
|
+
*
|
|
56
|
+
* Tries to pick "different" colors that are somewhat spread out on the palette. With a higher 'total' colors requested, the colors will be packed more closely together.
|
|
57
|
+
*
|
|
58
|
+
* We prefer starting from blue when possible. This only starts getting pushed down toward yellow if too many colors requested.
|
|
59
|
+
*
|
|
60
|
+
* If too many colors are requested, it will recycle.
|
|
61
|
+
*/
|
|
62
|
+
function getDefaultColor(index, total, opacity) {
|
|
63
|
+
var preferredStart = 7;
|
|
64
|
+
var end = defaultColors.length - 1;
|
|
65
|
+
var start = Math.max(0, Math.min(preferredStart, end - total));
|
|
66
|
+
var stops = total > defaultColors.length ? range(defaultColors.length) : range(total).map(function (_, i) {
|
|
67
|
+
return Math.round(start + 1.0 * i / (total - 1) * (end - start));
|
|
68
|
+
});
|
|
69
|
+
var selected = defaultColors[stops[index % stops.length]];
|
|
70
|
+
if (opacity === undefined) {
|
|
71
|
+
return selected;
|
|
44
72
|
}
|
|
45
|
-
return
|
|
73
|
+
return selected.replace("1.0", "" + opacity);
|
|
46
74
|
}
|
|
47
75
|
function prepData(_ref, _temp) {
|
|
48
76
|
var _data$;
|
|
@@ -77,6 +105,7 @@ function prepData(_ref, _temp) {
|
|
|
77
105
|
}] : undefined;
|
|
78
106
|
return {
|
|
79
107
|
datasets: ((_scatterSeries2 = scatterSeries) != null ? _scatterSeries2 : []).map(function (series, index) {
|
|
108
|
+
var _scatterSeries3;
|
|
80
109
|
return _extends({}, extras == null ? void 0 : extras(series.name), {
|
|
81
110
|
label: series.name,
|
|
82
111
|
data: data.map(function (item) {
|
|
@@ -86,7 +115,7 @@ function prepData(_ref, _temp) {
|
|
|
86
115
|
y: (_item$series$fields$2 = item[series.fields[1]]) != null ? _item$series$fields$2 : 0
|
|
87
116
|
};
|
|
88
117
|
}),
|
|
89
|
-
backgroundColor: getDefaultColor(index, opacity)
|
|
118
|
+
backgroundColor: getDefaultColor(index, ((_scatterSeries3 = scatterSeries) != null ? _scatterSeries3 : []).length, opacity)
|
|
90
119
|
});
|
|
91
120
|
})
|
|
92
121
|
};
|
|
@@ -105,7 +134,9 @@ function prepData(_ref, _temp) {
|
|
|
105
134
|
var _item$key2;
|
|
106
135
|
return (_item$key2 = item[key]) != null ? _item$key2 : 0;
|
|
107
136
|
}),
|
|
108
|
-
backgroundColor: getDefaultColor(index,
|
|
137
|
+
backgroundColor: getDefaultColor(index, (chosenFields != null ? chosenFields : autoChosenFields).length, 1),
|
|
138
|
+
borderWidth: 2,
|
|
139
|
+
borderColor: getDefaultColor(index, (chosenFields != null ? chosenFields : autoChosenFields).length, 1)
|
|
109
140
|
});
|
|
110
141
|
})
|
|
111
142
|
};
|
|
@@ -136,14 +167,34 @@ function prepOptions(_ref3) {
|
|
|
136
167
|
}
|
|
137
168
|
} : {}];
|
|
138
169
|
}
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
170
|
+
var ChartAreaPlugin = {
|
|
171
|
+
id: "chartAreaPlugin",
|
|
172
|
+
// eslint-disable-next-line object-shorthand
|
|
173
|
+
beforeDraw: function beforeDraw(chart) {
|
|
174
|
+
var chartAreaOptions = chart.config.options.chartArea;
|
|
175
|
+
if (chartAreaOptions && chartAreaOptions.backgroundColor) {
|
|
176
|
+
var ctx = chart.canvas.getContext("2d");
|
|
177
|
+
var chartArea = chart.chartArea;
|
|
178
|
+
if (ctx) {
|
|
179
|
+
ctx.save();
|
|
180
|
+
ctx.fillStyle = chartAreaOptions.backgroundColor;
|
|
181
|
+
// eslint-disable-next-line max-len
|
|
182
|
+
ctx.fillRect(chartArea.left, chartArea.top, chartArea.right - chartArea.left, chartArea.bottom - chartArea.top);
|
|
183
|
+
ctx.restore();
|
|
184
|
+
}
|
|
185
|
+
}
|
|
186
|
+
}
|
|
142
187
|
};
|
|
188
|
+
|
|
143
189
|
var stackedOptions = {
|
|
144
190
|
scales: {
|
|
145
191
|
x: {
|
|
146
|
-
stacked: true
|
|
192
|
+
stacked: true,
|
|
193
|
+
ticks: {
|
|
194
|
+
major: {
|
|
195
|
+
enabled: false
|
|
196
|
+
}
|
|
197
|
+
}
|
|
147
198
|
},
|
|
148
199
|
y: {
|
|
149
200
|
stacked: true
|
|
@@ -172,14 +223,14 @@ function SimpleBar(props) {
|
|
|
172
223
|
className = props.className;
|
|
173
224
|
var isClient = useIsClient();
|
|
174
225
|
useEffect(function () {
|
|
175
|
-
Chart.register(CategoryScale, LinearScale, BarElement, Title, Tooltip, Legend);
|
|
226
|
+
Chart.register(ChartAreaPlugin, CategoryScale, LinearScale, BarElement, Title, Tooltip, Legend);
|
|
176
227
|
}, []);
|
|
177
228
|
if (!isClient) {
|
|
178
229
|
return null;
|
|
179
230
|
}
|
|
180
231
|
var normalized = prepData(props, {
|
|
181
232
|
preferNonNumericAsLabel: true,
|
|
182
|
-
opacity:
|
|
233
|
+
opacity: 1
|
|
183
234
|
});
|
|
184
235
|
var options = prepOptions(props);
|
|
185
236
|
return React.createElement("div", {
|
|
@@ -196,7 +247,7 @@ function SimpleLine(props) {
|
|
|
196
247
|
className = props.className;
|
|
197
248
|
var isClient = useIsClient();
|
|
198
249
|
useEffect(function () {
|
|
199
|
-
Chart.register(CategoryScale, LinearScale, PointElement, LineElement, Title, Tooltip, Filler, Legend);
|
|
250
|
+
Chart.register(ChartAreaPlugin, CategoryScale, LinearScale, PointElement, LineElement, Title, Tooltip, Filler, Legend);
|
|
200
251
|
}, []);
|
|
201
252
|
if (!isClient) {
|
|
202
253
|
return null;
|
|
@@ -205,6 +256,7 @@ function SimpleLine(props) {
|
|
|
205
256
|
extras: function extras(field) {
|
|
206
257
|
return {
|
|
207
258
|
fill: fill,
|
|
259
|
+
pointRadius: 0,
|
|
208
260
|
yAxisID: field === secondAxisField ? "y1" : "y"
|
|
209
261
|
};
|
|
210
262
|
}
|
|
@@ -238,7 +290,7 @@ function SimpleScatter(props) {
|
|
|
238
290
|
var className = props.className;
|
|
239
291
|
var isClient = useIsClient();
|
|
240
292
|
useEffect(function () {
|
|
241
|
-
Chart.register(LinearScale, PointElement, LineElement, Tooltip, Legend);
|
|
293
|
+
Chart.register(ChartAreaPlugin, LinearScale, PointElement, LineElement, Tooltip, Legend);
|
|
242
294
|
}, []);
|
|
243
295
|
if (!isClient) {
|
|
244
296
|
return null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-chartjs-2.esm.js","sources":["../src/utils.ts","../src/common.ts","../src/simple-bar/SimpleBar.tsx","../src/simple-line/SimpleLine.tsx","../src/simple-scatter/SimpleScatter.tsx","../src/simple-chart/SimpleChart.tsx","../src/simple-chart/index.tsx","../src/index.tsx"],"sourcesContent":["import {\n ComponentMeta,\n default as registerComponent,\n} from \"@plasmicapp/host/registerComponent\";\nimport {\n default as registerGlobalContext,\n GlobalContextMeta,\n} from \"@plasmicapp/host/registerGlobalContext\";\nimport { default as registerToken } from \"@plasmicapp/host/registerToken\";\nimport React from \"react\";\n\nexport type Registerable = {\n registerComponent: typeof registerComponent;\n registerGlobalContext: typeof registerGlobalContext;\n registerToken: typeof registerToken;\n};\n\nexport function makeRegisterComponent<T extends React.ComponentType<any>>(\n component: T,\n meta: ComponentMeta<React.ComponentProps<T>>\n) {\n return function (loader?: Registerable) {\n registerComponentHelper(loader, component, meta);\n };\n}\n\nexport function makeRegisterGlobalContext<T extends React.ComponentType<any>>(\n component: T,\n meta: GlobalContextMeta<React.ComponentProps<T>>\n) {\n return function (loader?: Registerable) {\n if (loader) {\n loader.registerGlobalContext(component, meta);\n } else {\n registerGlobalContext(component, meta);\n }\n };\n}\n\nexport function registerComponentHelper<T extends React.ComponentType<any>>(\n loader: Registerable | undefined,\n component: T,\n meta: ComponentMeta<React.ComponentProps<T>>\n) {\n if (loader) {\n loader.registerComponent(component, meta);\n } else {\n registerComponent(component, meta);\n }\n}\n\ntype ReactElt = {\n children: ReactElt | ReactElt[];\n props: {\n children: ReactElt | ReactElt[];\n [prop: string]: any;\n } | null;\n type: React.ComponentType<any> | null;\n key: string | null;\n} | null;\n\nexport function traverseReactEltTree(\n children: React.ReactNode,\n callback: (elt: ReactElt) => void\n) {\n const rec = (elts: ReactElt | ReactElt[] | null) => {\n (Array.isArray(elts) ? elts : [elts]).forEach((elt) => {\n if (elt) {\n callback(elt);\n if (elt.children) {\n rec(elt.children);\n }\n if (elt.props?.children && elt.props.children !== elt.children) {\n rec(elt.props.children);\n }\n }\n });\n };\n rec(children as any);\n}\n\nexport function asArray<T>(x: T[] | T | undefined | null) {\n if (Array.isArray(x)) {\n return x;\n } else if (x == null) {\n return [];\n } else {\n return [x];\n }\n}\n","import { useEffect, useState } from \"react\";\nimport { baseOptions } from \"./simple-bar/SimpleBar\";\n\nexport const defaultColors = [\n \"rgba(255, 99, 132, 0.2)\",\n \"rgba(54, 162, 235, 0.2)\",\n \"rgba(255, 206, 86, 0.2)\",\n \"rgba(75, 192, 192, 0.2)\",\n \"rgba(153, 102, 255, 0.2)\",\n \"rgba(255, 159, 64, 0.2)\",\n];\n\nexport function useIsClient() {\n const [loaded, setLoaded] = useState(false);\n useEffect(() => {\n setLoaded(true);\n });\n return loaded;\n}\n\nexport interface BaseChartProps {\n className?: string;\n data?: Record<string, any>[];\n labelField?: string;\n interactive?: boolean;\n title?: string;\n chosenFields?: string[];\n scatterSeries?: { name: string; fields: [string, string] }[];\n}\n\nexport interface PrepDataOpts {\n isScatter?: boolean;\n preferNonNumericAsLabel?: boolean;\n extras?: (field: string) => {};\n opacity?: number;\n}\n\nexport function getDefaultColor(index: number, opacity = 0.2) {\n return defaultColors[index % defaultColors.length].replace(\n \"0.2\",\n \"\" + opacity\n );\n}\n\nexport function prepData(\n { data = [], labelField, chosenFields, scatterSeries }: BaseChartProps,\n { isScatter, preferNonNumericAsLabel, extras, opacity }: PrepDataOpts = {}\n) {\n const fields = Object.keys(data[0] ?? {});\n const isFieldAllNumericOrNil = new Map(\n fields.map((key) => [key, data.every((item) => !isNaN(item[key] ?? 0))])\n );\n const realLabelField =\n labelField ??\n (preferNonNumericAsLabel\n ? fields.find((field) => !isFieldAllNumericOrNil.get(field))\n : fields[0]);\n const numericFields = fields.filter((field) =>\n isFieldAllNumericOrNil.get(field)\n );\n if (isScatter) {\n scatterSeries = isScatter\n ? scatterSeries ?? [\n {\n name: `${numericFields[0]}-${numericFields[1]}`,\n fields: [numericFields[0], numericFields[1]] as [string, string],\n },\n ]\n : undefined;\n return {\n datasets: (scatterSeries ?? []).map((series, index) => ({\n ...extras?.(series.name),\n label: series.name,\n data: data.map((item) => ({\n x: item[series.fields[0]] ?? 0,\n y: item[series.fields[1]] ?? 0,\n })),\n backgroundColor: getDefaultColor(index, opacity),\n })),\n };\n } else {\n const autoChosenFields = numericFields.filter(\n (field) => field !== realLabelField\n );\n return {\n labels: realLabelField\n ? data.map((item) => item[realLabelField])\n : undefined,\n datasets: (chosenFields ?? autoChosenFields).map((key, index) => {\n return {\n ...extras?.(key),\n label: key,\n data: data.map((item) => item[key] ?? 0),\n backgroundColor: getDefaultColor(index, opacity),\n };\n }),\n };\n }\n}\n\n// additional styling\n\n/*\n elements: {\n bar: {\n borderWidth: 2,\n },\n },\n\n */\n\nexport function prepOptions({ interactive = true, title }: BaseChartProps) {\n return [\n baseOptions,\n interactive\n ? {\n interaction: {\n mode: \"index\" as const,\n intersect: false,\n },\n }\n : {},\n title ? { title: { display: true, text: title } } : {},\n ];\n}\n","import {\n BarElement,\n CategoryScale,\n Chart as ChartJS,\n Legend,\n LinearScale,\n Title,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Bar } from \"react-chartjs-2\";\nimport { BaseChartProps, prepData, prepOptions, useIsClient } from \"../common\";\n\nexport const baseOptions = {\n responsive: true,\n};\n\nexport const stackedOptions = {\n scales: {\n x: {\n stacked: true,\n },\n y: {\n stacked: true,\n },\n },\n};\n\nexport const vertOptions = {\n plugins: {\n legend: {\n position: \"top\" as const,\n },\n },\n};\nexport const horizOptions = {\n indexAxis: \"y\" as const,\n plugins: {\n legend: {\n position: \"right\" as const,\n },\n },\n};\n\nexport interface SimpleBarProps extends BaseChartProps {\n direction?: \"vertical\" | \"horizontal\";\n stacked?: boolean;\n}\n\nexport function SimpleBar(props: SimpleBarProps) {\n const { direction = \"vertical\", stacked, className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n CategoryScale,\n LinearScale,\n BarElement,\n Title,\n Tooltip,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, {\n preferNonNumericAsLabel: true,\n opacity: 0.5,\n });\n const options = prepOptions(props);\n return (\n <div className={className}>\n <Bar\n options={deepmerge.all([\n ...options,\n direction === \"vertical\" ? vertOptions : horizOptions,\n stacked ? stackedOptions : {},\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import {\n CategoryScale,\n Chart as ChartJS,\n Filler,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n Title,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Line } from \"react-chartjs-2\";\nimport { BaseChartProps, prepData, prepOptions, useIsClient } from \"../common\";\n\nexport interface SimpleLineProps extends BaseChartProps {\n fill?: boolean;\n secondAxisField?: string;\n}\n\nexport function SimpleLine(props: SimpleLineProps) {\n const { secondAxisField, fill, className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n CategoryScale,\n LinearScale,\n PointElement,\n LineElement,\n Title,\n Tooltip,\n Filler,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, {\n extras: (field) => ({\n fill,\n yAxisID: field === secondAxisField ? \"y1\" : \"y\",\n }),\n });\n const options = prepOptions(props);\n return (\n <div className={className}>\n <Line\n options={deepmerge.all([\n ...options,\n secondAxisField\n ? {\n scales: {\n y: {\n type: \"linear\" as const,\n display: true,\n position: \"left\" as const,\n },\n y1: {\n type: \"linear\" as const,\n display: true,\n position: \"right\" as const,\n grid: {\n drawOnChartArea: false,\n },\n },\n },\n }\n : {},\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import {\n Chart as ChartJS,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Scatter } from \"react-chartjs-2\";\nimport { BaseChartProps, prepData, prepOptions, useIsClient } from \"../common\";\n\nexport interface SimpleScatterProps extends BaseChartProps {}\n\nexport function SimpleScatter(props: SimpleScatterProps) {\n const { className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(LinearScale, PointElement, LineElement, Tooltip, Legend);\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, { isScatter: true, opacity: 1 });\n const options = prepOptions(props);\n console.log(\"!!\", normalized, options);\n return (\n <div className={className}>\n <Scatter\n options={deepmerge.all([\n ...options,\n {\n scales: {\n y: {\n beginAtZero: true,\n },\n },\n },\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import React, { ReactElement } from \"react\";\nimport { SimpleBar, SimpleBarProps } from \"../simple-bar/SimpleBar\";\nimport { SimpleLine, SimpleLineProps } from \"../simple-line/SimpleLine\";\nimport {\n SimpleScatter,\n SimpleScatterProps,\n} from \"../simple-scatter/SimpleScatter\";\n\nexport type SimpleChartProps = {\n type?: \"bar\" | \"line\" | \"scatter\";\n} & (SimpleBarProps | SimpleLineProps | SimpleScatterProps);\n\nexport function SimpleChart(props: SimpleChartProps): ReactElement {\n switch (props.type ?? \"bar\") {\n case \"bar\":\n return <SimpleBar {...(props as any)} />;\n case \"line\":\n return <SimpleLine {...(props as any)} />;\n case \"scatter\":\n return <SimpleScatter {...(props as any)} />;\n }\n}\n","import { ComponentMeta } from \"@plasmicapp/host/registerComponent\";\nimport { Registerable, registerComponentHelper } from \"../utils\";\nimport { SimpleChart, SimpleChartProps } from \"./SimpleChart\";\n\nexport * from \"./SimpleChart\";\nexport default SimpleChart;\n\nconst simpleChartMeta: ComponentMeta<SimpleChartProps> = {\n name: \"hostless-react-chartjs-2-simple-chart\",\n displayName: \"Chart\",\n props: {\n type: {\n type: \"choice\",\n options: [\n {\n value: \"bar\",\n label: \"Bar\",\n },\n {\n value: \"line\",\n label: \"Line\",\n },\n {\n value: \"scatter\",\n label: \"Scatter\",\n },\n ],\n defaultValueHint: \"bar\",\n },\n data: {\n type: \"exprEditor\" as any,\n description: \"The data as an array of objects\",\n defaultExpr: JSON.stringify([\n {\n region: \"APAC\",\n revenue: 3294,\n spend: 2675,\n },\n {\n region: \"EMEA\",\n revenue: 3245,\n spend: 3895,\n },\n {\n region: \"LATAM\",\n revenue: 2165,\n spend: 3498,\n },\n {\n region: \"AMER\",\n revenue: 3215,\n spend: 1656,\n },\n ]),\n },\n labelField: {\n type: \"choice\",\n hidden: (props) => props.type === \"scatter\",\n options: (props) => (props.data?.[0] ? Object.keys(props.data[0]) : []),\n },\n title: \"string\",\n fill: {\n type: \"boolean\",\n hidden: (props) => props.type !== \"line\",\n },\n // TODO\n // datasets: {\n // type: \"array\",\n // unstable__keyFunc: (x) => x.key,\n // unstable__minimalValue: (_props, ctx) => null,\n // itemType: {\n // type: \"object\",\n // fields: {\n // label: \"string\",\n // fieldId: \"string\",\n // hidden: {\n // type: \"boolean\",\n // },\n // },\n // },\n // },\n },\n\n defaultStyles: {\n width: \"stretch\",\n },\n\n importName: \"SimpleChart\",\n importPath: \"@plasmicpkgs/react-chartjs-2/dist/simple-chart/SimpleChart\",\n};\n\nexport function registerSimpleChart(loader?: Registerable) {\n registerComponentHelper(loader, SimpleChart, simpleChartMeta);\n}\n","import { registerSimpleChart } from \"./simple-chart\";\nimport { Registerable } from \"./utils\";\n\nexport function registerAll(loader?: Registerable) {\n registerSimpleChart(loader);\n}\n"],"names":["registerComponentHelper","loader","component","meta","registerComponent","defaultColors","useIsClient","useState","loaded","setLoaded","useEffect","getDefaultColor","index","opacity","length","replace","prepData","data","labelField","chosenFields","scatterSeries","isScatter","preferNonNumericAsLabel","extras","fields","Object","keys","isFieldAllNumericOrNil","Map","map","key","every","item","isNaN","realLabelField","find","field","get","numericFields","filter","name","undefined","datasets","series","label","x","y","backgroundColor","autoChosenFields","labels","prepOptions","interactive","title","baseOptions","interaction","mode","intersect","display","text","responsive","stackedOptions","scales","stacked","vertOptions","plugins","legend","position","horizOptions","indexAxis","SimpleBar","props","direction","className","isClient","ChartJS","register","CategoryScale","LinearScale","BarElement","Title","Tooltip","Legend","normalized","options","React","Bar","deepmerge","all","SimpleLine","secondAxisField","fill","PointElement","LineElement","Filler","yAxisID","Line","type","y1","grid","drawOnChartArea","SimpleScatter","console","log","Scatter","beginAtZero","SimpleChart","simpleChartMeta","displayName","value","defaultValueHint","description","defaultExpr","JSON","stringify","region","revenue","spend","hidden","defaultStyles","width","importName","importPath","registerSimpleChart","registerAll"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"react-chartjs-2.esm.js","sources":["../src/utils.ts","../src/common.ts","../src/simple-bar/SimpleBar.tsx","../src/simple-line/SimpleLine.tsx","../src/simple-scatter/SimpleScatter.tsx","../src/simple-chart/SimpleChart.tsx","../src/simple-chart/index.tsx","../src/index.tsx"],"sourcesContent":["import {\n ComponentMeta,\n default as registerComponent,\n} from \"@plasmicapp/host/registerComponent\";\nimport {\n default as registerGlobalContext,\n GlobalContextMeta,\n} from \"@plasmicapp/host/registerGlobalContext\";\nimport { default as registerToken } from \"@plasmicapp/host/registerToken\";\nimport React from \"react\";\n\nexport type Registerable = {\n registerComponent: typeof registerComponent;\n registerGlobalContext: typeof registerGlobalContext;\n registerToken: typeof registerToken;\n};\n\nexport function makeRegisterComponent<T extends React.ComponentType<any>>(\n component: T,\n meta: ComponentMeta<React.ComponentProps<T>>\n) {\n return function (loader?: Registerable) {\n registerComponentHelper(loader, component, meta);\n };\n}\n\nexport function makeRegisterGlobalContext<T extends React.ComponentType<any>>(\n component: T,\n meta: GlobalContextMeta<React.ComponentProps<T>>\n) {\n return function (loader?: Registerable) {\n if (loader) {\n loader.registerGlobalContext(component, meta);\n } else {\n registerGlobalContext(component, meta);\n }\n };\n}\n\nexport function registerComponentHelper<T extends React.ComponentType<any>>(\n loader: Registerable | undefined,\n component: T,\n meta: ComponentMeta<React.ComponentProps<T>>\n) {\n if (loader) {\n loader.registerComponent(component, meta);\n } else {\n registerComponent(component, meta);\n }\n}\n\ntype ReactElt = {\n children: ReactElt | ReactElt[];\n props: {\n children: ReactElt | ReactElt[];\n [prop: string]: any;\n } | null;\n type: React.ComponentType<any> | null;\n key: string | null;\n} | null;\n\nexport function traverseReactEltTree(\n children: React.ReactNode,\n callback: (elt: ReactElt) => void\n) {\n const rec = (elts: ReactElt | ReactElt[] | null) => {\n (Array.isArray(elts) ? elts : [elts]).forEach((elt) => {\n if (elt) {\n callback(elt);\n if (elt.children) {\n rec(elt.children);\n }\n if (elt.props?.children && elt.props.children !== elt.children) {\n rec(elt.props.children);\n }\n }\n });\n };\n rec(children as any);\n}\n\nexport function asArray<T>(x: T[] | T | undefined | null) {\n if (Array.isArray(x)) {\n return x;\n } else if (x == null) {\n return [];\n } else {\n return [x];\n }\n}\n","import { Plugin } from \"chart.js/dist/types\";\nimport { useEffect, useState } from \"react\";\n\nexport const baseOptions = {\n responsive: true,\n chartArea: {\n // backgroundColor: \"#f8fafc\",\n },\n};\n\n/**\n * These are hand-picked from the Tailwind palette.\n */\nexport const defaultColors = [\n \"hsla(25,95%,53%,1.0)\",\n \"hsla(38,92%,50%,1.0)\",\n \"hsla(45,93%,47%,1.0)\",\n \"hsla(84,81%,44%,1.0)\",\n \"hsla(142,71%,45%,1.0)\",\n \"hsla(160,84%,39%,1.0)\",\n \"hsla(173,80%,40%,1.0)\",\n \"hsla(199,89%,48%,1.0)\",\n \"hsla(217,91%,60%,1.0)\",\n \"hsla(239,84%,67%,1.0)\",\n \"hsla(258,90%,66%,1.0)\",\n \"hsla(271,91%,65%,1.0)\",\n \"hsla(292,84%,61%,1.0)\",\n \"hsla(293,69%,49%,1.0)\",\n \"hsla(295,72%,40%,1.0)\",\n \"hsla(295,70%,33%,1.0)\",\n];\n\nexport function useIsClient() {\n const [loaded, setLoaded] = useState(false);\n useEffect(() => {\n setLoaded(true);\n });\n return loaded;\n}\n\nexport interface BaseChartProps {\n className?: string;\n data?: Record<string, any>[];\n labelField?: string;\n interactive?: boolean;\n title?: string;\n chosenFields?: string[];\n scatterSeries?: { name: string; fields: [string, string] }[];\n}\n\nexport interface PrepDataOpts {\n isScatter?: boolean;\n preferNonNumericAsLabel?: boolean;\n extras?: (field: string) => {};\n opacity?: number;\n}\n\nfunction range(total: number) {\n return Array.from(Array(total).keys());\n}\n\n/**\n * Returns a color from the default color palette.\n *\n * Tries to pick \"different\" colors that are somewhat spread out on the palette. With a higher 'total' colors requested, the colors will be packed more closely together.\n *\n * We prefer starting from blue when possible. This only starts getting pushed down toward yellow if too many colors requested.\n *\n * If too many colors are requested, it will recycle.\n */\nexport function getDefaultColor(\n index: number,\n total: number,\n opacity?: number\n) {\n const preferredStart = 7;\n const end = defaultColors.length - 1;\n const start = Math.max(0, Math.min(preferredStart, end - total));\n const stops =\n total > defaultColors.length\n ? range(defaultColors.length)\n : range(total).map((_, i) =>\n Math.round(start + ((1.0 * i) / (total - 1)) * (end - start))\n );\n const selected = defaultColors[stops[index % stops.length]];\n if (opacity === undefined) {\n return selected;\n }\n return selected.replace(\"1.0\", \"\" + opacity);\n}\n\nexport function prepData(\n { data = [], labelField, chosenFields, scatterSeries }: BaseChartProps,\n { isScatter, preferNonNumericAsLabel, extras, opacity }: PrepDataOpts = {}\n) {\n const fields = Object.keys(data[0] ?? {});\n const isFieldAllNumericOrNil = new Map(\n fields.map((key) => [key, data.every((item) => !isNaN(item[key] ?? 0))])\n );\n const realLabelField =\n labelField ??\n (preferNonNumericAsLabel\n ? fields.find((field) => !isFieldAllNumericOrNil.get(field))\n : fields[0]);\n const numericFields = fields.filter((field) =>\n isFieldAllNumericOrNil.get(field)\n );\n if (isScatter) {\n scatterSeries = isScatter\n ? scatterSeries ?? [\n {\n name: `${numericFields[0]}-${numericFields[1]}`,\n fields: [numericFields[0], numericFields[1]] as [string, string],\n },\n ]\n : undefined;\n return {\n datasets: (scatterSeries ?? []).map((series, index) => ({\n ...extras?.(series.name),\n label: series.name,\n data: data.map((item) => ({\n x: item[series.fields[0]] ?? 0,\n y: item[series.fields[1]] ?? 0,\n })),\n backgroundColor: getDefaultColor(\n index,\n (scatterSeries ?? []).length,\n opacity\n ),\n })),\n };\n } else {\n const autoChosenFields = numericFields.filter(\n (field) => field !== realLabelField\n );\n return {\n labels: realLabelField\n ? data.map((item) => item[realLabelField])\n : undefined,\n datasets: (chosenFields ?? autoChosenFields).map((key, index) => {\n return {\n ...extras?.(key),\n label: key,\n data: data.map((item) => item[key] ?? 0),\n backgroundColor: getDefaultColor(\n index,\n (chosenFields ?? autoChosenFields).length,\n 1\n ),\n borderWidth: 2,\n borderColor: getDefaultColor(\n index,\n (chosenFields ?? autoChosenFields).length,\n 1\n ),\n };\n }),\n };\n }\n}\n\n// additional styling\n\n/*\n elements: {\n bar: {\n borderWidth: 2,\n },\n },\n\n */\n\nexport function prepOptions({ interactive = true, title }: BaseChartProps) {\n return [\n baseOptions,\n interactive\n ? {\n interaction: {\n mode: \"index\" as const,\n intersect: false,\n },\n }\n : {},\n title ? { title: { display: true, text: title } } : {},\n ];\n}\n\nexport const ChartAreaPlugin: Plugin = {\n id: \"chartAreaPlugin\",\n // eslint-disable-next-line object-shorthand\n beforeDraw: (chart) => {\n const chartAreaOptions = (chart.config.options as any).chartArea;\n if (chartAreaOptions && chartAreaOptions.backgroundColor) {\n const ctx = chart.canvas.getContext(\"2d\");\n const { chartArea } = chart;\n if (ctx) {\n ctx.save();\n ctx.fillStyle = chartAreaOptions.backgroundColor;\n // eslint-disable-next-line max-len\n ctx.fillRect(\n chartArea.left,\n chartArea.top,\n chartArea.right - chartArea.left,\n chartArea.bottom - chartArea.top\n );\n ctx.restore();\n }\n }\n },\n};\n","import {\n BarElement,\n CategoryScale,\n Chart as ChartJS,\n Legend,\n LinearScale,\n Title,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Bar } from \"react-chartjs-2\";\nimport {\n BaseChartProps,\n ChartAreaPlugin,\n prepData,\n prepOptions,\n useIsClient,\n} from \"../common\";\n\nexport const stackedOptions = {\n scales: {\n x: {\n stacked: true,\n ticks: {\n major: {\n enabled: false,\n },\n },\n },\n y: {\n stacked: true,\n },\n },\n};\n\nexport const vertOptions = {\n plugins: {\n legend: {\n position: \"top\" as const,\n },\n },\n};\nexport const horizOptions = {\n indexAxis: \"y\" as const,\n plugins: {\n legend: {\n position: \"right\" as const,\n },\n },\n};\n\nexport interface SimpleBarProps extends BaseChartProps {\n direction?: \"vertical\" | \"horizontal\";\n stacked?: boolean;\n}\n\nexport function SimpleBar(props: SimpleBarProps) {\n const { direction = \"vertical\", stacked, className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n ChartAreaPlugin,\n CategoryScale,\n LinearScale,\n BarElement,\n Title,\n Tooltip,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, {\n preferNonNumericAsLabel: true,\n opacity: 1,\n });\n const options = prepOptions(props);\n return (\n <div className={className}>\n <Bar\n options={deepmerge.all([\n ...options,\n direction === \"vertical\" ? vertOptions : horizOptions,\n stacked ? stackedOptions : {},\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import {\n CategoryScale,\n Chart as ChartJS,\n Filler,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n Title,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Line } from \"react-chartjs-2\";\nimport {\n BaseChartProps,\n ChartAreaPlugin,\n prepData,\n prepOptions,\n useIsClient,\n} from \"../common\";\n\nexport interface SimpleLineProps extends BaseChartProps {\n fill?: boolean;\n secondAxisField?: string;\n}\n\nexport function SimpleLine(props: SimpleLineProps) {\n const { secondAxisField, fill, className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n ChartAreaPlugin,\n CategoryScale,\n LinearScale,\n PointElement,\n LineElement,\n Title,\n Tooltip,\n Filler,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, {\n extras: (field) => ({\n fill,\n pointRadius: 0,\n yAxisID: field === secondAxisField ? \"y1\" : \"y\",\n }),\n });\n const options = prepOptions(props);\n return (\n <div className={className}>\n <Line\n options={deepmerge.all([\n ...options,\n secondAxisField\n ? {\n scales: {\n y: {\n type: \"linear\" as const,\n display: true,\n position: \"left\" as const,\n },\n y1: {\n type: \"linear\" as const,\n display: true,\n position: \"right\" as const,\n grid: {\n drawOnChartArea: false,\n },\n },\n },\n }\n : {},\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import {\n Chart as ChartJS,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n Tooltip,\n} from \"chart.js\";\nimport deepmerge from \"deepmerge\";\nimport React, { useEffect } from \"react\";\nimport { Scatter } from \"react-chartjs-2\";\nimport {\n BaseChartProps,\n ChartAreaPlugin,\n prepData,\n prepOptions,\n useIsClient,\n} from \"../common\";\n\nexport interface SimpleScatterProps extends BaseChartProps {}\n\nexport function SimpleScatter(props: SimpleScatterProps) {\n const { className } = props;\n const isClient = useIsClient();\n useEffect(() => {\n ChartJS.register(\n ChartAreaPlugin,\n LinearScale,\n PointElement,\n LineElement,\n Tooltip,\n Legend\n );\n }, []);\n if (!isClient) {\n return null;\n }\n const normalized = prepData(props, { isScatter: true, opacity: 1 });\n const options = prepOptions(props);\n console.log(\"!!\", normalized, options);\n return (\n <div className={className}>\n <Scatter\n options={deepmerge.all([\n ...options,\n {\n scales: {\n y: {\n beginAtZero: true,\n },\n },\n },\n ])}\n data={normalized}\n />\n </div>\n );\n}\n","import React, { ReactElement } from \"react\";\nimport { SimpleBar, SimpleBarProps } from \"../simple-bar/SimpleBar\";\nimport { SimpleLine, SimpleLineProps } from \"../simple-line/SimpleLine\";\nimport {\n SimpleScatter,\n SimpleScatterProps,\n} from \"../simple-scatter/SimpleScatter\";\n\nexport type SimpleChartProps = {\n type?: \"bar\" | \"line\" | \"scatter\";\n} & (SimpleBarProps | SimpleLineProps | SimpleScatterProps);\n\nexport function SimpleChart(props: SimpleChartProps): ReactElement {\n switch (props.type ?? \"bar\") {\n case \"bar\":\n return <SimpleBar {...(props as any)} />;\n case \"line\":\n return <SimpleLine {...(props as any)} />;\n case \"scatter\":\n return <SimpleScatter {...(props as any)} />;\n }\n}\n","import { ComponentMeta } from \"@plasmicapp/host/registerComponent\";\nimport { Registerable, registerComponentHelper } from \"../utils\";\nimport { SimpleChart, SimpleChartProps } from \"./SimpleChart\";\n\nexport * from \"./SimpleChart\";\nexport default SimpleChart;\n\nconst simpleChartMeta: ComponentMeta<SimpleChartProps> = {\n name: \"hostless-react-chartjs-2-simple-chart\",\n displayName: \"Chart\",\n props: {\n type: {\n type: \"choice\",\n options: [\n {\n value: \"bar\",\n label: \"Bar\",\n },\n {\n value: \"line\",\n label: \"Line\",\n },\n {\n value: \"scatter\",\n label: \"Scatter\",\n },\n ],\n defaultValueHint: \"bar\",\n },\n data: {\n type: \"exprEditor\" as any,\n description: \"The data as an array of objects\",\n defaultExpr: JSON.stringify([\n {\n region: \"APAC\",\n revenue: 3294,\n spend: 2675,\n },\n {\n region: \"EMEA\",\n revenue: 3245,\n spend: 3895,\n },\n {\n region: \"LATAM\",\n revenue: 2165,\n spend: 3498,\n },\n {\n region: \"AMER\",\n revenue: 3215,\n spend: 1656,\n },\n ]),\n },\n labelField: {\n type: \"choice\",\n hidden: (props) => props.type === \"scatter\",\n options: (props) => (props.data?.[0] ? Object.keys(props.data[0]) : []),\n },\n title: \"string\",\n fill: {\n type: \"boolean\",\n hidden: (props) => props.type !== \"line\",\n },\n // TODO\n // datasets: {\n // type: \"array\",\n // unstable__keyFunc: (x) => x.key,\n // unstable__minimalValue: (_props, ctx) => null,\n // itemType: {\n // type: \"object\",\n // fields: {\n // label: \"string\",\n // fieldId: \"string\",\n // hidden: {\n // type: \"boolean\",\n // },\n // },\n // },\n // },\n },\n\n defaultStyles: {\n width: \"stretch\",\n },\n\n importName: \"SimpleChart\",\n importPath: \"@plasmicpkgs/react-chartjs-2/dist/simple-chart/SimpleChart\",\n};\n\nexport function registerSimpleChart(loader?: Registerable) {\n registerComponentHelper(loader, SimpleChart, simpleChartMeta);\n}\n","import { registerSimpleChart } from \"./simple-chart\";\nimport { Registerable } from \"./utils\";\n\nexport function registerAll(loader?: Registerable) {\n registerSimpleChart(loader);\n}\n"],"names":["registerComponentHelper","loader","component","meta","registerComponent","baseOptions","responsive","chartArea","defaultColors","useIsClient","useState","loaded","setLoaded","useEffect","range","total","Array","from","keys","getDefaultColor","index","opacity","preferredStart","end","length","start","Math","max","min","stops","map","_","i","round","selected","undefined","replace","prepData","data","labelField","chosenFields","scatterSeries","isScatter","preferNonNumericAsLabel","extras","fields","Object","isFieldAllNumericOrNil","Map","key","every","item","isNaN","realLabelField","find","field","get","numericFields","filter","name","datasets","series","label","x","y","backgroundColor","autoChosenFields","labels","borderWidth","borderColor","prepOptions","interactive","title","interaction","mode","intersect","display","text","ChartAreaPlugin","id","beforeDraw","chart","chartAreaOptions","config","options","ctx","canvas","getContext","save","fillStyle","fillRect","left","top","right","bottom","restore","stackedOptions","scales","stacked","ticks","major","enabled","vertOptions","plugins","legend","position","horizOptions","indexAxis","SimpleBar","props","direction","className","isClient","ChartJS","register","CategoryScale","LinearScale","BarElement","Title","Tooltip","Legend","normalized","React","Bar","deepmerge","all","SimpleLine","secondAxisField","fill","PointElement","LineElement","Filler","pointRadius","yAxisID","Line","type","y1","grid","drawOnChartArea","SimpleScatter","console","log","Scatter","beginAtZero","SimpleChart","simpleChartMeta","displayName","value","defaultValueHint","description","defaultExpr","JSON","stringify","region","revenue","spend","hidden","defaultStyles","width","importName","importPath","registerSimpleChart","registerAll"],"mappings":"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"}
|
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { BaseChartProps } from "../common";
|
|
3
|
-
export declare const baseOptions: {
|
|
4
|
-
responsive: boolean;
|
|
5
|
-
};
|
|
6
3
|
export declare const stackedOptions: {
|
|
7
4
|
scales: {
|
|
8
5
|
x: {
|
|
9
6
|
stacked: boolean;
|
|
7
|
+
ticks: {
|
|
8
|
+
major: {
|
|
9
|
+
enabled: boolean;
|
|
10
|
+
};
|
|
11
|
+
};
|
|
10
12
|
};
|
|
11
13
|
y: {
|
|
12
14
|
stacked: boolean;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@plasmicpkgs/react-chartjs-2",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.3",
|
|
4
4
|
"description": "Chart.js 2.x components for React",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -28,8 +28,8 @@
|
|
|
28
28
|
"analyze": "size-limit --why"
|
|
29
29
|
},
|
|
30
30
|
"devDependencies": {
|
|
31
|
-
"@plasmicapp/data-sources": "0.1.
|
|
32
|
-
"@plasmicapp/host": "1.0.
|
|
31
|
+
"@plasmicapp/data-sources": "0.1.61",
|
|
32
|
+
"@plasmicapp/host": "1.0.123",
|
|
33
33
|
"@size-limit/preset-small-lib": "^4.11.0",
|
|
34
34
|
"@types/node": "^14.0.26",
|
|
35
35
|
"chart.js": "^4.2.1",
|
|
@@ -42,7 +42,9 @@
|
|
|
42
42
|
"peerDependencies": {
|
|
43
43
|
"@plasmicapp/data-sources": ">=0.1.52",
|
|
44
44
|
"@plasmicapp/host": ">=1.0.0",
|
|
45
|
+
"chart.js": ">=4.2.1",
|
|
45
46
|
"react": ">=16.8.0",
|
|
47
|
+
"react-chartjs-2": ">=5.2.0",
|
|
46
48
|
"react-dom": ">=16.8.0"
|
|
47
49
|
},
|
|
48
50
|
"publishConfig": {
|
|
@@ -51,5 +53,5 @@
|
|
|
51
53
|
"dependencies": {
|
|
52
54
|
"deepmerge": "^4.3.1"
|
|
53
55
|
},
|
|
54
|
-
"gitHead": "
|
|
56
|
+
"gitHead": "0edb216f831947b2f9d02daf62262258f2c2c68c"
|
|
55
57
|
}
|