react-jewish-datepicker

React Jewish Date Picker

Общий компонент выбора еврейской даты, который работает с React и поддерживает иврит и английский.

Смотрите также страницу демо и документации.

Установка

yarn add react-jewish-datepicker

Или с помощью npm

npm install react-jewish-datepicker --save

Импортируйте css

import "react-jewish-datepicker/dist/index.css";

@import url("react-jewish-datepicker/dist/index.css");

Использование

#### Пример на TypeScript:

import * as React from "react";
import {
  ReactJewishDatePicker,
  BasicJewishDay,
  BasicJewishDate
} from "react-jewish-datepicker";
import "react-jewish-datepicker/dist/index.css";
import {
  JewishMonth,
} from "jewish-dates-core";
export default function App() {
  const [basicJewishDay, setBasicJewishDay] = React.useState();
  const basicJewishDate: BasicJewishDate = {
    day: 13,
    monthName: JewishMonth.Elul,
    year: 5788
  };
  return (
    <>
      

        Hebrew:
         {
            setBasicJewishDay(day);
          }}
        />
      
    
  );
}

#### JavaScript example:

import * as React from "react";
import { ReactJewishDatePicker, BasicJewishDay } from "react-jewish-datepicker";
import "react-jewish-datepicker/dist/index.css";
export default function App() {
  const [basicJewishDay, setBasicJewishDay] = React.useState();
  return (
     {
        setBasicJewishDay(day);
      }}
    />
  );
}

props

| Имя свойства | Описание | Типы значений | | ------------ | ------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------ | | canSelect | Принимает функцию, определяющую, можно ли выбрать день | (day: BasicJewishDay) => condition ? false : true | | isHebrew | Необязательно. Язык отображения: иврит или английский. По умолчанию false| false \| true | | isRange | Необязательно. Позволяет выбирать диапазоны дат. По умолчанию false | false \| true | | onClick | Колбэк при выборе даты | (day: BasicJewishDay) => console.log(day) \| (startDay: BasicJewishDay, endDay: BasicJewishDay) => console.log(startDay, endDay) | | value | Необязательно. Начальная выбранная дата | Date \| BasicJewishDate \| BasicJewishDateRange \| DateRange |

Свойство canSelect

Свойство canSelect может принимать либо пользовательскую функцию, либо одну из встроенных функций, как указано ниже.

#### dontSelectHolidays([isIsrael: boolean]) ⇒ (day: BasicJewishDay) => boolean

Принимает параметр isIsrael и возвращает функцию, которую затем передают в свойство canSelect для запрета выбора праздничных дней (в соответствии с параметром isIsrael).

| Параметр | Тип | По умолчанию | | -------- | -------- | ------------ | | isIsrael | boolean| false |

См. пример здесь

#### dontSelectShabat(day: BasicJewishDay) ⇒ boolean

Функция, которую можно передать в свойство canSelect для запрета выбора шаббата.

См. пример здесь

#### dontSelectShabatAndHolidays([isIsrael: boolean]) ⇒ (day: BasicJewishDay) => boolean

Принимает параметр isIsrael и возвращает функцию для передачи в свойство "canSelect". Объединяет dontSelectHolidays и dontSelectShabat, чтобы запретить выбор как шаббата, так и праздничных дней.

| Параметр | Тип | По умолчанию | | -------- | -------- | ------------ | | isIsrael | boolean| false |

См. пример здесь

#### dontSelectOutOfRange(minDate: Date | null, maxDate: Date | null) ⇒ (day: BasicJewishDay) => boolean

Принимает минимальную и максимальную дату и возвращает функцию, которую нужно передать в пропс "canSelect", чтобы запретить выбор дат вне указанного диапазона.

Можно передать дату только для одного из параметров, а другому — null. В этом случае диапазон выбора будет до максимальной даты или от минимальной даты.

| Параметр | Тип | | -------- | ------ | | minDate | Date \| null | | maxDate | Date \| null |

См. пример здесь

Вспомогательные функции

#### addDates(date: BasicJewishDate | Date, numDays: number) ⇒ Date

вспомогательная функция для dontSelectOutOfRange.

Принимает объект BasicJewishDate или Date, добавляет к дате интервал (numDays) и возвращает новую дату.

| Параметр | Тип | | -------- | ------ | | date | BasicJewishDate \| Date | | numDays | number |

См. пример здесь

#### subtractDates(date: BasicJewishDate | Date, numDays: number) ⇒ Date

вспомогательная функция для dontSelectOutOfRange.

Принимает объект BasicJewishDate или Date, вычитает из даты интервал (numDays) и возвращает новую дату.

| Параметр | Тип | | -------- | ------ | | date | BasicJewishDate \| Date | | numDays | number |

См. пример здесь

jewish-dates-core

Чтобы создать еврейский выбор даты во vue.js или angular, смотрите нашу основную зависимость.

jewish-date

Если вам нужен только конвертер еврейских дат без выбора даты, вы можете использовать jewish-date.

Участники

• Шмулик Кравиц
• Саги Тавил
• Йоханан Шейнбергер