@abdellatifui/react 3.1.94 → 3.1.96

package/dist/nextgen.d.ts

@@ -386,10 +386,15 @@ export declare interface InformationTableProps {
     className?: string;
 }
 
-export declare const InlineSpinner: default_2.MemoExoticComponent<default_2.ForwardRefExoticComponent<default_2.RefAttributes<unknown>>>;
+export declare const InlineSpinner: default_2.MemoExoticComponent<default_2.ForwardRefExoticComponent<InlineSpinnerProps & default_2.RefAttributes<InlineSpinnerHandle>>>;
+
+declare interface InlineSpinnerHandle extends ModelHandle {
+}
 
 export declare interface InlineSpinnerProps extends SpinnerProps {
     inline?: boolean;
+    defaultOpen?: boolean;
+    modelClassName?: string | Record<string, any>;
 }
 
 export declare const Input: default_2.MemoExoticComponent<default_2.ForwardRefExoticComponent<default_2.RefAttributes<unknown>>>;

package/dist/nextgen.js

@@ -6636,33 +6636,41 @@ const SpinnerDialog = forwardRef((props, ref) => {
   const rref = useRef();
   return /* @__PURE__ */ jsxRuntimeExports.jsx(Model, { inline, ref: ref || rref, className: cn("z-[30000]", modelClassName), children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(Spinner, { variant, size, period, onAbort, text, timeout: timeout2 }) }) });
 });
-const InlineSpinnerComponent = forwardRef((props, ref) => {
-  const { defaultOpen } = props;
-  const rref = useRef({});
-  useEffect(() => {
-    if (defaultOpen) {
-      if (ref) {
-        if (ref.current) {
-          ref.open();
-        }
-      } else if (rref) {
-        if (rref.current) {
-          rref.open();
-        }
+const InlineSpinnerComponent = forwardRef(
+  (props, ref) => {
+    const { defaultOpen, ...restProps } = props;
+    const internalRef = useRef(null);
+    const spinnerRef = ref || internalRef;
+    useEffect(() => {
+      if (defaultOpen) {
+        const timer = setTimeout(() => {
+          var _a;
+          const currentRef = ref || internalRef;
+          if (currentRef && typeof currentRef === "object" && "current" in currentRef) {
+            if ((_a = currentRef.current) == null ? void 0 : _a.open) {
+              currentRef.current.open();
+            }
+          }
+        }, 0);
+        return () => clearTimeout(timer);
       }
-    }
-  }, [defaultOpen]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    SpinnerDialog,
-    {
-      ...props,
-      inline: true,
-      open: true,
-      ref: ref || rref
-    }
-  );
+    }, [defaultOpen]);
+    const SpinnerDialogTyped = SpinnerDialog;
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(
+      SpinnerDialogTyped,
+      {
+        ...restProps,
+        inline: true,
+        open: true,
+        ref: spinnerRef
+      }
+    );
+  }
+);
+InlineSpinnerComponent.displayName = "InlineSpinner";
+const InlineSpinner = memo(InlineSpinnerComponent, (prevProps, nextProps) => {
+  return prevProps.defaultOpen === nextProps.defaultOpen && prevProps.variant === nextProps.variant && prevProps.size === nextProps.size && prevProps.text === nextProps.text && prevProps.timeout === nextProps.timeout && prevProps.period === nextProps.period && prevProps.onAbort === nextProps.onAbort && prevProps.className === nextProps.className && prevProps.modelClassName === nextProps.modelClassName;
 });
-const InlineSpinner = memo(InlineSpinnerComponent);
 const buttonVariants = cva(
   "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed disabled:pointer-events-auto",
   {
@@ -12380,7 +12388,12 @@ const Model = forwardRef((props, ref) => {
       onContextMenu: handleContextMenu,
       onClick: handleWrapperClose,
       id,
-      className: cn(vrs$g({ variant, inline, blur }), "custom-click-away flex justify-center items-center opacity-100", className),
+      className: cn(
+        vrs$g({ variant, inline, blur }),
+        "custom-click-away flex justify-center items-center opacity-100",
+        className,
+        open && "z-[300]"
+      ),
       children
     }
   ) }) });
@@ -19425,7 +19438,7 @@ const Topbar = (props) => {
     );
     expandApi.triggerExpansion("internal", expandApi.expanded);
   }, [(_b = callback.cell) == null ? void 0 : _b.value]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center w-full css-klk212 border-b p-2 overflow-hidden h-[55px]", children: [
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center w-full css-klk212 border-b p-1 overflow-hidden h-[40px]", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "select-none font-aptos font-[400] flex w-[calc(100%)-80px]", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-black w-fit text-nowrap border-r mr-4 pr-2 ", children: tableName }),
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "select-none font-Roboto text-black text-nowrap w-full flex", children: [
@@ -19433,12 +19446,13 @@ const Topbar = (props) => {
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: " max-w-[300px] z-0 ml-2 text-gray-600 truncate", title: (_d = cell.value) == null ? void 0 : _d.toString(), children: /* @__PURE__ */ jsxRuntimeExports.jsx(Label$1, { className: "capitaliz", children: ((_e = cell.value) == null ? void 0 : _e.toString()) ? (_f = cell.value) == null ? void 0 : _f.toString() : "" }) })
       ] })
     ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-2 mr-1 p-1 border-l absolute right-0 css-klk212 z-10", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-2 mr-1 p-1 border-l absolute right-0 css-klk212 z-10 scale-90", children: [
       isFilterApplied ? /* @__PURE__ */ jsxRuntimeExports.jsx(
         IconButton$1,
         {
           icon: /* @__PURE__ */ jsxRuntimeExports.jsx(FilterX, { color: "gray" }),
           tooltip: "Clear all filters.",
+          outline: false,
           onClick: () => {
             setFilterItems((prev2) => {
               prev2.row.map((item) => {
@@ -19458,6 +19472,7 @@ const Topbar = (props) => {
         {
           icon: /* @__PURE__ */ jsxRuntimeExports.jsx(RotateCw, {}),
           tooltip: "Refresh",
+          outline: false,
           disable: isRefreshDisabled,
           onClick: () => {
             onRefresh(callback);
@@ -19467,6 +19482,7 @@ const Topbar = (props) => {
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         IconButton$1,
         {
+          outline: false,
           icon: /* @__PURE__ */ jsxRuntimeExports.jsx(Fullscreen, {}),
           tooltip: "Fullscreen",
           onClick: () => {
@@ -19480,6 +19496,7 @@ const Topbar = (props) => {
         {
           icon: /* @__PURE__ */ jsxRuntimeExports.jsx(FoldHorizontal, {}),
           tooltip: "Autofit columns",
+          outline: false,
           onClick: () => {
             callback.autoFit(false);
           }
@@ -19488,6 +19505,7 @@ const Topbar = (props) => {
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         IconButton$1,
         {
+          outline: false,
           icon: /* @__PURE__ */ jsxRuntimeExports.jsx(Download, {}),
           tooltip: "Export(CSV)",
           onClick: () => {
@@ -19498,6 +19516,7 @@ const Topbar = (props) => {
       enableExpand && /* @__PURE__ */ jsxRuntimeExports.jsx(
         IconButton$1,
         {
+          outline: false,
           icon: /* @__PURE__ */ jsxRuntimeExports.jsx(Brackets, {}),
           disable: expandBtnDisable,
           tooltip: "Expand Cell Array Items",
@@ -19507,6 +19526,7 @@ const Topbar = (props) => {
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         IconButton$1,
         {
+          outline: false,
           icon: /* @__PURE__ */ jsxRuntimeExports.jsx(LucideEllipsisVertical, {}),
           tooltip: "Show more options",
           onClick: (e) => {
@@ -19915,9 +19935,7 @@ const TableComponent = forwardRef((props, ref) => {
     setCell({ header: hasValue ? cell.header : " ", value: hasValue ? cell.value : " ", params });
     setShowCopyMenuButton(hasValue);
     event.preventDefault();
-    requestAnimationFrame(() => {
-      setTableBodyMenuEvent(event);
-    });
+    setTableBodyMenuEvent(event);
   }, [cell.value, cell.header]);
   useEffect(() => {
     if (ready) {
@@ -20237,7 +20255,7 @@ const TableComponent = forwardRef((props, ref) => {
             close: false
           }
         ),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("w-full relative flex flex-col", topbar ? "h-[calc(100%-60px)] " : "h-full"), children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("w-full relative flex flex-col", topbar ? "h-[calc(100%-40px)] " : "h-full"), children: [
           showTableSpinner ? /* @__PURE__ */ jsxRuntimeExports.jsx(InlineSpinner, { variant: "white", defaultOpen: true }) : false,
           /* @__PURE__ */ jsxRuntimeExports.jsx(
             AgGridReact,
@@ -26191,30 +26209,41 @@ const TabItem = forwardRef((props, ref) => {
     className = "",
     defaultTab,
     full,
-    theme = "minimal"
+    theme = "minimal",
+    onMouseEnter = () => {
+    },
+    onMouseLeave = () => {
+    }
   } = props;
-  const hanldeChange = useCallback(() => {
+  const hanldeChange = useCallback((e) => {
     if (defaultTab === tab.value) {
       return;
     }
     setDefaultTab(tab.value);
-    onChange(tab, tab.value);
+    onChange({ event: e, ...tab, currentTab: defaultTab, props, ref }, tab.value);
     if (tab.onSelected) {
-      tab.onSelected(tab, tab.value);
+      tab.onSelected({ event: e, ...tab, currentTab: defaultTab, props, ref }, tab.value);
     }
   }, [tab.value, defaultTab, onChange, setDefaultTab, tab, props]);
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
     TabsTrigger,
     {
       ref,
+      onMouseEnter: (e) => {
+        onMouseEnter({ event: e, ...tab, currentTab: defaultTab, props, ref });
+      },
+      onMouseLeave: (e) => {
+        onMouseLeave({ event: e, ...tab, currentTab: defaultTab, props, ref });
+      },
       theme,
       className: cn(
         vrs2({ outline: outline2, full }),
-        className,
         theme === "modern" ? "min-w-[90px] relative before:absolute before:inset-0 before:rounded before:bg-gradient-to-r before:from-blue-500/5 before:to-purple-500/5 before:opacity-0 before:transition-opacity before:duration-300 hover:before:opacity-100 data-[state=active]:before:opacity-100" : "",
-        theme === "v2" ? "bg-transparent rounded-none p-2 font data-[state=active]:text-blue-500 !font-semibold" : ""
+        theme === "v2" && "bg-transparent rounded-none p-2 font data-[state=active]:text-blue-500 !font-semibold",
+        className
       ),
       value: tab.value,
+      "data-selected": defaultTab === tab.value ? "true" : "false",
       onClick: hanldeChange,
       children: theme === "modern" ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "relative z-10 transition-all duration-200 group-hover:scale-[1.01]", children: tab.label }) : tab.label
     },
@@ -26310,7 +26339,12 @@ const ShadcnTabs = forwardRef((props, ref) => {
               full,
               theme,
               ref: (el) => tabRefs.current[index] = el,
-              boxSize
+              boxSize,
+              className: (tab == null ? void 0 : tab.className) || "",
+              onMouseEnter: (tab == null ? void 0 : tab.onMouseEnter) || (() => {
+              }),
+              onMouseLeave: (tab == null ? void 0 : tab.onMouseLeave) || (() => {
+              })
             },
             (tab == null ? void 0 : tab.value) || key
           )),