@apia/api 4.0.31 → 4.0.33

package/dist/index.js

@@ -1,17 +1,17 @@
 import { jsx, jsxs, Fragment } from '@apia/theme/jsx-runtime';
 import * as React from 'react';
 import React__default, { createContext, useState, useCallback, useEffect, useId, useRef, useMemo } from 'react';
-import { Box, Label, spacing, getVariant, Input as Input$1, Select as Select$1 } from '@apia/theme';
+import { Box, Label, spacing, getVariant, Input as Input$1, Select as Select$1, Spinner } from '@apia/theme';
 import { debugDispatcher, parseXmlAsync, arrayOrArray, EventEmitter, useMount, encrypt, noNaN, getIndex, getLabel, StatefulEmitter, focus, focusSelector, useLatest, useIntermediateValue, formatMessage, getDateFormat, Mutex, uniqueId as uniqueId$1 } from '@apia/util';
 import { notify, getNotificationMessageObj, dispatchNotifications } from '@apia/notifications';
 import { classToValidate, Checkbox, FileInput, classToValidationFunction, Input, Radio, Select, Textarea, useFormContext, validationsStore, hasSucceedFormValidation, Form } from '@apia/validations';
-import { Accordion, AccordionItem, useModal, LabelBox, SimpleButton, ApiaUtil, Modal, ProgressBar, DateInput } from '@apia/components';
+import { Accordion, AccordionItem, useModal, LabelBox, SimpleButton, ApiaUtil, Modal, ProgressBar, DateInput, AutocompleteController, Autocomplete, IconButton } from '@apia/components';
 import axios, { AxiosError } from 'axios';
 import merge from 'lodash-es/merge';
 import QueryString from 'qs';
 import { session } from '@apia/session';
 import uniqueId from 'lodash-es/uniqueId';
-import { ResponsiveTableContext, ResponsiveTable, Pagination, Sort, Responsive, Additional, responsiveTableStore, useResponsiveTableContext, getResponsiveTableContext, TableLoadingContext, defaultLabels, makeController2, responsiveTableActions, TableContextReproducer, Grouped } from '@apia/table';
+import { ResponsiveTableContext, ResponsiveTable, Pagination, Sort, Responsive, Additional, responsiveTableStore, useResponsiveTableContext, getResponsiveTableContext, TableLoadingContext, defaultLabels, makeController2, responsiveTableActions, TableContextReproducer, Grouped, makeAsyncRenderer } from '@apia/table';
 import { makeObservable, observable, reaction, toJS, action, computed } from 'mobx';
 import { observer } from 'mobx-react-lite';
 import dayjs from 'dayjs';
@@ -479,7 +479,7 @@ function makeApiaUrl(props) {
   if (props?.queryString && props.queryString.includes("timestamp=") || queryString?.includes("timestamp=")) {
     timestamp = "";
   }
-  const contextWord = CONTEXT.replaceAll("/", "");
+  const contextWord = CONTEXT.replace(/^\/?(.+?)\/?$/, "$1");
   actualAjaxUrl = actualAjaxUrl.match(
     new RegExp(`^(?:(?:/?${contextWord})?/)?(.+)$`)
   )?.[1];
@@ -3237,149 +3237,143 @@ const ApiaApiHandlerNonMemoized = () => {
 const ApiaApiHandler = React.memo(ApiaApiHandlerNonMemoized);
 
 const units = ["B", "KB", "MB", "GB"];
-const RangeFilterRenderer = observer(
-  ({ filter, state }) => {
-    const multiplier = useRef(1);
-    const lastEmittedHigh = useRef(null);
-    const lastEmittedLow = useRef(null);
-    const lastEmittedMultiplier = useRef(1);
-    if (lastEmittedLow.current !== state.value) {
-      lastEmittedLow.current = state.value;
-      lastEmittedHigh.current = state.valueTo || "";
-    }
-    const emitLow = (currentValue) => {
-      const numberValue = currentValue ?? "";
-      if (lastEmittedLow.current === numberValue && lastEmittedMultiplier.current === multiplier.current) {
-        return;
-      }
-      lastEmittedLow.current = numberValue;
-      lastEmittedMultiplier.current = multiplier.current;
-      const emitValue = numberValue;
-      state.value = emitValue;
-      state.multiplier = multiplier.current;
-    };
-    const emitHigh = (currentValue) => {
-      const numberValue = currentValue ?? "";
-      if (lastEmittedHigh.current === numberValue && lastEmittedMultiplier.current === multiplier.current) {
-        return;
-      }
-      lastEmittedHigh.current = numberValue;
-      lastEmittedMultiplier.current = multiplier.current;
-      const emitValue = numberValue;
-      state.valueTo = emitValue;
-      state.multiplier = multiplier.current;
-    };
-    const [lowValue, setLowValue] = useIntermediateValue(state.value);
-    const [highValue, setHighValue] = useIntermediateValue(state.valueTo);
-    const [unit, setUnit] = useIntermediateValue(state.multiplier);
-    return /* @__PURE__ */ jsxs(
-      Box,
-      {
-        className: `ApiaFilter__Range`,
-        ...getVariant("layout.common.components.filters.rangeFilter"),
-        children: [
-          /* @__PURE__ */ jsx(Box, { className: "ApiaFilter__Range__Low", children: /* @__PURE__ */ jsx(
-            Input$1,
-            {
-              disabled: state.readonly,
-              onChange: ({ target: { value: currentValue } }) => {
-                setLowValue(currentValue);
-                emitLow(currentValue);
-              },
-              onBlur: ({ target: { value: currentValue } }) => {
-                emitLow(currentValue);
-              },
-              onKeyDown: ({ code, target }) => {
-                if (code === "Enter") {
-                  emitLow(target.value);
-                }
-              },
-              value: lowValue
-            }
-          ) }),
-          " - ",
-          /* @__PURE__ */ jsx(Box, { className: "ApiaFilter__Range__High", children: /* @__PURE__ */ jsx(
-            Input$1,
-            {
-              disabled: state.readonly,
-              onChange: ({ target: { value: currentValue } }) => {
-                setHighValue(currentValue);
-                emitHigh(currentValue);
-              },
-              onBlur: ({ target: { value: currentValue } }) => {
-                emitHigh(currentValue);
-              },
-              onKeyDown: ({ code, target }) => {
-                if (code === "Enter") {
-                  emitHigh(target.value);
-                }
-              },
-              value: highValue
-            }
-          ) }),
-          filter.isSize && /* @__PURE__ */ jsx(
-            Select$1,
-            {
-              disabled: state.readonly,
-              className: "ApiaFilter__Range__UnitSelector",
-              onChange: (ev) => {
-                const unit2 = ev.target.value;
-                const index = units.indexOf(unit2);
-                if (index !== -1) {
-                  multiplier.current = 2 ** (index * 10);
-                  setUnit(multiplier.current);
-                  emitLow(lastEmittedLow.current ?? "");
-                }
-              },
-              value: units[Math.log2(unit || 1) / 10],
-              children: units.map((c) => /* @__PURE__ */ jsx("option", { value: c, children: c }, c))
-            }
-          )
-        ]
-      }
-    );
+const RangeFilterRenderer = observer(({ state }) => {
+  const multiplier = useRef(1);
+  const lastEmittedHigh = useRef(null);
+  const lastEmittedLow = useRef(null);
+  const lastEmittedMultiplier = useRef(1);
+  if (lastEmittedLow.current !== state.value) {
+    lastEmittedLow.current = state.value;
+    lastEmittedHigh.current = state.valueTo || "";
   }
-);
+  const emitLow = (currentValue) => {
+    const numberValue = currentValue ?? "";
+    if (lastEmittedLow.current === numberValue && lastEmittedMultiplier.current === multiplier.current) {
+      return;
+    }
+    lastEmittedLow.current = numberValue;
+    lastEmittedMultiplier.current = multiplier.current;
+    const emitValue = numberValue;
+    state.value = emitValue;
+    state.multiplier = multiplier.current;
+  };
+  const emitHigh = (currentValue) => {
+    const numberValue = currentValue ?? "";
+    if (lastEmittedHigh.current === numberValue && lastEmittedMultiplier.current === multiplier.current) {
+      return;
+    }
+    lastEmittedHigh.current = numberValue;
+    lastEmittedMultiplier.current = multiplier.current;
+    const emitValue = numberValue;
+    state.valueTo = emitValue;
+    state.multiplier = multiplier.current;
+  };
+  const [lowValue, setLowValue] = useIntermediateValue(state.value);
+  const [highValue, setHighValue] = useIntermediateValue(state.valueTo);
+  const [unit, setUnit] = useIntermediateValue(state.multiplier);
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      className: `ApiaFilter__Range`,
+      ...getVariant("layout.common.components.filters.rangeFilter"),
+      children: [
+        /* @__PURE__ */ jsx(Box, { className: "ApiaFilter__Range__Low", children: /* @__PURE__ */ jsx(
+          Input$1,
+          {
+            disabled: state.readonly,
+            onChange: ({ target: { value: currentValue } }) => {
+              setLowValue(currentValue);
+              emitLow(currentValue);
+            },
+            onBlur: ({ target: { value: currentValue } }) => {
+              emitLow(currentValue);
+            },
+            onKeyDown: ({ code, target }) => {
+              if (code === "Enter") {
+                emitLow(target.value);
+              }
+            },
+            value: lowValue
+          }
+        ) }),
+        " - ",
+        /* @__PURE__ */ jsx(Box, { className: "ApiaFilter__Range__High", children: /* @__PURE__ */ jsx(
+          Input$1,
+          {
+            disabled: state.readonly,
+            onChange: ({ target: { value: currentValue } }) => {
+              setHighValue(currentValue);
+              emitHigh(currentValue);
+            },
+            onBlur: ({ target: { value: currentValue } }) => {
+              emitHigh(currentValue);
+            },
+            onKeyDown: ({ code, target }) => {
+              if (code === "Enter") {
+                emitHigh(target.value);
+              }
+            },
+            value: highValue
+          }
+        ) }),
+        state.isSize && /* @__PURE__ */ jsx(
+          Select$1,
+          {
+            disabled: state.readonly,
+            className: "ApiaFilter__Range__UnitSelector",
+            onChange: (ev) => {
+              const unit2 = ev.target.value;
+              const index = units.indexOf(unit2);
+              if (index !== -1) {
+                multiplier.current = 2 ** (index * 10);
+                setUnit(multiplier.current);
+                emitLow(lastEmittedLow.current ?? "");
+              }
+            },
+            value: units[Math.log2(unit || 1) / 10],
+            children: units.map((c) => /* @__PURE__ */ jsx("option", { value: c, children: c }, c))
+          }
+        )
+      ]
+    }
+  );
+});
 
-const SelectFilterRenderer = observer(
-  ({ filter, state }) => {
-    return /* @__PURE__ */ jsx(
-      Select$1,
-      {
-        disabled: state.readonly,
-        value: state.value,
-        onChange: (ev) => {
-          state.value = ev.target.value;
-        },
-        children: arrayOrArray(filter.options).map((c) => /* @__PURE__ */ jsx("option", { value: c.value, children: c.label }, c.value))
-      }
-    );
-  }
-);
+const SelectFilterRenderer = observer(({ state }) => {
+  return /* @__PURE__ */ jsx(
+    Select$1,
+    {
+      disabled: state.readonly,
+      value: state.value,
+      onChange: (ev) => {
+        state.value = ev.target.value;
+      },
+      children: arrayOrArray(state.options).map((c) => /* @__PURE__ */ jsx("option", { value: c.value, children: c.label }, c.value))
+    }
+  );
+});
 
-const InputFilterRenderer = observer(
-  ({ filter, state }) => {
-    const { onFilterBlur, onFilterPressEnter } = useResponsiveTableContext();
-    return /* @__PURE__ */ jsx(
-      Input$1,
-      {
-        disabled: state.readonly,
-        value: state.value,
-        onChange: (ev) => {
-          state.value = ev.target.value;
-        },
-        onKeyDown: (ev) => {
-          if (ev.code === "Enter") {
-            onFilterPressEnter?.(filter);
-          }
-        },
-        onBlur: () => {
-          onFilterBlur?.(filter);
+const InputFilterRenderer = observer(({ state }) => {
+  const { onFilterBlur, onFilterPressEnter } = useResponsiveTableContext();
+  return /* @__PURE__ */ jsx(
+    Input$1,
+    {
+      disabled: state.readonly,
+      value: state.value,
+      onChange: (ev) => {
+        state.value = ev.target.value;
+      },
+      onKeyDown: (ev) => {
+        if (ev.code === "Enter") {
+          onFilterPressEnter?.(state);
         }
+      },
+      onBlur: () => {
+        onFilterBlur?.(state);
       }
-    );
-  }
-);
+    }
+  );
+});
 
 const dateFormat = getDateFormat();
 function controlDatesOrder(first, last) {
@@ -3390,56 +3384,155 @@ function controlDatesOrder(first, last) {
   }
   return true;
 }
-const DateFilterRenderer = observer(
-  ({ filter, state }) => {
-    const { onFilterBlur, onFilterChange } = useResponsiveTableContext();
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(Box, { as: "span", children: state?.filterToId ? formatMessage(window.LBL_DATE_FILTER_FROM_TXT, {
-        TOK1: filter.title ?? ""
-      }) : state.title }),
+const DateFilterRenderer = observer(({ state }) => {
+  const { onFilterBlur, onFilterChange } = useResponsiveTableContext();
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Box, { as: "span", children: state?.filterToId ? formatMessage(window.LBL_DATE_FILTER_FROM_TXT, {
+      TOK1: state.title ?? ""
+    }) : state.title }),
+    /* @__PURE__ */ jsx(
+      DateInput,
+      {
+        disabled: state.readonly,
+        value: state.value,
+        onChange: (date) => {
+          state.value = date;
+          onFilterChange?.(state);
+        },
+        onBlur: () => {
+          onFilterBlur?.(state);
+        }
+      }
+    ),
+    (state?.isAdditional || state.group) && state?.filterToId && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(Box, { as: "span", children: formatMessage(window.LBL_DATE_FILTER_TO_TXT, {
+        TOK1: state.title ?? ""
+      }) }),
       /* @__PURE__ */ jsx(
         DateInput,
         {
           disabled: state.readonly,
-          value: state.value,
+          value: state.filterToValue,
           onChange: (date) => {
-            state.value = date;
-            onFilterChange?.(filter);
+            const result = controlDatesOrder(state.value, date);
+            if (result) {
+              state.filterToValue = date;
+              onFilterChange?.(state);
+            } else {
+              state.filterToValue = void 0;
+              ApiaUtil.instance.notifications.notify({
+                message: window.MSG_FEC_FIN_MAY_FEC_INI,
+                type: "warning"
+              });
+            }
           },
           onBlur: () => {
-            onFilterBlur?.(filter);
+            onFilterBlur?.(state);
           }
         }
-      ),
-      (state?.isAdditional || state.group) && state?.filterToId && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(Box, { as: "span", children: formatMessage(window.LBL_DATE_FILTER_TO_TXT, {
-          TOK1: state.title ?? ""
-        }) }),
-        /* @__PURE__ */ jsx(
-          DateInput,
-          {
-            disabled: state.readonly,
-            value: state.filterToValue,
-            onChange: (date) => {
-              const result = controlDatesOrder(state.value, date);
-              if (result) {
-                state.filterToValue = date;
-                onFilterChange?.(filter);
-              } else {
-                state.filterToValue = void 0;
-                ApiaUtil.instance.notifications.notify({
-                  message: window.MSG_FEC_FIN_MAY_FEC_INI,
-                  type: "warning"
-                });
-              }
-            },
-            onBlur: () => {
-              onFilterBlur?.(filter);
+      )
+    ] })
+  ] });
+});
+
+async function getOptions(search) {
+  if (!search)
+    return [];
+  const res = await ApiaApi.get(
+    makeApiaUrl({
+      ajaxUrl: "apia/AutoCompleteAction.run",
+      action: "search",
+      object: "doc_free_metadata",
+      filter: "doc_free_metadata_title",
+      id: "doc_free_metadata_title",
+      show: "doc_free_metadata_title",
+      likeSearch: true,
+      allowLive: false,
+      includeEnvId: true,
+      distinctId: true,
+      value: search
+    })
+  );
+  const rows = arrayOrArray(res?.data?.row);
+  return rows.map(({ content, searchId }) => ({
+    label: content,
+    value: searchId
+  }));
+}
+const FreeLabelFilterRenderer = observer(
+  ({ state }) => {
+    const { onFilterChange } = useResponsiveTableContext();
+    const controller = useMemo(
+      () => new AutocompleteController({
+        value: "",
+        icon: "LetterAutocomplete",
+        options: [],
+        onSearch: async (search, _acController) => {
+          state.value = "";
+          return getOptions(search);
+        },
+        onChange(str) {
+          state.value = str;
+        }
+      }),
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+      []
+    );
+    useMount(() => {
+      controller.state.options = [];
+    });
+    return /* @__PURE__ */ jsxs(
+      Box,
+      {
+        sx: {
+          display: "flex",
+          flexDirection: "row",
+          gap: 2,
+          width: "100%",
+          alignItems: "end",
+          ".autocomplete__downArrow": {
+            height: "46px!important",
+            width: "23px!important",
+            svg: {
+              height: "100%",
+              width: "100%"
             }
           }
-        )
-      ] })
-    ] });
+        },
+        children: [
+          /* @__PURE__ */ jsxs(Box, { sx: { width: "50%" }, children: [
+            getLabel("lblTit").text,
+            /* @__PURE__ */ jsx(Autocomplete, { handler: controller })
+          ] }),
+          /* @__PURE__ */ jsxs(Box, { sx: { width: "50%" }, children: [
+            getLabel("lblValue").text,
+            /* @__PURE__ */ jsx(
+              Input$1,
+              {
+                id: state.filterToId,
+                disabled: state.readonly,
+                value: state.filterToValue,
+                onChange: (ev) => {
+                  state.filterToValue = ev.target.value;
+                  onFilterChange?.(state);
+                }
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx(Box, { sx: { height: "50px", width: "50px" }, children: state?.removeFilter && /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              sx: { height: "50px", width: "50px" },
+              icon: "Trash",
+              onClick: () => {
+                if (state?.removeFilter)
+                  state.removeFilter();
+              }
+            }
+          ) })
+        ]
+      }
+    );
   }
 );
 
@@ -3456,19 +3549,22 @@ class Filter {
       runAutomatically: false,
       value: ""
     });
-    __publicField$5(this, "Component", observer(({ filter }) => {
+    __publicField$5(this, "Component", observer(() => {
       const { name } = useResponsiveTableContext();
       this.tableName = name;
       if (this.filterState.isRange) {
-        return this.getRangeRenderer({ filter });
+        return this.getRangeRenderer();
       }
       if (arrayOrArray(this.filterState.options).length > 0) {
-        return this.getSelectRenderer({ filter });
+        return this.getSelectRenderer();
       }
       if (this.filterState.type === "D" || this.filterState.type === "date") {
-        return this.getDateRenderer({ filter });
+        return this.getDateRenderer();
       }
-      return this.getInputRenderer({ filter });
+      if (this.filterState.type === "double") {
+        return this.getDoubleRenderer();
+      }
+      return this.getInputRenderer();
     }));
     Object.assign(this.filterState, properties);
     makeObservable(this, { filterState: observable });
@@ -3484,7 +3580,7 @@ class Filter {
       }
     );
     reaction(
-      () => this.filterState.valueTo,
+      () => this.filterState.filterToValue,
       () => {
         if (this.tableName) {
           getResponsiveTableContext(this.tableName).onFilterChange?.({
@@ -3508,17 +3604,20 @@ class Filter {
   }
   focus() {
   }
-  getInputRenderer({ filter }) {
-    return /* @__PURE__ */ jsx(InputFilterRenderer, { filter, state: this.filterState });
+  getInputRenderer() {
+    return /* @__PURE__ */ jsx(InputFilterRenderer, { state: this.filterState });
+  }
+  getSelectRenderer() {
+    return /* @__PURE__ */ jsx(SelectFilterRenderer, { state: this.filterState });
   }
-  getSelectRenderer({ filter }) {
-    return /* @__PURE__ */ jsx(SelectFilterRenderer, { filter, state: this.filterState });
+  getRangeRenderer() {
+    return /* @__PURE__ */ jsx(RangeFilterRenderer, { state: this.filterState });
   }
-  getRangeRenderer({ filter }) {
-    return /* @__PURE__ */ jsx(RangeFilterRenderer, { filter, state: this.filterState });
+  getDateRenderer() {
+    return /* @__PURE__ */ jsx(DateFilterRenderer, { state: this.filterState });
   }
-  getDateRenderer({ filter }) {
-    return /* @__PURE__ */ jsx(DateFilterRenderer, { filter, state: this.filterState });
+  getDoubleRenderer() {
+    return /* @__PURE__ */ jsx(FreeLabelFilterRenderer, { state: this.filterState });
   }
 }
 
@@ -3543,6 +3642,8 @@ class TableController {
       props: {},
       rows: []
     });
+    // ids de filtros que se consideran "base" (creados en el init)
+    __publicField$4(this, "baseFilterIds", /* @__PURE__ */ new Set());
     __publicField$4(this, "Context", observer(({ children }) => {
       return /* @__PURE__ */ jsx(
         TableLoadingContext.Provider,
@@ -3560,12 +3661,13 @@ class TableController {
           () => [...toJS(state.columns).values()],
           [state.columns]
         );
+        const rows = useMemo(() => [...toJS(state.rows).values()], [state.rows]);
         return /* @__PURE__ */ jsx(
           ResponsiveTableContext,
           {
             ...props,
             columns,
-            rows: useMemo(() => [], []),
+            rows: rows ?? [],
             filters: useMemo(() => this.parseFilters(), [this.state.filters]),
             FiltersRenderer: useCallback(
               (filterId) => this.state.filters.get(filterId).Component,
@@ -3680,6 +3782,12 @@ class TableController {
   on(ev, cb) {
     return this.emitter.on(ev, cb);
   }
+  updateFilters(newFilters) {
+    newFilters.forEach((c) => {
+      this.state.filters.set(c.filterState.id, c);
+    });
+    this.state.filters = new Map(this.state.filters);
+  }
   updateState(newState) {
     if (newState instanceof Function) {
       newState(this.state);
@@ -3687,6 +3795,23 @@ class TableController {
       Object.assign(this.state, newState);
     }
   }
+  //Marca los filters actuales como los iniciales (llamar tras parseStructure/init).
+  markInitialFilters() {
+    this.baseFilterIds = new Set([...this.state.filters.keys()].map(String));
+  }
+  // Elimina todos los filtros que NO son base (aquellos añadidos después del init).
+  removeAddedFilters() {
+    for (const id of [...this.state.filters.keys()]) {
+      if (!this.baseFilterIds.has(String(id))) {
+        this.state.filters.delete(id);
+      }
+    }
+    this.state.filters = new Map(this.state.filters);
+  }
+  removeFilter(id) {
+    this.state.filters.delete(id);
+    this.state.filters = new Map(this.state.filters);
+  }
 }
 
 var __defProp$3 = Object.defineProperty;
@@ -3881,6 +4006,7 @@ class QueryController {
       this.hasInited = true;
       this.initializing = false;
       this.loadFilterTypes();
+      this.tableController.markInitialFilters();
       if (!this.structure.queryData?.noExecFirstTime)
         this.refresh();
     }
@@ -4099,86 +4225,118 @@ const FilterTypesComponent = observer(
   }
 );
 
-const AdditionalFiltersComponent = ({
-  queryController
-}) => {
-  const filterTitle = getLabel("sbtFilters").text;
-  const sortTitle = getLabel("titOrderBy").text;
-  const filterTypes = getLabel("btnFilterType").text;
-  const hasAdditional = !![
-    ...queryController.tableController.state.filters.values()
-  ].find((f) => f.filterState.isAdditional || !f.filterState.column);
-  const hasFilters = !![
-    ...queryController.tableController.state.filters.values()
-  ].find((f) => !f.filterState.isAdditional && f.filterState.column);
-  const hasSortable = !![
-    ...queryController.tableController.state.columns.values()
-  ].find((c) => c.allowSorting !== false);
-  const hasGroupFilter = [
-    ...queryController.tableController.state.filters.values()
-  ].find((f) => f.filterState.group && f.filterState.group !== "")?.filterState;
-  return /* @__PURE__ */ jsx(
-    TableContextReproducer,
-    {
-      tableName: queryController.tableController.getTableName(),
-      children: /* @__PURE__ */ jsxs(Accordion, { className: "additionalFiltersContent", singleExpand: true, children: [
-        hasFilters && /* @__PURE__ */ jsx(
-          AccordionItem,
-          {
-            id: "Responsive",
-            defaultExpanded: true,
-            buttonProps: { ariaLabel: filterTitle, label: filterTitle },
-            children: /* @__PURE__ */ jsx(Responsive, {})
-          }
-        ),
-        hasAdditional && /* @__PURE__ */ jsx(
-          AccordionItem,
-          {
-            id: "Additional",
-            buttonProps: {
-              ariaLabel: window.ADDITIONAL_FILTERS_LABEL,
-              label: window.ADDITIONAL_FILTERS_LABEL
-            },
-            children: /* @__PURE__ */ jsx(Additional, {})
-          }
-        ),
-        hasGroupFilter && /* @__PURE__ */ jsx(
-          AccordionItem,
-          {
-            id: "Group",
-            buttonProps: {
-              ariaLabel: getLabel("titMetadata").text,
-              label: getLabel("titMetadata").text
-            },
-            children: /* @__PURE__ */ jsx(
-              Grouped,
-              {
-                tableName: queryController.tableController.getTableName(),
-                group: hasGroupFilter?.group ?? ""
-              }
-            )
-          }
-        ),
-        hasSortable && /* @__PURE__ */ jsx(
-          AccordionItem,
-          {
-            id: "Sort",
-            buttonProps: { ariaLabel: sortTitle, label: sortTitle },
-            children: /* @__PURE__ */ jsx(Sort, {})
-          }
-        ),
-        hasFilters && !queryController.structure?.hideFilterTypes && /* @__PURE__ */ jsx(
-          AccordionItem,
-          {
-            id: "FilterTypes",
-            buttonProps: { ariaLabel: filterTypes, label: filterTypes },
-            children: /* @__PURE__ */ jsx(FilterTypesComponent, { queryController })
+const AdditionalFiltersComponent = observer(
+  ({ queryController }) => {
+    const filterTitle = getLabel("sbtFilters").text;
+    const sortTitle = getLabel("titOrderBy").text;
+    const filterTypes = getLabel("btnFilterType").text;
+    const hasAdditional = !![
+      ...queryController.tableController.state.filters.values()
+    ].find((f) => f.filterState.isAdditional || !f.filterState.column);
+    const hasFilters = !![
+      ...queryController.tableController.state.filters.values()
+    ].find((f) => !f.filterState.isAdditional && f.filterState.column);
+    const hasSortable = !![
+      ...queryController.tableController.state.columns.values()
+    ].find((c) => c.allowSorting !== false);
+    const groupFilters = (() => {
+      const byGroup = /* @__PURE__ */ new Map();
+      [...queryController.tableController.state.filters.values()].forEach(
+        (f) => {
+          const g = f.filterState?.group;
+          if (g && g !== "" && !byGroup.has(g)) {
+            byGroup.set(g, f);
           }
-        )
-      ] })
-    }
-  );
-};
+        }
+      );
+      return [...byGroup.values()];
+    })();
+    return /* @__PURE__ */ jsx(
+      TableContextReproducer,
+      {
+        tableName: queryController.tableController.getTableName(),
+        children: /* @__PURE__ */ jsxs(Accordion, { className: "additionalFiltersContent", singleExpand: true, children: [
+          hasFilters && /* @__PURE__ */ jsx(
+            AccordionItem,
+            {
+              id: "Responsive",
+              defaultExpanded: true,
+              buttonProps: { ariaLabel: filterTitle, label: filterTitle },
+              children: /* @__PURE__ */ jsx(Responsive, {})
+            }
+          ),
+          hasAdditional && /* @__PURE__ */ jsx(
+            AccordionItem,
+            {
+              id: "Additional",
+              buttonProps: {
+                ariaLabel: window.ADDITIONAL_FILTERS_LABEL,
+                label: window.ADDITIONAL_FILTERS_LABEL
+              },
+              children: /* @__PURE__ */ jsx(Additional, {})
+            }
+          ),
+          groupFilters.length > 0 && /* @__PURE__ */ jsx(Fragment, { children: groupFilters.map((g) => /* @__PURE__ */ jsx(
+            AccordionItem,
+            {
+              id: `Group_${g.filterState.group}`,
+              buttonProps: {
+                ariaLabel: getLabel(`${g.filterState.group}`).text,
+                label: getLabel(`${g.filterState.group}`).text
+              },
+              children: /* @__PURE__ */ jsxs(
+                Box,
+                {
+                  sx: {
+                    display: "flex",
+                    flexDirection: "column",
+                    alignItems: "end",
+                    gap: 3,
+                    width: "100%"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      Grouped,
+                      {
+                        tableName: queryController.tableController.getTableName(),
+                        group: g.filterState?.group ?? ""
+                      },
+                      g.filterState.group
+                    ),
+                    g.filterState.addFilter && /* @__PURE__ */ jsx(
+                      SimpleButton,
+                      {
+                        variant: "outline-sm",
+                        onClick: g.filterState.addFilter,
+                        children: getLabel("lblAddFil").text
+                      }
+                    )
+                  ]
+                }
+              )
+            }
+          )) }),
+          hasSortable && /* @__PURE__ */ jsx(
+            AccordionItem,
+            {
+              id: "Sort",
+              buttonProps: { ariaLabel: sortTitle, label: sortTitle },
+              children: /* @__PURE__ */ jsx(Sort, {})
+            }
+          ),
+          hasFilters && !queryController.structure?.hideFilterTypes && /* @__PURE__ */ jsx(
+            AccordionItem,
+            {
+              id: "FilterTypes",
+              buttonProps: { ariaLabel: filterTypes, label: filterTypes },
+              children: /* @__PURE__ */ jsx(FilterTypesComponent, { queryController })
+            }
+          )
+        ] })
+      }
+    );
+  }
+);
 
 var __defProp$2 = Object.defineProperty;
 var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
@@ -4251,6 +4409,43 @@ var __publicField$1 = (obj, key, value) => {
   __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
+const NavBarRenderer = observer(
+  ({
+    queryController,
+    additionalFiltersController
+  }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      SimpleButton,
+      {
+        variant: "primary-sm",
+        onClick: () => {
+          queryController.refresh();
+        },
+        children: queryController.tableController.state.isLoading ? /* @__PURE__ */ jsx(Spinner, { sx: { color: "white", height: "17px" } }) : getLabel("btnSearch").text
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      SimpleButton,
+      {
+        size: "sm",
+        variant: "outline",
+        onClick: async () => {
+          additionalFiltersController.openModal();
+        },
+        children: getLabel("titAdmAdtFilter").text
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      SimpleButton,
+      {
+        size: "sm",
+        variant: "outline",
+        onClick: () => queryController.clearFilters(),
+        children: getLabel("btnClearFilter").text
+      }
+    )
+  ] })
+);
 class QueryModalController {
   constructor(queryController) {
     __publicField$1(this, "emitter", new EventEmitter());
@@ -4258,6 +4453,7 @@ class QueryModalController {
     __publicField$1(this, "modalHandler", null);
     __publicField$1(this, "currentSelection", null);
     __publicField$1(this, "additionalFiltersController");
+    __publicField$1(this, "sx", {});
     if (!queryController) {
       throw new Error("QueryController instance is required");
     }
@@ -4280,10 +4476,10 @@ class QueryModalController {
     const tableController = this.queryController.tableController;
     const structure = this.queryController.structure;
     return {
-      children: /* @__PURE__ */ jsxs(tableController.Context, { children: [
+      children: /* @__PURE__ */ jsx(Box, { sx: { height: "100%", ...this.sx }, children: /* @__PURE__ */ jsxs(tableController.Context, { children: [
         /* @__PURE__ */ jsx(tableController.Table, {}),
         /* @__PURE__ */ jsx(tableController.Pagination, {})
-      ] }),
+      ] }) }),
       title: structure?.title,
       onConfirm: () => {
         this.onConfirm();
@@ -4297,38 +4493,13 @@ class QueryModalController {
         confirmButtonText: getLabel("btnCon").text,
         cancelButtonText: getLabel("btnCan").text
       },
-      NavBar: /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(
-          SimpleButton,
-          {
-            variant: "primary-sm",
-            onClick: () => {
-              this.queryController.refresh();
-            },
-            children: getLabel("btnSearch").text
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          SimpleButton,
-          {
-            size: "sm",
-            variant: "outline",
-            onClick: async () => {
-              this.additionalFiltersController.openModal();
-            },
-            children: getLabel("titAdmAdtFilter").text
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          SimpleButton,
-          {
-            size: "sm",
-            variant: "outline",
-            onClick: () => this.queryController.clearFilters(),
-            children: getLabel("btnClearFilter").text
-          }
-        )
-      ] }),
+      NavBar: /* @__PURE__ */ jsx(
+        NavBarRenderer,
+        {
+          queryController: this.queryController,
+          additionalFiltersController: this.additionalFiltersController
+        }
+      ),
       size: "finder"
     };
   }
@@ -4389,7 +4560,10 @@ class GenericListQuery extends QueryController {
     };
   }
   getLoadStructureParameters() {
-    return { ...super.getLoadStructureParameters(), action: "filter" };
+    return {
+      ...super.getLoadStructureParameters(),
+      ...this.getRefreshParameters()
+    };
   }
   getRefreshParameters() {
     return {
@@ -4398,14 +4572,32 @@ class GenericListQuery extends QueryController {
       isAjax: true
     };
   }
-  parseRefreshResponse(response) {
-    if (!response)
-      return;
-    const structure = this.parseLoadStructureResponse(response);
-    this.parseStructure(structure);
-    setTimeout(() => {
-      super.parseRefreshResponse(response);
-    }, 0);
+  async getStructure() {
+    const result = await ApiaApi.post(
+      makeApiaUrl(this.getLoadStructureParameters())
+    );
+    if (!result?.data) {
+      throw new Error("Cannot load Input query structure");
+    }
+    super.parseRefreshResponse(result?.data);
+    return this.parseLoadStructureResponse(result.data);
+  }
+  async initialLoad() {
+    this.tableController.state.finishedFirstLoad = false;
+    if (this.initializing && !this.hasInited) {
+      throw new Error("Cannot initialize the query twice");
+    }
+    this.initializing = true;
+    if (!this.hasInited) {
+      const structure = await this.getStructure();
+      this.structure = structure;
+      this.parseStructure(structure);
+      this.tableController.updateState({
+        props: this.getTableControllerDefaultProps()
+      });
+      this.hasInited = true;
+      this.initializing = false;
+    }
   }
   parseLoadStructureResponse(response) {
     const typedResponse = response;
@@ -4423,9 +4615,9 @@ class UsersQuery extends GenericListQuery {
   constructor() {
     super("apia.modals.UsersAction.run");
   }
-  getFiltersValuesMap() {
+  getRefreshParameters() {
     return {
-      ...super.getFiltersValuesMap(),
+      ...super.getRefreshParameters(),
       externalUser: false,
       selectOnlyOne: false,
       globalAndEnv: true,
@@ -4434,6 +4626,20 @@ class UsersQuery extends GenericListQuery {
       forCurrentEnv: false
     };
   }
+  parseRefreshResponse(response) {
+    if (!response)
+      return;
+    const structure = this.parseLoadStructureResponse(response);
+    this.parseStructure(structure);
+    setTimeout(() => {
+      super.parseRefreshResponse(response);
+    }, 0);
+  }
+  getFiltersValuesMap() {
+    return {
+      ...super.getFiltersValuesMap()
+    };
+  }
   parseLoadStructureResponse(response) {
     const structure = { ...super.parseLoadStructureResponse(response) };
     structure.hideFilterTypes = true;
@@ -4443,16 +4649,17 @@ class UsersQuery extends GenericListQuery {
 const makeApiaUsersModal2 = () => new QueryModalController(new UsersQuery());
 
 class PoolsQuery extends GenericListQuery {
-  constructor() {
+  constructor(config) {
     super("apia.modals.PoolsAction.run");
+    this.config = config;
   }
-  getFiltersValuesMap() {
+  getRefreshParameters() {
     return {
-      ...super.getFiltersValuesMap(),
+      ...super.getRefreshParameters(),
       showAutogenerated: false,
       showNotAutogenerated: false,
-      showCurrentEnv: true,
-      showGlobal: true,
+      showCurrentEnv: this.config?.showCurrentEnv ?? true,
+      showGlobal: this.config?.showGlobal ?? true,
       selectOnlyOne: false,
       forHierarchy: false,
       showOnlyPoolsInHierarchy: false,
@@ -4461,24 +4668,58 @@ class PoolsQuery extends GenericListQuery {
       fetchAllInHierarchy: false
     };
   }
+  getFiltersValuesMap() {
+    return {
+      ...super.getFiltersValuesMap()
+    };
+  }
+  parseRefreshResponse(response) {
+    if (!response)
+      return;
+    const structure = this.parseLoadStructureResponse(response);
+    this.parseStructure(structure);
+    setTimeout(() => {
+      super.parseRefreshResponse(response);
+    }, 0);
+  }
   parseLoadStructureResponse(response) {
     const structure = { ...super.parseLoadStructureResponse(response) };
     structure.hideFilterTypes = true;
+    structure.title = getLabel("btnAddPool").text;
     return structure;
   }
 }
-const makeApiaPoolsModals2 = () => new QueryModalController(new PoolsQuery());
+const makeApiaPoolsModals2 = (config) => new QueryModalController(new PoolsQuery(config));
 
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => {
-  __defNormalProp(obj, key + "" , value);
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
 class MonDocQuery extends QueryController {
   constructor(ajaxUrl) {
     super(ajaxUrl);
     this.ajaxUrl = ajaxUrl;
+    __publicField(this, "getAdditionalInfo", async (row) => {
+      const result = await ApiaApi.post(
+        makeApiaUrl({
+          ajaxUrl: this.ajaxUrl,
+          action: "adtInfo",
+          isAjax: true,
+          preventAsXmlParameter: true
+        }),
+        {
+          postData: new URLSearchParams({
+            id: row.id.slice(
+              0,
+              row.id.indexOf("$-$") > 0 ? row.id.indexOf("$-$") : row.id.length
+            )
+          }).toString()
+        }
+      );
+      return arrayOrArray(result?.data?.function.messages.row.cell);
+    });
     __publicField(this, "dynamicParams", {});
   }
   getTableControllerDefaultProps() {
@@ -4499,42 +4740,74 @@ class MonDocQuery extends QueryController {
       ]
     };
   }
+  addFreeMetadataFilter(filter) {
+    const id = uniqueId$1();
+    const actualFilter = filter || {
+      id,
+      group: "lblFreeMetadata",
+      value: "",
+      filterToValue: "",
+      avoidLabel: true,
+      type: "double",
+      addFilter: () => {
+        this.addFreeMetadataFilter();
+      },
+      removeFilter: () => {
+        this.tableController.removeFilter(id);
+      }
+    };
+    const freeMetadataFilters = arrayOrArray(actualFilter).map((f) => {
+      return new Filter(f);
+    });
+    this.tableController.updateFilters(freeMetadataFilters);
+  }
   async initialLoad() {
     await super.initialLoad();
     await this.loadMetadataFilters();
     await this.setFilters();
   }
   async loadMetadataFilters() {
+    this.tableController.removeAddedFilters();
     const res = await ApiaApi.post(
       makeApiaUrl({
         ajaxUrl: this.ajaxUrl,
         action: "loadMetadata",
-        docTypeId: !this.hasInited ? this.dynamicParams.docTypeSel : this.tableController.state.filters.get("txtDocTypeId")?.filterState.value
+        docTypeId: this.tableController.state.filters.get("txtDocTypeId")?.filterState.value || 1
       })
     );
     if (res?.data?.docMetadata?.metadata) {
-      const parsedFilters = res.data.docMetadata.metadata.map((c) => {
-        const filter = {
-          ...c,
-          group: "metadata",
-          hideToFilter: true,
-          filterToId: `${String(c.id)}i`,
-          filterToValue: c.value2,
-          avoidLabel: c.type === "D"
-        };
-        return filter;
-      });
-      const metadataFilters = new Map(
-        arrayOrArray(parsedFilters).map((f) => {
-          return [f.id, new Filter(f)];
-        })
+      const parsedFilters = arrayOrArray(res.data.docMetadata.metadata).map(
+        (c) => {
+          const filter = {
+            ...c,
+            group: "titMetadata",
+            hideToFilter: true,
+            filterToId: `${String(c.id)}i`,
+            filterToValue: c.value2,
+            avoidLabel: c.type === "D"
+          };
+          return filter;
+        }
       );
-      this.tableController.updateState({
-        filters: new Map([
-          ...this.tableController.state.filters.entries(),
-          ...metadataFilters.entries()
-        ])
+      const metadataFilters = arrayOrArray(parsedFilters).map((f) => {
+        return new Filter(f);
       });
+      this.tableController.updateFilters(metadataFilters);
+      if (metadataFilters.length > 0) {
+        const id = uniqueId$1();
+        const metadataFilter = {
+          id,
+          group: "lblFreeMetadata",
+          value: "",
+          filterToValue: "",
+          avoidLabel: true,
+          type: "double",
+          addFilter: () => {
+            this.addFreeMetadataFilter();
+          }
+        };
+        this.addFreeMetadataFilter(metadataFilter);
+      }
     }
   }
   async loadFilterTypes() {
@@ -4568,28 +4841,32 @@ class MonDocQuery extends QueryController {
   }
   getFiltersValuesMap() {
     const metadataValues = [];
+    const freeMetadataValues = [];
     const filtersValues = [
       ...this.tableController.state.filters.values()
     ].reduce((result, filterWrapper) => {
       const { id, value, type, group, multiplier, filterToId, filterToValue } = filterWrapper.filterState;
-      if (group?.match(/metadata(\d+)/)) {
-        if (value !== "") {
-          const prefix = `${id}${window.PRIMARY_SEPARATOR}`;
-          if (type) {
-            const t = type === "apiaNumber" ? "N" : type;
+      switch (group) {
+        case "titMetadata":
+          if (value !== "") {
+            const t = (type === "apiaNumber" ? "N" : type) || "S";
             metadataValues.push(
-              `${prefix}${t}${window.PRIMARY_SEPARATOR}${value}`
+              `${id}${window.PRIMARY_SEPARATOR}${t}${window.PRIMARY_SEPARATOR}${value}`
             );
             if (filterToValue) {
               metadataValues.push(
-                `${prefix}${t}${window.PRIMARY_SEPARATOR}${filterToValue}`
+                `${id}${window.PRIMARY_SEPARATOR}${t}${window.PRIMARY_SEPARATOR}${filterToValue}`
               );
             }
-          } else {
-            metadataValues.push(`${prefix}${value}`);
           }
-        }
-        return result;
+          return result;
+        case "lblFreeMetadata":
+          if (filterToValue !== "") {
+            freeMetadataValues.push(
+              `${value}${window.PRIMARY_SEPARATOR}${filterToValue}`
+            );
+          }
+          return result;
       }
       result[id] = multiplier ? value * multiplier : value;
       if (filterToId !== void 0 && filterToValue != void 0) {
@@ -4599,7 +4876,8 @@ class MonDocQuery extends QueryController {
     }, {});
     return {
       ...filtersValues,
-      strDocMetadata: metadataValues.join(";")
+      strDocMetadata: metadataValues.join(";"),
+      strDocFreeMetadata: freeMetadataValues.join(";")
     };
   }
   getEventsHandlers() {
@@ -4631,7 +4909,9 @@ class MonDocQuery extends QueryController {
                 {
                   title: getLabel("lblLockedDocument").text,
                   icon: "Locked",
-                  sx: { display: r.docLock ? "block" : "none" }
+                  sx: {
+                    display: r.docLock ? "block!important" : "none!important"
+                  }
                 }
               ),
               tooltip: ""
@@ -4643,7 +4923,9 @@ class MonDocQuery extends QueryController {
                   title: getLabel("lblReadOnly").text,
                   icon: "Readonly",
                   size: 22,
-                  sx: { display: r.uneditableTR ? "block" : "none" }
+                  sx: {
+                    display: r.uneditableTR ? "block!important" : "none!important"
+                  }
                 }
               ),
               tooltip: ""
@@ -4662,7 +4944,23 @@ class MonDocQuery extends QueryController {
                   return { children: c.content, className: c.classToAdd };
                 }
                 if ("elemType" in c) {
-                  return { children: c.elemType };
+                  return {
+                    children: /* @__PURE__ */ jsx(
+                      IconButton,
+                      {
+                        icon: "Download",
+                        onClick: () => {
+                          window.open(
+                            makeApiaUrl({
+                              ajaxUrl: this.ajaxUrl,
+                              action: "download",
+                              id: r.id
+                            })
+                          );
+                        }
+                      }
+                    )
+                  };
                 }
               }
               return { children: c };
@@ -4678,20 +4976,29 @@ class MonDocQuery extends QueryController {
     const typedResponse = response;
     const retrievedColumns = arrayOrArray(typedResponse.columns);
     const retrievedFilters = arrayOrArray(typedResponse.filters);
+    const columns = retrievedColumns.map((c) => {
+      const column = {
+        label: c.label,
+        name: c.name,
+        allowSorting: c.allowSorting,
+        dataSortBy: c.dataSortBy,
+        sort: c.sort,
+        toolTip: c.toolTip,
+        minWidth: c.name === "docFile" ? "50px" : "25%",
+        width: c.name === "docFile" ? "50px" : "25%"
+      };
+      return column;
+    });
+    if (response.additionalInfoInTable) {
+      columns?.push({
+        showAsAdditional: true,
+        label: "moreInfo",
+        name: "moreInfo",
+        Renderer: makeAsyncRenderer((row) => this.getAdditionalInfo(row))
+      });
+    }
     const returnObject = {
-      columns: retrievedColumns.map((c) => {
-        const column = {
-          label: c.label,
-          name: c.name,
-          allowSorting: c.allowSorting,
-          dataSortBy: c.dataSortBy,
-          sort: c.sort,
-          toolTip: c.toolTip,
-          minWidth: c.name === "docFile" ? "50px" : "25%",
-          width: c.name === "docFile" ? "50px" : "25%"
-        };
-        return column;
-      }).filter((c) => c !== null),
+      columns: columns.filter((c) => c !== null),
       filters: arrayOrArray(retrievedFilters).map((f) => {
         const filter = {
           id: f.id,
@@ -4718,12 +5025,12 @@ class MonDocQuery extends QueryController {
         return filter;
       }),
       description: "",
-      hasAdditionalInformation: response.additionalInfoInTable,
-      hideFilterTypes: false,
+      hasAdditionalInformation: true,
+      hideFilterTypes: true,
       isDynamic: false,
       openFiltersAutomatically: false,
       runFiltersAutomatically: true,
-      title: "",
+      title: response.title,
       queryData: { noExecFirstTime: true }
     };
     return returnObject;
@@ -4741,6 +5048,14 @@ class MonDocQuery extends QueryController {
 class ApiaMonDocModal2 extends QueryModalController {
   constructor() {
     super(new MonDocQuery("/apia.execution.CustMonDocumentAction.run"));
+    __publicField(this, "sx", {
+      "tr.expired[class]": {
+        color: "priorityUrgent",
+        "&:hover": {
+          color: "priorityUrgent"
+        }
+      }
+    });
   }
   openModal(properties) {
     this.queryController.setDynamicParams(