@definable/ui 0.1.10 → 0.1.13

package/dist/components/table.esm.js

@@ -1,57 +1,64 @@
 import { j as r } from "../jsx-runtime-DGlMoOmv.js";
 import { c as s } from "../utils-qaFjX9_3.js";
-import { Checkbox as j } from "./checkbox.esm.js";
-import { Tooltip as y } from "./tooltip.esm.js";
-import { useState as T } from "react";
-import { TableEmpty as $ } from "./table-empty.esm.js";
-const h = ({ children: d, className: t }) => /* @__PURE__ */ r.jsx("div", { className: s("border border-border/50 rounded-lg overflow-hidden bg-background shadow-sm", t), children: d });
-function P({
+import { Checkbox as u } from "./checkbox.esm.js";
+import { Tooltip as T } from "./tooltip.esm.js";
+import { useState as $ } from "react";
+import { TableEmpty as k } from "./table-empty.esm.js";
+const c = ({ children: d, className: t }) => /* @__PURE__ */ r.jsx("div", { className: s("border border-border/50 rounded-lg overflow-hidden bg-background shadow-sm", t), children: d });
+function B({
   data: d,
   columns: t,
   showCheckbox: o = !0,
   onRowClick: p,
-  className: v,
+  className: h,
   selectedItems: a,
   onSelect: l,
-  emptyState: u,
-  isLoading: f = !1,
-  loadingRows: g = 5,
-  tableHeight: m
+  emptyState: f,
+  isLoading: g = !1,
+  loadingRows: b = 5,
+  tableHeightOffset: v
 }) {
-  const [b, c] = T(null), x = [
+  const [N, m] = $(null), j = { height: v ? `calc(100vh - ${v})` : "calc(100vh - 8rem)" }, x = [
     o ? "40px" : null,
     ...t.map((i) => i.width || "1fr")
-  ].filter(Boolean).join(" "), N = () => /* @__PURE__ */ r.jsx("div", { className: s("divide-y divide-border/30 overflow-y-auto", `h-[calc(100vh-${m})]`), children: Array(g).fill(0).map((i, n) => /* @__PURE__ */ r.jsxs(
+  ].filter(Boolean).join(" "), y = () => /* @__PURE__ */ r.jsx(
     "div",
     {
-      className: "grid items-center px-6 py-4 text-sm",
-      style: { gridTemplateColumns: x },
-      children: [
-        o && /* @__PURE__ */ r.jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ r.jsx("div", { className: "h-4 w-4 rounded bg-muted animate-pulse" }) }),
-        t.map((e) => /* @__PURE__ */ r.jsx(
-          "div",
-          {
-            className: s("px-2 relative min-w-0", e.className),
-            children: /* @__PURE__ */ r.jsx(
+      className: s("divide-y divide-border/50 overflow-y-auto"),
+      style: j,
+      children: Array(b).fill(0).map((i, n) => /* @__PURE__ */ r.jsxs(
+        "div",
+        {
+          className: "grid items-center px-6 py-4 text-sm",
+          style: { gridTemplateColumns: x },
+          children: [
+            o && /* @__PURE__ */ r.jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ r.jsx("div", { className: "h-4 w-4 rounded bg-muted animate-pulse" }) }),
+            t.map((e) => /* @__PURE__ */ r.jsx(
               "div",
               {
-                className: "h-4 bg-muted rounded animate-pulse",
-                style: { width: Math.random() * 40 + 40 + "%" }
-              }
-            )
-          },
-          `skeleton-col-${e.id}`
-        ))
-      ]
-    },
-    `skeleton-${n}`
-  )) });
-  return f ? /* @__PURE__ */ r.jsx(h, { className: v, children: /* @__PURE__ */ r.jsxs("div", { className: "relative", children: [
+                className: s("px-2 relative min-w-0", e.className),
+                children: /* @__PURE__ */ r.jsx(
+                  "div",
+                  {
+                    className: "h-4 bg-muted rounded animate-pulse",
+                    style: { width: Math.random() * 40 + 40 + "%" }
+                  }
+                )
+              },
+              `skeleton-col-${e.id}`
+            ))
+          ]
+        },
+        `skeleton-${n}`
+      ))
+    }
+  );
+  return g ? /* @__PURE__ */ r.jsx(c, { className: h, children: /* @__PURE__ */ r.jsxs("div", { className: "relative bg-card", children: [
     /* @__PURE__ */ r.jsxs(
       "div",
       {
         className: s(
-          "grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/30 sticky top-0 z-10"
+          "grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/50 sticky top-0 z-10"
         ),
         style: { gridTemplateColumns: x },
         children: [
@@ -60,18 +67,18 @@ function P({
         ]
       }
     ),
-    /* @__PURE__ */ r.jsx(N, {})
-  ] }) }) : d.length === 0 ? /* @__PURE__ */ r.jsx(h, { className: v, children: /* @__PURE__ */ r.jsx("div", { className: "relative", children: /* @__PURE__ */ r.jsx($, { ...u }) }) }) : /* @__PURE__ */ r.jsx(h, { className: v, children: /* @__PURE__ */ r.jsxs("div", { className: "relative", children: [
+    /* @__PURE__ */ r.jsx(y, {})
+  ] }) }) : d.length === 0 ? /* @__PURE__ */ r.jsx(c, { className: h, children: /* @__PURE__ */ r.jsx("div", { className: "relative bg-card", children: /* @__PURE__ */ r.jsx(k, { ...f }) }) }) : /* @__PURE__ */ r.jsx(c, { className: h, children: /* @__PURE__ */ r.jsxs("div", { className: "relative bg-card", children: [
     /* @__PURE__ */ r.jsxs(
       "div",
       {
         className: s(
-          "grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/30 sticky top-0 z-10"
+          "grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/50 sticky top-0 z-10"
         ),
         style: { gridTemplateColumns: x },
         children: [
           o && /* @__PURE__ */ r.jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ r.jsx(
-            j,
+            u,
             {
               checked: d.length > 0 && (a == null ? void 0 : a.size) === d.length,
               onClick: (i) => {
@@ -83,61 +90,68 @@ function P({
         ]
       }
     ),
-    /* @__PURE__ */ r.jsx("div", { className: s("divide-y divide-border/30 overflow-y-auto", m || "h-[calc(100vh-12rem)]"), children: d.map((i, n) => /* @__PURE__ */ r.jsxs(
+    /* @__PURE__ */ r.jsx(
       "div",
       {
-        className: s(
-          "grid items-center px-6 py-4 text-sm text-foreground bg-background hover:bg-muted/30 transition-colors duration-150 group cursor-pointer"
-        ),
-        style: { gridTemplateColumns: x },
-        onClick: () => p == null ? void 0 : p(i),
-        children: [
-          o && /* @__PURE__ */ r.jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ r.jsx(
-            j,
-            {
-              checked: a == null ? void 0 : a.has(i.id),
-              onClick: (e) => {
-                e.stopPropagation(), l == null || l(i.id, !(a != null && a.has(i.id)));
-              }
-            }
-          ) }),
-          t.map((e) => /* @__PURE__ */ r.jsxs(
-            "div",
-            {
-              className: s(
-                "px-2 relative min-w-0",
-                e.className
-              ),
-              onMouseEnter: () => e.tooltipValue && c(`${n}-${e.id}`),
-              onMouseLeave: () => c(null),
-              children: [
-                /* @__PURE__ */ r.jsx("div", { className: s(
-                  "flex items-center gap-2",
-                  e.truncate && "overflow-hidden"
-                ), children: /* @__PURE__ */ r.jsx("div", { className: s(
-                  "w-full",
-                  e.truncate && "truncate"
-                ), children: e.cell(i) }) }),
-                e.tooltipValue && b === `${n}-${e.id}` && /* @__PURE__ */ r.jsx(
-                  y,
-                  {
-                    content: e.tooltipValue(i),
-                    side: "bottom",
-                    align: "start",
-                    isVisible: !0
+        className: s("divide-y divide-border/30 overflow-y-auto"),
+        style: j,
+        children: d.map((i, n) => /* @__PURE__ */ r.jsxs(
+          "div",
+          {
+            className: s(
+              "grid items-center px-6 py-4 text-sm text-foreground hover:bg-muted/30 transition-colors duration-150 group cursor-pointer"
+            ),
+            style: { gridTemplateColumns: x },
+            onClick: () => p == null ? void 0 : p(i),
+            children: [
+              o && /* @__PURE__ */ r.jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ r.jsx(
+                u,
+                {
+                  checked: a == null ? void 0 : a.has(i.id),
+                  onClick: (e) => {
+                    e.stopPropagation(), l == null || l(i.id, !(a != null && a.has(i.id)));
                   }
-                )
-              ]
-            },
-            e.id
-          ))
-        ]
-      },
-      i.id
-    )) })
+                }
+              ) }),
+              t.map((e) => /* @__PURE__ */ r.jsxs(
+                "div",
+                {
+                  className: s(
+                    "px-2 relative min-w-0",
+                    e.className
+                  ),
+                  onMouseEnter: () => e.tooltipValue && m(`${n}-${e.id}`),
+                  onMouseLeave: () => m(null),
+                  children: [
+                    /* @__PURE__ */ r.jsx("div", { className: s(
+                      "flex items-center gap-2",
+                      e.truncate && "overflow-hidden"
+                    ), children: /* @__PURE__ */ r.jsx("div", { className: s(
+                      "w-full",
+                      e.truncate && "truncate"
+                    ), children: e.cell(i) }) }),
+                    e.tooltipValue && N === `${n}-${e.id}` && /* @__PURE__ */ r.jsx(
+                      T,
+                      {
+                        content: e.tooltipValue(i),
+                        side: "bottom",
+                        align: "start",
+                        isVisible: !0
+                      }
+                    )
+                  ]
+                },
+                e.id
+              ))
+            ]
+          },
+          i.id
+        ))
+      }
+    )
   ] }) });
 }
 export {
-  P as Table
+  B as Table
 };
 //# sourceMappingURL=table.esm.js.map

package/dist/components/table.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.esm.js","sources":["../../src/components/table.tsx"],"sourcesContent":["import { cn } from \"@/lib/utils\"\nimport { Checkbox } from \"./checkbox\"\nimport { Tooltip } from \"./tooltip\"\nimport { useState } from \"react\"\nimport { TableEmpty } from \"./table-empty\"\n\nexport interface Column<T> {\n  id: string\n  header: string\n  width?: string\n  cell: (item: T) => React.ReactNode\n  className?: string\n  tooltipValue?: (item: T) => string\n  truncate?: boolean\n}\n\nexport interface TableProps<T> {\n  data: T[]\n  columns: Column<T>[]\n  showCheckbox?: boolean\n  onRowClick?: (item: T) => void\n  className?: string\n  selectedItems?: Set<string>\n  onSelect?: (id: string, checked: boolean) => void\n  emptyState?: {\n    title?: string\n    description?: string\n    actionLabel?: string\n    onAction?: () => void\n    icon?: React.ReactNode\n  }\n  isLoading?: boolean\n  loadingRows?: number\n  tableHeight?: string\n}\n\nconst TableContainer = ({ children, className }: { children: React.ReactNode, className?: string }) => {\n  return (\n    <div className={cn(\"border border-border/50 rounded-lg overflow-hidden bg-background shadow-sm\", className)}>\n      {children}\n    </div>\n  )\n} \nexport function Table<T extends { id: string }>({ \n  data, \n  columns, \n  showCheckbox = true,\n  onRowClick,\n  className,\n  selectedItems,\n  onSelect,\n  emptyState,\n  isLoading = false,\n  loadingRows = 5,\n  tableHeight\n}: TableProps<T>) {\n  const [hoveredText, setHoveredText] = useState<string | null>(null);\n\n  // Improved grid template calculation\n  const gridTemplateColumns = [\n    showCheckbox ? '40px' : null,\n    ...columns.map(col => col.width || '1fr')\n  ].filter(Boolean).join(' ');\n\n  // Loading skeleton component\n  const TableSkeleton = () => (\n    <div className={cn(\"divide-y divide-border/30 overflow-y-auto\", `h-[calc(100vh-${tableHeight})]`)}>\n      {Array(loadingRows).fill(0).map((_, index) => (\n        <div\n          key={`skeleton-${index}`}\n          className=\"grid items-center px-6 py-4 text-sm\"\n          style={{ gridTemplateColumns }}\n        >\n          {showCheckbox && (\n            <div className=\"flex items-center justify-center\">\n              <div className=\"h-4 w-4 rounded bg-muted animate-pulse\" />\n            </div>\n          )}\n          \n          {columns.map(column => (\n            <div \n              key={`skeleton-col-${column.id}`} \n              className={cn(\"px-2 relative min-w-0\", column.className)}\n            >\n              <div className=\"h-4 bg-muted rounded animate-pulse\" \n                   style={{ width: Math.random() * 40 + 40 + '%' }} />\n            </div>\n          ))}\n        </div>\n      ))}\n    </div>\n  );\n\n  if (isLoading) {\n    return (\n      <TableContainer className={className}>\n        <div className=\"relative\">\n          {/* Header */}\n          <div className={cn(\n            \"grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/30 sticky top-0 z-10\",\n          )}\n          style={{ gridTemplateColumns }}\n          >\n            {showCheckbox && (\n              <div className=\"flex items-center justify-center\">\n                <div className=\"h-4 w-4 rounded bg-muted animate-pulse\" />\n              </div>\n            )}\n            {columns.map(column => (\n              <div key={column.id} className={cn(\"px-2 font-medium\", column.className)}>\n                {column.header}\n              </div>\n            ))}\n          </div>\n\n          <TableSkeleton />\n        </div>\n      </TableContainer>\n    );\n  }\n\n  if (data.length === 0) {\n    return (\n      <TableContainer className={className}>\n        <div className=\"relative\">\n          <TableEmpty {...emptyState} />\n        </div>\n      </TableContainer>\n    );\n  }\n\n  return (\n    <TableContainer className={className}>\n      <div className=\"relative\">\n        {/* Header */}\n        <div className={cn(\n          \"grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/30 sticky top-0 z-10\",\n        )}\n        style={{ gridTemplateColumns }}\n        >\n          {showCheckbox && (\n            <div className=\"flex items-center justify-center\">\n              <Checkbox \n                checked={data.length > 0 && selectedItems?.size === data.length}\n                onClick={(e) => {\n                  e.stopPropagation();\n                  data.forEach(item => onSelect?.(item.id, !selectedItems?.has(item.id)));\n                }}\n              />\n            </div>\n          )}\n          {columns.map(column => (\n            <div key={column.id} className={cn(\"px-2 font-medium\", column.className)}>\n              {column.header}\n            </div>\n          ))}\n        </div>\n\n        {/* Body */}\n        <div className={cn(\"divide-y divide-border/30 overflow-y-auto\", tableHeight || \"h-[calc(100vh-12rem)]\")}>\n          {data.map((item, index) => (\n            <div\n              key={item.id}\n              className={cn(\n                \"grid items-center px-6 py-4 text-sm text-foreground bg-background hover:bg-muted/30 transition-colors duration-150 group cursor-pointer\",\n              )}\n              style={{ gridTemplateColumns }}\n              onClick={() => onRowClick?.(item)}\n            >\n              {showCheckbox && (\n                <div className=\"flex items-center justify-center\">\n                  <Checkbox \n                    checked={selectedItems?.has(item.id)}\n                    onClick={(e) => {\n                      e.stopPropagation();\n                      onSelect?.(item.id, !selectedItems?.has(item.id));\n                    }}\n                  />\n                </div>\n              )}\n              \n              {columns.map(column => (\n                <div \n                  key={column.id} \n                  className={cn(\n                    \"px-2 relative min-w-0\",\n                    column.className\n                  )}\n                  onMouseEnter={() => column.tooltipValue && setHoveredText(`${index}-${column.id}`)}\n                  onMouseLeave={() => setHoveredText(null)}\n                >\n                  <div className={cn(\n                    \"flex items-center gap-2\",\n                    column.truncate && \"overflow-hidden\"\n                  )}>\n                    <div className={cn(\n                      \"w-full\",\n                      column.truncate && \"truncate\"\n                    )}>\n                      {column.cell(item)}\n                    </div>\n                  </div>\n                  {column.tooltipValue && hoveredText === `${index}-${column.id}` && (\n                    <Tooltip\n                      content={column.tooltipValue(item)}\n                      side=\"bottom\"\n                      align='start'\n                      isVisible={true}\n                    />\n                  )}\n                </div>\n              ))}\n            </div>\n          ))}\n        </div>\n      </div>\n    </TableContainer>\n  );\n} "],"names":["TableContainer","children","className","cn","Table","data","columns","showCheckbox","onRowClick","selectedItems","onSelect","emptyState","isLoading","loadingRows","tableHeight","hoveredText","setHoveredText","useState","gridTemplateColumns","col","TableSkeleton","jsx","_","index","jsxs","column","TableEmpty","Checkbox","e","item","Tooltip"],"mappings":";;;;;;AAoCA,MAAMA,IAAiB,CAAC,EAAE,UAAAC,GAAU,WAAAC,8BAE/B,OAAA,EAAI,WAAWC,EAAG,8EAA8ED,CAAS,GACvG,UAAAD,GACH;AAGG,SAASG,EAAgC;AAAA,EAC9C,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,YAAAC;AAAA,EACA,WAAAN;AAAA,EACA,eAAAO;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,aAAAC,IAAc;AAAA,EACd,aAAAC;AACF,GAAkB;AAChB,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAwB,IAAI,GAG5DC,IAAsB;AAAA,IAC1BX,IAAe,SAAS;AAAA,IACxB,GAAGD,EAAQ,IAAI,CAAAa,MAAOA,EAAI,SAAS,KAAK;AAAA,EAAA,EACxC,OAAO,OAAO,EAAE,KAAK,GAAG,GAGpBC,IAAgB,MACpBC,gBAAAA,EAAAA,IAAC,OAAA,EAAI,WAAWlB,EAAG,6CAA6C,iBAAiBW,CAAW,IAAI,GAC7F,UAAA,MAAMD,CAAW,EAAE,KAAK,CAAC,EAAE,IAAI,CAACS,GAAGC,MAClCC,gBAAAA,EAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MAEC,WAAU;AAAA,MACV,OAAO,EAAE,qBAAAN,EAAA;AAAA,MAER,UAAA;AAAA,QAAAX,KACCc,gBAAAA,EAAAA,IAAC,SAAI,WAAU,oCACb,gCAAC,OAAA,EAAI,WAAU,0CAAyC,EAAA,CAC1D;AAAA,QAGDf,EAAQ,IAAI,CAAAmB,MACXJ,gBAAAA,EAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YAEC,WAAWlB,EAAG,yBAAyBsB,EAAO,SAAS;AAAA,YAEvD,UAAAJ,gBAAAA,EAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBAAI,WAAU;AAAA,gBACV,OAAO,EAAE,OAAO,KAAK,WAAW,KAAK,KAAK,IAAA;AAAA,cAAI;AAAA,YAAA;AAAA,UAAG;AAAA,UAJjD,gBAAgBI,EAAO,EAAE;AAAA,QAAA,CAMjC;AAAA,MAAA;AAAA,IAAA;AAAA,IAlBI,YAAYF,CAAK;AAAA,EAAA,CAoBzB,GACH;AAGF,SAAIX,0BAECZ,GAAA,EAAe,WAAAE,GACd,UAAAsB,gBAAAA,OAAC,OAAA,EAAI,WAAU,YAEb,UAAA;AAAA,IAAAA,gBAAAA,EAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QAAI,WAAWrB;AAAA,UACd;AAAA,QAAA;AAAA,QAEF,OAAO,EAAE,qBAAAe,EAAA;AAAA,QAEN,UAAA;AAAA,UAAAX,KACCc,gBAAAA,EAAAA,IAAC,SAAI,WAAU,oCACb,gCAAC,OAAA,EAAI,WAAU,0CAAyC,EAAA,CAC1D;AAAA,UAEDf,EAAQ,IAAI,CAAAmB,MACXJ,gBAAAA,EAAAA,IAAC,SAAoB,WAAWlB,EAAG,oBAAoBsB,EAAO,SAAS,GACpE,UAAAA,EAAO,OAAA,GADAA,EAAO,EAEjB,CACD;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,0BAGFL,GAAA,CAAA,CAAc;AAAA,EAAA,EAAA,CACjB,EAAA,CACF,IAIAf,EAAK,WAAW,IAEhBgB,gBAAAA,EAAAA,IAACrB,GAAA,EAAe,WAAAE,GACd,UAAAmB,gBAAAA,EAAAA,IAAC,OAAA,EAAI,WAAU,YACb,UAAAA,gBAAAA,EAAAA,IAACK,GAAA,EAAY,GAAGf,EAAA,CAAY,EAAA,CAC9B,GACF,0BAKDX,GAAA,EAAe,WAAAE,GACd,UAAAsB,gBAAAA,OAAC,OAAA,EAAI,WAAU,YAEb,UAAA;AAAA,IAAAA,gBAAAA,EAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QAAI,WAAWrB;AAAA,UACd;AAAA,QAAA;AAAA,QAEF,OAAO,EAAE,qBAAAe,EAAA;AAAA,QAEN,UAAA;AAAA,UAAAX,KACCc,gBAAAA,EAAAA,IAAC,OAAA,EAAI,WAAU,oCACb,UAAAA,gBAAAA,EAAAA;AAAAA,YAACM;AAAA,YAAA;AAAA,cACC,SAAStB,EAAK,SAAS,MAAKI,KAAA,gBAAAA,EAAe,UAASJ,EAAK;AAAA,cACzD,SAAS,CAACuB,MAAM;AACd,gBAAAA,EAAE,gBAAA,GACFvB,EAAK,QAAQ,CAAAwB,MAAQnB,KAAA,gBAAAA,EAAWmB,EAAK,IAAI,EAACpB,KAAA,QAAAA,EAAe,IAAIoB,EAAK,KAAI;AAAA,cACxE;AAAA,YAAA;AAAA,UAAA,GAEJ;AAAA,UAEDvB,EAAQ,IAAI,CAAAmB,MACXJ,gBAAAA,EAAAA,IAAC,SAAoB,WAAWlB,EAAG,oBAAoBsB,EAAO,SAAS,GACpE,UAAAA,EAAO,OAAA,GADAA,EAAO,EAEjB,CACD;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAIHJ,gBAAAA,EAAAA,IAAC,OAAA,EAAI,WAAWlB,EAAG,6CAA6CW,KAAe,uBAAuB,GACnG,UAAAT,EAAK,IAAI,CAACwB,GAAMN,MACfC,gBAAAA,EAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QAEC,WAAWrB;AAAA,UACT;AAAA,QAAA;AAAA,QAEF,OAAO,EAAE,qBAAAe,EAAA;AAAA,QACT,SAAS,MAAMV,KAAA,gBAAAA,EAAaqB;AAAA,QAE3B,UAAA;AAAA,UAAAtB,KACCc,gBAAAA,EAAAA,IAAC,OAAA,EAAI,WAAU,oCACb,UAAAA,gBAAAA,EAAAA;AAAAA,YAACM;AAAA,YAAA;AAAA,cACC,SAASlB,KAAA,gBAAAA,EAAe,IAAIoB,EAAK;AAAA,cACjC,SAAS,CAAC,MAAM;AACd,kBAAE,gBAAA,GACFnB,KAAA,QAAAA,EAAWmB,EAAK,IAAI,EAACpB,KAAA,QAAAA,EAAe,IAAIoB,EAAK;AAAA,cAC/C;AAAA,YAAA;AAAA,UAAA,GAEJ;AAAA,UAGDvB,EAAQ,IAAI,CAAAmB,MACXD,gBAAAA,EAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cAEC,WAAWrB;AAAA,gBACT;AAAA,gBACAsB,EAAO;AAAA,cAAA;AAAA,cAET,cAAc,MAAMA,EAAO,gBAAgBT,EAAe,GAAGO,CAAK,IAAIE,EAAO,EAAE,EAAE;AAAA,cACjF,cAAc,MAAMT,EAAe,IAAI;AAAA,cAEvC,UAAA;AAAA,gBAAAK,gBAAAA,MAAC,SAAI,WAAWlB;AAAA,kBACd;AAAA,kBACAsB,EAAO,YAAY;AAAA,gBAAA,GAEnB,UAAAJ,gBAAAA,EAAAA,IAAC,OAAA,EAAI,WAAWlB;AAAA,kBACd;AAAA,kBACAsB,EAAO,YAAY;AAAA,gBAAA,GAElB,UAAAA,EAAO,KAAKI,CAAI,GACnB,EAAA,CACF;AAAA,gBACCJ,EAAO,gBAAgBV,MAAgB,GAAGQ,CAAK,IAAIE,EAAO,EAAE,MAC3DJ,gBAAAA,EAAAA;AAAAA,kBAACS;AAAA,kBAAA;AAAA,oBACC,SAASL,EAAO,aAAaI,CAAI;AAAA,oBACjC,MAAK;AAAA,oBACL,OAAM;AAAA,oBACN,WAAW;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACb;AAAA,YAAA;AAAA,YAzBGJ,EAAO;AAAA,UAAA,CA4Bf;AAAA,QAAA;AAAA,MAAA;AAAA,MAjDII,EAAK;AAAA,IAAA,CAmDb,EAAA,CACH;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;"}
+{"version":3,"file":"table.esm.js","sources":["../../src/components/table.tsx"],"sourcesContent":["import { cn } from \"@/lib/utils\"\nimport { Checkbox } from \"./checkbox\"\nimport { Tooltip } from \"./tooltip\"\nimport { useState } from \"react\"\nimport { TableEmpty } from \"./table-empty\"\n\nexport interface Column<T> {\n  id: string\n  header: string\n  width?: string\n  cell: (item: T) => React.ReactNode\n  className?: string\n  tooltipValue?: (item: T) => string\n  truncate?: boolean\n}\n\nexport interface TableProps<T> {\n  data: T[]\n  columns: Column<T>[]\n  showCheckbox?: boolean\n  onRowClick?: (item: T) => void\n  className?: string\n  selectedItems?: Set<string>\n  onSelect?: (id: string, checked: boolean) => void\n  emptyState?: {\n    title?: string\n    description?: string\n    actionLabel?: string\n    onAction?: () => void\n    icon?: React.ReactNode\n  }\n  isLoading?: boolean\n  loadingRows?: number\n  tableHeightOffset?: string\n}\n\nconst TableContainer = ({ children, className }: { children: React.ReactNode, className?: string }) => {\n  return (\n    <div className={cn(\"border border-border/50 rounded-lg overflow-hidden bg-background shadow-sm\", className)}>\n      {children}\n    </div>\n  )\n} \nexport function Table<T extends { id: string }>({ \n  data, \n  columns, \n  showCheckbox = true,\n  onRowClick,\n  className,\n  selectedItems,\n  onSelect,\n  emptyState,\n  isLoading = false,\n  loadingRows = 5,\n  tableHeightOffset\n}: TableProps<T>) {\n  const [hoveredText, setHoveredText] = useState<string | null>(null);\n\n  const height = tableHeightOffset ? `calc(100vh - ${tableHeightOffset})` : \"calc(100vh - 8rem)\";\n  const heightStyle = { height };\n\n  // Improved grid template calculation\n  const gridTemplateColumns = [\n    showCheckbox ? '40px' : null,\n    ...columns.map(col => col.width || '1fr')\n  ].filter(Boolean).join(' ');\n\n  // Loading skeleton component\n  const TableSkeleton = () => (\n    <div className={cn(\"divide-y divide-border/50 overflow-y-auto\")}\n      style={heightStyle}\n    >\n      {Array(loadingRows).fill(0).map((_, index) => (\n        <div\n          key={`skeleton-${index}`}\n          className=\"grid items-center px-6 py-4 text-sm\"\n          style={{ gridTemplateColumns }}\n        >\n          {showCheckbox && (\n            <div className=\"flex items-center justify-center\">\n              <div className=\"h-4 w-4 rounded bg-muted animate-pulse\" />\n            </div>\n          )}\n          \n          {columns.map(column => (\n            <div \n              key={`skeleton-col-${column.id}`} \n              className={cn(\"px-2 relative min-w-0\", column.className)}\n            >\n              <div className=\"h-4 bg-muted rounded animate-pulse\" \n                   style={{ width: Math.random() * 40 + 40 + '%' }} />\n            </div>\n          ))}\n        </div>\n      ))}\n    </div>\n  );\n\n  if (isLoading) {\n    return (\n      <TableContainer className={className}>\n        <div className=\"relative bg-card\">\n          {/* Header */}\n          <div className={cn(\n            \"grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/50 sticky top-0 z-10\",\n          )}\n          style={{ gridTemplateColumns }}\n          >\n            {showCheckbox && (\n              <div className=\"flex items-center justify-center\">\n                <div className=\"h-4 w-4 rounded bg-muted animate-pulse\" />\n              </div>\n            )}\n            {columns.map(column => (\n              <div key={column.id} className={cn(\"px-2 font-medium\", column.className)}>\n                {column.header}\n              </div>\n            ))}\n          </div>\n\n          <TableSkeleton />\n        </div>\n      </TableContainer>\n    );\n  }\n\n  if (data.length === 0) {\n    return (\n      <TableContainer className={className}>\n        <div className=\"relative bg-card\">\n          <TableEmpty {...emptyState} />\n        </div>\n      </TableContainer>\n    );\n  }\n\n  return (\n    <TableContainer className={className}>\n      <div className=\"relative bg-card\">\n        {/* Header */}\n        <div className={cn(\n          \"grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/50 sticky top-0 z-10\",\n        )}\n        style={{ gridTemplateColumns }}\n        >\n          {showCheckbox && (\n            <div className=\"flex items-center justify-center\">\n              <Checkbox \n                checked={data.length > 0 && selectedItems?.size === data.length}\n                onClick={(e) => {\n                  e.stopPropagation();\n                  data.forEach(item => onSelect?.(item.id, !selectedItems?.has(item.id)));\n                }}\n              />\n            </div>\n          )}\n          {columns.map(column => (\n            <div key={column.id} className={cn(\"px-2 font-medium\", column.className)}>\n              {column.header}\n            </div>\n          ))}\n        </div>\n\n        {/* Body */}\n        <div className={cn(\"divide-y divide-border/30 overflow-y-auto\")}\n          style={heightStyle}\n        >\n          {data.map((item, index) => (\n            <div\n              key={item.id}\n              className={cn(\n                \"grid items-center px-6 py-4 text-sm text-foreground hover:bg-muted/30 transition-colors duration-150 group cursor-pointer\",\n              )}\n              style={{ gridTemplateColumns }}\n              onClick={() => onRowClick?.(item)}\n            >\n              {showCheckbox && (\n                <div className=\"flex items-center justify-center\">\n                  <Checkbox \n                    checked={selectedItems?.has(item.id)}\n                    onClick={(e) => {\n                      e.stopPropagation();\n                      onSelect?.(item.id, !selectedItems?.has(item.id));\n                    }}\n                  />\n                </div>\n              )}\n              \n              {columns.map(column => (\n                <div \n                  key={column.id} \n                  className={cn(\n                    \"px-2 relative min-w-0\",\n                    column.className\n                  )}\n                  onMouseEnter={() => column.tooltipValue && setHoveredText(`${index}-${column.id}`)}\n                  onMouseLeave={() => setHoveredText(null)}\n                >\n                  <div className={cn(\n                    \"flex items-center gap-2\",\n                    column.truncate && \"overflow-hidden\"\n                  )}>\n                    <div className={cn(\n                      \"w-full\",\n                      column.truncate && \"truncate\"\n                    )}>\n                      {column.cell(item)}\n                    </div>\n                  </div>\n                  {column.tooltipValue && hoveredText === `${index}-${column.id}` && (\n                    <Tooltip\n                      content={column.tooltipValue(item)}\n                      side=\"bottom\"\n                      align='start'\n                      isVisible={true}\n                    />\n                  )}\n                </div>\n              ))}\n            </div>\n          ))}\n        </div>\n      </div>\n    </TableContainer>\n  );\n} "],"names":["TableContainer","children","className","cn","Table","data","columns","showCheckbox","onRowClick","selectedItems","onSelect","emptyState","isLoading","loadingRows","tableHeightOffset","hoveredText","setHoveredText","useState","heightStyle","gridTemplateColumns","col","TableSkeleton","jsx","_","index","jsxs","column","TableEmpty","Checkbox","e","item","Tooltip"],"mappings":"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"}

package/dist/components/table.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../jsx-runtime-BYECrxsp.cjs"),t=require("../utils-DSKoFOjv.cjs"),v=require("./checkbox.js"),g=require("./tooltip.js"),N=require("react"),y=require("./table-empty.js"),j=({children:n,className:x})=>s.jsxRuntimeExports.jsx("div",{className:t.cn("border border-border/50 rounded-lg overflow-hidden bg-background shadow-sm",x),children:n});function T({data:n,columns:x,showCheckbox:o=!0,onRowClick:p,className:l,selectedItems:i,onSelect:d,emptyState:h,isLoading:E=!1,loadingRows:b=5,tableHeight:m}){const[f,c]=N.useState(null),u=[o?"40px":null,...x.map(e=>e.width||"1fr")].filter(Boolean).join(" "),R=()=>s.jsxRuntimeExports.jsx("div",{className:t.cn("divide-y divide-border/30 overflow-y-auto",`h-[calc(100vh-${m})]`),children:Array(b).fill(0).map((e,a)=>s.jsxRuntimeExports.jsxs("div",{className:"grid items-center px-6 py-4 text-sm",style:{gridTemplateColumns:u},children:[o&&s.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-center",children:s.jsxRuntimeExports.jsx("div",{className:"h-4 w-4 rounded bg-muted animate-pulse"})}),x.map(r=>s.jsxRuntimeExports.jsx("div",{className:t.cn("px-2 relative min-w-0",r.className),children:s.jsxRuntimeExports.jsx("div",{className:"h-4 bg-muted rounded animate-pulse",style:{width:Math.random()*40+40+"%"}})},`skeleton-col-${r.id}`))]},`skeleton-${a}`))});return E?s.jsxRuntimeExports.jsx(j,{className:l,children:s.jsxRuntimeExports.jsxs("div",{className:"relative",children:[s.jsxRuntimeExports.jsxs("div",{className:t.cn("grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/30 sticky top-0 z-10"),style:{gridTemplateColumns:u},children:[o&&s.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-center",children:s.jsxRuntimeExports.jsx("div",{className:"h-4 w-4 rounded bg-muted animate-pulse"})}),x.map(e=>s.jsxRuntimeExports.jsx("div",{className:t.cn("px-2 font-medium",e.className),children:e.header},e.id))]}),s.jsxRuntimeExports.jsx(R,{})]})}):n.length===0?s.jsxRuntimeExports.jsx(j,{className:l,children:s.jsxRuntimeExports.jsx("div",{className:"relative",children:s.jsxRuntimeExports.jsx(y.TableEmpty,{...h})})}):s.jsxRuntimeExports.jsx(j,{className:l,children:s.jsxRuntimeExports.jsxs("div",{className:"relative",children:[s.jsxRuntimeExports.jsxs("div",{className:t.cn("grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/30 sticky top-0 z-10"),style:{gridTemplateColumns:u},children:[o&&s.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-center",children:s.jsxRuntimeExports.jsx(v.Checkbox,{checked:n.length>0&&(i==null?void 0:i.size)===n.length,onClick:e=>{e.stopPropagation(),n.forEach(a=>d==null?void 0:d(a.id,!(i!=null&&i.has(a.id))))}})}),x.map(e=>s.jsxRuntimeExports.jsx("div",{className:t.cn("px-2 font-medium",e.className),children:e.header},e.id))]}),s.jsxRuntimeExports.jsx("div",{className:t.cn("divide-y divide-border/30 overflow-y-auto",m||"h-[calc(100vh-12rem)]"),children:n.map((e,a)=>s.jsxRuntimeExports.jsxs("div",{className:t.cn("grid items-center px-6 py-4 text-sm text-foreground bg-background hover:bg-muted/30 transition-colors duration-150 group cursor-pointer"),style:{gridTemplateColumns:u},onClick:()=>p==null?void 0:p(e),children:[o&&s.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-center",children:s.jsxRuntimeExports.jsx(v.Checkbox,{checked:i==null?void 0:i.has(e.id),onClick:r=>{r.stopPropagation(),d==null||d(e.id,!(i!=null&&i.has(e.id)))}})}),x.map(r=>s.jsxRuntimeExports.jsxs("div",{className:t.cn("px-2 relative min-w-0",r.className),onMouseEnter:()=>r.tooltipValue&&c(`${a}-${r.id}`),onMouseLeave:()=>c(null),children:[s.jsxRuntimeExports.jsx("div",{className:t.cn("flex items-center gap-2",r.truncate&&"overflow-hidden"),children:s.jsxRuntimeExports.jsx("div",{className:t.cn("w-full",r.truncate&&"truncate"),children:r.cell(e)})}),r.tooltipValue&&f===`${a}-${r.id}`&&s.jsxRuntimeExports.jsx(g.Tooltip,{content:r.tooltipValue(e),side:"bottom",align:"start",isVisible:!0})]},r.id))]},e.id))})]})})}exports.Table=T;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../jsx-runtime-BYECrxsp.cjs"),t=require("../utils-DSKoFOjv.cjs"),v=require("./checkbox.js"),y=require("./tooltip.js"),N=require("react"),T=require("./table-empty.js"),j=({children:n,className:x})=>s.jsxRuntimeExports.jsx("div",{className:t.cn("border border-border/50 rounded-lg overflow-hidden bg-background shadow-sm",x),children:n});function $({data:n,columns:x,showCheckbox:o=!0,onRowClick:p,className:l,selectedItems:i,onSelect:d,emptyState:E,isLoading:b=!1,loadingRows:g=5,tableHeightOffset:c}){const[R,m]=N.useState(null),h={height:c?`calc(100vh - ${c})`:"calc(100vh - 8rem)"},u=[o?"40px":null,...x.map(e=>e.width||"1fr")].filter(Boolean).join(" "),f=()=>s.jsxRuntimeExports.jsx("div",{className:t.cn("divide-y divide-border/50 overflow-y-auto"),style:h,children:Array(g).fill(0).map((e,a)=>s.jsxRuntimeExports.jsxs("div",{className:"grid items-center px-6 py-4 text-sm",style:{gridTemplateColumns:u},children:[o&&s.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-center",children:s.jsxRuntimeExports.jsx("div",{className:"h-4 w-4 rounded bg-muted animate-pulse"})}),x.map(r=>s.jsxRuntimeExports.jsx("div",{className:t.cn("px-2 relative min-w-0",r.className),children:s.jsxRuntimeExports.jsx("div",{className:"h-4 bg-muted rounded animate-pulse",style:{width:Math.random()*40+40+"%"}})},`skeleton-col-${r.id}`))]},`skeleton-${a}`))});return b?s.jsxRuntimeExports.jsx(j,{className:l,children:s.jsxRuntimeExports.jsxs("div",{className:"relative bg-card",children:[s.jsxRuntimeExports.jsxs("div",{className:t.cn("grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/50 sticky top-0 z-10"),style:{gridTemplateColumns:u},children:[o&&s.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-center",children:s.jsxRuntimeExports.jsx("div",{className:"h-4 w-4 rounded bg-muted animate-pulse"})}),x.map(e=>s.jsxRuntimeExports.jsx("div",{className:t.cn("px-2 font-medium",e.className),children:e.header},e.id))]}),s.jsxRuntimeExports.jsx(f,{})]})}):n.length===0?s.jsxRuntimeExports.jsx(j,{className:l,children:s.jsxRuntimeExports.jsx("div",{className:"relative bg-card",children:s.jsxRuntimeExports.jsx(T.TableEmpty,{...E})})}):s.jsxRuntimeExports.jsx(j,{className:l,children:s.jsxRuntimeExports.jsxs("div",{className:"relative bg-card",children:[s.jsxRuntimeExports.jsxs("div",{className:t.cn("grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/50 sticky top-0 z-10"),style:{gridTemplateColumns:u},children:[o&&s.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-center",children:s.jsxRuntimeExports.jsx(v.Checkbox,{checked:n.length>0&&(i==null?void 0:i.size)===n.length,onClick:e=>{e.stopPropagation(),n.forEach(a=>d==null?void 0:d(a.id,!(i!=null&&i.has(a.id))))}})}),x.map(e=>s.jsxRuntimeExports.jsx("div",{className:t.cn("px-2 font-medium",e.className),children:e.header},e.id))]}),s.jsxRuntimeExports.jsx("div",{className:t.cn("divide-y divide-border/30 overflow-y-auto"),style:h,children:n.map((e,a)=>s.jsxRuntimeExports.jsxs("div",{className:t.cn("grid items-center px-6 py-4 text-sm text-foreground hover:bg-muted/30 transition-colors duration-150 group cursor-pointer"),style:{gridTemplateColumns:u},onClick:()=>p==null?void 0:p(e),children:[o&&s.jsxRuntimeExports.jsx("div",{className:"flex items-center justify-center",children:s.jsxRuntimeExports.jsx(v.Checkbox,{checked:i==null?void 0:i.has(e.id),onClick:r=>{r.stopPropagation(),d==null||d(e.id,!(i!=null&&i.has(e.id)))}})}),x.map(r=>s.jsxRuntimeExports.jsxs("div",{className:t.cn("px-2 relative min-w-0",r.className),onMouseEnter:()=>r.tooltipValue&&m(`${a}-${r.id}`),onMouseLeave:()=>m(null),children:[s.jsxRuntimeExports.jsx("div",{className:t.cn("flex items-center gap-2",r.truncate&&"overflow-hidden"),children:s.jsxRuntimeExports.jsx("div",{className:t.cn("w-full",r.truncate&&"truncate"),children:r.cell(e)})}),r.tooltipValue&&R===`${a}-${r.id}`&&s.jsxRuntimeExports.jsx(y.Tooltip,{content:r.tooltipValue(e),side:"bottom",align:"start",isVisible:!0})]},r.id))]},e.id))})]})})}exports.Table=$;
 //# sourceMappingURL=table.js.map

package/dist/components/table.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.js","sources":["../../src/components/table.tsx"],"sourcesContent":["import { cn } from \"@/lib/utils\"\nimport { Checkbox } from \"./checkbox\"\nimport { Tooltip } from \"./tooltip\"\nimport { useState } from \"react\"\nimport { TableEmpty } from \"./table-empty\"\n\nexport interface Column<T> {\n  id: string\n  header: string\n  width?: string\n  cell: (item: T) => React.ReactNode\n  className?: string\n  tooltipValue?: (item: T) => string\n  truncate?: boolean\n}\n\nexport interface TableProps<T> {\n  data: T[]\n  columns: Column<T>[]\n  showCheckbox?: boolean\n  onRowClick?: (item: T) => void\n  className?: string\n  selectedItems?: Set<string>\n  onSelect?: (id: string, checked: boolean) => void\n  emptyState?: {\n    title?: string\n    description?: string\n    actionLabel?: string\n    onAction?: () => void\n    icon?: React.ReactNode\n  }\n  isLoading?: boolean\n  loadingRows?: number\n  tableHeight?: string\n}\n\nconst TableContainer = ({ children, className }: { children: React.ReactNode, className?: string }) => {\n  return (\n    <div className={cn(\"border border-border/50 rounded-lg overflow-hidden bg-background shadow-sm\", className)}>\n      {children}\n    </div>\n  )\n} \nexport function Table<T extends { id: string }>({ \n  data, \n  columns, \n  showCheckbox = true,\n  onRowClick,\n  className,\n  selectedItems,\n  onSelect,\n  emptyState,\n  isLoading = false,\n  loadingRows = 5,\n  tableHeight\n}: TableProps<T>) {\n  const [hoveredText, setHoveredText] = useState<string | null>(null);\n\n  // Improved grid template calculation\n  const gridTemplateColumns = [\n    showCheckbox ? '40px' : null,\n    ...columns.map(col => col.width || '1fr')\n  ].filter(Boolean).join(' ');\n\n  // Loading skeleton component\n  const TableSkeleton = () => (\n    <div className={cn(\"divide-y divide-border/30 overflow-y-auto\", `h-[calc(100vh-${tableHeight})]`)}>\n      {Array(loadingRows).fill(0).map((_, index) => (\n        <div\n          key={`skeleton-${index}`}\n          className=\"grid items-center px-6 py-4 text-sm\"\n          style={{ gridTemplateColumns }}\n        >\n          {showCheckbox && (\n            <div className=\"flex items-center justify-center\">\n              <div className=\"h-4 w-4 rounded bg-muted animate-pulse\" />\n            </div>\n          )}\n          \n          {columns.map(column => (\n            <div \n              key={`skeleton-col-${column.id}`} \n              className={cn(\"px-2 relative min-w-0\", column.className)}\n            >\n              <div className=\"h-4 bg-muted rounded animate-pulse\" \n                   style={{ width: Math.random() * 40 + 40 + '%' }} />\n            </div>\n          ))}\n        </div>\n      ))}\n    </div>\n  );\n\n  if (isLoading) {\n    return (\n      <TableContainer className={className}>\n        <div className=\"relative\">\n          {/* Header */}\n          <div className={cn(\n            \"grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/30 sticky top-0 z-10\",\n          )}\n          style={{ gridTemplateColumns }}\n          >\n            {showCheckbox && (\n              <div className=\"flex items-center justify-center\">\n                <div className=\"h-4 w-4 rounded bg-muted animate-pulse\" />\n              </div>\n            )}\n            {columns.map(column => (\n              <div key={column.id} className={cn(\"px-2 font-medium\", column.className)}>\n                {column.header}\n              </div>\n            ))}\n          </div>\n\n          <TableSkeleton />\n        </div>\n      </TableContainer>\n    );\n  }\n\n  if (data.length === 0) {\n    return (\n      <TableContainer className={className}>\n        <div className=\"relative\">\n          <TableEmpty {...emptyState} />\n        </div>\n      </TableContainer>\n    );\n  }\n\n  return (\n    <TableContainer className={className}>\n      <div className=\"relative\">\n        {/* Header */}\n        <div className={cn(\n          \"grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/30 sticky top-0 z-10\",\n        )}\n        style={{ gridTemplateColumns }}\n        >\n          {showCheckbox && (\n            <div className=\"flex items-center justify-center\">\n              <Checkbox \n                checked={data.length > 0 && selectedItems?.size === data.length}\n                onClick={(e) => {\n                  e.stopPropagation();\n                  data.forEach(item => onSelect?.(item.id, !selectedItems?.has(item.id)));\n                }}\n              />\n            </div>\n          )}\n          {columns.map(column => (\n            <div key={column.id} className={cn(\"px-2 font-medium\", column.className)}>\n              {column.header}\n            </div>\n          ))}\n        </div>\n\n        {/* Body */}\n        <div className={cn(\"divide-y divide-border/30 overflow-y-auto\", tableHeight || \"h-[calc(100vh-12rem)]\")}>\n          {data.map((item, index) => (\n            <div\n              key={item.id}\n              className={cn(\n                \"grid items-center px-6 py-4 text-sm text-foreground bg-background hover:bg-muted/30 transition-colors duration-150 group cursor-pointer\",\n              )}\n              style={{ gridTemplateColumns }}\n              onClick={() => onRowClick?.(item)}\n            >\n              {showCheckbox && (\n                <div className=\"flex items-center justify-center\">\n                  <Checkbox \n                    checked={selectedItems?.has(item.id)}\n                    onClick={(e) => {\n                      e.stopPropagation();\n                      onSelect?.(item.id, !selectedItems?.has(item.id));\n                    }}\n                  />\n                </div>\n              )}\n              \n              {columns.map(column => (\n                <div \n                  key={column.id} \n                  className={cn(\n                    \"px-2 relative min-w-0\",\n                    column.className\n                  )}\n                  onMouseEnter={() => column.tooltipValue && setHoveredText(`${index}-${column.id}`)}\n                  onMouseLeave={() => setHoveredText(null)}\n                >\n                  <div className={cn(\n                    \"flex items-center gap-2\",\n                    column.truncate && \"overflow-hidden\"\n                  )}>\n                    <div className={cn(\n                      \"w-full\",\n                      column.truncate && \"truncate\"\n                    )}>\n                      {column.cell(item)}\n                    </div>\n                  </div>\n                  {column.tooltipValue && hoveredText === `${index}-${column.id}` && (\n                    <Tooltip\n                      content={column.tooltipValue(item)}\n                      side=\"bottom\"\n                      align='start'\n                      isVisible={true}\n                    />\n                  )}\n                </div>\n              ))}\n            </div>\n          ))}\n        </div>\n      </div>\n    </TableContainer>\n  );\n} "],"names":["TableContainer","children","className","cn","Table","data","columns","showCheckbox","onRowClick","selectedItems","onSelect","emptyState","isLoading","loadingRows","tableHeight","hoveredText","setHoveredText","useState","gridTemplateColumns","col","TableSkeleton","jsx","_","index","jsxs","column","TableEmpty","Checkbox","item","e","Tooltip"],"mappings":"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"}
+{"version":3,"file":"table.js","sources":["../../src/components/table.tsx"],"sourcesContent":["import { cn } from \"@/lib/utils\"\nimport { Checkbox } from \"./checkbox\"\nimport { Tooltip } from \"./tooltip\"\nimport { useState } from \"react\"\nimport { TableEmpty } from \"./table-empty\"\n\nexport interface Column<T> {\n  id: string\n  header: string\n  width?: string\n  cell: (item: T) => React.ReactNode\n  className?: string\n  tooltipValue?: (item: T) => string\n  truncate?: boolean\n}\n\nexport interface TableProps<T> {\n  data: T[]\n  columns: Column<T>[]\n  showCheckbox?: boolean\n  onRowClick?: (item: T) => void\n  className?: string\n  selectedItems?: Set<string>\n  onSelect?: (id: string, checked: boolean) => void\n  emptyState?: {\n    title?: string\n    description?: string\n    actionLabel?: string\n    onAction?: () => void\n    icon?: React.ReactNode\n  }\n  isLoading?: boolean\n  loadingRows?: number\n  tableHeightOffset?: string\n}\n\nconst TableContainer = ({ children, className }: { children: React.ReactNode, className?: string }) => {\n  return (\n    <div className={cn(\"border border-border/50 rounded-lg overflow-hidden bg-background shadow-sm\", className)}>\n      {children}\n    </div>\n  )\n} \nexport function Table<T extends { id: string }>({ \n  data, \n  columns, \n  showCheckbox = true,\n  onRowClick,\n  className,\n  selectedItems,\n  onSelect,\n  emptyState,\n  isLoading = false,\n  loadingRows = 5,\n  tableHeightOffset\n}: TableProps<T>) {\n  const [hoveredText, setHoveredText] = useState<string | null>(null);\n\n  const height = tableHeightOffset ? `calc(100vh - ${tableHeightOffset})` : \"calc(100vh - 8rem)\";\n  const heightStyle = { height };\n\n  // Improved grid template calculation\n  const gridTemplateColumns = [\n    showCheckbox ? '40px' : null,\n    ...columns.map(col => col.width || '1fr')\n  ].filter(Boolean).join(' ');\n\n  // Loading skeleton component\n  const TableSkeleton = () => (\n    <div className={cn(\"divide-y divide-border/50 overflow-y-auto\")}\n      style={heightStyle}\n    >\n      {Array(loadingRows).fill(0).map((_, index) => (\n        <div\n          key={`skeleton-${index}`}\n          className=\"grid items-center px-6 py-4 text-sm\"\n          style={{ gridTemplateColumns }}\n        >\n          {showCheckbox && (\n            <div className=\"flex items-center justify-center\">\n              <div className=\"h-4 w-4 rounded bg-muted animate-pulse\" />\n            </div>\n          )}\n          \n          {columns.map(column => (\n            <div \n              key={`skeleton-col-${column.id}`} \n              className={cn(\"px-2 relative min-w-0\", column.className)}\n            >\n              <div className=\"h-4 bg-muted rounded animate-pulse\" \n                   style={{ width: Math.random() * 40 + 40 + '%' }} />\n            </div>\n          ))}\n        </div>\n      ))}\n    </div>\n  );\n\n  if (isLoading) {\n    return (\n      <TableContainer className={className}>\n        <div className=\"relative bg-card\">\n          {/* Header */}\n          <div className={cn(\n            \"grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/50 sticky top-0 z-10\",\n          )}\n          style={{ gridTemplateColumns }}\n          >\n            {showCheckbox && (\n              <div className=\"flex items-center justify-center\">\n                <div className=\"h-4 w-4 rounded bg-muted animate-pulse\" />\n              </div>\n            )}\n            {columns.map(column => (\n              <div key={column.id} className={cn(\"px-2 font-medium\", column.className)}>\n                {column.header}\n              </div>\n            ))}\n          </div>\n\n          <TableSkeleton />\n        </div>\n      </TableContainer>\n    );\n  }\n\n  if (data.length === 0) {\n    return (\n      <TableContainer className={className}>\n        <div className=\"relative bg-card\">\n          <TableEmpty {...emptyState} />\n        </div>\n      </TableContainer>\n    );\n  }\n\n  return (\n    <TableContainer className={className}>\n      <div className=\"relative bg-card\">\n        {/* Header */}\n        <div className={cn(\n          \"grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-border/50 sticky top-0 z-10\",\n        )}\n        style={{ gridTemplateColumns }}\n        >\n          {showCheckbox && (\n            <div className=\"flex items-center justify-center\">\n              <Checkbox \n                checked={data.length > 0 && selectedItems?.size === data.length}\n                onClick={(e) => {\n                  e.stopPropagation();\n                  data.forEach(item => onSelect?.(item.id, !selectedItems?.has(item.id)));\n                }}\n              />\n            </div>\n          )}\n          {columns.map(column => (\n            <div key={column.id} className={cn(\"px-2 font-medium\", column.className)}>\n              {column.header}\n            </div>\n          ))}\n        </div>\n\n        {/* Body */}\n        <div className={cn(\"divide-y divide-border/30 overflow-y-auto\")}\n          style={heightStyle}\n        >\n          {data.map((item, index) => (\n            <div\n              key={item.id}\n              className={cn(\n                \"grid items-center px-6 py-4 text-sm text-foreground hover:bg-muted/30 transition-colors duration-150 group cursor-pointer\",\n              )}\n              style={{ gridTemplateColumns }}\n              onClick={() => onRowClick?.(item)}\n            >\n              {showCheckbox && (\n                <div className=\"flex items-center justify-center\">\n                  <Checkbox \n                    checked={selectedItems?.has(item.id)}\n                    onClick={(e) => {\n                      e.stopPropagation();\n                      onSelect?.(item.id, !selectedItems?.has(item.id));\n                    }}\n                  />\n                </div>\n              )}\n              \n              {columns.map(column => (\n                <div \n                  key={column.id} \n                  className={cn(\n                    \"px-2 relative min-w-0\",\n                    column.className\n                  )}\n                  onMouseEnter={() => column.tooltipValue && setHoveredText(`${index}-${column.id}`)}\n                  onMouseLeave={() => setHoveredText(null)}\n                >\n                  <div className={cn(\n                    \"flex items-center gap-2\",\n                    column.truncate && \"overflow-hidden\"\n                  )}>\n                    <div className={cn(\n                      \"w-full\",\n                      column.truncate && \"truncate\"\n                    )}>\n                      {column.cell(item)}\n                    </div>\n                  </div>\n                  {column.tooltipValue && hoveredText === `${index}-${column.id}` && (\n                    <Tooltip\n                      content={column.tooltipValue(item)}\n                      side=\"bottom\"\n                      align='start'\n                      isVisible={true}\n                    />\n                  )}\n                </div>\n              ))}\n            </div>\n          ))}\n        </div>\n      </div>\n    </TableContainer>\n  );\n} "],"names":["TableContainer","children","className","cn","Table","data","columns","showCheckbox","onRowClick","selectedItems","onSelect","emptyState","isLoading","loadingRows","tableHeightOffset","hoveredText","setHoveredText","useState","heightStyle","gridTemplateColumns","col","TableSkeleton","jsx","_","index","jsxs","column","TableEmpty","Checkbox","item","e","Tooltip"],"mappings":"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"}

package/dist/components/tooltip.esm.js

@@ -1,13 +1,13 @@
-import { j as o } from "../jsx-runtime-DGlMoOmv.js";
-import { AnimatePresence as b, motion as a } from "framer-motion";
-import { c as s } from "../utils-qaFjX9_3.js";
-function h({ content: t, side: e = "right", align: r = "center", isVisible: l }) {
-  return /* @__PURE__ */ o.jsx(b, { children: l && /* @__PURE__ */ o.jsxs(
-    a.div,
+import { j as r } from "../jsx-runtime-DGlMoOmv.js";
+import { AnimatePresence as n, motion as c } from "framer-motion";
+import { c as i } from "../utils-qaFjX9_3.js";
+function b({ content: t, side: o = "right", align: e = "center", isVisible: s }) {
+  return /* @__PURE__ */ r.jsx(n, { children: s && /* @__PURE__ */ r.jsx(
+    c.div,
     {
       initial: {
         opacity: 0,
-        ...n(e)
+        ...a(o)
       },
       animate: {
         opacity: 1,
@@ -16,30 +16,19 @@ function h({ content: t, side: e = "right", align: r = "center", isVisible: l })
       },
       exit: {
         opacity: 0,
-        ...n(e)
+        ...a(o)
       },
       transition: { duration: 0.15, ease: "easeOut" },
-      className: s(
+      className: i(
         "absolute z-[100] px-2.5 py-1.5 rounded-md text-xs font-medium whitespace-nowrap",
-        "bg-background border border-border shadow-lg",
-        c(e, r)
+        "bg-background border border-border/50 shadow-lg",
+        p(o, e)
       ),
-      children: [
-        t,
-        /* @__PURE__ */ o.jsx(
-          a.div,
-          {
-            className: s(
-              "absolute w-1.5 h-1.5 rotate-45 bg-background border border-border",
-              p(e)
-            )
-          }
-        )
-      ]
+      children: t
     }
   ) });
 }
-const n = (t) => {
+const a = (t) => {
   switch (t) {
     case "right":
       return { x: -5 };
@@ -52,49 +41,36 @@ const n = (t) => {
     default:
       return { x: 0, y: 0 };
   }
-}, c = (t, e) => {
-  const r = [];
+}, p = (t, o) => {
+  const e = [];
   switch (t) {
     case "right":
-      r.push("left-full ml-2");
+      e.push("left-full ml-2");
       break;
     case "left":
-      r.push("right-full mr-2");
+      e.push("right-full mr-2");
       break;
     case "top":
-      r.push("bottom-full mb-2");
+      e.push("bottom-full mb-2");
       break;
     case "bottom":
-      r.push("top-full mt-2");
+      e.push("top-full mt-2");
       break;
   }
-  switch (e) {
+  switch (o) {
     case "start":
-      r.push(t === "top" || t === "bottom" ? "left-0" : "top-0");
+      e.push(t === "top" || t === "bottom" ? "left-0" : "top-0");
       break;
     case "center":
-      r.push(t === "top" || t === "bottom" ? "left-1/2 -translate-x-1/2" : "top-1/2 -translate-y-1/2");
+      e.push(t === "top" || t === "bottom" ? "left-1/2 -translate-x-1/2" : "top-1/2 -translate-y-1/2");
       break;
     case "end":
-      r.push(t === "top" || t === "bottom" ? "right-0" : "bottom-0");
+      e.push(t === "top" || t === "bottom" ? "right-0" : "bottom-0");
       break;
   }
-  return r.join(" ");
-}, p = (t) => {
-  switch (t) {
-    case "right":
-      return "-left-[4px] top-1/2 -translate-y-1/2 border-r-0 border-t-0";
-    case "left":
-      return "-right-[4px] top-1/2 -translate-y-1/2 border-l-0 border-b-0";
-    case "top":
-      return "-bottom-[4px] left-1/2 -translate-x-1/2 border-l-0 border-t-0";
-    case "bottom":
-      return "-top-[4px] left-1/2 -translate-x-1/2 border-r-0 border-b-0";
-    default:
-      return "";
-  }
+  return e.join(" ");
 };
 export {
-  h as Tooltip
+  b as Tooltip
 };
 //# sourceMappingURL=tooltip.esm.js.map

package/dist/components/tooltip.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.esm.js","sources":["../../src/components/tooltip.tsx"],"sourcesContent":["import { motion, AnimatePresence } from 'framer-motion';\nimport { cn } from '@/lib/utils';\n\ninterface TooltipProps {\n  content: string | React.ReactNode;\n  side?: 'left' | 'right' | 'top' | 'bottom';\n  align?: 'start' | 'center' | 'end';\n  isVisible: boolean;\n}\n\nexport function Tooltip({ content, side = 'right', align = 'center', isVisible }: TooltipProps) {\n  return (\n    <AnimatePresence>\n      {isVisible && (\n        <motion.div\n          initial={{ \n            opacity: 0, \n            ...getInitialPosition(side)\n          }}\n          animate={{ \n            opacity: 1, \n            x: 0,\n            y: 0 \n          }}\n          exit={{ \n            opacity: 0, \n            ...getInitialPosition(side)\n          }}\n          transition={{ duration: 0.15, ease: 'easeOut' }}\n          className={cn(\n            'absolute z-[100] px-2.5 py-1.5 rounded-md text-xs font-medium whitespace-nowrap',\n            'bg-background border border-border shadow-lg',\n            getPositionClasses(side, align)\n          )}\n        >\n          {content}\n          <motion.div\n            className={cn(\n              'absolute w-1.5 h-1.5 rotate-45 bg-background border border-border',\n              getArrowClasses(side)\n            )}\n          />\n        </motion.div>\n      )}\n    </AnimatePresence>\n  );\n}\n\nconst getInitialPosition = (side: string) => {\n  switch (side) {\n    case 'right':\n      return { x: -5 };\n    case 'left':\n      return { x: 5 };\n    case 'top':\n      return { y: 5 };\n    case 'bottom':\n      return { y: -5 };\n    default:\n      return { x: 0, y: 0 };\n  }\n};\n\nconst getPositionClasses = (side: string, align: string) => {\n  const baseClasses = [];\n\n  switch (side) {\n    case 'right':\n      baseClasses.push('left-full ml-2');\n      break;\n    case 'left':\n      baseClasses.push('right-full mr-2');\n      break;\n    case 'top':\n      baseClasses.push('bottom-full mb-2');\n      break;\n    case 'bottom':\n      baseClasses.push('top-full mt-2');\n      break;\n  }\n\n  switch (align) {\n    case 'start':\n      baseClasses.push((side === 'top' || side === 'bottom') ? 'left-0' : 'top-0');\n      break;\n    case 'center':\n      baseClasses.push((side === 'top' || side === 'bottom') ? 'left-1/2 -translate-x-1/2' : 'top-1/2 -translate-y-1/2');\n      break;\n    case 'end':\n      baseClasses.push((side === 'top' || side === 'bottom') ? 'right-0' : 'bottom-0');\n      break;\n  }\n\n  return baseClasses.join(' ');\n};\n\nconst getArrowClasses = (side: string) => {\n  switch (side) {\n    case 'right':\n      return '-left-[4px] top-1/2 -translate-y-1/2 border-r-0 border-t-0';\n    case 'left':\n      return '-right-[4px] top-1/2 -translate-y-1/2 border-l-0 border-b-0';\n    case 'top':\n      return '-bottom-[4px] left-1/2 -translate-x-1/2 border-l-0 border-t-0';\n    case 'bottom':\n      return '-top-[4px] left-1/2 -translate-x-1/2 border-r-0 border-b-0';\n    default:\n      return '';\n  }\n};"],"names":["Tooltip","content","side","align","isVisible","jsx","AnimatePresence","jsxs","motion","getInitialPosition","cn","getPositionClasses","getArrowClasses","baseClasses"],"mappings":";;;AAUO,SAASA,EAAQ,EAAE,SAAAC,GAAS,MAAAC,IAAO,SAAS,OAAAC,IAAQ,UAAU,WAAAC,KAA2B;AAC9F,SACEC,gBAAAA,EAAAA,IAACC,KACE,UAAAF,KACCG,gBAAAA,EAAAA;AAAAA,IAACC,EAAO;AAAA,IAAP;AAAA,MACC,SAAS;AAAA,QACP,SAAS;AAAA,QACT,GAAGC,EAAmBP,CAAI;AAAA,MAAA;AAAA,MAE5B,SAAS;AAAA,QACP,SAAS;AAAA,QACT,GAAG;AAAA,QACH,GAAG;AAAA,MAAA;AAAA,MAEL,MAAM;AAAA,QACJ,SAAS;AAAA,QACT,GAAGO,EAAmBP,CAAI;AAAA,MAAA;AAAA,MAE5B,YAAY,EAAE,UAAU,MAAM,MAAM,UAAA;AAAA,MACpC,WAAWQ;AAAA,QACT;AAAA,QACA;AAAA,QACAC,EAAmBT,GAAMC,CAAK;AAAA,MAAA;AAAA,MAG/B,UAAA;AAAA,QAAAF;AAAA,QACDI,gBAAAA,EAAAA;AAAAA,UAACG,EAAO;AAAA,UAAP;AAAA,YACC,WAAWE;AAAA,cACT;AAAA,cACAE,EAAgBV,CAAI;AAAA,YAAA;AAAA,UACtB;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA,GAGN;AAEJ;AAEA,MAAMO,IAAqB,CAACP,MAAiB;AAC3C,UAAQA,GAAA;AAAA,IACN,KAAK;AACH,aAAO,EAAE,GAAG,GAAA;AAAA,IACd,KAAK;AACH,aAAO,EAAE,GAAG,EAAA;AAAA,IACd,KAAK;AACH,aAAO,EAAE,GAAG,EAAA;AAAA,IACd,KAAK;AACH,aAAO,EAAE,GAAG,GAAA;AAAA,IACd;AACE,aAAO,EAAE,GAAG,GAAG,GAAG,EAAA;AAAA,EAAE;AAE1B,GAEMS,IAAqB,CAACT,GAAcC,MAAkB;AAC1D,QAAMU,IAAc,CAAA;AAEpB,UAAQX,GAAA;AAAA,IACN,KAAK;AACH,MAAAW,EAAY,KAAK,gBAAgB;AACjC;AAAA,IACF,KAAK;AACH,MAAAA,EAAY,KAAK,iBAAiB;AAClC;AAAA,IACF,KAAK;AACH,MAAAA,EAAY,KAAK,kBAAkB;AACnC;AAAA,IACF,KAAK;AACH,MAAAA,EAAY,KAAK,eAAe;AAChC;AAAA,EAAA;AAGJ,UAAQV,GAAA;AAAA,IACN,KAAK;AACH,MAAAU,EAAY,KAAMX,MAAS,SAASA,MAAS,WAAY,WAAW,OAAO;AAC3E;AAAA,IACF,KAAK;AACH,MAAAW,EAAY,KAAMX,MAAS,SAASA,MAAS,WAAY,8BAA8B,0BAA0B;AACjH;AAAA,IACF,KAAK;AACH,MAAAW,EAAY,KAAMX,MAAS,SAASA,MAAS,WAAY,YAAY,UAAU;AAC/E;AAAA,EAAA;AAGJ,SAAOW,EAAY,KAAK,GAAG;AAC7B,GAEMD,IAAkB,CAACV,MAAiB;AACxC,UAAQA,GAAA;AAAA,IACN,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EAAA;AAEb;"}
+{"version":3,"file":"tooltip.esm.js","sources":["../../src/components/tooltip.tsx"],"sourcesContent":["import { motion, AnimatePresence } from 'framer-motion';\nimport { cn } from '@/lib/utils';\n\ninterface TooltipProps {\n  content: string | React.ReactNode;\n  side?: 'left' | 'right' | 'top' | 'bottom';\n  align?: 'start' | 'center' | 'end';\n  isVisible: boolean;\n}\n\nexport function Tooltip({ content, side = 'right', align = 'center', isVisible }: TooltipProps) {\n  return (\n    <AnimatePresence>\n      {isVisible && (\n        <motion.div\n          initial={{ \n            opacity: 0, \n            ...getInitialPosition(side)\n          }}\n          animate={{ \n            opacity: 1, \n            x: 0,\n            y: 0 \n          }}\n          exit={{ \n            opacity: 0, \n            ...getInitialPosition(side)\n          }}\n          transition={{ duration: 0.15, ease: 'easeOut' }}\n          className={cn(\n            'absolute z-[100] px-2.5 py-1.5 rounded-md text-xs font-medium whitespace-nowrap',\n            'bg-background border border-border/50 shadow-lg',\n            getPositionClasses(side, align)\n          )}\n        >\n          {content}\n        </motion.div>\n      )}\n    </AnimatePresence>\n  );\n}\n\nconst getInitialPosition = (side: string) => {\n  switch (side) {\n    case 'right':\n      return { x: -5 };\n    case 'left':\n      return { x: 5 };\n    case 'top':\n      return { y: 5 };\n    case 'bottom':\n      return { y: -5 };\n    default:\n      return { x: 0, y: 0 };\n  }\n};\n\nconst getPositionClasses = (side: string, align: string) => {\n  const baseClasses = [];\n\n  switch (side) {\n    case 'right':\n      baseClasses.push('left-full ml-2');\n      break;\n    case 'left':\n      baseClasses.push('right-full mr-2');\n      break;\n    case 'top':\n      baseClasses.push('bottom-full mb-2');\n      break;\n    case 'bottom':\n      baseClasses.push('top-full mt-2');\n      break;\n  }\n\n  switch (align) {\n    case 'start':\n      baseClasses.push((side === 'top' || side === 'bottom') ? 'left-0' : 'top-0');\n      break;\n    case 'center':\n      baseClasses.push((side === 'top' || side === 'bottom') ? 'left-1/2 -translate-x-1/2' : 'top-1/2 -translate-y-1/2');\n      break;\n    case 'end':\n      baseClasses.push((side === 'top' || side === 'bottom') ? 'right-0' : 'bottom-0');\n      break;\n  }\n\n  return baseClasses.join(' ');\n};\n"],"names":["Tooltip","content","side","align","isVisible","jsx","AnimatePresence","motion","getInitialPosition","cn","getPositionClasses","baseClasses"],"mappings":";;;AAUO,SAASA,EAAQ,EAAE,SAAAC,GAAS,MAAAC,IAAO,SAAS,OAAAC,IAAQ,UAAU,WAAAC,KAA2B;AAC9F,SACEC,gBAAAA,EAAAA,IAACC,KACE,UAAAF,KACCC,gBAAAA,EAAAA;AAAAA,IAACE,EAAO;AAAA,IAAP;AAAA,MACC,SAAS;AAAA,QACP,SAAS;AAAA,QACT,GAAGC,EAAmBN,CAAI;AAAA,MAAA;AAAA,MAE5B,SAAS;AAAA,QACP,SAAS;AAAA,QACT,GAAG;AAAA,QACH,GAAG;AAAA,MAAA;AAAA,MAEL,MAAM;AAAA,QACJ,SAAS;AAAA,QACT,GAAGM,EAAmBN,CAAI;AAAA,MAAA;AAAA,MAE5B,YAAY,EAAE,UAAU,MAAM,MAAM,UAAA;AAAA,MACpC,WAAWO;AAAA,QACT;AAAA,QACA;AAAA,QACAC,EAAmBR,GAAMC,CAAK;AAAA,MAAA;AAAA,MAG/B,UAAAF;AAAA,IAAA;AAAA,EAAA,GAGP;AAEJ;AAEA,MAAMO,IAAqB,CAACN,MAAiB;AAC3C,UAAQA,GAAA;AAAA,IACN,KAAK;AACH,aAAO,EAAE,GAAG,GAAA;AAAA,IACd,KAAK;AACH,aAAO,EAAE,GAAG,EAAA;AAAA,IACd,KAAK;AACH,aAAO,EAAE,GAAG,EAAA;AAAA,IACd,KAAK;AACH,aAAO,EAAE,GAAG,GAAA;AAAA,IACd;AACE,aAAO,EAAE,GAAG,GAAG,GAAG,EAAA;AAAA,EAAE;AAE1B,GAEMQ,IAAqB,CAACR,GAAcC,MAAkB;AAC1D,QAAMQ,IAAc,CAAA;AAEpB,UAAQT,GAAA;AAAA,IACN,KAAK;AACH,MAAAS,EAAY,KAAK,gBAAgB;AACjC;AAAA,IACF,KAAK;AACH,MAAAA,EAAY,KAAK,iBAAiB;AAClC;AAAA,IACF,KAAK;AACH,MAAAA,EAAY,KAAK,kBAAkB;AACnC;AAAA,IACF,KAAK;AACH,MAAAA,EAAY,KAAK,eAAe;AAChC;AAAA,EAAA;AAGJ,UAAQR,GAAA;AAAA,IACN,KAAK;AACH,MAAAQ,EAAY,KAAMT,MAAS,SAASA,MAAS,WAAY,WAAW,OAAO;AAC3E;AAAA,IACF,KAAK;AACH,MAAAS,EAAY,KAAMT,MAAS,SAASA,MAAS,WAAY,8BAA8B,0BAA0B;AACjH;AAAA,IACF,KAAK;AACH,MAAAS,EAAY,KAAMT,MAAS,SAASA,MAAS,WAAY,YAAY,UAAU;AAC/E;AAAA,EAAA;AAGJ,SAAOS,EAAY,KAAK,GAAG;AAC7B;"}

package/dist/components/tooltip.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../jsx-runtime-BYECrxsp.cjs"),s=require("framer-motion"),a=require("../utils-DSKoFOjv.cjs");function i({content:t,side:r="right",align:e="center",isVisible:l}){return o.jsxRuntimeExports.jsx(s.AnimatePresence,{children:l&&o.jsxRuntimeExports.jsxs(s.motion.div,{initial:{opacity:0,...n(r)},animate:{opacity:1,x:0,y:0},exit:{opacity:0,...n(r)},transition:{duration:.15,ease:"easeOut"},className:a.cn("absolute z-[100] px-2.5 py-1.5 rounded-md text-xs font-medium whitespace-nowrap","bg-background border border-border shadow-lg",u(r,e)),children:[t,o.jsxRuntimeExports.jsx(s.motion.div,{className:a.cn("absolute w-1.5 h-1.5 rotate-45 bg-background border border-border",c(r))})]})})}const n=t=>{switch(t){case"right":return{x:-5};case"left":return{x:5};case"top":return{y:5};case"bottom":return{y:-5};default:return{x:0,y:0}}},u=(t,r)=>{const e=[];switch(t){case"right":e.push("left-full ml-2");break;case"left":e.push("right-full mr-2");break;case"top":e.push("bottom-full mb-2");break;case"bottom":e.push("top-full mt-2");break}switch(r){case"start":e.push(t==="top"||t==="bottom"?"left-0":"top-0");break;case"center":e.push(t==="top"||t==="bottom"?"left-1/2 -translate-x-1/2":"top-1/2 -translate-y-1/2");break;case"end":e.push(t==="top"||t==="bottom"?"right-0":"bottom-0");break}return e.join(" ")},c=t=>{switch(t){case"right":return"-left-[4px] top-1/2 -translate-y-1/2 border-r-0 border-t-0";case"left":return"-right-[4px] top-1/2 -translate-y-1/2 border-l-0 border-b-0";case"top":return"-bottom-[4px] left-1/2 -translate-x-1/2 border-l-0 border-t-0";case"bottom":return"-top-[4px] left-1/2 -translate-x-1/2 border-r-0 border-b-0";default:return""}};exports.Tooltip=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../jsx-runtime-BYECrxsp.cjs"),s=require("framer-motion"),i=require("../utils-DSKoFOjv.cjs");function u({content:t,side:o="right",align:e="center",isVisible:n}){return r.jsxRuntimeExports.jsx(s.AnimatePresence,{children:n&&r.jsxRuntimeExports.jsx(s.motion.div,{initial:{opacity:0,...a(o)},animate:{opacity:1,x:0,y:0},exit:{opacity:0,...a(o)},transition:{duration:.15,ease:"easeOut"},className:i.cn("absolute z-[100] px-2.5 py-1.5 rounded-md text-xs font-medium whitespace-nowrap","bg-background border border-border/50 shadow-lg",c(o,e)),children:t})})}const a=t=>{switch(t){case"right":return{x:-5};case"left":return{x:5};case"top":return{y:5};case"bottom":return{y:-5};default:return{x:0,y:0}}},c=(t,o)=>{const e=[];switch(t){case"right":e.push("left-full ml-2");break;case"left":e.push("right-full mr-2");break;case"top":e.push("bottom-full mb-2");break;case"bottom":e.push("top-full mt-2");break}switch(o){case"start":e.push(t==="top"||t==="bottom"?"left-0":"top-0");break;case"center":e.push(t==="top"||t==="bottom"?"left-1/2 -translate-x-1/2":"top-1/2 -translate-y-1/2");break;case"end":e.push(t==="top"||t==="bottom"?"right-0":"bottom-0");break}return e.join(" ")};exports.Tooltip=u;
 //# sourceMappingURL=tooltip.js.map

package/dist/components/tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.js","sources":["../../src/components/tooltip.tsx"],"sourcesContent":["import { motion, AnimatePresence } from 'framer-motion';\nimport { cn } from '@/lib/utils';\n\ninterface TooltipProps {\n  content: string | React.ReactNode;\n  side?: 'left' | 'right' | 'top' | 'bottom';\n  align?: 'start' | 'center' | 'end';\n  isVisible: boolean;\n}\n\nexport function Tooltip({ content, side = 'right', align = 'center', isVisible }: TooltipProps) {\n  return (\n    <AnimatePresence>\n      {isVisible && (\n        <motion.div\n          initial={{ \n            opacity: 0, \n            ...getInitialPosition(side)\n          }}\n          animate={{ \n            opacity: 1, \n            x: 0,\n            y: 0 \n          }}\n          exit={{ \n            opacity: 0, \n            ...getInitialPosition(side)\n          }}\n          transition={{ duration: 0.15, ease: 'easeOut' }}\n          className={cn(\n            'absolute z-[100] px-2.5 py-1.5 rounded-md text-xs font-medium whitespace-nowrap',\n            'bg-background border border-border shadow-lg',\n            getPositionClasses(side, align)\n          )}\n        >\n          {content}\n          <motion.div\n            className={cn(\n              'absolute w-1.5 h-1.5 rotate-45 bg-background border border-border',\n              getArrowClasses(side)\n            )}\n          />\n        </motion.div>\n      )}\n    </AnimatePresence>\n  );\n}\n\nconst getInitialPosition = (side: string) => {\n  switch (side) {\n    case 'right':\n      return { x: -5 };\n    case 'left':\n      return { x: 5 };\n    case 'top':\n      return { y: 5 };\n    case 'bottom':\n      return { y: -5 };\n    default:\n      return { x: 0, y: 0 };\n  }\n};\n\nconst getPositionClasses = (side: string, align: string) => {\n  const baseClasses = [];\n\n  switch (side) {\n    case 'right':\n      baseClasses.push('left-full ml-2');\n      break;\n    case 'left':\n      baseClasses.push('right-full mr-2');\n      break;\n    case 'top':\n      baseClasses.push('bottom-full mb-2');\n      break;\n    case 'bottom':\n      baseClasses.push('top-full mt-2');\n      break;\n  }\n\n  switch (align) {\n    case 'start':\n      baseClasses.push((side === 'top' || side === 'bottom') ? 'left-0' : 'top-0');\n      break;\n    case 'center':\n      baseClasses.push((side === 'top' || side === 'bottom') ? 'left-1/2 -translate-x-1/2' : 'top-1/2 -translate-y-1/2');\n      break;\n    case 'end':\n      baseClasses.push((side === 'top' || side === 'bottom') ? 'right-0' : 'bottom-0');\n      break;\n  }\n\n  return baseClasses.join(' ');\n};\n\nconst getArrowClasses = (side: string) => {\n  switch (side) {\n    case 'right':\n      return '-left-[4px] top-1/2 -translate-y-1/2 border-r-0 border-t-0';\n    case 'left':\n      return '-right-[4px] top-1/2 -translate-y-1/2 border-l-0 border-b-0';\n    case 'top':\n      return '-bottom-[4px] left-1/2 -translate-x-1/2 border-l-0 border-t-0';\n    case 'bottom':\n      return '-top-[4px] left-1/2 -translate-x-1/2 border-r-0 border-b-0';\n    default:\n      return '';\n  }\n};"],"names":["Tooltip","content","side","align","isVisible","jsx","AnimatePresence","jsxs","motion","getInitialPosition","cn","getPositionClasses","getArrowClasses","baseClasses"],"mappings":"6LAUO,SAASA,EAAQ,CAAE,QAAAC,EAAS,KAAAC,EAAO,QAAS,MAAAC,EAAQ,SAAU,UAAAC,GAA2B,CAC9F,OACEC,EAAAA,kBAAAA,IAACC,EAAAA,iBACE,SAAAF,GACCG,EAAAA,kBAAAA,KAACC,EAAAA,OAAO,IAAP,CACC,QAAS,CACP,QAAS,EACT,GAAGC,EAAmBP,CAAI,CAAA,EAE5B,QAAS,CACP,QAAS,EACT,EAAG,EACH,EAAG,CAAA,EAEL,KAAM,CACJ,QAAS,EACT,GAAGO,EAAmBP,CAAI,CAAA,EAE5B,WAAY,CAAE,SAAU,IAAM,KAAM,SAAA,EACpC,UAAWQ,EAAAA,GACT,kFACA,+CACAC,EAAmBT,EAAMC,CAAK,CAAA,EAG/B,SAAA,CAAAF,EACDI,EAAAA,kBAAAA,IAACG,EAAAA,OAAO,IAAP,CACC,UAAWE,EAAAA,GACT,oEACAE,EAAgBV,CAAI,CAAA,CACtB,CAAA,CACF,CAAA,CAAA,EAGN,CAEJ,CAEA,MAAMO,EAAsBP,GAAiB,CAC3C,OAAQA,EAAA,CACN,IAAK,QACH,MAAO,CAAE,EAAG,EAAA,EACd,IAAK,OACH,MAAO,CAAE,EAAG,CAAA,EACd,IAAK,MACH,MAAO,CAAE,EAAG,CAAA,EACd,IAAK,SACH,MAAO,CAAE,EAAG,EAAA,EACd,QACE,MAAO,CAAE,EAAG,EAAG,EAAG,CAAA,CAAE,CAE1B,EAEMS,EAAqB,CAACT,EAAcC,IAAkB,CAC1D,MAAMU,EAAc,CAAA,EAEpB,OAAQX,EAAA,CACN,IAAK,QACHW,EAAY,KAAK,gBAAgB,EACjC,MACF,IAAK,OACHA,EAAY,KAAK,iBAAiB,EAClC,MACF,IAAK,MACHA,EAAY,KAAK,kBAAkB,EACnC,MACF,IAAK,SACHA,EAAY,KAAK,eAAe,EAChC,KAAA,CAGJ,OAAQV,EAAA,CACN,IAAK,QACHU,EAAY,KAAMX,IAAS,OAASA,IAAS,SAAY,SAAW,OAAO,EAC3E,MACF,IAAK,SACHW,EAAY,KAAMX,IAAS,OAASA,IAAS,SAAY,4BAA8B,0BAA0B,EACjH,MACF,IAAK,MACHW,EAAY,KAAMX,IAAS,OAASA,IAAS,SAAY,UAAY,UAAU,EAC/E,KAAA,CAGJ,OAAOW,EAAY,KAAK,GAAG,CAC7B,EAEMD,EAAmBV,GAAiB,CACxC,OAAQA,EAAA,CACN,IAAK,QACH,MAAO,6DACT,IAAK,OACH,MAAO,8DACT,IAAK,MACH,MAAO,gEACT,IAAK,SACH,MAAO,6DACT,QACE,MAAO,EAAA,CAEb"}
+{"version":3,"file":"tooltip.js","sources":["../../src/components/tooltip.tsx"],"sourcesContent":["import { motion, AnimatePresence } from 'framer-motion';\nimport { cn } from '@/lib/utils';\n\ninterface TooltipProps {\n  content: string | React.ReactNode;\n  side?: 'left' | 'right' | 'top' | 'bottom';\n  align?: 'start' | 'center' | 'end';\n  isVisible: boolean;\n}\n\nexport function Tooltip({ content, side = 'right', align = 'center', isVisible }: TooltipProps) {\n  return (\n    <AnimatePresence>\n      {isVisible && (\n        <motion.div\n          initial={{ \n            opacity: 0, \n            ...getInitialPosition(side)\n          }}\n          animate={{ \n            opacity: 1, \n            x: 0,\n            y: 0 \n          }}\n          exit={{ \n            opacity: 0, \n            ...getInitialPosition(side)\n          }}\n          transition={{ duration: 0.15, ease: 'easeOut' }}\n          className={cn(\n            'absolute z-[100] px-2.5 py-1.5 rounded-md text-xs font-medium whitespace-nowrap',\n            'bg-background border border-border/50 shadow-lg',\n            getPositionClasses(side, align)\n          )}\n        >\n          {content}\n        </motion.div>\n      )}\n    </AnimatePresence>\n  );\n}\n\nconst getInitialPosition = (side: string) => {\n  switch (side) {\n    case 'right':\n      return { x: -5 };\n    case 'left':\n      return { x: 5 };\n    case 'top':\n      return { y: 5 };\n    case 'bottom':\n      return { y: -5 };\n    default:\n      return { x: 0, y: 0 };\n  }\n};\n\nconst getPositionClasses = (side: string, align: string) => {\n  const baseClasses = [];\n\n  switch (side) {\n    case 'right':\n      baseClasses.push('left-full ml-2');\n      break;\n    case 'left':\n      baseClasses.push('right-full mr-2');\n      break;\n    case 'top':\n      baseClasses.push('bottom-full mb-2');\n      break;\n    case 'bottom':\n      baseClasses.push('top-full mt-2');\n      break;\n  }\n\n  switch (align) {\n    case 'start':\n      baseClasses.push((side === 'top' || side === 'bottom') ? 'left-0' : 'top-0');\n      break;\n    case 'center':\n      baseClasses.push((side === 'top' || side === 'bottom') ? 'left-1/2 -translate-x-1/2' : 'top-1/2 -translate-y-1/2');\n      break;\n    case 'end':\n      baseClasses.push((side === 'top' || side === 'bottom') ? 'right-0' : 'bottom-0');\n      break;\n  }\n\n  return baseClasses.join(' ');\n};\n"],"names":["Tooltip","content","side","align","isVisible","jsx","AnimatePresence","motion","getInitialPosition","cn","getPositionClasses","baseClasses"],"mappings":"6LAUO,SAASA,EAAQ,CAAE,QAAAC,EAAS,KAAAC,EAAO,QAAS,MAAAC,EAAQ,SAAU,UAAAC,GAA2B,CAC9F,OACEC,EAAAA,kBAAAA,IAACC,EAAAA,iBACE,SAAAF,GACCC,EAAAA,kBAAAA,IAACE,EAAAA,OAAO,IAAP,CACC,QAAS,CACP,QAAS,EACT,GAAGC,EAAmBN,CAAI,CAAA,EAE5B,QAAS,CACP,QAAS,EACT,EAAG,EACH,EAAG,CAAA,EAEL,KAAM,CACJ,QAAS,EACT,GAAGM,EAAmBN,CAAI,CAAA,EAE5B,WAAY,CAAE,SAAU,IAAM,KAAM,SAAA,EACpC,UAAWO,EAAAA,GACT,kFACA,kDACAC,EAAmBR,EAAMC,CAAK,CAAA,EAG/B,SAAAF,CAAA,CAAA,EAGP,CAEJ,CAEA,MAAMO,EAAsBN,GAAiB,CAC3C,OAAQA,EAAA,CACN,IAAK,QACH,MAAO,CAAE,EAAG,EAAA,EACd,IAAK,OACH,MAAO,CAAE,EAAG,CAAA,EACd,IAAK,MACH,MAAO,CAAE,EAAG,CAAA,EACd,IAAK,SACH,MAAO,CAAE,EAAG,EAAA,EACd,QACE,MAAO,CAAE,EAAG,EAAG,EAAG,CAAA,CAAE,CAE1B,EAEMQ,EAAqB,CAACR,EAAcC,IAAkB,CAC1D,MAAMQ,EAAc,CAAA,EAEpB,OAAQT,EAAA,CACN,IAAK,QACHS,EAAY,KAAK,gBAAgB,EACjC,MACF,IAAK,OACHA,EAAY,KAAK,iBAAiB,EAClC,MACF,IAAK,MACHA,EAAY,KAAK,kBAAkB,EACnC,MACF,IAAK,SACHA,EAAY,KAAK,eAAe,EAChC,KAAA,CAGJ,OAAQR,EAAA,CACN,IAAK,QACHQ,EAAY,KAAMT,IAAS,OAASA,IAAS,SAAY,SAAW,OAAO,EAC3E,MACF,IAAK,SACHS,EAAY,KAAMT,IAAS,OAASA,IAAS,SAAY,4BAA8B,0BAA0B,EACjH,MACF,IAAK,MACHS,EAAY,KAAMT,IAAS,OAASA,IAAS,SAAY,UAAY,UAAU,EAC/E,KAAA,CAGJ,OAAOS,EAAY,KAAK,GAAG,CAC7B"}