https://github.com/shakogegia/recompose-utils
Utilities for React Recompose
https://github.com/shakogegia/recompose-utils
react react-native reactjs recompose
Last synced: 2 months ago
JSON representation
Utilities for React Recompose
- Host: GitHub
- URL: https://github.com/shakogegia/recompose-utils
- Owner: shakogegia
- License: mit
- Created: 2018-07-23T20:05:35.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2018-11-15T08:28:33.000Z (over 7 years ago)
- Last Synced: 2025-05-30T19:48:17.106Z (about 1 year ago)
- Topics: react, react-native, reactjs, recompose
- Language: JavaScript
- Size: 48.8 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Recompose utilities
`withEvents`, `withValidation` for react recompose
install
```
npm i recompose-utils
```
or
```
yarn add recompose-utils
```
### withEvents
import withEvents
```js
import { withEvents } from "recompose-utils"
```
and than you have emmiters and handlers
you can pass `withEvents` to composed component where you want to emitt event
```jsx
withEvents({
emitters: ['toggleAuthModal'],
}),
```
now you have `emitters` prop to your component and you can fire event like this
```jsx
props.emitters.toggleAuthModal('hi from here') }>
fire event
```
and you pass `withEvents` to composed component where you want to listen to that event
```jsx
withEvents({
handlers: {
toggleAuthModal: (props) => (event) => {
console.log("event:: toggleAuthModal -fired with data::", event)
},
},
}),
```
### withValidation
import withValidation
```jsx
import { withValidation } from recompose-utils
```
you can pass `withValidation` to composed component with wurles
```jsx
withValidation({
name: {
rules: "required",
messages: {
required: "This field is required"
}
},
email: {
rules: 'require|email',
messages: {
require: "This field is required",
email: "Please, fill with valid email"
}
},
}),
```
and you can validate you form like
```jsx
withHandlers({
handleSave: (props) => () => {
const isValid = validate(props.formData) // returnes true or false
},
}),
```
and you can access your errored filds in `errors` props
error props would be something like this
```jsx
errors: {
name: "",
email: "Please, fill with valid email"
}
```