# ziplabs-custom-react-cron

> Custom react component to generate cron expression

Latest version **3.2.0** (published 2020-05-27) · MIT license · 0 weekly downloads

## Install

```sh
npm install ziplabs-custom-react-cron
pnpm add ziplabs-custom-react-cron
yarn add ziplabs-custom-react-cron
bun add ziplabs-custom-react-cron
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 3.2.0 |
| Published | 2020-05-27 |
| First published | 2020-05-18 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 43.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Neeraja Anil |
| Maintainers | naanil |
| Keywords | Ziplabs Custom cron generator |

## Links

- npm: https://www.npmjs.com/package/ziplabs-custom-react-cron
- Repository: https://github.com/neerajaanil/scheduler
- Homepage: https://github.com/neerajaanil/scheduler#readme
- Issues: https://github.com/neerajaanil/scheduler/issues
- npm.io page: https://npm.io/package/ziplabs-custom-react-cron

## Dependencies (2)

- [cronstrue](https://npm.io/package/cronstrue.md) ^1.72.0
- [react-datepicker](https://npm.io/package/react-datepicker.md) ^2.8.0

## Alternatives

- [lodash.startswith](https://npm.io/package/lodash.startswith.md) — 769.7K weekly downloads
- [@tarojs/service](https://npm.io/package/@tarojs/service.md) — 33.9K weekly downloads
- [io.extendreality.tilia.indicators.spatialtargets.unity](https://npm.io/package/io.extendreality.tilia.indicators.spatialtargets.unity.md) — 131 weekly downloads
- [@rtarojs/taro](https://npm.io/package/@rtarojs/taro.md) — 90 weekly downloads
- [node-branch-io](https://npm.io/package/node-branch-io.md) — 50 weekly downloads

## Recent versions

- 3.2.0 (latest) — 2020-05-27
- 3.1.0 — 2020-05-26
- 3.0.0 — 2020-05-18
- 2.1.0 — 2020-05-18
- 2.0.0 — 2020-05-18
- 1.2.0 — 2020-05-18
- 1.1.2 — 2020-05-18

## README

# custom-react-cron

Simple customizable react component to generate cron expression

## Getting Started

Package helps to build linux customized scheduler cron expression.
Make sure you have include bootstrap in your project

```
data = '* * * * * * *'
```
```
npm install ziplabs-custom-react-cron

```
## demo
[Live demo](https://glivne-chewy.github.io/custom-react-cron/)

![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, { Component } from 'react'
import CustomCron from 'ziplabs-custom-react-cron'
import 'ziplabs-custom-react-cron/dist/cron-builder.css'


class App extends Component {

  constructor(props) {
      super(props);
      this.state = {
       
      };
      this.cronStyle = `
        .cron_builder {
          width: 90%;
        }

        .cron_builder_bordering {
          text-align: left;
        }

        .nav-tabs {
          border-bottom: 1px solid #ddd;
        }

        .tab-content>.active {
          display: block;
        }

        .row {
          margin-right: -15px;
          margin-left: -15px;
        }
      `
  }

  render() {
    return (<div>
      <CustomCron
        onChange={(e)=> {this.setState({value:e}); console.log(e)}}
        value={this.state.value}
        tabs={['Daily','Weekly', 'Monthly']}
        hours={2}
        minutes={15}
        style={this.cronStyle}
        showResultText={true}
        showResultCron={true}
        />
                            
    </div>)
  }
}

export default App;

```
## props

| Prop | Description | Default
| --- | --- | -- |
| value | cron expression  |  |
| onChange |  |  |
| tabs | set tabs list | ['Once', 'Minutes','Hourly','Daily','Weekly', 'Monthly'] |
| style | change style use existing classes: cron_builder, cron_builder_bordering, nav, nav-tabs, row, well, tab-content, active, col-md-6, col-sm-6 |  |
| hours | set hours leaps | 1 |
| minutes | set minutes leaps | 1 |
| showResultText | show in readable text format | false |
| showResultCron | show cron expression | false | 
## Acknowledgments
*cronstrue
*viswanath lakshmanan
*Guy Livne
https://github.com/glivne-chwy/custom-react-cron

---
_Source: https://npm.io/package/ziplabs-custom-react-cron · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._