@plasmicpkgs/react-chartjs-2 1.0.1

package/LICENSE.md

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2021 Plasmic
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/README.md

@@ -0,0 +1 @@
+Chart.js 2.x components for React

package/dist/common.d.ts

@@ -0,0 +1,57 @@
+export declare const defaultColors: string[];
+export declare function useIsClient(): boolean;
+export interface BaseChartProps {
+    className?: string;
+    data?: Record<string, any>[];
+    labelField?: string;
+    interactive?: boolean;
+    title?: string;
+    chosenFields?: string[];
+    scatterSeries?: {
+        name: string;
+        fields: [string, string];
+    }[];
+}
+export interface PrepDataOpts {
+    isScatter?: boolean;
+    preferNonNumericAsLabel?: boolean;
+    extras?: (field: string) => {};
+    opacity?: number;
+}
+export declare function getDefaultColor(index: number, opacity?: number): string;
+export declare function prepData({ data, labelField, chosenFields, scatterSeries }: BaseChartProps, { isScatter, preferNonNumericAsLabel, extras, opacity }?: PrepDataOpts): {
+    datasets: {
+        label: string;
+        data: {
+            x: any;
+            y: any;
+        }[];
+        backgroundColor: string;
+    }[];
+    labels?: undefined;
+} | {
+    labels: any[] | undefined;
+    datasets: {
+        label: string;
+        data: any[];
+        backgroundColor: string;
+    }[];
+};
+export declare function prepOptions({ interactive, title }: BaseChartProps): ({
+    responsive: boolean;
+} | {
+    interaction: {
+        mode: "index";
+        intersect: boolean;
+    };
+    title?: undefined;
+} | {
+    interaction?: undefined;
+    title?: undefined;
+} | {
+    title: {
+        display: boolean;
+        text: string;
+    };
+    interaction?: undefined;
+})[];

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+import { Registerable } from "./utils";
+export declare function registerAll(loader?: Registerable): void;

package/dist/index.js

@@ -0,0 +1,8 @@
+
+'use strict'
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./react-chartjs-2.cjs.production.min.js')
+} else {
+  module.exports = require('./react-chartjs-2.cjs.development.js')
+}

package/dist/react-chartjs-2.cjs.development.js

@@ -0,0 +1,357 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
+
+var registerComponent = _interopDefault(require('@plasmicapp/host/registerComponent'));
+require('@plasmicapp/host/registerGlobalContext');
+var React = require('react');
+var React__default = _interopDefault(React);
+var chart_js = require('chart.js');
+var deepmerge = _interopDefault(require('deepmerge'));
+var reactChartjs2 = require('react-chartjs-2');
+
+function registerComponentHelper(loader, component, meta) {
+  if (loader) {
+    loader.registerComponent(component, meta);
+  } else {
+    registerComponent(component, meta);
+  }
+}
+
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+
+var defaultColors = ["rgba(255, 99, 132, 0.2)", "rgba(54, 162, 235, 0.2)", "rgba(255, 206, 86, 0.2)", "rgba(75, 192, 192, 0.2)", "rgba(153, 102, 255, 0.2)", "rgba(255, 159, 64, 0.2)"];
+function useIsClient() {
+  var _useState = React.useState(false),
+    loaded = _useState[0],
+    setLoaded = _useState[1];
+  React.useEffect(function () {
+    setLoaded(true);
+  });
+  return loaded;
+}
+function getDefaultColor(index, opacity) {
+  if (opacity === void 0) {
+    opacity = 0.2;
+  }
+  return defaultColors[index % defaultColors.length].replace("0.2", "" + opacity);
+}
+function prepData(_ref, _temp) {
+  var _data$;
+  var _ref$data = _ref.data,
+    data = _ref$data === void 0 ? [] : _ref$data,
+    labelField = _ref.labelField,
+    chosenFields = _ref.chosenFields,
+    scatterSeries = _ref.scatterSeries;
+  var _ref2 = _temp === void 0 ? {} : _temp,
+    isScatter = _ref2.isScatter,
+    preferNonNumericAsLabel = _ref2.preferNonNumericAsLabel,
+    extras = _ref2.extras,
+    opacity = _ref2.opacity;
+  var fields = Object.keys((_data$ = data[0]) != null ? _data$ : {});
+  var isFieldAllNumericOrNil = new Map(fields.map(function (key) {
+    return [key, data.every(function (item) {
+      var _item$key;
+      return !isNaN((_item$key = item[key]) != null ? _item$key : 0);
+    })];
+  }));
+  var realLabelField = labelField != null ? labelField : preferNonNumericAsLabel ? fields.find(function (field) {
+    return !isFieldAllNumericOrNil.get(field);
+  }) : fields[0];
+  var numericFields = fields.filter(function (field) {
+    return isFieldAllNumericOrNil.get(field);
+  });
+  if (isScatter) {
+    var _scatterSeries, _scatterSeries2;
+    scatterSeries = isScatter ? (_scatterSeries = scatterSeries) != null ? _scatterSeries : [{
+      name: numericFields[0] + "-" + numericFields[1],
+      fields: [numericFields[0], numericFields[1]]
+    }] : undefined;
+    return {
+      datasets: ((_scatterSeries2 = scatterSeries) != null ? _scatterSeries2 : []).map(function (series, index) {
+        return _extends({}, extras == null ? void 0 : extras(series.name), {
+          label: series.name,
+          data: data.map(function (item) {
+            var _item$series$fields$, _item$series$fields$2;
+            return {
+              x: (_item$series$fields$ = item[series.fields[0]]) != null ? _item$series$fields$ : 0,
+              y: (_item$series$fields$2 = item[series.fields[1]]) != null ? _item$series$fields$2 : 0
+            };
+          }),
+          backgroundColor: getDefaultColor(index, opacity)
+        });
+      })
+    };
+  } else {
+    var autoChosenFields = numericFields.filter(function (field) {
+      return field !== realLabelField;
+    });
+    return {
+      labels: realLabelField ? data.map(function (item) {
+        return item[realLabelField];
+      }) : undefined,
+      datasets: (chosenFields != null ? chosenFields : autoChosenFields).map(function (key, index) {
+        return _extends({}, extras == null ? void 0 : extras(key), {
+          label: key,
+          data: data.map(function (item) {
+            var _item$key2;
+            return (_item$key2 = item[key]) != null ? _item$key2 : 0;
+          }),
+          backgroundColor: getDefaultColor(index, opacity)
+        });
+      })
+    };
+  }
+}
+// additional styling
+/*
+  elements: {
+    bar: {
+      borderWidth: 2,
+    },
+  },
+
+ */
+function prepOptions(_ref3) {
+  var _ref3$interactive = _ref3.interactive,
+    interactive = _ref3$interactive === void 0 ? true : _ref3$interactive,
+    title = _ref3.title;
+  return [baseOptions, interactive ? {
+    interaction: {
+      mode: "index",
+      intersect: false
+    }
+  } : {}, title ? {
+    title: {
+      display: true,
+      text: title
+    }
+  } : {}];
+}
+
+var baseOptions = {
+  responsive: true
+};
+var stackedOptions = {
+  scales: {
+    x: {
+      stacked: true
+    },
+    y: {
+      stacked: true
+    }
+  }
+};
+var vertOptions = {
+  plugins: {
+    legend: {
+      position: "top"
+    }
+  }
+};
+var horizOptions = {
+  indexAxis: "y",
+  plugins: {
+    legend: {
+      position: "right"
+    }
+  }
+};
+function SimpleBar(props) {
+  var _props$direction = props.direction,
+    direction = _props$direction === void 0 ? "vertical" : _props$direction,
+    stacked = props.stacked,
+    className = props.className;
+  var isClient = useIsClient();
+  React.useEffect(function () {
+    chart_js.Chart.register(chart_js.CategoryScale, chart_js.LinearScale, chart_js.BarElement, chart_js.Title, chart_js.Tooltip, chart_js.Legend);
+  }, []);
+  if (!isClient) {
+    return null;
+  }
+  var normalized = prepData(props, {
+    preferNonNumericAsLabel: true,
+    opacity: 0.5
+  });
+  var options = prepOptions(props);
+  return React__default.createElement("div", {
+    className: className
+  }, React__default.createElement(reactChartjs2.Bar, {
+    options: deepmerge.all([].concat(options, [direction === "vertical" ? vertOptions : horizOptions, stacked ? stackedOptions : {}])),
+    data: normalized
+  }));
+}
+
+function SimpleLine(props) {
+  var secondAxisField = props.secondAxisField,
+    fill = props.fill,
+    className = props.className;
+  var isClient = useIsClient();
+  React.useEffect(function () {
+    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);
+  }, []);
+  if (!isClient) {
+    return null;
+  }
+  var normalized = prepData(props, {
+    extras: function extras(field) {
+      return {
+        fill: fill,
+        yAxisID: field === secondAxisField ? "y1" : "y"
+      };
+    }
+  });
+  var options = prepOptions(props);
+  return React__default.createElement("div", {
+    className: className
+  }, React__default.createElement(reactChartjs2.Line, {
+    options: deepmerge.all([].concat(options, [secondAxisField ? {
+      scales: {
+        y: {
+          type: "linear",
+          display: true,
+          position: "left"
+        },
+        y1: {
+          type: "linear",
+          display: true,
+          position: "right",
+          grid: {
+            drawOnChartArea: false
+          }
+        }
+      }
+    } : {}])),
+    data: normalized
+  }));
+}
+
+function SimpleScatter(props) {
+  var className = props.className;
+  var isClient = useIsClient();
+  React.useEffect(function () {
+    chart_js.Chart.register(chart_js.LinearScale, chart_js.PointElement, chart_js.LineElement, chart_js.Tooltip, chart_js.Legend);
+  }, []);
+  if (!isClient) {
+    return null;
+  }
+  var normalized = prepData(props, {
+    isScatter: true,
+    opacity: 1
+  });
+  var options = prepOptions(props);
+  console.log("!!", normalized, options);
+  return React__default.createElement("div", {
+    className: className
+  }, React__default.createElement(reactChartjs2.Scatter, {
+    options: deepmerge.all([].concat(options, [{
+      scales: {
+        y: {
+          beginAtZero: true
+        }
+      }
+    }])),
+    data: normalized
+  }));
+}
+
+function SimpleChart(props) {
+  var _props$type;
+  switch ((_props$type = props.type) != null ? _props$type : "bar") {
+    case "bar":
+      return React__default.createElement(SimpleBar, Object.assign({}, props));
+    case "line":
+      return React__default.createElement(SimpleLine, Object.assign({}, props));
+    case "scatter":
+      return React__default.createElement(SimpleScatter, Object.assign({}, props));
+  }
+}
+
+var simpleChartMeta = {
+  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: /*#__PURE__*/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 hidden(props) {
+        return props.type === "scatter";
+      },
+      options: function options(props) {
+        var _props$data;
+        return (_props$data = props.data) != null && _props$data[0] ? Object.keys(props.data[0]) : [];
+      }
+    },
+    title: "string",
+    fill: {
+      type: "boolean",
+      hidden: function hidden(props) {
+        return props.type !== "line";
+      }
+    }
+  },
+  defaultStyles: {
+    width: "stretch"
+  },
+  importName: "SimpleChart",
+  importPath: "@plasmicpkgs/react-chartjs-2/dist/simple-chart/SimpleChart"
+};
+function registerSimpleChart(loader) {
+  registerComponentHelper(loader, SimpleChart, simpleChartMeta);
+}
+
+function registerAll(loader) {
+  registerSimpleChart(loader);
+}
+
+exports.registerAll = registerAll;
+//# sourceMappingURL=react-chartjs-2.cjs.development.js.map

package/dist/react-chartjs-2.cjs.development.js.map

@@ -0,0 +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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"}

package/dist/react-chartjs-2.cjs.production.min.js

@@ -0,0 +1,2 @@
+"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"),i=e(require("deepmerge")),l=require("react-chartjs-2");function c(){return(c=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 o=["rgba(255, 99, 132, 0.2)","rgba(54, 162, 235, 0.2)","rgba(255, 206, 86, 0.2)","rgba(75, 192, 192, 0.2)","rgba(153, 102, 255, 0.2)","rgba(255, 159, 64, 0.2)"];function s(){var e=r.useState(!1),t=e[0],n=e[1];return r.useEffect((function(){n(!0)})),t}function u(e,t){return void 0===t&&(t=.2),o[e%o.length].replace("0.2",""+t)}function p(e,t){var r,n,a,i=e.data,l=void 0===i?[]:i,o=e.labelField,s=e.chosenFields,p=e.scatterSeries,d=void 0===t?{}:t,f=d.isScatter,v=d.preferNonNumericAsLabel,m=d.extras,g=d.opacity,y=Object.keys(null!=(r=l[0])?r:{}),b=new Map(y.map((function(e){return[e,l.every((function(t){var r;return!isNaN(null!=(r=t[e])?r:0)}))]}))),h=null!=o?o:v?y.find((function(e){return!b.get(e)})):y[0],E=y.filter((function(e){return b.get(e)}));if(f)return{datasets:(null!=(a=p=f?null!=(n=p)?n:[{name:E[0]+"-"+E[1],fields:[E[0],E[1]]}]:void 0)?a:[]).map((function(e,t){return c({},null==m?void 0:m(e.name),{label:e.name,data:l.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:u(t,g)})}))};var j=E.filter((function(e){return e!==h}));return{labels:h?l.map((function(e){return e[h]})):void 0,datasets:(null!=s?s:j).map((function(e,t){return c({},null==m?void 0:m(e),{label:e,data:l.map((function(t){var r;return null!=(r=t[e])?r:0})),backgroundColor:u(t,g)})}))}}function d(e){var t=e.interactive,r=e.title;return[f,void 0===t||t?{interaction:{mode:"index",intersect:!1}}:{},r?{title:{display:!0,text:r}}:{}]}var f={responsive:!0},v={scales:{x:{stacked:!0},y:{stacked:!0}}},m={plugins:{legend:{position:"top"}}},g={indexAxis:"y",plugins:{legend:{position:"right"}}};function y(e){var t=e.direction,c=void 0===t?"vertical":t,o=e.stacked,u=e.className,f=s();if(r.useEffect((function(){a.Chart.register(a.CategoryScale,a.LinearScale,a.BarElement,a.Title,a.Tooltip,a.Legend)}),[]),!f)return null;var y=p(e,{preferNonNumericAsLabel:!0,opacity:.5}),b=d(e);return n.createElement("div",{className:u},n.createElement(l.Bar,{options:i.all([].concat(b,["vertical"===c?m:g,o?v:{}])),data:y}))}function b(e){var t=e.secondAxisField,c=e.fill,o=e.className,u=s();if(r.useEffect((function(){a.Chart.register(a.CategoryScale,a.LinearScale,a.PointElement,a.LineElement,a.Title,a.Tooltip,a.Filler,a.Legend)}),[]),!u)return null;var f=p(e,{extras:function(e){return{fill:c,yAxisID:e===t?"y1":"y"}}}),v=d(e);return n.createElement("div",{className:o},n.createElement(l.Line,{options:i.all([].concat(v,[t?{scales:{y:{type:"linear",display:!0,position:"left"},y1:{type:"linear",display:!0,position:"right",grid:{drawOnChartArea:!1}}}}:{}])),data:f}))}function h(e){var t=e.className,c=s();if(r.useEffect((function(){a.Chart.register(a.LinearScale,a.PointElement,a.LineElement,a.Tooltip,a.Legend)}),[]),!c)return null;var o=p(e,{isScatter:!0,opacity:1}),u=d(e);return console.log("!!",o,u),n.createElement("div",{className:t},n.createElement(l.Scatter,{options:i.all([].concat(u,[{scales:{y:{beginAtZero:!0}}}])),data:o}))}function E(e){var t;switch(null!=(t=e.type)?t:"bar"){case"bar":return n.createElement(y,Object.assign({},e));case"line":return n.createElement(b,Object.assign({},e));case"scatter":return n.createElement(h,Object.assign({},e))}}var j={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,E,j)}(e)};
+//# sourceMappingURL=react-chartjs-2.cjs.production.min.js.map

package/dist/react-chartjs-2.cjs.production.min.js.map

@@ -0,0 +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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"}

package/dist/react-chartjs-2.esm.js

@@ -0,0 +1,350 @@
+import registerComponent from '@plasmicapp/host/registerComponent';
+import '@plasmicapp/host/registerGlobalContext';
+import React, { useState, useEffect } from 'react';
+import { Chart, CategoryScale, LinearScale, BarElement, Title, Tooltip, Legend, PointElement, LineElement, Filler } from 'chart.js';
+import deepmerge from 'deepmerge';
+import { Bar, Line, Scatter } from 'react-chartjs-2';
+
+function registerComponentHelper(loader, component, meta) {
+  if (loader) {
+    loader.registerComponent(component, meta);
+  } else {
+    registerComponent(component, meta);
+  }
+}
+
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+
+var defaultColors = ["rgba(255, 99, 132, 0.2)", "rgba(54, 162, 235, 0.2)", "rgba(255, 206, 86, 0.2)", "rgba(75, 192, 192, 0.2)", "rgba(153, 102, 255, 0.2)", "rgba(255, 159, 64, 0.2)"];
+function useIsClient() {
+  var _useState = useState(false),
+    loaded = _useState[0],
+    setLoaded = _useState[1];
+  useEffect(function () {
+    setLoaded(true);
+  });
+  return loaded;
+}
+function getDefaultColor(index, opacity) {
+  if (opacity === void 0) {
+    opacity = 0.2;
+  }
+  return defaultColors[index % defaultColors.length].replace("0.2", "" + opacity);
+}
+function prepData(_ref, _temp) {
+  var _data$;
+  var _ref$data = _ref.data,
+    data = _ref$data === void 0 ? [] : _ref$data,
+    labelField = _ref.labelField,
+    chosenFields = _ref.chosenFields,
+    scatterSeries = _ref.scatterSeries;
+  var _ref2 = _temp === void 0 ? {} : _temp,
+    isScatter = _ref2.isScatter,
+    preferNonNumericAsLabel = _ref2.preferNonNumericAsLabel,
+    extras = _ref2.extras,
+    opacity = _ref2.opacity;
+  var fields = Object.keys((_data$ = data[0]) != null ? _data$ : {});
+  var isFieldAllNumericOrNil = new Map(fields.map(function (key) {
+    return [key, data.every(function (item) {
+      var _item$key;
+      return !isNaN((_item$key = item[key]) != null ? _item$key : 0);
+    })];
+  }));
+  var realLabelField = labelField != null ? labelField : preferNonNumericAsLabel ? fields.find(function (field) {
+    return !isFieldAllNumericOrNil.get(field);
+  }) : fields[0];
+  var numericFields = fields.filter(function (field) {
+    return isFieldAllNumericOrNil.get(field);
+  });
+  if (isScatter) {
+    var _scatterSeries, _scatterSeries2;
+    scatterSeries = isScatter ? (_scatterSeries = scatterSeries) != null ? _scatterSeries : [{
+      name: numericFields[0] + "-" + numericFields[1],
+      fields: [numericFields[0], numericFields[1]]
+    }] : undefined;
+    return {
+      datasets: ((_scatterSeries2 = scatterSeries) != null ? _scatterSeries2 : []).map(function (series, index) {
+        return _extends({}, extras == null ? void 0 : extras(series.name), {
+          label: series.name,
+          data: data.map(function (item) {
+            var _item$series$fields$, _item$series$fields$2;
+            return {
+              x: (_item$series$fields$ = item[series.fields[0]]) != null ? _item$series$fields$ : 0,
+              y: (_item$series$fields$2 = item[series.fields[1]]) != null ? _item$series$fields$2 : 0
+            };
+          }),
+          backgroundColor: getDefaultColor(index, opacity)
+        });
+      })
+    };
+  } else {
+    var autoChosenFields = numericFields.filter(function (field) {
+      return field !== realLabelField;
+    });
+    return {
+      labels: realLabelField ? data.map(function (item) {
+        return item[realLabelField];
+      }) : undefined,
+      datasets: (chosenFields != null ? chosenFields : autoChosenFields).map(function (key, index) {
+        return _extends({}, extras == null ? void 0 : extras(key), {
+          label: key,
+          data: data.map(function (item) {
+            var _item$key2;
+            return (_item$key2 = item[key]) != null ? _item$key2 : 0;
+          }),
+          backgroundColor: getDefaultColor(index, opacity)
+        });
+      })
+    };
+  }
+}
+// additional styling
+/*
+  elements: {
+    bar: {
+      borderWidth: 2,
+    },
+  },
+
+ */
+function prepOptions(_ref3) {
+  var _ref3$interactive = _ref3.interactive,
+    interactive = _ref3$interactive === void 0 ? true : _ref3$interactive,
+    title = _ref3.title;
+  return [baseOptions, interactive ? {
+    interaction: {
+      mode: "index",
+      intersect: false
+    }
+  } : {}, title ? {
+    title: {
+      display: true,
+      text: title
+    }
+  } : {}];
+}
+
+var baseOptions = {
+  responsive: true
+};
+var stackedOptions = {
+  scales: {
+    x: {
+      stacked: true
+    },
+    y: {
+      stacked: true
+    }
+  }
+};
+var vertOptions = {
+  plugins: {
+    legend: {
+      position: "top"
+    }
+  }
+};
+var horizOptions = {
+  indexAxis: "y",
+  plugins: {
+    legend: {
+      position: "right"
+    }
+  }
+};
+function SimpleBar(props) {
+  var _props$direction = props.direction,
+    direction = _props$direction === void 0 ? "vertical" : _props$direction,
+    stacked = props.stacked,
+    className = props.className;
+  var isClient = useIsClient();
+  useEffect(function () {
+    Chart.register(CategoryScale, LinearScale, BarElement, Title, Tooltip, Legend);
+  }, []);
+  if (!isClient) {
+    return null;
+  }
+  var normalized = prepData(props, {
+    preferNonNumericAsLabel: true,
+    opacity: 0.5
+  });
+  var options = prepOptions(props);
+  return React.createElement("div", {
+    className: className
+  }, React.createElement(Bar, {
+    options: deepmerge.all([].concat(options, [direction === "vertical" ? vertOptions : horizOptions, stacked ? stackedOptions : {}])),
+    data: normalized
+  }));
+}
+
+function SimpleLine(props) {
+  var secondAxisField = props.secondAxisField,
+    fill = props.fill,
+    className = props.className;
+  var isClient = useIsClient();
+  useEffect(function () {
+    Chart.register(CategoryScale, LinearScale, PointElement, LineElement, Title, Tooltip, Filler, Legend);
+  }, []);
+  if (!isClient) {
+    return null;
+  }
+  var normalized = prepData(props, {
+    extras: function extras(field) {
+      return {
+        fill: fill,
+        yAxisID: field === secondAxisField ? "y1" : "y"
+      };
+    }
+  });
+  var options = prepOptions(props);
+  return React.createElement("div", {
+    className: className
+  }, React.createElement(Line, {
+    options: deepmerge.all([].concat(options, [secondAxisField ? {
+      scales: {
+        y: {
+          type: "linear",
+          display: true,
+          position: "left"
+        },
+        y1: {
+          type: "linear",
+          display: true,
+          position: "right",
+          grid: {
+            drawOnChartArea: false
+          }
+        }
+      }
+    } : {}])),
+    data: normalized
+  }));
+}
+
+function SimpleScatter(props) {
+  var className = props.className;
+  var isClient = useIsClient();
+  useEffect(function () {
+    Chart.register(LinearScale, PointElement, LineElement, Tooltip, Legend);
+  }, []);
+  if (!isClient) {
+    return null;
+  }
+  var normalized = prepData(props, {
+    isScatter: true,
+    opacity: 1
+  });
+  var options = prepOptions(props);
+  console.log("!!", normalized, options);
+  return React.createElement("div", {
+    className: className
+  }, React.createElement(Scatter, {
+    options: deepmerge.all([].concat(options, [{
+      scales: {
+        y: {
+          beginAtZero: true
+        }
+      }
+    }])),
+    data: normalized
+  }));
+}
+
+function SimpleChart(props) {
+  var _props$type;
+  switch ((_props$type = props.type) != null ? _props$type : "bar") {
+    case "bar":
+      return React.createElement(SimpleBar, Object.assign({}, props));
+    case "line":
+      return React.createElement(SimpleLine, Object.assign({}, props));
+    case "scatter":
+      return React.createElement(SimpleScatter, Object.assign({}, props));
+  }
+}
+
+var simpleChartMeta = {
+  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: /*#__PURE__*/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 hidden(props) {
+        return props.type === "scatter";
+      },
+      options: function options(props) {
+        var _props$data;
+        return (_props$data = props.data) != null && _props$data[0] ? Object.keys(props.data[0]) : [];
+      }
+    },
+    title: "string",
+    fill: {
+      type: "boolean",
+      hidden: function hidden(props) {
+        return props.type !== "line";
+      }
+    }
+  },
+  defaultStyles: {
+    width: "stretch"
+  },
+  importName: "SimpleChart",
+  importPath: "@plasmicpkgs/react-chartjs-2/dist/simple-chart/SimpleChart"
+};
+function registerSimpleChart(loader) {
+  registerComponentHelper(loader, SimpleChart, simpleChartMeta);
+}
+
+function registerAll(loader) {
+  registerSimpleChart(loader);
+}
+
+export { registerAll };
+//# sourceMappingURL=react-chartjs-2.esm.js.map

package/dist/react-chartjs-2.esm.js.map

@@ -0,0 +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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"}

package/dist/simple-bar/SimpleBar.d.ts

@@ -0,0 +1,35 @@
+/// <reference types="react" />
+import { BaseChartProps } from "../common";
+export declare const baseOptions: {
+    responsive: boolean;
+};
+export declare const stackedOptions: {
+    scales: {
+        x: {
+            stacked: boolean;
+        };
+        y: {
+            stacked: boolean;
+        };
+    };
+};
+export declare const vertOptions: {
+    plugins: {
+        legend: {
+            position: "top";
+        };
+    };
+};
+export declare const horizOptions: {
+    indexAxis: "y";
+    plugins: {
+        legend: {
+            position: "right";
+        };
+    };
+};
+export interface SimpleBarProps extends BaseChartProps {
+    direction?: "vertical" | "horizontal";
+    stacked?: boolean;
+}
+export declare function SimpleBar(props: SimpleBarProps): JSX.Element | null;

package/dist/simple-chart/SimpleChart.d.ts

@@ -0,0 +1,8 @@
+import { ReactElement } from "react";
+import { SimpleBarProps } from "../simple-bar/SimpleBar";
+import { SimpleLineProps } from "../simple-line/SimpleLine";
+import { SimpleScatterProps } from "../simple-scatter/SimpleScatter";
+export declare type SimpleChartProps = {
+    type?: "bar" | "line" | "scatter";
+} & (SimpleBarProps | SimpleLineProps | SimpleScatterProps);
+export declare function SimpleChart(props: SimpleChartProps): ReactElement;

package/dist/simple-chart/index.d.ts

@@ -0,0 +1,5 @@
+import { Registerable } from "../utils";
+import { SimpleChart } from "./SimpleChart";
+export * from "./SimpleChart";
+export default SimpleChart;
+export declare function registerSimpleChart(loader?: Registerable): void;

package/dist/simple-line/SimpleLine.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { BaseChartProps } from "../common";
+export interface SimpleLineProps extends BaseChartProps {
+    fill?: boolean;
+    secondAxisField?: string;
+}
+export declare function SimpleLine(props: SimpleLineProps): JSX.Element | null;

package/dist/simple-scatter/SimpleScatter.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { BaseChartProps } from "../common";
+export interface SimpleScatterProps extends BaseChartProps {
+}
+export declare function SimpleScatter(props: SimpleScatterProps): JSX.Element | null;

package/dist/utils.d.ts

@@ -0,0 +1,24 @@
+import { ComponentMeta, default as registerComponent } from "@plasmicapp/host/registerComponent";
+import { default as registerGlobalContext, GlobalContextMeta } from "@plasmicapp/host/registerGlobalContext";
+import { default as registerToken } from "@plasmicapp/host/registerToken";
+import React from "react";
+export declare type Registerable = {
+    registerComponent: typeof registerComponent;
+    registerGlobalContext: typeof registerGlobalContext;
+    registerToken: typeof registerToken;
+};
+export declare function makeRegisterComponent<T extends React.ComponentType<any>>(component: T, meta: ComponentMeta<React.ComponentProps<T>>): (loader?: Registerable | undefined) => void;
+export declare function makeRegisterGlobalContext<T extends React.ComponentType<any>>(component: T, meta: GlobalContextMeta<React.ComponentProps<T>>): (loader?: Registerable | undefined) => void;
+export declare function registerComponentHelper<T extends React.ComponentType<any>>(loader: Registerable | undefined, component: T, meta: ComponentMeta<React.ComponentProps<T>>): void;
+declare type ReactElt = {
+    children: ReactElt | ReactElt[];
+    props: {
+        children: ReactElt | ReactElt[];
+        [prop: string]: any;
+    } | null;
+    type: React.ComponentType<any> | null;
+    key: string | null;
+} | null;
+export declare function traverseReactEltTree(children: React.ReactNode, callback: (elt: ReactElt) => void): void;
+export declare function asArray<T>(x: T[] | T | undefined | null): T[];
+export {};

package/package.json

@@ -0,0 +1,55 @@
+{
+  "name": "@plasmicpkgs/react-chartjs-2",
+  "version": "1.0.1",
+  "description": "Chart.js 2.x components for React",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "module": "dist/react-chartjs-2.esm.js",
+  "files": [
+    "dist"
+  ],
+  "size-limit": [
+    {
+      "path": "dist/react-chartjs-2.cjs.production.min.js",
+      "limit": "10 KB"
+    },
+    {
+      "path": "dist/react-chartjs-2.esm.js",
+      "limit": "10 KB"
+    }
+  ],
+  "scripts": {
+    "build": "tsdx build",
+    "start": "tsdx watch",
+    "test": "tsdx test --passWithNoTests",
+    "lint": "tsdx lint",
+    "prepare": "if-env PREPARE_NO_BUILD=true || yarn build",
+    "size": "size-limit",
+    "analyze": "size-limit --why"
+  },
+  "devDependencies": {
+    "@plasmicapp/data-sources": "0.1.60",
+    "@plasmicapp/host": "1.0.122",
+    "@size-limit/preset-small-lib": "^4.11.0",
+    "@types/node": "^14.0.26",
+    "chart.js": "^4.2.1",
+    "react-chartjs-2": "^5.2.0",
+    "size-limit": "^4.11.0",
+    "tsdx": "^0.14.1",
+    "tslib": "^2.2.0",
+    "typescript": "^3.9.7"
+  },
+  "peerDependencies": {
+    "@plasmicapp/data-sources": ">=0.1.52",
+    "@plasmicapp/host": ">=1.0.0",
+    "react": ">=16.8.0",
+    "react-dom": ">=16.8.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "deepmerge": "^4.3.1"
+  },
+  "gitHead": "96b7db457fb8ad72167bc8a793d2718406d763a5"
+}