@fctc/sme-widget-ui 1.9.2 → 1.9.4

package/dist/index.js

@@ -10132,8 +10132,8 @@ var en_default = {
   download_file: "Download this file",
   upload_success: "Upload file success",
   upload_failure: "Upload file failure",
-  file_accept_single: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP formats are allowed, and each file should be up to 10MB.",
-  file_accept_total: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP formats are allowed, and total should be up to 50MB.",
+  file_accept_single: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP, JSON formats are allowed, and each file should be up to 10MB.",
+  file_accept_total: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP, JSON formats are allowed, and total should be up to 50MB.",
   must_required: "is required",
   invalid_number: "Invalid number",
   active: "Active",
@@ -13227,6 +13227,7 @@ var M = import_react16.default.forwardRef(({ id: t3, anchorId: l2, anchorSelect:
 });
 
 // src/widgets/advanced/table/table-head.tsx
+var import_react_dom2 = require("react-dom");
 var import_jsx_runtime47 = require("react/jsx-runtime");
 var TableHead = (props) => {
   const {
@@ -13268,27 +13269,31 @@ var TableHead = (props) => {
           return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
             "th",
             {
+              "data-rtc-resizable": col?.name,
               className: `column whitespace-nowrap text-left p-3 text-sm font-semibold capitalize text-[#060606]`,
               children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "cursor-pointer flex items-center gap-[4px] w-full min-w-max group relative", children: [
                 col.title,
                 col?.field?.help && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_jsx_runtime47.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
-                    M,
-                    {
-                      style: {
-                        padding: "6px 12px",
-                        fontSize: "12px",
-                        borderRadius: "4px",
-                        maxWidth: "200%",
-                        whiteSpace: "wrap",
-                        fontWeight: 400,
-                        textTransform: "none"
-                      },
-                      id: `field-help-${col?.field?.name}`,
-                      content: col?.field?.help,
-                      place: "top",
-                      className: "z-30"
-                    }
+                  (0, import_react_dom2.createPortal)(
+                    /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+                      M,
+                      {
+                        style: {
+                          padding: "6px 12px",
+                          fontSize: "12px",
+                          borderRadius: "4px",
+                          maxWidth: "200px",
+                          whiteSpace: "wrap",
+                          fontWeight: 400,
+                          textTransform: "none",
+                          zIndex: "9999"
+                        },
+                        id: `field-help-${col?.field?.name}`,
+                        content: col?.field?.help,
+                        place: "top"
+                      }
+                    ),
+                    document.body
                   ),
                   /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
                     "span",
@@ -16415,7 +16420,7 @@ var ModalConfirm = ({
 
 // src/widgets/common/modal-detail.tsx
 var import_react24 = require("react");
-var import_react_dom2 = require("react-dom");
+var import_react_dom3 = require("react-dom");
 var import_jsx_runtime65 = require("react/jsx-runtime");
 var ModalDetail = ({
   idToolTip,
@@ -16438,7 +16443,7 @@ var ModalDetail = ({
     sessionStorage.setItem("actionData", JSON.stringify(actionData));
     window.location.href = `/form/menu?model=${model}&id=${idForm}`;
   };
-  return (0, import_react_dom2.createPortal)(
+  return (0, import_react_dom3.createPortal)(
     /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_jsx_runtime65.Fragment, { children: showModalDetail && /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "fixed bottom-0 left-0 right-0 top-0 z-[100]", children: [
       /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "absolute inset-0 bg-[rgba(27,27,27,0.48)]" }),
       /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "absolute inset-0 overflow-auto flex flex-col justify-center items-center px-5", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "relative z-[1] max-w-full p-4 flex flex-col gap-4 w-[1000px] transform rounded-3xl bg-[#FFF] h-[90%]", children: [
@@ -16979,7 +16984,8 @@ var ButtonSelectFiles = ({
     "application/zip",
     "application/x-zip-compressed",
     "application/vnd.ms-excel",
-    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+    "application/json"
   ];
   const MAX_FILE_SIZE = 10 * 1024 * 1024;
   const MAX_TOTAL_SIZE = 50 * 1024 * 1024;
@@ -17080,7 +17086,7 @@ var ButtonSelectFiles = ({
         style: { display: "none" },
         onChange: handleOnChange,
         multiple: true,
-        accept: ".jpeg,.jpg,.png,.pdf,.mp4,.zip,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
+        accept: ".jpeg,.jpg,.png,.pdf,.json,.mp4,.zip,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
       }
     )
   ] });
@@ -22379,7 +22385,7 @@ function useFloating2(options2) {
 }
 
 // node_modules/react-datepicker/dist/index.es.js
-var import_react_dom5 = __toESM(require("react-dom"));
+var import_react_dom6 = __toESM(require("react-dom"));
 var _extendStatics = function extendStatics(d, b2) {
   _extendStatics = Object.setPrototypeOf || {
     __proto__: []
@@ -25622,7 +25628,7 @@ var Portal = (
       }
     };
     Portal2.prototype.render = function() {
-      return import_react_dom5.default.createPortal(this.props.children, this.el);
+      return import_react_dom6.default.createPortal(this.props.children, this.el);
     };
     return Portal2;
   }(import_react44.Component)
@@ -28190,7 +28196,7 @@ function _taggedTemplateLiteral(e3, t3) {
 
 // node_modules/react-select/dist/index-641ee5b8.esm.js
 var import_react50 = require("react");
-var import_react_dom6 = require("react-dom");
+var import_react_dom7 = require("react-dom");
 
 // node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.esm.js
 var import_react48 = require("react");
@@ -28693,7 +28699,7 @@ var MenuPortal = function MenuPortal2(props) {
   }), innerProps), children);
   return jsx81(PortalPlacementContext.Provider, {
     value: portalPlacementContext
-  }, appendTo ? /* @__PURE__ */ (0, import_react_dom6.createPortal)(menuWrapper, appendTo) : menuWrapper);
+  }, appendTo ? /* @__PURE__ */ (0, import_react_dom7.createPortal)(menuWrapper, appendTo) : menuWrapper);
 };
 var containerCSS = function containerCSS2(_ref3) {
   var isDisabled = _ref3.isDisabled, isRtl = _ref3.isRtl;
@@ -31586,7 +31592,7 @@ var import_toConsumableArray2 = __toESM(require_toConsumableArray());
 var import_typeof5 = __toESM(require_typeof());
 var import_taggedTemplateLiteral2 = __toESM(require_taggedTemplateLiteral());
 var import_defineProperty3 = __toESM(require_defineProperty());
-var import_react_dom7 = require("react-dom");
+var import_react_dom8 = require("react-dom");
 var StateManagedSelect = /* @__PURE__ */ (0, import_react53.forwardRef)(function(props, ref) {
   var baseSelectProps = useStateManager(props);
   return /* @__PURE__ */ React14.createElement(Select, _extends({
@@ -32118,7 +32124,7 @@ var FileUploadField = (props) => {
             );
           }
         }, [selectedFiles]);
-        return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { className: "file-upload-field", children: [
+        return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { children: [
           selectedFiles?.length > 0 && selectedFiles?.map((fileItem, index4) => /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
             RenderFile,
             {
@@ -33533,7 +33539,7 @@ var StatusDropdownField = (props) => {
 };
 
 // src/widgets/basic/many2many-field/many2many.tsx
-var import_react_dom8 = require("react-dom");
+var import_react_dom9 = require("react-dom");
 var import_react65 = require("react");
 var import_jsx_runtime104 = require("react/jsx-runtime");
 var Many2ManyField = (props) => {
@@ -33608,7 +33614,7 @@ var Many2ManyField = (props) => {
       typeof setGroupByList === "function" && setGroupByList(null);
     };
   }, [selectedTags]);
-  return (0, import_react_dom8.createPortal)(
+  return (0, import_react_dom9.createPortal)(
     /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(
       "div",
       {

package/dist/index.mjs

@@ -10009,8 +10009,8 @@ var en_default = {
   download_file: "Download this file",
   upload_success: "Upload file success",
   upload_failure: "Upload file failure",
-  file_accept_single: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP formats are allowed, and each file should be up to 10MB.",
-  file_accept_total: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP formats are allowed, and total should be up to 50MB.",
+  file_accept_single: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP, JSON formats are allowed, and each file should be up to 10MB.",
+  file_accept_total: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP, JSON formats are allowed, and total should be up to 50MB.",
   must_required: "is required",
   invalid_number: "Invalid number",
   active: "Active",
@@ -13104,6 +13104,7 @@ var M = e2.forwardRef(({ id: t3, anchorId: l2, anchorSelect: n4, content: i3, ht
 });
 
 // src/widgets/advanced/table/table-head.tsx
+import { createPortal as createPortal2 } from "react-dom";
 import { Fragment as Fragment4, jsx as jsx47, jsxs as jsxs26 } from "react/jsx-runtime";
 var TableHead = (props) => {
   const {
@@ -13145,27 +13146,31 @@ var TableHead = (props) => {
           return /* @__PURE__ */ jsx47(
             "th",
             {
+              "data-rtc-resizable": col?.name,
               className: `column whitespace-nowrap text-left p-3 text-sm font-semibold capitalize text-[#060606]`,
               children: /* @__PURE__ */ jsxs26("div", { className: "cursor-pointer flex items-center gap-[4px] w-full min-w-max group relative", children: [
                 col.title,
                 col?.field?.help && /* @__PURE__ */ jsxs26(Fragment4, { children: [
-                  /* @__PURE__ */ jsx47(
-                    M,
-                    {
-                      style: {
-                        padding: "6px 12px",
-                        fontSize: "12px",
-                        borderRadius: "4px",
-                        maxWidth: "200%",
-                        whiteSpace: "wrap",
-                        fontWeight: 400,
-                        textTransform: "none"
-                      },
-                      id: `field-help-${col?.field?.name}`,
-                      content: col?.field?.help,
-                      place: "top",
-                      className: "z-30"
-                    }
+                  createPortal2(
+                    /* @__PURE__ */ jsx47(
+                      M,
+                      {
+                        style: {
+                          padding: "6px 12px",
+                          fontSize: "12px",
+                          borderRadius: "4px",
+                          maxWidth: "200px",
+                          whiteSpace: "wrap",
+                          fontWeight: 400,
+                          textTransform: "none",
+                          zIndex: "9999"
+                        },
+                        id: `field-help-${col?.field?.name}`,
+                        content: col?.field?.help,
+                        place: "top"
+                      }
+                    ),
+                    document.body
                   ),
                   /* @__PURE__ */ jsx47(
                     "span",
@@ -16292,7 +16297,7 @@ var ModalConfirm = ({
 
 // src/widgets/common/modal-detail.tsx
 import { useState as useState7 } from "react";
-import { createPortal as createPortal2 } from "react-dom";
+import { createPortal as createPortal3 } from "react-dom";
 import { Fragment as Fragment13, jsx as jsx65, jsxs as jsxs41 } from "react/jsx-runtime";
 var ModalDetail = ({
   idToolTip,
@@ -16315,7 +16320,7 @@ var ModalDetail = ({
     sessionStorage.setItem("actionData", JSON.stringify(actionData));
     window.location.href = `/form/menu?model=${model}&id=${idForm}`;
   };
-  return createPortal2(
+  return createPortal3(
     /* @__PURE__ */ jsx65(Fragment13, { children: showModalDetail && /* @__PURE__ */ jsxs41("div", { className: "fixed bottom-0 left-0 right-0 top-0 z-[100]", children: [
       /* @__PURE__ */ jsx65("div", { className: "absolute inset-0 bg-[rgba(27,27,27,0.48)]" }),
       /* @__PURE__ */ jsx65("div", { className: "absolute inset-0 overflow-auto flex flex-col justify-center items-center px-5", children: /* @__PURE__ */ jsxs41("div", { className: "relative z-[1] max-w-full p-4 flex flex-col gap-4 w-[1000px] transform rounded-3xl bg-[#FFF] h-[90%]", children: [
@@ -16856,7 +16861,8 @@ var ButtonSelectFiles = ({
     "application/zip",
     "application/x-zip-compressed",
     "application/vnd.ms-excel",
-    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+    "application/json"
   ];
   const MAX_FILE_SIZE = 10 * 1024 * 1024;
   const MAX_TOTAL_SIZE = 50 * 1024 * 1024;
@@ -16957,7 +16963,7 @@ var ButtonSelectFiles = ({
         style: { display: "none" },
         onChange: handleOnChange,
         multiple: true,
-        accept: ".jpeg,.jpg,.png,.pdf,.mp4,.zip,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
+        accept: ".jpeg,.jpg,.png,.pdf,.json,.mp4,.zip,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
       }
     )
   ] });
@@ -28067,7 +28073,7 @@ function _taggedTemplateLiteral(e3, t3) {
 
 // node_modules/react-select/dist/index-641ee5b8.esm.js
 import { useContext as useContext9, useRef as useRef13, useState as useState15, useMemo as useMemo7, useCallback as useCallback7, createContext as createContext5 } from "react";
-import { createPortal as createPortal4 } from "react-dom";
+import { createPortal as createPortal5 } from "react-dom";
 
 // node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.esm.js
 import { useLayoutEffect as useLayoutEffect4 } from "react";
@@ -28570,7 +28576,7 @@ var MenuPortal = function MenuPortal2(props) {
   }), innerProps), children);
   return jsx81(PortalPlacementContext.Provider, {
     value: portalPlacementContext
-  }, appendTo ? /* @__PURE__ */ createPortal4(menuWrapper, appendTo) : menuWrapper);
+  }, appendTo ? /* @__PURE__ */ createPortal5(menuWrapper, appendTo) : menuWrapper);
 };
 var containerCSS = function containerCSS2(_ref3) {
   var isDisabled = _ref3.isDisabled, isRtl = _ref3.isRtl;
@@ -31995,7 +32001,7 @@ var FileUploadField = (props) => {
             );
           }
         }, [selectedFiles]);
-        return /* @__PURE__ */ jsxs58("div", { className: "file-upload-field", children: [
+        return /* @__PURE__ */ jsxs58("div", { children: [
           selectedFiles?.length > 0 && selectedFiles?.map((fileItem, index4) => /* @__PURE__ */ jsx88(
             RenderFile,
             {
@@ -33410,7 +33416,7 @@ var StatusDropdownField = (props) => {
 };
 
 // src/widgets/basic/many2many-field/many2many.tsx
-import { createPortal as createPortal5 } from "react-dom";
+import { createPortal as createPortal6 } from "react-dom";
 import { useEffect as useEffect26 } from "react";
 import { jsx as jsx106, jsxs as jsxs71 } from "react/jsx-runtime";
 var Many2ManyField = (props) => {
@@ -33485,7 +33491,7 @@ var Many2ManyField = (props) => {
       typeof setGroupByList === "function" && setGroupByList(null);
     };
   }, [selectedTags]);
-  return createPortal5(
+  return createPortal6(
     /* @__PURE__ */ jsxs71(
       "div",
       {

package/dist/utils.js

@@ -6894,8 +6894,8 @@ var en_default = {
   download_file: "Download this file",
   upload_success: "Upload file success",
   upload_failure: "Upload file failure",
-  file_accept_single: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP formats are allowed, and each file should be up to 10MB.",
-  file_accept_total: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP formats are allowed, and total should be up to 50MB.",
+  file_accept_single: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP, JSON formats are allowed, and each file should be up to 10MB.",
+  file_accept_total: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP, JSON formats are allowed, and total should be up to 50MB.",
   must_required: "is required",
   invalid_number: "Invalid number",
   active: "Active",

package/dist/utils.mjs

@@ -6871,8 +6871,8 @@ var en_default = {
   download_file: "Download this file",
   upload_success: "Upload file success",
   upload_failure: "Upload file failure",
-  file_accept_single: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP formats are allowed, and each file should be up to 10MB.",
-  file_accept_total: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP formats are allowed, and total should be up to 50MB.",
+  file_accept_single: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP, JSON formats are allowed, and each file should be up to 10MB.",
+  file_accept_total: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP, JSON formats are allowed, and total should be up to 50MB.",
   must_required: "is required",
   invalid_number: "Invalid number",
   active: "Active",

package/dist/widgets.js

@@ -7818,8 +7818,8 @@ var en_default = {
   download_file: "Download this file",
   upload_success: "Upload file success",
   upload_failure: "Upload file failure",
-  file_accept_single: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP formats are allowed, and each file should be up to 10MB.",
-  file_accept_total: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP formats are allowed, and total should be up to 50MB.",
+  file_accept_single: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP, JSON formats are allowed, and each file should be up to 10MB.",
+  file_accept_total: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP, JSON formats are allowed, and total should be up to 50MB.",
   must_required: "is required",
   invalid_number: "Invalid number",
   active: "Active",
@@ -12621,6 +12621,7 @@ var M = import_react16.default.forwardRef(({ id: t3, anchorId: l2, anchorSelect:
 });
 
 // src/widgets/advanced/table/table-head.tsx
+var import_react_dom2 = require("react-dom");
 var import_jsx_runtime47 = require("react/jsx-runtime");
 var TableHead = (props) => {
   const {
@@ -12662,27 +12663,31 @@ var TableHead = (props) => {
           return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
             "th",
             {
+              "data-rtc-resizable": col?.name,
               className: `column whitespace-nowrap text-left p-3 text-sm font-semibold capitalize text-[#060606]`,
               children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "cursor-pointer flex items-center gap-[4px] w-full min-w-max group relative", children: [
                 col.title,
                 col?.field?.help && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_jsx_runtime47.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
-                    M,
-                    {
-                      style: {
-                        padding: "6px 12px",
-                        fontSize: "12px",
-                        borderRadius: "4px",
-                        maxWidth: "200%",
-                        whiteSpace: "wrap",
-                        fontWeight: 400,
-                        textTransform: "none"
-                      },
-                      id: `field-help-${col?.field?.name}`,
-                      content: col?.field?.help,
-                      place: "top",
-                      className: "z-30"
-                    }
+                  (0, import_react_dom2.createPortal)(
+                    /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+                      M,
+                      {
+                        style: {
+                          padding: "6px 12px",
+                          fontSize: "12px",
+                          borderRadius: "4px",
+                          maxWidth: "200px",
+                          whiteSpace: "wrap",
+                          fontWeight: 400,
+                          textTransform: "none",
+                          zIndex: "9999"
+                        },
+                        id: `field-help-${col?.field?.name}`,
+                        content: col?.field?.help,
+                        place: "top"
+                      }
+                    ),
+                    document.body
                   ),
                   /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
                     "span",
@@ -15820,7 +15825,7 @@ var ModalConfirm = ({
 
 // src/widgets/common/modal-detail.tsx
 var import_react24 = require("react");
-var import_react_dom2 = require("react-dom");
+var import_react_dom3 = require("react-dom");
 var import_jsx_runtime65 = require("react/jsx-runtime");
 var ModalDetail = ({
   idToolTip,
@@ -15843,7 +15848,7 @@ var ModalDetail = ({
     sessionStorage.setItem("actionData", JSON.stringify(actionData));
     window.location.href = `/form/menu?model=${model}&id=${idForm}`;
   };
-  return (0, import_react_dom2.createPortal)(
+  return (0, import_react_dom3.createPortal)(
     /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_jsx_runtime65.Fragment, { children: showModalDetail && /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "fixed bottom-0 left-0 right-0 top-0 z-[100]", children: [
       /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "absolute inset-0 bg-[rgba(27,27,27,0.48)]" }),
       /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "absolute inset-0 overflow-auto flex flex-col justify-center items-center px-5", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "relative z-[1] max-w-full p-4 flex flex-col gap-4 w-[1000px] transform rounded-3xl bg-[#FFF] h-[90%]", children: [
@@ -16384,7 +16389,8 @@ var ButtonSelectFiles = ({
     "application/zip",
     "application/x-zip-compressed",
     "application/vnd.ms-excel",
-    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+    "application/json"
   ];
   const MAX_FILE_SIZE = 10 * 1024 * 1024;
   const MAX_TOTAL_SIZE = 50 * 1024 * 1024;
@@ -16485,7 +16491,7 @@ var ButtonSelectFiles = ({
         style: { display: "none" },
         onChange: handleOnChange,
         multiple: true,
-        accept: ".jpeg,.jpg,.png,.pdf,.mp4,.zip,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
+        accept: ".jpeg,.jpg,.png,.pdf,.json,.mp4,.zip,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
       }
     )
   ] });
@@ -21784,7 +21790,7 @@ function useFloating2(options2) {
 }
 
 // node_modules/react-datepicker/dist/index.es.js
-var import_react_dom5 = __toESM(require("react-dom"));
+var import_react_dom6 = __toESM(require("react-dom"));
 var _extendStatics = function extendStatics(d, b2) {
   _extendStatics = Object.setPrototypeOf || {
     __proto__: []
@@ -25027,7 +25033,7 @@ var Portal = (
       }
     };
     Portal2.prototype.render = function() {
-      return import_react_dom5.default.createPortal(this.props.children, this.el);
+      return import_react_dom6.default.createPortal(this.props.children, this.el);
     };
     return Portal2;
   }(import_react44.Component)
@@ -27595,7 +27601,7 @@ function _taggedTemplateLiteral(e3, t3) {
 
 // node_modules/react-select/dist/index-641ee5b8.esm.js
 var import_react50 = require("react");
-var import_react_dom6 = require("react-dom");
+var import_react_dom7 = require("react-dom");
 
 // node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.esm.js
 var import_react48 = require("react");
@@ -28098,7 +28104,7 @@ var MenuPortal = function MenuPortal2(props) {
   }), innerProps), children);
   return jsx81(PortalPlacementContext.Provider, {
     value: portalPlacementContext
-  }, appendTo ? /* @__PURE__ */ (0, import_react_dom6.createPortal)(menuWrapper, appendTo) : menuWrapper);
+  }, appendTo ? /* @__PURE__ */ (0, import_react_dom7.createPortal)(menuWrapper, appendTo) : menuWrapper);
 };
 var containerCSS = function containerCSS2(_ref3) {
   var isDisabled = _ref3.isDisabled, isRtl = _ref3.isRtl;
@@ -30991,7 +30997,7 @@ var import_toConsumableArray2 = __toESM(require_toConsumableArray());
 var import_typeof5 = __toESM(require_typeof());
 var import_taggedTemplateLiteral2 = __toESM(require_taggedTemplateLiteral());
 var import_defineProperty3 = __toESM(require_defineProperty());
-var import_react_dom7 = require("react-dom");
+var import_react_dom8 = require("react-dom");
 var StateManagedSelect = /* @__PURE__ */ (0, import_react53.forwardRef)(function(props, ref) {
   var baseSelectProps = useStateManager(props);
   return /* @__PURE__ */ React14.createElement(Select, _extends({
@@ -31523,7 +31529,7 @@ var FileUploadField = (props) => {
             );
           }
         }, [selectedFiles]);
-        return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { className: "file-upload-field", children: [
+        return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { children: [
           selectedFiles?.length > 0 && selectedFiles?.map((fileItem, index4) => /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
             RenderFile,
             {
@@ -32938,7 +32944,7 @@ var StatusDropdownField = (props) => {
 };
 
 // src/widgets/basic/many2many-field/many2many.tsx
-var import_react_dom8 = require("react-dom");
+var import_react_dom9 = require("react-dom");
 var import_react65 = require("react");
 var import_jsx_runtime104 = require("react/jsx-runtime");
 var Many2ManyField = (props) => {
@@ -33013,7 +33019,7 @@ var Many2ManyField = (props) => {
       typeof setGroupByList === "function" && setGroupByList(null);
     };
   }, [selectedTags]);
-  return (0, import_react_dom8.createPortal)(
+  return (0, import_react_dom9.createPortal)(
     /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(
       "div",
       {

package/dist/widgets.mjs

@@ -7755,8 +7755,8 @@ var en_default = {
   download_file: "Download this file",
   upload_success: "Upload file success",
   upload_failure: "Upload file failure",
-  file_accept_single: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP formats are allowed, and each file should be up to 10MB.",
-  file_accept_total: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP formats are allowed, and total should be up to 50MB.",
+  file_accept_single: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP, JSON formats are allowed, and each file should be up to 10MB.",
+  file_accept_total: "Only JPEG, PNG, PDF, MP4, XLS, XLXS, ZIP, JSON formats are allowed, and total should be up to 50MB.",
   must_required: "is required",
   invalid_number: "Invalid number",
   active: "Active",
@@ -12558,6 +12558,7 @@ var M = e2.forwardRef(({ id: t3, anchorId: l2, anchorSelect: n4, content: i3, ht
 });
 
 // src/widgets/advanced/table/table-head.tsx
+import { createPortal as createPortal2 } from "react-dom";
 import { Fragment as Fragment4, jsx as jsx47, jsxs as jsxs26 } from "react/jsx-runtime";
 var TableHead = (props) => {
   const {
@@ -12599,27 +12600,31 @@ var TableHead = (props) => {
           return /* @__PURE__ */ jsx47(
             "th",
             {
+              "data-rtc-resizable": col?.name,
               className: `column whitespace-nowrap text-left p-3 text-sm font-semibold capitalize text-[#060606]`,
               children: /* @__PURE__ */ jsxs26("div", { className: "cursor-pointer flex items-center gap-[4px] w-full min-w-max group relative", children: [
                 col.title,
                 col?.field?.help && /* @__PURE__ */ jsxs26(Fragment4, { children: [
-                  /* @__PURE__ */ jsx47(
-                    M,
-                    {
-                      style: {
-                        padding: "6px 12px",
-                        fontSize: "12px",
-                        borderRadius: "4px",
-                        maxWidth: "200%",
-                        whiteSpace: "wrap",
-                        fontWeight: 400,
-                        textTransform: "none"
-                      },
-                      id: `field-help-${col?.field?.name}`,
-                      content: col?.field?.help,
-                      place: "top",
-                      className: "z-30"
-                    }
+                  createPortal2(
+                    /* @__PURE__ */ jsx47(
+                      M,
+                      {
+                        style: {
+                          padding: "6px 12px",
+                          fontSize: "12px",
+                          borderRadius: "4px",
+                          maxWidth: "200px",
+                          whiteSpace: "wrap",
+                          fontWeight: 400,
+                          textTransform: "none",
+                          zIndex: "9999"
+                        },
+                        id: `field-help-${col?.field?.name}`,
+                        content: col?.field?.help,
+                        place: "top"
+                      }
+                    ),
+                    document.body
                   ),
                   /* @__PURE__ */ jsx47(
                     "span",
@@ -15757,7 +15762,7 @@ var ModalConfirm = ({
 
 // src/widgets/common/modal-detail.tsx
 import { useState as useState7 } from "react";
-import { createPortal as createPortal2 } from "react-dom";
+import { createPortal as createPortal3 } from "react-dom";
 import { Fragment as Fragment13, jsx as jsx65, jsxs as jsxs41 } from "react/jsx-runtime";
 var ModalDetail = ({
   idToolTip,
@@ -15780,7 +15785,7 @@ var ModalDetail = ({
     sessionStorage.setItem("actionData", JSON.stringify(actionData));
     window.location.href = `/form/menu?model=${model}&id=${idForm}`;
   };
-  return createPortal2(
+  return createPortal3(
     /* @__PURE__ */ jsx65(Fragment13, { children: showModalDetail && /* @__PURE__ */ jsxs41("div", { className: "fixed bottom-0 left-0 right-0 top-0 z-[100]", children: [
       /* @__PURE__ */ jsx65("div", { className: "absolute inset-0 bg-[rgba(27,27,27,0.48)]" }),
       /* @__PURE__ */ jsx65("div", { className: "absolute inset-0 overflow-auto flex flex-col justify-center items-center px-5", children: /* @__PURE__ */ jsxs41("div", { className: "relative z-[1] max-w-full p-4 flex flex-col gap-4 w-[1000px] transform rounded-3xl bg-[#FFF] h-[90%]", children: [
@@ -16321,7 +16326,8 @@ var ButtonSelectFiles = ({
     "application/zip",
     "application/x-zip-compressed",
     "application/vnd.ms-excel",
-    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+    "application/json"
   ];
   const MAX_FILE_SIZE = 10 * 1024 * 1024;
   const MAX_TOTAL_SIZE = 50 * 1024 * 1024;
@@ -16422,7 +16428,7 @@ var ButtonSelectFiles = ({
         style: { display: "none" },
         onChange: handleOnChange,
         multiple: true,
-        accept: ".jpeg,.jpg,.png,.pdf,.mp4,.zip,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
+        accept: ".jpeg,.jpg,.png,.pdf,.json,.mp4,.zip,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
       }
     )
   ] });
@@ -27532,7 +27538,7 @@ function _taggedTemplateLiteral(e3, t3) {
 
 // node_modules/react-select/dist/index-641ee5b8.esm.js
 import { useContext as useContext9, useRef as useRef13, useState as useState15, useMemo as useMemo7, useCallback as useCallback7, createContext as createContext5 } from "react";
-import { createPortal as createPortal4 } from "react-dom";
+import { createPortal as createPortal5 } from "react-dom";
 
 // node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.esm.js
 import { useLayoutEffect as useLayoutEffect4 } from "react";
@@ -28035,7 +28041,7 @@ var MenuPortal = function MenuPortal2(props) {
   }), innerProps), children);
   return jsx81(PortalPlacementContext.Provider, {
     value: portalPlacementContext
-  }, appendTo ? /* @__PURE__ */ createPortal4(menuWrapper, appendTo) : menuWrapper);
+  }, appendTo ? /* @__PURE__ */ createPortal5(menuWrapper, appendTo) : menuWrapper);
 };
 var containerCSS = function containerCSS2(_ref3) {
   var isDisabled = _ref3.isDisabled, isRtl = _ref3.isRtl;
@@ -31460,7 +31466,7 @@ var FileUploadField = (props) => {
             );
           }
         }, [selectedFiles]);
-        return /* @__PURE__ */ jsxs58("div", { className: "file-upload-field", children: [
+        return /* @__PURE__ */ jsxs58("div", { children: [
           selectedFiles?.length > 0 && selectedFiles?.map((fileItem, index4) => /* @__PURE__ */ jsx88(
             RenderFile,
             {
@@ -32875,7 +32881,7 @@ var StatusDropdownField = (props) => {
 };
 
 // src/widgets/basic/many2many-field/many2many.tsx
-import { createPortal as createPortal5 } from "react-dom";
+import { createPortal as createPortal6 } from "react-dom";
 import { useEffect as useEffect26 } from "react";
 import { jsx as jsx106, jsxs as jsxs71 } from "react/jsx-runtime";
 var Many2ManyField = (props) => {
@@ -32950,7 +32956,7 @@ var Many2ManyField = (props) => {
       typeof setGroupByList === "function" && setGroupByList(null);
     };
   }, [selectedTags]);
-  return createPortal5(
+  return createPortal6(
     /* @__PURE__ */ jsxs71(
       "div",
       {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fctc/sme-widget-ui",
-  "version": "1.9.2",
+  "version": "1.9.4",
   "main": "dist/index.cjs",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",