useUI is a React library offering a suite of components and hooks that simplify app development. Access to components is provided through hooks, enabling the encapsulation of complex logic and state management internally, without dictating their appearance. This approach grants developers the freedom to style, while still providing a robust and flexible functionality for creating unique user interfaces 😎.
useModal
useToast
import { useModal, useButton, Modal } from 'useui-ts'
function Component() {
const modal = useModal();
return (
<div>
<button onClick={() => modal.open("first-modal", {
size: "sm",
title: "Are you sure?",
content: (
<div>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Nesciunt
nulla rerum voluptatibus provident deserunt.
</div>
),
bottomNavigationBar: {
justifyBetween: true,
items: [
<ConfirmButton {...confirmProps}>Send</SendButton>,
<CancelButton onClick={() => modal.close("first-modal")}>Cancel</button>,
],
},
})}>Open Modal</button>
</div>
)
}
// Insert Modal component in App component
function App() {
return (
<div>
<Modal />
</div>
)
}
npm install --save useui-ts