react-calendar
Advanced tools
Comparing version 3.8.0 to 3.9.0
@@ -618,2 +618,3 @@ var _excluded = ["activeStartDate", "defaultActiveStartDate", "defaultValue", "defaultView", "maxDetail", "minDetail", "value", "view"]; | ||
formatShortWeekday = _this$props10.formatShortWeekday, | ||
formatWeekday = _this$props10.formatWeekday, | ||
onClickWeekNumber = _this$props10.onClickWeekNumber, | ||
@@ -630,2 +631,3 @@ showDoubleView = _this$props10.showDoubleView, | ||
formatShortWeekday: formatShortWeekday, | ||
formatWeekday: formatWeekday, | ||
onClickWeekNumber: onClickWeekNumber, | ||
@@ -749,2 +751,3 @@ onMouseLeave: selectRange ? onMouseLeave : null, | ||
formatShortWeekday: PropTypes.func, | ||
formatWeekday: PropTypes.func, | ||
formatYear: PropTypes.func, | ||
@@ -751,0 +754,0 @@ goToRangeStartOnSelect: PropTypes.bool, |
import Calendar from './Calendar'; | ||
import Navigation from './Calendar/Navigation'; | ||
import CenturyView from './CenturyView'; | ||
@@ -7,2 +8,2 @@ import DecadeView from './DecadeView'; | ||
export default Calendar; | ||
export { Calendar, CenturyView, DecadeView, YearView, MonthView }; | ||
export { Calendar, Navigation, CenturyView, DecadeView, YearView, MonthView }; |
@@ -1,2 +0,2 @@ | ||
var _excluded = ["calendarType", "formatShortWeekday", "onClickWeekNumber", "showWeekNumbers"]; | ||
var _excluded = ["calendarType", "formatShortWeekday", "formatWeekday", "onClickWeekNumber", "showWeekNumbers"]; | ||
@@ -33,2 +33,3 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } | ||
formatShortWeekday = props.formatShortWeekday, | ||
formatWeekday = props.formatWeekday, | ||
onClickWeekNumber = props.onClickWeekNumber, | ||
@@ -42,2 +43,3 @@ showWeekNumbers = props.showWeekNumbers, | ||
formatShortWeekday: formatShortWeekday, | ||
formatWeekday: formatWeekday, | ||
locale: locale, | ||
@@ -87,2 +89,3 @@ onMouseLeave: onMouseLeave | ||
formatShortWeekday: PropTypes.func, | ||
formatWeekday: PropTypes.func, | ||
locale: PropTypes.string, | ||
@@ -89,0 +92,0 @@ onClickWeekNumber: PropTypes.func, |
@@ -7,3 +7,3 @@ import React from 'react'; | ||
import { getDayOfWeek, isWeekend } from '../shared/dates'; | ||
import { formatWeekday, formatShortWeekday as defaultFormatShortWeekday } from '../shared/dateFormatter'; | ||
import { formatShortWeekday as defaultFormatShortWeekday, formatWeekday as defaultFormatWeekday } from '../shared/dateFormatter'; | ||
import { isCalendarType } from '../shared/propTypes'; | ||
@@ -16,2 +16,4 @@ var className = 'react-calendar__month-view__weekdays'; | ||
formatShortWeekday = _props$formatShortWee === void 0 ? defaultFormatShortWeekday : _props$formatShortWee, | ||
_props$formatWeekday = props.formatWeekday, | ||
formatWeekday = _props$formatWeekday === void 0 ? defaultFormatWeekday : _props$formatWeekday, | ||
locale = props.locale, | ||
@@ -47,4 +49,5 @@ onMouseLeave = props.onMouseLeave; | ||
formatShortWeekday: PropTypes.func, | ||
formatWeekday: PropTypes.func, | ||
locale: PropTypes.string, | ||
onMouseLeave: PropTypes.func | ||
}; |
@@ -642,2 +642,3 @@ "use strict"; | ||
formatShortWeekday = _this$props10.formatShortWeekday, | ||
formatWeekday = _this$props10.formatWeekday, | ||
onClickWeekNumber = _this$props10.onClickWeekNumber, | ||
@@ -654,2 +655,3 @@ showDoubleView = _this$props10.showDoubleView, | ||
formatShortWeekday: formatShortWeekday, | ||
formatWeekday: formatWeekday, | ||
onClickWeekNumber: onClickWeekNumber, | ||
@@ -776,2 +778,3 @@ onMouseLeave: selectRange ? onMouseLeave : null, | ||
formatShortWeekday: _propTypes["default"].func, | ||
formatWeekday: _propTypes["default"].func, | ||
formatYear: _propTypes["default"].func, | ||
@@ -778,0 +781,0 @@ goToRangeStartOnSelect: _propTypes["default"].bool, |
@@ -30,2 +30,8 @@ "use strict"; | ||
}); | ||
Object.defineProperty(exports, "Navigation", { | ||
enumerable: true, | ||
get: function get() { | ||
return _Navigation["default"]; | ||
} | ||
}); | ||
Object.defineProperty(exports, "YearView", { | ||
@@ -41,2 +47,4 @@ enumerable: true, | ||
var _Navigation = _interopRequireDefault(require("./Calendar/Navigation")); | ||
var _CenturyView = _interopRequireDefault(require("./CenturyView")); | ||
@@ -43,0 +51,0 @@ |
@@ -24,3 +24,3 @@ "use strict"; | ||
var _excluded = ["calendarType", "formatShortWeekday", "onClickWeekNumber", "showWeekNumbers"]; | ||
var _excluded = ["calendarType", "formatShortWeekday", "formatWeekday", "onClickWeekNumber", "showWeekNumbers"]; | ||
@@ -50,2 +50,3 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } | ||
formatShortWeekday = props.formatShortWeekday, | ||
formatWeekday = props.formatWeekday, | ||
onClickWeekNumber = props.onClickWeekNumber, | ||
@@ -59,2 +60,3 @@ showWeekNumbers = props.showWeekNumbers, | ||
formatShortWeekday: formatShortWeekday, | ||
formatWeekday: formatWeekday, | ||
locale: locale, | ||
@@ -105,2 +107,3 @@ onMouseLeave: onMouseLeave | ||
formatShortWeekday: _propTypes["default"].func, | ||
formatWeekday: _propTypes["default"].func, | ||
locale: _propTypes["default"].string, | ||
@@ -107,0 +110,0 @@ onClickWeekNumber: _propTypes["default"].func, |
@@ -33,2 +33,4 @@ "use strict"; | ||
formatShortWeekday = _props$formatShortWee === void 0 ? _dateFormatter.formatShortWeekday : _props$formatShortWee, | ||
_props$formatWeekday = props.formatWeekday, | ||
formatWeekday = _props$formatWeekday === void 0 ? _dateFormatter.formatWeekday : _props$formatWeekday, | ||
locale = props.locale, | ||
@@ -44,3 +46,3 @@ onMouseLeave = props.onMouseLeave; | ||
var weekdayDate = new Date(year, monthIndex, weekday - (0, _dates.getDayOfWeek)(beginOfMonth, calendarType)); | ||
var abbr = (0, _dateFormatter.formatWeekday)(locale, weekdayDate); | ||
var abbr = formatWeekday(locale, weekdayDate); | ||
weekdays.push( /*#__PURE__*/_react["default"].createElement("div", { | ||
@@ -66,4 +68,5 @@ key: weekday, | ||
formatShortWeekday: _propTypes["default"].func, | ||
formatWeekday: _propTypes["default"].func, | ||
locale: _propTypes["default"].string, | ||
onMouseLeave: _propTypes["default"].func | ||
}; |
{ | ||
"name": "react-calendar", | ||
"version": "3.8.0", | ||
"version": "3.9.0", | ||
"description": "Ultimate calendar for your React app.", | ||
@@ -5,0 +5,0 @@ "main": "dist/umd/index.js", |
@@ -46,2 +46,6 @@ [![npm](https://img.shields.io/npm/v/react-calendar.svg)](https://www.npmjs.com/package/react-calendar) ![downloads](https://img.shields.io/npm/dt/react-calendar.svg) [![CI](https://github.com/wojtekmaj/react-calendar/workflows/CI/badge.svg)](https://github.com/wojtekmaj/react-calendar/actions) [![tested with jest](https://img.shields.io/badge/tested_with-jest-99424f.svg)](https://github.com/facebook/jest) | ||
#### My locale isn't supported! What can I do? | ||
If your locale isn't supported, you can use [Intl.js](https://github.com/andyearnshaw/Intl.js/) or another Intl polyfill along with React-Calendar. | ||
### Installation | ||
@@ -101,3 +105,4 @@ | ||
| formatMonthYear | Function called to override default formatting of months and years. Can be used to use your own formatting function. | (default formatter) | `(locale, date) => formatDate(date, 'MMMM YYYY')` | | ||
| formatShortWeekday | Function called to override default formatting of weekday names. Can be used to use your own formatting function. | (default formatter) | `(locale, date) => formatDate(date, 'dd')` | | ||
| formatShortWeekday | Function called to override default formatting of weekday names (shortened). Can be used to use your own formatting function. | (default formatter) | `(locale, date) => formatDate(date, 'dd')` | | ||
| formatWeekday | Function called to override default formatting of weekday names. Can be used to use your own formatting function. | (default formatter) | `(locale, date) => formatDate(date, 'dd')` | | ||
| formatYear | Function called to override default formatting of year in the top navigation section. Can be used to use your own formatting function. | (default formatter) | `(locale, date) => formatDate(date, 'YYYY')` | | ||
@@ -104,0 +109,0 @@ | goToRangeStartOnSelect | Whether to go to the beginning of the range when selecting the end of the range. | `true` | `false` | |
@@ -518,2 +518,3 @@ import React, { Component } from 'react'; | ||
formatShortWeekday, | ||
formatWeekday, | ||
onClickWeekNumber, | ||
@@ -533,2 +534,3 @@ showDoubleView, | ||
formatShortWeekday={formatShortWeekday} | ||
formatWeekday={formatWeekday} | ||
onClickWeekNumber={onClickWeekNumber} | ||
@@ -664,2 +666,3 @@ onMouseLeave={selectRange ? onMouseLeave : null} | ||
formatShortWeekday: PropTypes.func, | ||
formatWeekday: PropTypes.func, | ||
formatYear: PropTypes.func, | ||
@@ -666,0 +669,0 @@ goToRangeStartOnSelect: PropTypes.bool, |
@@ -897,3 +897,3 @@ import React, { createRef } from 'react'; | ||
it('passes formatShortWeekday to MonthView component', () => { | ||
const formatShortWeekday = () => 'Weekday'; | ||
const formatShortWeekday = () => 'Wkdy'; | ||
@@ -904,5 +904,16 @@ const { container } = render(<Calendar formatShortWeekday={formatShortWeekday} />); | ||
expect(monthView).toHaveTextContent('Weekday'); | ||
expect(monthView).toHaveTextContent('Wkdy'); | ||
}); | ||
it('passes formatWeekday to MonthView component', () => { | ||
const formatWeekday = () => 'Weekday'; | ||
const { container } = render(<Calendar formatWeekday={formatWeekday} />); | ||
const weekday = container.querySelector('.react-calendar__month-view__weekdays__weekday'); | ||
const abbr = weekday.querySelector('abbr'); | ||
expect(abbr).toHaveAccessibleName('Weekday'); | ||
}); | ||
it('passes formatMonth to YearView component', () => { | ||
@@ -909,0 +920,0 @@ const formatMonth = () => 'Month'; |
import Calendar from './Calendar'; | ||
import Navigation from './Calendar/Navigation'; | ||
import CenturyView from './CenturyView'; | ||
@@ -9,2 +10,2 @@ import DecadeView from './DecadeView'; | ||
export { Calendar, CenturyView, DecadeView, YearView, MonthView }; | ||
export { Calendar, Navigation, CenturyView, DecadeView, YearView, MonthView }; |
@@ -25,2 +25,3 @@ import React from 'react'; | ||
formatShortWeekday, | ||
formatWeekday, | ||
onClickWeekNumber, | ||
@@ -36,2 +37,3 @@ showWeekNumbers, | ||
formatShortWeekday={formatShortWeekday} | ||
formatWeekday={formatWeekday} | ||
locale={locale} | ||
@@ -92,2 +94,3 @@ onMouseLeave={onMouseLeave} | ||
formatShortWeekday: PropTypes.func, | ||
formatWeekday: PropTypes.func, | ||
locale: PropTypes.string, | ||
@@ -94,0 +97,0 @@ onClickWeekNumber: PropTypes.func, |
@@ -154,3 +154,3 @@ import React from 'react'; | ||
it('passes formatShortWeekday to Weekdays component', () => { | ||
const formatShortWeekday = () => 'Weekday'; | ||
const formatShortWeekday = () => 'Wkdy'; | ||
@@ -163,5 +163,16 @@ const { container } = render( | ||
expect(weekdays).toHaveTextContent('Weekday'); | ||
expect(weekdays).toHaveTextContent('Wkdy'); | ||
}); | ||
it('passes formatWeekday to Weekdays component', () => { | ||
const formatWeekday = () => 'Weekday'; | ||
const { container } = render(<MonthView {...defaultProps} formatWeekday={formatWeekday} />); | ||
const weekday = container.querySelector('.react-calendar__month-view__weekdays__weekday'); | ||
const abbr = weekday.querySelector('abbr'); | ||
expect(abbr).toHaveAccessibleName('Weekday'); | ||
}); | ||
it('passes calendarType to Days component', () => { | ||
@@ -168,0 +179,0 @@ const calendarType = 'ISO 8601'; |
@@ -10,4 +10,4 @@ import React from 'react'; | ||
import { | ||
formatWeekday, | ||
formatShortWeekday as defaultFormatShortWeekday, | ||
formatWeekday as defaultFormatWeekday, | ||
} from '../shared/dateFormatter'; | ||
@@ -23,2 +23,3 @@ import { isCalendarType } from '../shared/propTypes'; | ||
formatShortWeekday = defaultFormatShortWeekday, | ||
formatWeekday = defaultFormatWeekday, | ||
locale, | ||
@@ -69,4 +70,5 @@ onMouseLeave, | ||
formatShortWeekday: PropTypes.func, | ||
formatWeekday: PropTypes.func, | ||
locale: PropTypes.string, | ||
onMouseLeave: PropTypes.func, | ||
}; |
@@ -36,5 +36,3 @@ import React from 'react'; | ||
it('renders weekdays with custom weekdays formatting', () => { | ||
const { container } = render( | ||
<Weekdays {...defaultProps} formatShortWeekday={() => 'Weekday'} />, | ||
); | ||
const { container } = render(<Weekdays {...defaultProps} formatShortWeekday={() => 'Wkdy'} />); | ||
@@ -44,4 +42,14 @@ const weekdays = container.querySelectorAll('.react-calendar__month-view__weekdays__weekday'); | ||
expect(firstWeekday).toHaveTextContent('Weekday'); | ||
expect(firstWeekday).toHaveTextContent('Wkdy'); | ||
}); | ||
it('renders weekdays with custom weekdays formatting', () => { | ||
const { container } = render(<Weekdays {...defaultProps} formatWeekday={() => 'Weekday'} />); | ||
const weekdays = container.querySelectorAll('.react-calendar__month-view__weekdays__weekday'); | ||
const firstWeekday = weekdays[0]; | ||
const abbr = firstWeekday.querySelector('abbr'); | ||
expect(abbr).toHaveAccessibleName('Weekday'); | ||
}); | ||
}); |
@@ -6,2 +6,3 @@ import { | ||
formatShortWeekday, | ||
formatWeekday, | ||
formatYear, | ||
@@ -50,2 +51,12 @@ } from './dateFormatter'; | ||
describe('formatWeekday', () => { | ||
it('returns proper weekday name', () => { | ||
const date = new Date(2017, 1, 1); | ||
const formattedDate = formatWeekday('en-US', date); | ||
expect(formattedDate).toBe('Wednesday'); | ||
}); | ||
}); | ||
describe('formatYear', () => { | ||
@@ -52,0 +63,0 @@ it('returns proper month name and year', () => { |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
519815
10279
207