@firecms/ui 3.0.0-tw4.16 → 3.0.0-tw4.18

package/dist/index.es.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { c } from "react-compiler-runtime";
 import * as React from "react";
-import React__default, { useEffect, useState, createContext, useContext, useRef, Children, forwardRef, useLayoutEffect, useDeferredValue } from "react";
+import React__default, { createContext, useContext, useEffect, useState, useRef, Children, forwardRef, useLayoutEffect, useDeferredValue } from "react";
 import * as Collapsible from "@radix-ui/react-collapsible";
 import { clsx } from "clsx";
 import { twMerge } from "tailwind-merge";
@@ -247,31 +247,69 @@ function keyToIconComponent(key) {
   }).join("") + "Icon";
   return componentName;
 }
+const PortalContainerContext = createContext(void 0);
+function PortalContainerProvider(t0) {
+  const $ = c(5);
+  const {
+    container,
+    children
+  } = t0;
+  let t1;
+  if ($[0] !== container) {
+    t1 = {
+      container
+    };
+    $[0] = container;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  let t2;
+  if ($[2] !== children || $[3] !== t1) {
+    t2 = /* @__PURE__ */ jsx(PortalContainerContext.Provider, { value: t1, children });
+    $[2] = children;
+    $[3] = t1;
+    $[4] = t2;
+  } else {
+    t2 = $[4];
+  }
+  return t2;
+}
+function usePortalContainer() {
+  const context = useContext(PortalContainerContext);
+  return context?.container ?? null;
+}
 function useInjectStyles(key, styles2) {
-  const $ = c(4);
+  const $ = c(5);
+  const portalContainer = usePortalContainer();
   let t0;
-  if ($[0] !== key || $[1] !== styles2) {
+  if ($[0] !== key || $[1] !== portalContainer || $[2] !== styles2) {
     t0 = () => {
-      const styleElement = document.getElementById(key);
-      if (!styleElement) {
+      if (typeof document === "undefined") {
+        return;
+      }
+      const targetContainer = portalContainer ?? document.head;
+      const existingStyle = targetContainer.querySelector?.(`#${key}`);
+      if (!existingStyle) {
         const style = document.createElement("style");
         style.id = key;
         style.innerHTML = styles2;
-        document.head.appendChild(style);
+        (targetContainer || document.head).appendChild(style);
       }
     };
     $[0] = key;
-    $[1] = styles2;
-    $[2] = t0;
+    $[1] = portalContainer;
+    $[2] = styles2;
+    $[3] = t0;
   } else {
-    t0 = $[2];
+    t0 = $[3];
   }
   let t1;
-  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+  if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
     t1 = [];
-    $[3] = t1;
+    $[4] = t1;
   } else {
-    t1 = $[3];
+    t1 = $[4];
   }
   useEffect(t0, t1);
 }
@@ -360,38 +398,6 @@ function useIconStyles(t0) {
   font-variation-settings: 'FILL' ${fill ? 1 : 0}, 'wght' ${weight}, 'GRAD' ${grad}, 'opsz' ${opticalSize};
 }`);
 }
-const PortalContainerContext = createContext(void 0);
-function PortalContainerProvider(t0) {
-  const $ = c(5);
-  const {
-    container,
-    children
-  } = t0;
-  let t1;
-  if ($[0] !== container) {
-    t1 = {
-      container
-    };
-    $[0] = container;
-    $[1] = t1;
-  } else {
-    t1 = $[1];
-  }
-  let t2;
-  if ($[2] !== children || $[3] !== t1) {
-    t2 = /* @__PURE__ */ jsx(PortalContainerContext.Provider, { value: t1, children });
-    $[2] = children;
-    $[3] = t1;
-    $[4] = t2;
-  } else {
-    t2 = $[4];
-  }
-  return t2;
-}
-function usePortalContainer() {
-  const context = useContext(PortalContainerContext);
-  return context?.container ?? null;
-}
 const Collapse = React__default.memo((t0) => {
   const $ = c(9);
   const {
@@ -32829,7 +32835,7 @@ const Dialog = (t0) => {
   const disableInitialFocus = t5 === void 0 ? true : t5;
   const [displayed, setDisplayed] = useState(false);
   const contextContainer = usePortalContainer();
-  const finalContainer = portalContainer || contextContainer;
+  const finalContainer = portalContainer ?? contextContainer ?? void 0;
   let t6;
   let t7;
   if ($[0] !== open) {
@@ -33694,7 +33700,7 @@ const Menu = React__default.forwardRef((t0, ref) => {
   } = t0;
   const sideOffset = t1 === void 0 ? 4 : t1;
   const contextContainer = usePortalContainer();
-  const finalContainer = portalContainer || contextContainer;
+  const finalContainer = portalContainer ?? contextContainer ?? void 0;
   let t2;
   if ($[0] !== ref || $[1] !== trigger) {
     t2 = /* @__PURE__ */ jsx(DropdownMenu.Trigger, { ref, asChild: true, children: trigger });
@@ -33861,7 +33867,7 @@ function MenubarPortal(t0) {
     portalContainer
   } = t0;
   const contextContainer = usePortalContainer();
-  const finalContainer = portalContainer || contextContainer;
+  const finalContainer = portalContainer ?? contextContainer ?? void 0;
   let t1;
   if ($[0] !== children || $[1] !== finalContainer) {
     t1 = /* @__PURE__ */ jsx(MenubarPrimitive.Portal, { container: finalContainer, children });
@@ -34545,7 +34551,7 @@ const MultiSelect = React.forwardRef((t0, ref) => {
   }
   const [selectedValues, setSelectedValues] = useState(t6);
   const contextContainer = usePortalContainer();
-  const finalContainer = portalContainer || contextContainer;
+  const finalContainer = portalContainer ?? contextContainer ?? void 0;
   let t7;
   let t8;
   if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
@@ -35542,7 +35548,7 @@ const Select = forwardRef((t0, ref) => {
   }
   useEffect(t6, t7);
   const contextContainer = usePortalContainer();
-  const finalContainer = manualContainer || contextContainer;
+  const finalContainer = manualContainer ?? contextContainer ?? void 0;
   let t8;
   if ($[30] !== dataType || $[31] !== name || $[32] !== onChange || $[33] !== onValueChange) {
     t8 = (newValue) => {
@@ -36228,7 +36234,7 @@ const Sheet = (t0) => {
   const includeBackgroundOverlay = t3 === void 0 ? true : t3;
   const [displayed, setDisplayed] = useState(false);
   const contextContainer = usePortalContainer();
-  const finalContainer = portalContainer || contextContainer;
+  const finalContainer = portalContainer ?? contextContainer ?? void 0;
   let t4;
   let t5;
   if ($[15] !== open) {
@@ -36696,7 +36702,7 @@ const Tooltip = (t0) => {
   const asChild = t3 === void 0 ? false : t3;
   useInjectStyles("Tooltip", styles);
   const contextContainer = usePortalContainer();
-  const finalContainer = container || contextContainer;
+  const finalContainer = container ?? contextContainer ?? void 0;
   if (!title) {
     let t42;
     if ($[0] !== children) {
@@ -37172,7 +37178,7 @@ function Popover(t0) {
   const modal = t3 === void 0 ? false : t3;
   useInjectStyles("Popover", popoverStyles);
   const contextContainer = usePortalContainer();
-  const finalContainer = portalContainer || contextContainer;
+  const finalContainer = portalContainer ?? contextContainer ?? void 0;
   if (!enabled) {
     let t42;
     if ($[0] !== trigger) {