@fctc/sme-widget-ui 1.0.1 → 1.0.2

package/dist/widgets.d.ts

@@ -66,7 +66,7 @@ declare const Row: (props: any) => JSX.Element;
 
 declare const Login: React__default.FC<LoginProps>;
 
-declare const Search: ({ removeSearchItems, selectedTags, filterBy, setFilterBy, searchString, onSearchString, handleAddTagSearch, searchBy, groupBy, showFiltersGroups, setGroupBy, setSelectedRowKeys, setDomainList, setPage, fieldsList, viewData, context, aid, selectedRowKeys, domainSearch, evalJSONContext, }: any) => JSX.Element;
+declare const Search: ({ removeSearchItems, selectedTags, filterBy, setFilterBy, searchString, onSearchString, handleAddTagSearch, searchBy, groupBy, showFiltersGroups, setGroupBy, setSelectedRowKeys, setDomainList, setPage, fieldsList, viewData, context, aid, selectedRowKeys, domainSearch, evalJSONContext, clearSearch, }: any) => JSX.Element;
 
 interface IActiveBadgeProps extends IInputFieldProps {
     type: any;
@@ -425,7 +425,7 @@ declare const LoadingSmall: () => JSX.Element;
 
 declare const RenderFiles: ({ selectedFiles, setSelectedFiles, useGetImage }: any) => JSX.Element;
 
-declare const ButtonSelectFiles: ({ fileInputRef, selectedFiles, setSelectedFiles, setUploadError, model, id, widget, useUploadImage, useUploadFile }: any) => JSX.Element;
+declare const ButtonSelectFiles: ({ fileInputRef, selectedFiles, setSelectedFiles, setUploadError, model, id, widget, useUploadImage, useUploadFile, }: any) => JSX.Element;
 
 interface VideoPlayerProps {
     src: string;

package/dist/widgets.js

@@ -12157,7 +12157,10 @@ var TableFilter = ({ columns, onToggleColumnOptional }) => {
     "div",
     {
       ref: filterRef,
-      className: "w-fit absolute top-[8px] right-[10px] ms-auto z-[32] bg-[#eff1f2] pl-2 ",
+      style: {
+        transform: "translateY(-50%)"
+      },
+      className: "w-fit absolute top-[50%] translate-y-[-50%] right-[10px] ms-auto z-[32] bg-[#eff1f2]",
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
           "button",
@@ -12363,7 +12366,11 @@ var TableHead = (props) => {
         columns && Array.isArray(columns) && columns?.some((column2) => column2?.optional) && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
           "th",
           {
-            className: `column whitespace-nowrap text-left p-3 text-sm font-medium capitalize text-[#121212]`,
+            style: {
+              minWidth: "40px",
+              right: 0
+            },
+            className: `column whitespace-nowrap text-left p-3 text-sm font-medium capitalize text-[#121212] min-w-[40px] sticky right-[0px] bg-[#eff1f2]`,
             children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
               TableFilter,
               {
@@ -14520,10 +14527,8 @@ var PopupFilter = ({
                       return;
                     }
                     typeof handleAddTagSearch === "function" && handleAddTagSearch({
-                      title: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(FilterIcon, {}),
                       name: item?.name,
                       value: item?.string ?? item?.help,
-                      icon: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(FilterIcon, {}),
                       domain: item?.domain,
                       groupIndex: item?.group_index,
                       type: SearchType.FILTER
@@ -14562,10 +14567,8 @@ var PopupFilter = ({
                     return;
                   }
                   typeof handleAddTagSearch === "function" && handleAddTagSearch({
-                    title: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(GroupByIcon, {}),
                     name: item?.name,
                     value: item?.string,
-                    icon: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(GroupByIcon, {}),
                     type: SearchType.GROUP,
                     context: JSON.parse(item?.context.replace(/'/g, '"')),
                     active: !isExist,
@@ -14608,7 +14611,7 @@ var TagSearch = ({
           {
             className: "flex min-h-full overflow-hidden rounded bg-[#E9ECEF] hover:shadow-xl",
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "bg-primary flex items-center justify-center px-2 text-sm font-semibold leading-[1.5] text-white", children: tag?.title }),
+              /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "bg-primary flex items-center justify-center px-2 text-sm font-semibold leading-[1.5] text-white", children: tag?.type === SearchType.SEARCH ? tag?.title : /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(FilterIcon, {}) }),
               /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "pl-2 align-middle text-[#495057] text-[14px]", children: tag.values.map((value, idx) => {
                 return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_react17.Fragment, { children: [
                   /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { children: value }),
@@ -14654,7 +14657,7 @@ var TagSearch = ({
                 {
                   className: "flex gap-2 overflow-hidden rounded bg-[#E9ECEF] hover:shadow-xl",
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "bg-primary flex items-center justify-center px-2 text-sm font-semibold leading-[1.5] text-white", children: tag?.title }),
+                    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "bg-primary flex items-center justify-center px-2 text-sm font-semibold leading-[1.5] text-white", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(GroupByIcon, {}) }),
                     value?.strings?.map((string, idx) => /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
                       /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { children: string }),
                       idx < value?.strings.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("span", { className: "text-sm italic text-[#495057] text-opacity-50", children: [
@@ -14767,7 +14770,8 @@ var Search = ({
   aid,
   selectedRowKeys,
   domainSearch,
-  evalJSONContext
+  evalJSONContext,
+  clearSearch
 }) => {
   const [showPopupFilter, setShowPopupFilter] = (0, import_react18.useState)(false);
   const popupFilterRef = useClickOutside({
@@ -14787,6 +14791,13 @@ var Search = ({
       }
     }
   }, [selectedTags, isReadyFormatDomain]);
+  (0, import_react18.useEffect)(() => {
+    return () => {
+      clearSearch();
+      setDidInit(false);
+      setIsReadyFormatDomain(false);
+    };
+  }, [viewData]);
   (0, import_react18.useEffect)(() => {
     if (didInit || selectedTags?.length > 0) return;
     const searchDefaults = Object.entries(context || {}).filter(
@@ -17358,13 +17369,14 @@ var ButtonSelectFiles = ({
   const MAX_TOTAL_SIZE = 50 * 1024 * 1024;
   const { mutate: onUploadImage, isPending } = useUploadImage();
   const { mutate: onUploadFile } = useUploadFile();
-  const handleUploadImage = async ({ data }) => {
+  const handleUploadImage = async ({ formData }) => {
+    console.log("data", formData);
     if (widget !== "many2many_binary") {
       onUploadImage(
-        { data },
+        { formData },
         {
-          onSuccess: (data2) => {
-            const formatData = data2?.data?.["ir.attachment"]?.[0];
+          onSuccess: (data) => {
+            const formatData = data?.data?.["ir.attachment"]?.[0];
             const files = [...selectedFiles, formatData];
             setSelectedFiles(files);
             y2.success(instance.t("upload_success"));
@@ -17376,10 +17388,10 @@ var ButtonSelectFiles = ({
       );
     } else {
       onUploadFile(
-        { data },
+        { formData },
         {
-          onSuccess: (data2) => {
-            const formatData = data2?.data?.["ir.attachment"]?.[0];
+          onSuccess: (data) => {
+            const formatData = data?.data?.["ir.attachment"]?.[0];
             const files = [...selectedFiles, formatData];
             setSelectedFiles(files);
             y2.success(i18n_default.t("upload_success"));
@@ -17422,10 +17434,10 @@ var ButtonSelectFiles = ({
       setUploadError(false);
       const formData = new FormData();
       formData.append("ufile", file);
-      formData.append("thread_model", model);
+      formData.append("thread_model", String(model));
       formData.append("thread_id", Number(id));
       formData.append("is_pending", true);
-      await handleUploadImage({ data: formData });
+      await handleUploadImage({ formData });
     }
   };
   return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
@@ -32659,9 +32671,6 @@ var import_react58 = require("react");
 var import_jsx_runtime87 = require("react/jsx-runtime");
 var InfomationField = (props) => {
   const { value, isForm = false, showName = true, stringToColor } = props;
-  if (isForm) {
-    return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("div", { children: "abc" });
-  }
   if (!value || Array.isArray(value) && value.length === 0) {
     return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(import_jsx_runtime87.Fragment, {});
   }
@@ -32692,7 +32701,7 @@ var InfomationField = (props) => {
 
 // src/widgets/basic/many2many-tags-field/many2many-tags.tsx
 var import_jsx_runtime88 = require("react/jsx-runtime");
-var CustomMultiValue = (props) => {
+var CustomMultiValue = ({ stringToColor, ...props }) => {
   const { selectProps, data, menuList } = props;
   const { relation } = selectProps;
   const actionId = menuList?.flatMap(
@@ -32709,7 +32718,8 @@ var CustomMultiValue = (props) => {
         relation,
         isForm: false,
         aid: actionId?.id,
-        avatarSrc: data?.image_256
+        avatarSrc: data?.image_256,
+        stringToColor
       }
     ),
     /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: "capitalize", children: data?.label ?? data?.display_name }),
@@ -32754,7 +32764,14 @@ var Many2ManyTagField = (props) => {
       value: item.id,
       label: item.name ?? item.display_name
     })) : [];
-    return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(InfomationField, { value: optionValue || null, isForm, stringToColor });
+    return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
+      InfomationField,
+      {
+        value: optionValue || null,
+        isForm,
+        stringToColor
+      }
+    );
   }
   return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
     Controller,
@@ -32839,7 +32856,13 @@ var Many2ManyTagField = (props) => {
                 })
               },
               components: isUser ? {
-                MultiValue: CustomMultiValue,
+                MultiValue: (multiValueProps) => /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
+                  CustomMultiValue,
+                  {
+                    ...multiValueProps,
+                    stringToColor
+                  }
+                ),
                 IndicatorSeparator: () => null
               } : {
                 IndicatorSeparator: () => null
@@ -33605,7 +33628,8 @@ var Many2ManyField = (props) => {
     searchString,
     selectedTags,
     setFilterBy,
-    setGroupBy
+    setGroupBy,
+    clearSearch
   } = searchController;
   return (0, import_react_dom8.createPortal)(
     /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: "fixed bottom-0 left-0 right-0 top-0 z-[9999]", children: [
@@ -33646,7 +33670,8 @@ var Many2ManyField = (props) => {
               selectedRowKeys,
               aid,
               domainSearch,
-              evalJSONContext
+              evalJSONContext,
+              clearSearch
             }
           ) }),
           /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(

package/dist/widgets.mjs

@@ -12023,11 +12023,11 @@ var TableBody = (props) => {
 };
 
 // src/widgets/advanced/table/table-filter.tsx
-import { useEffect as useEffect4, useRef as useRef5, useState as useState3 } from "react";
+import { useEffect as useEffect4, useRef as useRef4, useState as useState3 } from "react";
 import { createPortal } from "react-dom";
 
 // src/hooks/use-click-outside.ts
-import { useEffect as useEffect3, useRef as useRef4 } from "react";
+import { useEffect as useEffect3, useRef as useRef3 } from "react";
 var DEFAULT_EVENTS = ["mousedown", "touchstart"];
 var useClickOutside = ({
   handler,
@@ -12036,7 +12036,7 @@ var useClickOutside = ({
   // Default to empty array to avoid undefined errors
   refs
 }) => {
-  const ref = useRef4(null);
+  const ref = useRef3(null);
   useEffect3(() => {
     const listener = (event) => {
       const { target } = event;
@@ -12063,7 +12063,7 @@ import { jsx as jsx43, jsxs as jsxs27 } from "react/jsx-runtime";
 var TableFilter = ({ columns, onToggleColumnOptional }) => {
   const [openTableFilter, setOpenTableFilter] = useState3();
   const [filterPosition, setFilterPosition] = useState3(null);
-  const filterPopupRef = useRef5(null);
+  const filterPopupRef = useRef4(null);
   const filterRef = useClickOutside({
     handler: () => {
       if (openTableFilter) {
@@ -12095,7 +12095,10 @@ var TableFilter = ({ columns, onToggleColumnOptional }) => {
     "div",
     {
       ref: filterRef,
-      className: "w-fit absolute top-[8px] right-[10px] ms-auto z-[32] bg-[#eff1f2] pl-2 ",
+      style: {
+        transform: "translateY(-50%)"
+      },
+      className: "w-fit absolute top-[50%] translate-y-[-50%] right-[10px] ms-auto z-[32] bg-[#eff1f2]",
       children: [
         /* @__PURE__ */ jsx43(
           "button",
@@ -12301,7 +12304,11 @@ var TableHead = (props) => {
         columns && Array.isArray(columns) && columns?.some((column2) => column2?.optional) && /* @__PURE__ */ jsx45(
           "th",
           {
-            className: `column whitespace-nowrap text-left p-3 text-sm font-medium capitalize text-[#121212]`,
+            style: {
+              minWidth: "40px",
+              right: 0
+            },
+            className: `column whitespace-nowrap text-left p-3 text-sm font-medium capitalize text-[#121212] min-w-[40px] sticky right-[0px] bg-[#eff1f2]`,
             children: /* @__PURE__ */ jsx45(
               TableFilter,
               {
@@ -14458,10 +14465,8 @@ var PopupFilter = ({
                       return;
                     }
                     typeof handleAddTagSearch === "function" && handleAddTagSearch({
-                      title: /* @__PURE__ */ jsx54(FilterIcon, {}),
                       name: item?.name,
                       value: item?.string ?? item?.help,
-                      icon: /* @__PURE__ */ jsx54(FilterIcon, {}),
                       domain: item?.domain,
                       groupIndex: item?.group_index,
                       type: SearchType.FILTER
@@ -14500,10 +14505,8 @@ var PopupFilter = ({
                     return;
                   }
                   typeof handleAddTagSearch === "function" && handleAddTagSearch({
-                    title: /* @__PURE__ */ jsx54(GroupByIcon, {}),
                     name: item?.name,
                     value: item?.string,
-                    icon: /* @__PURE__ */ jsx54(GroupByIcon, {}),
                     type: SearchType.GROUP,
                     context: JSON.parse(item?.context.replace(/'/g, '"')),
                     active: !isExist,
@@ -14546,7 +14549,7 @@ var TagSearch = ({
           {
             className: "flex min-h-full overflow-hidden rounded bg-[#E9ECEF] hover:shadow-xl",
             children: [
-              /* @__PURE__ */ jsx55("div", { className: "bg-primary flex items-center justify-center px-2 text-sm font-semibold leading-[1.5] text-white", children: tag?.title }),
+              /* @__PURE__ */ jsx55("div", { className: "bg-primary flex items-center justify-center px-2 text-sm font-semibold leading-[1.5] text-white", children: tag?.type === SearchType.SEARCH ? tag?.title : /* @__PURE__ */ jsx55(FilterIcon, {}) }),
               /* @__PURE__ */ jsx55("div", { className: "pl-2 align-middle text-[#495057] text-[14px]", children: tag.values.map((value, idx) => {
                 return /* @__PURE__ */ jsxs37(Fragment7, { children: [
                   /* @__PURE__ */ jsx55("span", { children: value }),
@@ -14592,7 +14595,7 @@ var TagSearch = ({
                 {
                   className: "flex gap-2 overflow-hidden rounded bg-[#E9ECEF] hover:shadow-xl",
                   children: [
-                    /* @__PURE__ */ jsx55("div", { className: "bg-primary flex items-center justify-center px-2 text-sm font-semibold leading-[1.5] text-white", children: tag?.title }),
+                    /* @__PURE__ */ jsx55("div", { className: "bg-primary flex items-center justify-center px-2 text-sm font-semibold leading-[1.5] text-white", children: /* @__PURE__ */ jsx55(GroupByIcon, {}) }),
                     value?.strings?.map((string, idx) => /* @__PURE__ */ jsxs37(Fragment8, { children: [
                       /* @__PURE__ */ jsx55("span", { children: string }),
                       idx < value?.strings.length - 1 && /* @__PURE__ */ jsxs37("span", { className: "text-sm italic text-[#495057] text-opacity-50", children: [
@@ -14705,7 +14708,8 @@ var Search = ({
   aid,
   selectedRowKeys,
   domainSearch,
-  evalJSONContext
+  evalJSONContext,
+  clearSearch
 }) => {
   const [showPopupFilter, setShowPopupFilter] = useState5(false);
   const popupFilterRef = useClickOutside({
@@ -14725,6 +14729,13 @@ var Search = ({
       }
     }
   }, [selectedTags, isReadyFormatDomain]);
+  useEffect6(() => {
+    return () => {
+      clearSearch();
+      setDidInit(false);
+      setIsReadyFormatDomain(false);
+    };
+  }, [viewData]);
   useEffect6(() => {
     if (didInit || selectedTags?.length > 0) return;
     const searchDefaults = Object.entries(context || {}).filter(
@@ -16913,11 +16924,11 @@ var LoadingSmall = () => {
 };
 
 // src/widgets/common/video-player.tsx
-import { useRef as useRef6, useState as useState9 } from "react";
+import { useRef as useRef5, useState as useState9 } from "react";
 import { jsx as jsx64, jsxs as jsxs44 } from "react/jsx-runtime";
 var VideoPlayer = ({ src }) => {
   const [isPlaying, setIsPlaying] = useState9(false);
-  const videoRef = useRef6(null);
+  const videoRef = useRef5(null);
   const handlePlayPause = () => {
     if (videoRef.current) {
       if (isPlaying) {
@@ -17296,13 +17307,14 @@ var ButtonSelectFiles = ({
   const MAX_TOTAL_SIZE = 50 * 1024 * 1024;
   const { mutate: onUploadImage, isPending } = useUploadImage();
   const { mutate: onUploadFile } = useUploadFile();
-  const handleUploadImage = async ({ data }) => {
+  const handleUploadImage = async ({ formData }) => {
+    console.log("data", formData);
     if (widget !== "many2many_binary") {
       onUploadImage(
-        { data },
+        { formData },
         {
-          onSuccess: (data2) => {
-            const formatData = data2?.data?.["ir.attachment"]?.[0];
+          onSuccess: (data) => {
+            const formatData = data?.data?.["ir.attachment"]?.[0];
             const files = [...selectedFiles, formatData];
             setSelectedFiles(files);
             y2.success(instance.t("upload_success"));
@@ -17314,10 +17326,10 @@ var ButtonSelectFiles = ({
       );
     } else {
       onUploadFile(
-        { data },
+        { formData },
         {
-          onSuccess: (data2) => {
-            const formatData = data2?.data?.["ir.attachment"]?.[0];
+          onSuccess: (data) => {
+            const formatData = data?.data?.["ir.attachment"]?.[0];
             const files = [...selectedFiles, formatData];
             setSelectedFiles(files);
             y2.success(i18n_default.t("upload_success"));
@@ -17360,10 +17372,10 @@ var ButtonSelectFiles = ({
       setUploadError(false);
       const formData = new FormData();
       formData.append("ufile", file);
-      formData.append("thread_model", model);
+      formData.append("thread_model", String(model));
       formData.append("thread_id", Number(id));
       formData.append("is_pending", true);
-      await handleUploadImage({ data: formData });
+      await handleUploadImage({ formData });
     }
   };
   return /* @__PURE__ */ jsxs46(Fragment13, { children: [
@@ -17809,7 +17821,7 @@ var CheckboxField = (props) => {
 };
 
 // src/widgets/basic/color-field/color-wrapper.tsx
-import { useEffect as useEffect10, useRef as useRef7, useState as useState10 } from "react";
+import { useEffect as useEffect10, useRef as useRef6, useState as useState10 } from "react";
 import { Fragment as Fragment17, jsx as jsx73, jsxs as jsxs51 } from "react/jsx-runtime";
 var ColorWrapper = (props) => {
   const {
@@ -17819,7 +17831,7 @@ var ColorWrapper = (props) => {
   } = props;
   const [selectedColor, setSelectedColor] = useState10(colors2[defaultColor]);
   const [showFullColors, setIsShowFullColor] = useState10(false);
-  const pickColorsRef = useRef7(null);
+  const pickColorsRef = useRef6(null);
   useEffect10(() => {
     setSelectedColor(colors2[defaultColor]);
   }, [defaultColor]);
@@ -18020,7 +18032,7 @@ var CopyLinkButtonField = (props) => {
 import { forwardRef as forwardRef6, useEffect as useEffect15 } from "react";
 
 // node_modules/react-datepicker/dist/index.es.js
-import React9, { useRef as useRef11, useCallback as useCallback5, useEffect as useEffect13, cloneElement as cloneElement3, Component, createRef, createElement as createElement5 } from "react";
+import React9, { useRef as useRef10, useCallback as useCallback5, useEffect as useEffect13, cloneElement as cloneElement3, Component, createRef, createElement as createElement5 } from "react";
 
 // node_modules/date-fns/constants.js
 var daysInYear = 365.2425;
@@ -22590,8 +22602,8 @@ var CalendarContainer = function(_a2) {
   return React9.createElement("div", { className, role: "dialog", "aria-label": ariaLabel, "aria-modal": "true" }, children);
 };
 var useDetectClickOutside = function(onClickOutside, ignoreClass) {
-  var ref = useRef11(null);
-  var onClickOutsideRef = useRef11(onClickOutside);
+  var ref = useRef10(null);
+  var onClickOutsideRef = useRef10(onClickOutside);
   onClickOutsideRef.current = onClickOutside;
   var handleClickOutside = useCallback5(function(event) {
     var _a2;
@@ -25845,7 +25857,7 @@ function withFloating(Component3) {
   var WithFloating = function(props) {
     var _a2;
     var hidePopper = typeof props.hidePopper === "boolean" ? props.hidePopper : true;
-    var arrowRef = useRef11(null);
+    var arrowRef = useRef10(null);
     var floatingProps = useFloating2(_assign({ open: !hidePopper, whileElementsMounted: autoUpdate, placement: props.popperPlacement, middleware: __spreadArray([
       flip3({ padding: 15 }),
       offset3(10),
@@ -27024,7 +27036,7 @@ function _toConsumableArray(r4) {
 
 // node_modules/react-select/dist/Select-ef7c0426.esm.js
 import * as React13 from "react";
-import { useMemo as useMemo7, Fragment as Fragment21, useRef as useRef14, useCallback as useCallback8, useEffect as useEffect14, Component as Component2 } from "react";
+import { useMemo as useMemo7, Fragment as Fragment21, useRef as useRef13, useCallback as useCallback8, useEffect as useEffect14, Component as Component2 } from "react";
 
 // node_modules/@emotion/react/dist/emotion-element-d59e098f.esm.js
 import * as React11 from "react";
@@ -28356,7 +28368,7 @@ function _taggedTemplateLiteral(e3, t3) {
 }
 
 // node_modules/react-select/dist/index-641ee5b8.esm.js
-import { useContext as useContext8, useRef as useRef13, useState as useState14, useMemo as useMemo6, useCallback as useCallback7, createContext as createContext4 } from "react";
+import { useContext as useContext8, useRef as useRef12, useState as useState14, useMemo as useMemo6, useCallback as useCallback7, createContext as createContext4 } from "react";
 import { createPortal as createPortal4 } from "react-dom";
 
 // node_modules/use-isomorphic-layout-effect/dist/use-isomorphic-layout-effect.esm.js
@@ -28702,7 +28714,7 @@ var PortalPlacementContext = /* @__PURE__ */ createContext4(null);
 var MenuPlacer = function MenuPlacer2(props) {
   var children = props.children, minMenuHeight = props.minMenuHeight, maxMenuHeight = props.maxMenuHeight, menuPlacement = props.menuPlacement, menuPosition = props.menuPosition, menuShouldScrollIntoView = props.menuShouldScrollIntoView, theme = props.theme;
   var _ref3 = useContext8(PortalPlacementContext) || {}, setPortalPlacement = _ref3.setPortalPlacement;
-  var ref = useRef13(null);
+  var ref = useRef12(null);
   var _useState = useState14(maxMenuHeight), _useState2 = _slicedToArray(_useState, 2), maxHeight = _useState2[0], setMaxHeight = _useState2[1];
   var _useState3 = useState14(null), _useState4 = _slicedToArray(_useState3, 2), placement = _useState4[0], setPlacement = _useState4[1];
   var controlHeight2 = theme.spacing.controlHeight;
@@ -28806,8 +28818,8 @@ var menuPortalCSS = function menuPortalCSS2(_ref8) {
 };
 var MenuPortal = function MenuPortal2(props) {
   var appendTo = props.appendTo, children = props.children, controlElement = props.controlElement, innerProps = props.innerProps, menuPlacement = props.menuPlacement, menuPosition = props.menuPosition;
-  var menuPortalRef = useRef13(null);
-  var cleanupRef = useRef13(null);
+  var menuPortalRef = useRef12(null);
+  var cleanupRef = useRef12(null);
   var _useState5 = useState14(coercePlacement(menuPlacement)), _useState6 = _slicedToArray(_useState5, 2), placement = _useState6[0], setPortalPlacement = _useState6[1];
   var portalPlacementContext = useMemo6(function() {
     return {
@@ -29945,10 +29957,10 @@ var cancelScroll = function cancelScroll2(event) {
 };
 function useScrollCapture(_ref3) {
   var isEnabled = _ref3.isEnabled, onBottomArrive = _ref3.onBottomArrive, onBottomLeave = _ref3.onBottomLeave, onTopArrive = _ref3.onTopArrive, onTopLeave = _ref3.onTopLeave;
-  var isBottom = useRef14(false);
-  var isTop = useRef14(false);
-  var touchStart = useRef14(0);
-  var scrollTarget = useRef14(null);
+  var isBottom = useRef13(false);
+  var isTop = useRef13(false);
+  var touchStart = useRef13(0);
+  var scrollTarget = useRef13(null);
   var handleEventDelta = useCallback8(function(event, delta) {
     if (scrollTarget.current === null) return;
     var _scrollTarget$current = scrollTarget.current, scrollTop = _scrollTarget$current.scrollTop, scrollHeight = _scrollTarget$current.scrollHeight, clientHeight = _scrollTarget$current.clientHeight;
@@ -30055,8 +30067,8 @@ var listenerOptions = {
 };
 function useScrollLock(_ref3) {
   var isEnabled = _ref3.isEnabled, _ref$accountForScroll = _ref3.accountForScrollbars, accountForScrollbars = _ref$accountForScroll === void 0 ? true : _ref$accountForScroll;
-  var originalStyles = useRef14({});
-  var scrollTarget = useRef14(null);
+  var originalStyles = useRef13({});
+  var scrollTarget = useRef13(null);
   var addScrollLock = useCallback8(function(touchScrollTarget) {
     if (!canUseDOM) return;
     var target = document.body;
@@ -32180,11 +32192,11 @@ var FeeField = (props) => {
 };
 
 // src/widgets/basic/file-upload-field/file-upload.tsx
-import { useEffect as useEffect16, useRef as useRef15, useState as useState16 } from "react";
+import { useEffect as useEffect16, useRef as useRef14, useState as useState16 } from "react";
 import { jsx as jsx84, jsxs as jsxs59 } from "react/jsx-runtime";
 var FileUploadField = (props) => {
   const { name: name2, methods, isForm, model, required, idForm, widget, useUploadImage, useUploadFile, useGetImage, isBase64File } = props;
-  const fileInputRef = useRef15(null);
+  const fileInputRef = useRef14(null);
   const [selectedFiles, setSelectedFiles] = useState16([]);
   const [uploadError, setUploadError] = useState16();
   return /* @__PURE__ */ jsx84(
@@ -32245,7 +32257,7 @@ var FileUploadField = (props) => {
 };
 
 // src/widgets/basic/float-field/float.tsx
-import { useEffect as useEffect17, useRef as useRef16, useState as useState17 } from "react";
+import { useEffect as useEffect17, useRef as useRef15, useState as useState17 } from "react";
 import { Fragment as Fragment24, jsx as jsx85, jsxs as jsxs60 } from "react/jsx-runtime";
 var FloatField = (props) => {
   const {
@@ -32286,9 +32298,9 @@ var FloatField = (props) => {
             setInputValue("");
           }
         }, [value, name2, clearErrors]);
-        const isDirtyRef = useRef16(false);
-        const inputRef = useRef16(null);
-        const lastCommittedValueRef = useRef16(null);
+        const isDirtyRef = useRef15(false);
+        const inputRef = useRef15(null);
+        const lastCommittedValueRef = useRef15(null);
         const handleInputChange = (e3) => {
           const newValue = e3.target.value;
           const valueWithoutCommas = newValue.replace(/,/g, "");
@@ -32518,7 +32530,7 @@ var FloatTimeField = (props) => {
 };
 
 // src/widgets/basic/html-field/html.tsx
-import { useEffect as useEffect18, useRef as useRef17 } from "react";
+import { useEffect as useEffect18, useRef as useRef16 } from "react";
 import { jsx as jsx87 } from "react/jsx-runtime";
 var HtmlField = (props) => {
   const {
@@ -32530,7 +32542,7 @@ var HtmlField = (props) => {
     onChange: onChange2,
     value
   } = props;
-  const divRef = useRef17(null);
+  const divRef = useRef16(null);
   if (!isForm) {
     return /* @__PURE__ */ jsx87("div", { dangerouslySetInnerHTML: { __html: value || defaultValue || "" } });
   }
@@ -32597,9 +32609,6 @@ import { useEffect as useEffect19 } from "react";
 import { Fragment as Fragment26, jsx as jsx89, jsxs as jsxs62 } from "react/jsx-runtime";
 var InfomationField = (props) => {
   const { value, isForm = false, showName = true, stringToColor } = props;
-  if (isForm) {
-    return /* @__PURE__ */ jsx89("div", { children: "abc" });
-  }
   if (!value || Array.isArray(value) && value.length === 0) {
     return /* @__PURE__ */ jsx89(Fragment26, {});
   }
@@ -32630,7 +32639,7 @@ var InfomationField = (props) => {
 
 // src/widgets/basic/many2many-tags-field/many2many-tags.tsx
 import { jsx as jsx90, jsxs as jsxs63 } from "react/jsx-runtime";
-var CustomMultiValue = (props) => {
+var CustomMultiValue = ({ stringToColor, ...props }) => {
   const { selectProps, data, menuList } = props;
   const { relation } = selectProps;
   const actionId = menuList?.flatMap(
@@ -32647,7 +32656,8 @@ var CustomMultiValue = (props) => {
         relation,
         isForm: false,
         aid: actionId?.id,
-        avatarSrc: data?.image_256
+        avatarSrc: data?.image_256,
+        stringToColor
       }
     ),
     /* @__PURE__ */ jsx90("span", { className: "capitalize", children: data?.label ?? data?.display_name }),
@@ -32692,7 +32702,14 @@ var Many2ManyTagField = (props) => {
       value: item.id,
       label: item.name ?? item.display_name
     })) : [];
-    return /* @__PURE__ */ jsx90(InfomationField, { value: optionValue || null, isForm, stringToColor });
+    return /* @__PURE__ */ jsx90(
+      InfomationField,
+      {
+        value: optionValue || null,
+        isForm,
+        stringToColor
+      }
+    );
   }
   return /* @__PURE__ */ jsx90(
     Controller,
@@ -32777,7 +32794,13 @@ var Many2ManyTagField = (props) => {
                 })
               },
               components: isUser ? {
-                MultiValue: CustomMultiValue,
+                MultiValue: (multiValueProps) => /* @__PURE__ */ jsx90(
+                  CustomMultiValue,
+                  {
+                    ...multiValueProps,
+                    stringToColor
+                  }
+                ),
                 IndicatorSeparator: () => null
               } : {
                 IndicatorSeparator: () => null
@@ -33301,7 +33324,7 @@ var ToggleButtonField = (props) => {
 };
 
 // src/widgets/basic/integer-field/integer.tsx
-import { useEffect as useEffect23, useRef as useRef18, useState as useState20 } from "react";
+import { useEffect as useEffect23, useRef as useRef17, useState as useState20 } from "react";
 import { Fragment as Fragment29, jsx as jsx100, jsxs as jsxs70 } from "react/jsx-runtime";
 var IntegerField = (props) => {
   const {
@@ -33336,9 +33359,9 @@ var IntegerField = (props) => {
         fieldState: { error: error2 }
       }) => {
         const { setError, clearErrors } = methods;
-        const isDirtyRef = useRef18(false);
-        const inputRef = useRef18(null);
-        const lastCommittedValueRef = useRef18(null);
+        const isDirtyRef = useRef17(false);
+        const inputRef = useRef17(null);
+        const lastCommittedValueRef = useRef17(null);
         const [inputValue, setInputValue] = useState20(
           value2 !== void 0 && value2 !== null ? String(value2) : ""
         );
@@ -33543,7 +33566,8 @@ var Many2ManyField = (props) => {
     searchString,
     selectedTags,
     setFilterBy,
-    setGroupBy
+    setGroupBy,
+    clearSearch
   } = searchController;
   return createPortal5(
     /* @__PURE__ */ jsxs72("div", { className: "fixed bottom-0 left-0 right-0 top-0 z-[9999]", children: [
@@ -33584,7 +33608,8 @@ var Many2ManyField = (props) => {
               selectedRowKeys,
               aid,
               domainSearch,
-              evalJSONContext
+              evalJSONContext,
+              clearSearch
             }
           ) }),
           /* @__PURE__ */ jsx102(