@deepnoid/ui 0.1.122 → 0.1.124

package/dist/components/table/table.mjs

@@ -2,23 +2,23 @@
 import {
   getCellStyle,
   table_default
-} from "../../chunk-27K5BTEL.mjs";
+} from "../../chunk-3ZF7LQOM.mjs";
 import "../../chunk-MZ76AA76.mjs";
 import "../../chunk-6PN3DGOE.mjs";
-import "../../chunk-DQRAFUDA.mjs";
-import "../../chunk-M37VBNB3.mjs";
 import "../../chunk-7B7LRG5J.mjs";
-import "../../chunk-HX64P3XQ.mjs";
+import "../../chunk-KRGI6HW7.mjs";
 import "../../chunk-F3HENRVM.mjs";
 import "../../chunk-2GCSFWHD.mjs";
-import "../../chunk-3F6OF2QS.mjs";
+import "../../chunk-HKONMHXA.mjs";
 import "../../chunk-QZ3LVYJW.mjs";
-import "../../chunk-H6JGLPPF.mjs";
+import "../../chunk-3U5NJTRH.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
 import "../../chunk-YZ57UYAS.mjs";
+import "../../chunk-DQRAFUDA.mjs";
+import "../../chunk-M37VBNB3.mjs";
 import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-BG4DIGKH.mjs";
-import "../../chunk-CDXBML6O.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {

package/dist/components/tabs/index.mjs

@@ -2,9 +2,9 @@
 import "../../chunk-3MY6LO7N.mjs";
 import {
   tabs_default
-} from "../../chunk-NBJHZ4X2.mjs";
+} from "../../chunk-BBRPAQON.mjs";
 import "../../chunk-E3G5QXSH.mjs";
-import "../../chunk-CDXBML6O.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {
   tabs_default as Tabs

package/dist/components/tabs/tabs.mjs

@@ -2,9 +2,9 @@
 import {
   tabs,
   tabs_default
-} from "../../chunk-NBJHZ4X2.mjs";
+} from "../../chunk-BBRPAQON.mjs";
 import "../../chunk-E3G5QXSH.mjs";
-import "../../chunk-CDXBML6O.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {
   tabs_default as default,

package/dist/components/toast/index.mjs

@@ -3,16 +3,16 @@ import "../../chunk-LUWGOKLG.mjs";
 import {
   ToastProvider,
   useToast
-} from "../../chunk-DD6HAIW3.mjs";
+} from "../../chunk-KJ7L6CO6.mjs";
 import "../../chunk-ZOTHPHXA.mjs";
 import {
   toast_default
-} from "../../chunk-DLNGJVFS.mjs";
+} from "../../chunk-TSBG5FXL.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
 import "../../chunk-YZ57UYAS.mjs";
 import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-BG4DIGKH.mjs";
-import "../../chunk-CDXBML6O.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {

package/dist/components/toast/toast.mjs

@@ -1,12 +1,12 @@
 "use client";
 import {
   toast_default
-} from "../../chunk-DLNGJVFS.mjs";
+} from "../../chunk-TSBG5FXL.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
 import "../../chunk-YZ57UYAS.mjs";
 import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-BG4DIGKH.mjs";
-import "../../chunk-CDXBML6O.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {

package/dist/components/toast/use-toast.mjs

@@ -2,14 +2,14 @@
 import {
   ToastProvider,
   useToast
-} from "../../chunk-DD6HAIW3.mjs";
+} from "../../chunk-KJ7L6CO6.mjs";
 import "../../chunk-ZOTHPHXA.mjs";
-import "../../chunk-DLNGJVFS.mjs";
+import "../../chunk-TSBG5FXL.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
 import "../../chunk-YZ57UYAS.mjs";
 import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-BG4DIGKH.mjs";
-import "../../chunk-CDXBML6O.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {

package/dist/components/tooltip/index.mjs

@@ -2,11 +2,11 @@
 import "../../chunk-HIE2YRGA.mjs";
 import {
   tooltip_default
-} from "../../chunk-YBVJFHH6.mjs";
+} from "../../chunk-YGOX6FBU.mjs";
 import "../../chunk-ZMOAFSYE.mjs";
 import "../../chunk-WSIADHVC.mjs";
 import "../../chunk-E3G5QXSH.mjs";
-import "../../chunk-CDXBML6O.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {
   tooltip_default as Tooltip

package/dist/components/tooltip/tooltip.mjs

@@ -1,11 +1,11 @@
 "use client";
 import {
   tooltip_default
-} from "../../chunk-YBVJFHH6.mjs";
+} from "../../chunk-YGOX6FBU.mjs";
 import "../../chunk-ZMOAFSYE.mjs";
 import "../../chunk-WSIADHVC.mjs";
 import "../../chunk-E3G5QXSH.mjs";
-import "../../chunk-CDXBML6O.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {
   tooltip_default as default

package/dist/components/tree/index.mjs

@@ -2,11 +2,11 @@
 import "../../chunk-MBLZYQCN.mjs";
 import {
   tree_default
-} from "../../chunk-5MINOKNM.mjs";
+} from "../../chunk-2GFE25AI.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
 import "../../chunk-YZ57UYAS.mjs";
 import "../../chunk-BG4DIGKH.mjs";
-import "../../chunk-CDXBML6O.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {

package/dist/components/tree/tree.mjs

@@ -2,11 +2,11 @@
 import {
   Tree,
   tree_default
-} from "../../chunk-5MINOKNM.mjs";
+} from "../../chunk-2GFE25AI.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
 import "../../chunk-YZ57UYAS.mjs";
 import "../../chunk-BG4DIGKH.mjs";
-import "../../chunk-CDXBML6O.mjs";
+import "../../chunk-76QIZILI.mjs";
 import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {

package/dist/index.js

@@ -548,7 +548,8 @@ var scrollbar = {
       height: "6px"
     },
     "&::-webkit-scrollbar-thumb": {
-      backgroundColor: "rgba(0, 0, 0, 0.05)",
+      backgroundColor: "#3F9CF2",
+      // "rgba(0, 0, 0, 0.05)",
       borderRadius: "100px"
     },
     "&::-webkit-scrollbar-track": {
@@ -561,7 +562,8 @@ var scrollbar = {
       height: "8px"
     },
     "&::-webkit-scrollbar-thumb": {
-      backgroundColor: "rgba(0, 0, 0, 0.05)",
+      backgroundColor: "#3F9CF2",
+      // "rgba(0, 0, 0, 0.05)",
       borderRadius: "100px"
     },
     "&::-webkit-scrollbar-track": {
@@ -574,7 +576,8 @@ var scrollbar = {
       height: "10px"
     },
     "&::-webkit-scrollbar-thumb": {
-      backgroundColor: "rgba(0, 0, 0, 0.05)",
+      backgroundColor: "#3F9CF2",
+      // "rgba(0, 0, 0, 0.05)",
       borderRadius: "100px"
     },
     "&::-webkit-scrollbar-track": {
@@ -12212,24 +12215,48 @@ var import_jsx_runtime42 = require("react/jsx-runtime");
 var AreaChartComponent = (0, import_react39.forwardRef)((originalProps, ref) => {
   const uniqueId = (0, import_react39.useId)();
   const [props, variantProps] = mapPropsVariants(originalProps, areaChartStyle.variantKeys);
-  const { data, label, color = "primary", classNames } = { ...props, ...variantProps };
+  const {
+    data,
+    label,
+    headerContent,
+    color = "primary",
+    startFromZero = false,
+    itemWidth,
+    chartHeight = 240,
+    classNames
+  } = { ...props, ...variantProps };
   const slots = (0, import_react39.useMemo)(() => areaChartStyle({ ...variantProps }), [variantProps]);
   const COLOR_MAP = {
     primary: "#3F9CF2",
     danger: "#FF4684"
   };
   const colorHex = (0, import_react39.useMemo)(() => COLOR_MAP[color], [color]);
+  const totalChartWidth = (0, import_react39.useMemo)(() => {
+    if (!data || !itemWidth) return void 0;
+    const dataLength = startFromZero ? data.length + 1 : data.length;
+    return dataLength * itemWidth;
+  }, [data, itemWidth, startFromZero]);
+  const needsScroll = (0, import_react39.useMemo)(() => {
+    return totalChartWidth;
+  }, [totalChartWidth]);
+  const processedData = (0, import_react39.useMemo)(() => {
+    if (!data) return [];
+    return data;
+  }, [data, startFromZero]);
   const [tickPositions, setTickPositions] = (0, import_react39.useState)([]);
   const tickRef = (0, import_react39.useRef)([]);
   const CustomTick = ({ x, y, payload }) => {
     if (x !== void 0) {
       tickRef.current.push(x);
     }
+    if (startFromZero && payload.value === "") {
+      return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("g", {});
+    }
     return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
       "text",
       {
         x,
-        y: y + 14,
+        y: y + 11,
         textAnchor: "middle",
         fontSize: 12,
         fontWeight: 700,
@@ -12250,79 +12277,95 @@ var AreaChartComponent = (0, import_react39.forwardRef)((originalProps, ref) =>
       tickRef.current = [];
     });
     return () => cancelAnimationFrame(raf);
-  }, [data]);
+  }, [processedData]);
   const CustomDotWithShadow = (props2) => {
-    const { cx, cy, fill, stroke } = props2;
+    const { cx, cy, fill, stroke, payload } = props2;
     if (cx === void 0 || cy === void 0) return null;
+    if (startFromZero && (payload == null ? void 0 : payload.name) === "") {
+      return null;
+    }
     return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("circle", { cx, cy, r: 8, fill, opacity: 0.2 }),
       /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("circle", { cx, cy, r: 3.5, fill, stroke, strokeWidth: 2 })
     ] });
   };
+  const chartContent = /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+    "div",
+    {
+      style: {
+        width: totalChartWidth || "100%",
+        minWidth: totalChartWidth || "100%"
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+        import_recharts2.AreaChart,
+        {
+          width: totalChartWidth || 400,
+          height: chartHeight + 30,
+          data: processedData,
+          margin: { left: -30 },
+          className: "bg-body-background [&_.recharts-surface]:outline-none [&_.recharts-surface]:focus:outline-none",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("linearGradient", { id: `colorGradient-${uniqueId}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("stop", { offset: "5%", stopColor: colorHex, stopOpacity: 0.3 }),
+              /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("stop", { offset: "95%", stopColor: colorHex, stopOpacity: 0 })
+            ] }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+              import_recharts2.CartesianGrid,
+              {
+                vertical: true,
+                horizontal: false,
+                strokeDasharray: "3 3",
+                className: "stroke-neutral-light",
+                verticalPoints: tickPositions
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+              import_recharts2.XAxis,
+              {
+                dataKey: "name",
+                axisLine: { stroke: "#DFE2E7", strokeWidth: 1 },
+                tickLine: false,
+                tick: CustomTick,
+                padding: { left: 35.5, right: 35.5 }
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+              import_recharts2.YAxis,
+              {
+                axisLine: { stroke: "#DFE2E7", strokeWidth: 1 },
+                tickLine: false,
+                tick: {
+                  fontSize: 12,
+                  fontWeight: 700,
+                  fill: "text-body-foreground",
+                  textAnchor: "middle",
+                  dx: -10
+                },
+                ticks: [0, 20, 40, 60, 80, 100],
+                domain: [-6, 110]
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+              import_recharts2.Area,
+              {
+                type: "monotone",
+                dataKey: "value",
+                stroke: colorHex,
+                strokeWidth: 2,
+                fill: `url(#colorGradient-${uniqueId})`,
+                dot: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(CustomDotWithShadow, { stroke: colorHex, fill: colorHex }),
+                activeDot: false
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
   return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: [
     label && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: slots.label({ class: classNames == null ? void 0 : classNames.label }), children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_recharts2.ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
-      import_recharts2.AreaChart,
-      {
-        data,
-        margin: { left: -30 },
-        className: "[&_.recharts-surface]:outline-none [&_.recharts-surface]:focus:outline-none",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("linearGradient", { id: `colorGradient-${uniqueId}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("stop", { offset: "5%", stopColor: colorHex, stopOpacity: 0.3 }),
-            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("stop", { offset: "95%", stopColor: colorHex, stopOpacity: 0 })
-          ] }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-            import_recharts2.CartesianGrid,
-            {
-              vertical: true,
-              horizontal: false,
-              strokeDasharray: "3 3",
-              className: "stroke-neutral-light",
-              verticalPoints: tickPositions
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-            import_recharts2.XAxis,
-            {
-              dataKey: "name",
-              axisLine: { stroke: "#DFE2E7", strokeWidth: 1 },
-              tickLine: false,
-              tick: CustomTick,
-              padding: { left: 35.5, right: 35.5 }
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-            import_recharts2.YAxis,
-            {
-              axisLine: { stroke: "#DFE2E7", strokeWidth: 1 },
-              tickLine: false,
-              tick: {
-                fontSize: 12,
-                fontWeight: 700,
-                fill: "text-body-foreground",
-                textAnchor: "middle",
-                dx: -10
-              },
-              ticks: [0, 20, 40, 60, 80, 100],
-              domain: [-6, 110]
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-            import_recharts2.Area,
-            {
-              type: "monotone",
-              dataKey: "value",
-              stroke: colorHex,
-              strokeWidth: 2,
-              fill: `url(#colorGradient-${uniqueId})`,
-              dot: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(CustomDotWithShadow, { stroke: colorHex, fill: colorHex }),
-              activeDot: { r: 7, fill: colorHex }
-            }
-          )
-        ]
-      }
-    ) })
+    headerContent,
+    needsScroll ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(scrollArea_default, { direction: "x", size: "sm", children: chartContent }) : chartContent
   ] });
 });
 AreaChartComponent.displayName = "AreaChart";
@@ -12523,12 +12566,31 @@ var RadarChart = (0, import_react41.forwardRef)((originalProps, ref) => {
     if (!data || data.length === 0) return 100;
     return Math.max(...data.map((item) => item.fullMark || 100));
   }, [data]);
+  const containerHeight = (0, import_react41.useMemo)(() => {
+    if (!data || data.length === 0) return 250;
+    return data.length === 3 ? 245 : 306;
+  }, [data]);
+  const chartMargin = (0, import_react41.useMemo)(() => {
+    return { top: 0, right: 0, bottom: 0, left: 0 };
+  }, [data]);
+  const outerRadius = (0, import_react41.useMemo)(() => {
+    if (!data || data.length === 0) return 125;
+    return data.length === 3 ? 135 : 125;
+  }, [data]);
+  const chartCenter = (0, import_react41.useMemo)(() => {
+    if (!data || data.length === 0) return {};
+    if (data.length === 3) return { cx: "50%", cy: "65%" };
+    return {};
+  }, [data]);
   return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_recharts4.ResponsiveContainer, { width: 580, height: 330, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
+    label && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("p", { className: slots.label({ class: classNames == null ? void 0 : classNames.label }), children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { style: { width: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_recharts4.ResponsiveContainer, { width: "100%", height: containerHeight, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
       import_recharts4.RadarChart,
       {
         data,
-        outerRadius: "80%",
+        outerRadius,
+        margin: chartMargin,
+        ...chartCenter,
         className: "[&_.recharts-surface]:outline-none [&_.recharts-surface]:focus:outline-none",
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_recharts4.PolarGrid, { stroke: "#DFE2E7", strokeWidth: 1.75 }),
@@ -12556,16 +12618,15 @@ var RadarChart = (0, import_react41.forwardRef)((originalProps, ref) => {
           )
         ]
       }
-    ) }),
-    label && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("p", { className: slots.label({ class: classNames == null ? void 0 : classNames.label }), children: label })
+    ) }) })
   ] });
 });
 RadarChart.displayName = "RadarChart";
 var radarChart_default = RadarChart;
 var radarChartStyle = tv({
   slots: {
-    base: ["flex", "flex-col", "items-center", "gap-[10px]", "select-none"],
-    label: ["text-sm", "font-bold", "text-left", "text-body-foreground"]
+    base: ["flex", "flex-col", "select-none"],
+    label: ["text-md", "font-bold", "text-left", "text-body-foreground"]
   },
   variants: {},
   defaultVariants: {