@mekari/pixel3-chart 0.0.1-dev.0

package/dist/chunk-RG3PDKE3.mjs

@@ -0,0 +1,99 @@
+import {
+  useChart
+} from "./chunk-5SYLA56O.mjs";
+import {
+  chartProps
+} from "./chunk-4Y625OEJ.mjs";
+import {
+  __name
+} from "./chunk-QZ7VFGWC.mjs";
+
+// src/chart.tsx
+import { createVNode as _createVNode, isVNode as _isVNode } from "vue";
+import { defineComponent } from "vue";
+import { MpText } from "@mekari/pixel3-text";
+import { merge } from "lodash-es";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !_isVNode(s);
+}
+__name(_isSlot, "_isSlot");
+var MpChart = defineComponent({
+  name: "MpChart",
+  props: chartProps,
+  emits: ["show-tooltip", "hide-tooltip", "click-legend"],
+  setup(props, {
+    slots,
+    emit
+  }) {
+    const {
+      rootAttrs,
+      chartHeaderAttrs,
+      chartWrapperAttrs,
+      chartContainerAttrs,
+      canvasContainerAttrs,
+      canvasAttrs,
+      chartLegendAttrs,
+      legendWrapperAttrs,
+      legendBoxAttrs,
+      chartTooltipAttrs,
+      tooltipWrapperAttrs,
+      tooltipRowAttrs,
+      tooltipItemAttrs,
+      tooltipBoxAttrs,
+      chart,
+      legend,
+      tooltip
+    } = useChart(props, emit);
+    return () => {
+      const children = slots.default && slots.default();
+      const {
+        title,
+        isShowLegend,
+        isShowTooltip
+      } = props;
+      return _createVNode("div", rootAttrs.value, [(title || slots.action) && _createVNode("div", chartHeaderAttrs.value, [_createVNode(MpText, {
+        "size": "h2",
+        "weight": "semiBold"
+      }, _isSlot(title) ? title : {
+        default: () => [title]
+      }), slots.action && slots.action(chart.value)]), _createVNode("div", chartWrapperAttrs.value, [_createVNode("div", chartContainerAttrs.value, [_createVNode("div", canvasContainerAttrs.value, [_createVNode("canvas", canvasAttrs.value, null)]), children]), isShowLegend ? slots.legend ? slots.legend(merge(legend.value)) : _createVNode("div", chartLegendAttrs.value, [
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        legend.value.map((item, index) => {
+          return _createVNode("div", legendWrapperAttrs(item, index), [_createVNode("div", legendBoxAttrs(item), null), _createVNode(MpText, {
+            "is-strike": item.hidden
+          }, {
+            default: () => [item.text]
+          })]);
+        })
+      ]) : "", isShowTooltip && _createVNode("div", chartTooltipAttrs.value, [slots.tooltip ? slots.tooltip(tooltip.value.data) : _createVNode("div", tooltipWrapperAttrs.value, [_createVNode(MpText, {
+        "size": "label",
+        "color": "gray.600"
+      }, {
+        default: () => {
+          var _a, _b;
+          return [(_b = (_a = tooltip.value.data) == null ? void 0 : _a.dataPoints[0]) == null ? void 0 : _b.label];
+        }
+      }), _createVNode("div", tooltipRowAttrs.value, [_createVNode("div", tooltipItemAttrs.value, [_createVNode("div", tooltipBoxAttrs.value, null), _createVNode(MpText, {
+        "size": "label-small",
+        "weight": "semiBold"
+      }, {
+        default: () => {
+          var _a, _b;
+          return [(_b = (_a = tooltip.value.data) == null ? void 0 : _a.dataPoints[0]) == null ? void 0 : _b.dataset.label];
+        }
+      })]), _createVNode(MpText, {
+        "size": "label-small",
+        "color": "gray.600"
+      }, {
+        default: () => {
+          var _a, _b;
+          return [(_b = (_a = tooltip.value.data) == null ? void 0 : _a.dataPoints[0]) == null ? void 0 : _b.formattedValue];
+        }
+      })])])])])]);
+    };
+  }
+});
+
+export {
+  MpChart
+};

package/dist/index.d.mts

@@ -0,0 +1,5 @@
+export { MpChart } from './chart.mjs';
+import 'vue/jsx-runtime';
+import 'chart.js/dist/types/utils';
+import 'chart.js';
+import 'vue';

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+export { MpChart } from './chart.js';
+import 'vue/jsx-runtime';
+import 'chart.js/dist/types/utils';
+import 'chart.js';
+import 'vue';