0.1.1 • Published 8 months ago
@abundiko/rn-dialog v0.1.1
Simple Dialog
Usage
Wrap your app root in DialogProvider
import DialogProvider from "@/lib/dialog";
<DialogProvider>// ...the rest of your app</DialogProvider>;
Create and export your DialogComponent
from maybe /components/dialogs
import { View, Text, Button } from "react-native";
import React from "react";
import { Dialog, DialogController } from "@/lib/dialog";
export default function DialogComponent({
controller,
}: {
controller: DialogController;
}) {
return (
<Dialog.Root controller={controller} closeOnOutsidePress>
<Dialog.Content>
<View style={{ height: 300, width: 280, padding: 20 }}>
<Text>TestDialog</Text>
<Button title="wow" />
</View>
</Dialog.Content>
</Dialog.Root>
);
}
Use the useDialog
hook to control your dialog
const dialog = useDialog((d) => <DialogComponent controller={d} />);
// you can use methods like
dialog.open();
dialog.close();