Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/rescript-react-native/checkbox
ReScript bindings for @react-native-community/checkbox
https://github.com/rescript-react-native/checkbox
checkbox react react-native rescript rescript-react rescript-react-native
Last synced: about 1 month ago
JSON representation
ReScript bindings for @react-native-community/checkbox
- Host: GitHub
- URL: https://github.com/rescript-react-native/checkbox
- Owner: rescript-react-native
- License: mit
- Created: 2019-09-03T06:58:59.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2023-02-09T07:13:54.000Z (almost 2 years ago)
- Last Synced: 2024-10-11T14:07:38.626Z (2 months ago)
- Topics: checkbox, react, react-native, rescript, rescript-react, rescript-react-native
- Language: ReScript
- Homepage:
- Size: 938 KB
- Stars: 4
- Watchers: 4
- Forks: 3
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# `@rescript-react-native/checkbox`
[](https://github.com/rescript-react-native/checkbox/actions)
[](https://www.npmjs.com/@rescript-react-native/checkbox)
[](https://forum.rescript-lang.org/)
[ReScript](https://rescript-lang.org) bindings for
[`@react-native-community/react-native-checkbox`](https://github.com/react-native-checkbox/react-native-checkbox).
The module will be exposed as `ReactNativeCheckbox`.
Version x.y.z of `@rescript-react-native/checkbox` is intended to be compatible
with version x.y.z of `@react-native-community/react-native-checkbox`.
## Installation
When
[`@react-native-community/react-native-checkbox`](https://github.com/react-native-checkbox/react-native-checkbox)
is properly installed & configured by following their installation instructions,
you can install the bindings:
```console
npm install @rescript-react-native/checkbox
# or
yarn add @rescript-react-native/checkbox
```
`@rescript-react-native/checkbox` should be added to `bs-dependencies` in your
`bsconfig.json`. For example,
```diff
{
//...
"bs-dependencies": [
"@rescript/react",
"rescript-react-native",
// ...
+ "@rescript-react-native/checkbox"
],
//...
}
```
## Usage
### Types
#### `CheckBoxEvent.t`
Assuming `checkboxEvent` is `CheckBoxEvent.t`, you can access
```rescript
checkboxEvent.nativeEvent.target // => int
checkboxEvent.nativeEvent.value // => bool
```
`value` represents value of the checkbox as updated by the event.
#### `element`
Type to be used in `ref` and with `NativeMethods`, as with other components in
React Native bindings.
#### `ref`
is an alias for `React.Ref.t(Js.nullable(element))`.
### CheckBox common props
All props are optional.
#### `value: bool`
Value of the checkbox. When `true`, checkbox will be checked. Default value is
`false`.
#### `onChange: checkBoxEvent => unit`
Returns a [native event](#checkBoxEvent).
#### `onValueChange`
Returns the new `bool` value.
#### `testID: string`
Used to locate this view in end-to-end tests.
### CheckBox Android props
#### `disabled: bool`
When `true`, user will not be able to toggle the checkbox. Default value is
`false`.
#### `tintColors`
```rescript
tintColors:
(~_true: int=?, ~_false: int=?, unit) => tintColors
```
Value for `_true` will be used when the checkbox is checked, and value for
`_false` will be used when it is not checked.
### CheckBox iOS props
#### `lineWidth: float`
The width of the lines of the check mark and box. Defaults to `2.0`.
#### `hideBox: bool`
Control if the box should be hidden or not. Defaults to `false`
#### `` boxType: `circle or `square ``
The type of box to use. Defaults to `` `circle ``
#### `tintColor: Color.t`
The color of the box when the checkbox is Off. Defaults to `#aaaaaa`
#### `onCheckColor: Color.t`
The color of the check mark when it is On. Defaults to `#007aff`
#### `onFillColor: Color.t`
The color of the inside of the box when it is On. Defaults to transparent
#### `onTintColor: Color.t`
The color of the line around the box when it is On. Defaults to `#007aff`
#### `animationDuration: float`
The duration in seconds of the animations. Defaults to 0.5
#### `` onAnimationType: `stroke or `fill or `bounce or `flat or `oneStroke or `fade ``
The type of animation to use when the checkbox gets checked. Defaults to
`` `stroke ``
#### `` offAnimationType: `stroke or `fill or `bounce or `flat or `oneStroke or `fade ``
The type of animation to use when the checkbox gets unchecked. Defaults to
`` `stroke ``
### `View` props
Refer to
[`rescript-react-native`](https://github.com/rescript-react-native/react-native)
[documentation](https://rescript-react-native.github.io/en/docs/components/View/).
---
## Changelog
Check the [changelog](./CHANGELOG.md) for more information about recent
releases.
## Contribute
Read the [contribution guidelines](https://github.com/rescript-react-native/.github/blob/master/CONTRIBUTING.md) before contributing.
## Code of Conduct
We want this community to be friendly and respectful to each other. Please read
[our full code of conduct](https://github.com/rescript-react-native/.github/blob/master/CODE_OF_CONDUCT.md) so that you can understand what
actions will and will not be tolerated.