@economic/taco 2.63.2-combobox-search.0 → 2.64.0

package/dist/taco.d.ts

@@ -3043,7 +3043,7 @@ export declare interface Table3CommonProps<TType = unknown> extends Table3Featur
 
 export declare type Table3EditingChangeHandler<TType = unknown> = (accessor: string, value: unknown, row: TType, prevRow: TType) => Promise<Partial<TType>> | undefined;
 
-export declare type Table3EditingCreateHandler<TType = unknown> = () => Partial<TType>;
+export declare type Table3EditingCreateHandler<TType = unknown> = () => Promise<Partial<TType>>;
 
 declare type Table3EditingDiscardHandler = () => void;
 
@@ -3998,7 +3998,7 @@ export declare type useTableDataAllFetcher2<TType = unknown> = (sorting: TableCo
 
 export declare function useTableDataLoader<TType = unknown>(fetchPage: useTableDataPageFetcher<TType>, fetchAll: useTableDataAllFetcher<TType>, options?: useTableDataLoaderOptions): [useTableDataLoaderValues<TType>, () => void];
 
-export declare function useTableDataLoader2<TType = unknown>(fetchPage: useTableDataPageFetcher2<TType>, fetchAll: useTableDataAllFetcher2<TType>, options?: useTableDataLoaderOptions): [useTableDataLoaderValues2<TType>, () => void];
+export declare function useTableDataLoader2<TType = unknown>(fetchPage: useTableDataPageFetcher2<TType>, fetchAll: useTableDataAllFetcher2<TType>, options?: useTableDataLoaderOptions): [useTableDataLoaderValues2<TType>, () => Promise<void>];
 
 export declare type useTableDataLoaderOptions = {
     pageSize: number;

package/dist/taco.js

@@ -5378,12 +5378,31 @@ const Cancel = React.forwardRef(function AlertDialogCancel(props, ref) {
 const Action$1 = React.forwardRef(function AlertDialogAction(props, ref) {
   return /* @__PURE__ */ React.createElement($905f4ae918aab1aa$export$e19cd5f9376f8cee, { ...props, className: props.className, ref, asChild: true });
 });
-const Backdrop = React.forwardRef(function Backdrop2(props, ref) {
+const useMergedRef = (ref) => {
+  const internalRef = React__default.useRef(null);
+  React__default.useEffect(() => {
+    if (ref) {
+      if (typeof ref === "function") {
+        ref(internalRef.current);
+      } else {
+        ref.current = internalRef.current;
+      }
+    }
+  }, [ref]);
+  return internalRef;
+};
+const Backdrop = React.forwardRef(function Backdrop2(props, forwardedRef) {
+  const ref = useMergedRef(forwardedRef);
   const className = clsx(
     "fixed inset-0 cursor-default overflow-y-auto bg-blue-900/[0.3] aria-hidden:invisible print:overflow-visible print:absolute",
     props.className
   );
-  return /* @__PURE__ */ React.createElement("div", { ...props, className, "data-taco": "backdrop", ref });
+  const onPointerDown = (event) => {
+    if (event.target === ref.current) {
+      event.preventDefault();
+    }
+  };
+  return /* @__PURE__ */ React.createElement("div", { ...props, className, onPointerDown, "data-taco": "backdrop", ref });
 });
 const getDialogSizeClassnames = (size2) => {
   switch (size2) {
@@ -9741,19 +9760,6 @@ const getBannerIcon = (type) => {
     }
   })());
 };
-const useMergedRef = (ref) => {
-  const internalRef = React__default.useRef(null);
-  React__default.useEffect(() => {
-    if (ref) {
-      if (typeof ref === "function") {
-        ref(internalRef.current);
-      } else {
-        ref.current = internalRef.current;
-      }
-    }
-  }, [ref]);
-  return internalRef;
-};
 const FOCUSABLE_ELEMENTS = [
   '[tabindex]:not([tabindex="-1"]):not([disabled])',
   "input:not([disabled])",
@@ -18368,7 +18374,7 @@ const filterData = (data, value = "") => {
   if (value === "" || value === null) {
     return data;
   }
-  const filteredOptions = [];
+  const filteredOptionValues = /* @__PURE__ */ new Set();
   const shouldFilterOption = (option) => {
     if (option.disabled) {
       return false;
@@ -18378,22 +18384,13 @@ const filterData = (data, value = "") => {
   data.forEach((option) => {
     if (shouldFilterOption(option)) {
       const parents = getOptionParents(data, option.path);
-      const index2 = option.text.toString().toLocaleLowerCase().indexOf(value.toString().toLocaleLowerCase());
-      filteredOptions.push({ value: option.value, score: index2 });
+      filteredOptionValues.add(option.value);
       if (parents !== null) {
-        parents.forEach((option2) => filteredOptions.push({ value: option2 == null ? void 0 : option2.value }));
+        parents.forEach((option2) => filteredOptionValues.add(option2 == null ? void 0 : option2.value));
       }
     }
   });
-  return data.filter(({ value: value2 }) => filteredOptions.find((x2) => x2.value === value2)).toSorted((a2, b2) => {
-    var _a, _b;
-    const scoreA = (_a = filteredOptions.find((x2) => x2.value === a2.value)) == null ? void 0 : _a.score;
-    const scoreB = (_b = filteredOptions.find((x2) => x2.value === b2.value)) == null ? void 0 : _b.score;
-    if (scoreA !== void 0 && scoreB !== void 0) {
-      return scoreA - scoreB;
-    }
-    return 0;
-  });
+  return data.filter(({ value: value2 }) => filteredOptionValues.has(value2));
 };
 const debouncer = debounce$1((f2) => f2(), 200);
 const convertToInputValue = (value) => String(value ?? "");
@@ -18954,6 +18951,9 @@ const Datepicker = React.forwardRef(function Datepicker2(props, ref) {
   const { texts } = useLocalization();
   const className = clsx("inline-flex w-full text-black font-normal", externalClassName);
   const popoverContentRef = React.useRef(null);
+  const handlePopoverClick = React.useCallback((event) => {
+    event.stopPropagation();
+  }, []);
   const handleOpenAutofocus = React.useCallback(
     (e3) => {
       var _a;
@@ -19000,7 +19000,8 @@ const Datepicker = React.forwardRef(function Datepicker2(props, ref) {
               "div",
               {
                 className: '[&_button[name="day"]:focus]:yt-focus -m-3 flex',
-                ref: popoverContentRef
+                ref: popoverContentRef,
+                onClick: handlePopoverClick
               },
               /* @__PURE__ */ React.createElement(
                 Calendar,
@@ -29699,6 +29700,7 @@ const Content$2 = React.forwardRef(function MenuContent(props, ref) {
       align,
       className,
       "data-taco": "menu",
+      hideWhenDetached: true,
       side,
       sideOffset: 3,
       style: { minWidth: menu == null ? void 0 : menu.minWidth },
@@ -38171,7 +38173,7 @@ function Header$2(context) {
         tableMeta.search.enableGlobalFilter ? table.getState().globalFilter : void 0
       );
     }
-    table.toggleAllRowsSelected(checked);
+    setTimeout(() => table.toggleAllRowsSelected(checked), 1);
   };
   return /* @__PURE__ */ React__default.createElement(Tooltip$3, { title }, /* @__PURE__ */ React__default.createElement(
     Checkbox$2,
@@ -39126,7 +39128,9 @@ function Body(props) {
   const focusManager = useAugmentedFocusManager();
   const tableMeta = table.options.meta;
   const handleKeyDown = (event) => {
-    if (event.isDefaultPrevented() || event.isPropagationStopped()) {
+    var _a;
+    const isEventTriggeredInsideTable = ((_a = event.target) == null ? void 0 : _a.closest("tbody")) === ref.current;
+    if (event.isDefaultPrevented() || event.isPropagationStopped() || !isEventTriggeredInsideTable) {
       return;
     }
     if (tableMeta.rowActive.rowActiveIndex !== void 0) {
@@ -39296,20 +39300,14 @@ const MemoedFooter = React__default.memo(function MemoedFooter2(props) {
   );
 });
 function EmptyStateBody(props) {
-  var _a, _b;
+  var _a;
   const { emptyState: Placeholder2, isReady, reason, ...attributes } = props;
   const ref = React__default.useRef(null);
+  const rect = useBoundingClientRectListener({ current: (_a = ref.current) == null ? void 0 : _a.parentNode });
   if (!isReady) {
     return /* @__PURE__ */ React__default.createElement("tbody", { ...attributes, className: "!auto-rows-fr" });
   }
-  return /* @__PURE__ */ React__default.createElement("tbody", { ...attributes, ref, className: "!auto-rows-fr", "data-taco": "empty-state" }, /* @__PURE__ */ React__default.createElement("tr", { className: "!auto-rows-fr " }, /* @__PURE__ */ React__default.createElement(
-    "td",
-    {
-      style: { maxWidth: (_b = (_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.parentNode) == null ? void 0 : _b.clientWidth },
-      className: "col-span-full !border-0 !p-0 hover:!bg-white"
-    },
-    Placeholder2 ? /* @__PURE__ */ React__default.createElement(Placeholder2, { reason }) : void 0
-  )));
+  return /* @__PURE__ */ React__default.createElement("tbody", { ...attributes, ref, className: "!auto-rows-fr", "data-taco": "empty-state" }, /* @__PURE__ */ React__default.createElement("tr", { className: "!auto-rows-fr" }, /* @__PURE__ */ React__default.createElement("td", { style: { maxWidth: rect == null ? void 0 : rect.width }, className: "col-span-full !border-0 !p-0 hover:!bg-white" }, Placeholder2 ? /* @__PURE__ */ React__default.createElement(Placeholder2, { reason }) : void 0)));
 }
 const SearchInput22 = React__default.forwardRef(function SearchInput222(props, ref) {
   const {
@@ -42936,67 +42934,6 @@ function useDroppable(_ref) {
     setNodeRef
   };
 }
-const restrictToVerticalAxis = (_ref) => {
-  let {
-    transform
-  } = _ref;
-  return {
-    ...transform,
-    x: 0
-  };
-};
-function getContainerById(children, id2) {
-  var _a;
-  const lists = React__default.Children.toArray(children).filter(
-    (child) => child.type.displayName === "SortableList"
-  );
-  const list = lists.find(
-    (list2) => list2.props.id === id2
-  );
-  if (list) {
-    return list == null ? void 0 : list.props;
-  }
-  return (_a = lists.find((l2) => React__default.Children.toArray(l2.props.children).findIndex((child) => child.props.id === id2) > -1)) == null ? void 0 : _a.props;
-}
-function Container$1(externalProps) {
-  const { children, reorder, move } = externalProps;
-  function handleDragOver(event) {
-    const { active, over } = event;
-    if (!(active == null ? void 0 : active.id) || !(over == null ? void 0 : over.id)) {
-      return;
-    }
-    const activeList = getContainerById(children, active.id);
-    const overList = getContainerById(children, over.id);
-    if (!(activeList == null ? void 0 : activeList.id) || !(overList == null ? void 0 : overList.id) || activeList.id === overList.id) {
-      return;
-    }
-    move(active.id, activeList == null ? void 0 : activeList.id, overList.id);
-  }
-  function handleDragEnd(event) {
-    const { active, over } = event;
-    if (!(active == null ? void 0 : active.id) || !(over == null ? void 0 : over.id)) {
-      return;
-    }
-    const activeList = getContainerById(children, active.id);
-    const overList = getContainerById(children, over.id);
-    if (!(activeList == null ? void 0 : activeList.id) || !(overList == null ? void 0 : overList.id) || activeList.id !== overList.id) {
-      return;
-    }
-    reorder(active.id, over.id, overList.id);
-  }
-  return /* @__PURE__ */ React__default.createElement(
-    DndContext,
-    {
-      collisionDetection: closestCenter,
-      ...externalProps,
-      modifiers: [restrictToVerticalAxis],
-      onDragOver: handleDragOver,
-      onDragEnd: handleDragEnd
-    },
-    children
-  );
-}
-Container$1.displayName = "SortableContainer";
 function arrayMove(array2, from, to) {
   const newArray = array2.slice();
   newArray.splice(to < 0 ? newArray.length + to : to, 0, newArray.splice(from, 1)[0]);
@@ -43465,6 +43402,74 @@ function normalizeLocalDisabled(localDisabled, globalDisabled) {
   };
 }
 [KeyboardCode.Down, KeyboardCode.Right, KeyboardCode.Up, KeyboardCode.Left];
+function List(externalProps) {
+  const { children, id: id2, ...props } = externalProps;
+  const { setNodeRef } = useDroppable({ id: id2 });
+  const items = React__default.Children.toArray(children).map((child) => child.props);
+  return /* @__PURE__ */ React__default.createElement(SortableContext, { id: id2, items, strategy: verticalListSortingStrategy }, /* @__PURE__ */ React__default.createElement("div", { ...props, ref: id2 ? setNodeRef : void 0 }, children));
+}
+List.displayName = "SortableList";
+const restrictToVerticalAxis = (_ref) => {
+  let {
+    transform
+  } = _ref;
+  return {
+    ...transform,
+    x: 0
+  };
+};
+function getContainerById(children, id2) {
+  var _a;
+  const lists = React__default.Children.toArray(children).filter(
+    (child) => child.type === List
+  );
+  const list = lists.find(
+    (list2) => list2.props.id === id2
+  );
+  if (list) {
+    return list == null ? void 0 : list.props;
+  }
+  return (_a = lists.find((l2) => React__default.Children.toArray(l2.props.children).findIndex((child) => child.props.id === id2) > -1)) == null ? void 0 : _a.props;
+}
+function Container$1(externalProps) {
+  const { children, reorder, move } = externalProps;
+  function handleDragOver(event) {
+    const { active, over } = event;
+    if (!(active == null ? void 0 : active.id) || !(over == null ? void 0 : over.id)) {
+      return;
+    }
+    const activeList = getContainerById(children, active.id);
+    const overList = getContainerById(children, over.id);
+    if (!(activeList == null ? void 0 : activeList.id) || !(overList == null ? void 0 : overList.id) || activeList.id === overList.id) {
+      return;
+    }
+    move == null ? void 0 : move(active.id, activeList.id, overList.id);
+  }
+  function handleDragEnd(event) {
+    const { active, over } = event;
+    if (!(active == null ? void 0 : active.id) || !(over == null ? void 0 : over.id)) {
+      return;
+    }
+    const activeList = getContainerById(children, active.id);
+    const overList = getContainerById(children, over.id);
+    if (!(activeList == null ? void 0 : activeList.id) || !(overList == null ? void 0 : overList.id) || activeList.id !== overList.id) {
+      return;
+    }
+    reorder(active.id, over.id, overList.id);
+  }
+  return /* @__PURE__ */ React__default.createElement(
+    DndContext,
+    {
+      collisionDetection: closestCenter,
+      ...externalProps,
+      modifiers: [restrictToVerticalAxis],
+      onDragOver: handleDragOver,
+      onDragEnd: handleDragEnd
+    },
+    children
+  );
+}
+Container$1.displayName = "SortableContainer";
 const isFormElement = (element) => {
   const formElementNodeNames = ["BUTTON", "INPUT", "TEXTAREA", "SELECT", "FIELDSET"];
   return formElementNodeNames.includes(element.nodeName);
@@ -43488,13 +43493,6 @@ function Item(props) {
   return /* @__PURE__ */ React__default.createElement("div", { ...elProps }, children);
 }
 Item.displayName = "SortableListItem";
-function List(externalProps) {
-  const { children, id: id2, ...props } = externalProps;
-  const { setNodeRef } = useDroppable({ id: id2 });
-  const items = React__default.Children.toArray(children).map((child) => child.props);
-  return /* @__PURE__ */ React__default.createElement(SortableContext, { id: id2, items, strategy: verticalListSortingStrategy }, /* @__PURE__ */ React__default.createElement("div", { ...props, ref: id2 ? setNodeRef : void 0 }, children));
-}
-List.displayName = "SortableList";
 const Column$3 = React__default.forwardRef(function Column2(props, ref) {
   var _a, _b, _c;
   const { column, draggable = false, ...dragAttributes } = props;
@@ -45399,6 +45397,7 @@ function ManageFiltersPopover(props) {
   const { locale: locale2, texts } = useLocalization();
   const allColumns = table.getAllLeafColumns().filter((column) => !isInternalColumn(column.id)).sort(sortByHeader);
   const columnFilters = table.getState().columnFilters;
+  const tableMeta = table.options.meta;
   const [filters, setFilters] = React__default.useState(columnFilters.length ? columnFilters : [placeholderFilter]);
   React__default.useEffect(() => {
     setFilters(columnFilters.length === 0 ? [placeholderFilter] : columnFilters);
@@ -45458,7 +45457,9 @@ function ManageFiltersPopover(props) {
   };
   return /* @__PURE__ */ React__default.createElement(Popover, { ...popoverProps, onChange: handleClose }, /* @__PURE__ */ React__default.createElement(Popover.Content, null, /* @__PURE__ */ React__default.createElement(FilterContext.Provider, { value: filters }, /* @__PURE__ */ React__default.createElement("div", { className: "flex w-[40rem] flex-col gap-4" }, /* @__PURE__ */ React__default.createElement("div", { className: "flex h-8" }, /* @__PURE__ */ React__default.createElement("div", { className: "flex w-full items-center gap-2" }, /* @__PURE__ */ React__default.createElement("h4", { className: "mb-0 inline-flex" }, texts.table.filters.button), /* @__PURE__ */ React__default.createElement("p", { className: "text-grey-700 mb-0 mr-auto mt-px inline-flex" }, texts.table.filters.total.replace(
     "[CURRENT]",
-    new Intl.NumberFormat(locale2).format(table.getFilteredRowModel().rows.length)
+    new Intl.NumberFormat(locale2).format(
+      tableMeta.server._experimentalDataLoader2 ? length : table.getFilteredRowModel().rows.length
+    )
   ).replace("[TOTAL]", new Intl.NumberFormat(locale2).format(length))))), /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col gap-2" }, filters.map((filter2, index2) => /* @__PURE__ */ React__default.createElement(
     Filter,
     {
@@ -55509,7 +55510,7 @@ function useTableEditing(isEnabled = false, defaultToggleEditing = false, handle
         return;
       }
     }
-    const changeset = row ?? handleCreate();
+    const changeset = row ?? await handleCreate();
     try {
       if (changeset) {
         const temporaryRows = tableMeta.editing.temporaryRows;