next-helios-fe 1.8.85 → 1.8.87

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-helios-fe",
-  "version": "1.8.85",
+  "version": "1.8.87",
   "description": "",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -39,7 +39,7 @@
     "@iconify/react": "^5.0.1",
     "dayjs": "^1.11.11",
     "flowbite-react": "^0.10.1",
-    "next": "14.2.4",
+    "next": "^14.2.4",
     "postcss": "^8",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

package/src/components/content-container/wizard/index.tsx

@@ -1,5 +1,5 @@
 "use client";
-import React, { useState, useRef } from "react";
+import React, { useState, useEffect, useRef } from "react";
 import { Icon } from "@iconify/react";
 import { Window, type WindowProps } from "./window";
 
@@ -48,35 +48,25 @@ export const Wizard: WizardComponent = ({
   });
   const [activeTab, setActiveTab] = useState(0);
 
-  const handleOnPreviousClick = () => {
-    if (activeTab - 1 === 0) {
+  useEffect(() => {
+    if (activeTab === 0) {
       wizardNavigationRef.current?.scrollTo({
         left: 0,
         behavior: "smooth",
       });
     } else {
-      document.getElementById(`wizard-tab-${activeTab - 1}`)?.scrollIntoView({
-        behavior: "smooth",
-        block: "nearest",
-        inline: "center",
-      });
-    }
-  };
-
-  const handleOnNextClick = () => {
-    if (activeTab + 1 === childrenList.length) {
       wizardNavigationRef.current?.scrollTo({
-        left: wizardNavigationRef.current.scrollWidth,
-        behavior: "smooth",
-      });
-    } else {
-      document.getElementById(`wizard-tab-${activeTab + 1}`)?.scrollIntoView({
+        left: Array.from({ length: activeTab })
+          .map((_, index) => {
+            return (
+              document.getElementById(`wizard-tab-${index}`)?.offsetWidth || 0
+            );
+          })
+          .reduce((acc, cur) => acc + cur, 0),
         behavior: "smooth",
-        block: "nearest",
-        inline: "center",
       });
     }
-  };
+  }, [activeTab]);
 
   return (
     <div className="flex flex-col gap-8 h-full overflow-hidden">
@@ -210,7 +200,6 @@ export const Wizard: WizardComponent = ({
           }`}
           disabled={activeTab === 0}
           onClick={() => {
-            handleOnPreviousClick();
             onPreviousClick && onPreviousClick();
 
             if (onChangeTab) {
@@ -254,7 +243,6 @@ export const Wizard: WizardComponent = ({
             if (options?.customNextButton?.onClick) {
               options.customNextButton.onClick();
             } else {
-              handleOnNextClick();
               onNextClick && onNextClick();
 
               if (onChangeTab) {

package/src/components/table/index.tsx

@@ -158,14 +158,6 @@ export const Table: TableComponentProps = ({
       });
   }, [data]);
 
-  const handleExportData = (dataTitle: string, data: any[]) => {
-    const fileName = `${dataTitle}_${dayjs().format("YYYY-MM-DD_HH-mm-ss")}`;
-    const worksheet = xlsx.utils.json_to_sheet(data);
-    const workbook = xlsx.utils.book_new();
-    xlsx.utils.book_append_sheet(workbook, worksheet, "Data");
-    xlsx.writeFile(workbook, fileName + ".xlsx");
-  };
-
   useEffect(() => {
     if (page === 1) {
       paginationRef.current?.scrollTo({
@@ -173,14 +165,28 @@ export const Table: TableComponentProps = ({
         behavior: "smooth",
       });
     } else {
-      document.getElementById(`pagination-page-${page - 1}`)?.scrollIntoView({
+      paginationRef.current?.scrollTo({
+        left: Array.from({ length: page - 2 })
+          .map((_, index) => {
+            return (
+              (document.getElementById(`pagination-page-${index}`)
+                ?.offsetWidth || 0) + 8
+            );
+          })
+          .reduce((acc, cur) => acc + cur, 0),
         behavior: "smooth",
-        block: "nearest",
-        inline: "center",
       });
     }
   }, [page]);
 
+  const handleExportData = (dataTitle: string, data: any[]) => {
+    const fileName = `${dataTitle}_${dayjs().format("YYYY-MM-DD_HH-mm-ss")}`;
+    const worksheet = xlsx.utils.json_to_sheet(data);
+    const workbook = xlsx.utils.book_new();
+    xlsx.utils.book_append_sheet(workbook, worksheet, "Data");
+    xlsx.writeFile(workbook, fileName + ".xlsx");
+  };
+
   const filteredData = useMemo(() => {
     const tempData = data
       ?.filter((item) => {
@@ -921,7 +927,7 @@ export const Table: TableComponentProps = ({
                     key={index}
                     id={`pagination-page-${index}`}
                     type="button"
-                    className="flex h-9 min-w-9 select-none items-center justify-center rounded-md border hover:bg-secondary-light disabled:bg-primary-transparent disabled:text-primary"
+                    className="flex items-center justify-center h-9 min-w-9 px-4 border rounded-md select-none hover:bg-secondary-light disabled:bg-primary-transparent disabled:text-primary"
                     disabled={page === index + 1}
                     onClick={() => {
                       setPage(index + 1);

package/src/components/tooltip/index.tsx

@@ -202,7 +202,7 @@ export const Tooltip: React.FC<TooltipProps> = ({
         createPortal(
           <div
             ref={tooltipRef}
-            className={`absolute z-50 max-w-dvw max-h-dvh overflow-hidden duration-200 transition-opacity ${
+            className={`fixed z-50 max-w-dvw max-h-dvh overflow-hidden duration-200 transition-opacity ${
               visible ? "opacity-100" : "opacity-0 pointer-events-none"
             } ${options?.enableHover ? "" : "pointer-events-none"}`}
             style={getTooltipPosition()}