@fctc/widget-logic 3.7.0 → 3.7.2

package/dist/index.js

@@ -5671,35 +5671,45 @@ var many2manyTagsController = (props) => {
     options: optionsFields,
     widget,
     formValues,
-    placeholderNoOption,
     service,
     xNode,
-    context: fieldContext
+    context: fieldContext,
+    onChange,
+    methods,
+    name
   } = props;
   const isUser = relation === "res.users" || relation === "res.partner";
   const { env } = (0, provider_exports.useEnv)();
   const { action } = useAppProvider();
   const { useGetSelection: useGetSelection3 } = (0, provider_exports.useService)();
+  const [options, setOptions] = (0, import_react18.useState)([]);
+  const [inputValue, setInputValue] = (0, import_react18.useState)("");
+  const [debouncedInputValue] = useDebounce(inputValue, 1e3);
+  const [domainObject, setDomainObject] = (0, import_react18.useState)(null);
+  const [isShowModalMany2Many, setIsShowModalMany2Many] = (0, import_react18.useState)(false);
+  const addtionalFields = optionsFields ? (0, import_utils10.evalJSONContext)(optionsFields) : null;
   const contextObject = {
     ...(0, import_utils10.evalJSONContext)(action?.context) || {},
     ...fieldContext ?? {},
     ...env?.context
   };
-  const addtionalFields = optionsFields ? (0, import_utils10.evalJSONContext)(optionsFields) : null;
-  const domainObject = (0, import_react18.useMemo)(
-    () => (0, import_utils10.evalJSONDomain)(
-      domain,
-      JSON.parse(
-        JSON.stringify({
-          ...formValues,
-          ...contextObject,
-          context: contextObject,
-          parent: { ...formValues }
-        })
-      )
-    ),
-    [domain]
+  const parsedFormValues = (0, import_react18.useMemo)(
+    () => JSON.parse(
+      JSON.stringify({
+        ...formValues,
+        ...contextObject,
+        context: contextObject,
+        parent: { ...formValues }
+      })
+    ) ?? {},
+    [formValues, contextObject]
   );
+  (0, import_react18.useEffect)(() => {
+    const newDomain = (0, import_utils10.evalJSONDomain)(domain, parsedFormValues);
+    setDomainObject(
+      (prev) => JSON.stringify(prev) === JSON.stringify(newDomain) ? prev : newDomain
+    );
+  }, [domain, parsedFormValues]);
   const data = {
     model: relation ?? "",
     domain: domainObject,
@@ -5712,36 +5722,60 @@ var many2manyTagsController = (props) => {
     },
     context: env.context
   };
-  const { data: dataOfSelection } = useGetSelection3({
+  const queryKey = [`data_${relation}`, domainObject];
+  const {
+    data: dataOfSelection,
+    refetch,
+    isFetching
+  } = useGetSelection3({
     data,
-    queryKey: [
-      `data_${relation}`,
-      domainObject,
-      formValues?.id,
-      action?.id,
-      action?.res_model
-    ],
+    queryKey,
     service,
     xNode,
-    enabled: true
+    enabled: false
   });
-  const customNoOptionsMessage = () => placeholderNoOption;
+  const selectOptions = (0, import_react18.useMemo)(() => {
+    return dataOfSelection?.records?.map((val) => ({
+      value: val.id,
+      label: val.name ?? val.display_name,
+      ...val
+    })) || [];
+  }, [dataOfSelection]);
+  (0, import_react18.useEffect)(() => {
+    setOptions(selectOptions);
+  }, [selectOptions]);
+  const fetchMoreOptions = (0, import_react18.useCallback)(() => {
+    refetch();
+  }, [refetch]);
   const transfer = (data2) => {
     return data2?.map((val) => ({
       id: val.value,
       display_name: val.label
     })) || [];
   };
-  const options = dataOfSelection?.records?.map((val) => ({
-    value: val.id,
-    label: val.name ?? val.display_name,
-    ...val
-  })) || [];
+  const handleChooseRecord = (0, import_react18.useCallback)(
+    (idRecord) => {
+      const newOption = options.find(
+        (option) => option.value === idRecord
+      );
+      setIsShowModalMany2Many(false);
+    },
+    [options, methods, name, onChange]
+  );
+  const handleClose = (0, import_react18.useCallback)(() => setIsShowModalMany2Many(false), []);
   return {
     options,
-    customNoOptionsMessage,
     transfer,
-    isUser
+    isUser,
+    isFetching,
+    fetchMoreOptions,
+    setInputValue,
+    domainObject,
+    setDomainObject,
+    handleChooseRecord,
+    handleClose,
+    isShowModalMany2Many,
+    setIsShowModalMany2Many
   };
 };
 

package/dist/index.mjs

@@ -5742,7 +5742,7 @@ var many2manyFieldController = (props) => {
 };
 
 // src/widget/basic/many2many-tags-field/controller.ts
-import { useMemo as useMemo9 } from "react";
+import { useCallback as useCallback5, useEffect as useEffect12, useMemo as useMemo9, useState as useState8 } from "react";
 import { WIDGETAVATAR, WIDGETCOLOR } from "@fctc/interface-logic/constants";
 import { evalJSONContext as evalJSONContext5, evalJSONDomain as evalJSONDomain4 } from "@fctc/interface-logic/utils";
 var many2manyTagsController = (props) => {
@@ -5752,35 +5752,45 @@ var many2manyTagsController = (props) => {
     options: optionsFields,
     widget,
     formValues,
-    placeholderNoOption,
     service,
     xNode,
-    context: fieldContext
+    context: fieldContext,
+    onChange,
+    methods,
+    name
   } = props;
   const isUser = relation === "res.users" || relation === "res.partner";
   const { env } = (0, provider_exports.useEnv)();
   const { action } = useAppProvider();
   const { useGetSelection: useGetSelection3 } = (0, provider_exports.useService)();
+  const [options, setOptions] = useState8([]);
+  const [inputValue, setInputValue] = useState8("");
+  const [debouncedInputValue] = useDebounce(inputValue, 1e3);
+  const [domainObject, setDomainObject] = useState8(null);
+  const [isShowModalMany2Many, setIsShowModalMany2Many] = useState8(false);
+  const addtionalFields = optionsFields ? evalJSONContext5(optionsFields) : null;
   const contextObject = {
     ...evalJSONContext5(action?.context) || {},
     ...fieldContext ?? {},
     ...env?.context
   };
-  const addtionalFields = optionsFields ? evalJSONContext5(optionsFields) : null;
-  const domainObject = useMemo9(
-    () => evalJSONDomain4(
-      domain,
-      JSON.parse(
-        JSON.stringify({
-          ...formValues,
-          ...contextObject,
-          context: contextObject,
-          parent: { ...formValues }
-        })
-      )
-    ),
-    [domain]
+  const parsedFormValues = useMemo9(
+    () => JSON.parse(
+      JSON.stringify({
+        ...formValues,
+        ...contextObject,
+        context: contextObject,
+        parent: { ...formValues }
+      })
+    ) ?? {},
+    [formValues, contextObject]
   );
+  useEffect12(() => {
+    const newDomain = evalJSONDomain4(domain, parsedFormValues);
+    setDomainObject(
+      (prev) => JSON.stringify(prev) === JSON.stringify(newDomain) ? prev : newDomain
+    );
+  }, [domain, parsedFormValues]);
   const data = {
     model: relation ?? "",
     domain: domainObject,
@@ -5793,41 +5803,65 @@ var many2manyTagsController = (props) => {
     },
     context: env.context
   };
-  const { data: dataOfSelection } = useGetSelection3({
+  const queryKey = [`data_${relation}`, domainObject];
+  const {
+    data: dataOfSelection,
+    refetch,
+    isFetching
+  } = useGetSelection3({
     data,
-    queryKey: [
-      `data_${relation}`,
-      domainObject,
-      formValues?.id,
-      action?.id,
-      action?.res_model
-    ],
+    queryKey,
     service,
     xNode,
-    enabled: true
+    enabled: false
   });
-  const customNoOptionsMessage = () => placeholderNoOption;
+  const selectOptions = useMemo9(() => {
+    return dataOfSelection?.records?.map((val) => ({
+      value: val.id,
+      label: val.name ?? val.display_name,
+      ...val
+    })) || [];
+  }, [dataOfSelection]);
+  useEffect12(() => {
+    setOptions(selectOptions);
+  }, [selectOptions]);
+  const fetchMoreOptions = useCallback5(() => {
+    refetch();
+  }, [refetch]);
   const transfer = (data2) => {
     return data2?.map((val) => ({
       id: val.value,
       display_name: val.label
     })) || [];
   };
-  const options = dataOfSelection?.records?.map((val) => ({
-    value: val.id,
-    label: val.name ?? val.display_name,
-    ...val
-  })) || [];
+  const handleChooseRecord = useCallback5(
+    (idRecord) => {
+      const newOption = options.find(
+        (option) => option.value === idRecord
+      );
+      setIsShowModalMany2Many(false);
+    },
+    [options, methods, name, onChange]
+  );
+  const handleClose = useCallback5(() => setIsShowModalMany2Many(false), []);
   return {
     options,
-    customNoOptionsMessage,
     transfer,
-    isUser
+    isUser,
+    isFetching,
+    fetchMoreOptions,
+    setInputValue,
+    domainObject,
+    setDomainObject,
+    handleChooseRecord,
+    handleClose,
+    isShowModalMany2Many,
+    setIsShowModalMany2Many
   };
 };
 
 // src/widget/basic/status-bar-field/controller.ts
-import { useState as useState8 } from "react";
+import { useState as useState9 } from "react";
 import { evalJSONDomain as evalJSONDomain5 } from "@fctc/interface-logic/utils";
 var durationController = (props) => {
   const { relation, domain, formValues, name, id, model, onRefetch, enabled } = props;
@@ -5838,8 +5872,8 @@ var durationController = (props) => {
   };
   const { useGetListData: useGetListData2, useChangeStatus: useChangeStatus2 } = (0, provider_exports.useService)();
   const { env } = (0, provider_exports.useEnv)();
-  const [disabled, setDisabled] = useState8(false);
-  const [modelStatus, setModalStatus] = useState8(false);
+  const [disabled, setDisabled] = useState9(false);
+  const [modelStatus, setModalStatus] = useState9(false);
   const queryKey = [`data-status-duration`, specification];
   const listDataProps = {
     model: relation,
@@ -5929,10 +5963,10 @@ var priorityFieldController = (props) => {
 };
 
 // src/widget/basic/download-file-field/controller.ts
-import { useId, useState as useState9 } from "react";
+import { useId, useState as useState10 } from "react";
 var downloadFileController = () => {
   const inputId = useId();
-  const [file, setFile] = useState9(null);
+  const [file, setFile] = useState10(null);
   const handleFileChange = (e) => {
     setFile(e.target.files[0]);
   };
@@ -6864,11 +6898,11 @@ var dateFieldController = (props) => {
 };
 
 // src/widget/basic/copy-link-button/controller.ts
-import { useState as useState10 } from "react";
+import { useState as useState11 } from "react";
 import { copyTextToClipboard } from "@fctc/interface-logic/utils";
 var copyLinkButtonController = (props) => {
   const { value, defaultValue } = props;
-  const [isCopied, setIsCopied] = useState10(false);
+  const [isCopied, setIsCopied] = useState11(false);
   const handleCopyToClipboard = async (value2) => {
     await copyTextToClipboard(value2);
     setIsCopied(true);
@@ -6916,14 +6950,14 @@ var colorFieldController = (props) => {
 };
 
 // src/widget/basic/binary-field/controller.ts
-import { useEffect as useEffect12, useId as useId2, useRef as useRef4, useState as useState11 } from "react";
+import { useEffect as useEffect13, useId as useId2, useRef as useRef4, useState as useState12 } from "react";
 import { isBase64Image } from "@fctc/interface-logic/utils";
 var binaryFieldController = (props) => {
   const { name, methods, readonly = false, value } = props;
   const inputId = useId2();
-  const [selectedImage, setSelectedImage] = useState11(null);
-  const [initialImage, setInitialImage] = useState11(value || null);
-  const [isInsideTable, setIsInsideTable] = useState11(false);
+  const [selectedImage, setSelectedImage] = useState12(null);
+  const [initialImage, setInitialImage] = useState12(value || null);
+  const [isInsideTable, setIsInsideTable] = useState12(false);
   const { setValue } = methods;
   const binaryRef = useRef4(null);
   const convertUrlToBase64 = async (url) => {
@@ -6987,14 +7021,14 @@ var binaryFieldController = (props) => {
     else if (base64.startsWith("UklGR")) mimeType = "image/webp";
     return mimeType ? `data:${mimeType};base64,${base64}` : null;
   };
-  useEffect12(() => {
+  useEffect13(() => {
     return () => {
       if (selectedImage) {
         URL.revokeObjectURL(selectedImage);
       }
     };
   }, [selectedImage]);
-  useEffect12(() => {
+  useEffect13(() => {
     if (binaryRef.current) {
       const isInsideTable2 = !!binaryRef.current.closest("table");
       setIsInsideTable(isInsideTable2);
@@ -7080,11 +7114,11 @@ var tableHeadController = (props) => {
 };
 
 // src/widget/advance/table/table-view/controller.ts
-import { useCallback as useCallback5, useEffect as useEffect13, useMemo as useMemo11, useState as useState12 } from "react";
+import { useCallback as useCallback6, useEffect as useEffect14, useMemo as useMemo11, useState as useState13 } from "react";
 import { domainHelper } from "@fctc/interface-logic/utils";
 var tableController = ({ data }) => {
-  const [rows, setRows] = useState12([]);
-  const [columnVisibility, setColumnVisibility] = useState12({});
+  const [rows, setRows] = useState13([]);
+  const [columnVisibility, setColumnVisibility] = useState13({});
   const dataModelFields = useMemo11(() => {
     return data?.fields?.map((field) => ({
       ...data.dataModel?.[field?.name],
@@ -7096,7 +7130,7 @@ var tableController = ({ data }) => {
     () => mergeButtons(dataModelFields),
     [dataModelFields]
   );
-  const transformData = useCallback5(
+  const transformData = useCallback6(
     (dataList) => {
       if (!dataList) return [];
       return dataList.map((item) => {
@@ -7118,7 +7152,7 @@ var tableController = ({ data }) => {
     },
     [data?.typeTable]
   );
-  useEffect13(() => {
+  useEffect14(() => {
     setRows(transformData(data?.records));
   }, [data?.records, transformData]);
   const columns = useMemo11(() => {
@@ -7142,7 +7176,7 @@ var tableController = ({ data }) => {
       return [];
     }
   }, [mergeFields, data?.context, columnVisibility]);
-  const onToggleColumnOptional = useCallback5((item) => {
+  const onToggleColumnOptional = useCallback6((item) => {
     setColumnVisibility((prev) => ({
       ...prev,
       [item?.name]: item?.optional === "show" ? "hide" : "show"
@@ -7157,7 +7191,7 @@ var tableController = ({ data }) => {
 };
 
 // src/widget/advance/table/table-group/controller.ts
-import { useEffect as useEffect14, useMemo as useMemo12, useState as useState13 } from "react";
+import { useEffect as useEffect15, useMemo as useMemo12, useState as useState14 } from "react";
 import { useAppSelector as useAppSelector2, selectList } from "@fctc/interface-logic/store";
 var tableGroupController = (props) => {
   const { env } = (0, provider_exports.useEnv)();
@@ -7174,10 +7208,10 @@ var tableGroupController = (props) => {
     groupByList,
     setSelectedRowKeys
   } = props;
-  const [pageGroup, setPageGroup] = useState13(0);
+  const [pageGroup, setPageGroup] = useState14(0);
   const { selectedRowKeys } = useAppSelector2(selectList);
-  const [isShowGroup, setIsShowGroup] = useState13(false);
-  const [colEmptyGroup, setColEmptyGroup] = useState13({
+  const [isShowGroup, setIsShowGroup] = useState14(false);
+  const [colEmptyGroup, setColEmptyGroup] = useState14({
     fromStart: 1,
     fromEnd: 1
   });
@@ -7266,7 +7300,7 @@ var tableGroupController = (props) => {
     }
     toggleShowGroup();
   };
-  useEffect14(() => {
+  useEffect15(() => {
     if (!isDataGroupFetched || !rowsGroup || !checkedAll || allIdsNull || typeTableGroup === "group") {
       return;
     }
@@ -7299,7 +7333,7 @@ import {
   evalJSONDomain as evalJSONDomain6,
   validateAndParseDate
 } from "@fctc/interface-logic/utils";
-import { useCallback as useCallback6, useEffect as useEffect15, useState as useState14 } from "react";
+import { useCallback as useCallback7, useEffect as useEffect16, useState as useState15 } from "react";
 var searchController = ({
   viewData,
   model,
@@ -7308,12 +7342,12 @@ var searchController = ({
   fieldsList
 }) => {
   const { env } = (0, provider_exports.useEnv)();
-  const [filterBy, setFilterBy] = useState14(null);
-  const [searchBy, setSearchBy] = useState14(null);
-  const [groupBy, setGroupBy] = useState14(null);
-  const [selectedTags, setSelectedTags] = useState14(null);
-  const [searchString, setSearchString] = useState14("");
-  const [searchMap, setSearchMap] = useState14({});
+  const [filterBy, setFilterBy] = useState15(null);
+  const [searchBy, setSearchBy] = useState15(null);
+  const [groupBy, setGroupBy] = useState15(null);
+  const [selectedTags, setSelectedTags] = useState15(null);
+  const [searchString, setSearchString] = useState15("");
+  const [searchMap, setSearchMap] = useState15({});
   const actionContext = typeof context === "string" ? evalJSONContext8(context) : context;
   const contextSearch = { ...env.context, ...actionContext };
   const domainAction = domain ? Array.isArray(domain) ? [...domain] : evalJSONDomain6(domain, contextSearch) : [];
@@ -7360,7 +7394,7 @@ var searchController = ({
       }
     }
   };
-  useEffect15(() => {
+  useEffect16(() => {
     fetchData();
   }, [model, viewData]);
   const onChangeSearchInput = (search_string) => {
@@ -7442,7 +7476,7 @@ var searchController = ({
       return [...domain2];
     }
   };
-  const setTagSearch = useCallback6(
+  const setTagSearch = useCallback7(
     (updatedMap) => {
       if (!updatedMap) return;
       const tagsSearch = Object.entries(updatedMap).map(
@@ -7505,7 +7539,7 @@ var searchController = ({
     },
     [searchMap]
   );
-  useEffect15(() => {
+  useEffect16(() => {
     setTagSearch(searchMap);
   }, [searchMap]);
   const handleAddTagSearch = (tag) => {

package/dist/widget.d.mts

@@ -119,10 +119,18 @@ interface IMany2ManyTagFieldProps extends IInputFieldProps {
 }
 
 declare const many2manyTagsController: (props: IMany2ManyTagFieldProps) => {
-    options: any;
-    customNoOptionsMessage: () => string;
+    options: any[];
     transfer: (data: any) => any;
     isUser: boolean;
+    isFetching: boolean;
+    fetchMoreOptions: () => void;
+    setInputValue: react.Dispatch<react.SetStateAction<string>>;
+    domainObject: any;
+    setDomainObject: react.Dispatch<any>;
+    handleChooseRecord: (idRecord: number) => void;
+    handleClose: () => void;
+    isShowModalMany2Many: boolean;
+    setIsShowModalMany2Many: react.Dispatch<react.SetStateAction<boolean>>;
 };
 
 interface IDurationFieldProps extends IInputFieldProps {

package/dist/widget.d.ts

@@ -119,10 +119,18 @@ interface IMany2ManyTagFieldProps extends IInputFieldProps {
 }
 
 declare const many2manyTagsController: (props: IMany2ManyTagFieldProps) => {
-    options: any;
-    customNoOptionsMessage: () => string;
+    options: any[];
     transfer: (data: any) => any;
     isUser: boolean;
+    isFetching: boolean;
+    fetchMoreOptions: () => void;
+    setInputValue: react.Dispatch<react.SetStateAction<string>>;
+    domainObject: any;
+    setDomainObject: react.Dispatch<any>;
+    handleChooseRecord: (idRecord: number) => void;
+    handleClose: () => void;
+    isShowModalMany2Many: boolean;
+    setIsShowModalMany2Many: react.Dispatch<react.SetStateAction<boolean>>;
 };
 
 interface IDurationFieldProps extends IInputFieldProps {

package/dist/widget.js

@@ -4906,35 +4906,45 @@ var many2manyTagsController = (props) => {
     options: optionsFields,
     widget,
     formValues,
-    placeholderNoOption,
     service,
     xNode,
-    context: fieldContext
+    context: fieldContext,
+    onChange,
+    methods,
+    name
   } = props;
   const isUser = relation === "res.users" || relation === "res.partner";
   const { env } = (0, provider_exports.useEnv)();
   const { action } = useAppProvider();
   const { useGetSelection: useGetSelection3 } = (0, provider_exports.useService)();
+  const [options, setOptions] = (0, import_react18.useState)([]);
+  const [inputValue, setInputValue] = (0, import_react18.useState)("");
+  const [debouncedInputValue] = useDebounce(inputValue, 1e3);
+  const [domainObject, setDomainObject] = (0, import_react18.useState)(null);
+  const [isShowModalMany2Many, setIsShowModalMany2Many] = (0, import_react18.useState)(false);
+  const addtionalFields = optionsFields ? (0, import_utils10.evalJSONContext)(optionsFields) : null;
   const contextObject = {
     ...(0, import_utils10.evalJSONContext)(action?.context) || {},
     ...fieldContext ?? {},
     ...env?.context
   };
-  const addtionalFields = optionsFields ? (0, import_utils10.evalJSONContext)(optionsFields) : null;
-  const domainObject = (0, import_react18.useMemo)(
-    () => (0, import_utils10.evalJSONDomain)(
-      domain,
-      JSON.parse(
-        JSON.stringify({
-          ...formValues,
-          ...contextObject,
-          context: contextObject,
-          parent: { ...formValues }
-        })
-      )
-    ),
-    [domain]
+  const parsedFormValues = (0, import_react18.useMemo)(
+    () => JSON.parse(
+      JSON.stringify({
+        ...formValues,
+        ...contextObject,
+        context: contextObject,
+        parent: { ...formValues }
+      })
+    ) ?? {},
+    [formValues, contextObject]
   );
+  (0, import_react18.useEffect)(() => {
+    const newDomain = (0, import_utils10.evalJSONDomain)(domain, parsedFormValues);
+    setDomainObject(
+      (prev) => JSON.stringify(prev) === JSON.stringify(newDomain) ? prev : newDomain
+    );
+  }, [domain, parsedFormValues]);
   const data = {
     model: relation ?? "",
     domain: domainObject,
@@ -4947,36 +4957,60 @@ var many2manyTagsController = (props) => {
     },
     context: env.context
   };
-  const { data: dataOfSelection } = useGetSelection3({
+  const queryKey = [`data_${relation}`, domainObject];
+  const {
+    data: dataOfSelection,
+    refetch,
+    isFetching
+  } = useGetSelection3({
     data,
-    queryKey: [
-      `data_${relation}`,
-      domainObject,
-      formValues?.id,
-      action?.id,
-      action?.res_model
-    ],
+    queryKey,
     service,
     xNode,
-    enabled: true
+    enabled: false
   });
-  const customNoOptionsMessage = () => placeholderNoOption;
+  const selectOptions = (0, import_react18.useMemo)(() => {
+    return dataOfSelection?.records?.map((val) => ({
+      value: val.id,
+      label: val.name ?? val.display_name,
+      ...val
+    })) || [];
+  }, [dataOfSelection]);
+  (0, import_react18.useEffect)(() => {
+    setOptions(selectOptions);
+  }, [selectOptions]);
+  const fetchMoreOptions = (0, import_react18.useCallback)(() => {
+    refetch();
+  }, [refetch]);
   const transfer = (data2) => {
     return data2?.map((val) => ({
       id: val.value,
       display_name: val.label
     })) || [];
   };
-  const options = dataOfSelection?.records?.map((val) => ({
-    value: val.id,
-    label: val.name ?? val.display_name,
-    ...val
-  })) || [];
+  const handleChooseRecord = (0, import_react18.useCallback)(
+    (idRecord) => {
+      const newOption = options.find(
+        (option) => option.value === idRecord
+      );
+      setIsShowModalMany2Many(false);
+    },
+    [options, methods, name, onChange]
+  );
+  const handleClose = (0, import_react18.useCallback)(() => setIsShowModalMany2Many(false), []);
   return {
     options,
-    customNoOptionsMessage,
     transfer,
-    isUser
+    isUser,
+    isFetching,
+    fetchMoreOptions,
+    setInputValue,
+    domainObject,
+    setDomainObject,
+    handleChooseRecord,
+    handleClose,
+    isShowModalMany2Many,
+    setIsShowModalMany2Many
   };
 };
 

package/dist/widget.mjs

@@ -4954,7 +4954,7 @@ var many2manyFieldController = (props) => {
 };
 
 // src/widget/basic/many2many-tags-field/controller.ts
-import { useMemo as useMemo9 } from "react";
+import { useCallback as useCallback5, useEffect as useEffect12, useMemo as useMemo9, useState as useState8 } from "react";
 import { WIDGETAVATAR, WIDGETCOLOR } from "@fctc/interface-logic/constants";
 import { evalJSONContext as evalJSONContext5, evalJSONDomain as evalJSONDomain4 } from "@fctc/interface-logic/utils";
 var many2manyTagsController = (props) => {
@@ -4964,35 +4964,45 @@ var many2manyTagsController = (props) => {
     options: optionsFields,
     widget,
     formValues,
-    placeholderNoOption,
     service,
     xNode,
-    context: fieldContext
+    context: fieldContext,
+    onChange,
+    methods,
+    name
   } = props;
   const isUser = relation === "res.users" || relation === "res.partner";
   const { env } = (0, provider_exports.useEnv)();
   const { action } = useAppProvider();
   const { useGetSelection: useGetSelection3 } = (0, provider_exports.useService)();
+  const [options, setOptions] = useState8([]);
+  const [inputValue, setInputValue] = useState8("");
+  const [debouncedInputValue] = useDebounce(inputValue, 1e3);
+  const [domainObject, setDomainObject] = useState8(null);
+  const [isShowModalMany2Many, setIsShowModalMany2Many] = useState8(false);
+  const addtionalFields = optionsFields ? evalJSONContext5(optionsFields) : null;
   const contextObject = {
     ...evalJSONContext5(action?.context) || {},
     ...fieldContext ?? {},
     ...env?.context
   };
-  const addtionalFields = optionsFields ? evalJSONContext5(optionsFields) : null;
-  const domainObject = useMemo9(
-    () => evalJSONDomain4(
-      domain,
-      JSON.parse(
-        JSON.stringify({
-          ...formValues,
-          ...contextObject,
-          context: contextObject,
-          parent: { ...formValues }
-        })
-      )
-    ),
-    [domain]
+  const parsedFormValues = useMemo9(
+    () => JSON.parse(
+      JSON.stringify({
+        ...formValues,
+        ...contextObject,
+        context: contextObject,
+        parent: { ...formValues }
+      })
+    ) ?? {},
+    [formValues, contextObject]
   );
+  useEffect12(() => {
+    const newDomain = evalJSONDomain4(domain, parsedFormValues);
+    setDomainObject(
+      (prev) => JSON.stringify(prev) === JSON.stringify(newDomain) ? prev : newDomain
+    );
+  }, [domain, parsedFormValues]);
   const data = {
     model: relation ?? "",
     domain: domainObject,
@@ -5005,41 +5015,65 @@ var many2manyTagsController = (props) => {
     },
     context: env.context
   };
-  const { data: dataOfSelection } = useGetSelection3({
+  const queryKey = [`data_${relation}`, domainObject];
+  const {
+    data: dataOfSelection,
+    refetch,
+    isFetching
+  } = useGetSelection3({
     data,
-    queryKey: [
-      `data_${relation}`,
-      domainObject,
-      formValues?.id,
-      action?.id,
-      action?.res_model
-    ],
+    queryKey,
     service,
     xNode,
-    enabled: true
+    enabled: false
   });
-  const customNoOptionsMessage = () => placeholderNoOption;
+  const selectOptions = useMemo9(() => {
+    return dataOfSelection?.records?.map((val) => ({
+      value: val.id,
+      label: val.name ?? val.display_name,
+      ...val
+    })) || [];
+  }, [dataOfSelection]);
+  useEffect12(() => {
+    setOptions(selectOptions);
+  }, [selectOptions]);
+  const fetchMoreOptions = useCallback5(() => {
+    refetch();
+  }, [refetch]);
   const transfer = (data2) => {
     return data2?.map((val) => ({
       id: val.value,
       display_name: val.label
     })) || [];
   };
-  const options = dataOfSelection?.records?.map((val) => ({
-    value: val.id,
-    label: val.name ?? val.display_name,
-    ...val
-  })) || [];
+  const handleChooseRecord = useCallback5(
+    (idRecord) => {
+      const newOption = options.find(
+        (option) => option.value === idRecord
+      );
+      setIsShowModalMany2Many(false);
+    },
+    [options, methods, name, onChange]
+  );
+  const handleClose = useCallback5(() => setIsShowModalMany2Many(false), []);
   return {
     options,
-    customNoOptionsMessage,
     transfer,
-    isUser
+    isUser,
+    isFetching,
+    fetchMoreOptions,
+    setInputValue,
+    domainObject,
+    setDomainObject,
+    handleChooseRecord,
+    handleClose,
+    isShowModalMany2Many,
+    setIsShowModalMany2Many
   };
 };
 
 // src/widget/basic/status-bar-field/controller.ts
-import { useState as useState8 } from "react";
+import { useState as useState9 } from "react";
 import { evalJSONDomain as evalJSONDomain5 } from "@fctc/interface-logic/utils";
 var durationController = (props) => {
   const { relation, domain, formValues, name, id, model, onRefetch, enabled } = props;
@@ -5050,8 +5084,8 @@ var durationController = (props) => {
   };
   const { useGetListData: useGetListData2, useChangeStatus: useChangeStatus2 } = (0, provider_exports.useService)();
   const { env } = (0, provider_exports.useEnv)();
-  const [disabled, setDisabled] = useState8(false);
-  const [modelStatus, setModalStatus] = useState8(false);
+  const [disabled, setDisabled] = useState9(false);
+  const [modelStatus, setModalStatus] = useState9(false);
   const queryKey = [`data-status-duration`, specification];
   const listDataProps = {
     model: relation,
@@ -5141,10 +5175,10 @@ var priorityFieldController = (props) => {
 };
 
 // src/widget/basic/download-file-field/controller.ts
-import { useId, useState as useState9 } from "react";
+import { useId, useState as useState10 } from "react";
 var downloadFileController = () => {
   const inputId = useId();
-  const [file, setFile] = useState9(null);
+  const [file, setFile] = useState10(null);
   const handleFileChange = (e) => {
     setFile(e.target.files[0]);
   };
@@ -6076,11 +6110,11 @@ var dateFieldController = (props) => {
 };
 
 // src/widget/basic/copy-link-button/controller.ts
-import { useState as useState10 } from "react";
+import { useState as useState11 } from "react";
 import { copyTextToClipboard } from "@fctc/interface-logic/utils";
 var copyLinkButtonController = (props) => {
   const { value, defaultValue } = props;
-  const [isCopied, setIsCopied] = useState10(false);
+  const [isCopied, setIsCopied] = useState11(false);
   const handleCopyToClipboard = async (value2) => {
     await copyTextToClipboard(value2);
     setIsCopied(true);
@@ -6128,14 +6162,14 @@ var colorFieldController = (props) => {
 };
 
 // src/widget/basic/binary-field/controller.ts
-import { useEffect as useEffect12, useId as useId2, useRef as useRef4, useState as useState11 } from "react";
+import { useEffect as useEffect13, useId as useId2, useRef as useRef4, useState as useState12 } from "react";
 import { isBase64Image } from "@fctc/interface-logic/utils";
 var binaryFieldController = (props) => {
   const { name, methods, readonly = false, value } = props;
   const inputId = useId2();
-  const [selectedImage, setSelectedImage] = useState11(null);
-  const [initialImage, setInitialImage] = useState11(value || null);
-  const [isInsideTable, setIsInsideTable] = useState11(false);
+  const [selectedImage, setSelectedImage] = useState12(null);
+  const [initialImage, setInitialImage] = useState12(value || null);
+  const [isInsideTable, setIsInsideTable] = useState12(false);
   const { setValue } = methods;
   const binaryRef = useRef4(null);
   const convertUrlToBase64 = async (url) => {
@@ -6199,14 +6233,14 @@ var binaryFieldController = (props) => {
     else if (base64.startsWith("UklGR")) mimeType = "image/webp";
     return mimeType ? `data:${mimeType};base64,${base64}` : null;
   };
-  useEffect12(() => {
+  useEffect13(() => {
     return () => {
       if (selectedImage) {
         URL.revokeObjectURL(selectedImage);
       }
     };
   }, [selectedImage]);
-  useEffect12(() => {
+  useEffect13(() => {
     if (binaryRef.current) {
       const isInsideTable2 = !!binaryRef.current.closest("table");
       setIsInsideTable(isInsideTable2);
@@ -6292,11 +6326,11 @@ var tableHeadController = (props) => {
 };
 
 // src/widget/advance/table/table-view/controller.ts
-import { useCallback as useCallback5, useEffect as useEffect13, useMemo as useMemo11, useState as useState12 } from "react";
+import { useCallback as useCallback6, useEffect as useEffect14, useMemo as useMemo11, useState as useState13 } from "react";
 import { domainHelper } from "@fctc/interface-logic/utils";
 var tableController = ({ data }) => {
-  const [rows, setRows] = useState12([]);
-  const [columnVisibility, setColumnVisibility] = useState12({});
+  const [rows, setRows] = useState13([]);
+  const [columnVisibility, setColumnVisibility] = useState13({});
   const dataModelFields = useMemo11(() => {
     return data?.fields?.map((field) => ({
       ...data.dataModel?.[field?.name],
@@ -6308,7 +6342,7 @@ var tableController = ({ data }) => {
     () => mergeButtons(dataModelFields),
     [dataModelFields]
   );
-  const transformData = useCallback5(
+  const transformData = useCallback6(
     (dataList) => {
       if (!dataList) return [];
       return dataList.map((item) => {
@@ -6330,7 +6364,7 @@ var tableController = ({ data }) => {
     },
     [data?.typeTable]
   );
-  useEffect13(() => {
+  useEffect14(() => {
     setRows(transformData(data?.records));
   }, [data?.records, transformData]);
   const columns = useMemo11(() => {
@@ -6354,7 +6388,7 @@ var tableController = ({ data }) => {
       return [];
     }
   }, [mergeFields, data?.context, columnVisibility]);
-  const onToggleColumnOptional = useCallback5((item) => {
+  const onToggleColumnOptional = useCallback6((item) => {
     setColumnVisibility((prev) => ({
       ...prev,
       [item?.name]: item?.optional === "show" ? "hide" : "show"
@@ -6369,7 +6403,7 @@ var tableController = ({ data }) => {
 };
 
 // src/widget/advance/table/table-group/controller.ts
-import { useEffect as useEffect14, useMemo as useMemo12, useState as useState13 } from "react";
+import { useEffect as useEffect15, useMemo as useMemo12, useState as useState14 } from "react";
 import { useAppSelector as useAppSelector2, selectList } from "@fctc/interface-logic/store";
 var tableGroupController = (props) => {
   const { env } = (0, provider_exports.useEnv)();
@@ -6386,10 +6420,10 @@ var tableGroupController = (props) => {
     groupByList,
     setSelectedRowKeys
   } = props;
-  const [pageGroup, setPageGroup] = useState13(0);
+  const [pageGroup, setPageGroup] = useState14(0);
   const { selectedRowKeys } = useAppSelector2(selectList);
-  const [isShowGroup, setIsShowGroup] = useState13(false);
-  const [colEmptyGroup, setColEmptyGroup] = useState13({
+  const [isShowGroup, setIsShowGroup] = useState14(false);
+  const [colEmptyGroup, setColEmptyGroup] = useState14({
     fromStart: 1,
     fromEnd: 1
   });
@@ -6478,7 +6512,7 @@ var tableGroupController = (props) => {
     }
     toggleShowGroup();
   };
-  useEffect14(() => {
+  useEffect15(() => {
     if (!isDataGroupFetched || !rowsGroup || !checkedAll || allIdsNull || typeTableGroup === "group") {
       return;
     }
@@ -6511,7 +6545,7 @@ import {
   evalJSONDomain as evalJSONDomain6,
   validateAndParseDate
 } from "@fctc/interface-logic/utils";
-import { useCallback as useCallback6, useEffect as useEffect15, useState as useState14 } from "react";
+import { useCallback as useCallback7, useEffect as useEffect16, useState as useState15 } from "react";
 var searchController = ({
   viewData,
   model,
@@ -6520,12 +6554,12 @@ var searchController = ({
   fieldsList
 }) => {
   const { env } = (0, provider_exports.useEnv)();
-  const [filterBy, setFilterBy] = useState14(null);
-  const [searchBy, setSearchBy] = useState14(null);
-  const [groupBy, setGroupBy] = useState14(null);
-  const [selectedTags, setSelectedTags] = useState14(null);
-  const [searchString, setSearchString] = useState14("");
-  const [searchMap, setSearchMap] = useState14({});
+  const [filterBy, setFilterBy] = useState15(null);
+  const [searchBy, setSearchBy] = useState15(null);
+  const [groupBy, setGroupBy] = useState15(null);
+  const [selectedTags, setSelectedTags] = useState15(null);
+  const [searchString, setSearchString] = useState15("");
+  const [searchMap, setSearchMap] = useState15({});
   const actionContext = typeof context === "string" ? evalJSONContext8(context) : context;
   const contextSearch = { ...env.context, ...actionContext };
   const domainAction = domain ? Array.isArray(domain) ? [...domain] : evalJSONDomain6(domain, contextSearch) : [];
@@ -6572,7 +6606,7 @@ var searchController = ({
       }
     }
   };
-  useEffect15(() => {
+  useEffect16(() => {
     fetchData();
   }, [model, viewData]);
   const onChangeSearchInput = (search_string) => {
@@ -6654,7 +6688,7 @@ var searchController = ({
       return [...domain2];
     }
   };
-  const setTagSearch = useCallback6(
+  const setTagSearch = useCallback7(
     (updatedMap) => {
       if (!updatedMap) return;
       const tagsSearch = Object.entries(updatedMap).map(
@@ -6717,7 +6751,7 @@ var searchController = ({
     },
     [searchMap]
   );
-  useEffect15(() => {
+  useEffect16(() => {
     setTagSearch(searchMap);
   }, [searchMap]);
   const handleAddTagSearch = (tag) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fctc/widget-logic",
-  "version": "3.7.0",
+  "version": "3.7.2",
   "types": "dist/index.d.ts",
   "main": "dist/index.cjs",
   "module": "dist/index.mjs",
@@ -74,7 +74,7 @@
     "test": "jest"
   },
   "dependencies": {
-    "@fctc/interface-logic": "^3.2.5",
+    "@fctc/interface-logic": "^3.2.6",
     "@headlessui/react": "^2.2.6",
     "@tanstack/react-query": "^5.84.0",
     "i18next": "^25.3.2",