diff --git a/src/RootElementContext.ts b/src/RootElementContext.ts index b97b17796..b46573d38 100644 --- a/src/RootElementContext.ts +++ b/src/RootElementContext.ts @@ -12,9 +12,17 @@ import { createContext, use } from "react"; * * Element Call decorates this element with the theme, layout and background * attributes its stylesheets key off, and portals its modals into it. When - * Element Call owns the page this is simply the document body; when it is - * embedded in a host application it is the container the host mounted it into, - * so that Element Call does not reach outside its own subtree. + * Element Call owns the page this is simply the document body; the intent is + * that when embedded in a host application it becomes the container the host + * mounted it into, so that Element Call does not reach outside its own subtree. + * + * That intent is not yet achievable: several selectors still name `body` + * directly — `body[data-background="gradient"]` and `body[data-platform=…]` in + * `index.css`, and `body[data-platform="ios"]` in `AppBar.module.css` and + * `Modal.module.css` — and `Initializer.initBeforeReact` writes + * `data-platform` straight onto the body. So anything other than the body will + * be decorated correctly and styled incorrectly, silently. Until those are + * scoped, treat this as preparation rather than a working seam. */ const RootElementContext = createContext(null);