@instructure/ui-date-input 8.33.2-snapshot-0 → 8.33.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -3,14 +3,10 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
- ## [8.33.2-snapshot-0](https://github.com/instructure/instructure-ui/compare/v8.33.1...v8.33.2-snapshot-0) (2023-01-13)
6
+ ## [8.33.2](https://github.com/instructure/instructure-ui/compare/v8.33.1...v8.33.2) (2023-01-25)
7
7
 
8
8
  **Note:** Version bump only for package @instructure/ui-date-input
9
9
 
10
-
11
-
12
-
13
-
14
10
  ## [8.33.1](https://github.com/instructure/instructure-ui/compare/v8.33.0...v8.33.1) (2023-01-06)
15
11
 
16
12
  **Note:** Version bump only for package @instructure/ui-date-input
@@ -22,16 +22,17 @@
22
22
  * SOFTWARE.
23
23
  */
24
24
  import { locator } from '@instructure/ui-test-locator';
25
+
25
26
  /* eslint-disable no-restricted-imports */
26
27
  // @ts-expect-error ts-migrate(7016) FIXME: Could not find a declaration file for module '@ins... Remove this comment to see the full error message
27
-
28
- import { CalendarLocator } from '@instructure/ui-calendar/es/Calendar/CalendarLocator'; // @ts-expect-error ts-migrate(7016) FIXME: Could not find a declaration file for module '@ins... Remove this comment to see the full error message
29
-
28
+ import { CalendarLocator } from '@instructure/ui-calendar/es/Calendar/CalendarLocator';
29
+ // @ts-expect-error ts-migrate(7016) FIXME: Could not find a declaration file for module '@ins... Remove this comment to see the full error message
30
30
  import { PopoverLocator } from '@instructure/ui-popover/es/Popover/PopoverLocator';
31
31
  /* eslint-enable no-restricted-imports */
32
32
 
33
- import { DateInput } from './index'; // @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
33
+ import { DateInput } from './index';
34
34
 
35
+ // @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
35
36
  export const DateInputLocator = locator(DateInput.selector, {
36
37
  findInput: function () {
37
38
  return locator('input').find(...arguments);
@@ -40,7 +41,6 @@ export const DateInputLocator = locator(DateInput.selector, {
40
41
  for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
41
42
  args[_key - 1] = arguments[_key];
42
43
  }
43
-
44
44
  const content = await PopoverLocator.findContent(element, ...args);
45
45
  return content ? CalendarLocator.find(content.getDOMNode()) : null;
46
46
  }
@@ -1,9 +1,7 @@
1
1
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
2
2
  const _excluded = ["renderLabel", "value", "placeholder", "onBlur", "isRequired", "size", "isInline", "layout", "width", "messages", "onRequestValidateDate", "onRequestShowCalendar", "onRequestHideCalendar", "onRequestSelectNextDay", "onRequestSelectPrevDay", "onRequestRenderNextMonth", "onRequestRenderPrevMonth"],
3
- _excluded2 = ["ref"];
4
-
3
+ _excluded2 = ["ref"];
5
4
  var _dec, _dec2, _class, _class2, _IconCalendarMonthLin;
6
-
7
5
  /*
8
6
  * The MIT License (MIT)
9
7
  *
@@ -41,7 +39,6 @@ import { testable } from '@instructure/ui-testable';
41
39
  import { withStyle, jsx } from '@instructure/emotion';
42
40
  import generateStyle from './styles';
43
41
  import { propTypes, allowedProps } from './props';
44
-
45
42
  /**
46
43
  ---
47
44
  category: components
@@ -58,16 +55,13 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
58
55
  };
59
56
  this._input = void 0;
60
57
  this.ref = null;
61
-
62
58
  this.formatDateId = date => {
63
59
  // ISO8601 strings may contain a space. Remove any spaces before using the
64
60
  // date as the id.
65
61
  return date.replace(/\s/g, '');
66
62
  };
67
-
68
63
  this.handleInputRef = el => {
69
64
  var _this$props$inputRef, _this$props;
70
-
71
65
  // Ensures that we position the Calendar with respect to the input correctly
72
66
  // if the Calendar is open on mount
73
67
  if (!this.state.hasInputRef) {
@@ -75,115 +69,98 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
75
69
  hasInputRef: true
76
70
  });
77
71
  }
78
-
79
72
  this._input = el;
80
73
  (_this$props$inputRef = (_this$props = this.props).inputRef) === null || _this$props$inputRef === void 0 ? void 0 : _this$props$inputRef.call(_this$props, el);
81
74
  };
82
-
83
75
  this.handleInputChange = (event, value) => {
84
76
  var _this$props$onChange, _this$props2;
85
-
86
77
  (_this$props$onChange = (_this$props2 = this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props2, event, {
87
78
  value
88
79
  });
89
80
  this.handleShowCalendar(event);
90
81
  };
91
-
92
82
  this.handleShowCalendar = event => {
93
83
  if (this.interaction === 'enabled') {
94
84
  var _this$props$onRequest, _this$props3;
95
-
96
85
  (_this$props$onRequest = (_this$props3 = this.props).onRequestShowCalendar) === null || _this$props$onRequest === void 0 ? void 0 : _this$props$onRequest.call(_this$props3, event);
97
86
  }
98
87
  };
99
-
100
88
  this.handleHideCalendar = event => {
101
89
  var _this$props$onRequest2, _this$props4, _this$props$onRequest3, _this$props5;
102
-
103
90
  (_this$props$onRequest2 = (_this$props4 = this.props).onRequestValidateDate) === null || _this$props$onRequest2 === void 0 ? void 0 : _this$props$onRequest2.call(_this$props4, event);
104
91
  (_this$props$onRequest3 = (_this$props5 = this.props).onRequestHideCalendar) === null || _this$props$onRequest3 === void 0 ? void 0 : _this$props$onRequest3.call(_this$props5, event);
105
92
  };
106
-
107
93
  this.handleHighlightOption = (event, _ref) => {
108
94
  let direction = _ref.direction;
109
95
  const _this$props6 = this.props,
110
- onRequestSelectNextDay = _this$props6.onRequestSelectNextDay,
111
- onRequestSelectPrevDay = _this$props6.onRequestSelectPrevDay;
96
+ onRequestSelectNextDay = _this$props6.onRequestSelectNextDay,
97
+ onRequestSelectPrevDay = _this$props6.onRequestSelectPrevDay;
112
98
  if (direction === -1) onRequestSelectPrevDay === null || onRequestSelectPrevDay === void 0 ? void 0 : onRequestSelectPrevDay(event);
113
99
  if (direction === 1) onRequestSelectNextDay === null || onRequestSelectNextDay === void 0 ? void 0 : onRequestSelectNextDay(event);
114
100
  };
115
101
  }
116
-
117
102
  componentDidMount() {
118
103
  var _this$props$makeStyle, _this$props7;
119
-
120
104
  (_this$props$makeStyle = (_this$props7 = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props7);
121
105
  }
122
-
123
106
  componentDidUpdate() {
124
107
  var _this$props$makeStyle2, _this$props8;
125
-
126
108
  (_this$props$makeStyle2 = (_this$props8 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props8);
127
109
  }
128
-
129
110
  get selectedDateId() {
130
111
  let selectedDateId;
131
112
  Children.toArray(this.props.children).forEach(day => {
132
113
  const _props = day.props,
133
- date = _props.date,
134
- isSelected = _props.isSelected;
135
-
114
+ date = _props.date,
115
+ isSelected = _props.isSelected;
136
116
  if (isSelected) {
137
117
  selectedDateId = this.formatDateId(date);
138
118
  }
139
119
  });
140
120
  return selectedDateId;
141
121
  }
142
-
143
122
  get interaction() {
144
123
  return getInteraction({
145
124
  props: this.props
146
125
  });
147
126
  }
148
-
149
127
  renderMonthNavigationButton() {
150
128
  let type = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 'prev';
151
129
  const _this$props9 = this.props,
152
- renderPrevMonthButton = _this$props9.renderPrevMonthButton,
153
- renderNextMonthButton = _this$props9.renderNextMonthButton;
130
+ renderPrevMonthButton = _this$props9.renderPrevMonthButton,
131
+ renderNextMonthButton = _this$props9.renderNextMonthButton;
154
132
  const button = type === 'prev' ? renderPrevMonthButton : renderNextMonthButton;
155
133
  return button && safeCloneElement(callRenderProp(button), {
156
134
  tabIndex: -1
157
135
  });
158
136
  }
159
-
160
137
  renderDays(getOptionProps) {
161
138
  const children = this.props.children;
162
139
  return Children.map(children, day => {
163
140
  const _day$props = day.props,
164
- date = _day$props.date,
165
- isOutsideMonth = _day$props.isOutsideMonth;
141
+ date = _day$props.date,
142
+ isOutsideMonth = _day$props.isOutsideMonth;
166
143
  const props = {
167
144
  tabIndex: -1,
168
145
  id: this.formatDateId(date)
169
146
  };
170
147
  const optionProps = getOptionProps(props);
171
- const propsAdded = isOutsideMonth ? { ...props,
148
+ const propsAdded = isOutsideMonth ? {
149
+ ...props,
172
150
  onClick: optionProps.onClick,
173
151
  role: 'presentation'
174
152
  } : optionProps;
175
153
  return safeCloneElement(day, propsAdded);
176
154
  });
177
155
  }
178
-
179
156
  renderCalendar(_ref2) {
180
157
  let getListProps = _ref2.getListProps,
181
- getOptionProps = _ref2.getOptionProps;
158
+ getOptionProps = _ref2.getOptionProps;
182
159
  const _this$props10 = this.props,
183
- onRequestRenderNextMonth = _this$props10.onRequestRenderNextMonth,
184
- onRequestRenderPrevMonth = _this$props10.onRequestRenderPrevMonth,
185
- renderNavigationLabel = _this$props10.renderNavigationLabel,
186
- renderWeekdayLabels = _this$props10.renderWeekdayLabels;
160
+ onRequestRenderNextMonth = _this$props10.onRequestRenderNextMonth,
161
+ onRequestRenderPrevMonth = _this$props10.onRequestRenderPrevMonth,
162
+ renderNavigationLabel = _this$props10.renderNavigationLabel,
163
+ renderWeekdayLabels = _this$props10.renderWeekdayLabels;
187
164
  return jsx(Calendar, getListProps({
188
165
  onRequestRenderNextMonth,
189
166
  onRequestRenderPrevMonth,
@@ -193,37 +170,32 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
193
170
  renderPrevMonthButton: this.renderMonthNavigationButton('prev')
194
171
  }), this.renderDays(getOptionProps));
195
172
  }
196
-
197
173
  renderInput(_ref3) {
198
174
  let getInputProps = _ref3.getInputProps,
199
- getTriggerProps = _ref3.getTriggerProps;
200
-
175
+ getTriggerProps = _ref3.getTriggerProps;
201
176
  const _this$props11 = this.props,
202
- renderLabel = _this$props11.renderLabel,
203
- value = _this$props11.value,
204
- placeholder = _this$props11.placeholder,
205
- onBlur = _this$props11.onBlur,
206
- isRequired = _this$props11.isRequired,
207
- size = _this$props11.size,
208
- isInline = _this$props11.isInline,
209
- layout = _this$props11.layout,
210
- width = _this$props11.width,
211
- messages = _this$props11.messages,
212
- onRequestValidateDate = _this$props11.onRequestValidateDate,
213
- onRequestShowCalendar = _this$props11.onRequestShowCalendar,
214
- onRequestHideCalendar = _this$props11.onRequestHideCalendar,
215
- onRequestSelectNextDay = _this$props11.onRequestSelectNextDay,
216
- onRequestSelectPrevDay = _this$props11.onRequestSelectPrevDay,
217
- onRequestRenderNextMonth = _this$props11.onRequestRenderNextMonth,
218
- onRequestRenderPrevMonth = _this$props11.onRequestRenderPrevMonth,
219
- rest = _objectWithoutProperties(_this$props11, _excluded);
220
-
177
+ renderLabel = _this$props11.renderLabel,
178
+ value = _this$props11.value,
179
+ placeholder = _this$props11.placeholder,
180
+ onBlur = _this$props11.onBlur,
181
+ isRequired = _this$props11.isRequired,
182
+ size = _this$props11.size,
183
+ isInline = _this$props11.isInline,
184
+ layout = _this$props11.layout,
185
+ width = _this$props11.width,
186
+ messages = _this$props11.messages,
187
+ onRequestValidateDate = _this$props11.onRequestValidateDate,
188
+ onRequestShowCalendar = _this$props11.onRequestShowCalendar,
189
+ onRequestHideCalendar = _this$props11.onRequestHideCalendar,
190
+ onRequestSelectNextDay = _this$props11.onRequestSelectNextDay,
191
+ onRequestSelectPrevDay = _this$props11.onRequestSelectPrevDay,
192
+ onRequestRenderNextMonth = _this$props11.onRequestRenderNextMonth,
193
+ onRequestRenderPrevMonth = _this$props11.onRequestRenderPrevMonth,
194
+ rest = _objectWithoutProperties(_this$props11, _excluded);
221
195
  const interaction = this.interaction;
222
-
223
196
  const _getTriggerProps = getTriggerProps(),
224
- ref = _getTriggerProps.ref,
225
- triggerProps = _objectWithoutProperties(_getTriggerProps, _excluded2);
226
-
197
+ ref = _getTriggerProps.ref,
198
+ triggerProps = _objectWithoutProperties(_getTriggerProps, _excluded2);
227
199
  return jsx(TextInput, Object.assign({}, triggerProps, passthroughProps(rest), getInputProps({
228
200
  renderLabel: callRenderProp(renderLabel),
229
201
  value,
@@ -243,13 +215,12 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
243
215
  }))
244
216
  })));
245
217
  }
246
-
247
218
  render() {
248
219
  const _this$props12 = this.props,
249
- placement = _this$props12.placement,
250
- isShowingCalendar = _this$props12.isShowingCalendar,
251
- assistiveText = _this$props12.assistiveText,
252
- styles = _this$props12.styles;
220
+ placement = _this$props12.placement,
221
+ isShowingCalendar = _this$props12.isShowingCalendar,
222
+ assistiveText = _this$props12.assistiveText,
223
+ styles = _this$props12.styles;
253
224
  return jsx(Selectable, {
254
225
  isShowingOptions: isShowingCalendar,
255
226
  onRequestShowOptions: this.handleShowCalendar,
@@ -260,11 +231,11 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
260
231
  highlightedOptionId: this.selectedDateId
261
232
  }, _ref4 => {
262
233
  let getRootProps = _ref4.getRootProps,
263
- getInputProps = _ref4.getInputProps,
264
- getTriggerProps = _ref4.getTriggerProps,
265
- getListProps = _ref4.getListProps,
266
- getOptionProps = _ref4.getOptionProps,
267
- getDescriptionProps = _ref4.getDescriptionProps;
234
+ getInputProps = _ref4.getInputProps,
235
+ getTriggerProps = _ref4.getTriggerProps,
236
+ getListProps = _ref4.getListProps,
237
+ getOptionProps = _ref4.getOptionProps,
238
+ getDescriptionProps = _ref4.getDescriptionProps;
268
239
  return jsx("span", Object.assign({}, getRootProps({
269
240
  css: styles === null || styles === void 0 ? void 0 : styles.dateInput
270
241
  }), {
@@ -286,7 +257,6 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
286
257
  })));
287
258
  });
288
259
  }
289
-
290
260
  }, _class2.displayName = "DateInput", _class2.componentId = 'DateInput', _class2.Day = Calendar.Day, _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.defaultProps = {
291
261
  value: '',
292
262
  size: 'medium',
@@ -21,6 +21,7 @@
21
21
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
22
22
  * SOFTWARE.
23
23
  */
24
+
24
25
  import PropTypes from 'prop-types';
25
26
  import { controllable, Children as ChildrenPropTypes } from '@instructure/ui-prop-types';
26
27
  import { FormPropTypes } from '@instructure/ui-form-field';
@@ -43,5 +43,4 @@ const generateStyle = (_componentTheme, props) => {
43
43
  }
44
44
  };
45
45
  };
46
-
47
46
  export default generateStyle;
package/es/index.js CHANGED
@@ -21,4 +21,5 @@
21
21
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
22
22
  * SOFTWARE.
23
23
  */
24
+
24
25
  export { DateInput } from './DateInput';
@@ -4,15 +4,10 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.DateInputLocator = void 0;
7
-
8
7
  var _locator = require("@instructure/ui-test-locator/lib/utils/locator.js");
9
-
10
8
  var _CalendarLocator = require("@instructure/ui-calendar/lib/Calendar/CalendarLocator");
11
-
12
9
  var _PopoverLocator = require("@instructure/ui-popover/lib/Popover/PopoverLocator");
13
-
14
10
  var _index = require("./index");
15
-
16
11
  /*
17
12
  * The MIT License (MIT)
18
13
  *
@@ -39,9 +34,11 @@ var _index = require("./index");
39
34
 
40
35
  /* eslint-disable no-restricted-imports */
41
36
  // @ts-expect-error ts-migrate(7016) FIXME: Could not find a declaration file for module '@ins... Remove this comment to see the full error message
37
+
42
38
  // @ts-expect-error ts-migrate(7016) FIXME: Could not find a declaration file for module '@ins... Remove this comment to see the full error message
43
39
 
44
40
  /* eslint-enable no-restricted-imports */
41
+
45
42
  // @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
46
43
  const DateInputLocator = (0, _locator.locator)(_index.DateInput.selector, {
47
44
  findInput: function () {
@@ -51,7 +48,6 @@ const DateInputLocator = (0, _locator.locator)(_index.DateInput.selector, {
51
48
  for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
52
49
  args[_key - 1] = arguments[_key];
53
50
  }
54
-
55
51
  const content = await _PopoverLocator.PopoverLocator.findContent(element, ...args);
56
52
  return content ? _CalendarLocator.CalendarLocator.find(content.getDOMNode()) : null;
57
53
  }