@carlonicora/nextjs-jsonapi 1.48.2 → 1.49.0

package/dist/{chunk-PZGFGYEO.mjs → chunk-VQ35TGD7.mjs}

@@ -93,7 +93,7 @@ var TableGeneratorRegistry = class _TableGeneratorRegistry {
     return _TableGeneratorRegistry.instance;
   }
   register(type, hook) {
-    if (!this.registry.has(type)) this.registry.set(type, hook);
+    this.registry.set(type, hook);
   }
   get(type, params) {
     const hook = this.registry.get(type);
@@ -5120,7 +5120,7 @@ function TableRow({ className, ...props }) {
     "tr",
     {
       "data-slot": "table-row",
-      className: cn("hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors", className),
+      className: cn("group hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors", className),
       ...props
     }
   );
@@ -6326,6 +6326,7 @@ MultiSelect.displayName = "MultiSelect";
 import { Command as CommandPrimitive2, useCommandState } from "cmdk";
 import { ChevronDownIcon as ChevronDownIcon5, X } from "lucide-react";
 import * as React12 from "react";
+import { createPortal as createPortal2 } from "react-dom";
 import { forwardRef as forwardRef5, useEffect as useEffect10 } from "react";
 import { Fragment as Fragment4, jsx as jsx51, jsxs as jsxs23 } from "react/jsx-runtime";
 function useDebounce2(value, delay) {
@@ -6419,13 +6420,16 @@ var MultipleSelector = React12.forwardRef(
     inputProps,
     hideClearAllButton = false,
     renderOption,
-    maxDisplayCount
+    maxDisplayCount,
+    usePortal = false
   }, ref) => {
     const inputRef = React12.useRef(null);
+    const containerRef = React12.useRef(null);
     const [open, setOpen] = React12.useState(false);
     const [onScrollbar, setOnScrollbar] = React12.useState(false);
     const [isLoading, setIsLoading] = React12.useState(false);
     const dropdownRef = React12.useRef(null);
+    const [dropdownPosition, setDropdownPosition] = React12.useState({ top: 0, left: 0, width: 0 });
     const [selected, setSelected] = React12.useState(value || []);
     const [options, setOptions] = React12.useState(transToGroupOption(arrayDefaultOptions, groupBy));
     const [inputValue, setInputValue] = React12.useState("");
@@ -6514,6 +6518,36 @@ var MultipleSelector = React12.forwardRef(
       }, "exec");
       void exec();
     }, [debouncedSearchTerm, groupBy, open, triggerSearchOnFocus, onSearchSync]);
+    useEffect10(() => {
+      if (!usePortal || !open || !containerRef.current) return;
+      const updatePosition = /* @__PURE__ */ __name(() => {
+        if (containerRef.current) {
+          const rect = containerRef.current.getBoundingClientRect();
+          setDropdownPosition({
+            top: rect.bottom + window.scrollY + 4,
+            left: rect.left + window.scrollX,
+            width: rect.width
+          });
+        }
+      }, "updatePosition");
+      updatePosition();
+      const handleScroll = /* @__PURE__ */ __name(() => {
+        if (containerRef.current) {
+          const rect = containerRef.current.getBoundingClientRect();
+          if (rect.bottom < 0 || rect.top > window.innerHeight) {
+            setOpen(false);
+          } else {
+            updatePosition();
+          }
+        }
+      }, "handleScroll");
+      window.addEventListener("scroll", handleScroll, true);
+      window.addEventListener("resize", updatePosition);
+      return () => {
+        window.removeEventListener("scroll", handleScroll, true);
+        window.removeEventListener("resize", updatePosition);
+      };
+    }, [usePortal, open]);
     useEffect10(() => {
       const doSearch = /* @__PURE__ */ __name(async () => {
         setIsLoading(true);
@@ -6604,6 +6638,7 @@ var MultipleSelector = React12.forwardRef(
           /* @__PURE__ */ jsxs23(
             "div",
             {
+              ref: containerRef,
               className: cn(
                 "flex min-h-10 items-start justify-between rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2 md:text-sm",
                 {
@@ -6712,7 +6747,7 @@ var MultipleSelector = React12.forwardRef(
               ]
             }
           ),
-          /* @__PURE__ */ jsx51("div", { className: "relative", children: open && /* @__PURE__ */ jsx51(
+          !usePortal && /* @__PURE__ */ jsx51("div", { className: "relative", children: open && /* @__PURE__ */ jsx51(
             CommandList,
             {
               className: "absolute top-1 z-10 w-full rounded-md border bg-background text-foreground shadow-md outline-none animate-in",
@@ -6768,7 +6803,73 @@ var MultipleSelector = React12.forwardRef(
                 ))
               ] })
             }
-          ) })
+          ) }),
+          usePortal && open && typeof window !== "undefined" && createPortal2(
+            /* @__PURE__ */ jsx51(
+              CommandList,
+              {
+                ref: dropdownRef,
+                className: "fixed z-50 max-h-80 rounded-md border bg-background text-foreground shadow-md outline-none animate-in",
+                style: {
+                  top: dropdownPosition.top,
+                  left: dropdownPosition.left,
+                  width: dropdownPosition.width
+                },
+                onMouseLeave: () => {
+                  setOnScrollbar(false);
+                },
+                onMouseEnter: () => {
+                  setOnScrollbar(true);
+                },
+                onMouseUp: () => {
+                  inputRef?.current?.focus();
+                },
+                children: isLoading ? /* @__PURE__ */ jsx51(Fragment4, { children: loadingIndicator }) : /* @__PURE__ */ jsxs23(Fragment4, { children: [
+                  EmptyItem(),
+                  CreatableItem(),
+                  !selectFirstItem && /* @__PURE__ */ jsx51(CommandItem, { value: "-", className: "hidden" }),
+                  Object.entries(selectables).map(([key, dropdowns]) => /* @__PURE__ */ jsx51(
+                    CommandGroup,
+                    {
+                      heading: key,
+                      className: "h-full overflow-auto [&_[cmdk-group-heading]]:border-b [&_[cmdk-group-heading]]:border-border/50 [&_[cmdk-group-heading]]:mb-1",
+                      children: /* @__PURE__ */ jsx51(Fragment4, { children: dropdowns.map((option) => {
+                        return /* @__PURE__ */ jsx51(
+                          CommandItem,
+                          {
+                            value: option.label,
+                            disabled: option.disable,
+                            onMouseDown: (e) => {
+                              e.preventDefault();
+                              e.stopPropagation();
+                            },
+                            onSelect: () => {
+                              if (selected.length >= maxSelected) {
+                                onMaxSelected?.(selected.length);
+                                return;
+                              }
+                              setInputValue("");
+                              const newOptions = [...selected, option];
+                              setSelected(newOptions);
+                              onChange?.(newOptions);
+                            },
+                            className: cn(
+                              "cursor-pointer bg-transparent hover:bg-accent data-selected:bg-transparent data-selected:hover:bg-accent",
+                              option.disable && "cursor-default text-muted-foreground"
+                            ),
+                            children: renderOption ? renderOption(option) : option.label
+                          },
+                          option.value
+                        );
+                      }) })
+                    },
+                    key
+                  ))
+                ] })
+              }
+            ),
+            document.body
+          )
         ]
       }
     );
@@ -11160,7 +11261,7 @@ function ContentTitle({ module, type, element, functions, className, prioritizeF
     setClientFunctions(functions);
   }, [functions]);
   if (!element) return null;
-  return /* @__PURE__ */ jsxs67("div", { className: cn(`mb-4 flex items-center justify-between gap-x-4 w-full`, className), children: [
+  return /* @__PURE__ */ jsxs67("div", { className: cn(`mb-4 flex items-start justify-between gap-x-4 w-full`, className), children: [
     /* @__PURE__ */ jsxs67("div", { className: cn("flex flex-col", prioritizeFunctions ? "min-w-0 shrink" : "w-full"), children: [
       type && /* @__PURE__ */ jsxs67(
         "div",
@@ -11447,7 +11548,7 @@ __name(AllowedUsersDetails, "AllowedUsersDetails");
 import dynamic from "next/dynamic";
 import React16 from "react";
 import { jsx as jsx128 } from "react/jsx-runtime";
-var BlockNoteEditor = dynamic(() => import("./BlockNoteEditor-DM43MVV3.mjs"), {
+var BlockNoteEditor = dynamic(() => import("./BlockNoteEditor-WLS36QIF.mjs"), {
   ssr: false
 });
 var BlockNoteEditorContainer = React16.memo(/* @__PURE__ */ __name(function EditorContainer(props) {
@@ -17419,4 +17520,4 @@ export {
   useOAuthClients,
   useOAuthClient
 };
-//# sourceMappingURL=chunk-PZGFGYEO.mjs.map
+//# sourceMappingURL=chunk-VQ35TGD7.mjs.map