@instructure/ui-date-input 8.25.1-snapshot-7 → 8.25.1-snapshot-10

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.
Files changed (6) hide show
  1. package/CHANGELOG.md +1 -1
  2. package/es/DateInput/index.js +78 -80
  3. package/lib/DateInput/index.js +78 -80
  4. package/package.json +16 -16
  5. package/tsconfig.build.tsbuildinfo +1 -1
  6. package/types/DateInput/DateInputLocator.d.ts +9 -9
package/CHANGELOG.md CHANGED
@@ -3,7 +3,7 @@
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.25.1-snapshot-7](https://github.com/instructure/instructure-ui/compare/v8.25.0...v8.25.1-snapshot-7) (2022-06-13)
6
+ ## [8.25.1-snapshot-10](https://github.com/instructure/instructure-ui/compare/v8.25.0...v8.25.1-snapshot-10) (2022-06-20)
7
7
 
8
8
  **Note:** Version bump only for package @instructure/ui-date-input
9
9
 
package/es/DateInput/index.js CHANGED
@@ -2,7 +2,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
2
2
  const _excluded = ["renderLabel", "value", "placeholder", "onBlur", "isRequired", "size", "isInline", "layout", "width", "messages", "onRequestValidateDate", "onRequestShowCalendar", "onRequestHideCalendar", "onRequestSelectNextDay", "onRequestSelectPrevDay", "onRequestRenderNextMonth", "onRequestRenderPrevMonth"],
3
3
  _excluded2 = ["ref"];
4
4
 
5
- var _dec, _dec2, _class, _class2, _IconCalendarMonthLin;
5
+ var _dec, _dec2, _class, _IconCalendarMonthLin;
6
6
 
7
7
  /*
8
8
  * The MIT License (MIT)
@@ -50,80 +50,40 @@ The `DateInput` component provides a visual interface for inputting date data.
50
50
  See <https://instructure.design/#DateInput/>
51
51
  @tsProps
52
52
  **/
53
- let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec(_class = _dec2(_class = (_class2 = class DateInput extends Component {
54
- constructor() {
55
- super(...arguments);
56
- this.state = {
57
- hasInputRef: false
58
- };
59
- this._input = void 0;
60
- this.ref = null;
61
-
62
- this.formatDateId = date => {
63
- // ISO8601 strings may contain a space. Remove any spaces before using the
64
- // date as the id.
65
- return date.replace(/\s/g, '');
66
- };
67
-
68
- this.handleInputRef = el => {
69
- var _this$props$inputRef, _this$props;
70
-
71
- // Ensures that we position the Calendar with respect to the input correctly
72
- // if the Calendar is open on mount
73
- if (!this.state.hasInputRef) {
74
- this.setState({
75
- hasInputRef: true
76
- });
77
- }
78
-
79
- this._input = el;
80
- (_this$props$inputRef = (_this$props = this.props).inputRef) === null || _this$props$inputRef === void 0 ? void 0 : _this$props$inputRef.call(_this$props, el);
81
- };
82
-
83
- this.handleInputChange = (event, value) => {
84
- var _this$props$onChange, _this$props2;
85
-
86
- (_this$props$onChange = (_this$props2 = this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props2, event, {
87
- value
88
- });
89
- this.handleShowCalendar(event);
90
- };
91
-
92
- this.handleShowCalendar = event => {
93
- if (this.interaction === 'enabled') {
94
- var _this$props$onRequest, _this$props3;
95
-
96
- (_this$props$onRequest = (_this$props3 = this.props).onRequestShowCalendar) === null || _this$props$onRequest === void 0 ? void 0 : _this$props$onRequest.call(_this$props3, event);
97
- }
98
- };
99
-
100
- this.handleHideCalendar = event => {
101
- var _this$props$onRequest2, _this$props4, _this$props$onRequest3, _this$props5;
102
-
103
- (_this$props$onRequest2 = (_this$props4 = this.props).onRequestValidateDate) === null || _this$props$onRequest2 === void 0 ? void 0 : _this$props$onRequest2.call(_this$props4, event);
104
- (_this$props$onRequest3 = (_this$props5 = this.props).onRequestHideCalendar) === null || _this$props$onRequest3 === void 0 ? void 0 : _this$props$onRequest3.call(_this$props5, event);
105
- };
106
-
107
- this.handleHighlightOption = (event, _ref) => {
108
- let direction = _ref.direction;
109
- const _this$props6 = this.props,
110
- onRequestSelectNextDay = _this$props6.onRequestSelectNextDay,
111
- onRequestSelectPrevDay = _this$props6.onRequestSelectPrevDay;
112
- if (direction === -1) onRequestSelectPrevDay === null || onRequestSelectPrevDay === void 0 ? void 0 : onRequestSelectPrevDay(event);
113
- if (direction === 1) onRequestSelectNextDay === null || onRequestSelectNextDay === void 0 ? void 0 : onRequestSelectNextDay(event);
114
- };
115
- }
53
+ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec(_class = _dec2(_class = class DateInput extends Component {
54
+ static displayName = "DateInput";
55
+ static componentId = 'DateInput';
56
+ static Day = Calendar.Day;
57
+ static propTypes = propTypes;
58
+ static allowedProps = allowedProps;
59
+ static defaultProps = {
60
+ value: '',
61
+ size: 'medium',
62
+ onBlur: () => {},
63
+ // must have a default so createChainedFunction works
64
+ isRequired: false,
65
+ isInline: false,
66
+ layout: 'stacked',
67
+ display: 'inline-block',
68
+ placement: 'bottom center',
69
+ isShowingCalendar: false
70
+ };
71
+ state = {
72
+ hasInputRef: false
73
+ };
74
+ _input = void 0;
75
+ ref = null;
116
76
 
117
77
  componentDidMount() {
118
- var _this$props$makeStyle, _this$props7;
78
+ var _this$props$makeStyle, _this$props;
119
79
 
120
- (_this$props$makeStyle = (_this$props7 = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props7);
80
+ (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
121
81
  }
122
82
 
123
83
  componentDidUpdate() {
124
- var _this$props$makeStyle2, _this$props8;
84
+ var _this$props$makeStyle2, _this$props2;
125
85
 
126
- (_this$props$makeStyle2 = (_this$props8 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props8);
86
+ (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2);
127
87
  }
128
88
 
129
89
  get selectedDateId() {
@@ -146,6 +106,55 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
146
106
  });
147
107
  }
148
108
 
109
+ formatDateId = date => {
110
+ // ISO8601 strings may contain a space. Remove any spaces before using the
111
+ // date as the id.
112
+ return date.replace(/\s/g, '');
113
+ };
114
+ handleInputRef = el => {
115
+ var _this$props$inputRef, _this$props3;
116
+
117
+ // Ensures that we position the Calendar with respect to the input correctly
118
+ // if the Calendar is open on mount
119
+ if (!this.state.hasInputRef) {
120
+ this.setState({
121
+ hasInputRef: true
122
+ });
123
+ }
124
+
125
+ this._input = el;
126
+ (_this$props$inputRef = (_this$props3 = this.props).inputRef) === null || _this$props$inputRef === void 0 ? void 0 : _this$props$inputRef.call(_this$props3, el);
127
+ };
128
+ handleInputChange = (event, value) => {
129
+ var _this$props$onChange, _this$props4;
130
+
131
+ (_this$props$onChange = (_this$props4 = this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props4, event, {
132
+ value
133
+ });
134
+ this.handleShowCalendar(event);
135
+ };
136
+ handleShowCalendar = event => {
137
+ if (this.interaction === 'enabled') {
138
+ var _this$props$onRequest, _this$props5;
139
+
140
+ (_this$props$onRequest = (_this$props5 = this.props).onRequestShowCalendar) === null || _this$props$onRequest === void 0 ? void 0 : _this$props$onRequest.call(_this$props5, event);
141
+ }
142
+ };
143
+ handleHideCalendar = event => {
144
+ var _this$props$onRequest2, _this$props6, _this$props$onRequest3, _this$props7;
145
+
146
+ (_this$props$onRequest2 = (_this$props6 = this.props).onRequestValidateDate) === null || _this$props$onRequest2 === void 0 ? void 0 : _this$props$onRequest2.call(_this$props6, event);
147
+ (_this$props$onRequest3 = (_this$props7 = this.props).onRequestHideCalendar) === null || _this$props$onRequest3 === void 0 ? void 0 : _this$props$onRequest3.call(_this$props7, event);
148
+ };
149
+ handleHighlightOption = (event, _ref) => {
150
+ let direction = _ref.direction;
151
+ const _this$props8 = this.props,
152
+ onRequestSelectNextDay = _this$props8.onRequestSelectNextDay,
153
+ onRequestSelectPrevDay = _this$props8.onRequestSelectPrevDay;
154
+ if (direction === -1) onRequestSelectPrevDay === null || onRequestSelectPrevDay === void 0 ? void 0 : onRequestSelectPrevDay(event);
155
+ if (direction === 1) onRequestSelectNextDay === null || onRequestSelectNextDay === void 0 ? void 0 : onRequestSelectNextDay(event);
156
+ };
157
+
149
158
  renderMonthNavigationButton() {
150
159
  let type = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 'prev';
151
160
  const _this$props9 = this.props,
@@ -287,17 +296,6 @@ let DateInput = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec
287
296
  });
288
297
  }
289
298
 
290
- }, _class2.displayName = "DateInput", _class2.componentId = 'DateInput', _class2.Day = Calendar.Day, _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.defaultProps = {
291
- value: '',
292
- size: 'medium',
293
- onBlur: () => {},
294
- // must have a default so createChainedFunction works
295
- isRequired: false,
296
- isInline: false,
297
- layout: 'stacked',
298
- display: 'inline-block',
299
- placement: 'bottom center',
300
- isShowingCalendar: false
301
- }, _class2)) || _class) || _class);
299
+ }) || _class) || _class);
302
300
  export default DateInput;
303
301
  export { DateInput };
package/lib/DateInput/index.js CHANGED
@@ -44,7 +44,7 @@ var _props2 = require("./props");
44
44
  const _excluded = ["renderLabel", "value", "placeholder", "onBlur", "isRequired", "size", "isInline", "layout", "width", "messages", "onRequestValidateDate", "onRequestShowCalendar", "onRequestHideCalendar", "onRequestSelectNextDay", "onRequestSelectPrevDay", "onRequestRenderNextMonth", "onRequestRenderPrevMonth"],
45
45
  _excluded2 = ["ref"];
46
46
 
47
- var _dec, _dec2, _class, _class2, _IconCalendarMonthLin;
47
+ var _dec, _dec2, _class, _IconCalendarMonthLin;
48
48
 
49
49
  /**
50
50
  ---
@@ -54,80 +54,40 @@ The `DateInput` component provides a visual interface for inputting date data.
54
54
  See <https://instructure.design/#DateInput/>
55
55
  @tsProps
56
56
  **/
57
- let DateInput = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_class2 = class DateInput extends _react.Component {
58
- constructor() {
59
- super(...arguments);
60
- this.state = {
61
- hasInputRef: false
62
- };
63
- this._input = void 0;
64
- this.ref = null;
65
-
66
- this.formatDateId = date => {
67
- // ISO8601 strings may contain a space. Remove any spaces before using the
68
- // date as the id.
69
- return date.replace(/\s/g, '');
70
- };
71
-
72
- this.handleInputRef = el => {
73
- var _this$props$inputRef, _this$props;
74
-
75
- // Ensures that we position the Calendar with respect to the input correctly
76
- // if the Calendar is open on mount
77
- if (!this.state.hasInputRef) {
78
- this.setState({
79
- hasInputRef: true
80
- });
81
- }
82
-
83
- this._input = el;
84
- (_this$props$inputRef = (_this$props = this.props).inputRef) === null || _this$props$inputRef === void 0 ? void 0 : _this$props$inputRef.call(_this$props, el);
85
- };
86
-
87
- this.handleInputChange = (event, value) => {
88
- var _this$props$onChange, _this$props2;
89
-
90
- (_this$props$onChange = (_this$props2 = this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props2, event, {
91
- value
92
- });
93
- this.handleShowCalendar(event);
94
- };
95
-
96
- this.handleShowCalendar = event => {
97
- if (this.interaction === 'enabled') {
98
- var _this$props$onRequest, _this$props3;
99
-
100
- (_this$props$onRequest = (_this$props3 = this.props).onRequestShowCalendar) === null || _this$props$onRequest === void 0 ? void 0 : _this$props$onRequest.call(_this$props3, event);
101
- }
102
- };
103
-
104
- this.handleHideCalendar = event => {
105
- var _this$props$onRequest2, _this$props4, _this$props$onRequest3, _this$props5;
106
-
107
- (_this$props$onRequest2 = (_this$props4 = this.props).onRequestValidateDate) === null || _this$props$onRequest2 === void 0 ? void 0 : _this$props$onRequest2.call(_this$props4, event);
108
- (_this$props$onRequest3 = (_this$props5 = this.props).onRequestHideCalendar) === null || _this$props$onRequest3 === void 0 ? void 0 : _this$props$onRequest3.call(_this$props5, event);
109
- };
110
-
111
- this.handleHighlightOption = (event, _ref) => {
112
- let direction = _ref.direction;
113
- const _this$props6 = this.props,
114
- onRequestSelectNextDay = _this$props6.onRequestSelectNextDay,
115
- onRequestSelectPrevDay = _this$props6.onRequestSelectPrevDay;
116
- if (direction === -1) onRequestSelectPrevDay === null || onRequestSelectPrevDay === void 0 ? void 0 : onRequestSelectPrevDay(event);
117
- if (direction === 1) onRequestSelectNextDay === null || onRequestSelectNextDay === void 0 ? void 0 : onRequestSelectNextDay(event);
118
- };
119
- }
57
+ let DateInput = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = class DateInput extends _react.Component {
58
+ static displayName = "DateInput";
59
+ static componentId = 'DateInput';
60
+ static Day = _Calendar.Calendar.Day;
61
+ static propTypes = _props2.propTypes;
62
+ static allowedProps = _props2.allowedProps;
63
+ static defaultProps = {
64
+ value: '',
65
+ size: 'medium',
66
+ onBlur: () => {},
67
+ // must have a default so createChainedFunction works
68
+ isRequired: false,
69
+ isInline: false,
70
+ layout: 'stacked',
71
+ display: 'inline-block',
72
+ placement: 'bottom center',
73
+ isShowingCalendar: false
74
+ };
75
+ state = {
76
+ hasInputRef: false
77
+ };
78
+ _input = void 0;
79
+ ref = null;
120
80
 
121
81
  componentDidMount() {
122
- var _this$props$makeStyle, _this$props7;
82
+ var _this$props$makeStyle, _this$props;
123
83
 
124
- (_this$props$makeStyle = (_this$props7 = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props7);
84
+ (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
125
85
  }
126
86
 
127
87
  componentDidUpdate() {
128
- var _this$props$makeStyle2, _this$props8;
88
+ var _this$props$makeStyle2, _this$props2;
129
89
 
130
- (_this$props$makeStyle2 = (_this$props8 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props8);
90
+ (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2);
131
91
  }
132
92
 
133
93
  get selectedDateId() {
@@ -152,6 +112,55 @@ let DateInput = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 =
152
112
  });
153
113
  }
154
114
 
115
+ formatDateId = date => {
116
+ // ISO8601 strings may contain a space. Remove any spaces before using the
117
+ // date as the id.
118
+ return date.replace(/\s/g, '');
119
+ };
120
+ handleInputRef = el => {
121
+ var _this$props$inputRef, _this$props3;
122
+
123
+ // Ensures that we position the Calendar with respect to the input correctly
124
+ // if the Calendar is open on mount
125
+ if (!this.state.hasInputRef) {
126
+ this.setState({
127
+ hasInputRef: true
128
+ });
129
+ }
130
+
131
+ this._input = el;
132
+ (_this$props$inputRef = (_this$props3 = this.props).inputRef) === null || _this$props$inputRef === void 0 ? void 0 : _this$props$inputRef.call(_this$props3, el);
133
+ };
134
+ handleInputChange = (event, value) => {
135
+ var _this$props$onChange, _this$props4;
136
+
137
+ (_this$props$onChange = (_this$props4 = this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props4, event, {
138
+ value
139
+ });
140
+ this.handleShowCalendar(event);
141
+ };
142
+ handleShowCalendar = event => {
143
+ if (this.interaction === 'enabled') {
144
+ var _this$props$onRequest, _this$props5;
145
+
146
+ (_this$props$onRequest = (_this$props5 = this.props).onRequestShowCalendar) === null || _this$props$onRequest === void 0 ? void 0 : _this$props$onRequest.call(_this$props5, event);
147
+ }
148
+ };
149
+ handleHideCalendar = event => {
150
+ var _this$props$onRequest2, _this$props6, _this$props$onRequest3, _this$props7;
151
+
152
+ (_this$props$onRequest2 = (_this$props6 = this.props).onRequestValidateDate) === null || _this$props$onRequest2 === void 0 ? void 0 : _this$props$onRequest2.call(_this$props6, event);
153
+ (_this$props$onRequest3 = (_this$props7 = this.props).onRequestHideCalendar) === null || _this$props$onRequest3 === void 0 ? void 0 : _this$props$onRequest3.call(_this$props7, event);
154
+ };
155
+ handleHighlightOption = (event, _ref) => {
156
+ let direction = _ref.direction;
157
+ const _this$props8 = this.props,
158
+ onRequestSelectNextDay = _this$props8.onRequestSelectNextDay,
159
+ onRequestSelectPrevDay = _this$props8.onRequestSelectPrevDay;
160
+ if (direction === -1) onRequestSelectPrevDay === null || onRequestSelectPrevDay === void 0 ? void 0 : onRequestSelectPrevDay(event);
161
+ if (direction === 1) onRequestSelectNextDay === null || onRequestSelectNextDay === void 0 ? void 0 : onRequestSelectNextDay(event);
162
+ };
163
+
155
164
  renderMonthNavigationButton() {
156
165
  let type = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 'prev';
157
166
  const _this$props9 = this.props,
@@ -291,18 +300,7 @@ let DateInput = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 =
291
300
  });
292
301
  }
293
302
 
294
- }, _class2.displayName = "DateInput", _class2.componentId = 'DateInput', _class2.Day = _Calendar.Calendar.Day, _class2.propTypes = _props2.propTypes, _class2.allowedProps = _props2.allowedProps, _class2.defaultProps = {
295
- value: '',
296
- size: 'medium',
297
- onBlur: () => {},
298
- // must have a default so createChainedFunction works
299
- isRequired: false,
300
- isInline: false,
301
- layout: 'stacked',
302
- display: 'inline-block',
303
- placement: 'bottom center',
304
- isShowingCalendar: false
305
- }, _class2)) || _class) || _class);
303
+ }) || _class) || _class);
306
304
  exports.DateInput = DateInput;
307
305
  var _default = DateInput;
308
306
  exports.default = _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-date-input",
3
- "version": "8.25.1-snapshot-7",
3
+ "version": "8.25.1-snapshot-10",
4
4
  "description": "A UI component library made by Instructure Inc.",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "module": "./es/index.js",
@@ -23,24 +23,24 @@
23
23
  },
24
24
  "license": "MIT",
25
25
  "devDependencies": {
26
- "@instructure/ui-babel-preset": "8.25.1-snapshot-7",
27
- "@instructure/ui-test-locator": "8.25.1-snapshot-7",
28
- "@instructure/ui-test-utils": "8.25.1-snapshot-7"
26
+ "@instructure/ui-babel-preset": "8.25.1-snapshot-10",
27
+ "@instructure/ui-test-locator": "8.25.1-snapshot-10",
28
+ "@instructure/ui-test-utils": "8.25.1-snapshot-10"
29
29
  },
30
30
  "dependencies": {
31
31
  "@babel/runtime": "^7.13.10",
32
- "@instructure/emotion": "8.25.1-snapshot-7",
33
- "@instructure/ui-calendar": "8.25.1-snapshot-7",
34
- "@instructure/ui-form-field": "8.25.1-snapshot-7",
35
- "@instructure/ui-icons": "8.25.1-snapshot-7",
36
- "@instructure/ui-popover": "8.25.1-snapshot-7",
37
- "@instructure/ui-position": "8.25.1-snapshot-7",
38
- "@instructure/ui-prop-types": "8.25.1-snapshot-7",
39
- "@instructure/ui-react-utils": "8.25.1-snapshot-7",
40
- "@instructure/ui-selectable": "8.25.1-snapshot-7",
41
- "@instructure/ui-testable": "8.25.1-snapshot-7",
42
- "@instructure/ui-text-input": "8.25.1-snapshot-7",
43
- "@instructure/ui-utils": "8.25.1-snapshot-7",
32
+ "@instructure/emotion": "8.25.1-snapshot-10",
33
+ "@instructure/ui-calendar": "8.25.1-snapshot-10",
34
+ "@instructure/ui-form-field": "8.25.1-snapshot-10",
35
+ "@instructure/ui-icons": "8.25.1-snapshot-10",
36
+ "@instructure/ui-popover": "8.25.1-snapshot-10",
37
+ "@instructure/ui-position": "8.25.1-snapshot-10",
38
+ "@instructure/ui-prop-types": "8.25.1-snapshot-10",
39
+ "@instructure/ui-react-utils": "8.25.1-snapshot-10",
40
+ "@instructure/ui-selectable": "8.25.1-snapshot-10",
41
+ "@instructure/ui-testable": "8.25.1-snapshot-10",
42
+ "@instructure/ui-text-input": "8.25.1-snapshot-10",
43
+ "@instructure/ui-utils": "8.25.1-snapshot-10",
44
44
  "prop-types": "^15"
45
45
  },
46
46
  "peerDependencies": {