bs-chakra-ui 🚧

Bucklescript bindings for chakra-ui.

Important note, chakra-ui use the styled system but in order to avoid props bindings overhead, I decided to mainly use when I need to create space, etc.

Install

``
yarn add @colisweb/bs-chakra-ui
`

Add it to bs-dependencies in your bsconfig.json :

`json
{
"bs-dependencies": ["@colisweb/bs-chakra-ui"]
}
`

Example

`reason
open BsChakra;

module App = {
[@react.component]
let make = () => {
let (isChecked, setChecked) = React.useState(() => false);



center, right, left|])}>
"Hello responsive"->React.string

center spacing=2>

center)}>
"Toggle"->React.string


id="toggle"
size=lg
isChecked
onChange={_ => setChecked(v => !v)}
/>


};
};
`

$3

- [x] Accordion
- [x] Alert
- [ ] AspectRatioBox
- [x] Avatar
- [ ] Badge
- [x] Box 🚧
- [ ] Breadcrumb
- [x] Button 🚧
- [ ] Checkbox
- [x] CircularProgress
- [ ] CloseButton
- [ ] Code
- [ ] Collapse
- [ ] ControlBox
- [ ] Drawer
- [ ] Editable
- [x] Flex
- [x] FormControl
- [x] FormHelperText
- [x] FormErrorMessage
- [x] Heading
- [x] Icon
- [x] IconButton
- [x] Image
- [x] Input
- [x] Link
- [ ] List
- [x] Modal
- [x] Menu
- [x] NumberInput
- [ ] Popover
- [ ] Progress
- [ ] PseudoBox
- [ ] Radio
- [ ] Slider
- [x] Spinner
- [ ] Stat
- [x] Stack
- [x] Switch
- [ ] Tabs
- [ ] Tag
- [ ] Textarea
- [x] Text
- [ ] Toast
- [ ] Tooltip
- [x] useClipboard
- [x] useDisclosure
- [x] useTheme

Add Box and PseudoBox props automatically

$3

`reasonml
// use-make-box
[@bs.module "@chakra-ui/core"] [@react.component]
external make: (~some: bool=?) => React.element = "Tabs";

// use-makeProps-box
let makeProps = (~some: option(bool)=?) =>
makeProps(~some=?some->Belt.Option.map(v => true));
`

$3

`reasonml
// use-make-pseudoBox
[@bs.module "@chakra-ui/core"] [@react.component]
external make: (~some: bool=?) => React.element = "Tabs";

// use-makeProps-pseudoBox
let makeProps = (~some: option(bool)=?) =>
makeProps(~some=?some->Belt.Option.map(v => true));
`

$3

`bash
yarn tansform
``