JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 18
  • Score
    100M100P100Q50173F
  • License MIT

A date range picker built with Svelte

Package Exports

  • s-date-range-picker

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (s-date-range-picker) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

svelte-date-range-picker (pre-alpha)

CircleCI A date range picker built in SvelteJS

Getting Started

  • Coming soon...

Current state of the picker (missing quite a few pieces of functionality / design) Current state of date picker - WIP

Todos

  • Missing Props / Options
  • Tests
  • Linter
  • Add TypeScript configuration
  • Convert to TypeScript
  • Documentation / Demo Site
  • Publish to npm
  • Mobile / touch friendly

Development

  • Requires NodeJS
  • Clone the repo: git clone https://github.com/onx2/svelte-date-range-picker.git
  • Enter directory: cd svelte-date-range-picker
  • Install dpendencies: yarn
  • Run dev web server: yarn serve
  • Run tests: yarn test (No tests yet)

API

Props / Options

  • autoApply (boolean)
  • dateFormat (string)
  • disabled (boolean)
  • disabledDates (Date[])
  • endDate (Date)
  • events (Date[])
  • firstDayOfWeek (string)
  • hideOnCancel (boolean)
  • hideOnApply (boolean)
  • isoWeekNumbers (boolean)
  • locale (Locale)
  • maxDate (Date)
  • maxSpan (number) - in days
  • minDate (Date)
  • monthDropdown (boolean)
  • monthFormat (string)
  • predefinedRanges (Date[])
  • rtl (boolean)
  • singlePicker (boolean)
  • startDate (Date)
  • timePicker (boolean)
  • timePicker24Hour (boolean)
  • timePickerIncrement (number)
  • timePickerSeconds (boolean)
  • today (Date)
  • weekGuides (boolean)
  • weekNumbers (boolean)
  • yearDropdown (boolean)

Events

  • show Fired after the picker has been shown
  • hide Fired after the picker has been hidden
  • selection Fired when a selection is made (start or end date has been chosen)
  • cancel Fired when the "Cancel" button is clicked
  • apply Fired when the "Apply" button is clicked

Thanks geakstr for the Svelte component template!

This project is using date-fns under the hood for date calculations / manipulation.