react-cron-generator
Version:
Simple react component to generate cron expression
110 lines (72 loc) • 3.25 kB
Markdown
# react-cron-generator
Simple react component to generate cron expression
## Getting Started
Package helps to build linux scheduler cron expression.
[](https://badge.fury.io/js/react-cron-generator) 
<a href="https://github.com/sojinantony01/react-spread-sheet/blob/main/LICENSE">
<img src="https://img.shields.io/npm/l/react-cron-generator.svg" alt="license">
</a> <span>E2E tests passing.</span>
```
data = '* * * * * * *'
```
```
npm install react-cron-generator
```
## demo
[Live demo](https://sojinantony01.github.io/react-cron-generator/)


```
import React, { useState } from 'react'
import Cron from 'react-cron-generator'
import 'react-cron-generator/dist/cron-builder.css'
const App = () => {
const [state, setState] = useState<State>({});
return (
<Cron
onChange={(e, text) => {
setState({ value: e });
}}
value={state.value}
showResultText={true}
showResultCron={true}
/>
);
};
export default App;
```
## props
| Prop | Description | Default | Mandatory
| --- | --- | -- | -- |
| value | cron expression | | No |
| onChange | have 2 arguments, 1st is cron value and 2nd is cron result text from cronstrue | | Yes
| showResultText | show in readable text format | false | No
| showResultCron | show cron expression | false | No
| translateFn | translate function callback | method | No
| locale | locale for cronstrue | en | No
| options | Options for Cron component, *Must pass a valid cron value for available headers | All available headers | No
| disabled | Disable cron selector | false | No
**translateFn**
Expects a method. Use this prop for localization support. `react-cron-generator` will call this method for every key. List of keys are available [here](https://github.com/sojinantony01/react-cron-generator/tree/master/src/lib/localization/translation.json)
`locale` option should be set for correct `ResultText` translation. Please visit [cronstrue](https://github.com/bradymholt/cRonstrue) for supported locales.
## Options
**options.headers**
```
import { HEADER } from 'react-cron-generator';
const options = {
headers: [HEADER.MONTHLY, HEADER.WEEKLY, HEADER.MINUTES, HEADER.HOURLY, HEADER.DAILY, HEADER.CUSTOM]
};
```
## Importables
Cron - The react Cron component. - Default
CronProp - Cron component types.
cronsture - Cronsture/i18 - [cronstrue](https://www.npmjs.com/package/cronstrue)
## Release notes 2.x.x
1. Build Procedure updated
2. Updated to latest react(18)
3. Migrated to hooks and typescript
[Sojin Antony](https://github.com/sojinantony01)
[](https://www.buymeacoffee.com/sojinantony)
## Acknowledgments
**cronstrue**
[Viswanath Lekshmanan](https://viswanathl.in/)