Skip to content

Commit 053fd91

Browse files
hsourcehsource
committed
[21.8.0-wanderlog.2] Fix scrollbar disappearing on Macs when appendToBody is set
1 parent 0bbaeaa commit 053fd91

162 files changed

Lines changed: 19707 additions & 1 deletion

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎esm/components/CalendarDay.js‎

Lines changed: 316 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,316 @@
1+
import _extends from "@babel/runtime/helpers/esm/extends";
2+
import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
3+
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
4+
import shallowEqual from "enzyme-shallow-equal";
5+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
6+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
7+
import React from 'react';
8+
import PropTypes from 'prop-types';
9+
import momentPropTypes from 'react-moment-proptypes';
10+
import { nonNegativeInteger } from 'airbnb-prop-types';
11+
import { css, withStyles, withStylesPropTypes } from 'react-with-styles';
12+
import moment from 'moment';
13+
import raf from 'raf';
14+
import { CalendarDayPhrases } from '../defaultPhrases';
15+
import getPhrasePropTypes from '../utils/getPhrasePropTypes';
16+
import getCalendarDaySettings from '../utils/getCalendarDaySettings';
17+
import ModifiersShape from '../shapes/ModifiersShape';
18+
import { DAY_SIZE } from '../constants';
19+
20+
// We don't use forbidExtraProps because it causes `npm run build:css` to fail
21+
// because some parent components pass `key={...}`
22+
var propTypes = process.env.NODE_ENV !== "production" ? _objectSpread(_objectSpread({}, withStylesPropTypes), {}, {
23+
day: momentPropTypes.momentObj,
24+
daySize: nonNegativeInteger,
25+
isOutsideDay: PropTypes.bool,
26+
modifiers: ModifiersShape,
27+
isFocused: PropTypes.bool,
28+
tabIndex: PropTypes.oneOf([0, -1]),
29+
onDayClick: PropTypes.func,
30+
onDayMouseEnter: PropTypes.func,
31+
onDayMouseLeave: PropTypes.func,
32+
renderDayContents: PropTypes.func,
33+
ariaLabelFormat: PropTypes.string,
34+
// internationalization
35+
phrases: PropTypes.shape(getPhrasePropTypes(CalendarDayPhrases))
36+
}) : {};
37+
var defaultProps = {
38+
day: moment(),
39+
daySize: DAY_SIZE,
40+
isOutsideDay: false,
41+
modifiers: new Set(),
42+
isFocused: false,
43+
tabIndex: -1,
44+
onDayClick: function onDayClick() {},
45+
onDayMouseEnter: function onDayMouseEnter() {},
46+
onDayMouseLeave: function onDayMouseLeave() {},
47+
renderDayContents: null,
48+
ariaLabelFormat: 'dddd, LL',
49+
// internationalization
50+
phrases: CalendarDayPhrases
51+
};
52+
var CalendarDay = /*#__PURE__*/function (_ref2, _ref) {
53+
function CalendarDay() {
54+
var _this;
55+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
56+
args[_key] = arguments[_key];
57+
}
58+
_this = _ref2.call.apply(_ref2, [this].concat(args)) || this;
59+
_this.setButtonRef = _this.setButtonRef.bind(_this);
60+
return _this;
61+
}
62+
_inheritsLoose(CalendarDay, _ref2);
63+
var _proto = CalendarDay.prototype;
64+
_proto[_ref] = function (nextProps, nextState) {
65+
return !shallowEqual(this.props, nextProps) || !shallowEqual(this.state, nextState);
66+
};
67+
_proto.componentDidUpdate = function componentDidUpdate(prevProps) {
68+
var _this2 = this;
69+
var _this$props = this.props,
70+
isFocused = _this$props.isFocused,
71+
tabIndex = _this$props.tabIndex;
72+
if (tabIndex === 0) {
73+
if (isFocused || tabIndex !== prevProps.tabIndex) {
74+
raf(function () {
75+
if (_this2.buttonRef) {
76+
_this2.buttonRef.focus();
77+
}
78+
});
79+
}
80+
}
81+
};
82+
_proto.onDayClick = function onDayClick(day, e) {
83+
var onDayClick = this.props.onDayClick;
84+
onDayClick(day, e);
85+
};
86+
_proto.onDayMouseEnter = function onDayMouseEnter(day, e) {
87+
var onDayMouseEnter = this.props.onDayMouseEnter;
88+
onDayMouseEnter(day, e);
89+
};
90+
_proto.onDayMouseLeave = function onDayMouseLeave(day, e) {
91+
var onDayMouseLeave = this.props.onDayMouseLeave;
92+
onDayMouseLeave(day, e);
93+
};
94+
_proto.onKeyDown = function onKeyDown(day, e) {
95+
var onDayClick = this.props.onDayClick;
96+
var key = e.key;
97+
if (key === 'Enter' || key === ' ') {
98+
onDayClick(day, e);
99+
}
100+
};
101+
_proto.setButtonRef = function setButtonRef(ref) {
102+
this.buttonRef = ref;
103+
};
104+
_proto.render = function render() {
105+
var _this3 = this;
106+
var _this$props2 = this.props,
107+
day = _this$props2.day,
108+
ariaLabelFormat = _this$props2.ariaLabelFormat,
109+
daySize = _this$props2.daySize,
110+
isOutsideDay = _this$props2.isOutsideDay,
111+
modifiers = _this$props2.modifiers,
112+
renderDayContents = _this$props2.renderDayContents,
113+
tabIndex = _this$props2.tabIndex,
114+
styles = _this$props2.styles,
115+
phrases = _this$props2.phrases;
116+
if (!day) return /*#__PURE__*/React.createElement("td", null);
117+
var _getCalendarDaySettin = getCalendarDaySettings(day, ariaLabelFormat, daySize, modifiers, phrases),
118+
daySizeStyles = _getCalendarDaySettin.daySizeStyles,
119+
useDefaultCursor = _getCalendarDaySettin.useDefaultCursor,
120+
selected = _getCalendarDaySettin.selected,
121+
hoveredSpan = _getCalendarDaySettin.hoveredSpan,
122+
isOutsideRange = _getCalendarDaySettin.isOutsideRange,
123+
ariaLabel = _getCalendarDaySettin.ariaLabel;
124+
return /*#__PURE__*/React.createElement("td", _extends({}, css(styles.CalendarDay, useDefaultCursor && styles.CalendarDay__defaultCursor, styles.CalendarDay__default, isOutsideDay && styles.CalendarDay__outside, modifiers.has('today') && styles.CalendarDay__today, modifiers.has('first-day-of-week') && styles.CalendarDay__firstDayOfWeek, modifiers.has('last-day-of-week') && styles.CalendarDay__lastDayOfWeek, modifiers.has('hovered-offset') && styles.CalendarDay__hovered_offset, modifiers.has('hovered-start-first-possible-end') && styles.CalendarDay__hovered_start_first_possible_end, modifiers.has('hovered-start-blocked-minimum-nights') && styles.CalendarDay__hovered_start_blocked_min_nights, modifiers.has('highlighted-calendar') && styles.CalendarDay__highlighted_calendar, modifiers.has('blocked-minimum-nights') && styles.CalendarDay__blocked_minimum_nights, modifiers.has('blocked-calendar') && styles.CalendarDay__blocked_calendar, hoveredSpan && styles.CalendarDay__hovered_span, modifiers.has('after-hovered-start') && styles.CalendarDay__after_hovered_start, modifiers.has('selected-span') && styles.CalendarDay__selected_span, modifiers.has('selected-start') && styles.CalendarDay__selected_start, modifiers.has('selected-end') && styles.CalendarDay__selected_end, selected && !modifiers.has('selected-span') && styles.CalendarDay__selected, modifiers.has('before-hovered-end') && styles.CalendarDay__before_hovered_end, modifiers.has('no-selected-start-before-selected-end') && styles.CalendarDay__no_selected_start_before_selected_end, modifiers.has('selected-start-in-hovered-span') && styles.CalendarDay__selected_start_in_hovered_span, modifiers.has('selected-end-in-hovered-span') && styles.CalendarDay__selected_end_in_hovered_span, modifiers.has('selected-start-no-selected-end') && styles.CalendarDay__selected_start_no_selected_end, modifiers.has('selected-end-no-selected-start') && styles.CalendarDay__selected_end_no_selected_start, isOutsideRange && styles.CalendarDay__blocked_out_of_range, daySizeStyles), {
125+
role: "button" // eslint-disable-line jsx-a11y/no-noninteractive-element-to-interactive-role
126+
,
127+
ref: this.setButtonRef,
128+
"aria-disabled": modifiers.has('blocked'),
129+
"aria-label": ariaLabel,
130+
onMouseEnter: function onMouseEnter(e) {
131+
_this3.onDayMouseEnter(day, e);
132+
},
133+
onMouseLeave: function onMouseLeave(e) {
134+
_this3.onDayMouseLeave(day, e);
135+
},
136+
onMouseUp: function onMouseUp(e) {
137+
e.currentTarget.blur();
138+
},
139+
onClick: function onClick(e) {
140+
_this3.onDayClick(day, e);
141+
},
142+
onKeyDown: function onKeyDown(e) {
143+
_this3.onKeyDown(day, e);
144+
},
145+
tabIndex: tabIndex
146+
}), renderDayContents ? renderDayContents(day, modifiers) : day.format('D'));
147+
};
148+
return CalendarDay;
149+
}(React.PureComponent || React.Component, !React.PureComponent && "shouldComponentUpdate");
150+
CalendarDay.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {};
151+
CalendarDay.defaultProps = defaultProps;
152+
export { CalendarDay as PureCalendarDay };
153+
export default withStyles(function (_ref3) {
154+
var _ref3$reactDates = _ref3.reactDates,
155+
color = _ref3$reactDates.color,
156+
font = _ref3$reactDates.font;
157+
return {
158+
CalendarDay: {
159+
boxSizing: 'border-box',
160+
cursor: 'pointer',
161+
fontSize: font.size,
162+
textAlign: 'center',
163+
':active': {
164+
outline: 0
165+
}
166+
},
167+
CalendarDay__defaultCursor: {
168+
cursor: 'default'
169+
},
170+
CalendarDay__default: {
171+
border: "1px solid ".concat(color.core.borderLight),
172+
color: color.text,
173+
background: color.background,
174+
':hover': {
175+
background: color.core.borderLight,
176+
border: "1px solid ".concat(color.core.borderLight),
177+
color: 'inherit'
178+
}
179+
},
180+
CalendarDay__hovered_offset: {
181+
background: color.core.borderBright,
182+
border: "1px double ".concat(color.core.borderLight),
183+
color: 'inherit'
184+
},
185+
CalendarDay__outside: {
186+
border: 0,
187+
background: color.outside.backgroundColor,
188+
color: color.outside.color,
189+
':hover': {
190+
border: 0
191+
}
192+
},
193+
CalendarDay__blocked_minimum_nights: {
194+
background: color.minimumNights.backgroundColor,
195+
border: "1px solid ".concat(color.minimumNights.borderColor),
196+
color: color.minimumNights.color,
197+
':hover': {
198+
background: color.minimumNights.backgroundColor_hover,
199+
color: color.minimumNights.color_active
200+
},
201+
':active': {
202+
background: color.minimumNights.backgroundColor_active,
203+
color: color.minimumNights.color_active
204+
}
205+
},
206+
CalendarDay__highlighted_calendar: {
207+
background: color.highlighted.backgroundColor,
208+
color: color.highlighted.color,
209+
':hover': {
210+
background: color.highlighted.backgroundColor_hover,
211+
color: color.highlighted.color_active
212+
},
213+
':active': {
214+
background: color.highlighted.backgroundColor_active,
215+
color: color.highlighted.color_active
216+
}
217+
},
218+
CalendarDay__selected_span: {
219+
background: color.selectedSpan.backgroundColor,
220+
border: "1px double ".concat(color.selectedSpan.borderColor),
221+
color: color.selectedSpan.color,
222+
':hover': {
223+
background: color.selectedSpan.backgroundColor_hover,
224+
border: "1px double ".concat(color.selectedSpan.borderColor),
225+
color: color.selectedSpan.color_active
226+
},
227+
':active': {
228+
background: color.selectedSpan.backgroundColor_active,
229+
border: "1px double ".concat(color.selectedSpan.borderColor),
230+
color: color.selectedSpan.color_active
231+
}
232+
},
233+
CalendarDay__selected: {
234+
background: color.selected.backgroundColor,
235+
border: "1px double ".concat(color.selected.borderColor),
236+
color: color.selected.color,
237+
':hover': {
238+
background: color.selected.backgroundColor_hover,
239+
border: "1px double ".concat(color.selected.borderColor),
240+
color: color.selected.color_active
241+
},
242+
':active': {
243+
background: color.selected.backgroundColor_active,
244+
border: "1px double ".concat(color.selected.borderColor),
245+
color: color.selected.color_active
246+
}
247+
},
248+
CalendarDay__hovered_span: {
249+
background: color.hoveredSpan.backgroundColor,
250+
border: "1px double ".concat(color.hoveredSpan.borderColor),
251+
color: color.hoveredSpan.color,
252+
':hover': {
253+
background: color.hoveredSpan.backgroundColor_hover,
254+
border: "1px double ".concat(color.hoveredSpan.borderColor),
255+
color: color.hoveredSpan.color_active
256+
},
257+
':active': {
258+
background: color.hoveredSpan.backgroundColor_active,
259+
border: "1px double ".concat(color.hoveredSpan.borderColor),
260+
color: color.hoveredSpan.color_active
261+
}
262+
},
263+
CalendarDay__blocked_calendar: {
264+
background: color.blocked_calendar.backgroundColor,
265+
border: "1px solid ".concat(color.blocked_calendar.borderColor),
266+
color: color.blocked_calendar.color,
267+
':hover': {
268+
background: color.blocked_calendar.backgroundColor_hover,
269+
border: "1px solid ".concat(color.blocked_calendar.borderColor),
270+
color: color.blocked_calendar.color_active
271+
},
272+
':active': {
273+
background: color.blocked_calendar.backgroundColor_active,
274+
border: "1px solid ".concat(color.blocked_calendar.borderColor),
275+
color: color.blocked_calendar.color_active
276+
}
277+
},
278+
CalendarDay__blocked_out_of_range: {
279+
background: color.blocked_out_of_range.backgroundColor,
280+
border: "1px solid ".concat(color.blocked_out_of_range.borderColor),
281+
color: color.blocked_out_of_range.color,
282+
':hover': {
283+
background: color.blocked_out_of_range.backgroundColor_hover,
284+
border: "1px solid ".concat(color.blocked_out_of_range.borderColor),
285+
color: color.blocked_out_of_range.color_active
286+
},
287+
':active': {
288+
background: color.blocked_out_of_range.backgroundColor_active,
289+
border: "1px solid ".concat(color.blocked_out_of_range.borderColor),
290+
color: color.blocked_out_of_range.color_active
291+
}
292+
},
293+
CalendarDay__hovered_start_first_possible_end: {
294+
background: color.core.borderLighter,
295+
border: "1px double ".concat(color.core.borderLighter)
296+
},
297+
CalendarDay__hovered_start_blocked_min_nights: {
298+
background: color.core.borderLighter,
299+
border: "1px double ".concat(color.core.borderLight)
300+
},
301+
CalendarDay__selected_start: {},
302+
CalendarDay__selected_end: {},
303+
CalendarDay__today: {},
304+
CalendarDay__firstDayOfWeek: {},
305+
CalendarDay__lastDayOfWeek: {},
306+
CalendarDay__after_hovered_start: {},
307+
CalendarDay__before_hovered_end: {},
308+
CalendarDay__no_selected_start_before_selected_end: {},
309+
CalendarDay__selected_start_in_hovered_span: {},
310+
CalendarDay__selected_end_in_hovered_span: {},
311+
CalendarDay__selected_start_no_selected_end: {},
312+
CalendarDay__selected_end_no_selected_start: {}
313+
};
314+
}, {
315+
pureComponent: typeof React.PureComponent !== 'undefined'
316+
})(CalendarDay);

‎esm/components/CalendarIcon.js‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import React from "react";
2+
var CalendarIcon = function CalendarIcon(props) {
3+
return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("path", {
4+
d: "m107 1393h241v-241h-241zm295 0h268v-241h-268zm-295-295h241v-268h-241zm295 0h268v-268h-268zm-295-321h241v-241h-241zm616 616h268v-241h-268zm-321-616h268v-241h-268zm643 616h241v-241h-241zm-322-295h268v-268h-268zm-294-723v-241c0-7-3-14-8-19-6-5-12-8-19-8h-54c-7 0-13 3-19 8-5 5-8 12-8 19v241c0 7 3 14 8 19 6 5 12 8 19 8h54c7 0 13-3 19-8 5-5 8-12 8-19zm616 723h241v-268h-241zm-322-321h268v-241h-268zm322 0h241v-241h-241zm27-402v-241c0-7-3-14-8-19-6-5-12-8-19-8h-54c-7 0-13 3-19 8-5 5-8 12-8 19v241c0 7 3 14 8 19 6 5 12 8 19 8h54c7 0 13-3 19-8 5-5 8-12 8-19zm321-54v1072c0 29-11 54-32 75s-46 32-75 32h-1179c-29 0-54-11-75-32s-32-46-32-75v-1072c0-29 11-54 32-75s46-32 75-32h107v-80c0-37 13-68 40-95s57-39 94-39h54c37 0 68 13 95 39 26 26 39 58 39 95v80h321v-80c0-37 13-69 40-95 26-26 57-39 94-39h54c37 0 68 13 94 39s40 58 40 95v80h107c29 0 54 11 75 32s32 46 32 75z"
5+
}));
6+
};
7+
CalendarIcon.defaultProps = {
8+
focusable: "false",
9+
viewBox: "0 0 1393.1 1500"
10+
};
11+
export default CalendarIcon;

0 commit comments

Comments
 (0)