Skip to content

Commit 4316e1d

Browse files
hsourcehsource
committed
[21.8.0-wanderlog.1] Add appendToBody="fixed" prop option
1 parent 7989c06 commit 4316e1d

160 files changed

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