Reusable date picker component for React

Related tags

Date and Time react javascript react-component datepicker daterangepicker date-input
Overview

React DayPicker

DayPicker is a reusable date picker component for React.

$ npm install react-day-picker@next

Beta version ⚠️

This branch is for the next major version 8 – which is currently in development and not ready for production. For the stable version see the v7 branch.

Main features

  • ☀️ select days, ranges or whatever
  • 🗓 create multiple calendars
  • ♿️ complete ARIA support
  • ➡️ keyboard navigation
  • 🌎 localizable in any language
  • 🎨 easy to style and customize
  • 🤖 native Typescript support
  • 📄 easy integration with input elements
  • 🧘‍♀️ using date-fns as date libray

Documentation

Comments
  • React DayPicker 8

    React DayPicker 8

    v8 will be a TypeScript rewrite and will introduce some major, needed changes.

    • See project https://github.com/gpbl/react-day-picker/projects/7
    • Temporary website: https://react-day-picker-next.netlify.app
    • Latest docs: https://github.com/gpbl/react-day-picker/tree/master/website/docs

    Testing v8

    Add the next version to the dependencies:

    yarn add react-day-picker@next

    v8 Objectives

    • Rewrite the package to follow the latest React patterns
    • Improve API and customization with custom components
    • Resolve TypeScript typing issues by rewriting it in TypeScript
    • Replace DayPickerInput with a more flexible alternative, e.g. an hook.
    • use date-fns as date utility ~~peer dependency~~
    • have a browserstack functional tests
    • have a new website

    Notes

    • DayPickerInput seems very popular and removing it can make difficult the upgrade.
    • Need to be React +16.8
    • Likely we will need to maintain v7 for a while

    Please help 🙏🏾

    With more than 1M download per month, react-day-picker needs love

    It is time consuming to work alone on this project, organize the repository, write documentation, the functional tests, and the upgrade guides (not native speaker here).

    Please help, talk on https://spectrum.chat/react-day-picker

    I started this project five years ago as a way to contribute to the awesome React community. I've learnt a lot, I had a lot of fun, and met the best developers thanks to it.

    However, after all these years, the old codebase is not much fun to maintain and after so many changes, the code is not as good as it should. Developers started filling issues on Github, and the glorious OSS experience I had so far hit me to the point I didn't want to read Github notifications anymore.

    Surprisingly tho, downloads never stopped to grow and this library is still popular! People continue to send PRs, and some even wrote me that it would be sad to see this library to die. These nice messages have been highly motivational so I'm here again ❤️

    help wanted Status: In Progress 
    opened by gpbl 53
  • Display the day picker in an overlay

    Display the day picker in an overlay

    A common use for a date picker displaying it when focusing on an input field, so it would be nice to have an example in the examples app showing how to implement it. The example may use react-overlays.

    help wanted 
    opened by gpbl 33
  • add: ARIA attributes to the nav buttons

    add: ARIA attributes to the nav buttons

    This is related to #33. I think this as more of a continuation of that discussion than anything else.

    Basically: the nav buttons aren't ARIA compliant, and this solves that problem, but there's a better option: use real <button> elements instead of <span>s. This is more correct, but might be a breaking change. What do you think?

    help wanted 
    opened by joeybaker 27
  • UTC mode

    UTC mode

    i store my dates in GMT. my dates do not care about timestamps. i noticed that when using this library, dates are always shown based on the current timezone. this is annoying because from PST, when i select a date, the day before is actually selected in the calendar.

    is there a way we can set the mode to GMT? my current work around is to create new date objects based on the current locale. works, but i'm not a fan of it.

    thanks

    help wanted 
    opened by jonathanong 25
  • add support for changing years

    add support for changing years

    It would be nice if we could switch the years somehow, without spamming the next/prev month links. Either an extra pair of <</>> where the next/prev months are, or maybe a select box for years in the caption, or even a click on the caption to show an year sort of calendar (with just clickable years). Something like:

    | 2011 | 2012 | 2013 |
| 2014 | 2015 | 2016 |
| 2017 | 2018 | 2019 |
    opened by terebentina 24
  • unpkg usage throwing react type is invalid error

    unpkg usage throwing react type is invalid error

    Describe the bug When I try to use react-day-picker I get the follow errors in my console

    Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

    To Reproduce I can reproduce the error in the sandbox here -https://codesandbox.io/s/react-day-picker-base-vt99v

    Expected behavior Should be able to use the react-day-picker normally

    help wanted Priority: High Priority: Medium Status: To investigate v7 (maintenance) Type: Build 
    opened by ShyamRaj 21
  • Added fixedWeeks flag

    Added fixedWeeks flag

    Problem

    If your calendar is in a container with other elements around and you move between months, the container resizes to the number of weeks shown and this can create an annoying effect.

    Solution

    Added fixedWeeks flag

    With this new flag, the calendar will show always the same number of weeks. Exactly 6, because is the maximum number of week that a month can have.

    You can see here an example with this flag enabled:

    6weeks

    opened by fcsonline 19
  • October broken on Firefox Nightly

    October broken on Firefox Nightly

    Steps to reproduce:

    1. Download and install Firefox Nightly 40.0a1 (2015-04-29) (mac osx 10.9.5)
    2. Open the demo page at http://www.gpbl.org/react-day-picker/
    3. Navigate to October 2014, or October 2015 or October 2016

    Expected results:

    • A nice looking calendar for that month

    Actual results:

    • The 4th line duplicates the 3th line and then extends 6 more days missing one, example (October 2014): 12, 13, 14, 15, 16, 17, 18, 20, 21, 22, 23, 24, 25

    screen shot 2015-04-29 at 9 38 47 am

    opened by fczuardi 19
  • Executing onBlur function on months navigation buttons

    Executing onBlur function on months navigation buttons

    Jump to relevant https://github.com/gpbl/react-day-picker/issues/600#issuecomment-355964462

    I want to hide the DayPicker to onBlur but it is triggering also when I click on navigation buttons.

    How can I fix this?

    help wanted Type: Bug Status: Abandoned Priority: Medium 
    opened by phlex89 18
  • fromMonth not working as expected

    fromMonth not working as expected

    My code below is not influencing the fromMonth in any way. Is there a bug or am I doing it wrong?

    Render function

    	render() {
		const month = new Date();
		month.setMonth(month.getMonth() - 10);

		return (
			<DayPicker
				firstDayOfWeek={ 1 }
				onDayClick={ this.handleDayClick }
				selectedDays={ day => DateUtils.isDayInRange(day, { from: this.state.from, to: this.state.to }) }
				disabledDays={this.disabledDays}
				enableOutsideDays={true}
				fixedWeeks={true}
				numberOfMonths={this.props.numberOfMonths}
				toMonth={this.props.disableFuture ? new Date() : null}
				fromMonth={month}
			/>
		);
	}
    opened by nealoke 18
  • Add support for CSS modules

    Add support for CSS modules

    API proposal

    • a new prop classNames receiving an object containing the class names for the single elements, such as container, day, caption, ecc. Must be validated via PropTypes.
    • modifiers passed to the modifiers prop must return a string instead of a boolean. This string will be added to the day's cell class name. For CSS modules, it should be the imported class name.
      • if the returned value is falsy, no class name will be added to the day cell.

    Note that this change would work also for any class names, e.g. people adopting other convention than BEM can specify their own class names.

    Example using CSS Modules

    import classNames from './daypicker.css';
import { todayClassName, weekendClassName } from './daypicker-modifiers.css';
import { isToday, isWeekend } from './myDateUtils';

const modifiers = {
  today: day => {
    if (isToday(day)) {
      return todayClassName;
    }
    return '';
  },
  weekend: day => {
    if (isWeekend(day)) {
      return weekendClassName;
    }
    return '';
  },
};

function MyComponent() {
  return (
    <div>
      <DayPicker classNames={classNames} modifiers={modifiers} />
    </div>
  );
}
    opened by gpbl 18
  • build(deps): bump @typescript-eslint/eslint-plugin from 5.47.0 to 5.47.1

    build(deps): bump @typescript-eslint/eslint-plugin from 5.47.0 to 5.47.1

    Bumps @typescript-eslint/eslint-plugin from 5.47.0 to 5.47.1.

    Release notes

    Sourced from @​typescript-eslint/eslint-plugin's releases.

    v5.47.1

    5.47.1 (2022-12-26)

    Bug Fixes

    • ast-spec: correct some incorrect ast types (#6257) (0f3f645)
    • eslint-plugin: [member-ordering] correctly invert optionalityOrder (#6256) (ccd45d4)
    Changelog

    Sourced from @​typescript-eslint/eslint-plugin's changelog.

    5.47.1 (2022-12-26)

    Bug Fixes

    • ast-spec: correct some incorrect ast types (#6257) (0f3f645)
    • eslint-plugin: [member-ordering] correctly invert optionalityOrder (#6256) (ccd45d4)
    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    dependencies 
    opened by dependabot[bot] 0
  • build(deps-dev): bump @types/node from 18.11.17 to 18.11.18

    build(deps-dev): bump @types/node from 18.11.17 to 18.11.18

    Bumps @types/node from 18.11.17 to 18.11.18.

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    dependencies 
    opened by dependabot[bot] 0
  • Bug: Calendar truncated when browser set to different timezone.

    Bug: Calendar truncated when browser set to different timezone.

    Bug description

    Calendar truncated when browser set to different timezone.

    Expected:

    Screenshot 2022-10-18 at 11 42 27 AM

    Got:

    Screenshot 2022-10-18 at 11 42 06 AM

    Steps

    1. Set timezone of browser to Europe/Athens
    2. Visit https://react-day-picker.js.org/basics/navigation
    Status: Need More Info 
    opened by wavded 2
  • Investigate mode type errors

    Investigate mode type errors 

      Hi! I'm not opening new issue because I think it can be somehow related with this one 🙂

    So, after updating to 8.3.1 this issue appeared: Screenshot 2022-10-05 at 12 00 00

    mode and selectedDate comes from props. Their types are defined as follows:

    mode?: 'single' | 'multiple' | 'range';
selectedDate: DatesType

    (and DatesType: Date | Date[] | DateRange | undefined, where DateRange is imported from `react-day-picker)

    At this point I ran out of ideas how to resolve this issue. The only solution that worked, was something like this:

    { mode === 'single' && <DayPicker mode='single' selected={selectedDate as Date | undefined} {...otherProps} /> }
{ mode === 'multiple' && <DayPicker mode='multiple' selected={selectedDate as Date[] | undefined} {...otherProps} /> }
{ mode === 'range' && <DayPicker mode='range' selected={selectedDate as DateRange | undefined} {...otherProps} /> }

    but to be hones it doesn't look too clean.

    Maybe you would know what is the issue here and if there is a better way to resolve it than the one I showed above?

    Thanks in advance 😃

    Originally posted by @bartlomiej-bykowy in https://github.com/gpbl/react-day-picker/discussions/1570#discussioncomment-3803763

    opened by gpbl 0
  • docs: example with time picker

    docs: example with time picker

    It is a frequent request to see how DayPicker should work with time. We should add an example to the docs...

    Discussed in https://github.com/gpbl/react-day-picker/discussions/1474

    Originally posted by marcostaborda June 23, 2022 How to use react-day-picker with a time picker?

    Does anyone have used react-day-picker with time selector?

    Type: Documentation 
    opened by gpbl 0
Releases(v8.4.1)

  • v8.4.1(Dec 17, 2022)

    What's Changed

    • feat: add onDayPointerEnter, onDayPointerLeave props by @norbertkeresztes in https://github.com/gpbl/react-day-picker/pull/1614

    New Contributors

    • @norbertkeresztes made their first contribution in https://github.com/gpbl/react-day-picker/pull/1614

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.3.7...v8.4.1

    Source code(tar.gz)
    Source code(zip)

  • v8.3.7(Nov 20, 2022)

    What's Changed

    • chore(style): add opacity to differentiate outside days by @hpdganesh in https://github.com/gpbl/react-day-picker/pull/1592
    • fix(docs): minor typo in upgrading content by @baldyeagle in https://github.com/gpbl/react-day-picker/pull/1605
    • fix(bug): matcherToArray should return a copy of the array by @gpbl in https://github.com/gpbl/react-day-picker/pull/1609
    • build(deps): bump loader-utils from 2.0.2 to 2.0.4 by @dependabot in https://github.com/gpbl/react-day-picker/pull/1603

    New Contributors

    • @baldyeagle made their first contribution in https://github.com/gpbl/react-day-picker/pull/1605
    • @hpdganesh made their first contribution in https://github.com/gpbl/react-day-picker/pull/1592

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.3.6...v8.3.7

    Source code(tar.gz)
    Source code(zip)

  • v8.3.6(Nov 6, 2022)

    What's Changed

    • fix: set tab-index to 0 when day is focused by @gpbl in https://github.com/gpbl/react-day-picker/pull/1601
    • Upgraded dependencies by @gpbl in https://github.com/gpbl/react-day-picker/pull/1580

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.3.5...v8.3.6

    Source code(tar.gz)
    Source code(zip)

  • v8.3.5(Oct 10, 2022)

    What's Changed

    • fix: range_middle class is added to days not in the selected range by @gpbl in https://github.com/gpbl/react-day-picker/pull/1581

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.3.4...v8.3.5

    Source code(tar.gz)
    Source code(zip)

  • v8.3.4(Oct 9, 2022)

    What's Changed

    • build: fix CSS module types by @gpbl in https://github.com/gpbl/react-day-picker/pull/1578
    • fix: disable tab for outside days (#1567) by @DanielJKelly in https://github.com/gpbl/react-day-picker/pull/1576

    New Contributors

    • @DanielJKelly made their first contribution in https://github.com/gpbl/react-day-picker/pull/1576

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.3.1...v8.3.2

    Source code(tar.gz)
    Source code(zip)

  • v8.3.1(Oct 3, 2022)

    What's Changed

    • fix: types for selection modes not being correctly set by @gpbl in https://github.com/gpbl/react-day-picker/pull/1571
    • fix: isMatch to match open DateIntervals by @gpbl in https://github.com/gpbl/react-day-picker/pull/1572

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.3.0...v8.3.1

    Source code(tar.gz)
    Source code(zip)

  • v8.3.0(Sep 26, 2022)

    What's Changed

    • feat: add new id prop by @gpbl in https://github.com/gpbl/react-day-picker/pull/1556
    • feat: week localization props: ISOWeek, firstWeekContainsDate by @gpbl in https://github.com/gpbl/react-day-picker/pull/1558
    • fix: infinite recursion when focusing next days by @eXamadeus in https://github.com/gpbl/react-day-picker/pull/1549
    • fix: disabled modifiers with min/max range selections by @gpbl in https://github.com/gpbl/react-day-picker/pull/1566
    • fix: improved CSS focus-visible and disabled styles by @gpbl in https://github.com/gpbl/react-day-picker/pull/1565
    • chore: updated SelectSingleEventHandler interface to type by @gpbl in https://github.com/gpbl/react-day-picker/pull/1555
    • chore: cleanup context types and defaults by @gpbl in https://github.com/gpbl/react-day-picker/pull/1561
    • chore: use rollup-plugin-ts to compile typescript by @gpbl in https://github.com/gpbl/react-day-picker/pull/1562
    • chore: add new Components type by @gpbl in https://github.com/gpbl/react-day-picker/pull/1563
    • chore: reorganize contexts files by @gpbl in https://github.com/gpbl/react-day-picker/pull/1564

    New Contributors

    • @eXamadeus made their first contribution in https://github.com/gpbl/react-day-picker/pull/1549

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.2.1...v8.3.0

    Source code(tar.gz)
    Source code(zip)

  • v8.2.1(Sep 8, 2022)

    What's Changed

    • fix: CSS module doesn't include the root class by @gpbl in https://github.com/gpbl/react-day-picker/pull/1548

    New Contributors

    • @krishna63 made their first contribution in https://github.com/gpbl/react-day-picker/pull/1538
    • @AntanasMisiunas made their first contribution in https://github.com/gpbl/react-day-picker/pull/1542

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.2.0...v8.2.1

    Source code(tar.gz)
    Source code(zip)

  • v8.2.0(Sep 1, 2022)

    What's Changed

    • new: custom HeadRow component by @gpbl in https://github.com/gpbl/react-day-picker/pull/1534
    • changed: add HeadRow component by @KonradLinkowski in https://github.com/gpbl/react-day-picker/pull/1533
    • fixed: selected day outlines in chrome by @gpbl in https://github.com/gpbl/react-day-picker/pull/1536
    • fixed: dropdown focus-visible style by @gpbl in https://github.com/gpbl/react-day-picker/pull/1535
    • fix: use aria-label for days buttons by @gpbl in https://github.com/gpbl/react-day-picker/pull/1537

    New Contributors

    • @KonradLinkowski made their first contribution in https://github.com/gpbl/react-day-picker/pull/1533

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.1.4...v8.2.0

    Source code(tar.gz)
    Source code(zip)

  • v8.1.4(Aug 28, 2022)

    What's Changed

    • fix: use parsed fromDate/toDate in useInput by @hypergeometric in https://github.com/gpbl/react-day-picker/pull/1524
    • changed: add names to fields and buttons by @gpbl in https://github.com/gpbl/react-day-picker/pull/1530
    • changed: focus vs focus-visible styles by @gpbl in https://github.com/gpbl/react-day-picker/pull/1531

    New Contributors

    • @hypergeometric made their first contribution in https://github.com/gpbl/react-day-picker/pull/1524

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.1.3...v8.1.4

    Source code(tar.gz)
    Source code(zip)

  • v8.1.3(Aug 24, 2022)

    What's Changed

    • fix: onDayClick called twice in selection mode by @gpbl in https://github.com/gpbl/react-day-picker/pull/1520
    • changed: accept undefined for the modifier props by @gpbl in https://github.com/gpbl/react-day-picker/pull/1521

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.1.2...v8.1.3

    Source code(tar.gz)
    Source code(zip)

  • v8.1.2(Aug 22, 2022)

    What's Changed

    • fix: do not focus disabled or hidden days by @gpbl in https://github.com/gpbl/react-day-picker/pull/1519

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.1.1...v8.1.2

    Source code(tar.gz)
    Source code(zip)

  • v8.1.1(Aug 19, 2022)

    What's Changed

    • fix: prevent focus from moving beyond toDate and fromDate by @kimamula in https://github.com/gpbl/react-day-picker/pull/1468
    • fix: page keys not working when using setMonth by @kimamula in https://github.com/gpbl/react-day-picker/pull/1510
    • fix: add onSelect to the DayPickerContextValue by @gpbl in https://github.com/gpbl/react-day-picker/pull/1515
    • fix: rdp class not added to root element when using className by @gpbl in https://github.com/gpbl/react-day-picker/pull/1517

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.1.0...v8.1.1

    Source code(tar.gz)
    Source code(zip)

  • v8.1.0(Aug 11, 2022)

    What's Changed

    • new: add prefix to auto generated ids by @mihkeleidast in https://github.com/gpbl/react-day-picker/pull/1493
    • new: addedToRange to the exported utilities by @stopr29 in https://github.com/gpbl/react-day-picker/pull/1495
    • new: revert to use disabled attribute instead of aria-disabled (reverts by @gpbl in https://github.com/gpbl/react-day-picker/pull/1451). See ongoing discussion in https://github.com/gpbl/react-day-picker/pull/1468.
    • new(css): use pure selector for CSS variables by @andyschulzz in https://github.com/gpbl/react-day-picker/pull/1481, https://github.com/gpbl/react-day-picker/pull/1499
      • Note this may require some changes in your CSS
    • fix: @reach/auto-id warnings by removing the dependency by @gpbl in https://github.com/gpbl/react-day-picker/pull/1484
    • fix: home/end buttons behavior with startOfWeek by @apdrsn in https://github.com/gpbl/react-day-picker/pull/1492
    • package: upgraded dependencies by @gpbl in https://github.com/gpbl/react-day-picker/pull/1497

    New Contributors

    • @kimamula made their first contribution in https://github.com/gpbl/react-day-picker/pull/1476
    • @andyschulzz made their first contribution in https://github.com/gpbl/react-day-picker/pull/1481
    • @apdrsn made their first contribution in https://github.com/gpbl/react-day-picker/pull/1492
    • @mihkeleidast made their first contribution in https://github.com/gpbl/react-day-picker/pull/1493
    • @stopr29 made their first contribution in https://github.com/gpbl/react-day-picker/pull/1495

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.0.7...v8.1.0

    Source code(tar.gz)
    Source code(zip)

  • v8.0.7(Jun 12, 2022)

    What's Changed

    • fixed: missing dropdown_year CSS class in YearsDropdown by @pwolfert in https://github.com/gpbl/react-day-picker/pull/1466
    • fixed: Maximum update depth exceeded when select the range date by @gpbl in https://github.com/gpbl/react-day-picker/pull/1470
    • website(chore): Upgrade docusaurus to beta 22 by @gpbl in https://github.com/gpbl/react-day-picker/pull/1469

    New Contributors

    • @pwolfert made their first contribution in https://github.com/gpbl/react-day-picker/pull/1466

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.0.6...v8.0.7

    Source code(tar.gz)
    Source code(zip)

  • v8.0.6(Jun 5, 2022)

    What's Changed

    • fix(docs): fix typo by @denkristoffer in https://github.com/gpbl/react-day-picker/pull/1457

    New Contributors

    • @denkristoffer made their first contribution in https://github.com/gpbl/react-day-picker/pull/1457

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.0.5...v8.0.6

    Source code(tar.gz)
    Source code(zip)

  • v8.0.5(May 15, 2022)

    What's Changed

    • fix(docs): typo in property name by @dzek69 in https://github.com/gpbl/react-day-picker/pull/1442
    • Use aria-disabled instead of disabled by @gpbl in https://github.com/gpbl/react-day-picker/pull/1451

    New Contributors

    • @dzek69 made their first contribution in https://github.com/gpbl/react-day-picker/pull/1442

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.0.4...v8.0.5

    Source code(tar.gz)
    Source code(zip)

  • v8.0.4(Apr 14, 2022)

    What's Changed

    • Added src directory to the package for better source maps

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.0.3...v8.0.4

    Source code(tar.gz)
    Source code(zip)

  • v8.0.3(Apr 7, 2022)

    What's Changed

    • fix: toMonth to include the full month by @mputilov in https://github.com/gpbl/react-day-picker/pull/1429
    • chore: update date-fns imports by @gpbl in https://github.com/gpbl/react-day-picker/pull/1436

    New Contributors

    • @mputilov made their first contribution in https://github.com/gpbl/react-day-picker/pull/1429

    Full Changelog: https://github.com/gpbl/react-day-picker/compare/v8.0.2...v8.0.3

    Source code(tar.gz)
    Source code(zip)

  • v8.0.2(Apr 3, 2022)

    • new: added weekStartsOn prop (#1422)
    • new: split the Caption components into CaptionDropdowns and CaptionNavigation components (#1426)
      • this change should make easier to customize the caption
    Source code(tar.gz)
    Source code(zip)

  • v8.0.1(Mar 31, 2022)

  • v8.0.0(Mar 26, 2022)

    This version Introduces mayor breaking changes and is mostly incompatible with v7.

    Head over the redesigned website at https://react-day-picker.js.org for more details.

    Notable changes

    • added date-fns library as peer dependency
    • native TypeScript support
    • selection modes: single, multiple, range
    • improved ARIA support
    • replaced DayPickerInput component with useInput hook
    • new and redesigned props

    See also: https://react-day-picker.js.org/guides/upgrading

    Source code(tar.gz)
    Source code(zip)
Owner
Giampaolo Bellavite
🤖❤️🐕
Giampaolo Bellavite
GitHub http://react-day-picker.js.org
Reusable date picker component for React

React DayPicker DayPicker is a reusable date picker component for React. $ npm install react-day-picker@next Beta version ⚠️ This branch is for the ne

Giampaolo Bellavite 4.8k Dec 28, 2022
CalendarPickerJS - A minimalistic and modern date-picker component/library 🗓️👨🏽‍💻 Written in Vanilla JS

CalendarPickerJS The simple and pretty way to let a user select a day! Supports all major browser. Entirely written in Vanilla JavaScript with no depe

Mathias Picker 15 Dec 6, 2022
React Native Week Month Date Picker

React Native Week Month Date Picker Date picker with a week and month view Installation npm install react-native-week-month-date-picker Dependencies T

Noona 119 Dec 27, 2022
A simple and reusable datepicker component for React

React Date Picker A simple and reusable Datepicker component for React (Demo) Installation The package can be installed via npm: npm install react-dat

HackerOne 7k Jan 4, 2023
Nepali Date Picker jQuery Plugin 🇳🇵

Nepali Date Picker Nepali Date Picker jQuery Plugin for everyone. ???? Installation npm install nepali-date-picker Demo and Documentation https://leap

Leapfrog Technology 70 Sep 29, 2022
A tiny and fast zero-dependency date-picker built with vanilla Javascript and CSS.

A tiny zero-dependency and framework-agnostic date picker that is incredibly easy to use! Compatible with any web UI framework, vanilla JS projects, and even HTML-only projects!

Nezar 1 Jan 22, 2021
Create Persian Calendar as html helper with tag builder c# , and convert selected persian date to gregorian date

Persian-Calendar Use JS,Html,CSS,C# White theme for Persian Calendar , easy to use. Create Persian Calendar as html helper. Use Tag builder in c# for

Tareq Awwad 4 Feb 28, 2022
An wide ranged emoji picker extension for firefox based browsers.

Fire-Picker A wide ranged emoji picker extension for firefox based browsers made with pure js. This is still in a prototype phase. Changes will be mad

null 2 Jan 10, 2022
An wide ranged emoji picker extension for firefox based browsers.

Fire-Picker A wide ranged emoji picker extension for firefox based browsers made with pure js. This is still in a prototype phase. Changes will be mad

Furha Lepton 2 Jan 10, 2022
⏰ Day.js 2KB immutable date-time library alternative to Moment.js with the same modern API

English | 简体中文 | 日本語 | Português Brasileiro | 한국어 | Español (España) | Русский Fast 2kB alternative to Moment.js with the same modern API Day.js is a

null 41.7k Dec 28, 2022
⏳ Modern JavaScript date utility library ⌛️

date-fns provides the most comprehensive, yet simple and consistent toolset for manipulating JavaScript dates in a browser & Node.js. ?? Documentation

date-fns 30.6k Dec 29, 2022
🕑 js-joda is an immutable date and time library for JavaScript.

js-joda is an immutable date and time library for JavaScript. It provides a simple, domain-driven and clean API based on the ISO8601 calendar.

null 1.5k Dec 27, 2022
DEPRECATED: Timezone-enabled JavaScript Date object. Uses Olson zoneinfo files for timezone data.

TimezoneJS.Date A timezone-enabled, drop-in replacement for the stock JavaScript Date. The timezoneJS.Date object is API-compatible with JS Date, with

Matthew Eernisse 830 Nov 20, 2022
Date() for humans

date Date is an english language date parser for node.js and the browser. For examples and demos, see: http://matthewmueller.github.io/date/ Update: d

Matthew Mueller 1.5k Jan 4, 2023
:clock8: :hourglass: timeago.js is a tiny(2.0 kb) library used to format date with `*** time ago` statement.

timeago.js timeago.js is a nano library(less than 2 kb) used to format datetime with *** time ago statement. eg: '3 hours ago'. i18n supported. Time a

hustcc 4.9k Jan 4, 2023
Lightweight and simple JS date formatting and parsing

fecha Lightweight date formatting and parsing (~2KB). Meant to replace parsing and formatting functionality of moment.js. NPM npm install fecha --save

Taylor Hakes 2k Jan 5, 2023
A lightweight, locale aware formatter for strings containing unicode date tokens.

Date Token Format A lightweight (~2kB), locale aware formatter for strings containing unicode date tokens. Usage Install the package using: yarn add d

Donovan Hutchinson 1 Dec 24, 2021
⏰ Day.js 2kB immutable date-time library alternative to Moment.js with the same modern API

English | 简体中文 | 日本語 | Português Brasileiro | 한국어 | Español (España) | Русский Fast 2kB alternative to Moment.js with the same modern API Day.js is a

null 41.7k Dec 28, 2022
Easy to get a date.

date2data 테이블에 날짜별 데이터 넣을 때마다 새로 객체 만들어서 작업하기가 매우 귀찮아서 만들었다. moment.js를 쓰기에는 구현하고자 하는 내용이 너무 가벼웠음 Install npm i date2data Usage import {getMonthlyDate

Duho Kim 3 Apr 12, 2022