lil ui

A set of very basic components for React projects.

Designed to be used out of the box or in DIY UI fashion with TailwindCSS or Styled components.

→ Demo and Documentation

Installation

yarn add lil-ui
npm install lil-ui

Components

• Modal
• Pane
• Button

Modal

Prop	Type	Default value	Options
show	boolean	false	true to show the modal false to hide the modal
children	string/component	-	Modal content can be passed as children
titleComponent	component	-	Custom component for modal heading
backdropComponent	component	-	Custom component for modal backdrop
title	string	-	Modal title
onClose	function	-	Function to run when modal closes
hideBackdrop	boolean	-	Set to true to have transparent backdrop
modalWidth	string	500px	Set custom width for modal, e.g 600px

Pane

Prop	Type	Default value	Options
show	boolean	false	true to show the modal false to hide the modal
children	string/component	-	Modal content can be passed as children
titleComponent	component	-	Custom component for modal heading
backdropComponent	component	-	Custom component for modal backdrop
title	string	-	Modal title
onClose	function	-	Function to run when modal closes
hideBackdrop	boolean	-	Set to true to have transparent backdrop
paneWidth	string	500px	Set custom width for modal, e.g 600px
position	string	-	Set left to show pane from left

Button

Prop	Type	Default value	Options
className	string	-	Custom class names for button tag
onClick	function	-	A function that's called when button is clicked
style	object	-	Object of inline styles to apply on button tag
children	string/component	-	Label for the button