react-jewish-datepicker

Pemilih Tanggal Yahudi React

Komponen Pemilih Tanggal Yahudi umum yang bekerja dengan react dan mendukung bahasa Ibrani dan Inggris.

Lihat juga halaman demo dan dokumentasi.

Instalasi

yarn add react-jewish-datepicker

Atau dengan npm

npm install react-jewish-datepicker --save

Impor css-nya

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

atau dengan css

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

Penggunaan

#### Contoh 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

| Nama Prop | Deskripsi | Tipe Nilai | | ---------- | --------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------ | | canSelect | Menerima fungsi yang menentukan apakah suatu hari dapat dipilih | (day: BasicJewishDay) => condition ? false : true | | isHebrew | Opsional. Apakah bahasa tampilan adalah Ibrani atau Inggris, default false| false \| true | | isRange | Opsional. Mengizinkan pemilihan rentang tanggal. Default false | false \| true | | onClick | Callback saat tanggal dipilih | (day: BasicJewishDay) => console.log(day) \| (startDay: BasicJewishDay, endDay: BasicJewishDay) => console.log(startDay, endDay) | | value | Opsional. Tanggal awal yang dipilih | Date \| BasicJewishDate \| BasicJewishDateRange \| DateRange |

Properti canSelect

Properti canSelect dapat menerima baik fungsi khusus atau salah satu fungsi bawaan berikut.

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

Menerima parameter isIsrael dan mengembalikan fungsi yang kemudian diberikan ke properti canSelect, untuk mencegah pemilihan hari libur (sesuai parameter isIsrael).

| Parameter | Tipe | Default | | --------- | -------- | ------- | | isIsrael | boolean| false |

Lihat contoh di sini

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

Fungsi yang diberikan ke properti canSelect, untuk mencegah pemilihan hari Sabat.

Lihat contoh di sini

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

Menerima parameter isIsrael dan mengembalikan fungsi yang diberikan ke properti "canSelect". Menggabungkan dontSelectHolidays dan dontSelectShabat untuk mencegah pemilihan hari Sabat dan hari libur.

| Parameter | Tipe | Default | | --------- | -------- | ------- | | isIsrael | boolean| false |

Lihat contoh di sini

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

Mengambil tanggal minimum dan maksimum, lalu mengembalikan sebuah fungsi yang dapat diberikan ke prop "canSelect", untuk mencegah pemilihan di luar rentang yang diberikan.

Anda dapat memberikan tanggal hanya pada salah satu parameter dan null pada yang lain. Dalam kasus ini, rentang yang dapat dipilih adalah hingga tanggal maksimum atau dari tanggal minimum.

| Parameter | Tipe | | --------- | ------ | | minDate | Date \| null | | maxDate | Date \| null |

Lihat contoh di sini

Fungsi Pembantu

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

sebuah fungsi pembantu untuk dontSelectOutOfRange.

Mengambil objek BasicJewishDate atau Date, menambahkan interval tanggal (numDays) ke tanggal tersebut dan kemudian mengembalikan tanggal baru.

| Parameter | Tipe | | --------- | ------ | | date | BasicJewishDate \| Date | | numDays | number |

Lihat contoh di sini

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

sebuah fungsi pembantu untuk dontSelectOutOfRange.

Mengambil objek BasicJewishDate atau Date, mengurangi interval tanggal (numDays) dari tanggal tersebut dan kemudian mengembalikan tanggal baru.

| Parameter | Tipe | | --------- | ------ | | date | BasicJewishDate \| Date | | numDays | number |

Lihat contoh di sini

jewish-dates-core

Untuk membuat pemilih tanggal Yahudi di vue.js atau angular, lihat dependensi inti kami.

jewish-date

Jika Anda hanya membutuhkan konverter tanggal Ibrani tanpa pemilih tanggal, Anda dapat menggunakan jewish-date.

Kontributor

• Shmulik Kravitz
• Sagi Tawil
• Yochanan Sheinberger