# @react-lit/portal

> Appends a new DOM node to the end of the `document.body` and renders it's child React tree into it. Useful to break out of the DOM hierarchy to prevent parent styles from clipping or disturbing content (e.g. popovers, dropdowns and modals).

Latest version **0.7.0** (published 2023-10-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install @react-lit/portal
pnpm add @react-lit/portal
yarn add @react-lit/portal
bun add @react-lit/portal
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.7.0 |
| Published | 2023-10-03 |
| First published | 2021-10-30 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >=16.0.0 |
| Dependencies | 1 |
| Unpacked size | 5.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Joel Voss |
| Maintainers | joelvoss |

## Links

- npm: https://www.npmjs.com/package/@react-lit/portal
- Repository: https://github.com/joelvoss/react-lit-portal
- Homepage: https://github.com/joelvoss/react-lit-portal#readme
- Issues: https://github.com/joelvoss/react-lit-portal/issues
- npm.io page: https://npm.io/package/@react-lit/portal

## Dependencies (1)

- [@react-lit/helper](https://npm.io/package/@react-lit/helper.md) ^0.7.3

## Recent versions

- 0.7.0 (latest) — 2023-10-03
- 0.6.0 — 2023-08-09
- 0.5.0 — 2022-09-10
- 0.4.1 — 2022-07-24
- 0.4.0 — 2022-07-24
- 0.3.1 — 2022-04-21
- 0.3.0 — 2022-01-20
- 0.2.0 — 2022-01-17
- 0.1.2 — 2021-12-09
- 0.1.1 — 2021-12-01
- 0.1.0 — 2021-10-30

## README

# @react-lit/portal

Appends a new DOM node to the end of the `document.body` and renders it's
child React tree into it. Useful to break out of the DOM hierarchy to prevent
parent styles from clipping or disturbing content (e.g. popovers, dropdowns
and modals).

## Installation

```bash
$ npm i @react-lit/portal
# or
$ yarn add @react-lit/portal
```

## Example

```js
import * as React from 'react';
import { Portal } from "@react-lit/portal";

function Example() {
  return (
    <Portal>
      <div>I'm inside a portal!</div>
    </Portal>
  );
}
```

## Development

(1) Install dependencies

```bash
$ npm i
# or
$ yarn
```

(2) Run initial validation

```bash
$ ./Taskfile.sh validate
```

(3) Run tests in watch-mode to validate functionality.

```bash
$ ./Taskfile test -w
```

---

_This project was set up by @jvdx/core_

---
_Source: https://npm.io/package/@react-lit/portal · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._