fix(messaging-ui): portal compose modal to <body> so it renders above host chrome

A host wrapper like .view{position:relative;z-index:1} creates a stacking context that traps the modal's fixed overlay below a sibling sticky header, no matter its z-index. Render the modal through a ModalPortal (createPortal to document.body) so it escapes the host stacking context + overflow entirely; the portal root copies the SDK theme tokens from the live surface (synchronously, no unstyled paint) and carries dark defaults as a fallback. Adds react-dom peer dep. 67 tests green. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-22 18:19:25 +05:30
parent f16d7986c7
commit 9882177c59
6 changed files with 60 additions and 5 deletions
@@ -37,8 +37,9 @@
    "test": "vitest run"
  },
  "peerDependencies": {
+    "@insignia/iios-kernel-client": "*",
    "react": ">=18",
-    "@insignia/iios-kernel-client": "*"
+    "react-dom": ">=18"
  },
  "peerDependenciesMeta": {
    "@insignia/iios-kernel-client": {
@@ -50,6 +51,7 @@
    "@testing-library/dom": "^10.4.0",
    "@testing-library/react": "^16.1.0",
    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
    "jsdom": "^26.0.0",
    "react": "^19.0.0",
    "react-dom": "^19.0.0",