Introduction

This scheduler component support Daily, Weekly, Monthly Schedul

Installing

To use just need to:

npm i @peritos-solutions/react-native-scheduler-component

OR

yarn add @peritos-solutions/react-native-scheduler-component

Example

import SchedulerComponent from "@peritos-solutions/react-native-scheduler-component";

const formData = {
  startDate: "DD MMM YYYY",
  fromTime: "hh:mm a",
  toTime: "hh:mm a",
  every: "",
  end: "",
  endDate: "DD MMM YYYY",
  endAfter: "10",
  selectedOnRadio: "onDay",
  on: "First",
  on0: "1",
  onDay: "Sunday",
  weekList: [
    { week: "S" },
    { week: "M" },
    { week: "T" },
    { week: "W" },
    { week: "T" },
    { week: "F" },
    { week: "S" },
  ],
};

<SchedulerComponent
  onPressModalClose={() => onPressPickerClose()}
  onPressPickerShow={(type) => onPressPickerShow(type)}
  modalVisible={true}
  onPressDateSave={() => onPressPickerShow()}
  onSelect={(type, value) => onChangeValue(type, value)}
  formData={formData}
  switchValue={{ value: true, type: "Daily" }} // you can use type Weekly, Daily
  onSwitchChange={(value, type) => onSwitchChange(value, type)}
  showSwitch={true}
  disableInputs={disableInputs}
  textColor={{ color: colors.textColor }}
  showSwitchItems={{
    daily: { status: true, text: "Every Day" },
    weekly: { status: true, text: "Weekly" },
    monthly: { status: true, text: "Monthly" },
    hourly: { status: true, text: "Every Hour" },
    oneTime: { status: true, text: "One Time" },
  }} // If you not add showSwitchItems it will showing all default item, if condition is false then particular item will be hidden
></SchedulerComponent>;

Props

| Prop | Description | Default | Type | | -------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------- | ------- | | formData | { startValue: "DD MMM YYYY", fromValue: "hh:mm a", toValue: "hh:mm a", everyValue: "", endValue: "", endValue1: "DD MMM YYYY", weekList: [ { week: "S" }, { week: "M" }, { week: "T" }, { week: "W" }, { week: "T" }, { week: "F" }, { week: "S" }, ],} | - | object | | modalVisible | enable or disable date picker modal etc | false | boolean | | showSwitch | enable or disable all day, week, month switch | true | boolean | | showSwitchItem | enable or disable all day, week, month switc | { daily: true, weekly: true, monthly: true } | object | | switchValue | Switch value help to detect which switch is active | { value: true, type: "Daily" } | object |