impact-ui 4.0.1-alpha.21 → 4.0.1-alpha.23

package/dist/components/TableV36/NewAdvanceSearchModal/NewAdvanceSearchModal.js

@@ -0,0 +1,282 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import React__default, { useState, useMemo, useEffect } from "react";
+import { useForm, useFieldArray } from "react-hook-form";
+import NewAdvanceSearchModalItem from "./NewAdvanceSearchModalItem.js";
+import { convertToOptions } from "../../../utils/helper.js";
+import { Button } from "../../Button/index.js";
+import { ButtonGroup } from "../../ButtonGroup/index.js";
+import { Modal } from "../../Modal/index.js";
+import AddOutlined from "../../../node_modules/@mui/icons-material/esm/AddOutlined.js";
+const filterInitialValues = {
+  column: { label: "", value: "", type: "text" },
+  operation: null,
+  value: null
+};
+const NewAdvanceSearchModal = ({
+  isAdvanceSearch,
+  actualRef,
+  onSearchApplyClick,
+  toggleAdvanceSearch,
+  initialFilters,
+  setInitialFilters,
+  colDefs = [],
+  currentColumnId,
+  ...args
+}) => {
+  const [activeSearchType, setActiveSearchType] = useState("advanceSearch");
+  const onChangeSearchType = (e, val) => {
+    e.preventDefault();
+    setActiveSearchType(val);
+  };
+  const formMethods = useForm({
+    defaultValues: {
+      filters: initialFilters
+    },
+    rules: {
+      required: true
+    }
+  });
+  const {
+    control,
+    handleSubmit,
+    watch,
+    formState: { isValid: isFormValid },
+    setValue,
+    getValues,
+    reset
+  } = formMethods;
+  const { fields, append, remove } = useFieldArray({
+    control,
+    name: "filters",
+    keyName: "fieldId"
+  });
+  const formValues = watch();
+  const filteredColumnsInitialOptions = useMemo(() => {
+    const selectedValues = (formValues.filters || []).map((f) => {
+      var _a;
+      return (_a = f == null ? void 0 : f.column) == null ? void 0 : _a.value;
+    }).filter(Boolean);
+    return convertToOptions(colDefs || []).filter((opt) => !selectedValues.includes(opt.value));
+  }, [colDefs, formValues.filters]);
+  const [hasInitializedWithColumnId, setHasInitializedWithColumnId] = useState(false);
+  const prevIsAdvanceSearchRef = React__default.useRef(false);
+  useEffect(() => {
+    const isOpening = isAdvanceSearch && !prevIsAdvanceSearchRef.current;
+    if (isOpening && initialFilters !== void 0) {
+      const validInitialFilters = (initialFilters || []).filter((f) => {
+        var _a;
+        return (_a = f == null ? void 0 : f.column) == null ? void 0 : _a.value;
+      });
+      reset({
+        filters: validInitialFilters.length > 0 ? validInitialFilters : [filterInitialValues]
+      });
+      setHasInitializedWithColumnId(false);
+    }
+    prevIsAdvanceSearchRef.current = isAdvanceSearch;
+  }, [isAdvanceSearch, initialFilters, reset]);
+  useEffect(() => {
+    var _a, _b;
+    if (isAdvanceSearch && currentColumnId && !hasInitializedWithColumnId && initialFilters) {
+      const hasValidFilters = initialFilters.some(
+        (f) => {
+          var _a2, _b2, _c;
+          return ((_a2 = f == null ? void 0 : f.column) == null ? void 0 : _a2.value) && ((_b2 = f == null ? void 0 : f.column) == null ? void 0 : _b2.value) !== null && ((_c = f == null ? void 0 : f.column) == null ? void 0 : _c.value) !== "";
+        }
+      );
+      if (!hasValidFilters) {
+        const formValues2 = getValues();
+        const existingFilters = formValues2.filters || [];
+        const columnExists = existingFilters.some(
+          (filter) => {
+            var _a2;
+            return ((_a2 = filter == null ? void 0 : filter.column) == null ? void 0 : _a2.value) === currentColumnId;
+          }
+        );
+        if (!columnExists) {
+          const columnOption = convertToOptions(colDefs || []).find(
+            (opt) => opt.value === currentColumnId
+          );
+          if (columnOption) {
+            if (existingFilters.length > 0 && !((_b = (_a = existingFilters[0]) == null ? void 0 : _a.column) == null ? void 0 : _b.value)) {
+              setValue(`filters.0.column`, columnOption);
+            } else {
+              append({
+                column: columnOption,
+                operation: null,
+                value: null
+              });
+            }
+          }
+        }
+      }
+      setHasInitializedWithColumnId(true);
+    }
+  }, [
+    isAdvanceSearch,
+    currentColumnId,
+    colDefs,
+    getValues,
+    setValue,
+    append,
+    hasInitializedWithColumnId,
+    initialFilters
+  ]);
+  useEffect(() => {
+    if (!isAdvanceSearch) {
+      setHasInitializedWithColumnId(false);
+    }
+  }, [isAdvanceSearch]);
+  const onCloseModal = () => {
+    toggleAdvanceSearch();
+  };
+  const handleSearchApplyClick = () => {
+    const formValues2 = formMethods.getValues().filters || [];
+    const validFilters = formValues2.filter((filter) => {
+      var _a, _b, _c, _d, _e, _f;
+      const hasColumn = ((_a = filter == null ? void 0 : filter.column) == null ? void 0 : _a.value) && ((_b = filter == null ? void 0 : filter.column) == null ? void 0 : _b.value) !== null && ((_c = filter == null ? void 0 : filter.column) == null ? void 0 : _c.value) !== "";
+      if (activeSearchType === "advanceSearch") {
+        return hasColumn && ((_d = filter == null ? void 0 : filter.operation) == null ? void 0 : _d.value) && ((_e = filter == null ? void 0 : filter.operation) == null ? void 0 : _e.value) !== null && ((_f = filter == null ? void 0 : filter.operation) == null ? void 0 : _f.value) !== "";
+      }
+      return hasColumn;
+    });
+    onSearchApplyClick(validFilters);
+  };
+  const onClearAttributeValue = () => {
+    const updatedFilters = formMethods.getValues().filters.map((filter) => ({ ...filter, value: null }));
+    formMethods.reset({
+      filters: updatedFilters
+    });
+  };
+  const onClearAll = () => {
+    formMethods.reset({
+      filters: [filterInitialValues]
+    });
+  };
+  return /* @__PURE__ */ jsxs(
+    Modal,
+    {
+      className: "ia-table-search-modal",
+      height: 400,
+      open: isAdvanceSearch,
+      primaryButtonLabel: "Apply",
+      primaryButtonProps: {
+        type: "submit"
+        // disabled: !isFormValid,
+      },
+      secondaryButtonLabel: args.onSearchSaveClick ? "Save search" : null,
+      secondaryButtonProps: {
+        disabled: !isFormValid
+      },
+      size: "small",
+      title: "Search",
+      width: 850,
+      onClose: onCloseModal,
+      onPrimaryButtonClick: handleSearchApplyClick,
+      onSecondaryButtonClick: (e) => {
+        e.preventDefault();
+        onCloseModal();
+      },
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "ia-table-search-header", children: [
+          /* @__PURE__ */ jsx(
+            ButtonGroup,
+            {
+              options: [
+                {
+                  label: "Search",
+                  value: "search"
+                },
+                {
+                  label: "Advance Search",
+                  value: "advanceSearch"
+                }
+              ],
+              selectedOption: activeSearchType,
+              onChange: (e, val) => {
+                var _a, _b;
+                e.preventDefault();
+                onChangeSearchType(e, val);
+                (_b = (_a = actualRef == null ? void 0 : actualRef.current) == null ? void 0 : _a.api) == null ? void 0 : _b.destroyFilter(null);
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              size: "small",
+              type: "button",
+              variant: "url",
+              onClick: (e) => {
+                e.preventDefault();
+                onClearAll();
+              },
+              children: "Clear all"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs(
+          "form",
+          {
+            className: "ia-table-search-content",
+            onSubmit: (e) => {
+              e.preventDefault();
+              handleSearchApplyClick();
+            },
+            children: [
+              /* @__PURE__ */ jsx("div", { className: "ia-table-search-content-title", children: "Match all of the following rules" }),
+              /* @__PURE__ */ jsx(Fragment, { children: fields.map((field, index) => /* @__PURE__ */ jsx(
+                NewAdvanceSearchModalItem,
+                {
+                  activeSearchType,
+                  colDefs,
+                  control,
+                  currentColumnId,
+                  field,
+                  fields,
+                  filteredColumnsInitialOptions,
+                  getValues,
+                  index,
+                  isLastVisible: fields.length === 1,
+                  remove
+                },
+                field.fieldId || field.id
+              )) }),
+              /* @__PURE__ */ jsxs("div", { className: "ia-table-search-content-footer", children: [
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    size: "large",
+                    variant: "secondary",
+                    onClick: onClearAttributeValue,
+                    type: "button",
+                    children: "Clear values"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    icon: /* @__PURE__ */ jsx(AddOutlined, {}),
+                    size: "large",
+                    type: "button",
+                    onClick: () => {
+                      append({
+                        column: null,
+                        operation: null,
+                        value: null
+                      });
+                    },
+                    variant: "tertiary",
+                    children: "Add attribute"
+                  }
+                )
+              ] })
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  NewAdvanceSearchModal as default
+};

package/dist/components/TableV36/NewAdvanceSearchModal/NewAdvanceSearchModalItem.d.ts

@@ -0,0 +1,16 @@
+declare const NewAdvanceSearchModalItem: ({ colDefs, control, index, field, remove, filteredColumnsInitialOptions, activeSearchType, isLastVisible, currentColumnId, getValues, fields, ...args }: {
+    [x: string]: any;
+    colDefs: any;
+    control: any;
+    index: any;
+    field: any;
+    remove: any;
+    filteredColumnsInitialOptions: any;
+    activeSearchType: any;
+    isLastVisible: any;
+    currentColumnId: any;
+    getValues: any;
+    fields: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export default NewAdvanceSearchModalItem;
+//# sourceMappingURL=NewAdvanceSearchModalItem.d.ts.map

package/dist/components/TableV36/NewAdvanceSearchModal/NewAdvanceSearchModalItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NewAdvanceSearchModalItem.d.ts","sourceRoot":"","sources":["../../../../src/components/TableV36/NewAdvanceSearchModal/NewAdvanceSearchModalItem.tsx"],"names":[],"mappings":"AAsBA,QAAA,MAAM,yBAAyB,GAAI;;;;;;;;;;;;;CAalC,4CA4ZA,CAAC;AAEF,eAAe,yBAAyB,CAAC"}

package/dist/components/TableV36/NewAdvanceSearchModal/NewAdvanceSearchModalItem.js

@@ -0,0 +1,302 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import default_1 from "../../../node_modules/@mui/icons-material/DeleteOutlineOutlined.js";
+import moment from "moment";
+import { useController } from "react-hook-form";
+import { convertToOptions } from "../../../utils/helper.js";
+import { Button } from "../../Button/index.js";
+import { DatePicker } from "../../DatePicker/index.js";
+import { DateRangePicker } from "../../DateRangePicker/index.js";
+import { Input } from "../../Input/index.js";
+import { Select } from "../../Select/index.js";
+import { findColumnDef, getOperatorListForColumn, getDefaultOperationForColumn } from "../filterUtils.js";
+const NewAdvanceSearchModalItem = ({
+  colDefs,
+  control,
+  index,
+  field,
+  remove,
+  filteredColumnsInitialOptions,
+  activeSearchType,
+  isLastVisible,
+  currentColumnId,
+  getValues,
+  fields,
+  ...args
+}) => {
+  var _a, _b, _c, _d;
+  const [isColumnOptionsOpen, setIsColumnOptionsOpen] = useState(false);
+  const [isOperationOptionsOpen, setIsOperationOptionsOpen] = useState(false);
+  const [isThirdOptionDropdownOpen, setIsThirdOptionDropdownOpen] = useState(false);
+  const [currentOperationOptions, setCurrentOperationOptions] = useState([]);
+  const [currentThirdOptionDropdownOptions, setCurrentThirdOptionDropdownOptions] = useState([]);
+  const [currentColumnDef, setCurrentColumnDef] = useState(null);
+  const [isSelectAll, setIsSelectAll] = useState(false);
+  const { field: columnField } = useController({
+    name: `filters.${index}.column`,
+    control,
+    rules: {
+      required: true
+    }
+  });
+  const { field: operationField } = useController({
+    name: `filters.${index}.operation`,
+    control,
+    rules: { required: activeSearchType !== "advanceSearch" && true }
+  });
+  const { field: valueField } = useController({
+    name: `filters.${index}.value`,
+    control,
+    rules: {
+      required: true
+    }
+  });
+  useEffect(() => {
+    var _a2;
+    if (!((_a2 = columnField.value) == null ? void 0 : _a2.value)) return;
+    const columnDef = findColumnDef(colDefs, columnField.value.value);
+    setCurrentColumnDef(columnDef);
+    const operatorList = getOperatorListForColumn(columnDef);
+    setCurrentOperationOptions(operatorList);
+    const shouldAutoSelect = activeSearchType === "advanceSearch" && (operatorList == null ? void 0 : operatorList.length) > 0 && !operationField.value;
+    if (shouldAutoSelect) {
+      const defaultOperation = getDefaultOperationForColumn(columnDef);
+      operationField.onChange(defaultOperation);
+    }
+  }, [columnField.value, colDefs, activeSearchType]);
+  useEffect(() => {
+    var _a2;
+    if ((currentColumnDef == null ? void 0 : currentColumnDef.thirdOptionAsDropdown) && operationField.value) {
+      if (currentColumnDef.toShowDuplicateColumnInAdvanceSearch) {
+        const currentOptions = ((_a2 = currentColumnDef.currentColumnField) == null ? void 0 : _a2.endsWith("1")) ? currentColumnDef.thirdOptionDropdownOptions1 : currentColumnDef.thirdOptionDropdownOptions2;
+        setCurrentThirdOptionDropdownOptions(currentOptions);
+      } else {
+        setCurrentThirdOptionDropdownOptions(currentColumnDef.thirdOptionDropdownOptions);
+      }
+    }
+  }, [currentColumnDef, operationField]);
+  useEffect(() => {
+    if (activeSearchType === "search" && !operationField.value && columnField.value && currentOperationOptions.length > 0) {
+      if (currentColumnDef == null ? void 0 : currentColumnDef.thirdOptionAsDateRangePicker) {
+        operationField.onChange({ label: "In range", value: "inRange" });
+      } else if ((currentColumnDef == null ? void 0 : currentColumnDef.filter) === "agDateColumnFilter") {
+        const equalsOption = currentOperationOptions.find((opt) => opt.value === "equals");
+        if (equalsOption) {
+          operationField.onChange(equalsOption);
+        } else {
+          operationField.onChange(currentOperationOptions[0]);
+        }
+      } else {
+        const containsOption = currentOperationOptions.find((opt) => opt.value === "contains");
+        if (containsOption) {
+          operationField.onChange(containsOption);
+        } else {
+          operationField.onChange(currentOperationOptions[0]);
+        }
+      }
+    }
+  }, [columnField.value, currentOperationOptions, activeSearchType, currentColumnDef]);
+  useEffect(() => {
+    var _a2;
+    if (currentColumnId && index === 0 && // Only auto-select for the first filter
+    !columnField.value && ((_a2 = columnField.value) == null ? void 0 : _a2.value) !== currentColumnId) {
+      const columnOption = filteredColumnsInitialOptions == null ? void 0 : filteredColumnsInitialOptions.find(
+        (opt) => opt.value === currentColumnId
+      );
+      const allOptions = convertToOptions(colDefs || []);
+      const columnOptionFromAll = allOptions.find((opt) => opt.value === currentColumnId);
+      const optionToSelect = columnOption || columnOptionFromAll;
+      if (optionToSelect) {
+        columnField.onChange(optionToSelect);
+      }
+    }
+  }, [currentColumnId, index, columnField.value, filteredColumnsInitialOptions, colDefs]);
+  const handleClickOutside = (event) => {
+    if (isColumnOptionsOpen || isThirdOptionDropdownOpen || isOperationOptionsOpen && !event.target.closest(".ia-table-search-content-body")) {
+      setIsColumnOptionsOpen(false);
+      setIsOperationOptionsOpen(false);
+    }
+  };
+  useEffect(() => {
+    document.addEventListener("click", handleClickOutside);
+    return () => {
+      document.removeEventListener("click", handleClickOutside);
+    };
+  }, [isColumnOptionsOpen, isThirdOptionDropdownOpen, isOperationOptionsOpen]);
+  return /* @__PURE__ */ jsxs("div", { className: "ia-table-search-content-body", children: [
+    /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", flex: 1 }, children: /* @__PURE__ */ jsx(
+      Select,
+      {
+        currentOptions: filteredColumnsInitialOptions || [],
+        initialOptions: filteredColumnsInitialOptions || [],
+        isOpen: isColumnOptionsOpen,
+        minWidth: activeSearchType !== "advanceSearch" ? 400 : void 0,
+        name: `filters.${index}.column`,
+        placeholder: "Select",
+        selectedOptions: columnField.value || null,
+        setCurrentOptions: () => {
+        },
+        setIsOpen: setIsColumnOptionsOpen,
+        setSelectedOptions: (option) => {
+          if (option && getValues) {
+            const formValues = getValues();
+            const existingFilters = (formValues == null ? void 0 : formValues.filters) || [];
+            const isDuplicate = existingFilters.some(
+              (filter, idx) => {
+                var _a2, _b2, _c2;
+                return idx !== index && ((_a2 = filter == null ? void 0 : filter.column) == null ? void 0 : _a2.value) === option.value && ((_b2 = filter == null ? void 0 : filter.column) == null ? void 0 : _b2.value) !== null && ((_c2 = filter == null ? void 0 : filter.column) == null ? void 0 : _c2.value) !== "";
+              }
+            );
+            if (isDuplicate) {
+              return;
+            }
+          }
+          columnField.onChange(option);
+          operationField.onChange(null);
+          valueField.onChange("");
+        },
+        withPortal: true,
+        onClick: (e) => {
+          e.preventDefault();
+          e.stopPropagation();
+        }
+      }
+    ) }),
+    activeSearchType === "advanceSearch" && /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", flex: 1 }, children: /* @__PURE__ */ jsx(
+      Select,
+      {
+        currentOptions: currentOperationOptions,
+        disabled: !columnField.value,
+        initialOptions: currentOperationOptions,
+        isDisabled: (currentColumnDef == null ? void 0 : currentColumnDef.isThirdOptionDropdownIsBoolean) || (currentColumnDef == null ? void 0 : currentColumnDef.thirdOptionAsDateRangePicker) ? true : !columnField.value,
+        isOpen: isOperationOptionsOpen,
+        name: `filters.${index}.operation`,
+        placeholder: "Select",
+        selectedOptions: operationField.value || null,
+        setCurrentOptions: setCurrentOperationOptions,
+        setIsOpen: setIsOperationOptionsOpen,
+        setSelectedOptions: (option) => {
+          operationField.onChange(option);
+        },
+        withPortal: true,
+        onClick: (e) => {
+          e.preventDefault();
+          e.stopPropagation();
+        }
+      }
+    ) }),
+    /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", flex: 1 }, children: (currentColumnDef == null ? void 0 : currentColumnDef.thirdOptionAsDropdown) ? /* @__PURE__ */ jsx(
+      Select,
+      {
+        currentOptions: currentThirdOptionDropdownOptions,
+        initialOptions: currentColumnDef == null ? void 0 : currentColumnDef.thirdOptionDropdownOptions,
+        isDisabled: !operationField.value,
+        isMulti: currentColumnDef == null ? void 0 : currentColumnDef.enableMultiSelect,
+        isOpen: isThirdOptionDropdownOpen,
+        isSelectAll,
+        isWithSearch: currentColumnDef == null ? void 0 : currentColumnDef.enableSearch,
+        minWidth: activeSearchType !== "advanceSearch" ? 344 : void 0,
+        name: `filters.${index}.value`,
+        placeholder: "Select value",
+        selectedOptions: (valueField == null ? void 0 : valueField.value) || [],
+        setCurrentOptions: setCurrentThirdOptionDropdownOptions,
+        setIsOpen: setIsThirdOptionDropdownOpen,
+        setSelectedOptions: (option) => {
+          valueField.onChange(option);
+        },
+        toggleSelectAll: currentColumnDef == null ? void 0 : currentColumnDef.enableMultiSelect,
+        withPortal: true,
+        onClick: (e) => {
+          e.preventDefault();
+          e.stopPropagation();
+        },
+        setIsSelectAll
+      }
+    ) : (currentColumnDef == null ? void 0 : currentColumnDef.thirdOptionAsDatePicker) || (currentColumnDef == null ? void 0 : currentColumnDef.filter) === "agDateColumnFilter" && !currentColumnDef.thirdOptionAsDateRangePicker ? /* @__PURE__ */ jsx(
+      DatePicker,
+      {
+        fullWidth: true,
+        showMonthYearSelect: true,
+        displayFormat: currentColumnDef.displayFormat || "MM-DD-YYYY",
+        isDisabled: !operationField.value,
+        name: `filters.${index}.value`,
+        placeholder: "Select date",
+        selectedDate: valueField.value ? moment(valueField.value) : void 0,
+        setSelectedDate: (date) => {
+          valueField.onChange(date);
+        },
+        withPortal: true,
+        ...currentColumnDef.thirdOptionAsDatePickerProps
+      }
+    ) : (currentColumnDef == null ? void 0 : currentColumnDef.thirdOptionAsDateRangePicker) ? /* @__PURE__ */ jsx(
+      DateRangePicker,
+      {
+        fullWidth: true,
+        endDate: ((_a = valueField.value) == null ? void 0 : _a.endDate) ? moment.isMoment(valueField.value.endDate) ? valueField.value.endDate : moment(valueField.value.endDate) : ((_b = currentColumnDef.thirdOptionAsDateRangePickerProps) == null ? void 0 : _b.endDate) ? moment.isMoment(currentColumnDef.thirdOptionAsDateRangePickerProps.endDate) ? currentColumnDef.thirdOptionAsDateRangePickerProps.endDate : moment(currentColumnDef.thirdOptionAsDateRangePickerProps.endDate) : null,
+        handleDatesChange: (startDate, endDate) => {
+          const formattedValue = {
+            startDate: startDate ? moment.isMoment(startDate) ? startDate : moment(startDate) : null,
+            endDate: endDate ? moment.isMoment(endDate) ? endDate : moment(endDate) : null
+          };
+          valueField.onChange(formattedValue);
+        },
+        isDisabled: !operationField.value,
+        name: `filters.${index}.value`,
+        setEndDate: () => {
+        },
+        setStartDate: () => {
+        },
+        startDate: ((_c = valueField.value) == null ? void 0 : _c.startDate) ? moment.isMoment(valueField.value.startDate) ? valueField.value.startDate : moment(valueField.value.startDate) : ((_d = currentColumnDef.thirdOptionAsDateRangePickerProps) == null ? void 0 : _d.startDate) ? moment.isMoment(currentColumnDef.thirdOptionAsDateRangePickerProps.startDate) ? currentColumnDef.thirdOptionAsDateRangePickerProps.startDate : moment(currentColumnDef.thirdOptionAsDateRangePickerProps.startDate) : null,
+        withPortal: true,
+        onResetClick: () => {
+          valueField.onChange({ startDate: null, endDate: null });
+        },
+        ...(() => {
+          const {
+            startDate: _,
+            endDate: __,
+            ...restProps
+          } = currentColumnDef.thirdOptionAsDateRangePickerProps || {};
+          return restProps;
+        })()
+      }
+    ) : /* @__PURE__ */ jsx(
+      Input,
+      {
+        isDisabled: activeSearchType === "advanceSearch" && !operationField.value,
+        name: `filters.${index}.value`,
+        placeholder: "Enter text",
+        value: valueField.value || "",
+        onChange: (e) => {
+          valueField.onChange(e.target.value);
+        }
+      }
+    ) }),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        disabled: isLastVisible,
+        size: "large",
+        type: "button",
+        variant: "tertiary",
+        onClick: (e) => {
+          e.preventDefault();
+          e.stopPropagation();
+          const fieldId = (field == null ? void 0 : field.fieldId) || (field == null ? void 0 : field.id);
+          if (fieldId !== void 0) {
+            const actualIndex = fields.findIndex((f) => (f.fieldId || f.id) === fieldId);
+            if (actualIndex !== -1) {
+              remove(actualIndex);
+            }
+          } else {
+            remove(index);
+          }
+        },
+        children: /* @__PURE__ */ jsx(default_1, {})
+      }
+    )
+  ] });
+};
+export {
+  NewAdvanceSearchModalItem as default
+};

package/dist/components/TableV36/NoComments.d.ts

@@ -0,0 +1,16 @@
+declare const NoComments: ({ onAddComment, cellId, position, isInsidePortal, editCommentText, isLoading, error, onClearError, isEditFlow, onUpdateComment, setEditingComment, loadParticipantsAvatar, }: {
+    onAddComment: any;
+    cellId: any;
+    position: any;
+    isInsidePortal?: boolean | undefined;
+    editCommentText?: string | undefined;
+    isLoading?: boolean | undefined;
+    error?: null | undefined;
+    onClearError: any;
+    isEditFlow: any;
+    onUpdateComment: any;
+    setEditingComment: any;
+    loadParticipantsAvatar: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export default NoComments;
+//# sourceMappingURL=NoComments.d.ts.map

package/dist/components/TableV36/NoComments.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NoComments.d.ts","sourceRoot":"","sources":["../../../src/components/TableV36/NoComments.tsx"],"names":[],"mappings":"AA4CA,QAAA,MAAM,UAAU,GAAI;;;;;;;;;;;;;CAanB,4CAuOA,CAAC;AAEF,eAAe,UAAU,CAAC"}