UNPKG

react-cron-generator

Version:
110 lines (72 loc) 3.25 kB
# react-cron-generator Simple react component to generate cron expression ## Getting Started Package helps to build linux scheduler cron expression. [![npm version](https://badge.fury.io/js/react-cron-generator.svg)](https://badge.fury.io/js/react-cron-generator) ![Downloads](https://img.shields.io/npm/dm/react-cron-generator.svg) <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/) ![alt text](https://raw.githubusercontent.com/sojinantony01/react-cron-generator/master/public/images/Screenshot%20from%202019-06-08%2000-31-31.png) ![alt text](https://raw.githubusercontent.com/sojinantony01/react-cron-generator/master/public/images/Screenshot%20from%202019-06-08%2000-31-57.png) ``` 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) [!["Buy Me A Coffee"](https://www.buymeacoffee.com/assets/img/guidelines/download-assets-sm-1.svg)](https://www.buymeacoffee.com/sojinantony) ## Acknowledgments **cronstrue** [Viswanath Lekshmanan](https://viswanathl.in/)