@j2-health/design-system 0.2.0 → 0.3.0

package/dist/src/components/alert/Alert.cjs

@@ -0,0 +1,95 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const antd = require("antd");
+const react = require("@phosphor-icons/react");
+const Alert_module = require("./Alert.module.css.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const Alert = ({
+  description,
+  type,
+  closable = false,
+  showIcon = true,
+  banner = false,
+  ...props
+}) => {
+  const { token } = antd.theme.useToken();
+  const icon = React__namespace.useMemo(() => {
+    const size = description ? token.sizeLG : token.size;
+    const iconStyle = !description ? { display: "flex", alignItems: "center" } : void 0;
+    const iconElement = (() => {
+      switch (type) {
+        case "success":
+          return /* @__PURE__ */ jsxRuntime.jsx(react.CheckCircleIcon, { fill: "var(--j2-color-success-text)", size });
+        case "error":
+          return /* @__PURE__ */ jsxRuntime.jsx(react.XCircleIcon, { fill: "var(--j2-color-error-text)", size });
+        case "info":
+          return /* @__PURE__ */ jsxRuntime.jsx(react.InfoIcon, { fill: "var(--j2-color-info-text)", size });
+        case "warning":
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            react.WarningCircleIcon,
+            {
+              fill: "var(--j2-color-warning-text)",
+              size
+            }
+          );
+        case "loading":
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            react.CircleNotchIcon,
+            {
+              fill: "var(--j2-color-info-text)",
+              size,
+              weight: "regular",
+              style: {
+                animation: "spin 1s linear infinite"
+              }
+            }
+          );
+        default:
+          return null;
+      }
+    })();
+    return iconStyle ? /* @__PURE__ */ jsxRuntime.jsx("span", { style: iconStyle, children: iconElement }) : iconElement;
+  }, [type, description, token.size, token.sizeLG]);
+  const antDType = React__namespace.useMemo(() => {
+    switch (type) {
+      case "loading":
+        return "info";
+      default:
+        return type;
+    }
+  }, [type]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    antd.Alert,
+    {
+      className: Alert_module.default.alert,
+      icon,
+      closable,
+      showIcon,
+      type: antDType,
+      banner,
+      description,
+      closeIcon: /* @__PURE__ */ jsxRuntime.jsx(react.XIcon, { size: token.size, weight: "regular" }),
+      ...props
+    }
+  );
+};
+exports.Alert = Alert;
+//# sourceMappingURL=Alert.cjs.map

package/dist/src/components/alert/Alert.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.cjs","sources":["../../../../src/components/alert/Alert.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Alert as AntdAlert, AlertProps, theme } from 'antd'\nimport {\n  CheckCircleIcon,\n  InfoIcon,\n  WarningCircleIcon,\n  XIcon,\n  XCircleIcon,\n  CircleNotchIcon,\n} from '@phosphor-icons/react'\nimport styles from './Alert.module.css'\ntype Props = Expand<Omit<AlertProps, 'type'>> & {\n  description?: string\n  type: 'success' | 'info' | 'warning' | 'error' | 'loading'\n  closable?: boolean\n  showIcon?: boolean\n  banner?: boolean\n}\n\nconst Alert = ({\n  description,\n  type,\n  closable = false,\n  showIcon = true,\n  banner = false,\n  ...props\n}: Props) => {\n  const { token } = theme.useToken()\n  const icon = React.useMemo(() => {\n    const size = description ? token.sizeLG : token.size\n    const iconStyle = !description\n      ? { display: 'flex', alignItems: 'center' }\n      : undefined\n\n    const iconElement = (() => {\n      switch (type) {\n        case 'success':\n          return (\n            <CheckCircleIcon fill=\"var(--j2-color-success-text)\" size={size} />\n          )\n        case 'error':\n          return <XCircleIcon fill=\"var(--j2-color-error-text)\" size={size} />\n        case 'info':\n          return <InfoIcon fill=\"var(--j2-color-info-text)\" size={size} />\n        case 'warning':\n          return (\n            <WarningCircleIcon\n              fill=\"var(--j2-color-warning-text)\"\n              size={size}\n            />\n          )\n        case 'loading':\n          return (\n            <CircleNotchIcon\n              fill=\"var(--j2-color-info-text)\"\n              size={size}\n              weight=\"regular\"\n              style={{\n                animation: 'spin 1s linear infinite',\n              }}\n            />\n          )\n        default:\n          return null\n      }\n    })()\n\n    return iconStyle ? (\n      <span style={iconStyle}>{iconElement}</span>\n    ) : (\n      iconElement\n    )\n  }, [type, description, token.size, token.sizeLG])\n\n  const antDType = React.useMemo(():\n    'success' | 'info' | 'warning' | 'error' => {\n    switch (type) {\n      case 'loading':\n        return 'info'\n      default:\n        return type as 'success' | 'info' | 'warning' | 'error'\n    }\n  }, [type])\n\n  return (\n    <AntdAlert\n      className={styles.alert}\n      icon={icon}\n      closable={closable}\n      showIcon={showIcon}\n      type={antDType}\n      banner={banner}\n      description={description}\n      closeIcon={<XIcon size={token.size} weight=\"regular\" />}\n      {...props}\n    />\n  )\n}\n\nexport { Alert }\n"],"names":["theme","React","jsx","CheckCircleIcon","XCircleIcon","InfoIcon","WarningCircleIcon","CircleNotchIcon","AntdAlert","styles","XIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,QAAQ,CAAC;AAAA,EACb;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AAAA,EACT,GAAG;AACL,MAAa;AACX,QAAM,EAAE,MAAA,IAAUA,KAAAA,MAAM,SAAA;AACxB,QAAM,OAAOC,iBAAM,QAAQ,MAAM;AAC/B,UAAM,OAAO,cAAc,MAAM,SAAS,MAAM;AAChD,UAAM,YAAY,CAAC,cACf,EAAE,SAAS,QAAQ,YAAY,aAC/B;AAEJ,UAAM,eAAe,MAAM;AACzB,cAAQ,MAAA;AAAA,QACN,KAAK;AACH,iBACEC,2BAAAA,IAACC,MAAAA,iBAAA,EAAgB,MAAK,gCAA+B,KAAA,CAAY;AAAA,QAErE,KAAK;AACH,iBAAOD,2BAAAA,IAACE,MAAAA,aAAA,EAAY,MAAK,8BAA6B,KAAA,CAAY;AAAA,QACpE,KAAK;AACH,iBAAOF,2BAAAA,IAACG,MAAAA,UAAA,EAAS,MAAK,6BAA4B,KAAA,CAAY;AAAA,QAChE,KAAK;AACH,iBACEH,2BAAAA;AAAAA,YAACI,MAAAA;AAAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL;AAAA,YAAA;AAAA,UAAA;AAAA,QAGN,KAAK;AACH,iBACEJ,2BAAAA;AAAAA,YAACK,MAAAA;AAAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL;AAAA,cACA,QAAO;AAAA,cACP,OAAO;AAAA,gBACL,WAAW;AAAA,cAAA;AAAA,YACb;AAAA,UAAA;AAAA,QAGN;AACE,iBAAO;AAAA,MAAA;AAAA,IAEb,GAAA;AAEA,WAAO,YACLL,+BAAC,QAAA,EAAK,OAAO,WAAY,uBAAY,IAErC;AAAA,EAEJ,GAAG,CAAC,MAAM,aAAa,MAAM,MAAM,MAAM,MAAM,CAAC;AAEhD,QAAM,WAAWD,iBAAM,QAAQ,MACe;AAC5C,YAAQ,MAAA;AAAA,MACN,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO;AAAA,IAAA;AAAA,EAEb,GAAG,CAAC,IAAI,CAAC;AAET,SACEC,2BAAAA;AAAAA,IAACM,KAAAA;AAAAA,IAAA;AAAA,MACC,WAAWC,aAAAA,QAAO;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA,WAAWP,2BAAAA,IAACQ,MAAAA,OAAA,EAAM,MAAM,MAAM,MAAM,QAAO,WAAU;AAAA,MACpD,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;;"}

package/dist/src/components/alert/Alert.js

@@ -0,0 +1,78 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { theme, Alert as Alert$1 } from "antd";
+import { XIcon, CircleNotchIcon, WarningCircleIcon, InfoIcon, XCircleIcon, CheckCircleIcon } from "@phosphor-icons/react";
+import styles from "./Alert.module.css.js";
+const Alert = ({
+  description,
+  type,
+  closable = false,
+  showIcon = true,
+  banner = false,
+  ...props
+}) => {
+  const { token } = theme.useToken();
+  const icon = React.useMemo(() => {
+    const size = description ? token.sizeLG : token.size;
+    const iconStyle = !description ? { display: "flex", alignItems: "center" } : void 0;
+    const iconElement = (() => {
+      switch (type) {
+        case "success":
+          return /* @__PURE__ */ jsx(CheckCircleIcon, { fill: "var(--j2-color-success-text)", size });
+        case "error":
+          return /* @__PURE__ */ jsx(XCircleIcon, { fill: "var(--j2-color-error-text)", size });
+        case "info":
+          return /* @__PURE__ */ jsx(InfoIcon, { fill: "var(--j2-color-info-text)", size });
+        case "warning":
+          return /* @__PURE__ */ jsx(
+            WarningCircleIcon,
+            {
+              fill: "var(--j2-color-warning-text)",
+              size
+            }
+          );
+        case "loading":
+          return /* @__PURE__ */ jsx(
+            CircleNotchIcon,
+            {
+              fill: "var(--j2-color-info-text)",
+              size,
+              weight: "regular",
+              style: {
+                animation: "spin 1s linear infinite"
+              }
+            }
+          );
+        default:
+          return null;
+      }
+    })();
+    return iconStyle ? /* @__PURE__ */ jsx("span", { style: iconStyle, children: iconElement }) : iconElement;
+  }, [type, description, token.size, token.sizeLG]);
+  const antDType = React.useMemo(() => {
+    switch (type) {
+      case "loading":
+        return "info";
+      default:
+        return type;
+    }
+  }, [type]);
+  return /* @__PURE__ */ jsx(
+    Alert$1,
+    {
+      className: styles.alert,
+      icon,
+      closable,
+      showIcon,
+      type: antDType,
+      banner,
+      description,
+      closeIcon: /* @__PURE__ */ jsx(XIcon, { size: token.size, weight: "regular" }),
+      ...props
+    }
+  );
+};
+export {
+  Alert
+};
+//# sourceMappingURL=Alert.js.map

package/dist/src/components/alert/Alert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.js","sources":["../../../../src/components/alert/Alert.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Alert as AntdAlert, AlertProps, theme } from 'antd'\nimport {\n  CheckCircleIcon,\n  InfoIcon,\n  WarningCircleIcon,\n  XIcon,\n  XCircleIcon,\n  CircleNotchIcon,\n} from '@phosphor-icons/react'\nimport styles from './Alert.module.css'\ntype Props = Expand<Omit<AlertProps, 'type'>> & {\n  description?: string\n  type: 'success' | 'info' | 'warning' | 'error' | 'loading'\n  closable?: boolean\n  showIcon?: boolean\n  banner?: boolean\n}\n\nconst Alert = ({\n  description,\n  type,\n  closable = false,\n  showIcon = true,\n  banner = false,\n  ...props\n}: Props) => {\n  const { token } = theme.useToken()\n  const icon = React.useMemo(() => {\n    const size = description ? token.sizeLG : token.size\n    const iconStyle = !description\n      ? { display: 'flex', alignItems: 'center' }\n      : undefined\n\n    const iconElement = (() => {\n      switch (type) {\n        case 'success':\n          return (\n            <CheckCircleIcon fill=\"var(--j2-color-success-text)\" size={size} />\n          )\n        case 'error':\n          return <XCircleIcon fill=\"var(--j2-color-error-text)\" size={size} />\n        case 'info':\n          return <InfoIcon fill=\"var(--j2-color-info-text)\" size={size} />\n        case 'warning':\n          return (\n            <WarningCircleIcon\n              fill=\"var(--j2-color-warning-text)\"\n              size={size}\n            />\n          )\n        case 'loading':\n          return (\n            <CircleNotchIcon\n              fill=\"var(--j2-color-info-text)\"\n              size={size}\n              weight=\"regular\"\n              style={{\n                animation: 'spin 1s linear infinite',\n              }}\n            />\n          )\n        default:\n          return null\n      }\n    })()\n\n    return iconStyle ? (\n      <span style={iconStyle}>{iconElement}</span>\n    ) : (\n      iconElement\n    )\n  }, [type, description, token.size, token.sizeLG])\n\n  const antDType = React.useMemo(():\n    'success' | 'info' | 'warning' | 'error' => {\n    switch (type) {\n      case 'loading':\n        return 'info'\n      default:\n        return type as 'success' | 'info' | 'warning' | 'error'\n    }\n  }, [type])\n\n  return (\n    <AntdAlert\n      className={styles.alert}\n      icon={icon}\n      closable={closable}\n      showIcon={showIcon}\n      type={antDType}\n      banner={banner}\n      description={description}\n      closeIcon={<XIcon size={token.size} weight=\"regular\" />}\n      {...props}\n    />\n  )\n}\n\nexport { Alert }\n"],"names":["AntdAlert"],"mappings":";;;;;AAmBA,MAAM,QAAQ,CAAC;AAAA,EACb;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AAAA,EACT,GAAG;AACL,MAAa;AACX,QAAM,EAAE,MAAA,IAAU,MAAM,SAAA;AACxB,QAAM,OAAO,MAAM,QAAQ,MAAM;AAC/B,UAAM,OAAO,cAAc,MAAM,SAAS,MAAM;AAChD,UAAM,YAAY,CAAC,cACf,EAAE,SAAS,QAAQ,YAAY,aAC/B;AAEJ,UAAM,eAAe,MAAM;AACzB,cAAQ,MAAA;AAAA,QACN,KAAK;AACH,iBACE,oBAAC,iBAAA,EAAgB,MAAK,gCAA+B,KAAA,CAAY;AAAA,QAErE,KAAK;AACH,iBAAO,oBAAC,aAAA,EAAY,MAAK,8BAA6B,KAAA,CAAY;AAAA,QACpE,KAAK;AACH,iBAAO,oBAAC,UAAA,EAAS,MAAK,6BAA4B,KAAA,CAAY;AAAA,QAChE,KAAK;AACH,iBACE;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL;AAAA,YAAA;AAAA,UAAA;AAAA,QAGN,KAAK;AACH,iBACE;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL;AAAA,cACA,QAAO;AAAA,cACP,OAAO;AAAA,gBACL,WAAW;AAAA,cAAA;AAAA,YACb;AAAA,UAAA;AAAA,QAGN;AACE,iBAAO;AAAA,MAAA;AAAA,IAEb,GAAA;AAEA,WAAO,YACL,oBAAC,QAAA,EAAK,OAAO,WAAY,uBAAY,IAErC;AAAA,EAEJ,GAAG,CAAC,MAAM,aAAa,MAAM,MAAM,MAAM,MAAM,CAAC;AAEhD,QAAM,WAAW,MAAM,QAAQ,MACe;AAC5C,YAAQ,MAAA;AAAA,MACN,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO;AAAA,IAAA;AAAA,EAEb,GAAG,CAAC,IAAI,CAAC;AAET,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC,WAAW,OAAO;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA,WAAW,oBAAC,OAAA,EAAM,MAAM,MAAM,MAAM,QAAO,WAAU;AAAA,MACpD,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/src/components/alert/Alert.module.css.cjs

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const alert = "_alert_1yhxg_2";
+const styles = {
+  alert
+};
+exports.alert = alert;
+exports.default = styles;
+//# sourceMappingURL=Alert.module.css.cjs.map

package/dist/src/components/alert/Alert.module.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.module.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/src/components/alert/Alert.module.css.js

@@ -0,0 +1,9 @@
+const alert = "_alert_1yhxg_2";
+const styles = {
+  alert
+};
+export {
+  alert,
+  styles as default
+};
+//# sourceMappingURL=Alert.module.css.js.map

package/dist/src/components/alert/Alert.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/src/components/barchart/BarChart.cjs

@@ -0,0 +1,155 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const antd = require("antd");
+const react = require("@highcharts/react");
+require("@highcharts/react/options/Accessibility.js");
+require("@highcharts/react/options/Exporting.js");
+const chart_module = require("./chart.module.css.cjs");
+const server = require("react-dom/server");
+const BarChart = ({
+  categories,
+  series,
+  min,
+  max,
+  tickInterval,
+  tickFormat,
+  xAxisTitle,
+  yAxisTitle,
+  gridLineColor,
+  gridLineDashStyle,
+  xAxisLabelMaxLines,
+  tooltip,
+  exporting,
+  chartRef,
+  height,
+  width,
+  maxBars = 50,
+  barsWidth = void 0
+}) => {
+  var _a, _b, _c, _d, _e;
+  const limitedCategories = categories.slice(0, maxBars);
+  const limitedSeries = series.map((s) => ({
+    ...s,
+    data: s.data.slice(0, maxBars)
+  }));
+  const { token } = antd.theme.useToken();
+  const baseFont = {
+    fontSize: `${token.fontSize}px`,
+    fontFamily: token.fontFamily,
+    color: token.colorText
+  };
+  const options = {
+    credits: {
+      enabled: false
+    },
+    chart: {
+      type: "column",
+      ...height ? { height } : {},
+      ...width ? { width } : {}
+    },
+    plotOptions: {
+      column: {
+        borderRadius: series[0].data.length > 5 ? "20%" : "15%",
+        ...barsWidth !== void 0 ? { pointWidth: barsWidth } : {}
+      }
+    },
+    exporting: {
+      ...exporting,
+      enabled: false,
+      chartOptions: {
+        ...exporting == null ? void 0 : exporting.chartOptions,
+        title: {
+          align: "left",
+          text: (_b = (_a = exporting == null ? void 0 : exporting.chartOptions) == null ? void 0 : _a.title) == null ? void 0 : _b.text,
+          style: {
+            fontSize: `${token.fontSize}px`,
+            fontFamily: "sans-serif",
+            color: token.colorText,
+            ...(_d = (_c = exporting == null ? void 0 : exporting.chartOptions) == null ? void 0 : _c.title) == null ? void 0 : _d.style
+          }
+        },
+        series: limitedSeries.map((s) => ({
+          type: "column",
+          color: s.color ? s.color : "#253761"
+          // --j2-blue-9
+        })),
+        legend: ((_e = exporting == null ? void 0 : exporting.chartOptions) == null ? void 0 : _e.legend) || { enabled: false }
+      }
+    },
+    title: {
+      text: ""
+    },
+    xAxis: {
+      categories: limitedCategories,
+      title: xAxisTitle ? {
+        text: xAxisTitle,
+        style: { ...baseFont, color: token.colorTextDescription }
+      } : void 0,
+      labels: {
+        y: 30,
+        style: baseFont,
+        ...xAxisLabelMaxLines ? {
+          useHTML: true,
+          formatter: function() {
+            return `<div style="overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: ${xAxisLabelMaxLines}; -webkit-box-orient: vertical; text-align: center;">${this.value}</div>`;
+          }
+        } : {}
+      }
+    },
+    yAxis: {
+      min,
+      max,
+      endOnTick: true,
+      gridLineDashStyle: gridLineDashStyle || "Dot",
+      gridLineColor: gridLineColor || "white",
+      title: yAxisTitle ? {
+        text: yAxisTitle,
+        style: { ...baseFont, color: token.colorTextDescription },
+        x: -10
+      } : void 0,
+      tickInterval,
+      labels: {
+        formatter: tickFormat ? ({ value }) => tickFormat(value) : void 0,
+        style: baseFont
+      }
+    },
+    legend: {
+      enabled: false
+    },
+    series: limitedSeries.map((s) => ({
+      data: s.data,
+      name: s.name,
+      type: "column",
+      color: s.color || "var(--j2-blue-11)",
+      states: {
+        hover: {
+          color: s.hoverColor || token.colorPrimaryTextHover
+        }
+      }
+    })),
+    tooltip: {
+      useHTML: true,
+      outside: true,
+      backgroundColor: "transparent",
+      shadow: false,
+      padding: 0,
+      style: { zIndex: 9999 },
+      formatter: function() {
+        return server.renderToString(
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: chart_module.default.tooltip, children: tooltip(this.key, this.y, this.series.name) })
+        );
+      }
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    react.Chart,
+    {
+      ref: chartRef,
+      options,
+      containerProps: { className: "highcharts-light" }
+    }
+  );
+};
+exports.BarChart = BarChart;
+//# sourceMappingURL=BarChart.cjs.map

package/dist/src/components/barchart/BarChart.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BarChart.cjs","sources":["../../../../src/components/barchart/BarChart.tsx"],"sourcesContent":["import { theme } from 'antd'\nimport type * as Highcharts from 'highcharts'\nimport {\n  Chart as HighchartsReact,\n  type HighchartsReactRefObject,\n} from '@highcharts/react'\nimport '@highcharts/react/options/Accessibility.js'\nimport '@highcharts/react/options/Exporting.js'\nimport styles from './chart.module.css'\nimport { renderToString } from 'react-dom/server'\n\ntype Series = {\n  name?: string\n  data: Highcharts.PointOptionsObject[] | number[]\n  color?: string\n  hoverColor?: string\n}\n\ntype BarChartProps = {\n  categories: string[]\n  series: Series[]\n  min: number\n  max: number | undefined | null\n  tickInterval: number | undefined\n  tickFormat?: (value: number) => string\n  xAxisTitle?: string\n  yAxisTitle?: string\n  gridLineColor?: string\n  gridLineDashStyle?: Highcharts.DashStyleValue\n  xAxisLabelMaxLines?: number\n  tooltip: (\n    category: string | number | undefined,\n    value: number | null | undefined,\n    seriesName: string | undefined\n  ) => React.ReactNode\n  chartRef?: React.RefObject<HighchartsReactRefObject>\n  exporting?: Highcharts.ExportingOptions\n  maxBars?: number\n  barsWidth?: number\n  height?: number\n  width?: number\n}\n\nconst BarChart = ({\n  categories,\n  series,\n  min,\n  max,\n  tickInterval,\n  tickFormat,\n  xAxisTitle,\n  yAxisTitle,\n  gridLineColor,\n  gridLineDashStyle,\n  xAxisLabelMaxLines,\n  tooltip,\n  exporting,\n  chartRef,\n  height,\n  width,\n  maxBars = 50,\n  barsWidth = undefined,\n}: BarChartProps) => {\n  const limitedCategories = categories.slice(0, maxBars)\n  const limitedSeries = series.map((s) => ({\n    ...s,\n    data: s.data.slice(0, maxBars),\n  }))\n\n  const { token } = theme.useToken()\n\n  const baseFont: Highcharts.CSSObject = {\n    fontSize: `${token.fontSize}px`,\n    fontFamily: token.fontFamily,\n    color: token.colorText,\n  }\n\n  const options: Highcharts.Options = {\n    credits: {\n      enabled: false,\n    },\n    chart: {\n      type: 'column',\n      ...(height ? { height } : {}),\n      ...(width ? { width } : {}),\n    },\n    plotOptions: {\n      column: {\n        borderRadius: series[0].data.length > 5 ? '20%' : '15%',\n        ...(barsWidth !== undefined ? { pointWidth: barsWidth } : {}),\n      },\n    },\n    exporting: {\n      ...exporting,\n      enabled: false,\n      chartOptions: {\n        ...exporting?.chartOptions,\n        title: {\n          align: 'left',\n          text: exporting?.chartOptions?.title?.text,\n          style: {\n            fontSize: `${token.fontSize}px`,\n            fontFamily: 'sans-serif',\n            color: token.colorText,\n            ...exporting?.chartOptions?.title?.style,\n          },\n        },\n        series: limitedSeries.map((s) => ({\n          type: 'column',\n          color: s.color ? s.color : '#253761', // --j2-blue-9\n        })),\n        legend: exporting?.chartOptions?.legend || { enabled: false },\n      },\n    },\n    title: {\n      text: '',\n    },\n    xAxis: {\n      categories: limitedCategories,\n      title: xAxisTitle\n        ? {\n            text: xAxisTitle,\n            style: { ...baseFont, color: token.colorTextDescription },\n          }\n        : undefined,\n      labels: {\n        y: 30,\n        style: baseFont,\n        ...(xAxisLabelMaxLines\n          ? {\n              useHTML: true,\n              formatter: function (\n                this: Highcharts.AxisLabelsFormatterContextObject\n              ) {\n                return `<div style=\"overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: ${xAxisLabelMaxLines}; -webkit-box-orient: vertical; text-align: center;\">${this.value}</div>`\n              },\n            }\n          : {}),\n      },\n    },\n    yAxis: {\n      min: min,\n      max: max,\n      endOnTick: true,\n      gridLineDashStyle: gridLineDashStyle || 'Dot',\n      gridLineColor: gridLineColor || 'white',\n      title: yAxisTitle\n        ? {\n            text: yAxisTitle,\n            style: { ...baseFont, color: token.colorTextDescription },\n            x: -10,\n          }\n        : undefined,\n      tickInterval: tickInterval,\n      labels: {\n        formatter: tickFormat\n          ? ({ value }) => tickFormat(value as number)\n          : undefined,\n        style: baseFont,\n      },\n    },\n    legend: {\n      enabled: false,\n    },\n    series: limitedSeries.map((s) => ({\n      data: s.data,\n      name: s.name,\n      type: 'column',\n      color: s.color || 'var(--j2-blue-11)',\n      states: {\n        hover: {\n          color: s.hoverColor || token.colorPrimaryTextHover,\n        },\n      },\n    })),\n    tooltip: {\n      useHTML: true,\n      outside: true,\n      backgroundColor: 'transparent',\n      shadow: false,\n      padding: 0,\n      style: { zIndex: 9999 },\n      formatter: function (this) {\n        return renderToString(\n          <div className={styles.tooltip}>\n            {tooltip(this.key, this.y, this.series.name)}\n          </div>\n        )\n      },\n    },\n  }\n\n  return (\n    <HighchartsReact\n      ref={chartRef}\n      options={options}\n      containerProps={{ className: 'highcharts-light' }}\n    />\n  )\n}\n\nexport { BarChart }\n"],"names":["theme","renderToString","jsx","styles","HighchartsReact"],"mappings":"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"}

package/dist/src/components/barchart/BarChart.js

@@ -0,0 +1,155 @@
+import { jsx } from "react/jsx-runtime";
+import { theme } from "antd";
+import { Chart } from "@highcharts/react";
+import "@highcharts/react/options/Accessibility.js";
+import "@highcharts/react/options/Exporting.js";
+import styles from "./chart.module.css.js";
+import { renderToString } from "react-dom/server";
+const BarChart = ({
+  categories,
+  series,
+  min,
+  max,
+  tickInterval,
+  tickFormat,
+  xAxisTitle,
+  yAxisTitle,
+  gridLineColor,
+  gridLineDashStyle,
+  xAxisLabelMaxLines,
+  tooltip,
+  exporting,
+  chartRef,
+  height,
+  width,
+  maxBars = 50,
+  barsWidth = void 0
+}) => {
+  var _a, _b, _c, _d, _e;
+  const limitedCategories = categories.slice(0, maxBars);
+  const limitedSeries = series.map((s) => ({
+    ...s,
+    data: s.data.slice(0, maxBars)
+  }));
+  const { token } = theme.useToken();
+  const baseFont = {
+    fontSize: `${token.fontSize}px`,
+    fontFamily: token.fontFamily,
+    color: token.colorText
+  };
+  const options = {
+    credits: {
+      enabled: false
+    },
+    chart: {
+      type: "column",
+      ...height ? { height } : {},
+      ...width ? { width } : {}
+    },
+    plotOptions: {
+      column: {
+        borderRadius: series[0].data.length > 5 ? "20%" : "15%",
+        ...barsWidth !== void 0 ? { pointWidth: barsWidth } : {}
+      }
+    },
+    exporting: {
+      ...exporting,
+      enabled: false,
+      chartOptions: {
+        ...exporting == null ? void 0 : exporting.chartOptions,
+        title: {
+          align: "left",
+          text: (_b = (_a = exporting == null ? void 0 : exporting.chartOptions) == null ? void 0 : _a.title) == null ? void 0 : _b.text,
+          style: {
+            fontSize: `${token.fontSize}px`,
+            fontFamily: "sans-serif",
+            color: token.colorText,
+            ...(_d = (_c = exporting == null ? void 0 : exporting.chartOptions) == null ? void 0 : _c.title) == null ? void 0 : _d.style
+          }
+        },
+        series: limitedSeries.map((s) => ({
+          type: "column",
+          color: s.color ? s.color : "#253761"
+          // --j2-blue-9
+        })),
+        legend: ((_e = exporting == null ? void 0 : exporting.chartOptions) == null ? void 0 : _e.legend) || { enabled: false }
+      }
+    },
+    title: {
+      text: ""
+    },
+    xAxis: {
+      categories: limitedCategories,
+      title: xAxisTitle ? {
+        text: xAxisTitle,
+        style: { ...baseFont, color: token.colorTextDescription }
+      } : void 0,
+      labels: {
+        y: 30,
+        style: baseFont,
+        ...xAxisLabelMaxLines ? {
+          useHTML: true,
+          formatter: function() {
+            return `<div style="overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: ${xAxisLabelMaxLines}; -webkit-box-orient: vertical; text-align: center;">${this.value}</div>`;
+          }
+        } : {}
+      }
+    },
+    yAxis: {
+      min,
+      max,
+      endOnTick: true,
+      gridLineDashStyle: gridLineDashStyle || "Dot",
+      gridLineColor: gridLineColor || "white",
+      title: yAxisTitle ? {
+        text: yAxisTitle,
+        style: { ...baseFont, color: token.colorTextDescription },
+        x: -10
+      } : void 0,
+      tickInterval,
+      labels: {
+        formatter: tickFormat ? ({ value }) => tickFormat(value) : void 0,
+        style: baseFont
+      }
+    },
+    legend: {
+      enabled: false
+    },
+    series: limitedSeries.map((s) => ({
+      data: s.data,
+      name: s.name,
+      type: "column",
+      color: s.color || "var(--j2-blue-11)",
+      states: {
+        hover: {
+          color: s.hoverColor || token.colorPrimaryTextHover
+        }
+      }
+    })),
+    tooltip: {
+      useHTML: true,
+      outside: true,
+      backgroundColor: "transparent",
+      shadow: false,
+      padding: 0,
+      style: { zIndex: 9999 },
+      formatter: function() {
+        return renderToString(
+          /* @__PURE__ */ jsx("div", { className: styles.tooltip, children: tooltip(this.key, this.y, this.series.name) })
+        );
+      }
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    Chart,
+    {
+      ref: chartRef,
+      options,
+      containerProps: { className: "highcharts-light" }
+    }
+  );
+};
+export {
+  BarChart
+};
+//# sourceMappingURL=BarChart.js.map

package/dist/src/components/barchart/BarChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BarChart.js","sources":["../../../../src/components/barchart/BarChart.tsx"],"sourcesContent":["import { theme } from 'antd'\nimport type * as Highcharts from 'highcharts'\nimport {\n  Chart as HighchartsReact,\n  type HighchartsReactRefObject,\n} from '@highcharts/react'\nimport '@highcharts/react/options/Accessibility.js'\nimport '@highcharts/react/options/Exporting.js'\nimport styles from './chart.module.css'\nimport { renderToString } from 'react-dom/server'\n\ntype Series = {\n  name?: string\n  data: Highcharts.PointOptionsObject[] | number[]\n  color?: string\n  hoverColor?: string\n}\n\ntype BarChartProps = {\n  categories: string[]\n  series: Series[]\n  min: number\n  max: number | undefined | null\n  tickInterval: number | undefined\n  tickFormat?: (value: number) => string\n  xAxisTitle?: string\n  yAxisTitle?: string\n  gridLineColor?: string\n  gridLineDashStyle?: Highcharts.DashStyleValue\n  xAxisLabelMaxLines?: number\n  tooltip: (\n    category: string | number | undefined,\n    value: number | null | undefined,\n    seriesName: string | undefined\n  ) => React.ReactNode\n  chartRef?: React.RefObject<HighchartsReactRefObject>\n  exporting?: Highcharts.ExportingOptions\n  maxBars?: number\n  barsWidth?: number\n  height?: number\n  width?: number\n}\n\nconst BarChart = ({\n  categories,\n  series,\n  min,\n  max,\n  tickInterval,\n  tickFormat,\n  xAxisTitle,\n  yAxisTitle,\n  gridLineColor,\n  gridLineDashStyle,\n  xAxisLabelMaxLines,\n  tooltip,\n  exporting,\n  chartRef,\n  height,\n  width,\n  maxBars = 50,\n  barsWidth = undefined,\n}: BarChartProps) => {\n  const limitedCategories = categories.slice(0, maxBars)\n  const limitedSeries = series.map((s) => ({\n    ...s,\n    data: s.data.slice(0, maxBars),\n  }))\n\n  const { token } = theme.useToken()\n\n  const baseFont: Highcharts.CSSObject = {\n    fontSize: `${token.fontSize}px`,\n    fontFamily: token.fontFamily,\n    color: token.colorText,\n  }\n\n  const options: Highcharts.Options = {\n    credits: {\n      enabled: false,\n    },\n    chart: {\n      type: 'column',\n      ...(height ? { height } : {}),\n      ...(width ? { width } : {}),\n    },\n    plotOptions: {\n      column: {\n        borderRadius: series[0].data.length > 5 ? '20%' : '15%',\n        ...(barsWidth !== undefined ? { pointWidth: barsWidth } : {}),\n      },\n    },\n    exporting: {\n      ...exporting,\n      enabled: false,\n      chartOptions: {\n        ...exporting?.chartOptions,\n        title: {\n          align: 'left',\n          text: exporting?.chartOptions?.title?.text,\n          style: {\n            fontSize: `${token.fontSize}px`,\n            fontFamily: 'sans-serif',\n            color: token.colorText,\n            ...exporting?.chartOptions?.title?.style,\n          },\n        },\n        series: limitedSeries.map((s) => ({\n          type: 'column',\n          color: s.color ? s.color : '#253761', // --j2-blue-9\n        })),\n        legend: exporting?.chartOptions?.legend || { enabled: false },\n      },\n    },\n    title: {\n      text: '',\n    },\n    xAxis: {\n      categories: limitedCategories,\n      title: xAxisTitle\n        ? {\n            text: xAxisTitle,\n            style: { ...baseFont, color: token.colorTextDescription },\n          }\n        : undefined,\n      labels: {\n        y: 30,\n        style: baseFont,\n        ...(xAxisLabelMaxLines\n          ? {\n              useHTML: true,\n              formatter: function (\n                this: Highcharts.AxisLabelsFormatterContextObject\n              ) {\n                return `<div style=\"overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: ${xAxisLabelMaxLines}; -webkit-box-orient: vertical; text-align: center;\">${this.value}</div>`\n              },\n            }\n          : {}),\n      },\n    },\n    yAxis: {\n      min: min,\n      max: max,\n      endOnTick: true,\n      gridLineDashStyle: gridLineDashStyle || 'Dot',\n      gridLineColor: gridLineColor || 'white',\n      title: yAxisTitle\n        ? {\n            text: yAxisTitle,\n            style: { ...baseFont, color: token.colorTextDescription },\n            x: -10,\n          }\n        : undefined,\n      tickInterval: tickInterval,\n      labels: {\n        formatter: tickFormat\n          ? ({ value }) => tickFormat(value as number)\n          : undefined,\n        style: baseFont,\n      },\n    },\n    legend: {\n      enabled: false,\n    },\n    series: limitedSeries.map((s) => ({\n      data: s.data,\n      name: s.name,\n      type: 'column',\n      color: s.color || 'var(--j2-blue-11)',\n      states: {\n        hover: {\n          color: s.hoverColor || token.colorPrimaryTextHover,\n        },\n      },\n    })),\n    tooltip: {\n      useHTML: true,\n      outside: true,\n      backgroundColor: 'transparent',\n      shadow: false,\n      padding: 0,\n      style: { zIndex: 9999 },\n      formatter: function (this) {\n        return renderToString(\n          <div className={styles.tooltip}>\n            {tooltip(this.key, this.y, this.series.name)}\n          </div>\n        )\n      },\n    },\n  }\n\n  return (\n    <HighchartsReact\n      ref={chartRef}\n      options={options}\n      containerProps={{ className: 'highcharts-light' }}\n    />\n  )\n}\n\nexport { BarChart }\n"],"names":["HighchartsReact"],"mappings":"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"}

package/dist/src/components/barchart/chart.module.css.cjs

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const tooltip = "_tooltip_1g39l_1";
+const styles = {
+  tooltip
+};
+exports.default = styles;
+exports.tooltip = tooltip;
+//# sourceMappingURL=chart.module.css.cjs.map

package/dist/src/components/barchart/chart.module.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart.module.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/src/components/barchart/chart.module.css.js

@@ -0,0 +1,9 @@
+const tooltip = "_tooltip_1g39l_1";
+const styles = {
+  tooltip
+};
+export {
+  styles as default,
+  tooltip
+};
+//# sourceMappingURL=chart.module.css.js.map

package/dist/src/components/barchart/chart.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/src/components/breadcrumb/Breadcrumb.cjs

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const antd = require("antd");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const Breadcrumb = ({ items, ...props }) => {
+  const antDItems = React__namespace.useMemo(
+    () => items.map((item) => ({
+      href: item.href,
+      onClick: item.onClick,
+      title: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1", children: [
+        item.icon && /* @__PURE__ */ jsxRuntime.jsx(item.icon, { size: 14 }),
+        item.title
+      ] })
+    })),
+    [items]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(antd.Breadcrumb, { ...props, items: antDItems });
+};
+exports.Breadcrumb = Breadcrumb;
+//# sourceMappingURL=Breadcrumb.cjs.map

package/dist/src/components/breadcrumb/Breadcrumb.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumb.cjs","sources":["../../../../src/components/breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Icon } from '@phosphor-icons/react'\nimport { Breadcrumb as AntdBreadcrumb, BreadcrumbProps } from 'antd'\n\ntype ItemConfig = {\n  title: string\n  icon?: Icon\n  href?: string\n  onClick?: React.MouseEventHandler\n}\nexport type Props = Expand<\n  Omit<BreadcrumbProps, 'items'> & { items: ItemConfig[] }\n>\n\nconst Breadcrumb = ({ items, ...props }: Props) => {\n  const antDItems = React.useMemo(\n    () =>\n      items.map((item) => ({\n        href: item.href,\n        onClick: item.onClick,\n        title: (\n          <span className=\"flex items-center gap-1\">\n            {item.icon && <item.icon size={14} />}\n            {item.title}\n          </span>\n        ),\n      })),\n    [items]\n  )\n\n  return <AntdBreadcrumb {...props} items={antDItems} />\n}\n\nexport { Breadcrumb }\n"],"names":["React","jsxs","jsx","AntdBreadcrumb"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAcA,MAAM,aAAa,CAAC,EAAE,OAAO,GAAG,YAAmB;AACjD,QAAM,YAAYA,iBAAM;AAAA,IACtB,MACE,MAAM,IAAI,CAAC,UAAU;AAAA,MACnB,MAAM,KAAK;AAAA,MACX,SAAS,KAAK;AAAA,MACd,OACEC,2BAAAA,KAAC,QAAA,EAAK,WAAU,2BACb,UAAA;AAAA,QAAA,KAAK,QAAQC,+BAAC,KAAK,MAAL,EAAU,MAAM,IAAI;AAAA,QAClC,KAAK;AAAA,MAAA,EAAA,CACR;AAAA,IAAA,EAEF;AAAA,IACJ,CAAC,KAAK;AAAA,EAAA;AAGR,SAAOA,2BAAAA,IAACC,KAAAA,YAAA,EAAgB,GAAG,OAAO,OAAO,WAAW;AACtD;;"}

package/dist/src/components/breadcrumb/Breadcrumb.js

@@ -0,0 +1,21 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { Breadcrumb as Breadcrumb$1 } from "antd";
+const Breadcrumb = ({ items, ...props }) => {
+  const antDItems = React.useMemo(
+    () => items.map((item) => ({
+      href: item.href,
+      onClick: item.onClick,
+      title: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1", children: [
+        item.icon && /* @__PURE__ */ jsx(item.icon, { size: 14 }),
+        item.title
+      ] })
+    })),
+    [items]
+  );
+  return /* @__PURE__ */ jsx(Breadcrumb$1, { ...props, items: antDItems });
+};
+export {
+  Breadcrumb
+};
+//# sourceMappingURL=Breadcrumb.js.map