0.1.0 • Published 1 year ago
frova-react-kit v0.1.0
frova-react-kit
A catalog of react components and custom hooks for easy the development of the UI
!WARNING This is a work in progress and not ready for production use yet.
Installation
!WARNING this package requires
react
andreact-dom
to be installed in your project. If you don't have them, you can install them withnpm install react react-dom
.
npm install frova-react-kit
Usage
DocumentMarkdown
import { DocumentMarkdown } from 'frova-react-kit';
const externalLink = https://gist.githubusercontent.com/FrovaHappy/58c836c7b48c4b2094f3037005c24b04/raw/exemple.md
const App = () => (
<DocumentMarkdown
articles={[
{
title: 'Hello Title',
sections: [
{
title: 'Hello Section 1',
url: externalLink,
space: 0,
},
],
},
]}
/>
);
Types
type Article = {
title: string
sections: Section[]
}
type Section = {
title: string
hashtag: string
url: string
space: number
}
section.space
: add a margin-left for show the hierarchy of the section
Props
articles
- Array of Article
Roadmap
!NOTE If you have any ideas or suggestions, please open an issue or a PR. I will be happy to discuss it with you.
Features
- useButton hook
- useSelect hook
- useInput hook
- useColorPicker hook
- useSwitch hook
documentMarkdown
remember active section position with url parametersdocumentMarkdown
add light and dark mode support
Ideas
- useCheckbox hook
- useFilePicker hook
- useTextarea hook
- useTabs hook
documentMarkdown
add a<tag />
rule for the markdown parse