@os-design/core 1.0.275 → 1.0.277

package/dist/Popover/index.d.ts

@@ -12,7 +12,7 @@ export interface PopoverProps extends JsxDivProps, WithSize {
      * Where the popover will be rendered.
      * @default document.body
      */
-    container?: Element | RefObject<Element>;
+    container?: RefObject<Element> | Element | null;
     /**
      * On which side of the element the popover will appear.
      * @default top

package/dist/Popover/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Popover/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAc,KAAK,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAW9D,OAAO,EAGL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AACf,OAA2B,EACzB,KAAK,SAAS,EACd,KAAK,IAAI,EACV,MAAM,+BAA+B,CAAC;AAEvC,KAAK,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC;AAC7D,MAAM,WAAW,YAAa,SAAQ,WAAW,EAAE,QAAQ;IACzD;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC,OAAO,CAAC,CAAC;IACzC;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAuDD;;GAEG;AACH,QAAA,MAAM,OAAO,yGAyHZ,CAAC;AAIF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Popover/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAc,KAAK,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAW9D,OAAO,EAGL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AACf,OAA2B,EACzB,KAAK,SAAS,EACd,KAAK,IAAI,EACV,MAAM,+BAA+B,CAAC;AAEvC,KAAK,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC;AAC7D,MAAM,WAAW,YAAa,SAAQ,WAAW,EAAE,QAAQ;IACzD;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,GAAG,OAAO,GAAG,IAAI,CAAC;IAChD;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAuDD;;GAEG;AACH,QAAA,MAAM,OAAO,yGAkIZ,CAAC;AAIF,eAAe,OAAO,CAAC"}

package/dist/Popover/index.js

@@ -88,9 +88,17 @@ const Popover = /*#__PURE__*/forwardRef(({
         current
       } = trigger;
       if (!current) return;
-      setTriggerRect(current.getBoundingClientRect());
+      const rect = current.getBoundingClientRect();
+      if (container) {
+        const containerElement = container instanceof Element ? container : container.current;
+        if (!containerElement) return;
+        const containerRect = containerElement.getBoundingClientRect();
+        rect.x -= containerRect.x;
+        rect.y -= containerRect.y;
+      }
+      setTriggerRect(rect);
     });
-  }, [trigger]);
+  }, [container, trigger]);
   useBrowserLayoutEffect(() => {
     if (!visible) return;
     triggerResizeListener();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@os-design/core",
-  "version": "1.0.275",
+  "version": "1.0.277",
   "license": "UNLICENSED",
   "repository": "git@gitlab.com:os-team/libs/os-design.git",
   "type": "module",
@@ -35,7 +35,7 @@
     "@os-design/input-password-utils": "^1.0.3",
     "@os-design/media": "^1.0.32",
     "@os-design/menu-utils": "^1.0.28",
-    "@os-design/portal": "^1.0.24",
+    "@os-design/portal": "^1.0.25",
     "@os-design/styles": "^1.0.65",
     "@os-design/theming": "^1.0.61",
     "@os-design/time-picker-utils": "^1.0.23",
@@ -58,5 +58,5 @@
     "react": "18",
     "react-dom": "18"
   },
-  "gitHead": "e1cbe449b6d5a1a332544498b99421c9949fba20"
+  "gitHead": "73c07308561addb0b095734a9a9bd3e3a773fa61"
 }

package/src/Popover/index.tsx

@@ -37,7 +37,7 @@ export interface PopoverProps extends JsxDivProps, WithSize {
    * Where the popover will be rendered.
    * @default document.body
    */
-  container?: Element | RefObject<Element>;
+  container?: RefObject<Element> | Element | null;
   /**
    * On which side of the element the popover will appear.
    * @default top
@@ -169,9 +169,18 @@ const Popover = forwardRef<HTMLDivElement, PopoverProps>(
         if (!trigger) return;
         const { current } = trigger as RefObject<Element>;
         if (!current) return;
-        setTriggerRect(current.getBoundingClientRect());
+        const rect = current.getBoundingClientRect();
+        if (container) {
+          const containerElement =
+            container instanceof Element ? container : container.current;
+          if (!containerElement) return;
+          const containerRect = containerElement.getBoundingClientRect();
+          rect.x -= containerRect.x;
+          rect.y -= containerRect.y;
+        }
+        setTriggerRect(rect);
       });
-    }, [trigger]);
+    }, [container, trigger]);
     useBrowserLayoutEffect(() => {
       if (!visible) return;
       triggerResizeListener();