@algorithm-shift/design-system 1.2.15 → 1.2.17

package/dist/index.mjs

@@ -1701,11 +1701,11 @@ function DataTable({
 
 // src/components/DataDisplay/Table/Table.tsx
 import { jsx as jsx36 } from "react/jsx-runtime";
-var Table2 = ({ columns, data, rowActions }) => {
+var Table2 = ({ columns, data, rowActions, className, style }) => {
   const rawColumns = Array.isArray(columns) ? columns : [];
   const rawData = Array.isArray(data) ? data : [];
   const rawRowActions = Array.isArray(rowActions) ? rowActions : [];
-  return /* @__PURE__ */ jsx36(DataTable, { columns: rawColumns, data: rawData, rowActions: rawRowActions });
+  return /* @__PURE__ */ jsx36("div", { className, style, children: /* @__PURE__ */ jsx36(DataTable, { columns: rawColumns, data: rawData, rowActions: rawRowActions }) });
 };
 var Table_default = Table2;
 
@@ -1769,15 +1769,19 @@ function DropdownMenuItem({
 
 // src/components/Navigation/Tabs/Tabs.tsx
 import { jsx as jsx38, jsxs as jsxs21 } from "react/jsx-runtime";
-var Tabs = ({ tabs, className, style }) => {
+var Tabs = ({ tabs, className, style, pathname, LinkComponent }) => {
   const rawTabs = Array.isArray(tabs) ? tabs : [];
   const baseClasses = "text-[12px] text-[#E9E9E9] p-2 text-center rounded-md transition-colors border-none outline-none focus:outline-none focus:ring-0 focus:ring-offset-0 cursor-pointer select-none ";
   const activeClasses = "bg-white/10 text-white";
   const hoverClasses = "hover:bg-white/5";
+  const isActive = (path) => {
+    if (!path) return false;
+    return pathname === path || path !== "/" && pathname.startsWith(path);
+  };
   return /* @__PURE__ */ jsx38("div", { className, style, children: rawTabs.map((tab, index) => {
     const finalClasses = [
       baseClasses,
-      tab.isActive ? activeClasses : hoverClasses,
+      isActive(tab.href) ? activeClasses : hoverClasses,
       tab.className || ""
     ].join(" ");
     const hasDropdown = Array.isArray(tab.children) && tab.children.length > 0 && tab.isDropDown;
@@ -1804,7 +1808,7 @@ var Tabs = ({ tabs, className, style }) => {
               {
                 asChild: true,
                 className: "cursor-pointer rounded-sm px-3 py-2 text-[12px] text-gray-800 hover:bg-gray-100 focus:bg-gray-100",
-                children: item.header
+                children: LinkComponent ? /* @__PURE__ */ jsx38(LinkComponent, { href: item.href || "#", children: item.header }) : item.header
               },
               item.id
             ))
@@ -1812,7 +1816,7 @@ var Tabs = ({ tabs, className, style }) => {
         )
       ] }, index);
     }
-    return /* @__PURE__ */ jsx38("div", { className: finalClasses, style: { backgroundColor: "transparent", border: "none", ...tab.style }, role: "button", tabIndex: 0, children: tab.header }, index);
+    return tab.url && LinkComponent ? /* @__PURE__ */ jsx38(LinkComponent, { href: tab.url, className: finalClasses, style, children: tab.header }, index) : /* @__PURE__ */ jsx38("div", { className: finalClasses, style, role: "button", tabIndex: 0, children: tab.header }, index);
   }) });
 };
 var Tabs_default = Tabs;
@@ -1899,7 +1903,7 @@ var Logo = ({
           "p-0"
         ),
         style,
-        children: /* @__PURE__ */ jsx43("img", { src: "/logo_placeholder.png", alt: altText, className: "opacity-50", width: 150, height: 80 })
+        children: /* @__PURE__ */ jsx43("img", { src: "./logo_placeholder.png", alt: altText, className: "opacity-50", width: 150, height: 80 })
       }
     );
   }