@edux-design/forms 0.0.17 → 0.0.18

package/dist/index.d.mts

@@ -246,6 +246,7 @@ declare const Option: react.ForwardRefExoticComponent<react.RefAttributes<any>>;
  * @property {string} [contentClassName] - optional class for the popover content
  * @property {string} [listClassName] - optional class for the list element
  * @property {string} [optionClassName] - optional class for each option
+ * @property {HTMLElement|null} [portalContainer] - explicit portal container for the popover content
  * @property {"default"|"small"} [size="default"] - size variant for the combobox input
  * @property {"full"|"small"|"medium"|"large"} [width="full"] - width size for the combobox container
  */

package/dist/index.d.ts

@@ -246,6 +246,7 @@ declare const Option: react.ForwardRefExoticComponent<react.RefAttributes<any>>;
  * @property {string} [contentClassName] - optional class for the popover content
  * @property {string} [listClassName] - optional class for the list element
  * @property {string} [optionClassName] - optional class for each option
+ * @property {HTMLElement|null} [portalContainer] - explicit portal container for the popover content
  * @property {"default"|"small"} [size="default"] - size variant for the combobox input
  * @property {"full"|"small"|"medium"|"large"} [width="full"] - width size for the combobox container
  */

package/dist/index.js

@@ -884,6 +884,7 @@ var ComboboxRoot = (0, import_react10.forwardRef)(
     contentClassName,
     listClassName,
     optionClassName,
+    portalContainer: portalContainer2,
     size = "default",
     width = "full",
     ...inputProps
@@ -999,11 +1000,11 @@ var ComboboxRoot = (0, import_react10.forwardRef)(
       setActiveIndex((prev) => prev >= 0 ? prev : 0);
     }, [open, filteredOptions, singleSelectedValue, isMultiSelectEnabled]);
     const [contentWidth, setContentWidth] = (0, import_react10.useState)(0);
-    const [portalContainer, setPortalContainer] = (0, import_react10.useState)(null);
+    const [inferredPortalContainer2, setInferredPortalContainer] = (0, import_react10.useState)(null);
     (0, import_react10.useLayoutEffect)(() => {
       if (anchorRef.current) {
         setContentWidth(anchorRef.current.offsetWidth);
-        setPortalContainer(
+        setInferredPortalContainer(
           anchorRef.current.closest("[role='dialog']") ?? null
         );
       }
@@ -1295,7 +1296,7 @@ var ComboboxRoot = (0, import_react10.forwardRef)(
       /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
         import_popovers.PopoverContent,
         {
-          container: portalContainer,
+          container: resolvedPortalContainer,
           side: "bottom",
           align: "start",
           sideOffset: 4,
@@ -1406,6 +1407,7 @@ var ComboboxOption = (0, import_react10.forwardRef)(function ComboboxOption2({ c
 ComboboxOption.displayName = OPTION_COMPONENT_NAME;
 ComboboxRoot.Option = ComboboxOption;
 var Option = ComboboxOption;
+var resolvedPortalContainer = portalContainer ?? inferredPortalContainer;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Checkbox,

package/dist/index.mjs

@@ -855,6 +855,7 @@ var ComboboxRoot = forwardRef6(
     contentClassName,
     listClassName,
     optionClassName,
+    portalContainer: portalContainer2,
     size = "default",
     width = "full",
     ...inputProps
@@ -970,11 +971,11 @@ var ComboboxRoot = forwardRef6(
       setActiveIndex((prev) => prev >= 0 ? prev : 0);
     }, [open, filteredOptions, singleSelectedValue, isMultiSelectEnabled]);
     const [contentWidth, setContentWidth] = useState3(0);
-    const [portalContainer, setPortalContainer] = useState3(null);
+    const [inferredPortalContainer2, setInferredPortalContainer] = useState3(null);
     useLayoutEffect(() => {
       if (anchorRef.current) {
         setContentWidth(anchorRef.current.offsetWidth);
-        setPortalContainer(
+        setInferredPortalContainer(
           anchorRef.current.closest("[role='dialog']") ?? null
         );
       }
@@ -1266,7 +1267,7 @@ var ComboboxRoot = forwardRef6(
       /* @__PURE__ */ jsx9(
         PopoverContent,
         {
-          container: portalContainer,
+          container: resolvedPortalContainer,
           side: "bottom",
           align: "start",
           sideOffset: 4,
@@ -1377,6 +1378,7 @@ var ComboboxOption = forwardRef6(function ComboboxOption2({ children, label, ...
 ComboboxOption.displayName = OPTION_COMPONENT_NAME;
 ComboboxRoot.Option = ComboboxOption;
 var Option = ComboboxOption;
+var resolvedPortalContainer = portalContainer ?? inferredPortalContainer;
 export {
   Checkbox,
   ComboboxRoot as Combobox,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@edux-design/forms",
-  "version": "0.0.17",
+  "version": "0.0.18",
   "sideEffects": [
     "**/*.css"
   ],