Навігація прокручуванням · Без залежностей · TypeScript

JavaScript-компонент для вибору дат із прокручуванням

Легкий JavaScript-компонент для вибору однієї дати, діапазону, кількох дат і часу.

Природне прокручування коліщатком миші, трекпадом або дотиком. Працює у спливному та вбудованому режимах. Без React, Vue і date-бібліотек.

MIT · ~14 KB gzip · Працює з будь-яким стеком

new RollDate('#cal', { theme: 'main' })

~14 KBgzip JS

0залежностей

3режими вибору

3теми

TSвизначення

MITліцензія

Чому RollDate

Навігація прокручуванням замість постійного перемикання місяців

Прокручуйте дні, місяці й роки коліщатком миші або дотиком. На підтримуваних пристроях можна ввімкнути тактильний відгук.

Один компонент вибору дати для всіх режимів. Додатково — вибір часу у форматі 12h/24h, збоку або знизу.

Підключаєте JS + CSS. Без Moment, Day.js, React чи UI-кітів. Визначення TypeScript уже в пакеті.

Можливості

Підсвічені датиКрапки-маркери, кілька кольорів на день
Пресети діапазонівШвидкі фільтри відносно видимого місяця
ЛокалізаціяВласні назви місяців/днів тижня і формати локалі
Три темиMain, dark і light — без окремого CSS-фреймворка
Спливний або вбудований режимДо поля введення або всередині будь-якого контейнера
Runtime APIopen/close, disable dates, getValue, goToDate та інші методи

Повний список опцій — у документації.

Швидкий старт

app.js

import '@rolldate/core/css/min';
import RollDate from '@rolldate/core';

new RollDate('#date', { theme: 'main' });

Почати npm

Перегляньте інтерактивні приклади або згенеруйте код у playground.