From 28e6a15965a268d2e6d317f220b7480ce1ac42bd Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Thu, 25 Nov 2021 12:31:27 -0800 Subject: [PATCH 01/31] [Dev Deps] remove `node-sass`, because it fails to compile on node > 14 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This might mean the storybook requires a manual install of node-sass, but that’s better than the alternative --- package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/package.json b/package.json index 7798b2185..3244d3aee 100644 --- a/package.json +++ b/package.json @@ -98,7 +98,6 @@ "mocha-wrap": "^2.1.2", "moment": "^2.29.1", "moment-jalaali": "^0.7.4", - "node-sass": "^4.12.0", "nyc": "^14.1.1", "raw-loader": "^0.5.1", "react": "^0.14 || ^15.5.4 || ^16.1.1", From 74fe1a0014f33852bafba504e1d848cae65687e3 Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Thu, 25 Nov 2021 12:34:09 -0800 Subject: [PATCH 02/31] [Deps] pin `react-with-styles` to v4.1 due to a breaking change in v4.2 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 3244d3aee..5ebadfb70 100644 --- a/package.json +++ b/package.json @@ -128,7 +128,7 @@ "react-outside-click-handler": "^1.3.0", "react-portal": "^4.2.1", "react-with-direction": "^1.3.1", - "react-with-styles": "^4.1.0", + "react-with-styles": "~4.1.0", "react-with-styles-interface-css": "^6.0.0" }, "peerDependencies": { From b3cc4267736a9de8768f77cdf98811d8982dd9dd Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Thu, 25 Nov 2021 13:02:37 -0800 Subject: [PATCH 03/31] [Tests] migrate to Github Actions --- .github/workflows/node-pretest.yml | 37 ++++++++++++++ .github/workflows/node.yml | 48 +++++++++++++++++++ .github/workflows/rebase.yml | 15 ++++++ .github/workflows/require-allow-edits.yml | 12 +++++ .nycrc | 6 +-- .travis.yml | 38 ++------------- css/storybook.scss | 2 +- package.json | 13 +---- .../DateRangePickerInputController_spec.jsx | 3 +- 9 files changed, 121 insertions(+), 53 deletions(-) create mode 100644 .github/workflows/node-pretest.yml create mode 100644 .github/workflows/node.yml create mode 100644 .github/workflows/rebase.yml create mode 100644 .github/workflows/require-allow-edits.yml diff --git a/.github/workflows/node-pretest.yml b/.github/workflows/node-pretest.yml new file mode 100644 index 000000000..981f03f4c --- /dev/null +++ b/.github/workflows/node-pretest.yml @@ -0,0 +1,37 @@ +name: 'Tests: pretest/posttest/build' + +on: [pull_request, push] + +jobs: + pretest: + runs-on: ubuntu-latest + + steps: + - uses: actions/checkout@v2 + - uses: ljharb/actions/node/install@main + name: 'nvm install lts/* && npm install' + with: + node-version: 'lts/*' + - run: npm run pretest + + # posttest: + # runs-on: ubuntu-latest + + # steps: + # - uses: actions/checkout@v2 + # - uses: ljharb/actions/node/install@main + # name: 'nvm install lts/* && npm install' + # with: + # node-version: 'lts/*' + # - run: npm run posttest + + build: + runs-on: ubuntu-latest + + steps: + - uses: actions/checkout@v2 + - uses: ljharb/actions/node/install@main + name: 'nvm install lts/* && npm install' + with: + node-version: 'lts/*' + - run: npm run build diff --git a/.github/workflows/node.yml b/.github/workflows/node.yml new file mode 100644 index 000000000..64fd77892 --- /dev/null +++ b/.github/workflows/node.yml @@ -0,0 +1,48 @@ +name: 'Tests: node.js' + +on: [pull_request, push] + +jobs: + matrix: + runs-on: ubuntu-latest + outputs: + latest: ${{ steps.set-matrix.outputs.requireds }} + minors: ${{ steps.set-matrix.outputs.optionals }} + steps: + - uses: ljharb/actions/node/matrix@main + id: set-matrix + with: + type: 'majors' + versionsAsRoot: true + preset: '>=6' + # to test in node < 6, we need to run the build in one stage, including the tests, and then run the tests in the desired node version later + + majors: + needs: [matrix] + name: 'latest minors' + runs-on: ubuntu-latest + + strategy: + fail-fast: false + matrix: + node-version: ${{ fromJson(needs.matrix.outputs.latest) }} + react: + - 16 + - 15 + - 0.14 + + steps: + - uses: actions/checkout@v2 + - uses: ljharb/actions/node/install@main + name: 'nvm install ${{ matrix.node-version }} && npm install' + with: + node-version: ${{ matrix.node-version }} + - run: npm run tests-only + - uses: codecov/codecov-action@v2 + + node: + name: 'node 6+' + needs: [majors] + runs-on: ubuntu-latest + steps: + - run: 'echo tests completed' diff --git a/.github/workflows/rebase.yml b/.github/workflows/rebase.yml new file mode 100644 index 000000000..027aed079 --- /dev/null +++ b/.github/workflows/rebase.yml @@ -0,0 +1,15 @@ +name: Automatic Rebase + +on: [pull_request_target] + +jobs: + _: + name: "Automatic Rebase" + + runs-on: ubuntu-latest + + steps: + - uses: actions/checkout@v2 + - uses: ljharb/rebase@master + env: + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} diff --git a/.github/workflows/require-allow-edits.yml b/.github/workflows/require-allow-edits.yml new file mode 100644 index 000000000..549d7b482 --- /dev/null +++ b/.github/workflows/require-allow-edits.yml @@ -0,0 +1,12 @@ +name: Require “Allow Edits” + +on: [pull_request_target] + +jobs: + _: + name: "Require “Allow Edits”" + + runs-on: ubuntu-latest + + steps: + - uses: ljharb/require-allow-edits@main diff --git a/.nycrc b/.nycrc index fb85ce72b..90d79055a 100644 --- a/.nycrc +++ b/.nycrc @@ -11,14 +11,10 @@ ], "reporter": [ "text", + "html", "lcov" ], "all": true, - "check-coverage": true, - "statements": 83, - "branches": 73, - "lines": 83, - "functions": 67.8, "sourceMap": false, "instrument": false } diff --git a/.travis.yml b/.travis.yml index f8c4163fc..ea471eba5 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,43 +1,13 @@ language: node_js -node_js: - - 14 - - 12 - - 10 - - 8 - - 6 +node_js: lts/* before_install: - - 'nvm install-latest-npm' + - nvm install-latest-npm services: - xvfb -before_script: - - 'if [ -n "${KARMA-}" ]; then export DISPLAY=:99.0; fi' script: - - 'if [ -n "${LINT-}" ]; then npm run lint ; fi' - - 'if [ -n "${BUILD-}" ]; then npm run build ; fi' - - 'if [ "${TEST-}" = true ]; then npm run tests-only ; fi' - - 'if [ -n "${KARMA-}" ]; then npm run tests-karma ; fi' - - 'if [ -n "${COVERAGE-}" ] && [ "${TRAVIS_BRANCH-}" = "master" ]; then npm run cover; cat ./coverage/lcov.info | ./node_modules/.bin/coveralls ; fi' -install: - - 'if [ -n "${LINT-}" ]; then NPM_CONFIG_LEGACY_PEER_DEPS=true npm install --legacy-bundling ; else npm install ; fi' + - npm run tests-karma env: global: - - TEST=true - matrix: - - REACT=0.14 - - REACT=15 - REACT=16 + - DISPLAY=:99.0 sudo: false -matrix: - fast_finish: true - include: - - node_js: "lts/*" - env: LINT=true TEST=false - - node_js: "lts/*" - env: BUILD=true TEST=false - - node_js: "lts/*" - env: COVERAGE=true TEST=false - - node_js: "lts/*" - env: KARMA=true TEST=false - allow_failures: - - node_js: "10" - env: REACT=16 diff --git a/css/storybook.scss b/css/storybook.scss index c30436971..2e20e67c2 100644 --- a/css/storybook.scss +++ b/css/storybook.scss @@ -21,4 +21,4 @@ a { .foo-bar { background: red !important; -} \ No newline at end of file +} diff --git a/package.json b/package.json index 5ebadfb70..9400cc49f 100644 --- a/package.json +++ b/package.json @@ -11,15 +11,13 @@ "prebuild:css": "rimraf lib/css && mkdirp lib/css", "build:css": "node scripts/buildCSS.js", "clean": "rimraf lib esm", - "precover": "rimraf coverage && npm run react", - "cover": "cross-env NODE_ENV=test node --max-old-space-size=4096 $(which nyc) npm run mocha", "lint": "eslint --ext .js,.jsx src test", "mocha": "mocha ./test/_helpers", "storybook:uninstall": "npm uninstall --no-save @storybook/react && rimraf node_modules/@storybook node_modules/react-modal node_modules/react-dom-factories", "react": "NPM_CONFIG_LEGACY_PEER_DEPS=true enzyme-adapter-react-install 16", "pretest": "npm run --silent lint", "pretests-only": "npm run react", - "tests-only": "npm run mocha --silent", + "tests-only": "cross-env NODE_ENV=test nyc npm run mocha --silent", "pretests-karma": "npm run react", "tests-karma": "karma start", "test": "npm run build && npm run tests-only", @@ -73,7 +71,6 @@ "babel-preset-airbnb": "^4.5.0", "chai": "^4.2.0", "clean-css": "^4.2.3", - "coveralls": "^3.1.0", "cross-env": "^5.2.1", "enzyme": "^3.11.0", "enzyme-adapter-react-helper": "^1.3.9", @@ -98,7 +95,7 @@ "mocha-wrap": "^2.1.2", "moment": "^2.29.1", "moment-jalaali": "^0.7.4", - "nyc": "^14.1.1", + "nyc": "^10.3.2", "raw-loader": "^0.5.1", "react": "^0.14 || ^15.5.4 || ^16.1.1", "react-dom": "^0.14 || ^15.5.4 || ^16.1.1", @@ -138,12 +135,6 @@ "react-dom": "^0.14 || ^15.5.4 || ^16.1.1", "react-with-direction": "^1.3.1" }, - "greenkeeper": { - "ignore": [ - "mocha", - "webpack" - ] - }, "engines": { "node": ">=0.10" } diff --git a/test/components/DateRangePickerInputController_spec.jsx b/test/components/DateRangePickerInputController_spec.jsx index 91601231c..b6112065b 100644 --- a/test/components/DateRangePickerInputController_spec.jsx +++ b/test/components/DateRangePickerInputController_spec.jsx @@ -4,8 +4,7 @@ import moment from 'moment'; import sinon from 'sinon-sandbox'; import { shallow } from 'enzyme'; -import DateRangePickerInputController - from '../../src/components/DateRangePickerInputController'; +import DateRangePickerInputController from '../../src/components/DateRangePickerInputController'; import DateRangePickerInput from '../../src/components/DateRangePickerInput'; From 67fc5447add57c19ddb4a99efe583e4804b15d5b Mon Sep 17 00:00:00 2001 From: Greg O'Connor Date: Wed, 27 Jan 2021 10:23:47 -0800 Subject: [PATCH 04/31] [Fix] `DateRangePicker`, `DateRangePickerInput`: Fix keyboard navigation Keyboard navigation is broken for the date range picker. The following bugs exist: When passing through the component with tab-navigation, after exiting the end-date input the dropdown does not close. When attempting to enter values into the end-date dropdown, users would have to tab backwards back to the dropdown to enter values. The simplest and clearest solution that came to be is simply to put the day picker after the currently active input. In this way, the dropdown always appears next in the tab-order to the input the user has selected. The existing blur handler in the dropdown means that tabbing through the component will leave the dropdown closed at the end. The react keys ensure that the element is just moved over in the DOM and so there is no flickering. Fixes #1809 Co-authored-by: Greg O'Connor Co-authored-by: Daniel M --- src/components/DateRangePicker.jsx | 1 + src/components/DateRangePickerInput.jsx | 4 +- test/components/DateRangePicker_spec.jsx | 61 ++++++++++++++++++++++++ 3 files changed, 65 insertions(+), 1 deletion(-) diff --git a/src/components/DateRangePicker.jsx b/src/components/DateRangePicker.jsx index 040d1fa59..a67e535c1 100644 --- a/src/components/DateRangePicker.jsx +++ b/src/components/DateRangePicker.jsx @@ -481,6 +481,7 @@ class DateRangePicker extends React.PureComponent { /* eslint-disable jsx-a11y/click-events-have-key-events */ return (
- {children} + {!isEndDateFocused && children} {
+ {isEndDateFocused && children} + {showClearDates && ( +
+ ); + } +} + const requiredProps = { onDatesChange: () => {}, onFocusChange: () => {}, @@ -539,6 +583,23 @@ describe('DateRangePicker', () => { }); }); + describeIfWindow('day picker position', () => { + it('day picker is opened after the end date input when end date input is focused', () => { + const wrapper = mount(( + + )); + expect(wrapper.find(DayPicker)).to.have.length(0); + wrapper.find('input').at(0).simulate('focus'); // when focusing on start date the day picker is rendered after the start date input + expect(wrapper.find('DateRangePickerInput').children().childAt(1).find(DayPicker)).to.have.length(1); + wrapper.find('input').at(1).simulate('focus'); // when focusing on end date the day picker is rendered after the end date input + expect(wrapper.find('DateRangePickerInput').children().childAt(1).find(DayPicker)).to.have.length(0); + expect(wrapper.find('DateRangePickerInput').children().childAt(3).find(DayPicker)).to.have.length(1); + }); + }); + describeIfWindow('#onDayPickerBlur', () => { it('sets state.isDateRangePickerInputFocused to true', () => { const wrapper = shallow(( From b8e26f01933aa6513af6fd22a7525ff1cd30df06 Mon Sep 17 00:00:00 2001 From: Tanner Byers Date: Thu, 28 Oct 2021 15:29:24 -0400 Subject: [PATCH 05/31] [New] DateInput, {DateRange,SingleDate}Picker{,Input,InputController}: add autocomplete prop --- README.md | 2 ++ examples/DateRangePickerWrapper.jsx | 1 + examples/SingleDatePickerWrapper.jsx | 1 + src/components/DateInput.jsx | 5 ++++- src/components/DateRangePicker.jsx | 3 +++ src/components/DateRangePickerInput.jsx | 5 +++++ src/components/DateRangePickerInputController.jsx | 4 ++++ src/components/SingleDatePicker.jsx | 3 +++ src/components/SingleDatePickerInput.jsx | 4 ++++ src/components/SingleDatePickerInputController.jsx | 4 ++++ src/shapes/DateRangePickerShape.js | 1 + src/shapes/SingleDatePickerShape.js | 1 + stories/DateRangePicker.js | 3 +++ stories/SingleDatePicker.js | 5 +++++ 14 files changed, 41 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index f3a23ef15..315ac38e6 100644 --- a/README.md +++ b/README.md @@ -158,6 +158,7 @@ noBorder: PropTypes.bool, block: PropTypes.bool, small: PropTypes.bool, regular: PropTypes.bool, +autoComplete: PropTypes.string, // calendar presentation and interaction related props renderMonthText: mutuallyExclusiveProps(PropTypes.func, 'renderMonthText', 'renderMonthElement'), // (month) => PropTypes.string, @@ -244,6 +245,7 @@ noBorder: PropTypes.bool, block: PropTypes.bool, small: PropTypes.bool, regular: PropTypes.bool, +autoComplete: PropTypes.string, // calendar presentation and interaction related props renderMonthText: mutuallyExclusiveProps(PropTypes.func, 'renderMonthText', 'renderMonthElement'), // (month) => PropTypes.string, diff --git a/examples/DateRangePickerWrapper.jsx b/examples/DateRangePickerWrapper.jsx index 96154f4d0..a210448ff 100644 --- a/examples/DateRangePickerWrapper.jsx +++ b/examples/DateRangePickerWrapper.jsx @@ -58,6 +58,7 @@ const defaultProps = { block: false, small: false, regular: false, + autoComplete: 'off', // calendar presentation and interaction related props renderMonthText: null, diff --git a/examples/SingleDatePickerWrapper.jsx b/examples/SingleDatePickerWrapper.jsx index 0dcf49146..9b3eaf8c8 100644 --- a/examples/SingleDatePickerWrapper.jsx +++ b/examples/SingleDatePickerWrapper.jsx @@ -43,6 +43,7 @@ const defaultProps = { regular: false, verticalSpacing: undefined, keepFocusOnInput: false, + autoComplete: 'off', // calendar presentation and interaction related props renderMonthText: null, diff --git a/src/components/DateInput.jsx b/src/components/DateInput.jsx index 8a3467105..e9c12dfcc 100644 --- a/src/components/DateInput.jsx +++ b/src/components/DateInput.jsx @@ -29,6 +29,7 @@ const propTypes = forbidExtraProps({ placeholder: PropTypes.string, displayValue: PropTypes.string, ariaLabel: PropTypes.string, + autoComplete: PropTypes.string, titleText: PropTypes.string, screenReaderMessage: PropTypes.string, focused: PropTypes.bool, @@ -58,6 +59,7 @@ const defaultProps = { placeholder: 'Select Date', displayValue: '', ariaLabel: undefined, + autoComplete: 'off', titleText: undefined, screenReaderMessage: '', focused: false, @@ -177,6 +179,7 @@ class DateInput extends React.PureComponent { id, placeholder, ariaLabel, + autoComplete, titleText, displayValue, screenReaderMessage, @@ -234,7 +237,7 @@ class DateInput extends React.PureComponent { onKeyDown={this.onKeyDown} onFocus={onFocus} placeholder={placeholder} - autoComplete="off" + autoComplete={autoComplete} disabled={disabled} readOnly={typeof readOnly === 'boolean' ? readOnly : isTouch} required={required} diff --git a/src/components/DateRangePicker.jsx b/src/components/DateRangePicker.jsx index a67e535c1..1f706991d 100644 --- a/src/components/DateRangePicker.jsx +++ b/src/components/DateRangePicker.jsx @@ -99,6 +99,7 @@ const defaultProps = { verticalHeight: null, transitionDuration: undefined, verticalSpacing: DEFAULT_VERTICAL_SPACING, + autoComplete: 'off', horizontalMonthPadding: undefined, // navigation related props @@ -595,6 +596,7 @@ class DateRangePicker extends React.PureComponent { disabled, required, readOnly, + autoComplete, openDirection, phrases, isOutsideRange, @@ -668,6 +670,7 @@ class DateRangePicker extends React.PureComponent { small={small} regular={regular} verticalSpacing={verticalSpacing} + autoComplete={autoComplete} > {this.maybeRenderDayPickerWithPortal()} diff --git a/src/components/DateRangePickerInput.jsx b/src/components/DateRangePickerInput.jsx index d3923c98b..1f0a2551e 100644 --- a/src/components/DateRangePickerInput.jsx +++ b/src/components/DateRangePickerInput.jsx @@ -72,6 +72,7 @@ const propTypes = forbidExtraProps({ small: PropTypes.bool, regular: PropTypes.bool, verticalSpacing: nonNegativeInteger, + autoComplete: PropTypes.string, // accessibility isFocused: PropTypes.bool, // describes actual DOM focus @@ -93,6 +94,7 @@ const defaultProps = { startDateTitleText: undefined, endDateTitleText: undefined, screenReaderMessage: '', + autoComplete: 'off', onStartDateFocus() {}, onEndDateFocus() {}, onStartDateChange() {}, @@ -162,6 +164,7 @@ function DateRangePickerInput({ disabled, required, readOnly, + autoComplete, showCaret, openDirection, showDefaultInputIcon, @@ -233,6 +236,7 @@ function DateRangePickerInput({ id={startDateId} placeholder={startDatePlaceholderText} ariaLabel={startDateAriaLabel} + autoComplete={autoComplete} titleText={startDateTitleText} displayValue={startDate} screenReaderMessage={screenReaderStartDateText} @@ -269,6 +273,7 @@ function DateRangePickerInput({ id={endDateId} placeholder={endDatePlaceholderText} ariaLabel={endDateAriaLabel} + autoComplete={autoComplete} titleText={endDateTitleText} displayValue={endDate} screenReaderMessage={screenReaderEndDateText} diff --git a/src/components/DateRangePickerInputController.jsx b/src/components/DateRangePickerInputController.jsx index d644b5503..56d2a39fd 100644 --- a/src/components/DateRangePickerInputController.jsx +++ b/src/components/DateRangePickerInputController.jsx @@ -58,6 +58,7 @@ const propTypes = forbidExtraProps({ small: PropTypes.bool, regular: PropTypes.bool, verticalSpacing: nonNegativeInteger, + autoComplete: PropTypes.string, keepOpenOnDateSelect: PropTypes.bool, reopenPickerOnClearDates: PropTypes.bool, @@ -117,6 +118,7 @@ const defaultProps = { small: false, regular: false, verticalSpacing: undefined, + autoComplete: 'off', keepOpenOnDateSelect: false, reopenPickerOnClearDates: false, @@ -312,6 +314,7 @@ export default class DateRangePickerInputController extends React.PureComponent small, regular, verticalSpacing, + autoComplete, } = this.props; const startDateString = this.getDateString(startDate); @@ -359,6 +362,7 @@ export default class DateRangePickerInputController extends React.PureComponent small={small} regular={regular} verticalSpacing={verticalSpacing} + autoComplete={autoComplete} > {children} diff --git a/src/components/SingleDatePicker.jsx b/src/components/SingleDatePicker.jsx index c449f7e2f..d1a5e3f19 100644 --- a/src/components/SingleDatePicker.jsx +++ b/src/components/SingleDatePicker.jsx @@ -53,6 +53,7 @@ const defaultProps = { id: 'date', placeholder: 'Date', ariaLabel: undefined, + autoComplete: 'off', titleText: undefined, disabled: false, required: false, @@ -550,6 +551,7 @@ class SingleDatePicker extends React.PureComponent { id, placeholder, ariaLabel, + autoComplete, titleText, disabled, focused, @@ -592,6 +594,7 @@ class SingleDatePicker extends React.PureComponent { id={id} placeholder={placeholder} ariaLabel={ariaLabel} + autoComplete={autoComplete} titleText={titleText} focused={focused} isFocused={isInputFocused} diff --git a/src/components/SingleDatePickerInput.jsx b/src/components/SingleDatePickerInput.jsx index ce9aa24e7..17de3d017 100644 --- a/src/components/SingleDatePickerInput.jsx +++ b/src/components/SingleDatePickerInput.jsx @@ -22,6 +22,7 @@ const propTypes = forbidExtraProps({ children: PropTypes.node, placeholder: PropTypes.string, ariaLabel: PropTypes.string, + autoComplete: PropTypes.string, titleText: PropTypes.string, displayValue: PropTypes.string, screenReaderMessage: PropTypes.string, @@ -60,6 +61,7 @@ const defaultProps = { children: null, placeholder: 'Select Date', ariaLabel: undefined, + autoComplete: 'off', titleText: undefined, displayValue: '', screenReaderMessage: '', @@ -99,6 +101,7 @@ function SingleDatePickerInput({ children, placeholder, ariaLabel, + autoComplete, titleText, displayValue, focused, @@ -172,6 +175,7 @@ function SingleDatePickerInput({ id={id} placeholder={placeholder} ariaLabel={ariaLabel} + autoComplete={autoComplete} titleText={titleText} displayValue={displayValue} screenReaderMessage={screenReaderText} diff --git a/src/components/SingleDatePickerInputController.jsx b/src/components/SingleDatePickerInputController.jsx index ccaf46936..c7a3214c3 100644 --- a/src/components/SingleDatePickerInputController.jsx +++ b/src/components/SingleDatePickerInputController.jsx @@ -36,6 +36,7 @@ const propTypes = forbidExtraProps({ id: PropTypes.string.isRequired, placeholder: PropTypes.string, ariaLabel: PropTypes.string, + autoComplete: PropTypes.string, titleText: PropTypes.string, screenReaderMessage: PropTypes.string, showClearDate: PropTypes.bool, @@ -82,6 +83,7 @@ const defaultProps = { placeholder: '', ariaLabel: undefined, + autoComplete: 'off', titleText: undefined, screenReaderMessage: 'Date', showClearDate: false, @@ -204,6 +206,7 @@ export default class SingleDatePickerInputController extends React.PureComponent id, placeholder, ariaLabel, + autoComplete, titleText, disabled, focused, @@ -237,6 +240,7 @@ export default class SingleDatePickerInputController extends React.PureComponent id={id} placeholder={placeholder} ariaLabel={ariaLabel} + autoComplete={autoComplete} titleText={titleText} focused={focused} isFocused={isFocused} diff --git a/src/shapes/DateRangePickerShape.js b/src/shapes/DateRangePickerShape.js index a54126932..94763c0aa 100644 --- a/src/shapes/DateRangePickerShape.js +++ b/src/shapes/DateRangePickerShape.js @@ -52,6 +52,7 @@ export default { small: PropTypes.bool, regular: PropTypes.bool, keepFocusOnInput: PropTypes.bool, + autoComplete: PropTypes.string, // calendar presentation and interaction related props renderMonthText: mutuallyExclusiveProps(PropTypes.func, 'renderMonthText', 'renderMonthElement'), diff --git a/src/shapes/SingleDatePickerShape.js b/src/shapes/SingleDatePickerShape.js index ef9edcb4e..a55a02c01 100644 --- a/src/shapes/SingleDatePickerShape.js +++ b/src/shapes/SingleDatePickerShape.js @@ -41,6 +41,7 @@ export default { regular: PropTypes.bool, verticalSpacing: nonNegativeInteger, keepFocusOnInput: PropTypes.bool, + autoComplete: PropTypes.string, // calendar presentation and interaction related props renderMonthText: mutuallyExclusiveProps(PropTypes.func, 'renderMonthText', 'renderMonthElement'), diff --git a/stories/DateRangePicker.js b/stories/DateRangePicker.js index 0353260f5..8f124cde8 100644 --- a/stories/DateRangePicker.js +++ b/stories/DateRangePicker.js @@ -124,4 +124,7 @@ storiesOf('DateRangePicker (DRP)', module) maxDate={moment().add(2, 'months').endOf('month')} numberOfMonths={2} /> + ))) + .add('with custom autoComplete', withInfo()(() => ( + ))); diff --git a/stories/SingleDatePicker.js b/stories/SingleDatePicker.js index 81ad05309..3a7d96e65 100644 --- a/stories/SingleDatePicker.js +++ b/stories/SingleDatePicker.js @@ -98,4 +98,9 @@ storiesOf('SingleDatePicker (SDP)', module) orientation={VERTICAL_ORIENTATION} verticalHeight={568} /> + ))) + .add('with custom autoComplete attribute', withInfo()(() => ( + ))); From af5d7c25a2be60b139736afe931cabf10b747870 Mon Sep 17 00:00:00 2001 From: mum-never-proud Date: Sat, 30 May 2020 20:03:30 +0530 Subject: [PATCH 06/31] [meta] storybook tag fix --- stories/DateRangePicker_day.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/stories/DateRangePicker_day.js b/stories/DateRangePicker_day.js index 7c75a2614..8f27abb04 100644 --- a/stories/DateRangePicker_day.js +++ b/stories/DateRangePicker_day.js @@ -126,7 +126,7 @@ storiesOf('DRP - Day Props', module) ))) .add('with custom daily details', withInfo()(() => ( {day.format('ddd')}} + renderDayContents={day =>
{day.format('ddd')}
} autoFocus /> ))) From 3ddb7b56a944f64bede7b33c1cdb300a0b6fb877 Mon Sep 17 00:00:00 2001 From: Dane David Date: Fri, 8 May 2020 22:34:04 +0530 Subject: [PATCH 07/31] [readme] Add `verticalSpacing` Fixes #1852. --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 315ac38e6..da8f6c36e 100644 --- a/README.md +++ b/README.md @@ -180,6 +180,7 @@ reopenPickerOnClearDates: PropTypes.bool, renderCalendarInfo: PropTypes.func, renderMonthElement: mutuallyExclusiveProps(PropTypes.func, 'renderMonthText', 'renderMonthElement'), PropTypes.func, // ({ month, onMonthSelect, onYearSelect, isVisible }) => PropTypes.node, hideKeyboardShortcutsPanel: PropTypes.bool, +verticalSpacing: PropTypes.number, // navigation related props navPrev: PropTypes.node, @@ -267,6 +268,7 @@ renderMonthElement: mutuallyExclusiveProps(PropTypes.func, 'renderMonthText', 'r hideKeyboardShortcutsPanel: PropTypes.bool, daySize: nonNegativeInteger, isRTL: PropTypes.bool, +verticalSpacing: PropTypes.number, // navigation related props navPrev: PropTypes.node, From 5bcf4d59655c641dfdd620984d07119c3e4cbc1d Mon Sep 17 00:00:00 2001 From: sainath-batthala Date: Wed, 19 Jul 2017 16:22:25 +0530 Subject: [PATCH 08/31] [Fix] `DateRangePicker`, `SingleDatePickerInput`: Set tab index as -1 for default and custom date icons --- src/components/DateRangePicker.jsx | 1 + src/components/SingleDatePickerInput.jsx | 1 + 2 files changed, 2 insertions(+) diff --git a/src/components/DateRangePicker.jsx b/src/components/DateRangePicker.jsx index 1f706991d..445d7e0c5 100644 --- a/src/components/DateRangePicker.jsx +++ b/src/components/DateRangePicker.jsx @@ -563,6 +563,7 @@ class DateRangePicker extends React.PureComponent { type="button" onClick={this.onOutsideClick} aria-label={phrases.closeDatePicker} + tabIndex="-1" > {closeIcon} diff --git a/src/components/SingleDatePickerInput.jsx b/src/components/SingleDatePickerInput.jsx index 17de3d017..e6516704b 100644 --- a/src/components/SingleDatePickerInput.jsx +++ b/src/components/SingleDatePickerInput.jsx @@ -153,6 +153,7 @@ function SingleDatePickerInput({ disabled={disabled} aria-label={phrases.focusStartDate} onClick={onFocus} + tabIndex="-1" > {calendarIcon} From f5fa12291d858546a9754bea72e13ccc433102bc Mon Sep 17 00:00:00 2001 From: Sajid Ahmed Date: Mon, 18 Feb 2019 17:20:16 -0500 Subject: [PATCH 09/31] [Fix] `DayPicker`: Fixed month transition in RTL mode Fixes #1551 --- src/components/DayPicker.jsx | 6 +- test/components/DayPicker_spec.jsx | 104 +++++++++++++++++++++++++++++ 2 files changed, 108 insertions(+), 2 deletions(-) diff --git a/src/components/DayPicker.jsx b/src/components/DayPicker.jsx index 34345f725..a5aff8b12 100644 --- a/src/components/DayPicker.jsx +++ b/src/components/DayPicker.jsx @@ -473,10 +473,11 @@ class DayPicker extends React.PureComponent { e.preventDefault(); if (isRTL) { newFocusedDate.add(1, 'day'); + didTransitionMonth = this.maybeTransitionNextMonth(newFocusedDate); } else { newFocusedDate.subtract(1, 'day'); + didTransitionMonth = this.maybeTransitionPrevMonth(newFocusedDate); } - didTransitionMonth = this.maybeTransitionPrevMonth(newFocusedDate); break; case 'Home': e.preventDefault(); @@ -498,10 +499,11 @@ class DayPicker extends React.PureComponent { e.preventDefault(); if (isRTL) { newFocusedDate.subtract(1, 'day'); + didTransitionMonth = this.maybeTransitionPrevMonth(newFocusedDate); } else { newFocusedDate.add(1, 'day'); + didTransitionMonth = this.maybeTransitionNextMonth(newFocusedDate); } - didTransitionMonth = this.maybeTransitionNextMonth(newFocusedDate); break; case 'End': e.preventDefault(); diff --git a/test/components/DayPicker_spec.jsx b/test/components/DayPicker_spec.jsx index 46d0697f9..ed005f40c 100644 --- a/test/components/DayPicker_spec.jsx +++ b/test/components/DayPicker_spec.jsx @@ -296,6 +296,58 @@ describe('DayPicker', () => { const arg = maybeTransitionPrevMonthSpy.getCall(0).args[0]; expect(arg.isSame(oneDayBefore, 'day')).to.equal(true); }); + + it('arg is end of previous month', () => { + const startOfThisMonth = today.clone().startOf('month'); + const endOfPrevMonth = startOfThisMonth.clone().subtract(1, 'day'); + + const maybeTransitionPrevMonthSpy = sinon.spy(PureDayPicker.prototype, 'maybeTransitionPrevMonth'); + const wrapper = shallow().dive(); + wrapper.setState({ + focusedDate: startOfThisMonth, + }); + wrapper.instance().onKeyDown({ ...event, key: 'ArrowLeft' }); + const arg = maybeTransitionPrevMonthSpy.getCall(0).args[0]; + expect(arg.isSame(endOfPrevMonth, 'day')).to.equal(true); + }); + }); + + describe('ArrowLeft -- RTL', () => { + it('calls maybeTransitionNextMonth', () => { + const maybeTransitionNextMonthSpy = sinon.spy(PureDayPicker.prototype, 'maybeTransitionNextMonth'); + const wrapper = shallow().dive(); + wrapper.setState({ + focusedDate: today, + }); + wrapper.instance().onKeyDown({ ...event, key: 'ArrowLeft' }); + expect(maybeTransitionNextMonthSpy.callCount).to.equal(1); + }); + + it('arg is 1 day after focusedDate', () => { + const oneDayAfter = today.clone().add(1, 'day'); + const maybeTransitionNextMonthSpy = sinon.spy(PureDayPicker.prototype, 'maybeTransitionNextMonth'); + const wrapper = shallow().dive(); + wrapper.setState({ + focusedDate: today, + }); + wrapper.instance().onKeyDown({ ...event, key: 'ArrowLeft' }); + const arg = maybeTransitionNextMonthSpy.getCall(0).args[0]; + expect(arg.isSame(oneDayAfter, 'day')).to.equal(true); + }); + + it('arg is start of next month', () => { + const endOfThisMonth = today.clone().endOf('month'); + const startOfNextMonth = endOfThisMonth.clone().add(1, 'day'); + + const maybeTransitionNextMonthSpy = sinon.spy(PureDayPicker.prototype, 'maybeTransitionNextMonth'); + const wrapper = shallow().dive(); + wrapper.setState({ + focusedDate: endOfThisMonth, + }); + wrapper.instance().onKeyDown({ ...event, key: 'ArrowLeft' }); + const arg = maybeTransitionNextMonthSpy.getCall(0).args[0]; + expect(arg.isSame(startOfNextMonth, 'day')).to.equal(true); + }); }); describe('Home', () => { @@ -392,6 +444,58 @@ describe('DayPicker', () => { const arg = maybeTransitionNextMonthSpy.getCall(0).args[0]; expect(arg.isSame(oneDayAfter, 'day')).to.equal(true); }); + + it('arg is start of next month', () => { + const endOfThisMonth = today.clone().endOf('month'); + const startOfNextMonth = endOfThisMonth.clone().add(1, 'day'); + + const maybeTransitionNextMonthSpy = sinon.spy(PureDayPicker.prototype, 'maybeTransitionNextMonth'); + const wrapper = shallow().dive(); + wrapper.setState({ + focusedDate: endOfThisMonth, + }); + wrapper.instance().onKeyDown({ ...event, key: 'ArrowRight' }); + const arg = maybeTransitionNextMonthSpy.getCall(0).args[0]; + expect(arg.isSame(startOfNextMonth, 'day')).to.equal(true); + }); + }); + + describe('ArrowRight -- RTL', () => { + it('calls maybeTransitionPrevMonth', () => { + const maybeTransitionPrevMonthSpy = sinon.spy(PureDayPicker.prototype, 'maybeTransitionPrevMonth'); + const wrapper = shallow().dive(); + wrapper.setState({ + focusedDate: today, + }); + wrapper.instance().onKeyDown({ ...event, key: 'ArrowRight' }); + expect(maybeTransitionPrevMonthSpy.callCount).to.equal(1); + }); + + it('arg is 1 day before focusedDate', () => { + const oneDayBefore = today.clone().subtract(1, 'day'); + const maybeTransitionPrevMonthSpy = sinon.spy(PureDayPicker.prototype, 'maybeTransitionPrevMonth'); + const wrapper = shallow().dive(); + wrapper.setState({ + focusedDate: today, + }); + wrapper.instance().onKeyDown({ ...event, key: 'ArrowRight' }); + const arg = maybeTransitionPrevMonthSpy.getCall(0).args[0]; + expect(arg.isSame(oneDayBefore, 'day')).to.equal(true); + }); + + it('arg is end of previous month', () => { + const startOfThisMonth = today.clone().startOf('month'); + const endOfPrevMonth = startOfThisMonth.clone().subtract(1, 'day'); + + const maybeTransitionPrevMonthSpy = sinon.spy(PureDayPicker.prototype, 'maybeTransitionPrevMonth'); + const wrapper = shallow().dive(); + wrapper.setState({ + focusedDate: startOfThisMonth, + }); + wrapper.instance().onKeyDown({ ...event, key: 'ArrowRight' }); + const arg = maybeTransitionPrevMonthSpy.getCall(0).args[0]; + expect(arg.isSame(endOfPrevMonth, 'day')).to.equal(true); + }); }); describe('End', () => { From 7490089eb2d4a31b0ce3a6a0aa6681025436e486 Mon Sep 17 00:00:00 2001 From: Jay Swain Date: Tue, 27 Nov 2018 16:59:21 -0800 Subject: [PATCH 10/31] [Fix] `DayPicker`, `DayPickerSingleDateController`: Snap to new date if date is off screen Fixes #1320. Co-authored-by: Jay Swain Co-authored-by: Jordan Harband --- src/components/DayPicker.jsx | 6 ++ .../DayPickerSingleDateController.jsx | 6 ++ .../DayPickerSingleDateController_spec.jsx | 26 +++++++ test/components/DayPicker_spec.jsx | 67 ++++++++++++++++--- 4 files changed, 96 insertions(+), 9 deletions(-) diff --git a/src/components/DayPicker.jsx b/src/components/DayPicker.jsx index a5aff8b12..0d25a948c 100644 --- a/src/components/DayPicker.jsx +++ b/src/components/DayPicker.jsx @@ -300,6 +300,12 @@ class DayPicker extends React.PureComponent { this.setState({ currentMonth: nextProps.initialVisibleMonth(), }); + } else { + const { numberOfMonths } = this.props; + const newDate = nextProps.initialVisibleMonth(); + if (!isDayVisible(newDate, currentMonth, numberOfMonths)) { + this.onMonthChange(newDate); + } } } diff --git a/src/components/DayPickerSingleDateController.jsx b/src/components/DayPickerSingleDateController.jsx index de492c3a2..36705917a 100644 --- a/src/components/DayPickerSingleDateController.jsx +++ b/src/components/DayPickerSingleDateController.jsx @@ -268,6 +268,7 @@ export default class DayPickerSingleDateController extends React.PureComponent { const recomputePropModifiers = ( recomputeOutsideRange || recomputeDayBlocked || recomputeDayHighlighted ); + const { currentMonth: prevCurrentMonth } = this.state; if ( numberOfMonths !== prevNumberOfMonths @@ -277,6 +278,11 @@ export default class DayPickerSingleDateController extends React.PureComponent { && !prevFocused && focused ) + || ( + prevDate + && prevDate.diff(date) + && !isDayVisible(date, prevCurrentMonth, numberOfMonths) + ) ) { const newMonthState = this.getStateForNewMonth(nextProps); const { currentMonth } = newMonthState; diff --git a/test/components/DayPickerSingleDateController_spec.jsx b/test/components/DayPickerSingleDateController_spec.jsx index 3bc892f63..f6a62e04e 100644 --- a/test/components/DayPickerSingleDateController_spec.jsx +++ b/test/components/DayPickerSingleDateController_spec.jsx @@ -47,6 +47,32 @@ describe('DayPickerSingleDateController', () => { onFocusChange() {}, }; + describe('props.date changed', () => { + describe('date is not visible', () => { + it('setState gets called with new month', () => { + sinon.stub(isDayVisible, 'default').returns(false); + const date = today; + const newDate = moment().add(1, 'month'); + const wrapper = shallow(); + expect(wrapper.state()).to.have.property('currentMonth', date); + wrapper.instance().componentWillReceiveProps({ ...props, date: newDate }); + expect(wrapper.state()).to.have.property('currentMonth', newDate); + }); + }); + + describe('date is visible', () => { + it('setState gets called with existing month', () => { + sinon.stub(isDayVisible, 'default').returns(true); + const date = today; + const newDate = moment().add(1, 'month'); + const wrapper = shallow(); + expect(wrapper.state()).to.have.property('currentMonth', date); + wrapper.instance().componentWillReceiveProps({ ...props, date: newDate }); + expect(wrapper.state()).to.have.property('currentMonth', date); + }); + }); + }); + describe('modifiers', () => { describe('selected modifier', () => { describe('props.date did not change', () => { diff --git a/test/components/DayPicker_spec.jsx b/test/components/DayPicker_spec.jsx index ed005f40c..53070b483 100644 --- a/test/components/DayPicker_spec.jsx +++ b/test/components/DayPicker_spec.jsx @@ -7,7 +7,7 @@ import { mount, shallow } from 'enzyme'; import * as isDayVisible from '../../src/utils/isDayVisible'; import isSameMonth from '../../src/utils/isSameMonth'; -import DayPicker, { PureDayPicker } from '../../src/components/DayPicker'; +import DayPicker, { PureDayPicker, defaultProps as DayPickerDefaultProps } from '../../src/components/DayPicker'; import CalendarMonthGrid from '../../src/components/CalendarMonthGrid'; import DayPickerNavigation from '../../src/components/DayPickerNavigation'; import DayPickerKeyboardShortcuts from '../../src/components/DayPickerKeyboardShortcuts'; @@ -1022,7 +1022,7 @@ describe('DayPicker', () => { }); it('does not update state.currentMonthScrollTop', () => { - sinon.spy(DayPicker.prototype, 'setTransitionContainerRef'); + sinon.spy(PureDayPicker.prototype, 'setTransitionContainerRef'); const wrapper = mount(); expect(wrapper.state().currentMonthScrollTop).to.equal(null); }); @@ -1035,7 +1035,7 @@ describe('DayPicker', () => { }); it('does not update state.currentMonthScrollTop', () => { - sinon.spy(DayPicker.prototype, 'setTransitionContainerRef'); + sinon.spy(PureDayPicker.prototype, 'setTransitionContainerRef'); const wrapper = mount(); expect(wrapper.state().currentMonthScrollTop).to.equal(null); }); @@ -1043,17 +1043,17 @@ describe('DayPicker', () => { describe('props.orientation === VERTICAL_SCROLLABLE', () => { it('updates state.currentMonthScrollTop', () => { - sinon.spy(DayPicker.prototype, 'setTransitionContainerRef'); + sinon.spy(PureDayPicker.prototype, 'setTransitionContainerRef'); const wrapper = mount(); expect(wrapper.state().currentMonthScrollTop).to.not.equal(null); }); }); }); - describe.skip('#componentWillReceiveProps', () => { - describe('props.orientation === VERTICAL_SCROLLABLE', () => { + describe('#componentWillReceiveProps', () => { + describe.skip('props.orientation === VERTICAL_SCROLLABLE', () => { it('updates state.currentMonthScrollTop', () => { - sinon.spy(DayPicker.prototype, 'setTransitionContainerRef'); + sinon.spy(PureDayPicker.prototype, 'setTransitionContainerRef'); const wrapper = mount(); const prevCurrentMonthScrollTop = wrapper.state().currentMonthScrollTop; wrapper.setState({ @@ -1063,6 +1063,55 @@ describe('DayPicker', () => { expect(wrapper.state().currentMonthScrollTop).to.not.equal(prevCurrentMonthScrollTop); }); }); + + describe('props.date changed', () => { + const props = { + ...DayPickerDefaultProps, + onDateChange() {}, + onFocusChange() {}, + initialVisibleMonth() { return today; }, + theme: { reactDates: { spacing: {} } }, + styles: {}, + }; + + describe('date is not visible', () => { + it('setState gets called with new month', () => { + sinon.stub(isDayVisible, 'default').returns(false); + const date = today; + const newDate = date.clone().add(1, 'month'); + const wrapper = shallow(); + expect(wrapper.state().currentMonth).to.eql(date); + wrapper.instance().componentWillReceiveProps( + { + ...props, + date: newDate, + initialVisibleMonth() { return newDate; }, + }, + {}, + ); + expect(wrapper.state().currentMonth).to.eql(newDate); + }); + }); + + describe('date is visible', () => { + it('setState gets called with existing month', () => { + sinon.stub(isDayVisible, 'default').returns(true); + const date = today; + const newDate = date.clone().add(1, 'month'); + const wrapper = shallow(); + expect(wrapper.state().currentMonth).to.eql(date); + wrapper.instance().componentWillReceiveProps( + { + ...props, + date: newDate, + initialVisibleMonth() { return newDate; }, + }, + {}, + ); + expect(wrapper.state().currentMonth).to.eql(date); + }); + }); + }); }); describe('#componentDidUpdate', () => { @@ -1199,7 +1248,7 @@ describe('DayPicker', () => { describe.skip('props.orientation === VERTICAL_SCROLLABLE', () => { it('does not update transitionContainer ref`s scrollTop currentMonth stays the same', () => { - sinon.spy(DayPicker.prototype, 'setTransitionContainerRef'); + sinon.spy(PureDayPicker.prototype, 'setTransitionContainerRef'); const wrapper = mount(); const prevScrollTop = wrapper.transitionContainer.scrollTop; wrapper.setState({ @@ -1209,7 +1258,7 @@ describe('DayPicker', () => { }); it('updates transitionContainer ref`s scrollTop currentMonth changes', () => { - sinon.spy(DayPicker.prototype, 'setTransitionContainerRef'); + sinon.spy(PureDayPicker.prototype, 'setTransitionContainerRef'); const wrapper = mount(); const prevScrollTop = wrapper.transitionContainer.scrollTop; wrapper.setState({ From fe31485fad71929eabbb349403f9deccff466b72 Mon Sep 17 00:00:00 2001 From: Cedric Sohrauer Date: Tue, 2 Jul 2019 18:08:18 +0200 Subject: [PATCH 11/31] [Tests] add shared `describeIfWindow` helper --- test/_helpers/describeIfWindow.js | 1 + test/components/DateRangePicker_spec.jsx | 2 +- test/components/SingleDatePicker_spec.jsx | 2 +- test/utils/disableScroll_spec.js | 2 +- 4 files changed, 4 insertions(+), 3 deletions(-) create mode 100644 test/_helpers/describeIfWindow.js diff --git a/test/_helpers/describeIfWindow.js b/test/_helpers/describeIfWindow.js new file mode 100644 index 000000000..0889ec0a7 --- /dev/null +++ b/test/_helpers/describeIfWindow.js @@ -0,0 +1 @@ +export default typeof document === 'undefined' ? describe.skip : describe; diff --git a/test/components/DateRangePicker_spec.jsx b/test/components/DateRangePicker_spec.jsx index 7f20e12d7..ca34ae3f8 100644 --- a/test/components/DateRangePicker_spec.jsx +++ b/test/components/DateRangePicker_spec.jsx @@ -16,7 +16,7 @@ import { START_DATE, } from '../../src/constants'; -const describeIfWindow = typeof document === 'undefined' ? describe.skip : describe; +import describeIfWindow from '../_helpers/describeIfWindow'; class DateRangePickerWrapper extends React.Component { constructor(props) { diff --git a/test/components/SingleDatePicker_spec.jsx b/test/components/SingleDatePicker_spec.jsx index 05f2a217b..b94e18481 100644 --- a/test/components/SingleDatePicker_spec.jsx +++ b/test/components/SingleDatePicker_spec.jsx @@ -9,7 +9,7 @@ import DayPickerSingleDateController from '../../src/components/DayPickerSingleD import SingleDatePickerInputController from '../../src/components/SingleDatePickerInputController'; import SingleDatePicker, { PureSingleDatePicker } from '../../src/components/SingleDatePicker'; -const describeIfWindow = typeof document === 'undefined' ? describe.skip : describe; +import describeIfWindow from '../_helpers/describeIfWindow'; describe('SingleDatePicker', () => { afterEach(() => { diff --git a/test/utils/disableScroll_spec.js b/test/utils/disableScroll_spec.js index 8063b578f..6a0602107 100644 --- a/test/utils/disableScroll_spec.js +++ b/test/utils/disableScroll_spec.js @@ -5,7 +5,7 @@ import disableScroll, { getScrollAncestorsOverflowY, } from '../../src/utils/disableScroll'; -const describeIfWindow = typeof document === 'undefined' ? describe.skip : describe; +import describeIfWindow from '../_helpers/describeIfWindow'; const createScrollContainer = (level = 1) => { const el = document.createElement('div'); From 17c3c881bcc890dc02d2423f90dcdfb6b478fe26 Mon Sep 17 00:00:00 2001 From: Cedric Sohrauer Date: Tue, 2 Jul 2019 18:08:18 +0200 Subject: [PATCH 12/31] [Fix] `CalendarMonth`: recompute month title height when rerendering --- src/components/CalendarMonth.jsx | 14 ++++++++- test/components/CalendarMonth_spec.jsx | 40 +++++++++++++++++++++++++- 2 files changed, 52 insertions(+), 2 deletions(-) diff --git a/src/components/CalendarMonth.jsx b/src/components/CalendarMonth.jsx index 0c9002fbf..d20650b2e 100644 --- a/src/components/CalendarMonth.jsx +++ b/src/components/CalendarMonth.jsx @@ -106,7 +106,7 @@ class CalendarMonth extends React.PureComponent { } componentDidMount() { - this.setMonthTitleHeightTimeout = setTimeout(this.setMonthTitleHeight, 0); + this.queueSetMonthTitleHeight(); } componentWillReceiveProps(nextProps) { @@ -131,6 +131,14 @@ class CalendarMonth extends React.PureComponent { } } + componentDidUpdate(prevProps) { + const { setMonthTitleHeight } = this.props; + + if (prevProps.setMonthTitleHeight === null && setMonthTitleHeight !== null) { + this.queueSetMonthTitleHeight(); + } + } + componentWillUnmount() { if (this.setMonthTitleHeightTimeout) { clearTimeout(this.setMonthTitleHeightTimeout); @@ -149,6 +157,10 @@ class CalendarMonth extends React.PureComponent { this.captionRef = ref; } + queueSetMonthTitleHeight() { + this.setMonthTitleHeightTimeout = window.setTimeout(this.setMonthTitleHeight, 0); + } + render() { const { dayAriaLabelFormat, diff --git a/test/components/CalendarMonth_spec.jsx b/test/components/CalendarMonth_spec.jsx index 05a3a6dd8..1a0ab8966 100644 --- a/test/components/CalendarMonth_spec.jsx +++ b/test/components/CalendarMonth_spec.jsx @@ -1,8 +1,9 @@ import React from 'react'; import { expect } from 'chai'; -import { shallow } from 'enzyme'; +import { shallow, mount } from 'enzyme'; import sinon from 'sinon-sandbox'; import moment from 'moment'; +import describeIfWindow from '../_helpers/describeIfWindow'; import CalendarMonth from '../../src/components/CalendarMonth'; @@ -46,5 +47,42 @@ describe('CalendarMonth', () => { expect(typeof isVisible).to.equal('boolean'); expect(wrapper.find('#month-element').exists()).to.equal(true); }); + + describeIfWindow('setMonthTitleHeight', () => { + beforeEach(() => { + sinon.stub(window, 'setTimeout').callsFake((handler) => handler()); + }); + + it('sets the title height after mount', () => { + const setMonthTitleHeightStub = sinon.stub(); + mount( + , + ); + + expect(setMonthTitleHeightStub).to.have.property('callCount', 1); + }); + + describe('if the callbacks gets set again', () => { + it('updates the title height', () => { + const setMonthTitleHeightStub = sinon.stub(); + const wrapper = mount( + , + ); + + expect(setMonthTitleHeightStub).to.have.property('callCount', 1); + + wrapper.setProps({ setMonthTitleHeight: null }); + + wrapper.setProps({ setMonthTitleHeight: setMonthTitleHeightStub }); + expect(setMonthTitleHeightStub).to.have.property('callCount', 2); + }); + }); + }); }); }); From ba61165b236d4e6ea053d0d34553468dbdaa4940 Mon Sep 17 00:00:00 2001 From: mmarkelov Date: Thu, 9 Jan 2020 13:11:41 +0300 Subject: [PATCH 13/31] [Fix] `DateRangePickerInputController`: fix onClose method --- .../DateRangePickerInputController.jsx | 7 ++++++- .../DateRangePickerInputController_spec.jsx | 17 +++++++++++++++++ 2 files changed, 23 insertions(+), 1 deletion(-) diff --git a/src/components/DateRangePickerInputController.jsx b/src/components/DateRangePickerInputController.jsx index 56d2a39fd..b2c9ad713 100644 --- a/src/components/DateRangePickerInputController.jsx +++ b/src/components/DateRangePickerInputController.jsx @@ -179,6 +179,8 @@ export default class DateRangePickerInputController extends React.PureComponent minimumNights, keepOpenOnDateSelect, onDatesChange, + onClose, + onFocusChange, } = this.props; const endDate = toMomentObject(endDateString, this.getDisplayFormat()); @@ -188,7 +190,10 @@ export default class DateRangePickerInputController extends React.PureComponent && !(startDate && isBeforeDay(endDate, startDate.clone().add(minimumNights, 'days'))); if (isEndDateValid) { onDatesChange({ startDate, endDate }); - if (!keepOpenOnDateSelect) this.onClearFocus(); + if (!keepOpenOnDateSelect) { + onFocusChange(null); + onClose({ startDate, endDate }); + } } else { onDatesChange({ startDate, diff --git a/test/components/DateRangePickerInputController_spec.jsx b/test/components/DateRangePickerInputController_spec.jsx index b6112065b..a5f63e153 100644 --- a/test/components/DateRangePickerInputController_spec.jsx +++ b/test/components/DateRangePickerInputController_spec.jsx @@ -221,6 +221,23 @@ describe('DateRangePickerInputController', () => { expect(isSameDay(onDatesChangeArgs.endDate, futureDate)).to.equal(true); }); + it('calls props.onClose with props.startDate and provided end date', () => { + const onCloseStub = sinon.stub(); + const wrapper = shallow(( + + )); + wrapper.instance().onEndDateChange(validFutureDateString); + expect(onCloseStub).to.have.property('callCount', 1); + + const [onCloseArgs] = onCloseStub.getCall(0).args; + const futureDate = moment(validFutureDateString); + expect(onCloseArgs).to.have.property('startDate', startDate); + expect(isSameDay(onCloseArgs.endDate, futureDate)).to.equal(true); + }); + describe('props.onFocusChange', () => { it('is called once', () => { const onFocusChangeStub = sinon.stub(); From dce9c227e305072d34aa62d3f9384a13a89f666c Mon Sep 17 00:00:00 2001 From: Maja Wichrowska Date: Fri, 11 Oct 2019 20:35:48 -0700 Subject: [PATCH 14/31] Revert "Revert "[Tests] `DayPicker`: unit test for getWeekHeaders()"" This reverts commit defb7fd680cab4154d12e9416c9f28e4a47e9e5b. --- test/components/DayPicker_spec.jsx | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/test/components/DayPicker_spec.jsx b/test/components/DayPicker_spec.jsx index 53070b483..6b11bf379 100644 --- a/test/components/DayPicker_spec.jsx +++ b/test/components/DayPicker_spec.jsx @@ -3,6 +3,7 @@ import moment from 'moment/min/moment-with-locales'; import { expect } from 'chai'; import sinon from 'sinon-sandbox'; import { mount, shallow } from 'enzyme'; +import { cloneDeep } from 'lodash'; import * as isDayVisible from '../../src/utils/isDayVisible'; import isSameMonth from '../../src/utils/isSameMonth'; @@ -1013,6 +1014,23 @@ describe('DayPicker', () => { }); }); + describe('#getWeekHeaders', () => { + it('returns unmutated weekday headers for currentMonth in a future', () => { + sinon.stub(PureDayPicker.prototype, 'render').returns(null); + + const getWeekHeadersSpy = sinon.spy(PureDayPicker.prototype, 'getWeekHeaders'); + const INITIAL_MONTH = moment().add(2, 'Months').week(3).weekday(3); + const wrapper = shallow( INITIAL_MONTH} />).dive(); + const instance = wrapper.instance(); + const state = cloneDeep(wrapper.state()); + + expect(instance.getWeekHeaders()).to.be.eql(INITIAL_MONTH.localeData().weekdaysMin()); + expect(instance.state).not.to.equal(state); + expect(instance.state).to.eql(state); + expect(getWeekHeadersSpy).to.have.property('callCount', 1); + }); + }); + describe('life cycle methods', () => { describe.skip('#componentDidMount', () => { describe('props.orientation === HORIZONTAL_ORIENTATION', () => { From 57cba2f836a203f6ff246feb5edf423a3853953e Mon Sep 17 00:00:00 2001 From: mmarkelov Date: Tue, 17 Dec 2019 10:14:37 +0300 Subject: [PATCH 15/31] [Refactor] `CalendarMonthGrid`: Skip unnecessary setState --- src/components/CalendarMonthGrid.jsx | 44 +++++++++++----------- test/components/CalendarMonthGrid_spec.jsx | 15 ++++++++ 2 files changed, 38 insertions(+), 21 deletions(-) diff --git a/src/components/CalendarMonthGrid.jsx b/src/components/CalendarMonthGrid.jsx index 849635d42..8734f6e8f 100644 --- a/src/components/CalendarMonthGrid.jsx +++ b/src/components/CalendarMonthGrid.jsx @@ -151,33 +151,35 @@ class CalendarMonthGrid extends React.PureComponent { const hasNumberOfMonthsChanged = prevNumberOfMonths !== numberOfMonths; let newMonths = months; - if (hasMonthChanged && !hasNumberOfMonthsChanged) { - if (isNextMonth(prevInitialMonth, initialMonth)) { - newMonths = months.slice(1); - newMonths.push(months[months.length - 1].clone().add(1, 'month')); - } else if (isPrevMonth(prevInitialMonth, initialMonth)) { - newMonths = months.slice(0, months.length - 1); - newMonths.unshift(months[0].clone().subtract(1, 'month')); - } else { + if (hasMonthChanged || hasNumberOfMonthsChanged) { + if (hasMonthChanged && !hasNumberOfMonthsChanged) { + if (isNextMonth(prevInitialMonth, initialMonth)) { + newMonths = months.slice(1); + newMonths.push(months[months.length - 1].clone().add(1, 'month')); + } else if (isPrevMonth(prevInitialMonth, initialMonth)) { + newMonths = months.slice(0, months.length - 1); + newMonths.unshift(months[0].clone().subtract(1, 'month')); + } else { + const withoutTransitionMonths = orientation === VERTICAL_SCROLLABLE; + newMonths = getMonths(initialMonth, numberOfMonths, withoutTransitionMonths); + } + } + + if (hasNumberOfMonthsChanged) { const withoutTransitionMonths = orientation === VERTICAL_SCROLLABLE; newMonths = getMonths(initialMonth, numberOfMonths, withoutTransitionMonths); } - } - if (hasNumberOfMonthsChanged) { - const withoutTransitionMonths = orientation === VERTICAL_SCROLLABLE; - newMonths = getMonths(initialMonth, numberOfMonths, withoutTransitionMonths); - } + const momentLocale = moment.locale(); + if (this.locale !== momentLocale) { + this.locale = momentLocale; + newMonths = newMonths.map((m) => m.locale(this.locale)); + } - const momentLocale = moment.locale(); - if (this.locale !== momentLocale) { - this.locale = momentLocale; - newMonths = newMonths.map((m) => m.locale(this.locale)); + this.setState({ + months: newMonths, + }); } - - this.setState({ - months: newMonths, - }); } componentDidUpdate() { diff --git a/test/components/CalendarMonthGrid_spec.jsx b/test/components/CalendarMonthGrid_spec.jsx index 209d7a3d9..3461a18ec 100644 --- a/test/components/CalendarMonthGrid_spec.jsx +++ b/test/components/CalendarMonthGrid_spec.jsx @@ -45,6 +45,21 @@ describe('CalendarMonthGrid', () => { expect(Object.keys(collisions).length).to.equal(months.length); }); + it('does not setState if hasMonthChanged and hasNumberOfMonthsChanged are falsy', () => { + const setState = sinon.stub(CalendarMonthGrid.prototype, 'setState'); + const initialMonth = moment(); + const wrapper = shallow(( + + )).dive(); + + wrapper.instance().componentWillReceiveProps({ + initialMonth, + numberOfMonths: 12, + }); + + expect(setState.callCount).to.eq(0); + }); + it('works with the same number of months', () => { const initialMonth = moment(); const wrapper = shallow(( From a83df7eac8c85e48326c2a44951ae21d086d7498 Mon Sep 17 00:00:00 2001 From: "maksim.markelov" Date: Thu, 28 Nov 2019 12:27:13 +0300 Subject: [PATCH 16/31] [Fix] `DateInput`: Fix invalid font-weight for regular option Fixes #1868. Closes #1869. --- src/components/DateInput.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/DateInput.jsx b/src/components/DateInput.jsx index e9c12dfcc..e24da287e 100644 --- a/src/components/DateInput.jsx +++ b/src/components/DateInput.jsx @@ -342,7 +342,7 @@ export default withStyles(({ }, DateInput_input__regular: { - fontWeight: 'auto', + fontWeight: 'inherit', }, DateInput_input__readOnly: { From d9b1dd0e0171af551fb8c61f0b23831b86d82a52 Mon Sep 17 00:00:00 2001 From: Cheng Wang Date: Sun, 19 Jan 2020 13:06:21 +0800 Subject: [PATCH 17/31] [Fix] use the injected css prop instead of the imported one --- src/components/CalendarDay.jsx | 3 ++- src/components/CalendarMonth.jsx | 3 ++- src/components/CalendarMonthGrid.jsx | 3 ++- src/components/CustomizableCalendarDay.jsx | 3 ++- src/components/DateInput.jsx | 3 ++- src/components/DateRangePicker.jsx | 4 +++- src/components/DateRangePickerInput.jsx | 3 ++- src/components/DayPicker.jsx | 4 +++- src/components/DayPickerKeyboardShortcuts.jsx | 3 ++- src/components/DayPickerNavigation.jsx | 3 ++- src/components/KeyboardShortcutRow.jsx | 3 ++- src/components/SingleDatePicker.jsx | 4 +++- src/components/SingleDatePickerInput.jsx | 3 ++- test/components/DayPicker_spec.jsx | 1 + 14 files changed, 30 insertions(+), 13 deletions(-) diff --git a/src/components/CalendarDay.jsx b/src/components/CalendarDay.jsx index 29816a1db..036a7c765 100644 --- a/src/components/CalendarDay.jsx +++ b/src/components/CalendarDay.jsx @@ -2,7 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import momentPropTypes from 'react-moment-proptypes'; import { forbidExtraProps, nonNegativeInteger } from 'airbnb-prop-types'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; import moment from 'moment'; import raf from 'raf'; @@ -105,6 +105,7 @@ class CalendarDay extends React.PureComponent { modifiers, renderDayContents, tabIndex, + css, styles, phrases, } = this.props; diff --git a/src/components/CalendarMonth.jsx b/src/components/CalendarMonth.jsx index d20650b2e..248a48641 100644 --- a/src/components/CalendarMonth.jsx +++ b/src/components/CalendarMonth.jsx @@ -4,7 +4,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import momentPropTypes from 'react-moment-proptypes'; import { forbidExtraProps, mutuallyExclusiveProps, nonNegativeInteger } from 'airbnb-prop-types'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; import moment from 'moment'; import { CalendarDayPhrases } from '../defaultPhrases'; @@ -183,6 +183,7 @@ class CalendarMonth extends React.PureComponent { renderDayContents, renderMonthElement, renderMonthText, + css, styles, verticalBorderSpacing, } = this.props; diff --git a/src/components/CalendarMonthGrid.jsx b/src/components/CalendarMonthGrid.jsx index 8734f6e8f..dd1c80bf8 100644 --- a/src/components/CalendarMonthGrid.jsx +++ b/src/components/CalendarMonthGrid.jsx @@ -2,7 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import momentPropTypes from 'react-moment-proptypes'; import { forbidExtraProps, mutuallyExclusiveProps, nonNegativeInteger } from 'airbnb-prop-types'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; import moment from 'moment'; import { addEventListener } from 'consolidated-events'; @@ -260,6 +260,7 @@ class CalendarMonthGrid extends React.PureComponent { focusedDate, isFocused, isRTL, + css, styles, phrases, dayAriaLabelFormat, diff --git a/src/components/CustomizableCalendarDay.jsx b/src/components/CustomizableCalendarDay.jsx index 2a3ee1575..ad3cdbb5d 100644 --- a/src/components/CustomizableCalendarDay.jsx +++ b/src/components/CustomizableCalendarDay.jsx @@ -2,7 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import momentPropTypes from 'react-moment-proptypes'; import { forbidExtraProps, nonNegativeInteger, or } from 'airbnb-prop-types'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; import moment from 'moment'; import raf from 'raf'; @@ -279,6 +279,7 @@ class CustomizableCalendarDay extends React.PureComponent { modifiers, tabIndex, renderDayContents, + css, styles, phrases, diff --git a/src/components/DateInput.jsx b/src/components/DateInput.jsx index e24da287e..ff486eb15 100644 --- a/src/components/DateInput.jsx +++ b/src/components/DateInput.jsx @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { forbidExtraProps, nonNegativeInteger } from 'airbnb-prop-types'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; import throttle from 'lodash/throttle'; import isTouchDevice from 'is-touch-device'; @@ -194,6 +194,7 @@ class DateInput extends React.PureComponent { small, regular, block, + css, styles, theme: { reactDates }, } = this.props; diff --git a/src/components/DateRangePicker.jsx b/src/components/DateRangePicker.jsx index 445d7e0c5..361056c7d 100644 --- a/src/components/DateRangePicker.jsx +++ b/src/components/DateRangePicker.jsx @@ -1,6 +1,6 @@ import React from 'react'; import moment from 'moment'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; import { Portal } from 'react-portal'; import { forbidExtraProps } from 'airbnb-prop-types'; import { addEventListener } from 'consolidated-events'; @@ -450,6 +450,7 @@ class DateRangePicker extends React.PureComponent { dayAriaLabelFormat, isRTL, weekDayFormat, + css, styles, verticalHeight, noBorder, @@ -616,6 +617,7 @@ class DateRangePicker extends React.PureComponent { verticalSpacing, small, regular, + css, styles, } = this.props; diff --git a/src/components/DateRangePickerInput.jsx b/src/components/DateRangePickerInput.jsx index 1f0a2551e..09e2ef7d8 100644 --- a/src/components/DateRangePickerInput.jsx +++ b/src/components/DateRangePickerInput.jsx @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { forbidExtraProps, nonNegativeInteger } from 'airbnb-prop-types'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; import { DateRangePickerInputPhrases } from '../defaultPhrases'; import getPhrasePropTypes from '../utils/getPhrasePropTypes'; @@ -180,6 +180,7 @@ function DateRangePickerInput({ verticalSpacing, small, regular, + css, styles, }) { const calendarIcon = customInputIcon || ( diff --git a/src/components/DayPicker.jsx b/src/components/DayPicker.jsx index 0d25a948c..a56653cd2 100644 --- a/src/components/DayPicker.jsx +++ b/src/components/DayPicker.jsx @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { forbidExtraProps, mutuallyExclusiveProps, nonNegativeInteger } from 'airbnb-prop-types'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; import moment from 'moment'; import throttle from 'lodash/throttle'; @@ -983,6 +983,7 @@ class DayPicker extends React.PureComponent { horizontalMonthPadding, orientation, renderWeekHeaderElement, + css, styles, } = this.props; @@ -1068,6 +1069,7 @@ class DayPicker extends React.PureComponent { daySize, isFocused, isRTL, + css, styles, theme, phrases, diff --git a/src/components/DayPickerKeyboardShortcuts.jsx b/src/components/DayPickerKeyboardShortcuts.jsx index 0f686a1c1..acb521e19 100644 --- a/src/components/DayPickerKeyboardShortcuts.jsx +++ b/src/components/DayPickerKeyboardShortcuts.jsx @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { forbidExtraProps } from 'airbnb-prop-types'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; import { DayPickerKeyboardShortcutsPhrases } from '../defaultPhrases'; import getPhrasePropTypes from '../utils/getPhrasePropTypes'; @@ -166,6 +166,7 @@ class DayPickerKeyboardShortcuts extends React.PureComponent { buttonLocation, showKeyboardShortcutsPanel, closeKeyboardShortcutsPanel, + css, styles, phrases, renderKeyboardShortcutsButton, diff --git a/src/components/DayPickerNavigation.jsx b/src/components/DayPickerNavigation.jsx index 1fc2ec3d2..9b576ef3c 100644 --- a/src/components/DayPickerNavigation.jsx +++ b/src/components/DayPickerNavigation.jsx @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { forbidExtraProps } from 'airbnb-prop-types'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; import { DayPickerNavigationPhrases } from '../defaultPhrases'; import getPhrasePropTypes from '../utils/getPhrasePropTypes'; @@ -84,6 +84,7 @@ class DayPickerNavigation extends React.PureComponent { renderNavNextButton, showNavPrevButton, showNavNextButton, + css, styles, } = this.props; diff --git a/src/components/KeyboardShortcutRow.jsx b/src/components/KeyboardShortcutRow.jsx index 7e3d2401c..2aa755a09 100644 --- a/src/components/KeyboardShortcutRow.jsx +++ b/src/components/KeyboardShortcutRow.jsx @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { forbidExtraProps } from 'airbnb-prop-types'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; const propTypes = forbidExtraProps({ ...withStylesPropTypes, @@ -20,6 +20,7 @@ function KeyboardShortcutRow({ label, action, block, + css, styles, }) { return ( diff --git a/src/components/SingleDatePicker.jsx b/src/components/SingleDatePicker.jsx index d1a5e3f19..1f7195b11 100644 --- a/src/components/SingleDatePicker.jsx +++ b/src/components/SingleDatePicker.jsx @@ -1,6 +1,6 @@ import React from 'react'; import moment from 'moment'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; import { Portal } from 'react-portal'; import { forbidExtraProps } from 'airbnb-prop-types'; import { addEventListener } from 'consolidated-events'; @@ -437,6 +437,7 @@ class SingleDatePicker extends React.PureComponent { isDayBlocked, isDayHighlighted, weekDayFormat, + css, styles, verticalHeight, transitionDuration, @@ -578,6 +579,7 @@ class SingleDatePicker extends React.PureComponent { verticalSpacing, reopenPickerOnClearDate, keepOpenOnDateSelect, + css, styles, isOutsideRange, isDayBlocked, diff --git a/src/components/SingleDatePickerInput.jsx b/src/components/SingleDatePickerInput.jsx index e6516704b..82a026983 100644 --- a/src/components/SingleDatePickerInput.jsx +++ b/src/components/SingleDatePickerInput.jsx @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { forbidExtraProps, nonNegativeInteger } from 'airbnb-prop-types'; -import { css, withStyles, withStylesPropTypes } from 'react-with-styles'; +import { withStyles, withStylesPropTypes } from 'react-with-styles'; import { SingleDatePickerInputPhrases } from '../defaultPhrases'; import getPhrasePropTypes from '../utils/getPhrasePropTypes'; @@ -131,6 +131,7 @@ function SingleDatePickerInput({ small, regular, verticalSpacing, + css, styles, }) { const calendarIcon = customInputIcon || ( diff --git a/test/components/DayPicker_spec.jsx b/test/components/DayPicker_spec.jsx index 6b11bf379..be120be3c 100644 --- a/test/components/DayPicker_spec.jsx +++ b/test/components/DayPicker_spec.jsx @@ -1090,6 +1090,7 @@ describe('DayPicker', () => { initialVisibleMonth() { return today; }, theme: { reactDates: { spacing: {} } }, styles: {}, + css() {}, }; describe('date is not visible', () => { From adec1c86590f1f86a4cd2537c6b780cdc35dd812 Mon Sep 17 00:00:00 2001 From: Alex Kubyshkin Date: Sat, 18 Sep 2021 19:31:01 +0300 Subject: [PATCH 18/31] [Fix] `DayPicker{,RangeController,SingleDateController}`: Start every day at noon(12:00). --- src/components/DayPicker.jsx | 6 +++--- src/components/DayPickerRangeController.jsx | 2 +- src/components/DayPickerSingleDateController.jsx | 2 +- src/utils/getNumberOfCalendarMonthWeeks.js | 2 +- src/utils/isDayVisible.js | 9 +++++---- test/components/DayPickerRangeController_spec.jsx | 15 +++++++++++++++ .../DayPickerSingleDateController_spec.jsx | 13 +++++++++++++ test/utils/isDayVisible_spec.js | 8 ++++++++ 8 files changed, 47 insertions(+), 10 deletions(-) diff --git a/src/components/DayPicker.jsx b/src/components/DayPicker.jsx index a56653cd2..83afc3468 100644 --- a/src/components/DayPicker.jsx +++ b/src/components/DayPicker.jsx @@ -203,7 +203,7 @@ class DayPicker extends React.PureComponent { const currentMonth = props.hidden ? moment() : props.initialVisibleMonth(); - let focusedDate = currentMonth.clone().startOf('month'); + let focusedDate = currentMonth.clone().startOf('month').hour(12); if (props.getFirstFocusableDay) { focusedDate = props.getFirstFocusableDay(currentMonth); } @@ -487,7 +487,7 @@ class DayPicker extends React.PureComponent { break; case 'Home': e.preventDefault(); - newFocusedDate.startOf('week'); + newFocusedDate.startOf('week').hour(12); didTransitionMonth = this.maybeTransitionPrevMonth(newFocusedDate); break; case 'PageUp': @@ -703,7 +703,7 @@ class DayPicker extends React.PureComponent { } if (newMonth && (!focusedDate || !isDayVisible(focusedDate, newMonth, numberOfMonths))) { - focusedDate = newMonth.clone().startOf('month'); + focusedDate = newMonth.clone().startOf('month').hour(12); } return focusedDate; diff --git a/src/components/DayPickerRangeController.jsx b/src/components/DayPickerRangeController.jsx index 87c61f054..988595a85 100644 --- a/src/components/DayPickerRangeController.jsx +++ b/src/components/DayPickerRangeController.jsx @@ -1045,7 +1045,7 @@ export default class DayPickerRangeController extends React.PureComponent { numberOfMonths, } = this.props; - let focusedDate = newMonth.clone().startOf('month'); + let focusedDate = newMonth.clone().startOf('month').hour(12); if (focusedInput === START_DATE && startDate) { focusedDate = startDate.clone(); } else if (focusedInput === END_DATE && !endDate && startDate) { diff --git a/src/components/DayPickerSingleDateController.jsx b/src/components/DayPickerSingleDateController.jsx index 36705917a..dad08cb14 100644 --- a/src/components/DayPickerSingleDateController.jsx +++ b/src/components/DayPickerSingleDateController.jsx @@ -545,7 +545,7 @@ export default class DayPickerSingleDateController extends React.PureComponent { getFirstFocusableDay(newMonth) { const { date, numberOfMonths } = this.props; - let focusedDate = newMonth.clone().startOf('month'); + let focusedDate = newMonth.clone().startOf('month').hour(12); if (date) { focusedDate = date.clone(); } diff --git a/src/utils/getNumberOfCalendarMonthWeeks.js b/src/utils/getNumberOfCalendarMonthWeeks.js index 0ed4da867..0e9482664 100644 --- a/src/utils/getNumberOfCalendarMonthWeeks.js +++ b/src/utils/getNumberOfCalendarMonthWeeks.js @@ -9,7 +9,7 @@ export default function getNumberOfCalendarMonthWeeks( month, firstDayOfWeek = moment.localeData().firstDayOfWeek(), ) { - const firstDayOfMonth = month.clone().startOf('month'); + const firstDayOfMonth = month.clone().startOf('month').hour(12); const numBlankDays = getBlankDaysBeforeFirstDay(firstDayOfMonth, firstDayOfWeek); return Math.ceil((numBlankDays + month.daysInMonth()) / 7); } diff --git a/src/utils/isDayVisible.js b/src/utils/isDayVisible.js index 34b942033..e0d43f376 100644 --- a/src/utils/isDayVisible.js +++ b/src/utils/isDayVisible.js @@ -21,7 +21,7 @@ export default function isDayVisible(day, month, numberOfMonths, enableOutsideDa if (enableOutsideDays) { if (!startCacheOutsideDays.has(startKey)) { - startCacheOutsideDays.set(startKey, month.clone().startOf('month').startOf('week')); + startCacheOutsideDays.set(startKey, month.clone().startOf('month').startOf('week').hour(12)); } if (isBeforeDay(day, startCacheOutsideDays.get(startKey))) return false; @@ -30,7 +30,8 @@ export default function isDayVisible(day, month, numberOfMonths, enableOutsideDa endCacheOutsideDays.set( endKey, month.clone().endOf('week').add(numberOfMonths - 1, 'months').endOf('month') - .endOf('week'), + .endOf('week') + .hour(12), ); } @@ -40,7 +41,7 @@ export default function isDayVisible(day, month, numberOfMonths, enableOutsideDa // !enableOutsideDays if (!startCacheInsideDays.has(startKey)) { - startCacheInsideDays.set(startKey, month.clone().startOf('month')); + startCacheInsideDays.set(startKey, month.clone().startOf('month').hour(12)); } if (isBeforeDay(day, startCacheInsideDays.get(startKey))) return false; @@ -48,7 +49,7 @@ export default function isDayVisible(day, month, numberOfMonths, enableOutsideDa if (!endCacheInsideDays.has(endKey)) { endCacheInsideDays.set( endKey, - month.clone().add(numberOfMonths - 1, 'months').endOf('month'), + month.clone().add(numberOfMonths - 1, 'months').endOf('month').hour(12), ); } diff --git a/test/components/DayPickerRangeController_spec.jsx b/test/components/DayPickerRangeController_spec.jsx index f530b93f8..c224009c7 100644 --- a/test/components/DayPickerRangeController_spec.jsx +++ b/test/components/DayPickerRangeController_spec.jsx @@ -3775,6 +3775,21 @@ describe('DayPickerRangeController', () => { }); }); + it('time is a noon', () => { + sinon.stub(DayPickerRangeController.prototype, 'isBlocked').returns(false); + const wrapper = shallow(( + + )); + const firstFocusableDay = wrapper.instance().getFirstFocusableDay(today); + expect(firstFocusableDay.hours()).to.equal(12); + }); + describe('desired day is blocked', () => { it('returns next unblocked visible day after desired day if exists', () => { const isBlockedStub = sinon.stub(DayPickerRangeController.prototype, 'isBlocked'); diff --git a/test/components/DayPickerSingleDateController_spec.jsx b/test/components/DayPickerSingleDateController_spec.jsx index f6a62e04e..5e6e09522 100644 --- a/test/components/DayPickerSingleDateController_spec.jsx +++ b/test/components/DayPickerSingleDateController_spec.jsx @@ -1000,6 +1000,19 @@ describe('DayPickerSingleDateController', () => { expect(firstFocusableDay.isSame(date, 'day')).to.equal(true); }); + it('time is a noon', () => { + sinon.stub(DayPickerSingleDateController.prototype, 'isBlocked').returns(false); + const wrapper = shallow(( + + )); + const firstFocusableDay = wrapper.instance().getFirstFocusableDay(today); + expect(firstFocusableDay.hours()).to.equal(12); + }); + describe('desired date is blocked', () => { it('returns first unblocked visible day if exists', () => { const isBlockedStub = sinon.stub(DayPickerSingleDateController.prototype, 'isBlocked'); diff --git a/test/utils/isDayVisible_spec.js b/test/utils/isDayVisible_spec.js index f42455b54..074c5f2e3 100644 --- a/test/utils/isDayVisible_spec.js +++ b/test/utils/isDayVisible_spec.js @@ -49,4 +49,12 @@ describe('#isDayVisible', () => { expect(isDayVisible(test, currentMonth, 1, true)).to.equal(false); }); }); + + // this test fails when run with the whole suite, + // potentially due to cache pollution from other tests + it.skip('works when the first day of the week that starts the month does not have a midnight', () => { + const march29 = moment('2020-03-29').utcOffset(-1 /* 'Atlantic/Azores' */); + const april2020 = moment('2020-04-02').utcOffset(-1 /* 'Atlantic/Azores' */); + expect(isDayVisible(march29, april2020, 1, true)).to.equal(true); + }); }); From fdcdc457cfeedecd8fc3572db1b6ba15fe3ab44c Mon Sep 17 00:00:00 2001 From: axsann <7417697+axsann@users.noreply.github.com> Date: Mon, 2 Mar 2020 18:52:42 +0900 Subject: [PATCH 19/31] [Fix] `DayPicker{Range,SingleDate}Controller`: Fix incorrect firstDayOfWeek null checking Co-authored-by: axsann <7417697+axsann@users.noreply.github.com> Co-authored-by: Jordan Harband --- src/components/DayPickerRangeController.jsx | 15 +++++++++++---- src/components/DayPickerSingleDateController.jsx | 15 +++++++++++---- test/components/DayPickerRangeController_spec.jsx | 13 +++++++++++++ .../DayPickerSingleDateController_spec.jsx | 13 +++++++++++++ 4 files changed, 48 insertions(+), 8 deletions(-) diff --git a/src/components/DayPickerRangeController.jsx b/src/components/DayPickerRangeController.jsx index 988595a85..881c4e75e 100644 --- a/src/components/DayPickerRangeController.jsx +++ b/src/components/DayPickerRangeController.jsx @@ -1036,6 +1036,15 @@ export default class DayPickerRangeController extends React.PureComponent { }); } + getFirstDayOfWeek() { + const { firstDayOfWeek } = this.props; + if (firstDayOfWeek == null) { + return moment.localeData().firstDayOfWeek(); + } + + return firstDayOfWeek; + } + getFirstFocusableDay(newMonth) { const { startDate, @@ -1250,13 +1259,11 @@ export default class DayPickerRangeController extends React.PureComponent { } isFirstDayOfWeek(day) { - const { firstDayOfWeek } = this.props; - return day.day() === (firstDayOfWeek || moment.localeData().firstDayOfWeek()); + return day.day() === this.getFirstDayOfWeek(); } isLastDayOfWeek(day) { - const { firstDayOfWeek } = this.props; - return day.day() === ((firstDayOfWeek || moment.localeData().firstDayOfWeek()) + 6) % 7; + return day.day() === (this.getFirstDayOfWeek() + 6) % 7; } isFirstPossibleEndDateForHoveredStartDate(day, hoverDate) { diff --git a/src/components/DayPickerSingleDateController.jsx b/src/components/DayPickerSingleDateController.jsx index dad08cb14..d4fae5360 100644 --- a/src/components/DayPickerSingleDateController.jsx +++ b/src/components/DayPickerSingleDateController.jsx @@ -542,6 +542,15 @@ export default class DayPickerSingleDateController extends React.PureComponent { }); } + getFirstDayOfWeek() { + const { firstDayOfWeek } = this.props; + if (firstDayOfWeek == null) { + return moment.localeData().firstDayOfWeek(); + } + + return firstDayOfWeek; + } + getFirstFocusableDay(newMonth) { const { date, numberOfMonths } = this.props; @@ -643,13 +652,11 @@ export default class DayPickerSingleDateController extends React.PureComponent { } isFirstDayOfWeek(day) { - const { firstDayOfWeek } = this.props; - return day.day() === (firstDayOfWeek || moment.localeData().firstDayOfWeek()); + return day.day() === this.getFirstDayOfWeek(); } isLastDayOfWeek(day) { - const { firstDayOfWeek } = this.props; - return day.day() === ((firstDayOfWeek || moment.localeData().firstDayOfWeek()) + 6) % 7; + return day.day() === (this.getFirstDayOfWeek() + 6) % 7; } render() { diff --git a/test/components/DayPickerRangeController_spec.jsx b/test/components/DayPickerRangeController_spec.jsx index c224009c7..55734c7b0 100644 --- a/test/components/DayPickerRangeController_spec.jsx +++ b/test/components/DayPickerRangeController_spec.jsx @@ -4946,6 +4946,19 @@ describe('DayPickerRangeController', () => { expect(wrapper.instance().isFirstDayOfWeek(moment().startOf('week').day(firstDayOfWeek))).to.equal(true); }); + it('returns true if first day of week and prop are both zero', () => { + const firstDayOfWeek = 0; + const wrapper = shallow(); + expect(wrapper.instance().isFirstDayOfWeek(moment().startOf('week').day(firstDayOfWeek))).to.equal(true); + }); + + it('returns true if first day of week is not zero, and prop is zero', () => { + sinon.stub(moment.localeData(), 'firstDayOfWeek').returns(1); + const firstDayOfWeek = 0; + const wrapper = shallow(); + expect(wrapper.instance().isFirstDayOfWeek(moment().startOf('week').day(firstDayOfWeek))).to.equal(true); + }); + it('returns false if not the first day of the week', () => { const wrapper = shallow(); expect(wrapper.instance().isFirstDayOfWeek(moment().endOf('week'))).to.equal(false); diff --git a/test/components/DayPickerSingleDateController_spec.jsx b/test/components/DayPickerSingleDateController_spec.jsx index 5e6e09522..a0ff33981 100644 --- a/test/components/DayPickerSingleDateController_spec.jsx +++ b/test/components/DayPickerSingleDateController_spec.jsx @@ -1634,6 +1634,19 @@ describe('DayPickerSingleDateController', () => { expect(wrapper.instance().isFirstDayOfWeek(moment().startOf('week').day(firstDayOfWeek))).to.equal(true); }); + it('returns true if first day of week and prop are both zero', () => { + const firstDayOfWeek = 0; + const wrapper = shallow(); + expect(wrapper.instance().isFirstDayOfWeek(moment().startOf('week').day(firstDayOfWeek))).to.equal(true); + }); + + it('returns true if first day of week is not zero, and prop is zero', () => { + sinon.stub(moment.localeData(), 'firstDayOfWeek').returns(1); + const firstDayOfWeek = 0; + const wrapper = shallow(); + expect(wrapper.instance().isFirstDayOfWeek(moment().startOf('week').day(firstDayOfWeek))).to.equal(true); + }); + it('returns false if not the first day of the week', () => { const wrapper = shallow(); expect(wrapper.instance().isFirstDayOfWeek(moment().endOf('week'))).to.equal(false); From 9494adb4616e2b42229bd510b789694dd9711ed4 Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Thu, 2 Dec 2021 23:49:54 -0800 Subject: [PATCH 20/31] [Deps] update `color2k`, `object.values`, `react-moment-proptypes`, `react-with-direction` --- package.json | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index 9400cc49f..b052d45f1 100644 --- a/package.json +++ b/package.json @@ -112,19 +112,19 @@ }, "dependencies": { "airbnb-prop-types": "^2.16.0", - "color2k": "^1.1.1", + "color2k": "^1.2.4", "consolidated-events": "^1.1.1 || ^2.0.0", "enzyme-shallow-equal": "^1.0.4", "is-touch-device": "^1.0.1", "lodash": "^4.1.1", "object.assign": "^4.1.2", - "object.values": "^1.1.2", + "object.values": "^1.1.5", "prop-types": "^15.7.2", "raf": "^3.4.1", - "react-moment-proptypes": "^1.7.0", + "react-moment-proptypes": "^1.8.1", "react-outside-click-handler": "^1.3.0", "react-portal": "^4.2.1", - "react-with-direction": "^1.3.1", + "react-with-direction": "^1.4.0", "react-with-styles": "~4.1.0", "react-with-styles-interface-css": "^6.0.0" }, @@ -132,8 +132,7 @@ "@babel/runtime": "^7.0.0", "moment": "^2.18.1", "react": "^0.14 || ^15.5.4 || ^16.1.1", - "react-dom": "^0.14 || ^15.5.4 || ^16.1.1", - "react-with-direction": "^1.3.1" + "react-dom": "^0.14 || ^15.5.4 || ^16.1.1" }, "engines": { "node": ">=0.10" From 0f5082fe296d74e3d99f9c8fd9d24ed200a15782 Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Fri, 21 Jan 2022 14:29:06 -0800 Subject: [PATCH 21/31] [meta] update repo URLs --- .storybook-css/config.js | 6 +- .storybook/config.js | 6 +- CHANGELOG.md | 616 +++++++++++------------ INTHEWILD.md | 2 +- README.md | 26 +- package.json | 6 +- stories/DayPickerRangeController.js | 2 +- stories/DayPickerSingleDateController.js | 2 +- stories/PresetDateRangePicker.js | 4 +- 9 files changed, 335 insertions(+), 335 deletions(-) diff --git a/.storybook-css/config.js b/.storybook-css/config.js index d6652020d..da06e751a 100644 --- a/.storybook-css/config.js +++ b/.storybook-css/config.js @@ -21,8 +21,8 @@ function getLink(href, text) { return `${text}`; } -const README = getLink('https://github.com/airbnb/react-dates/blob/master/README.md', 'README'); -const wrapperSource = getLink('https://github.com/airbnb/react-dates/tree/master/examples', 'wrapper source'); +const README = getLink('https://github.com/react-dates/react-dates/blob/HEAD/README.md', 'README'); +const wrapperSource = getLink('https://github.com/react-dates/react-dates/tree/HEAD/examples', 'wrapper source'); const helperText = `All examples are built using a wrapper component that is not exported by react-dates. Please see the ${README} for more information about minimal setup or explore @@ -52,7 +52,7 @@ addDecorator(story => ( setOptions({ name: 'REACT-DATES', - url: 'https://github.com/airbnb/react-dates', + url: 'https://github.com/react-dates/react-dates', }); function loadStories() { diff --git a/.storybook/config.js b/.storybook/config.js index 3882b6025..a14004d17 100644 --- a/.storybook/config.js +++ b/.storybook/config.js @@ -27,8 +27,8 @@ function getLink(href, text) { return `${text}`; } -const README = getLink('https://github.com/airbnb/react-dates/blob/master/README.md', 'README'); -const wrapperSource = getLink('https://github.com/airbnb/react-dates/tree/master/examples', 'wrapper source'); +const README = getLink('https://github.com/react-dates/react-dates/blob/HEAD/README.md', 'README'); +const wrapperSource = getLink('https://github.com/react-dates/react-dates/tree/HEAD/examples', 'wrapper source'); const helperText = `All examples are built using a wrapper component that is not exported by react-dates. Please see the ${README} for more information about minimal setup or explore @@ -58,7 +58,7 @@ addDecorator(story => ( setOptions({ name: 'REACT-DATES', - url: 'https://github.com/airbnb/react-dates', + url: 'https://github.com/react-dates/react-dates', }); function loadStories() { diff --git a/CHANGELOG.md b/CHANGELOG.md index f8bf0a1fd..ede78bcdb 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,46 +1,46 @@ # Change Log ## 21.8.0 -- [new] Add option to allow days violating min nights to be clicked ([#1913](https://github.com/airbnb/react-dates/pull/1913)) -- [fix] Prevent vertical scrollable prev nav button from overlapping weekday headers ([#1914](https://github.com/airbnb/react-dates/pull/1914)) +- [new] Add option to allow days violating min nights to be clicked ([#1913](https://github.com/react-dates/react-dates/pull/1913)) +- [fix] Prevent vertical scrollable prev nav button from overlapping weekday headers ([#1914](https://github.com/react-dates/react-dates/pull/1914)) ## 21.7.2 -- [fix] Add tests for previous fix ([#1912](https://github.com/airbnb/react-dates/pull/1912)) +- [fix] Add tests for previous fix ([#1912](https://github.com/react-dates/react-dates/pull/1912)) ## 21.7.1 -- [fix] Fix render conditional in DayPickerKeyboardShortcuts ([#1911](https://github.com/airbnb/react-dates/pull/1911)) +- [fix] Fix render conditional in DayPickerKeyboardShortcuts ([#1911](https://github.com/react-dates/react-dates/pull/1911)) ## 21.7.0 -- [fix] Keep scroll position when prev months rendered on vertical scrollable calendar ([#1902](https://github.com/airbnb/react-dates/pull/1902)) -- [new] Add ability to not show prev or next navigation buttons ([#1900](https://github.com/airbnb/react-dates/pull/1900)) -- [fix] Fix logic for applying default navigation button styling ([#1898](https://github.com/airbnb/react-dates/pull/1898)) +- [fix] Keep scroll position when prev months rendered on vertical scrollable calendar ([#1902](https://github.com/react-dates/react-dates/pull/1902)) +- [new] Add ability to not show prev or next navigation buttons ([#1900](https://github.com/react-dates/react-dates/pull/1900)) +- [fix] Fix logic for applying default navigation button styling ([#1898](https://github.com/react-dates/react-dates/pull/1898)) ## 21.6.0 -- [new] Add functionality to see previous months for vertical scrollable calendar ([#1894](https://github.com/airbnb/react-dates/pull/1894)) -- [new] Add support for noNavButtons in DayPickerSingleDateController (match DayPickerRangeController support) ([#1895](https://github.com/airbnb/react-dates/pull/1895)) +- [new] Add functionality to see previous months for vertical scrollable calendar ([#1894](https://github.com/react-dates/react-dates/pull/1894)) +- [new] Add support for noNavButtons in DayPickerSingleDateController (match DayPickerRangeController support) ([#1895](https://github.com/react-dates/react-dates/pull/1895)) ## 21.5.1 -- [fix] Remove redundant overflowY:scroll on CalendarMonthGrid ([#1881](https://github.com/airbnb/react-dates/pull/1881)) +- [fix] Remove redundant overflowY:scroll on CalendarMonthGrid ([#1881](https://github.com/react-dates/react-dates/pull/1881)) ## 21.5.0 -- [new] Add support for custom month navigation buttons ([#1859](https://github.com/airbnb/react-dates/pull/1859)) +- [new] Add support for custom month navigation buttons ([#1859](https://github.com/react-dates/react-dates/pull/1859)) ## 21.4.0 -- [new] Expose 'after-hovered-start' modifier and add 'before-hovered-end', 'no-selected-start-before-selected-end', 'selected-start-in-hovered-span', 'selected-end-in-hovered-span', 'selected-start-no-selected-end', and 'selected-end-no-selected-start' modifiers [#1608](https://github.com/airbnb/react-dates/pull/1608) -- [fix] Loosen up CustomizeableCalendarDay restriction on children ([#1857](https://github.com/airbnb/react-dates/pull/1857)) +- [new] Expose 'after-hovered-start' modifier and add 'before-hovered-end', 'no-selected-start-before-selected-end', 'selected-start-in-hovered-span', 'selected-end-in-hovered-span', 'selected-start-no-selected-end', and 'selected-end-no-selected-start' modifiers [#1608](https://github.com/react-dates/react-dates/pull/1608) +- [fix] Loosen up CustomizeableCalendarDay restriction on children ([#1857](https://github.com/react-dates/react-dates/pull/1857)) ## 21.3.2 -- [fix] Revert "Call getStateForNewMonth when date/startDate/endDate is set to a date that is not visible" ([#1851](https://github.com/airbnb/react-dates/pull/1851)) +- [fix] Revert "Call getStateForNewMonth when date/startDate/endDate is set to a date that is not visible" ([#1851](https://github.com/react-dates/react-dates/pull/1851)) ## 21.3.1 @@ -48,602 +48,602 @@ ## 21.3.0 -- [new] Update react-with-styles 4.0.1 -> 4.1.0 ([#1843](https://github.com/airbnb/react-dates/pull/1843)) -- [new] Add Input Font-Weight to Default Theme ([#1765](https://github.com/airbnb/react-dates/pull/#1765)) +- [new] Update react-with-styles 4.0.1 -> 4.1.0 ([#1843](https://github.com/react-dates/react-dates/pull/1843)) +- [new] Add Input Font-Weight to Default Theme ([#1765](https://github.com/react-dates/react-dates/pull/#1765)) ## 21.2.1 -- [fix] Call getStateForNewMonth when date/startDate/endDate is set to a date that is not visible ([#1834](https://github.com/airbnb/react-dates/pull/1834)) +- [fix] Call getStateForNewMonth when date/startDate/endDate is set to a date that is not visible ([#1834](https://github.com/react-dates/react-dates/pull/1834)) ## 21.2.0 -- [fix] Revert "Merge pull request [#1758](https://github.com/airbnb/react-dates/pull/1758): Remove all direct imports of css in favor of injected prop" ([#1818](https://github.com/airbnb/react-dates/pull/1818)) -- [fix] Fix for getWeekHeaders(), prevents it from changing state.currentMonth ([#1796](https://github.com/airbnb/react-dates/pull/1796)) -- [new] Add support for positioning month navigation under the calendar ([#1784](https://github.com/airbnb/react-dates/pull/1784)) -- [new] Add minDate and maxDate props to DateRangePicker ([#1793](https://github.com/airbnb/react-dates/pull/1793), [#1794](https://github.com/airbnb/react-dates/pull/1794)) +- [fix] Revert "Merge pull request [#1758](https://github.com/react-dates/react-dates/pull/1758): Remove all direct imports of css in favor of injected prop" ([#1818](https://github.com/react-dates/react-dates/pull/1818)) +- [fix] Fix for getWeekHeaders(), prevents it from changing state.currentMonth ([#1796](https://github.com/react-dates/react-dates/pull/1796)) +- [new] Add support for positioning month navigation under the calendar ([#1784](https://github.com/react-dates/react-dates/pull/1784)) +- [new] Add minDate and maxDate props to DateRangePicker ([#1793](https://github.com/react-dates/react-dates/pull/1793), [#1794](https://github.com/react-dates/react-dates/pull/1794)) ## 21.1.0 -- [fix] `DayPicker`: week headers: use the passed-in moment object’s instance, to support localy ([#1577](https://github.com/airbnb/react-dates/pull/1577)) -- [fix] Combine labelled DayPicker container elements ([#1783](https://github.com/airbnb/react-dates/pull/1783)) -- [new] Add a render function for customizable week header text ([#1787](https://github.com/airbnb/react-dates/pull/1787)) +- [fix] `DayPicker`: week headers: use the passed-in moment object’s instance, to support localy ([#1577](https://github.com/react-dates/react-dates/pull/1577)) +- [fix] Combine labelled DayPicker container elements ([#1783](https://github.com/react-dates/react-dates/pull/1783)) +- [new] Add a render function for customizable week header text ([#1787](https://github.com/react-dates/react-dates/pull/1787)) ## 21.0.1 -- [fix] [deps] Update react-with-styles ^4.0.0 -> ^4.0.1 ([#1781](https://github.com/airbnb/react-dates/pull/1781)) +- [fix] [deps] Update react-with-styles ^4.0.0 -> ^4.0.1 ([#1781](https://github.com/react-dates/react-dates/pull/1781)) ## 21.0.0 -- [breaking] [deps] Update react-with-styles and other deps ([#1761](https://github.com/airbnb/react-dates/pull/1761) -- [new] [deps] Update dependencies related to react-with-styles ([#1775](https://github.com/airbnb/react-dates/pull/1775)) -- [new] `DayPickerSingleDateController`: Add onMultiplyScrollableMonths ([#1770](https://github.com/airbnb/react-dates/pull/1770)) -- [dev] Fix moment date formats ([#1767](https://github.com/airbnb/react-dates/pull/1767)) -- [dev] Fix addons webpack loader, Fix tests ([#1764](https://github.com/airbnb/react-dates/pull/1764)) +- [breaking] [deps] Update react-with-styles and other deps ([#1761](https://github.com/react-dates/react-dates/pull/1761) +- [new] [deps] Update dependencies related to react-with-styles ([#1775](https://github.com/react-dates/react-dates/pull/1775)) +- [new] `DayPickerSingleDateController`: Add onMultiplyScrollableMonths ([#1770](https://github.com/react-dates/react-dates/pull/1770)) +- [dev] Fix moment date formats ([#1767](https://github.com/react-dates/react-dates/pull/1767)) +- [dev] Fix addons webpack loader, Fix tests ([#1764](https://github.com/react-dates/react-dates/pull/1764)) - [dev] build: fix linting (refs eslint/eslint#12119) - [new] [deps] update `@babel/runtime`, `airbnb-prop-types`, `object.values`, `prop-types`, `react-outside-click-handler`, `react-portal` - [dev] [deps] update `@babel/*`, `@storybook/*`, `babel-plugin-inline-svg`, `babel-plugin-istanbul`, `babel-preset-airbnb`, `eslint-config-airbnb` to v18 (plus peer deps), `eslint` to v6; `eslint-plugin-react-with-styles`, `karma`, `karma-firefox-launcher`, `mocha`, `safe-publish-latest`, `sass-loader`, `sinon`, `sinon-sandbox`, `coveralls`, `enzyme-adapter-react-helper` -- [fix] Remove all direct imports of css in favor of injected prop ([#1758](https://github.com/airbnb/react-dates/pull/1758)) +- [fix] Remove all direct imports of css in favor of injected prop ([#1758](https://github.com/react-dates/react-dates/pull/1758)) ## 20.3.0 -- [fix] Optimize setState dayPickerContainerStyles in responsivizePickerPosition ([#1735](https://github.com/airbnb/react-dates/pull/1735)) -- [fix] Stop calendar blinking on DateRangePickerInput focus switch (fixes #1523) ([#1553](https://github.com/airbnb/react-dates/pull/1553)) -- [new] [a11y] Add `aria-roledescription` ([#1746](https://github.com/airbnb/react-dates/pull/1746)) +- [fix] Optimize setState dayPickerContainerStyles in responsivizePickerPosition ([#1735](https://github.com/react-dates/react-dates/pull/1735)) +- [fix] Stop calendar blinking on DateRangePickerInput focus switch (fixes #1523) ([#1553](https://github.com/react-dates/react-dates/pull/1553)) +- [new] [a11y] Add `aria-roledescription` ([#1746](https://github.com/react-dates/react-dates/pull/1746)) ## 20.2.5 -- [fix] Defer day focusing until next animation frame ([#1707](https://github.com/airbnb/react-dates/pull/1707)) -- [fix] Fix startDate style (@mmarkelov, [#1710](https://github.com/airbnb/react-dates/pull/1710)) -- [fix] Pass correct props to SingleDatePicker on close (@AlokTakshak, [#1678](https://github.com/airbnb/react-dates/pull/1678)) -- [dev] Update blocked navigation (min/maxDate) stories (@ianduvall, [#1598](https://github.com/airbnb/react-dates/pull/1598)) -- [dev] Add positioning to custom navigation in stories (@dougmacknz, [#1573](https://github.com/airbnb/react-dates/pull/1573)) -- [dev] Update karma 3 → 4, mocha 3 → 6, nyc 12 → 14, sinon 6 → 7, eslint 5 → 6 ([#1713](https://github.com/airbnb/react-dates/pull/1713), [#1712](https://github.com/airbnb/react-dates/pull/1713)) +- [fix] Defer day focusing until next animation frame ([#1707](https://github.com/react-dates/react-dates/pull/1707)) +- [fix] Fix startDate style (@mmarkelov, [#1710](https://github.com/react-dates/react-dates/pull/1710)) +- [fix] Pass correct props to SingleDatePicker on close (@AlokTakshak, [#1678](https://github.com/react-dates/react-dates/pull/1678)) +- [dev] Update blocked navigation (min/maxDate) stories (@ianduvall, [#1598](https://github.com/react-dates/react-dates/pull/1598)) +- [dev] Add positioning to custom navigation in stories (@dougmacknz, [#1573](https://github.com/react-dates/react-dates/pull/1573)) +- [dev] Update karma 3 → 4, mocha 3 → 6, nyc 12 → 14, sinon 6 → 7, eslint 5 → 6 ([#1713](https://github.com/react-dates/react-dates/pull/1713), [#1712](https://github.com/react-dates/react-dates/pull/1713)) ## 20.2.4 - [fix] Replace react-addons-shallow-compare with enzyme-shallow-equal (bf7e3347702f) -- [fix] Optimize SVG assets ([#1690](https://github.com/airbnb/react-dates/pull/1690)) -- [fix] Update babel-preset-airbnb 3.2.1 -> 4.0.0 ([#1692](https://github.com/airbnb/react-dates/pull/1692)) +- [fix] Optimize SVG assets ([#1690](https://github.com/react-dates/react-dates/pull/1690)) +- [fix] Update babel-preset-airbnb 3.2.1 -> 4.0.0 ([#1692](https://github.com/react-dates/react-dates/pull/1692)) ## 20.2.3 -- [fix] Add guard for undefined objects in deleteModifier ([#1687](https://github.com/airbnb/react-dates/pull/1687)) -- [dev] Update Storybook from v4 to v5 ([@trotzig](https://github.com/trotzig) [#1673](https://github.com/airbnb/react-dates/pull/1673)) +- [fix] Add guard for undefined objects in deleteModifier ([#1687](https://github.com/react-dates/react-dates/pull/1687)) +- [dev] Update Storybook from v4 to v5 ([@trotzig](https://github.com/trotzig) [#1673](https://github.com/react-dates/react-dates/pull/1673)) ## 20.2.2 -- [fix] Add guard for undefined objects in addModifier ([#1667](https://github.com/airbnb/react-dates/pull/1667)) +- [fix] Add guard for undefined objects in addModifier ([#1667](https://github.com/react-dates/react-dates/pull/1667)) ## 20.2.1 -- [fix] Compile classes in loose mode ([#1655](https://github.com/airbnb/react-dates/pull/1655)) -- [fix] Performance optimizations ([#1656](https://github.com/airbnb/react-dates/pull/1656), [#1657](https://github.com/airbnb/react-dates/pull/1657), [#1659](https://github.com/airbnb/react-dates/pull/1659), [#1661](https://github.com/airbnb/react-dates/pull/1661), [#1662](https://github.com/airbnb/react-dates/pull/1662), and [#1663](https://github.com/airbnb/react-dates/pull/1663)) -- [docs] Add `initialVisibleMonth` to `DayPickerRangeController` in readme ([@AlokTakshak](https://github.com/AlokTakshak) [1652](https://github.com/airbnb/react-dates/pull/1652)) +- [fix] Compile classes in loose mode ([#1655](https://github.com/react-dates/react-dates/pull/1655)) +- [fix] Performance optimizations ([#1656](https://github.com/react-dates/react-dates/pull/1656), [#1657](https://github.com/react-dates/react-dates/pull/1657), [#1659](https://github.com/react-dates/react-dates/pull/1659), [#1661](https://github.com/react-dates/react-dates/pull/1661), [#1662](https://github.com/react-dates/react-dates/pull/1662), and [#1663](https://github.com/react-dates/react-dates/pull/1663)) +- [docs] Add `initialVisibleMonth` to `DayPickerRangeController` in readme ([@AlokTakshak](https://github.com/AlokTakshak) [1652](https://github.com/react-dates/react-dates/pull/1652)) ## 20.2.0 -- [fix] Fix date selection in the SDP ([#1530](https://github.com/airbnb/react-dates/pull/1530)) -- [new] Add explicit aria label props ([#1594](https://github.com/airbnb/react-dates/pull/1594)) +- [fix] Fix date selection in the SDP ([#1530](https://github.com/react-dates/react-dates/pull/1530)) +- [new] Add explicit aria label props ([#1594](https://github.com/react-dates/react-dates/pull/1594)) ## 20.1.0 -- [new] Add `renderKeyboardShortcutsButton` prop ([#1576](https://github.com/airbnb/react-dates/pull/1576)) +- [new] Add `renderKeyboardShortcutsButton` prop ([#1576](https://github.com/react-dates/react-dates/pull/1576)) ## 20.0.0 -- [breaking] Omit tabindex prop from calendar navigation buttons when custom buttons are supplied ([#1563](https://github.com/airbnb/react-dates/pull/1563)) -- [new] Add hovered-start-blocked-minimun-nights and hovered-start-first-possible-end modifiers ([#1547](https://github.com/airbnb/react-dates/pull/1547)) -- [fix] clearTimeout added for the setCalendarMonthGridHeight timeout ([#1468](https://github.com/airbnb/react-dates/pull/1468)) -- [fix] Remove default styles for the last-in-range modifier ([#1538](https://github.com/airbnb/react-dates/pull/1538)) +- [breaking] Omit tabindex prop from calendar navigation buttons when custom buttons are supplied ([#1563](https://github.com/react-dates/react-dates/pull/1563)) +- [new] Add hovered-start-blocked-minimun-nights and hovered-start-first-possible-end modifiers ([#1547](https://github.com/react-dates/react-dates/pull/1547)) +- [fix] clearTimeout added for the setCalendarMonthGridHeight timeout ([#1468](https://github.com/react-dates/react-dates/pull/1468)) +- [fix] Remove default styles for the last-in-range modifier ([#1538](https://github.com/react-dates/react-dates/pull/1538)) ## 19.0.4 -- [fix] Added `selected` aria label to dates in the selected range ([#1555](https://github.com/airbnb/react-dates/pull/1555)) +- [fix] Added `selected` aria label to dates in the selected range ([#1555](https://github.com/react-dates/react-dates/pull/1555)) ## 19.0.3 -- [fix] Fix date selection in the SDP ([#1540](https://github.com/airbnb/react-dates/pull/1540)) +- [fix] Fix date selection in the SDP ([#1540](https://github.com/react-dates/react-dates/pull/1540)) ## 19.0.2 - no changes; extraneous publish ## 19.0.1 -- [fix] Fix single date picker not responding to input ([#1533](https://github.com/airbnb/react-dates/pull/1533)) -- [fix] Fixes the focus out event in IE11 ([#1524](https://github.com/airbnb/react-dates/pull/1524)) +- [fix] Fix single date picker not responding to input ([#1533](https://github.com/react-dates/react-dates/pull/1533)) +- [fix] Fixes the focus out event in IE11 ([#1524](https://github.com/react-dates/react-dates/pull/1524)) ## 19.0.0 -- [breaking] Call `onDatesChange` before `onFocusChange` in the DRP ([#1525](https://github.com/airbnb/react-dates/pull/1525)) +- [breaking] Call `onDatesChange` before `onFocusChange` in the DRP ([#1525](https://github.com/react-dates/react-dates/pull/1525)) ## 18.5.0 -- [fix] Add `aria-disabled` attribute to the (Customizable)CalendarDay ([#1521](https://github.com/airbnb/react-dates/pull/1521)) -- [new] Add `startDateOffset` and `endDateOffset` props to the DRP ([#1252](https://github.com/airbnb/react-dates/pull/1252)) +- [fix] Add `aria-disabled` attribute to the (Customizable)CalendarDay ([#1521](https://github.com/react-dates/react-dates/pull/1521)) +- [new] Add `startDateOffset` and `endDateOffset` props to the DRP ([#1252](https://github.com/react-dates/react-dates/pull/1252)) ## 18.4.1 -- [fix] Make DRP and SDP calendars tabbable from the inputs ([#1499](https://github.com/airbnb/react-dates/pull/1499)) +- [fix] Make DRP and SDP calendars tabbable from the inputs ([#1499](https://github.com/react-dates/react-dates/pull/1499)) ## 18.4.0 -- [new] Clarify VoiceOver text for dates selected as start-date and end-date ([#1501](https://github.com/airbnb/react-dates/pull/1501)) +- [new] Clarify VoiceOver text for dates selected as start-date and end-date ([#1501](https://github.com/react-dates/react-dates/pull/1501)) ## 18.3.1 -- [fix][RTL] Fix the SDP and DRP noflip util function ([#1492](https://github.com/airbnb/react-dates/pull/1492)) +- [fix][RTL] Fix the SDP and DRP noflip util function ([#1492](https://github.com/react-dates/react-dates/pull/1492)) ## 18.3.0 -- [fix] Update the SDP and DRP to be compatible with `react-with-direction` ([#1482](https://github.com/airbnb/react-dates/pull/1482)) -- [new] Add `minDate` and `maxDate` props to block month navigation ([#1311](https://github.com/airbnb/react-dates/pull/1311)) -- [fix][a11y] Remove space/enter onKeyDown handling for open/close keyboard shortcuts panel ([#1464](https://github.com/airbnb/react-dates/pull/1464)) -- [fix][a11y] Fix lack of visible focus in Firefox and IE on "?" keyboard shortcuts button ([#1463](https://github.com/airbnb/react-dates/pull/1463)) +- [fix] Update the SDP and DRP to be compatible with `react-with-direction` ([#1482](https://github.com/react-dates/react-dates/pull/1482)) +- [new] Add `minDate` and `maxDate` props to block month navigation ([#1311](https://github.com/react-dates/react-dates/pull/1311)) +- [fix][a11y] Remove space/enter onKeyDown handling for open/close keyboard shortcuts panel ([#1464](https://github.com/react-dates/react-dates/pull/1464)) +- [fix][a11y] Fix lack of visible focus in Firefox and IE on "?" keyboard shortcuts button ([#1463](https://github.com/react-dates/react-dates/pull/1463)) ## 18.2.2 -- [fix] Conditionally apply the `shouldComponentUpdate` method in the babel transform ([#1457](https://github.com/airbnb/react-dates/pull/1457)) -- [fix] Fix incorrect VO for selected check-in date ([#1451](https://github.com/airbnb/react-dates/pull/1451)) +- [fix] Conditionally apply the `shouldComponentUpdate` method in the babel transform ([#1457](https://github.com/react-dates/react-dates/pull/1457)) +- [fix] Fix incorrect VO for selected check-in date ([#1451](https://github.com/react-dates/react-dates/pull/1451)) ## 18.2.1 -- [fix] Add babel transform to handle PureComponent fallbacks ([#1452](https://github.com/airbnb/react-dates/pull/1452)) +- [fix] Add babel transform to handle PureComponent fallbacks ([#1452](https://github.com/react-dates/react-dates/pull/1452)) ## 18.2.0 -- [new] Add `onTab`/`onShiftTab` callbacks to the DayPicker (and its controllers) ([#1427](https://github.com/airbnb/react-dates/pull/1427)) +- [new] Add `onTab`/`onShiftTab` callbacks to the DayPicker (and its controllers) ([#1427](https://github.com/react-dates/react-dates/pull/1427)) ## 18.1.1 -- [fix] Prevent outside range dates from being selected by typing ([#1370](https://github.com/airbnb/react-dates/pull/1370)) +- [fix] Prevent outside range dates from being selected by typing ([#1370](https://github.com/react-dates/react-dates/pull/1370)) ## 18.1.0 -- [fix] Default the `calendarMonthPadding` theme variable to 0 when undefined ([#1355](https://github.com/airbnb/react-dates/pull/1355)) -- [new] Add `SingleDatePickerInputController` component ([#1360](https://github.com/airbnb/react-dates/pull/1360)) -- [new] Add `horizontalMonthPadding` as a prop to the DRP ([#1364](https://github.com/airbnb/react-dates/pull/1364)) -- [fix] Fix unnecessary rerender in `DayPickerNavigation` ([#1363](https://github.com/airbnb/react-dates/pull/1363)) +- [fix] Default the `calendarMonthPadding` theme variable to 0 when undefined ([#1355](https://github.com/react-dates/react-dates/pull/1355)) +- [new] Add `SingleDatePickerInputController` component ([#1360](https://github.com/react-dates/react-dates/pull/1360)) +- [new] Add `horizontalMonthPadding` as a prop to the DRP ([#1364](https://github.com/react-dates/react-dates/pull/1364)) +- [fix] Fix unnecessary rerender in `DayPickerNavigation` ([#1363](https://github.com/react-dates/react-dates/pull/1363)) ## 18.0.4 -- [fix] revert 'revert 'Conditionally use `PureComponent` instead of `Component`'' ([4f8eb01](https://github.com/airbnb/react-dates/commit/4f8eb01168ef6c4ae7d74e95ad14acb28960e43e)) +- [fix] revert 'revert 'Conditionally use `PureComponent` instead of `Component`'' ([4f8eb01](https://github.com/react-dates/react-dates/commit/4f8eb01168ef6c4ae7d74e95ad14acb28960e43e)) ## 18.0.3 -- [fix] revert 'Conditionally use `PureComponent` instead of `Component`' ([50c382f](https://github.com/airbnb/react-dates/commit/50c382f7cf3e3ba60f4fdaa00eae53cf06d3c97b)) +- [fix] revert 'Conditionally use `PureComponent` instead of `Component`' ([50c382f](https://github.com/react-dates/react-dates/commit/50c382f7cf3e3ba60f4fdaa00eae53cf06d3c97b)) ## 18.0.2 -- [fix] Remove svgo from "inline-react-svg" babel plugin options ([#1350](https://github.com/airbnb/react-dates/pull/1350)) +- [fix] Remove svgo from "inline-react-svg" babel plugin options ([#1350](https://github.com/react-dates/react-dates/pull/1350)) ## 18.0.1 -- [fix] Center vertical month navigation ([#1347](https://github.com/airbnb/react-dates/pull/1347)) +- [fix] Center vertical month navigation ([#1347](https://github.com/react-dates/react-dates/pull/1347)) ## 18.0.0 -- [fix] Conditionally use `PureComponent` instead of `Component` ([#1335](https://github.com/airbnb/react-dates/pull/1335)) -- [breaking] Remove propTypes in production ([#1322](https://github.com/airbnb/react-dates/pull/1322)) -- [fix] Change border-styles to minimise overlap ([#1328](https://github.com/airbnb/react-dates/pull/1328)) -- [fix] Only blur the `activeElement` when available ([#1345](https://github.com/airbnb/react-dates/pull/1345)) +- [fix] Conditionally use `PureComponent` instead of `Component` ([#1335](https://github.com/react-dates/react-dates/pull/1335)) +- [breaking] Remove propTypes in production ([#1322](https://github.com/react-dates/react-dates/pull/1322)) +- [fix] Change border-styles to minimise overlap ([#1328](https://github.com/react-dates/react-dates/pull/1328)) +- [fix] Only blur the `activeElement` when available ([#1345](https://github.com/react-dates/react-dates/pull/1345)) ## 17.2.0 -- [fix] Add modifiers for next months in the vertical scrollable datepickers ([#1293](https://github.com/airbnb/react-dates/pull/1293)) -- [fix] Fix cursor jumping to the end of the controlled input when typing ([#1287](https://github.com/airbnb/react-dates/pull/1287)) -- [new] Add `horizontalMonthPadding` prop and `dayPickerHorizontalPadding` and `noScrollBarOnVerticalScrollable` theme variables ([#1298](https://github.com/airbnb/react-dates/pull/1298)) -- [fix] Fix issue where custom month navigation was not clickable in FF ([#1305](https://github.com/airbnb/react-dates/pull/1305)) +- [fix] Add modifiers for next months in the vertical scrollable datepickers ([#1293](https://github.com/react-dates/react-dates/pull/1293)) +- [fix] Fix cursor jumping to the end of the controlled input when typing ([#1287](https://github.com/react-dates/react-dates/pull/1287)) +- [new] Add `horizontalMonthPadding` prop and `dayPickerHorizontalPadding` and `noScrollBarOnVerticalScrollable` theme variables ([#1298](https://github.com/react-dates/react-dates/pull/1298)) +- [fix] Fix issue where custom month navigation was not clickable in FF ([#1305](https://github.com/react-dates/react-dates/pull/1305)) ## 17.1.1 -- [fix] Set `DayPickerNavigation__horizontal` height to zero ([#1265](https://github.com/airbnb/react-dates/pull/1265)) +- [fix] Set `DayPickerNavigation__horizontal` height to zero ([#1265](https://github.com/react-dates/react-dates/pull/1265)) ## 17.1.0 -- [new] Add `ModifiersShape` and use throughout the codebase ([#1231](https://github.com/airbnb/react-dates/pull/1231)) -- [fix] Fix minimum nights `blocked` modifiers being applied incorrectly ([#1259](https://github.com/airbnb/react-dates/pull/1259)) -- [fix] Update conditions where `adjustDayPickerHeight` is called ([#1241](https://github.com/airbnb/react-dates/pull/1241)) -- [fix] Do not render `OutsideClickHandler` unnecessarily ([#1256](https://github.com/airbnb/react-dates/pull/1256)) +- [new] Add `ModifiersShape` and use throughout the codebase ([#1231](https://github.com/react-dates/react-dates/pull/1231)) +- [fix] Fix minimum nights `blocked` modifiers being applied incorrectly ([#1259](https://github.com/react-dates/react-dates/pull/1259)) +- [fix] Update conditions where `adjustDayPickerHeight` is called ([#1241](https://github.com/react-dates/react-dates/pull/1241)) +- [fix] Do not render `OutsideClickHandler` unnecessarily ([#1256](https://github.com/react-dates/react-dates/pull/1256)) ## 17.0.0 -- [fix] Replace dumb quotes with smart quotes in default phrases ([#1168](https://github.com/airbnb/react-dates/pull/1168)) -- [fix] Fix outside day movement on hover ([#1178](https://github.com/airbnb/react-dates/pull/1178)) -- [fix] Add `focusable="false"` to SVGs ([#1190](https://github.com/airbnb/react-dates/pull/1190)) -- [fix] Use `react-outside-click-handler` instead of the internal component ([#1191](https://github.com/airbnb/react-dates/pull/1191)) -- [breaking] Change the way month heights are calculated and update the name of some `CalendarMonth`/`CalendarMonthGrid` props ([#1192](https://github.com/airbnb/react-dates/pull/1192)) -- [new] Pass nextMonth to `onPrevMonthClick`/`onNextMonthClick` ([#1207](https://github.com/airbnb/react-dates/pull/1207)) -- [new] Allow input border styles to be overridden in the theme ([#1201](https://github.com/airbnb/react-dates/pull/1201)) -- [new] Allow consolidated-events@2.0.0 ([#1218](https://github.com/airbnb/react-dates/pull/1218)) -- [fix] Remove input.blur() call to fix a focus trap in Safari/IE ([#1214](https://github.com/airbnb/react-dates/pull/1214)) -- [new] Add support for month/year transitions ([#1106](https://github.com/airbnb/react-dates/pull/1106)) -- [breaking] Rename renderMonth=>renderMonthText and renderCaption=>renderMonthElement ([#1220](https://github.com/airbnb/react-dates/pull/1220)) -- [breaking] Remove default styling *completely* from the `navNext`/`navPrev` props, including position ([#1204](https://github.com/airbnb/react-dates/pull/1204)) -- [fix] Fix propType warnings for `onMonthChange`/`onYearChange` ([#1222](https://github.com/airbnb/react-dates/pull/1222)) -- [breaking] Remove `OutsideClickHandler` export entirely ([#1225](https://github.com/airbnb/react-dates/pull/1225)) +- [fix] Replace dumb quotes with smart quotes in default phrases ([#1168](https://github.com/react-dates/react-dates/pull/1168)) +- [fix] Fix outside day movement on hover ([#1178](https://github.com/react-dates/react-dates/pull/1178)) +- [fix] Add `focusable="false"` to SVGs ([#1190](https://github.com/react-dates/react-dates/pull/1190)) +- [fix] Use `react-outside-click-handler` instead of the internal component ([#1191](https://github.com/react-dates/react-dates/pull/1191)) +- [breaking] Change the way month heights are calculated and update the name of some `CalendarMonth`/`CalendarMonthGrid` props ([#1192](https://github.com/react-dates/react-dates/pull/1192)) +- [new] Pass nextMonth to `onPrevMonthClick`/`onNextMonthClick` ([#1207](https://github.com/react-dates/react-dates/pull/1207)) +- [new] Allow input border styles to be overridden in the theme ([#1201](https://github.com/react-dates/react-dates/pull/1201)) +- [new] Allow consolidated-events@2.0.0 ([#1218](https://github.com/react-dates/react-dates/pull/1218)) +- [fix] Remove input.blur() call to fix a focus trap in Safari/IE ([#1214](https://github.com/react-dates/react-dates/pull/1214)) +- [new] Add support for month/year transitions ([#1106](https://github.com/react-dates/react-dates/pull/1106)) +- [breaking] Rename renderMonth=>renderMonthText and renderCaption=>renderMonthElement ([#1220](https://github.com/react-dates/react-dates/pull/1220)) +- [breaking] Remove default styling *completely* from the `navNext`/`navPrev` props, including position ([#1204](https://github.com/react-dates/react-dates/pull/1204)) +- [fix] Fix propType warnings for `onMonthChange`/`onYearChange` ([#1222](https://github.com/react-dates/react-dates/pull/1222)) +- [breaking] Remove `OutsideClickHandler` export entirely ([#1225](https://github.com/react-dates/react-dates/pull/1225)) ## 16.7.1 -- [fix] react-with-styles v3 requires react-with-direction as a peer dep; this provides it but forwards the peer dep requirement ([#1348](https://github.com/airbnb/react-dates/issues/1348)) +- [fix] react-with-styles v3 requires react-with-direction as a peer dep; this provides it but forwards the peer dep requirement ([#1348](https://github.com/react-dates/react-dates/issues/1348)) ## 16.7.0 -- [fix] Force border-radius to be 0 on the inputs ([#1157](https://github.com/airbnb/react-dates/pull/1157)) -- [fix] Clear previous min nights modifiers, not current ([#994](https://github.com/airbnb/react-dates/pull/994)) -- [fix] Tweak default input styling ([#1158](https://github.com/airbnb/react-dates/pull/1158)) -- [fix] Round transform3d values to fix font blur ([#1155](https://github.com/airbnb/react-dates/pull/1155)) -- [new] Add `noNavButtons` prop ([#1160](https://github.com/airbnb/react-dates/pull/1160)) +- [fix] Force border-radius to be 0 on the inputs ([#1157](https://github.com/react-dates/react-dates/pull/1157)) +- [fix] Clear previous min nights modifiers, not current ([#994](https://github.com/react-dates/react-dates/pull/994)) +- [fix] Tweak default input styling ([#1158](https://github.com/react-dates/react-dates/pull/1158)) +- [fix] Round transform3d values to fix font blur ([#1155](https://github.com/react-dates/react-dates/pull/1155)) +- [new] Add `noNavButtons` prop ([#1160](https://github.com/react-dates/react-dates/pull/1160)) ## 16.6.1 -- [fix] Fix selective disabling of the `DateRangePicker` ([#1116](https://github.com/airbnb/react-dates/pull/1116)) -- [fix] Fix `onOutsideClick` refactor ([#1115](https://github.com/airbnb/react-dates/pull/1115)) +- [fix] Fix selective disabling of the `DateRangePicker` ([#1116](https://github.com/react-dates/react-dates/pull/1116)) +- [fix] Fix `onOutsideClick` refactor ([#1115](https://github.com/react-dates/react-dates/pull/1115)) ## 16.6.0 -- [new] Add `appendToBody`/`disableScroll` props ([#1069](https://github.com/airbnb/react-dates/pull/1069)) -- [fix] Address unexpected blur call ([#1107](https://github.com/airbnb/react-dates/pull/1107)) -- [new] Add `verticalBorderSpacing` prop to `DayPickerSingleDateController`/`DayPickerRangeController` ([#1096](https://github.com/airbnb/react-dates/pull/1096)) -- [fix] Move focus to `DayPicker` when readOnly is true ([#961](https://github.com/airbnb/react-dates/pull/961)) +- [new] Add `appendToBody`/`disableScroll` props ([#1069](https://github.com/react-dates/react-dates/pull/1069)) +- [fix] Address unexpected blur call ([#1107](https://github.com/react-dates/react-dates/pull/1107)) +- [new] Add `verticalBorderSpacing` prop to `DayPickerSingleDateController`/`DayPickerRangeController` ([#1096](https://github.com/react-dates/react-dates/pull/1096)) +- [fix] Move focus to `DayPicker` when readOnly is true ([#961](https://github.com/react-dates/react-dates/pull/961)) ## 16.5.0 -- [new] Export `CustomizeableCalendarDay` default styles ([#1095](https://github.com/airbnb/react-dates/pull/1095)) -- [new] Allow selectively disabling either input in the DRP ([#](https://github.com/airbnb/react-dates/pull/606)) -- [new] Add `dayAriaLabelFormat` prop to the SDP/DRP ([#](https://github.com/airbnb/react-dates/pull/984)) +- [new] Export `CustomizeableCalendarDay` default styles ([#1095](https://github.com/react-dates/react-dates/pull/1095)) +- [new] Allow selectively disabling either input in the DRP ([#](https://github.com/react-dates/react-dates/pull/606)) +- [new] Add `dayAriaLabelFormat` prop to the SDP/DRP ([#](https://github.com/react-dates/react-dates/pull/984)) ## 16.4.0 -- [new] Export `OutsideClickHandler` in index.js ([#1089](https://github.com/airbnb/react-dates/pull/1089)) -- [fix] Do not apply `verticalSpacing` when `withPortal` or `withFullScreenPortal` is true ([#980](https://github.com/airbnb/react-dates/pull/980)) -- [fix] Handle minimum nights when selecting `startDate` ([#1015](https://github.com/airbnb/react-dates/pull/1015)) -- [fix] Fix style of `CloseIcon` in the SDP ([#1058](https://github.com/airbnb/react-dates/pull/1058)) +- [new] Export `OutsideClickHandler` in index.js ([#1089](https://github.com/react-dates/react-dates/pull/1089)) +- [fix] Do not apply `verticalSpacing` when `withPortal` or `withFullScreenPortal` is true ([#980](https://github.com/react-dates/react-dates/pull/980)) +- [fix] Handle minimum nights when selecting `startDate` ([#1015](https://github.com/react-dates/react-dates/pull/1015)) +- [fix] Fix style of `CloseIcon` in the SDP ([#1058](https://github.com/react-dates/react-dates/pull/1058)) ## 16.3.6 -- [fix] Address width issues for vertical DayPickers ([#1055](https://github.com/airbnb/react-dates/pull/1055)) +- [fix] Address width issues for vertical DayPickers ([#1055](https://github.com/react-dates/react-dates/pull/1055)) ## 16.3.5 (I promise this one is good) -- [fix] Includes all necessary CSS ([c965348](https://github.com/airbnb/react-dates/commit/c96534896d8fe5c28ddc1f1090ef43dfaeebb5d6)) +- [fix] Includes all necessary CSS ([c965348](https://github.com/react-dates/react-dates/commit/c96534896d8fe5c28ddc1f1090ef43dfaeebb5d6)) ## 16.3.4 - [fix] Bumps all the RWS libraries again, now with less breakage! ## 16.3.3 -- [revert] Reverts 'Bump react-with-style-interface-css dependency ([#1043](https://github.com/airbnb/react-dates/pull/1043))' +- [revert] Reverts 'Bump react-with-style-interface-css dependency ([#1043](https://github.com/react-dates/react-dates/pull/1043))' ## 16.3.2 -- [revert] Reverts 'Bump react-with-styles dependency ([#1041](https://github.com/airbnb/react-dates/pull/1041))' +- [revert] Reverts 'Bump react-with-styles dependency ([#1041](https://github.com/react-dates/react-dates/pull/1041))' ## 16.3.1 -- [deps] Bump react-with-styles dependency ([#1041](https://github.com/airbnb/react-dates/pull/1041)) -- [deps] Bump react-with-style-interface-css dependency ([#1043](https://github.com/airbnb/react-dates/pull/1043)) +- [deps] Bump react-with-styles dependency ([#1041](https://github.com/react-dates/react-dates/pull/1041)) +- [deps] Bump react-with-style-interface-css dependency ([#1043](https://github.com/react-dates/react-dates/pull/1043)) ## 16.3.0 -- [new] customInfoPanel position prop ([#989](https://github.com/airbnb/react-dates/pull/989)) -- [fix] Fix CustomizableCalendarDay selected/selected-start/selected-end specificity issues ([#979](https://github.com/airbnb/react-dates/pull/979)) -- [fix] Add modifiers for `firstDayOfWeek` and `lastDayOfWeek` ([#988](https://github.com/airbnb/react-dates/pull/988)) -- [fix] Ensure callbacks only trigger after state has been updates ([#990](https://github.com/airbnb/react-dates/pull/990)) +- [new] customInfoPanel position prop ([#989](https://github.com/react-dates/react-dates/pull/989)) +- [fix] Fix CustomizableCalendarDay selected/selected-start/selected-end specificity issues ([#979](https://github.com/react-dates/react-dates/pull/979)) +- [fix] Add modifiers for `firstDayOfWeek` and `lastDayOfWeek` ([#988](https://github.com/react-dates/react-dates/pull/988)) +- [fix] Ensure callbacks only trigger after state has been updates ([#990](https://github.com/react-dates/react-dates/pull/990)) ## 16.2.1 -- [fix] SDP `block` styling also makes the input full width ([#972](https://github.com/airbnb/react-dates/pull/972)) +- [fix] SDP `block` styling also makes the input full width ([#972](https://github.com/react-dates/react-dates/pull/972)) ## 16.2.0 -- [new] Add `startDateOffset`/`endDateOffset` props to `DayPickerRangeController` ([#884](https://github.com/airbnb/react-dates/pull/884)) -- [fix] Make all styles inline in `CustomizableCalendarDay` ([#964](https://github.com/airbnb/react-dates/pull/964)) +- [new] Add `startDateOffset`/`endDateOffset` props to `DayPickerRangeController` ([#884](https://github.com/react-dates/react-dates/pull/884)) +- [fix] Make all styles inline in `CustomizableCalendarDay` ([#964](https://github.com/react-dates/react-dates/pull/964)) ## 16.1.1 -- [fix] Address some small bugs with `CustomizableCalendarDay` ([#962](https://github.com/airbnb/react-dates/pull/962)) +- [fix] Address some small bugs with `CustomizableCalendarDay` ([#962](https://github.com/react-dates/react-dates/pull/962)) ## 16.1.0 -- [fix] Allow for changing of the input value via highlight and replace ([#955](https://github.com/airbnb/react-dates/pull/955)) -- [fix] Fix OPEN_UP styling ([#925](https://github.com/airbnb/react-dates/pull/925)) -- [fix] Don't read invisible months to the screen reader ([#940](https://github.com/airbnb/react-dates/pull/940)) -- [new] Add phrase for aria-label for the selected day ([#905](https://github.com/airbnb/react-dates/pull/905)) +- [fix] Allow for changing of the input value via highlight and replace ([#955](https://github.com/react-dates/react-dates/pull/955)) +- [fix] Fix OPEN_UP styling ([#925](https://github.com/react-dates/react-dates/pull/925)) +- [fix] Don't read invisible months to the screen reader ([#940](https://github.com/react-dates/react-dates/pull/940)) +- [new] Add phrase for aria-label for the selected day ([#905](https://github.com/react-dates/react-dates/pull/905)) ## 16.0.2 -- [fix] Fix keyboard navigation issues ([#916](https://github.com/airbnb/react-dates/pull/916)) -- [fix] Fix React warnings when events are referenced later ([#682](https://github.com/airbnb/react-dates/pull/682)) +- [fix] Fix keyboard navigation issues ([#916](https://github.com/react-dates/react-dates/pull/916)) +- [fix] Fix React warnings when events are referenced later ([#682](https://github.com/react-dates/react-dates/pull/682)) ## 16.0.1 -- [fix] Add back missing onKeyDown method to `CalendarDay` ([#901](https://github.com/airbnb/react-dates/pull/901)) +- [fix] Add back missing onKeyDown method to `CalendarDay` ([#901](https://github.com/react-dates/react-dates/pull/901)) ## 16.0.0 -- [breaking] Simplify `CalendarDay` component ([#894](https://github.com/airbnb/react-dates/pull/894)) -- [breaking] rename `renderDay` prop to `renderDayContents` ([#894](https://github.com/airbnb/react-dates/pull/894)) -- [new] Add `renderCalendarDay` component to allow for easy one-off customization of `CalendarDay` ([#894](https://github.com/airbnb/react-dates/pull/894)) +- [breaking] Simplify `CalendarDay` component ([#894](https://github.com/react-dates/react-dates/pull/894)) +- [breaking] rename `renderDay` prop to `renderDayContents` ([#894](https://github.com/react-dates/react-dates/pull/894)) +- [new] Add `renderCalendarDay` component to allow for easy one-off customization of `CalendarDay` ([#894](https://github.com/react-dates/react-dates/pull/894)) ## 15.5.2 -- revert [#866](https://github.com/airbnb/react-dates/pull/866); it turned out to be semver-major +- revert [#866](https://github.com/react-dates/react-dates/pull/866); it turned out to be semver-major ## 15.5.1 -- [fix] Adjust `small` variant height to be 36px ([#892](https://github.com/airbnb/react-dates/pull/892)) +- [fix] Adjust `small` variant height to be 36px ([#892](https://github.com/react-dates/react-dates/pull/892)) ## 15.5.0 -- [new] Add `small` variant ([#891](https://github.com/airbnb/react-dates/pull/891)) +- [new] Add `small` variant ([#891](https://github.com/react-dates/react-dates/pull/891)) ## 15.4.0 -- [fix] Set font sizes according to theme variable ([#885](https://github.com/airbnb/react-dates/pull/885)) -- [new] Add `verticalSpacing` prop ([#883](https://github.com/airbnb/react-dates/pull/883)) +- [fix] Set font sizes according to theme variable ([#885](https://github.com/react-dates/react-dates/pull/885)) +- [new] Add `verticalSpacing` prop ([#883](https://github.com/react-dates/react-dates/pull/883)) ## 15.3.0 -- [new] Add `transitionDuration` prop ([#865](https://github.com/airbnb/react-dates/pull/865)) -- [fix] Remove default prop values for required startDateId and endDateId props ([#866](https://github.com/airbnb/react-dates/pull/866)) -- [new] Add `block` styling prop ([#871](https://github.com/airbnb/react-dates/pull/871)) -- [new] Add `noBorder` prop to `DayPicker` variations ([#869](https://github.com/airbnb/react-dates/pull/869)) -- [new] Add `noBorder` prop to inputs ([#870](https://github.com/airbnb/react-dates/pull/870)) -- [fix] Remove unused width style in `KeyboardShortcutsRow` ([#867](https://github.com/airbnb/react-dates/pull/867)) +- [new] Add `transitionDuration` prop ([#865](https://github.com/react-dates/react-dates/pull/865)) +- [fix] Remove default prop values for required startDateId and endDateId props ([#866](https://github.com/react-dates/react-dates/pull/866)) +- [new] Add `block` styling prop ([#871](https://github.com/react-dates/react-dates/pull/871)) +- [new] Add `noBorder` prop to `DayPicker` variations ([#869](https://github.com/react-dates/react-dates/pull/869)) +- [new] Add `noBorder` prop to inputs ([#870](https://github.com/react-dates/react-dates/pull/870)) +- [fix] Remove unused width style in `KeyboardShortcutsRow` ([#867](https://github.com/react-dates/react-dates/pull/867)) ## 15.2.1 - [fix] Republish `_datepicker.css` ## 15.2.0 -- [new] Add back today modifier (and class) ([#861](https://github.com/airbnb/react-dates/pull/861)) -- [new] Add ariaLabelFormat prop to CalendarDay ([#842](https://github.com/airbnb/react-dates/pull/842), [#857](https://github.com/airbnb/react-dates/pull/857)) -- [fix] Reset `after-hover-start` in `componentWillReceiveProps` instead of only on click ([#843](https://github.com/airbnb/react-dates/pull/843)) -- [fix] Use `color.background` variable instead of hardcoded #fff for theming ([#852](https://github.com/airbnb/react-dates/pull/852)) -- [fix] Update CalendarMonthGrid months based on locale change ([#795](https://github.com/airbnb/react-dates/pull/795)) +- [new] Add back today modifier (and class) ([#861](https://github.com/react-dates/react-dates/pull/861)) +- [new] Add ariaLabelFormat prop to CalendarDay ([#842](https://github.com/react-dates/react-dates/pull/842), [#857](https://github.com/react-dates/react-dates/pull/857)) +- [fix] Reset `after-hover-start` in `componentWillReceiveProps` instead of only on click ([#843](https://github.com/react-dates/react-dates/pull/843)) +- [fix] Use `color.background` variable instead of hardcoded #fff for theming ([#852](https://github.com/react-dates/react-dates/pull/852)) +- [fix] Update CalendarMonthGrid months based on locale change ([#795](https://github.com/react-dates/react-dates/pull/795)) ## 15.1.0 -- [fix] Add explicit border-radius on KeyboardShortcuts button ([#792](https://github.com/airbnb/react-dates/pull/792)) -- [fix] Pass onClose from SingleDatePicker to DayPickerSingleDateController ([#816](https://github.com/airbnb/react-dates/pull/816)) -- [new] Pass modifiers to `renderDay` as second arg ([#829](https://github.com/airbnb/react-dates/pull/829)) -- [fix] Fix KeyboardShortcutsPanel focus issues ([#825](https://github.com/airbnb/react-dates/pull/825)) +- [fix] Add explicit border-radius on KeyboardShortcuts button ([#792](https://github.com/react-dates/react-dates/pull/792)) +- [fix] Pass onClose from SingleDatePicker to DayPickerSingleDateController ([#816](https://github.com/react-dates/react-dates/pull/816)) +- [new] Pass modifiers to `renderDay` as second arg ([#829](https://github.com/react-dates/react-dates/pull/829)) +- [fix] Fix KeyboardShortcutsPanel focus issues ([#825](https://github.com/react-dates/react-dates/pull/825)) ## 15.0.0 -- [breaking] Rename SDP keydown callback props so that they match the DRP ([#800](https://github.com/airbnb/react-dates/pull/800)) -- [fix] Explicitly set the border-radius on the keyboard shortcuts button ([#792](https://github.com/airbnb/react-dates/pull/792)) +- [breaking] Rename SDP keydown callback props so that they match the DRP ([#800](https://github.com/react-dates/react-dates/pull/800)) +- [fix] Explicitly set the border-radius on the keyboard shortcuts button ([#792](https://github.com/react-dates/react-dates/pull/792)) ## 14.1.0 -- [new] Add esm build ([#791](https://github.com/airbnb/react-dates/pull/791)) -- [new] Add back `selected-start`/`selected-end` modifiers to `CalendarDay` ([#796](https://github.com/airbnb/react-dates/pull/796)) +- [new] Add esm build ([#791](https://github.com/react-dates/react-dates/pull/791)) +- [new] Add back `selected-start`/`selected-end` modifiers to `CalendarDay` ([#796](https://github.com/react-dates/react-dates/pull/796)) ## 14.0.0 -- [fix] Flip arrow navigation in RTL context ([#775](https://github.com/airbnb/react-dates/pull/775)) -- [new] Add `verticalHeight` prop to SDP, DRP and DayPicker ([#773](https://github.com/airbnb/react-dates/pull/773)) -- [breaking] Modify default `DateInput` styling, convert inputs to actual inputs, and remove caption ids ([#780](https://github.com/airbnb/react-dates/pull/780)) +- [fix] Flip arrow navigation in RTL context ([#775](https://github.com/react-dates/react-dates/pull/775)) +- [new] Add `verticalHeight` prop to SDP, DRP and DayPicker ([#773](https://github.com/react-dates/react-dates/pull/773)) +- [breaking] Modify default `DateInput` styling, convert inputs to actual inputs, and remove caption ids ([#780](https://github.com/react-dates/react-dates/pull/780)) ## 13.0.6 -- [fix] Update `react-with-styles-interface-css` dependency ([#777](https://github.com/airbnb/react-dates/pull/777)) +- [fix] Update `react-with-styles-interface-css` dependency ([#777](https://github.com/react-dates/react-dates/pull/777)) ## 13.0.5 - [fix] Add back missing built CSS file ## 13.0.4 -- [fix] Pass through `customCloseIcon` prop from the SDP to the SDPInput ([#767](https://github.com/airbnb/react-dates/pull/767)) -- [fix] Fix incorrect available/unavailable phrase being read on `CalendarDay` components ([#771](https://github.com/airbnb/react-dates/pull/771)) +- [fix] Pass through `customCloseIcon` prop from the SDP to the SDPInput ([#767](https://github.com/react-dates/react-dates/pull/767)) +- [fix] Fix incorrect available/unavailable phrase being read on `CalendarDay` components ([#771](https://github.com/react-dates/react-dates/pull/771)) ## 13.0.3 -- [fix] Change CSS style specificity to 0 for the default stylesheet ([#753](https://github.com/airbnb/react-dates/pull/753)) -- [fix] Remove unnecessary caption object from `CalendarMonth` styles ([#757](https://github.com/airbnb/react-dates/pull/757)) +- [fix] Change CSS style specificity to 0 for the default stylesheet ([#753](https://github.com/react-dates/react-dates/pull/753)) +- [fix] Remove unnecessary caption object from `CalendarMonth` styles ([#757](https://github.com/react-dates/react-dates/pull/757)) ## 13.0.2 - [fix] Use default export of `registerCSSInterfaceWithDefaultTheme` in `initialize` ## 13.0.1 -- [fix] Move caption div back outside of `CalendarMonth` table ([#748](https://github.com/airbnb/react-dates/pull/748)) +- [fix] Move caption div back outside of `CalendarMonth` table ([#748](https://github.com/react-dates/react-dates/pull/748)) ## 13.0.0 -- [breaking] Convert react-dates to rely on `react-with-styles` in place of CSS stylesheets ([#722](https://github.com/airbnb/react-dates/pull/722)) +- [breaking] Convert react-dates to rely on `react-with-styles` in place of CSS stylesheets ([#722](https://github.com/react-dates/react-dates/pull/722)) ## 12.7.1 -- [fix] set explicit border radius on shortcuts button ([#792](https://github.com/airbnb/react-dates/pull/792)) +- [fix] set explicit border radius on shortcuts button ([#792](https://github.com/react-dates/react-dates/pull/792)) ## 12.7.0 -- [new] Some accessibility improvements and patches ([#715](https://github.com/airbnb/react-dates/pull/715)) +- [new] Some accessibility improvements and patches ([#715](https://github.com/react-dates/react-dates/pull/715)) ## 12.6.0 -- [new] Add `weekDayFormat` prop to SDP/DRP ([#650](https://github.com/airbnb/react-dates/pull/650)) -- [new] Add `openDirection` prop to SDP/DRP ([#653](https://github.com/airbnb/react-dates/pull/653)) -- [fix] Reset visibleDays/currentMonth state when `enableOutsideDays` or `numberOfMonths` has changed ([#702](https://github.com/airbnb/react-dates/pull/702)) -- [new] Add $react-dates-color-primary-dark CSS variable ([#704](https://github.com/airbnb/react-dates/pull/704)) +- [new] Add `weekDayFormat` prop to SDP/DRP ([#650](https://github.com/react-dates/react-dates/pull/650)) +- [new] Add `openDirection` prop to SDP/DRP ([#653](https://github.com/react-dates/react-dates/pull/653)) +- [fix] Reset visibleDays/currentMonth state when `enableOutsideDays` or `numberOfMonths` has changed ([#702](https://github.com/react-dates/react-dates/pull/702)) +- [new] Add $react-dates-color-primary-dark CSS variable ([#704](https://github.com/react-dates/react-dates/pull/704)) ## 12.5.1 -- [fix] Ensure `this.childNode` exists in the `OutsideClickHandler` ([e330839](https://github.com/airbnb/react-dates/commit/e3308395212bef07d1f3c05f413cac3dd245ac98)) -- [fix] Remove `minimumNights` prop from the `DayPickerSingleDateController` ([#686](https://github.com/airbnb/react-dates/pull/686)) +- [fix] Ensure `this.childNode` exists in the `OutsideClickHandler` ([e330839](https://github.com/react-dates/react-dates/commit/e3308395212bef07d1f3c05f413cac3dd245ac98)) +- [fix] Remove `minimumNights` prop from the `DayPickerSingleDateController` ([#686](https://github.com/react-dates/react-dates/pull/686)) ## 12.5.0 -- [fix] Fix `onOutsideClick` prop functionality in the SDP ([#666](https://github.com/airbnb/react-dates/pull/666)) -- [new] Add `inputIconPosition` prop ([#627](https://github.com/airbnb/react-dates/pull/627)) -- [fix] Adjust DayPicker styles when portal status is set ([#659](https://github.com/airbnb/react-dates/pull/659)) +- [fix] Fix `onOutsideClick` prop functionality in the SDP ([#666](https://github.com/react-dates/react-dates/pull/666)) +- [new] Add `inputIconPosition` prop ([#627](https://github.com/react-dates/react-dates/pull/627)) +- [fix] Adjust DayPicker styles when portal status is set ([#659](https://github.com/react-dates/react-dates/pull/659)) ## 12.4.0 -- [fix] Pass `onPrevMonthClick`/`onNextMonthClick` props through the SDP ([#657](https://github.com/airbnb/react-dates/pull/657)) -- [fix] Recalculate modifiers when prop modifiers change ([#668](https://github.com/airbnb/react-dates/pull/668)) -- [new] Pass back month as argument to `onPrevMonthClick`/`onNextMonthClick` props ([#667](https://github.com/airbnb/react-dates/pull/667)) +- [fix] Pass `onPrevMonthClick`/`onNextMonthClick` props through the SDP ([#657](https://github.com/react-dates/react-dates/pull/657)) +- [fix] Recalculate modifiers when prop modifiers change ([#668](https://github.com/react-dates/react-dates/pull/668)) +- [new] Pass back month as argument to `onPrevMonthClick`/`onNextMonthClick` props ([#667](https://github.com/react-dates/react-dates/pull/667)) ## 12.3.0 -- [fix] Allows users to type in same-day start date and end date when `minimumNights` is 0 ([#555](https://github.com/airbnb/react-dates/pull/555)) -- [new] Add `firstDayOfWeek` prop ([#371](https://github.com/airbnb/react-dates/pull/371)) -- [fix] Add back `phrases` support for `SingleDatePicker` ([#623](https://github.com/airbnb/react-dates/pull/623)) +- [fix] Allows users to type in same-day start date and end date when `minimumNights` is 0 ([#555](https://github.com/react-dates/react-dates/pull/555)) +- [new] Add `firstDayOfWeek` prop ([#371](https://github.com/react-dates/react-dates/pull/371)) +- [fix] Add back `phrases` support for `SingleDatePicker` ([#623](https://github.com/react-dates/react-dates/pull/623)) ## 12.2.4 -- [fix] Fix `initialVisibleMonth` error in the `DayPickerRangeController` component ([#617](https://github.com/airbnb/react-dates/pull/617)) -- [fix] Pass through missing `keepOpenOnDateSelect` prop to the `DayPickerSingleDateController` component ([#620](https://github.com/airbnb/react-dates/pull/620)) +- [fix] Fix `initialVisibleMonth` error in the `DayPickerRangeController` component ([#617](https://github.com/react-dates/react-dates/pull/617)) +- [fix] Pass through missing `keepOpenOnDateSelect` prop to the `DayPickerSingleDateController` component ([#620](https://github.com/react-dates/react-dates/pull/620)) ## 12.2.3 -- [fix] Export `DayPickerSingleDateController` in index.js ([#609](https://github.com/airbnb/react-dates/pull/609)) +- [fix] Export `DayPickerSingleDateController` in index.js ([#609](https://github.com/react-dates/react-dates/pull/609)) ## 12.2.2 -- [fix] Reevaluate `--blocked` and `--blocked-outside-range` modifiers in the SDP componentWilLReceiveProps ([#550](https://github.com/airbnb/react-dates/pull/550)) +- [fix] Reevaluate `--blocked` and `--blocked-outside-range` modifiers in the SDP componentWilLReceiveProps ([#550](https://github.com/react-dates/react-dates/pull/550)) ## 12.2.1 -- [fix] Fix `isTouchDevice` warning in `DayPickerSingleDateController` ([77e2135](https://github.com/airbnb/react-dates/commit/77e2135d2009994fbf2c62e3ff68ce82e5786194)) +- [fix] Fix `isTouchDevice` warning in `DayPickerSingleDateController` ([77e2135](https://github.com/react-dates/react-dates/commit/77e2135d2009994fbf2c62e3ff68ce82e5786194)) ## v12.2.0 -- [fix] Deprecate `isTouchDevice` in favor of `is-touch-device` ([#576](https://github.com/airbnb/react-dates/pull/576)) -- [fix] Disable calendar icon when component is disabled ([#591](https://github.com/airbnb/react-dates/pull/591)) -- [fix] Fix issue where range does not clear on invisible months ([#575](https://github.com/airbnb/react-dates/pull/575)) -- [new] Add `DayPickerSingleDateController` component ([#573](https://github.com/airbnb/react-dates/pull/573)) +- [fix] Deprecate `isTouchDevice` in favor of `is-touch-device` ([#576](https://github.com/react-dates/react-dates/pull/576)) +- [fix] Disable calendar icon when component is disabled ([#591](https://github.com/react-dates/react-dates/pull/591)) +- [fix] Fix issue where range does not clear on invisible months ([#575](https://github.com/react-dates/react-dates/pull/575)) +- [new] Add `DayPickerSingleDateController` component ([#573](https://github.com/react-dates/react-dates/pull/573)) ## v12.1.2 -- [fix] Add null check for calendarMonthGrid ref ([#552](https://github.com/airbnb/react-dates/pull/552)) +- [fix] Add null check for calendarMonthGrid ref ([#552](https://github.com/react-dates/react-dates/pull/552)) ## v12.1.1 -- [fix] Remove `--hovered-span` modifier when selecting a new end date ([#523](https://github.com/airbnb/react-dates/pull/523)) -- [fix] Improve `isTouchDevice` detection logic ([#516](https://github.com/airbnb/react-dates/pull/516)) -- [fix] Recompute `--blocked` and `--blocked-outside-range` when `focusedInput` changes ([#522](https://github.com/airbnb/react-dates/pull/522)) +- [fix] Remove `--hovered-span` modifier when selecting a new end date ([#523](https://github.com/react-dates/react-dates/pull/523)) +- [fix] Improve `isTouchDevice` detection logic ([#516](https://github.com/react-dates/react-dates/pull/516)) +- [fix] Recompute `--blocked` and `--blocked-outside-range` when `focusedInput` changes ([#522](https://github.com/react-dates/react-dates/pull/522)) ## v12.1.0 -- [new] Add `showDefaultInputIcon` and `customInputIcon` props to SDP ([#513](https://github.com/airbnb/react-dates/pull/513)) +- [new] Add `showDefaultInputIcon` and `customInputIcon` props to SDP ([#513](https://github.com/react-dates/react-dates/pull/513)) ## v12.0.0 -- [breaking] Updates moment peer dependency to ^2.18.1 ([#505](https://github.com/airbnb/react-dates/pull/505)) +- [breaking] Updates moment peer dependency to ^2.18.1 ([#505](https://github.com/react-dates/react-dates/pull/505)) ## v11.1.0 -- [fix] Patch issues with vertical scrollable datepickers, after-hovered-start and month transitions ([#503](https://github.com/airbnb/react-dates/pull/503)) -- [new] Adds a `readOnly` prop on the DRP and SDP ([#501](https://github.com/airbnb/react-dates/pull/501)) -- [fix] Disable hover when `focusedInput` is falsy ([#483](https://github.com/airbnb/react-dates/pull/483)) +- [fix] Patch issues with vertical scrollable datepickers, after-hovered-start and month transitions ([#503](https://github.com/react-dates/react-dates/pull/503)) +- [new] Adds a `readOnly` prop on the DRP and SDP ([#501](https://github.com/react-dates/react-dates/pull/501)) +- [fix] Disable hover when `focusedInput` is falsy ([#483](https://github.com/react-dates/react-dates/pull/483)) ## v11.0.1 -- [fix] Fixes small modifier issues in the DRP after rearchitecture ([#489](https://github.com/airbnb/react-dates/pull/489)) +- [fix] Fixes small modifier issues in the DRP after rearchitecture ([#489](https://github.com/react-dates/react-dates/pull/489)) ## v11.0.0 -- [breaking] Dramatic rearchitecture of modifiers with the goal of improved performance ([#450](https://github.com/airbnb/react-dates/pull/450)) +- [breaking] Dramatic rearchitecture of modifiers with the goal of improved performance ([#450](https://github.com/react-dates/react-dates/pull/450)) ## v10.2.0 -- [new] Add RTL support to the DRP and the SDP with the `isRTL` prop ([#454](https://github.com/airbnb/react-dates/pull/454)) -- [new] Add `renderMonth` prop to DRP and SDP([#449](https://github.com/airbnb/react-dates/pull/449)) +- [new] Add RTL support to the DRP and the SDP with the `isRTL` prop ([#454](https://github.com/react-dates/react-dates/pull/454)) +- [new] Add `renderMonth` prop to DRP and SDP([#449](https://github.com/react-dates/react-dates/pull/449)) ## v10.1.3 - [Fix] OutsideClickHandler: ensure this.childNode exists (#437) ## v10.1.2 -- [fix] Remove unused scss variables ([#475](https://github.com/airbnb/react-dates/pull/475)) -- [fix] Address some issues introduced by the accessibility PR in v10.0.0 ([#477](https://github.com/airbnb/react-dates/pull/477)) -- [fix] Only update phrase object in the DRP when necessary ([#448](https://github.com/airbnb/react-dates/pull/448)) +- [fix] Remove unused scss variables ([#475](https://github.com/react-dates/react-dates/pull/475)) +- [fix] Address some issues introduced by the accessibility PR in v10.0.0 ([#477](https://github.com/react-dates/react-dates/pull/477)) +- [fix] Only update phrase object in the DRP when necessary ([#448](https://github.com/react-dates/react-dates/pull/448)) ## v10.1.1 - [fix] Remove unnecessary `onClose` instances on the `SDPInput` and `DateInput` components ## v10.1.0 -- [new] Add `onClose` callback ([#397](https://github.com/airbnb/react-dates/pull/397)) +- [new] Add `onClose` callback ([#397](https://github.com/react-dates/react-dates/pull/397)) ## v10.0.1 -- [fix] Fix a few nits as a result of the accessibility PR ([#429](https://github.com/airbnb/react-dates/pull/429)) +- [fix] Fix a few nits as a result of the accessibility PR ([#429](https://github.com/react-dates/react-dates/pull/429)) ## v10.0.0 -- [breaking] Add keyboard accessibility to react-dates ([#301](https://github.com/airbnb/react-dates/pull/301)) +- [breaking] Add keyboard accessibility to react-dates ([#301](https://github.com/react-dates/react-dates/pull/301)) ## v9.0.1 -- [fix] Fixes `withPortal` implementation in Firefox ([#421](https://github.com/airbnb/react-dates/pull/421)) +- [fix] Fixes `withPortal` implementation in Firefox ([#421](https://github.com/react-dates/react-dates/pull/421)) ## v9.0.0 -- [fix] Only send down relevant modifiers down the tree ([#412](https://github.com/airbnb/react-dates/pull/412)) -- [fix] Optimise `isSameDay` method ([#415](https://github.com/airbnb/react-dates/pull/415)) -- [fix] Blur input for portal implementations (and on touch devices) ([#410](https://github.com/airbnb/react-dates/pull/410)) -- [breaking] Add `daySize` prop to scale the pickers properly ([#406](https://github.com/airbnb/react-dates/pull/406)) +- [fix] Only send down relevant modifiers down the tree ([#412](https://github.com/react-dates/react-dates/pull/412)) +- [fix] Optimise `isSameDay` method ([#415](https://github.com/react-dates/react-dates/pull/415)) +- [fix] Blur input for portal implementations (and on touch devices) ([#410](https://github.com/react-dates/react-dates/pull/410)) +- [breaking] Add `daySize` prop to scale the pickers properly ([#406](https://github.com/react-dates/react-dates/pull/406)) ## v8.2.1 -- [fix] Add `needsclick` to inputs to disable fastclick ([#377](https://github.com/airbnb/react-dates/pull/377)) -- [deps] Update `style-loader`, `sinon`, `babel-loader`, `coveralls`, and `karma-webpack` ([#379](https://github.com/airbnb/react-dates/pull/379), [#372](https://github.com/airbnb/react-dates/pull/372), [#373](https://github.com/airbnb/react-dates/pull/373)) +- [fix] Add `needsclick` to inputs to disable fastclick ([#377](https://github.com/react-dates/react-dates/pull/377)) +- [deps] Update `style-loader`, `sinon`, `babel-loader`, `coveralls`, and `karma-webpack` ([#379](https://github.com/react-dates/react-dates/pull/379), [#372](https://github.com/react-dates/react-dates/pull/372), [#373](https://github.com/react-dates/react-dates/pull/373)) ## v8.2.0 -- [new] Add `renderCalendarInfo` prop to DRP and SDP ([#341](https://github.com/airbnb/react-dates/pull/341)) +- [new] Add `renderCalendarInfo` prop to DRP and SDP ([#341](https://github.com/react-dates/react-dates/pull/341)) ## v8.1.1 -- [fix] Add missing `customCloseIcon` propType declarations ([#367](https://github.com/airbnb/react-dates/pull/367)) +- [fix] Add missing `customCloseIcon` propType declarations ([#367](https://github.com/react-dates/react-dates/pull/367)) ## v8.1.0 -- [new] Add `customCloseIcon` prop ([#356](https://github.com/airbnb/react-dates/pull/356)) +- [new] Add `customCloseIcon` prop ([#356](https://github.com/react-dates/react-dates/pull/356)) ## v8.0.0 -- [fix] Remove `$react-dates-width-day-picker` variable from `CalendarMonthGrid.scss`, allowing overrides ([#352](https://github.com/airbnb/react-dates/pull/352)) -- [new] Create `defaultPhrases` file for i18n ([#351](https://github.com/airbnb/react-dates/pull/351)) -- [fix] Set `isTouchDevice` on `componentDidMount` ([#336](https://github.com/airbnb/react-dates/pull/336)) -- [fix] Change `CalendarMonthGrid` background to use `$react-dates-color-white` ([#342](https://github.com/airbnb/react-dates/pull/342)) -- [breaking] Make `onFocusChange` and `onDate(s)Change` props required and `forbidExtraProps` on all components ([#332](https://github.com/airbnb/react-dates/pull/332)) -- [fix] Fix caption alignment when using bootstrap ([#323](https://github.com/airbnb/react-dates/pull/323)) +- [fix] Remove `$react-dates-width-day-picker` variable from `CalendarMonthGrid.scss`, allowing overrides ([#352](https://github.com/react-dates/react-dates/pull/352)) +- [new] Create `defaultPhrases` file for i18n ([#351](https://github.com/react-dates/react-dates/pull/351)) +- [fix] Set `isTouchDevice` on `componentDidMount` ([#336](https://github.com/react-dates/react-dates/pull/336)) +- [fix] Change `CalendarMonthGrid` background to use `$react-dates-color-white` ([#342](https://github.com/react-dates/react-dates/pull/342)) +- [breaking] Make `onFocusChange` and `onDate(s)Change` props required and `forbidExtraProps` on all components ([#332](https://github.com/react-dates/react-dates/pull/332)) +- [fix] Fix caption alignment when using bootstrap ([#323](https://github.com/react-dates/react-dates/pull/323)) ## v7.0.1 -- [fix] Fix minimum nights issues for startDates/endDates with time ([#310](https://github.com/airbnb/react-dates/pull/310)) +- [fix] Fix minimum nights issues for startDates/endDates with time ([#310](https://github.com/react-dates/react-dates/pull/310)) ## v7.0.0 -- [breaking] Simplify `CalendarDay` DOM ([#291](https://github.com/airbnb/react-dates/pull/291)) +- [breaking] Simplify `CalendarDay` DOM ([#291](https://github.com/react-dates/react-dates/pull/291)) ## v6.1.0 -- [fix] Revert "Simplify `CalendarDay` DOM ([#291](https://github.com/airbnb/react-dates/pull/291))" -- [new] Add `renderDay` prop to customize the content of the `CalendarDay` component ([#307](https://github.com/airbnb/react-dates/pull/307)) +- [fix] Revert "Simplify `CalendarDay` DOM ([#291](https://github.com/react-dates/react-dates/pull/291))" +- [new] Add `renderDay` prop to customize the content of the `CalendarDay` component ([#307](https://github.com/react-dates/react-dates/pull/307)) ## v6.0.2 -- [fix] Fix `day` prop type warning to `CalendarDay` ([#305](https://github.com/airbnb/react-dates/pull/305)) -- [fix] Remove blinking cursor in iOS ([#304](https://github.com/airbnb/react-dates/pull/304)) -- [fix] Do not render `DayPicker` when not visible ([#286](https://github.com/airbnb/react-dates/pull/286)) -- [breaking] Simplify `CalendarDay` DOM ([#291](https://github.com/airbnb/react-dates/pull/291)) +- [fix] Fix `day` prop type warning to `CalendarDay` ([#305](https://github.com/react-dates/react-dates/pull/305)) +- [fix] Remove blinking cursor in iOS ([#304](https://github.com/react-dates/react-dates/pull/304)) +- [fix] Do not render `DayPicker` when not visible ([#286](https://github.com/react-dates/react-dates/pull/286)) +- [breaking] Simplify `CalendarDay` DOM ([#291](https://github.com/react-dates/react-dates/pull/291)) ## v6.0.1 - - [fix] Attached SDP closes on outside click again ([#288](https://github.com/airbnb/react-dates/pull/288)) - - [fix] SDP display value defaults to moment's `L` format again instead of ISO ([#285](https://github.com/airbnb/react-dates/pull/285)) + - [fix] Attached SDP closes on outside click again ([#288](https://github.com/react-dates/react-dates/pull/288)) + - [fix] SDP display value defaults to moment's `L` format again instead of ISO ([#285](https://github.com/react-dates/react-dates/pull/285)) ## v6.0.0 - - [breaking] Remove hidden `label` element in favor of an `aria-label` property ([#280](https://github.com/airbnb/react-dates/pull/280)) - - [new] Add `customArrowIcon` prop ([#277](https://github.com/airbnb/react-dates/pull/277)) - - [breaking] Remove mousedown/mouseup/touchstart/touchend/touchtap handlers in favor of click ([#275](https://github.com/airbnb/react-dates/pull/275)) - - [fix] Fix duplicate months created when increasing `numberOfMonths` and include year in `CalendarMonth` key ([#279](https://github.com/airbnb/react-dates/pull/279)) - - [new] Add `screenReaderInputMessage` to populate the `aria-describedby` attribute on the input ([#266](https://github.com/airbnb/react-dates/pull/266)) + - [breaking] Remove hidden `label` element in favor of an `aria-label` property ([#280](https://github.com/react-dates/react-dates/pull/280)) + - [new] Add `customArrowIcon` prop ([#277](https://github.com/react-dates/react-dates/pull/277)) + - [breaking] Remove mousedown/mouseup/touchstart/touchend/touchtap handlers in favor of click ([#275](https://github.com/react-dates/react-dates/pull/275)) + - [fix] Fix duplicate months created when increasing `numberOfMonths` and include year in `CalendarMonth` key ([#279](https://github.com/react-dates/react-dates/pull/279)) + - [new] Add `screenReaderInputMessage` to populate the `aria-describedby` attribute on the input ([#266](https://github.com/react-dates/react-dates/pull/266)) ## v5.2.0 - - [new] Add `VERTICAL_SCROLLABLE` orientation to the `DayPickerRangeController` and child components ([#250](https://github.com/airbnb/react-dates/pull/250)) + - [new] Add `VERTICAL_SCROLLABLE` orientation to the `DayPickerRangeController` and child components ([#250](https://github.com/react-dates/react-dates/pull/250)) ## v5.1.1 - - [fix] Fix regression where user was no longer able to type into input ([#269](https://github.com/airbnb/react-dates/pull/269)) + - [fix] Fix regression where user was no longer able to type into input ([#269](https://github.com/react-dates/react-dates/pull/269)) ## v5.1.0 - - [new] Add `showDefaultInputIcon` and `customInputIcon` prop to show an icon at the beginning of the input field ([#222](https://github.com/airbnb/react-dates/pull/222)) + - [new] Add `showDefaultInputIcon` and `customInputIcon` prop to show an icon at the beginning of the input field ([#222](https://github.com/react-dates/react-dates/pull/222)) ## v5.0.0 - - [breaking] Update input value to use ISO format instead of the display format ([#229](https://github.com/airbnb/react-dates/pull/229)) - - [breaking] Performance improvements, including the removal of the modifiers prop from `CalendarDay` ([#217](https://github.com/airbnb/react-dates/pull/217)) + - [breaking] Update input value to use ISO format instead of the display format ([#229](https://github.com/react-dates/react-dates/pull/229)) + - [breaking] Performance improvements, including the removal of the modifiers prop from `CalendarDay` ([#217](https://github.com/react-dates/react-dates/pull/217)) ## v4.3.3 - - [fix] Force DayPicker and CalendarMonthGrid alignment to the left ([#257](https://github.com/airbnb/react-dates/pull/257),[#258](https://github.com/airbnb/react-dates/pull/258)) + - [fix] Force DayPicker and CalendarMonthGrid alignment to the left ([#257](https://github.com/react-dates/react-dates/pull/257),[#258](https://github.com/react-dates/react-dates/pull/258)) ## v4.3.2 - - [fix] Finish refactor from 471bd602302f4dfe4f1e66b79d50b22f7511d8ba ([#233](https://github.com/airbnb/react-dates/pull/233)) + - [fix] Finish refactor from 471bd602302f4dfe4f1e66b79d50b22f7511d8ba ([#233](https://github.com/react-dates/react-dates/pull/233)) ## v4.3.1 (unpublished) - - [fix] Don’t create an unnecessary array from a NodeList, which avoids needing `Array.from` ([#233](https://github.com/airbnb/react-dates/pull/233)) + - [fix] Don’t create an unnecessary array from a NodeList, which avoids needing `Array.from` ([#233](https://github.com/react-dates/react-dates/pull/233)) ## v4.3.0 - - [new] Add today modifier to the `SingleDatePicker` component ([#218](https://github.com/airbnb/react-dates/pull/218)) - - [fix] Fix week header alignment when `numberOfMonths` is greater than 2 ([#221](https://github.com/airbnb/react-dates/pull/221)) - - [fix] Fix `transition`/`transform` prefixing on `.CalendarMonthGrid--animating` class ([#220](https://github.com/airbnb/react-dates/pull/220)) - - [fix] Do not allow `pointer-events` on invisible first month ([#227](https://github.com/airbnb/react-dates/pull/227)) - - [fix] Remove `maxLength` attribute from inputs ([#219](https://github.com/airbnb/react-dates/pull/219)) + - [new] Add today modifier to the `SingleDatePicker` component ([#218](https://github.com/react-dates/react-dates/pull/218)) + - [fix] Fix week header alignment when `numberOfMonths` is greater than 2 ([#221](https://github.com/react-dates/react-dates/pull/221)) + - [fix] Fix `transition`/`transform` prefixing on `.CalendarMonthGrid--animating` class ([#220](https://github.com/react-dates/react-dates/pull/220)) + - [fix] Do not allow `pointer-events` on invisible first month ([#227](https://github.com/react-dates/react-dates/pull/227)) + - [fix] Remove `maxLength` attribute from inputs ([#219](https://github.com/react-dates/react-dates/pull/219)) ## v4.2.0 - - [new] Add `isDayHighlighted` prop to the DRP/SDP which applies a `highlighted-calendar` to the relevant days ([#206](https://github.com/airbnb/react-dates/pull/206)) - - [new] Add `today` modifier to the `DayPickerRangeController` component ([#213](https://github.com/airbnb/react-dates/pull/213)) + - [new] Add `isDayHighlighted` prop to the DRP/SDP which applies a `highlighted-calendar` to the relevant days ([#206](https://github.com/react-dates/react-dates/pull/206)) + - [new] Add `today` modifier to the `DayPickerRangeController` component ([#213](https://github.com/react-dates/react-dates/pull/213)) ## v4.1.2 - - [fix] `DayPicker` now has initial width set, even before any other interaction ([#215](https://github.com/airbnb/react-dates/pull/215)) + - [fix] `DayPicker` now has initial width set, even before any other interaction ([#215](https://github.com/react-dates/react-dates/pull/215)) ## v4.1.1 - - [fix] Fix issue where the DayPicker height and width were not always being set initially ([#196](https://github.com/airbnb/react-dates/pull/196)) - - [fix] Fix closed DRP/SDP refocus issue on window blur and refocus ([#212](https://github.com/airbnb/react-dates/pull/212)) + - [fix] Fix issue where the DayPicker height and width were not always being set initially ([#196](https://github.com/react-dates/react-dates/pull/196)) + - [fix] Fix closed DRP/SDP refocus issue on window blur and refocus ([#212](https://github.com/react-dates/react-dates/pull/212)) ## v4.1.0 - - [new] Separate out date range input event handling logic into the `DateRangePickerInputController` component ([#180](https://github.com/airbnb/react-dates/pull/180)) - - [fix] Only responsivize the DRP and SDP when `withPortal` and `withFullScreenPortal` options are false ([#183](https://github.com/airbnb/react-dates/pull/183)) - - [new] Separate out date range calendar event handling logic and styles into the `DayPickerRangeController` component ([#167](https://github.com/airbnb/react-dates/pull/167)) + - [new] Separate out date range input event handling logic into the `DateRangePickerInputController` component ([#180](https://github.com/react-dates/react-dates/pull/180)) + - [fix] Only responsivize the DRP and SDP when `withPortal` and `withFullScreenPortal` options are false ([#183](https://github.com/react-dates/react-dates/pull/183)) + - [new] Separate out date range calendar event handling logic and styles into the `DayPickerRangeController` component ([#167](https://github.com/react-dates/react-dates/pull/167)) ## v4.0.2 - - [patch] Revert [#176](https://github.com/airbnb/react-dates/pull/176) ([#189](https://github.com/airbnb/react-dates/pull/189)) + - [patch] Revert [#176](https://github.com/react-dates/react-dates/pull/176) ([#189](https://github.com/react-dates/react-dates/pull/189)) ## v4.0.1 - - [patch] `initialVisibleMonth` prop will now be called every time the `DayPicker` is opened ([#176](https://github.com/airbnb/react-dates/pull/176)) - - [patch] Use the `readOnly` prop on inputs instead of the `disabled` prop on touch devices ([#174](https://github.com/airbnb/react-dates/pull/174)) + - [patch] `initialVisibleMonth` prop will now be called every time the `DayPicker` is opened ([#176](https://github.com/react-dates/react-dates/pull/176)) + - [patch] Use the `readOnly` prop on inputs instead of the `disabled` prop on touch devices ([#174](https://github.com/react-dates/react-dates/pull/174)) ## v4.0.0 - - [breaking] Cut the tether dependency from react-dates ([#163](https://github.com/airbnb/react-dates/pull/163)) + - [breaking] Cut the tether dependency from react-dates ([#163](https://github.com/react-dates/react-dates/pull/163)) ## v3.6.0 - - [new] Add `navPrev`/`navNext` props for custom month navigation ([#161](https://github.com/airbnb/react-dates/pull/161)) - - [fix] Add missing right border on caret ([#160](https://github.com/airbnb/react-dates/pull/160)) - - [fix] Adjust `DayPicker` height when `initialVisibleMonth` height is different from the current month's ([#159](https://github.com/airbnb/react-dates/pull/159)) - - [new] Add `keepOpenOnDateSelect` prop to the `DateRangePicker` and `SingleDatePicker` ([#157](https://github.com/airbnb/react-dates/pull/157)) + - [new] Add `navPrev`/`navNext` props for custom month navigation ([#161](https://github.com/react-dates/react-dates/pull/161)) + - [fix] Add missing right border on caret ([#160](https://github.com/react-dates/react-dates/pull/160)) + - [fix] Adjust `DayPicker` height when `initialVisibleMonth` height is different from the current month's ([#159](https://github.com/react-dates/react-dates/pull/159)) + - [new] Add `keepOpenOnDateSelect` prop to the `DateRangePicker` and `SingleDatePicker` ([#157](https://github.com/react-dates/react-dates/pull/157)) ## v3.5.0 - - [new] Add support for clear date button on the `SingleDatePicker` ([#155](https://github.com/airbnb/react-dates/pull/155)) - - [fix] Fix focus behavior for vertically attached datepickers ([#121](https://github.com/airbnb/react-dates/pull/121)) + - [new] Add support for clear date button on the `SingleDatePicker` ([#155](https://github.com/react-dates/react-dates/pull/155)) + - [fix] Fix focus behavior for vertically attached datepickers ([#121](https://github.com/react-dates/react-dates/pull/121)) ## v3.4.0 - - [new] Add support for `required` attribute on inputs ([#142](https://github.com/airbnb/react-dates/pull/142)) + - [new] Add support for `required` attribute on inputs ([#142](https://github.com/react-dates/react-dates/pull/142)) ## v3.3.4 - - [fix] Fix same tether overlay issue for the `SingleDatePicker` component ([#133](https://github.com/airbnb/react-dates/pull/133)) + - [fix] Fix same tether overlay issue for the `SingleDatePicker` component ([#133](https://github.com/react-dates/react-dates/pull/133)) ## v3.3.3 - - [fix] Allow for elements to be interacted with when rendered beneath the tether component ([#131](https://github.com/airbnb/react-dates/pull/131)) + - [fix] Allow for elements to be interacted with when rendered beneath the tether component ([#131](https://github.com/react-dates/react-dates/pull/131)) ## v3.3.2 - - [fix] Responsive the `DateRangePicker` and `SingleDatePicker` components ([#80](https://github.com/airbnb/react-dates/pull/83)) + - [fix] Responsive the `DateRangePicker` and `SingleDatePicker` components ([#80](https://github.com/react-dates/react-dates/pull/83)) ## v3.3.1 - - [fix] Update all days to use noon as their time stamp to fix a number of DST issues ([#114](https://github.com/airbnb/react-dates/pull/114)) + - [fix] Update all days to use noon as their time stamp to fix a number of DST issues ([#114](https://github.com/react-dates/react-dates/pull/114)) ## v3.3.0 - - [new] Add `anchorDirection` prop to the SingleDatePicker and DateRangePicker components ([#72](https://github.com/airbnb/react-dates/pull/72)) + - [new] Add `anchorDirection` prop to the SingleDatePicker and DateRangePicker components ([#72](https://github.com/react-dates/react-dates/pull/72)) ## v3.2.0 - - [new] Add `initialVisibleMonth` prop to the SingleDatePicker, DateRangePicker, and DayPicker components ([#70](https://github.com/airbnb/react-dates/pull/70)) + - [new] Add `initialVisibleMonth` prop to the SingleDatePicker, DateRangePicker, and DayPicker components ([#70](https://github.com/react-dates/react-dates/pull/70)) ## v3.1.1 - [fix] Fix moment dependencies to allow v2.10 - v2.14 ## v3.1.0 - - [new] Allow `displayFormat` prop to take a function as well as a string ([#98](https://github.com/airbnb/react-dates/pull/98)) - - [fix] Default value for `displayFormat` now actually returns moment's `L` format based on the locale ([#98](https://github.com/airbnb/react-dates/pull/98))) + - [new] Allow `displayFormat` prop to take a function as well as a string ([#98](https://github.com/react-dates/react-dates/pull/98)) + - [fix] Default value for `displayFormat` now actually returns moment's `L` format based on the locale ([#98](https://github.com/react-dates/react-dates/pull/98))) ## v3.0.0 - - [breaking] Move the constants file to the top-level ([#53](https://github.com/airbnb/react-dates/pull/53)) - - [breaking] Add `reopenPickerOnClearDates` prop so that the DateRangePicker no longer automatically reopens when clearing dates ([#75](https://github.com/airbnb/react-dates/pull/75)) + - [breaking] Move the constants file to the top-level ([#53](https://github.com/react-dates/react-dates/pull/53)) + - [breaking] Add `reopenPickerOnClearDates` prop so that the DateRangePicker no longer automatically reopens when clearing dates ([#75](https://github.com/react-dates/react-dates/pull/75)) ## v2.2.0 - - [fix] Fix height issue where an extra table row was being rendered for some months ([#57](https://github.com/airbnb/react-dates/pull/57)) - - [fix] Disables user-select on navigation ([#74](https://github.com/airbnb/react-dates/pull/74)) - - [new] Allows for a custom date display format ([#52](https://github.com/airbnb/react-dates/pull/52)) + - [fix] Fix height issue where an extra table row was being rendered for some months ([#57](https://github.com/react-dates/react-dates/pull/57)) + - [fix] Disables user-select on navigation ([#74](https://github.com/react-dates/react-dates/pull/74)) + - [new] Allows for a custom date display format ([#52](https://github.com/react-dates/react-dates/pull/52)) ## v2.1.1 - [fix] Fix initial day of month to utc to fix daylight savings time problem in Brazil and other locales diff --git a/INTHEWILD.md b/INTHEWILD.md index 636d59c2c..741d8e985 100644 --- a/INTHEWILD.md +++ b/INTHEWILD.md @@ -1,4 +1,4 @@ -Please use [pull requests](https://github.com/airbnb/react-dates/pull/new/master) to add your organization and/or project to this document! +Please use [pull requests](https://github.com/react-dates/react-dates/pull/new) to add your organization and/or project to this document! Organizations ---------- diff --git a/README.md b/README.md index da8f6c36e..0a37ef1f3 100644 --- a/README.md +++ b/README.md @@ -10,7 +10,7 @@ > An easily internationalizable, accessible, mobile-friendly datepicker library for the web. -![react-dates in action](https://raw.githubusercontent.com/airbnb/react-dates/master/react-dates-demo.gif) +![react-dates in action](https://raw.githubusercontent.com/react-dates/react-dates/HEAD/react-dates-demo.gif) ## Live Playground @@ -113,7 +113,7 @@ This would override the background and text colors applied to highlighted calend ### Make some awesome datepickers We provide a handful of components for your use. If you supply essential props to each component, you'll get a full featured interactive date picker. With additional optional props, you can customize the look and feel of the inputs, calendar, etc. You can see what each of the props do in the [live demo](http://airbnb.io/react-dates/) or explore -how to properly wrap the pickers in the [examples folder](https://github.com/airbnb/react-dates/tree/master/examples). +how to properly wrap the pickers in the [examples folder](https://github.com/react-dates/react-dates/tree/HEAD/examples). #### DateRangePicker The `DateRangePicker` is a fully controlled component that allows users to select a date range. You can control the selected @@ -356,7 +356,7 @@ The following is a list of other *OPTIONAL* props you may provide to the `DayPic moment.locale('pl'); // Polish ``` -However, this only solves date localization. For complete internationalization of the components, `react-dates` defines a certain amount of [user interface strings](https://github.com/airbnb/react-dates/blob/master/src/defaultPhrases.js) in English which can be changed through the `phrases` prop (explore the [storybook](http://airbnb.io/react-dates/?selectedKind=DateRangePicker%20%28DRP%29&selectedStory=non-english%20locale&full=0&addons=1&stories=1&panelRight=0&addonPanel=kadirahq%2Fstorybook-addon-actions%2Factions-panel) for examples). For accessibility and usability concerns, **all these UI elements should be translated**. +However, this only solves date localization. For complete internationalization of the components, `react-dates` defines a certain amount of [user interface strings](https://github.com/react-dates/react-dates/blob/HEAD/src/defaultPhrases.js) in English which can be changed through the `phrases` prop (explore the [storybook](http://airbnb.io/react-dates/?selectedKind=DateRangePicker%20%28DRP%29&selectedStory=non-english%20locale&full=0&addons=1&stories=1&panelRight=0&addonPanel=kadirahq%2Fstorybook-addon-actions%2Factions-panel) for examples). For accessibility and usability concerns, **all these UI elements should be translated**. ## Advanced @@ -364,7 +364,7 @@ However, this only solves date localization. For complete internationalization o ### Interfaces -The `react-dates/initialize` script actually relies on [react-with-styles-interface-css](https://github.com/airbnb/react-with-styles-interface-css) under the hood. If you are interested in a different solution for styling in your project, you can do your own initialization of a another [interface](https://github.com/airbnb/react-with-styles/blob/master/README.md#interfaces). At Airbnb, for instance, we rely on [Aphrodite](https://github.com/Khan/aphrodite) under the hood and therefore use the Aphrodite interface for `react-with-styles`. If you want to do the same, you would use the following pattern: +The `react-dates/initialize` script actually relies on [react-with-styles-interface-css](https://github.com/airbnb/react-with-styles-interface-css) under the hood. If you are interested in a different solution for styling in your project, you can do your own initialization of a another [interface](https://github.com/airbnb/react-with-styles/blob/HEAD/README.md#interfaces). At Airbnb, for instance, we rely on [Aphrodite](https://github.com/Khan/aphrodite) under the hood and therefore use the Aphrodite interface for `react-with-styles`. If you want to do the same, you would use the following pattern: ```js import ThemedStyleSheet from 'react-with-styles/lib/ThemedStyleSheet'; import aphroditeInterface from 'react-with-styles-interface-aphrodite'; @@ -377,7 +377,7 @@ ThemedStyleSheet.registerTheme(DefaultTheme); The above code has to be run before any `react-dates` component is imported. Otherwise, you will get an error. Also note that if you register any custom interface manually, you *must* also manually register a theme. ### Theming -`react-dates` also now supports a different way to theme. You can see the default theme values in [this file](https://github.com/airbnb/react-dates/blob/master/src/theme/DefaultTheme.js) and you would override them in the following manner: +`react-dates` also now supports a different way to theme. You can see the default theme values in [this file](https://github.com/react-dates/react-dates/blob/HEAD/src/theme/DefaultTheme.js) and you would override them in the following manner: ```js import ThemedStyleSheet from 'react-with-styles/lib/ThemedStyleSheet'; import aphroditeInterface from 'react-with-styles-interface-aphrodite'; @@ -405,16 +405,16 @@ ThemedStyleSheet.registerTheme({ The above code would use shades of green instead of shades of yellow for the highlight color on `CalendarDay` components. Note that you *must* register an interface if you manually register a theme. One will not work without the other. #### A note on using `react-with-styles-interface-css` -The default interface that `react-dates` ships with is the [CSS interface](https://github.com/airbnb/react-with-styles-interface-css). If you want to use this interface along with the theme registration method, you will need to rebuild the core `_datepicker.css` file. We do not currently expose a utility method to build this file, but you can follow along with the code in https://github.com/airbnb/react-dates/blob/master/scripts/buildCSS.js to build your own custom themed CSS file. +The default interface that `react-dates` ships with is the [CSS interface](https://github.com/airbnb/react-with-styles-interface-css). If you want to use this interface along with the theme registration method, you will need to rebuild the core `_datepicker.css` file. We do not currently expose a utility method to build this file, but you can follow along with the code in https://github.com/react-dates/react-dates/blob/HEAD/scripts/buildCSS.js to build your own custom themed CSS file. [package-url]: https://npmjs.org/package/react-dates -[npm-version-svg]: http://versionbadg.es/airbnb/react-dates.svg -[travis-svg]: https://travis-ci.org/airbnb/react-dates.svg -[travis-url]: https://travis-ci.org/airbnb/react-dates -[deps-svg]: https://david-dm.org/airbnb/react-dates.svg -[deps-url]: https://david-dm.org/airbnb/react-dates -[dev-deps-svg]: https://david-dm.org/airbnb/react-dates/dev-status.svg -[dev-deps-url]: https://david-dm.org/airbnb/react-dates#info=devDependencies +[npm-version-svg]: http://versionbadg.es/react-dates/react-dates.svg +[travis-svg]: https://travis-ci.org/react-dates/react-dates.svg +[travis-url]: https://travis-ci.org/react-dates/react-dates +[deps-svg]: https://david-dm.org/react-dates/react-dates.svg +[deps-url]: https://david-dm.org/react-dates/react-dates +[dev-deps-svg]: https://david-dm.org/react-dates/react-dates/dev-status.svg +[dev-deps-url]: https://david-dm.org/react-dates/react-dates#info=devDependencies [npm-badge-png]: https://nodei.co/npm/react-dates.png?downloads=true&stars=true [license-image]: http://img.shields.io/npm/l/react-dates.svg [license-url]: LICENSE diff --git a/package.json b/package.json index b052d45f1..519e8886b 100644 --- a/package.json +++ b/package.json @@ -40,14 +40,14 @@ }, "repository": { "type": "git", - "url": "git+https://github.com/airbnb/react-dates.git" + "url": "git+https://github.com/react-dates/react-dates.git" }, "author": "Maja Wichrowska ", "license": "MIT", "bugs": { - "url": "https://github.com/airbnb/react-dates/issues" + "url": "https://github.com/react-dates/react-dates/issues" }, - "homepage": "https://github.com/airbnb/react-dates#readme", + "homepage": "https://github.com/react-dates/react-dates#readme", "devDependencies": { "@babel/cli": "^7.12.10", "@babel/core": "^7.12.10", diff --git a/stories/DayPickerRangeController.js b/stories/DayPickerRangeController.js index 47b4ecca0..39bb9716a 100644 --- a/stories/DayPickerRangeController.js +++ b/stories/DayPickerRangeController.js @@ -24,7 +24,7 @@ const dayPickerRangeControllerInfo = `The ${monospace('DayPickerRangeController' ${monospace('startDate')}, and ${monospace('endDate')} values in state and then pass these down as props along with ${monospace('onFocusChange')} and ${monospace('onDatesChange')} callbacks that update them appropriately. You can see an example of this implementation + "https://github.com/react-dates/react-dates/blob/HEAD/examples/DayPickerRangeControllerWrapper.jsx"> here.

Note that the ${monospace('focusedInput')} prop may be ${monospace('null')}, but if this is the case, dates are not selectable. As a result, in the example wrapper, we always force diff --git a/stories/DayPickerSingleDateController.js b/stories/DayPickerSingleDateController.js index ef05c0830..7126f7542 100644 --- a/stories/DayPickerSingleDateController.js +++ b/stories/DayPickerSingleDateController.js @@ -22,7 +22,7 @@ const dayPickerSingleDateControllerInfo = `The ${monospace('DayPickerSingleDateC ${monospace('date')} values in state and then pass these down as props along with ${monospace('onFocusChange')} and ${monospace('onDateChange')} callbacks that update them appropriately. You can see an example of this implementation + "https://github.com/react-dates/react-dates/blob/HEAD/examples/DayPickerSingleDateControllerWrapper.jsx"> here.

Note that the ${monospace('focused')} prop may be ${monospace('false')}, but if this is the case, dates are not selectable. As a result, in the example wrapper, we always force diff --git a/stories/PresetDateRangePicker.js b/stories/PresetDateRangePicker.js index 0063a3a25..2d2660327 100644 --- a/stories/PresetDateRangePicker.js +++ b/stories/PresetDateRangePicker.js @@ -11,9 +11,9 @@ const presetDateRangePickerControllerInfo = `The ${monospace('PresetDateRangePic exported by ${monospace('react-dates')}. It is instead an example of how you might use the ${monospace('DateRangePicker')} along with the ${monospace('renderCalendarInfo')} prop in order to add preset range buttons for easy range selection. You can see the example code - + here and - + here.`; const today = moment(); From 0061fadfe321a42beeb7ec35d6ff8fab2898a227 Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Sat, 22 Jan 2022 08:43:16 -0800 Subject: [PATCH 22/31] [Dev Deps] update `@babel/cli`, `@babel/core`, `@babel/register`, `@babel/runtime` --- package.json | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index 519e8886b..fe5581665 100644 --- a/package.json +++ b/package.json @@ -49,10 +49,10 @@ }, "homepage": "https://github.com/react-dates/react-dates#readme", "devDependencies": { - "@babel/cli": "^7.12.10", - "@babel/core": "^7.12.10", - "@babel/register": "^7.12.10", - "@babel/runtime": "^7.12.5", + "@babel/cli": "^7.16.8", + "@babel/core": "^7.16.12", + "@babel/register": "^7.16.9", + "@babel/runtime": "^7.16.7", "@storybook/addon-actions": "^5.3.21", "@storybook/addon-info": "^5.3.21", "@storybook/addon-links": "^5.3.21", From 9cf2c97a8794d5f45ee074e0f8414728ee761b74 Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Sat, 22 Jan 2022 08:49:04 -0800 Subject: [PATCH 23/31] [Dev Deps] use `@babel/eslint-parser` instead of `babel-eslint` --- .eslintignore | 4 ---- .eslintrc | 19 +++++++++++++------ package.json | 2 +- src/components/DateRangePickerInput.jsx | 16 +++++++--------- 4 files changed, 21 insertions(+), 20 deletions(-) delete mode 100644 .eslintignore diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index edfe81afb..000000000 --- a/.eslintignore +++ /dev/null @@ -1,4 +0,0 @@ -lib/ -.storybook/ -test/_helpers/ -webpack.config.js diff --git a/.eslintrc b/.eslintrc index bcb6102a2..5961c32bb 100644 --- a/.eslintrc +++ b/.eslintrc @@ -3,19 +3,26 @@ "extends": [ "airbnb", - "plugin:react-with-styles/recommended" + "plugin:react-with-styles/recommended", ], "plugins": [ - "react-with-styles" + "react-with-styles", ], "env": { "browser": true, - "node": true + "node": true, }, - "parser": "babel-eslint", + "ignorePatterns": [ + "lib/", + ".storybook/", + "test/_helpers/", + "webpack.config.js", + ], + + "parser": "@babel/eslint-parser", "rules": { "react/forbid-foreign-prop-types": 2, // For babel-plugin-transform-react-remove-prop-types @@ -44,7 +51,7 @@ //"devDependencies": true //}], "indent": [2, 2, { - "MemberExpression": "off" + "MemberExpression": "off", }], }, }, @@ -52,5 +59,5 @@ "settings": { "propWrapperFunctions": ["forbidExtraProps", "exact", "Object.freeze"], - } + }, } diff --git a/package.json b/package.json index fe5581665..530d17ef0 100644 --- a/package.json +++ b/package.json @@ -51,6 +51,7 @@ "devDependencies": { "@babel/cli": "^7.16.8", "@babel/core": "^7.16.12", + "@babel/eslint-parser": "^7.16.5", "@babel/register": "^7.16.9", "@babel/runtime": "^7.16.7", "@storybook/addon-actions": "^5.3.21", @@ -62,7 +63,6 @@ "@welldone-software/why-did-you-render": "^3.6.0", "airbnb-js-shims": "^2.2.1", "aphrodite": "^2.4.0", - "babel-eslint": "^10.1.0", "babel-loader": "^8.2.2", "babel-plugin-inline-react-svg": "^1.1.2", "babel-plugin-inline-svg": "^1.2.0", diff --git a/src/components/DateRangePickerInput.jsx b/src/components/DateRangePickerInput.jsx index 09e2ef7d8..b17591531 100644 --- a/src/components/DateRangePickerInput.jsx +++ b/src/components/DateRangePickerInput.jsx @@ -260,15 +260,13 @@ function DateRangePickerInput({ {!isEndDateFocused && children} - { - - } + Date: Fri, 21 Jan 2022 18:14:34 -0800 Subject: [PATCH 24/31] [Dev Deps] update `eslint`, `eslint-config-airbnb`, `eslint-plugin-import`, `eslint-plugin-jsx-a11y`, `eslint-plugin-react`, `eslint-plugin-react-hooks`, `eslint-plugin-react-with-styles` --- .eslintrc | 3 +++ package.json | 14 +++++++------- src/components/DayPickerRangeController.jsx | 4 +--- src/components/DayPickerSingleDateController.jsx | 4 +--- 4 files changed, 12 insertions(+), 13 deletions(-) diff --git a/.eslintrc b/.eslintrc index 5961c32bb..d5780077d 100644 --- a/.eslintrc +++ b/.eslintrc @@ -25,6 +25,8 @@ "parser": "@babel/eslint-parser", "rules": { + "max-len": "off", + "react/forbid-foreign-prop-types": 2, // For babel-plugin-transform-react-remove-prop-types "jsx-a11y/click-events-have-key-events": 1, // TODO: enable @@ -53,6 +55,7 @@ "indent": [2, 2, { "MemberExpression": "off", }], + "react/function-component-definition": "off", }, }, ], diff --git a/package.json b/package.json index 530d17ef0..1d6f8a97c 100644 --- a/package.json +++ b/package.json @@ -74,13 +74,13 @@ "cross-env": "^5.2.1", "enzyme": "^3.11.0", "enzyme-adapter-react-helper": "^1.3.9", - "eslint": "^7.18.0", - "eslint-config-airbnb": "^18.2.1", - "eslint-plugin-import": "^2.22.1", - "eslint-plugin-jsx-a11y": "^6.4.1", - "eslint-plugin-react": "^7.22.0", - "eslint-plugin-react-hooks": "^4.2.0", - "eslint-plugin-react-with-styles": "^2.3.0", + "eslint": "^8.7.0", + "eslint-config-airbnb": "^19.0.4", + "eslint-plugin-import": "^2.25.4", + "eslint-plugin-jsx-a11y": "^6.5.1", + "eslint-plugin-react": "^7.28.0", + "eslint-plugin-react-hooks": "^4.3.0", + "eslint-plugin-react-with-styles": "^2.4.0", "git-directory-deploy": "^1.5.1", "imports-loader": "^0.8.0", "in-publish": "^2.0.1", diff --git a/src/components/DayPickerRangeController.jsx b/src/components/DayPickerRangeController.jsx index 881c4e75e..6b5cb732b 100644 --- a/src/components/DayPickerRangeController.jsx +++ b/src/components/DayPickerRangeController.jsx @@ -1023,9 +1023,7 @@ export default class DayPickerRangeController extends React.PureComponent { const { currentMonth, visibleDays } = this.state; const firstPreviousMonth = currentMonth.clone().subtract(numberOfMonths, 'month'); - const newVisibleDays = getVisibleDays( - firstPreviousMonth, numberOfMonths, enableOutsideDays, true, - ); + const newVisibleDays = getVisibleDays(firstPreviousMonth, numberOfMonths, enableOutsideDays, true); this.setState({ currentMonth: firstPreviousMonth.clone(), diff --git a/src/components/DayPickerSingleDateController.jsx b/src/components/DayPickerSingleDateController.jsx index d4fae5360..1bf1a1d71 100644 --- a/src/components/DayPickerSingleDateController.jsx +++ b/src/components/DayPickerSingleDateController.jsx @@ -529,9 +529,7 @@ export default class DayPickerSingleDateController extends React.PureComponent { const { currentMonth, visibleDays } = this.state; const firstPreviousMonth = currentMonth.clone().subtract(numberOfMonths, 'month'); - const newVisibleDays = getVisibleDays( - firstPreviousMonth, numberOfMonths, enableOutsideDays, true, - ); + const newVisibleDays = getVisibleDays(firstPreviousMonth, numberOfMonths, enableOutsideDays, true); this.setState({ currentMonth: firstPreviousMonth.clone(), From d96761af0a204a56a51089ef5d4375bad222a4ff Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Sat, 22 Jan 2022 11:31:14 -0800 Subject: [PATCH 25/31] [Dev Deps] update `karma` --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 1d6f8a97c..a227f5ce2 100644 --- a/package.json +++ b/package.json @@ -84,7 +84,7 @@ "git-directory-deploy": "^1.5.1", "imports-loader": "^0.8.0", "in-publish": "^2.0.1", - "karma": "^4.2.0", + "karma": "^6.3.11", "karma-chai": "^0.1.0", "karma-firefox-launcher": "^1.2.0", "karma-mocha": "^1.3.0", From 116cc83da34c3570644305dcc1deb1b5a27dc403 Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Sat, 22 Jan 2022 11:31:54 -0800 Subject: [PATCH 26/31] [Dev Deps] update `karma-mocha` --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index a227f5ce2..96b06cd2a 100644 --- a/package.json +++ b/package.json @@ -87,7 +87,7 @@ "karma": "^6.3.11", "karma-chai": "^0.1.0", "karma-firefox-launcher": "^1.2.0", - "karma-mocha": "^1.3.0", + "karma-mocha": "^2.0.1", "karma-sinon": "^1.0.5", "karma-webpack": "^4.0.2", "mkdirp": "^0.5.5", From fede38af4655075bab1cc35d3dadc38e314e4a88 Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Sat, 22 Jan 2022 11:34:24 -0800 Subject: [PATCH 27/31] [Dev Deps] update `sinon` --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 96b06cd2a..13ce0456d 100644 --- a/package.json +++ b/package.json @@ -104,7 +104,7 @@ "rimraf": "^2.7.1", "safe-publish-latest": "^1.1.4", "sass-loader": "^7.3.1", - "sinon": "^7.5.0", + "sinon": "^8.1.1", "sinon-sandbox": "^2.0.6", "style-loader": "^0.20.3", "typescript": "*", From 9c570e6745d5444c721bd5f21619bb8d559fc631 Mon Sep 17 00:00:00 2001 From: Mohsen Azimi Date: Sat, 22 Jan 2022 00:06:13 -0300 Subject: [PATCH 28/31] [readme] Update the link to demo --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 0a37ef1f3..ffa3f4973 100644 --- a/README.md +++ b/README.md @@ -14,7 +14,7 @@ ## Live Playground -For examples of the datepicker in action, go to http://airbnb.io/react-dates. +For examples of the datepicker in action, go to [react-dates.github.io](https://react-dates.github.io/react-dates/). OR From 6a65043b79871c60b97ac9d19eb1f5b62e684ab2 Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Sun, 23 Jan 2022 14:15:01 -0800 Subject: [PATCH 29/31] [Fix] pin `color2k` to ~1.1, to restore node 4 compat See https://github.com/ricokahler/color2k/issues/413 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 13ce0456d..ad6bfc80d 100644 --- a/package.json +++ b/package.json @@ -112,7 +112,7 @@ }, "dependencies": { "airbnb-prop-types": "^2.16.0", - "color2k": "^1.2.4", + "color2k": "~1.1.1", "consolidated-events": "^1.1.1 || ^2.0.0", "enzyme-shallow-equal": "^1.0.4", "is-touch-device": "^1.0.1", From 2cb51c1f68e54ce1b58e6c5d58c38d4c97fe6d85 Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Wed, 26 Jan 2022 12:58:53 -0800 Subject: [PATCH 30/31] [Tests] actually test on react versions in the matrix; add some more versions --- .github/workflows/node.yml | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/.github/workflows/node.yml b/.github/workflows/node.yml index 64fd77892..7b9fb66f9 100644 --- a/.github/workflows/node.yml +++ b/.github/workflows/node.yml @@ -27,9 +27,14 @@ jobs: matrix: node-version: ${{ fromJson(needs.matrix.outputs.latest) }} react: - - 16 - - 15 - - 0.14 + - '16' + - '16.9' + - '16.3' + - '16.0' + - '15' + - '15.5' + - '15.0' + # - '0.14' # TODO: fix pure-component-fallbacl steps: - uses: actions/checkout@v2 @@ -38,6 +43,8 @@ jobs: with: node-version: ${{ matrix.node-version }} - run: npm run tests-only + env: + REACT: ${{ matrix.react }} - uses: codecov/codecov-action@v2 node: From b7bad38dcff024d374ee98f972b55b3de9e61289 Mon Sep 17 00:00:00 2001 From: Jordan Harband Date: Wed, 26 Jan 2022 12:44:40 -0800 Subject: [PATCH 31/31] [Tests] build tests first, so CI can build/test in different stages --- .babelrc | 8 ++++++++ .github/workflows/node.yml | 42 +++++++++++++++++++++++++++++++++----- .gitignore | 1 + .npmignore | 1 + .nycrc | 1 - package.json | 15 ++++++++------ test/mocha.opts | 3 +-- 7 files changed, 57 insertions(+), 14 deletions(-) diff --git a/.babelrc b/.babelrc index 4e91c4584..cc5885df6 100644 --- a/.babelrc +++ b/.babelrc @@ -3,6 +3,14 @@ "test": { "presets": [["airbnb", { looseClasses: true }]], "plugins": [ + ["import-path-replace", { + "rules": [ + { + "match": "../src/", + "replacement": "../lib/" + } + ] + }], ["inline-react-svg", { "svgo": false }], diff --git a/.github/workflows/node.yml b/.github/workflows/node.yml index 7b9fb66f9..1f5467ef3 100644 --- a/.github/workflows/node.yml +++ b/.github/workflows/node.yml @@ -14,11 +14,31 @@ jobs: with: type: 'majors' versionsAsRoot: true - preset: '>=6' - # to test in node < 6, we need to run the build in one stage, including the tests, and then run the tests in the desired node version later + preset: '>=4' + + build: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v2 + - uses: ljharb/actions/node/install@main + with: + node-version: 'lts/*' + - uses: actions/cache@v2 + id: cache + with: + path: | + lib + esm + test-build + key: ${{ runner.os }}-${{ hashFiles('package.json', 'src/**', 'test/**', 'scripts/buildCSS.js') }} + - run: npm run build + if: steps.cache.outputs.cache-hit != 'true' + - run: npm run build:test + if: steps.cache.outputs.cache-hit != 'true' + majors: - needs: [matrix] + needs: [build, matrix] name: 'latest minors' runs-on: ubuntu-latest @@ -34,7 +54,7 @@ jobs: - '15' - '15.5' - '15.0' - # - '0.14' # TODO: fix pure-component-fallbacl + - '0.14' steps: - uses: actions/checkout@v2 @@ -42,13 +62,25 @@ jobs: name: 'nvm install ${{ matrix.node-version }} && npm install' with: node-version: ${{ matrix.node-version }} + skip-ls-check: ${{ !startsWith(matrix.node-version, '5.') && !startsWith(matrix.node-version, '4.') && 'true' || 'false' }} + - uses: actions/cache@v2 + id: cache + with: + path: | + lib + esm + test-build + key: ${{ runner.os }}-${{ hashFiles('package.json', 'src/**', 'test/**', 'scripts/buildCSS.js') }} + - run: npm run react + env: + REACT: ${{ matrix.react }} - run: npm run tests-only env: REACT: ${{ matrix.react }} - uses: codecov/codecov-action@v2 node: - name: 'node 6+' + name: 'node.js' needs: [majors] runs-on: ubuntu-latest steps: diff --git a/.gitignore b/.gitignore index 6374bef43..3d7cb404f 100644 --- a/.gitignore +++ b/.gitignore @@ -35,6 +35,7 @@ node_modules # build folder lib esm +test-build .idea # gh-pages diff --git a/.npmignore b/.npmignore index f88e53c22..f27011d80 100644 --- a/.npmignore +++ b/.npmignore @@ -44,5 +44,6 @@ public react-dates-demo.gif stories test +test-build css !lib/css diff --git a/.nycrc b/.nycrc index 90d79055a..33fbfd6d2 100644 --- a/.nycrc +++ b/.nycrc @@ -7,7 +7,6 @@ "src" ], "require": [ - "@babel/register" ], "reporter": [ "text", diff --git a/package.json b/package.json index ad6bfc80d..d6c29274c 100644 --- a/package.json +++ b/package.json @@ -5,22 +5,23 @@ "main": "index.js", "scripts": { "prebuild": "npm run clean", - "build": "npm run build:cjs && npm run build:esm && npm run build:css -- --optimize ", + "build": "npm run build:cjs && npm run build:esm && npm run build:css -- --optimize", + "postbuild": "npm run build:test", "build:cjs": "BABEL_ENV=cjs babel src/ -d lib/", "build:esm": "BABEL_ENV=esm babel src/ -d esm/", + "build:test": "BABEL_ENV=test babel test/ -d test-build/", "prebuild:css": "rimraf lib/css && mkdirp lib/css", "build:css": "node scripts/buildCSS.js", - "clean": "rimraf lib esm", + "clean": "rimraf lib esm test-build", "lint": "eslint --ext .js,.jsx src test", - "mocha": "mocha ./test/_helpers", + "mocha": "mocha ./test-build/_helpers", "storybook:uninstall": "npm uninstall --no-save @storybook/react && rimraf node_modules/@storybook node_modules/react-modal node_modules/react-dom-factories", "react": "NPM_CONFIG_LEGACY_PEER_DEPS=true enzyme-adapter-react-install 16", "pretest": "npm run --silent lint", - "pretests-only": "npm run react", "tests-only": "cross-env NODE_ENV=test nyc npm run mocha --silent", "pretests-karma": "npm run react", "tests-karma": "karma start", - "test": "npm run build && npm run tests-only", + "test": "npm run react && npm run build && npm run build:test && npm run tests-only", "storybook": "start-storybook -p 6006", "storybook:css": "npm run build:css && start-storybook -p 6006 -c .storybook-css", "tag": "git tag v$npm_package_version", @@ -64,12 +65,14 @@ "airbnb-js-shims": "^2.2.1", "aphrodite": "^2.4.0", "babel-loader": "^8.2.2", + "babel-plugin-import-path-replace": "^0.1.0", "babel-plugin-inline-react-svg": "^1.1.2", "babel-plugin-inline-svg": "^1.2.0", "babel-plugin-istanbul": "^5.2.0", "babel-plugin-transform-replace-object-assign": "^2.0.0", "babel-preset-airbnb": "^4.5.0", "chai": "^4.2.0", + "cheerio": "=1.0.0-rc.3", "clean-css": "^4.2.3", "cross-env": "^5.2.1", "enzyme": "^3.11.0", @@ -104,7 +107,7 @@ "rimraf": "^2.7.1", "safe-publish-latest": "^1.1.4", "sass-loader": "^7.3.1", - "sinon": "^8.1.1", + "sinon": "^7.5.0", "sinon-sandbox": "^2.0.6", "style-loader": "^0.20.3", "typescript": "*", diff --git a/test/mocha.opts b/test/mocha.opts index 6f1ab8e67..22acddc5b 100644 --- a/test/mocha.opts +++ b/test/mocha.opts @@ -1,3 +1,2 @@ ---require @babel/register --require airbnb-js-shims -test/**/*.{js,jsx} +test-build/**/*.js