first commit

This commit is contained in:
Stefan Hacker
2026-04-03 09:38:48 +02:00
commit 37ad745546
47450 changed files with 3120798 additions and 0 deletions
+34
View File
@@ -0,0 +1,34 @@
# @fluentui/react-window-provider
A set of utilities for providing and consuming the `window` and `document` references in a contextual scope.
## Why is this needed?
When rendering on the main browser window, many components need access to `window` or `document` for applying styling, listening for events, or measuring things. However it is possible to render to child windows and elements hosted in `iframe` elements.
In these cases, the target element is hosted in a different context, and thus have a different `window` reference. To aid in providing components with the correct instances of `window` or `document`, React context can be used to provide the tree of React components with the correct instance.
## Usage
To consume the window or document object, call `useWindow` or `useDocument` respectively:
```jsx
const Foo = () => {
const win = useWindow();
const doc = useDocument();
return </>
}
```
To provide a new window other than the default, wrap your app in the `WindowProvider` to override the defaults contextually:
```jsx
import { createRoot } from 'react-dom/client';
createRoot(childWindowElement).render(
<WindowProvider window={childWindow}>
<...>
</WindowProvider>,
);
```