@ridafkih/portalgun
v0.2.0
Published
<div align="center"> <h1>PortalGun</h1> <p>Create easy-to-use portals in React & React Native.</p> <p>This is PortalGun, an easy-to-use portal library that allows you to create portals, and render elements anywhere within your DOM under the `PortalG
Downloads
308
Readme
Installation
To install @ridafkih/portalgun
, simply use your favourite Node.js package manager.
yarn add @ridafkih/portalgun
npm install @ridafkih/portalgun
Usage
// ...
import { PortalGunProvider, createPortal } from "@ridafkih/portalgun";
const MyPortal = createPortal("unique-key");
const MyComponent = () => {
const [value, setValue] = useState<boolean>(true);
const text = value ? "Yay, value is true!" : "Unfortunately, value is false.";
return (
{/** Anything that goes in here will render in all corresponding `MyPortal.Out` */}
<MyPortal.In>
<Text>{text}</Text>
</MyPortal.In>
);
};
export const MyApp = () => {
return (
<PortalGunProvider>
{/** This contains is defined above, and contains our `MyPortal.In` */}
<MyComponent />
{/** Content of `MyPortal.In` will display here. */}
<MyPortal.Out />
</PortalGunProvider>
);
};
Contribute
Feel free to contribute to the repository. Pull requests and issues with feature requests are super welcome!