@instructure/quiz-core 20.30.1-snapshot.1 → 20.30.1-snapshot.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/es/moderating/components/resources/AccommodationsModal/index.js +21 -2
- package/es/moderating/components/sidebar/ModerateTray/presenter.js +95 -22
- package/lib/moderating/components/resources/AccommodationsModal/index.js +21 -2
- package/lib/moderating/components/sidebar/ModerateTray/presenter.js +95 -22
- package/package.json +9 -9
|
@@ -4,6 +4,7 @@ import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
|
4
4
|
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
|
|
5
5
|
import React, { Component } from 'react';
|
|
6
6
|
import PropTypes from 'prop-types';
|
|
7
|
+
import { Text } from '@instructure/ui-text';
|
|
7
8
|
import { Tooltip } from '@instructure/ui-tooltip';
|
|
8
9
|
import { Modal } from '@instructure/ui-modal';
|
|
9
10
|
import { TruncateText } from '@instructure/ui-truncate-text';
|
|
@@ -12,6 +13,8 @@ import { View } from '@instructure/ui-view';
|
|
|
12
13
|
import { Button, CloseButton } from '@instructure/ui-buttons';
|
|
13
14
|
import t from '@instructure/quiz-i18n/es/format-message';
|
|
14
15
|
import { ScreenReaderContent } from '@instructure/ui-a11y-content';
|
|
16
|
+
import { featureOn } from "../../../../common/util/featureCheck.js";
|
|
17
|
+
import { IfFeature } from "../../../../common/components/shared/IfFeature/index.js";
|
|
15
18
|
export var AccommodationModal = /*#__PURE__*/function (_Component) {
|
|
16
19
|
_inherits(AccommodationModal, _Component);
|
|
17
20
|
var _super = _createSuper(AccommodationModal);
|
|
@@ -54,6 +57,9 @@ export var AccommodationModal = /*#__PURE__*/function (_Component) {
|
|
|
54
57
|
}, _this.props.studentName));
|
|
55
58
|
};
|
|
56
59
|
_this.renderHeading = function () {
|
|
60
|
+
if (featureOn('atteq_apply_changes_to_current_quiz_attempts')) {
|
|
61
|
+
return /*#__PURE__*/React.createElement(Heading, null, /*#__PURE__*/React.createElement(ScreenReaderContent, null, t('Student Accommodation')), t('Student Accommodation'));
|
|
62
|
+
}
|
|
57
63
|
var _this$props = _this.props,
|
|
58
64
|
mountNode = _this$props.mountNode,
|
|
59
65
|
studentName = _this$props.studentName;
|
|
@@ -76,6 +82,14 @@ export var AccommodationModal = /*#__PURE__*/function (_Component) {
|
|
|
76
82
|
return _this;
|
|
77
83
|
}
|
|
78
84
|
_createClass(AccommodationModal, [{
|
|
85
|
+
key: "labelText",
|
|
86
|
+
value: function labelText() {
|
|
87
|
+
if (featureOn('atteq_apply_changes_to_current_quiz_attempts')) {
|
|
88
|
+
return t('Student Accommodation');
|
|
89
|
+
}
|
|
90
|
+
return this.props.studentName || t('Accommodations Modal');
|
|
91
|
+
}
|
|
92
|
+
}, {
|
|
79
93
|
key: "render",
|
|
80
94
|
value: function render() {
|
|
81
95
|
var _this$props2 = this.props,
|
|
@@ -86,7 +100,7 @@ export var AccommodationModal = /*#__PURE__*/function (_Component) {
|
|
|
86
100
|
children = _this$props2.children;
|
|
87
101
|
return /*#__PURE__*/React.createElement(Modal, {
|
|
88
102
|
open: open,
|
|
89
|
-
label:
|
|
103
|
+
label: this.labelText(),
|
|
90
104
|
mountNode: mountNode,
|
|
91
105
|
size: "small",
|
|
92
106
|
onExited: this.handleAccommodationsModalExited
|
|
@@ -95,7 +109,12 @@ export var AccommodationModal = /*#__PURE__*/function (_Component) {
|
|
|
95
109
|
placement: "end",
|
|
96
110
|
offset: "medium",
|
|
97
111
|
screenReaderLabel: t('Close')
|
|
98
|
-
}), this.renderHeading()), /*#__PURE__*/React.createElement(Modal.Body, null,
|
|
112
|
+
}), this.renderHeading()), /*#__PURE__*/React.createElement(Modal.Body, null, /*#__PURE__*/React.createElement(IfFeature, {
|
|
113
|
+
name: "atteq_apply_changes_to_current_quiz_attempts"
|
|
114
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
115
|
+
weight: "bold",
|
|
116
|
+
as: "h2"
|
|
117
|
+
}, studentName)), children), /*#__PURE__*/React.createElement(Modal.Footer, null, /*#__PURE__*/React.createElement(Button, {
|
|
99
118
|
onClick: this.cancelAction,
|
|
100
119
|
margin: "xxx-small",
|
|
101
120
|
"data-automation": "sdk-moderation-cancel"
|
|
@@ -7,6 +7,7 @@ import PropTypes from 'prop-types';
|
|
|
7
7
|
import t from '@instructure/quiz-i18n/es/format-message';
|
|
8
8
|
import { Flex } from '@instructure/ui-flex';
|
|
9
9
|
import { View } from '@instructure/ui-view';
|
|
10
|
+
import { Text } from '@instructure/ui-text';
|
|
10
11
|
import { Tooltip } from '@instructure/ui-tooltip';
|
|
11
12
|
import { Tray } from '@instructure/ui-tray';
|
|
12
13
|
import { Button, CloseButton } from '@instructure/ui-buttons';
|
|
@@ -26,12 +27,20 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
26
27
|
}
|
|
27
28
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
28
29
|
_this.state = {
|
|
29
|
-
|
|
30
|
+
titleIsTruncated: false,
|
|
31
|
+
participantNameIsTruncated: false
|
|
30
32
|
};
|
|
31
|
-
_this.
|
|
32
|
-
if (_this.state.
|
|
33
|
+
_this.handleTitleUpdate = function (titleIsTruncated) {
|
|
34
|
+
if (_this.state.titleIsTruncated !== titleIsTruncated) {
|
|
33
35
|
_this.setState({
|
|
34
|
-
|
|
36
|
+
titleIsTruncated: titleIsTruncated
|
|
37
|
+
});
|
|
38
|
+
}
|
|
39
|
+
};
|
|
40
|
+
_this.handleParticipantNameUpdate = function (participantNameIsTruncated) {
|
|
41
|
+
if (_this.state.participantNameIsTruncated !== participantNameIsTruncated) {
|
|
42
|
+
_this.setState({
|
|
43
|
+
participantNameIsTruncated: participantNameIsTruncated
|
|
35
44
|
});
|
|
36
45
|
}
|
|
37
46
|
};
|
|
@@ -40,7 +49,8 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
40
49
|
};
|
|
41
50
|
_this.handleTrayExited = function () {
|
|
42
51
|
_this.setState({
|
|
43
|
-
|
|
52
|
+
titleIsTruncated: false,
|
|
53
|
+
participantNameIsTruncated: false
|
|
44
54
|
});
|
|
45
55
|
};
|
|
46
56
|
_this.setCloseRef = function (el) {
|
|
@@ -57,19 +67,16 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
57
67
|
_this.props.closeTray();
|
|
58
68
|
};
|
|
59
69
|
_this.renderTitleAndCloseButton = function () {
|
|
60
|
-
return /*#__PURE__*/React.createElement(Flex,
|
|
70
|
+
return /*#__PURE__*/React.createElement(Flex, {
|
|
71
|
+
justifyItems: "space-between"
|
|
72
|
+
}, /*#__PURE__*/React.createElement(Flex.Item, {
|
|
61
73
|
shouldGrow: true,
|
|
62
74
|
shouldShrink: true
|
|
63
|
-
},
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
},
|
|
68
|
-
var focused = _ref.focused;
|
|
69
|
-
return _this.renderName({
|
|
70
|
-
focused: focused
|
|
71
|
-
});
|
|
72
|
-
}) : _this.renderName()), /*#__PURE__*/React.createElement(Flex.Item, null, /*#__PURE__*/React.createElement(CloseButton, {
|
|
75
|
+
}, featureOn('atteq_apply_changes_to_current_quiz_attempts') ? /*#__PURE__*/React.createElement(Text, {
|
|
76
|
+
as: "h2",
|
|
77
|
+
size: "large",
|
|
78
|
+
weight: "bold"
|
|
79
|
+
}, t('In Progress Accommodation')) : _this.renderHeading()), /*#__PURE__*/React.createElement(Flex.Item, null, /*#__PURE__*/React.createElement(CloseButton, {
|
|
73
80
|
onClick: _this.props.closeTray,
|
|
74
81
|
elementRef: _this.setCloseRef,
|
|
75
82
|
screenReaderLabel: t('Close')
|
|
@@ -98,9 +105,25 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
98
105
|
return _this;
|
|
99
106
|
}
|
|
100
107
|
_createClass(ModerateTray, [{
|
|
101
|
-
key: "
|
|
102
|
-
value: function
|
|
103
|
-
var
|
|
108
|
+
key: "renderHeading",
|
|
109
|
+
value: function renderHeading() {
|
|
110
|
+
var _this2 = this;
|
|
111
|
+
return this.state.titleIsTruncated ? /*#__PURE__*/React.createElement(Tooltip, {
|
|
112
|
+
placement: "start",
|
|
113
|
+
renderTip: this.labelText(),
|
|
114
|
+
mountNode: this.getTrayRef || null
|
|
115
|
+
}, function (_ref) {
|
|
116
|
+
var focused = _ref.focused;
|
|
117
|
+
return _this2.renderHeadingName({
|
|
118
|
+
focused: focused
|
|
119
|
+
});
|
|
120
|
+
}) : this.renderHeadingName();
|
|
121
|
+
}
|
|
122
|
+
}, {
|
|
123
|
+
key: "renderHeadingName",
|
|
124
|
+
value: function renderHeadingName() {
|
|
125
|
+
var _ref2 = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {},
|
|
126
|
+
focused = _ref2.focused;
|
|
104
127
|
return (
|
|
105
128
|
/*#__PURE__*/
|
|
106
129
|
// When using TruncateText inside a Tooltip, a focusable wrapper element is required
|
|
@@ -109,20 +132,69 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
109
132
|
display: "block",
|
|
110
133
|
borderRadius: "small",
|
|
111
134
|
position: "relative",
|
|
112
|
-
withFocusOutline: this.state.
|
|
135
|
+
withFocusOutline: this.state.titleIsTruncated && focused,
|
|
113
136
|
as: "h2",
|
|
114
137
|
tabIndex: this.state.isTruncated ? 0 : null
|
|
115
138
|
}, /*#__PURE__*/React.createElement(ScreenReaderContent, null, this.labelText()), /*#__PURE__*/React.createElement(TruncateText, {
|
|
116
139
|
"aria-hidden": "true",
|
|
117
140
|
maxLines: 2,
|
|
118
141
|
truncate: "character",
|
|
119
|
-
onUpdate: this.
|
|
142
|
+
onUpdate: this.handleTitleUpdate
|
|
120
143
|
}, this.labelText()))
|
|
121
144
|
);
|
|
122
145
|
}
|
|
146
|
+
}, {
|
|
147
|
+
key: "renderName",
|
|
148
|
+
value: function renderName(renderProps) {
|
|
149
|
+
if (!featureOn('atteq_apply_changes_to_current_quiz_attempts')) {
|
|
150
|
+
return null;
|
|
151
|
+
}
|
|
152
|
+
var focused = renderProps && renderProps.focused;
|
|
153
|
+
return (
|
|
154
|
+
/*#__PURE__*/
|
|
155
|
+
// When using TruncateText inside a Tooltip, a focusable wrapper element is required
|
|
156
|
+
// tabIndex={0} makes the div focusable and allows KO users to access the tooltip
|
|
157
|
+
React.createElement(View, {
|
|
158
|
+
display: "block",
|
|
159
|
+
borderRadius: "small",
|
|
160
|
+
position: "relative",
|
|
161
|
+
withFocusOutline: this.state.participantNameIsTruncated && focused,
|
|
162
|
+
tabIndex: this.state.participantNameIsTruncated ? 0 : null,
|
|
163
|
+
margin: "small 0"
|
|
164
|
+
}, /*#__PURE__*/React.createElement(ScreenReaderContent, null, this.props.participantName), /*#__PURE__*/React.createElement(TruncateText, {
|
|
165
|
+
"aria-hidden": "true",
|
|
166
|
+
maxLines: 2,
|
|
167
|
+
truncate: "character",
|
|
168
|
+
onUpdate: this.handleParticipantNameUpdate
|
|
169
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
170
|
+
weight: "bold"
|
|
171
|
+
}, this.props.participantName)))
|
|
172
|
+
);
|
|
173
|
+
}
|
|
174
|
+
}, {
|
|
175
|
+
key: "renderNameWithTooltip",
|
|
176
|
+
value: function renderNameWithTooltip() {
|
|
177
|
+
var _this3 = this;
|
|
178
|
+
if (!featureOn('atteq_apply_changes_to_current_quiz_attempts')) {
|
|
179
|
+
return null;
|
|
180
|
+
}
|
|
181
|
+
return this.state.titleIsTruncated ? /*#__PURE__*/React.createElement(Tooltip, {
|
|
182
|
+
placement: "start",
|
|
183
|
+
renderTip: this.props.participantName,
|
|
184
|
+
mountNode: this.getTrayRef || null
|
|
185
|
+
}, function (_ref3) {
|
|
186
|
+
var focused = _ref3.focused;
|
|
187
|
+
return _this3.renderName({
|
|
188
|
+
focused: focused
|
|
189
|
+
});
|
|
190
|
+
}) : this.renderName();
|
|
191
|
+
}
|
|
123
192
|
}, {
|
|
124
193
|
key: "labelText",
|
|
125
194
|
value: function labelText() {
|
|
195
|
+
if (featureOn('atteq_apply_changes_to_current_quiz_attempts')) {
|
|
196
|
+
return t('In Progress Accommodation');
|
|
197
|
+
}
|
|
126
198
|
if (this.props.participantName) {
|
|
127
199
|
return this.props.participantName;
|
|
128
200
|
}
|
|
@@ -139,6 +211,7 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
139
211
|
onExited: this.handleTrayExited,
|
|
140
212
|
open: this.props.isOpen,
|
|
141
213
|
placement: "end",
|
|
214
|
+
size: featureOn('atteq_apply_changes_to_current_quiz_attempts') ? 'regular' : void 0,
|
|
142
215
|
shouldCloseOnDocumentClick: true,
|
|
143
216
|
ref: this.setTrayRef
|
|
144
217
|
}, /*#__PURE__*/React.createElement(Flex, {
|
|
@@ -150,7 +223,7 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
150
223
|
}, this.renderTitleAndCloseButton()), /*#__PURE__*/React.createElement(Flex.Item, {
|
|
151
224
|
shouldGrow: true,
|
|
152
225
|
padding: "0 medium"
|
|
153
|
-
}, this.renderChildren()), featureOn('add_time_to_existing_quiz_sessions') && /*#__PURE__*/React.createElement(Flex.Item, null, this.renderFooter())));
|
|
226
|
+
}, this.renderNameWithTooltip(), this.renderChildren()), featureOn('add_time_to_existing_quiz_sessions') && /*#__PURE__*/React.createElement(Flex.Item, null, this.renderFooter())));
|
|
154
227
|
}
|
|
155
228
|
}]);
|
|
156
229
|
ModerateTray.displayName = "ModerateTray";
|
|
@@ -12,6 +12,7 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
|
|
|
12
12
|
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
13
13
|
var _react = _interopRequireWildcard(require("react"));
|
|
14
14
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
15
|
+
var _uiText = require("@instructure/ui-text");
|
|
15
16
|
var _uiTooltip = require("@instructure/ui-tooltip");
|
|
16
17
|
var _uiModal = require("@instructure/ui-modal");
|
|
17
18
|
var _uiTruncateText = require("@instructure/ui-truncate-text");
|
|
@@ -20,6 +21,8 @@ var _uiView = require("@instructure/ui-view");
|
|
|
20
21
|
var _uiButtons = require("@instructure/ui-buttons");
|
|
21
22
|
var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
|
|
22
23
|
var _uiA11yContent = require("@instructure/ui-a11y-content");
|
|
24
|
+
var _featureCheck = require("../../../../common/util/featureCheck.js");
|
|
25
|
+
var _index = require("../../../../common/components/shared/IfFeature/index.js");
|
|
23
26
|
var AccommodationModal = /*#__PURE__*/function (_Component) {
|
|
24
27
|
(0, _inherits2.default)(AccommodationModal, _Component);
|
|
25
28
|
var _super = (0, _createSuper2.default)(AccommodationModal);
|
|
@@ -62,6 +65,9 @@ var AccommodationModal = /*#__PURE__*/function (_Component) {
|
|
|
62
65
|
}, _this.props.studentName));
|
|
63
66
|
};
|
|
64
67
|
_this.renderHeading = function () {
|
|
68
|
+
if ((0, _featureCheck.featureOn)('atteq_apply_changes_to_current_quiz_attempts')) {
|
|
69
|
+
return /*#__PURE__*/_react.default.createElement(_uiHeading.Heading, null, /*#__PURE__*/_react.default.createElement(_uiA11yContent.ScreenReaderContent, null, (0, _formatMessage.default)('Student Accommodation')), (0, _formatMessage.default)('Student Accommodation'));
|
|
70
|
+
}
|
|
65
71
|
var _this$props = _this.props,
|
|
66
72
|
mountNode = _this$props.mountNode,
|
|
67
73
|
studentName = _this$props.studentName;
|
|
@@ -84,6 +90,14 @@ var AccommodationModal = /*#__PURE__*/function (_Component) {
|
|
|
84
90
|
return _this;
|
|
85
91
|
}
|
|
86
92
|
(0, _createClass2.default)(AccommodationModal, [{
|
|
93
|
+
key: "labelText",
|
|
94
|
+
value: function labelText() {
|
|
95
|
+
if ((0, _featureCheck.featureOn)('atteq_apply_changes_to_current_quiz_attempts')) {
|
|
96
|
+
return (0, _formatMessage.default)('Student Accommodation');
|
|
97
|
+
}
|
|
98
|
+
return this.props.studentName || (0, _formatMessage.default)('Accommodations Modal');
|
|
99
|
+
}
|
|
100
|
+
}, {
|
|
87
101
|
key: "render",
|
|
88
102
|
value: function render() {
|
|
89
103
|
var _this$props2 = this.props,
|
|
@@ -94,7 +108,7 @@ var AccommodationModal = /*#__PURE__*/function (_Component) {
|
|
|
94
108
|
children = _this$props2.children;
|
|
95
109
|
return /*#__PURE__*/_react.default.createElement(_uiModal.Modal, {
|
|
96
110
|
open: open,
|
|
97
|
-
label:
|
|
111
|
+
label: this.labelText(),
|
|
98
112
|
mountNode: mountNode,
|
|
99
113
|
size: "small",
|
|
100
114
|
onExited: this.handleAccommodationsModalExited
|
|
@@ -103,7 +117,12 @@ var AccommodationModal = /*#__PURE__*/function (_Component) {
|
|
|
103
117
|
placement: "end",
|
|
104
118
|
offset: "medium",
|
|
105
119
|
screenReaderLabel: (0, _formatMessage.default)('Close')
|
|
106
|
-
}), this.renderHeading()), /*#__PURE__*/_react.default.createElement(_uiModal.Modal.Body, null,
|
|
120
|
+
}), this.renderHeading()), /*#__PURE__*/_react.default.createElement(_uiModal.Modal.Body, null, /*#__PURE__*/_react.default.createElement(_index.IfFeature, {
|
|
121
|
+
name: "atteq_apply_changes_to_current_quiz_attempts"
|
|
122
|
+
}, /*#__PURE__*/_react.default.createElement(_uiText.Text, {
|
|
123
|
+
weight: "bold",
|
|
124
|
+
as: "h2"
|
|
125
|
+
}, studentName)), children), /*#__PURE__*/_react.default.createElement(_uiModal.Modal.Footer, null, /*#__PURE__*/_react.default.createElement(_uiButtons.Button, {
|
|
107
126
|
onClick: this.cancelAction,
|
|
108
127
|
margin: "xxx-small",
|
|
109
128
|
"data-automation": "sdk-moderation-cancel"
|
|
@@ -15,6 +15,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
|
15
15
|
var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
|
|
16
16
|
var _uiFlex = require("@instructure/ui-flex");
|
|
17
17
|
var _uiView = require("@instructure/ui-view");
|
|
18
|
+
var _uiText = require("@instructure/ui-text");
|
|
18
19
|
var _uiTooltip = require("@instructure/ui-tooltip");
|
|
19
20
|
var _uiTray = require("@instructure/ui-tray");
|
|
20
21
|
var _uiButtons = require("@instructure/ui-buttons");
|
|
@@ -34,12 +35,20 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
34
35
|
}
|
|
35
36
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
36
37
|
_this.state = {
|
|
37
|
-
|
|
38
|
+
titleIsTruncated: false,
|
|
39
|
+
participantNameIsTruncated: false
|
|
38
40
|
};
|
|
39
|
-
_this.
|
|
40
|
-
if (_this.state.
|
|
41
|
+
_this.handleTitleUpdate = function (titleIsTruncated) {
|
|
42
|
+
if (_this.state.titleIsTruncated !== titleIsTruncated) {
|
|
41
43
|
_this.setState({
|
|
42
|
-
|
|
44
|
+
titleIsTruncated: titleIsTruncated
|
|
45
|
+
});
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
_this.handleParticipantNameUpdate = function (participantNameIsTruncated) {
|
|
49
|
+
if (_this.state.participantNameIsTruncated !== participantNameIsTruncated) {
|
|
50
|
+
_this.setState({
|
|
51
|
+
participantNameIsTruncated: participantNameIsTruncated
|
|
43
52
|
});
|
|
44
53
|
}
|
|
45
54
|
};
|
|
@@ -48,7 +57,8 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
48
57
|
};
|
|
49
58
|
_this.handleTrayExited = function () {
|
|
50
59
|
_this.setState({
|
|
51
|
-
|
|
60
|
+
titleIsTruncated: false,
|
|
61
|
+
participantNameIsTruncated: false
|
|
52
62
|
});
|
|
53
63
|
};
|
|
54
64
|
_this.setCloseRef = function (el) {
|
|
@@ -65,19 +75,16 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
65
75
|
_this.props.closeTray();
|
|
66
76
|
};
|
|
67
77
|
_this.renderTitleAndCloseButton = function () {
|
|
68
|
-
return /*#__PURE__*/_react.default.createElement(_uiFlex.Flex,
|
|
78
|
+
return /*#__PURE__*/_react.default.createElement(_uiFlex.Flex, {
|
|
79
|
+
justifyItems: "space-between"
|
|
80
|
+
}, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
|
|
69
81
|
shouldGrow: true,
|
|
70
82
|
shouldShrink: true
|
|
71
|
-
},
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
},
|
|
76
|
-
var focused = _ref.focused;
|
|
77
|
-
return _this.renderName({
|
|
78
|
-
focused: focused
|
|
79
|
-
});
|
|
80
|
-
}) : _this.renderName()), /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, null, /*#__PURE__*/_react.default.createElement(_uiButtons.CloseButton, {
|
|
83
|
+
}, (0, _featureCheck.featureOn)('atteq_apply_changes_to_current_quiz_attempts') ? /*#__PURE__*/_react.default.createElement(_uiText.Text, {
|
|
84
|
+
as: "h2",
|
|
85
|
+
size: "large",
|
|
86
|
+
weight: "bold"
|
|
87
|
+
}, (0, _formatMessage.default)('In Progress Accommodation')) : _this.renderHeading()), /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, null, /*#__PURE__*/_react.default.createElement(_uiButtons.CloseButton, {
|
|
81
88
|
onClick: _this.props.closeTray,
|
|
82
89
|
elementRef: _this.setCloseRef,
|
|
83
90
|
screenReaderLabel: (0, _formatMessage.default)('Close')
|
|
@@ -106,9 +113,25 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
106
113
|
return _this;
|
|
107
114
|
}
|
|
108
115
|
(0, _createClass2.default)(ModerateTray, [{
|
|
109
|
-
key: "
|
|
110
|
-
value: function
|
|
111
|
-
var
|
|
116
|
+
key: "renderHeading",
|
|
117
|
+
value: function renderHeading() {
|
|
118
|
+
var _this2 = this;
|
|
119
|
+
return this.state.titleIsTruncated ? /*#__PURE__*/_react.default.createElement(_uiTooltip.Tooltip, {
|
|
120
|
+
placement: "start",
|
|
121
|
+
renderTip: this.labelText(),
|
|
122
|
+
mountNode: this.getTrayRef || null
|
|
123
|
+
}, function (_ref) {
|
|
124
|
+
var focused = _ref.focused;
|
|
125
|
+
return _this2.renderHeadingName({
|
|
126
|
+
focused: focused
|
|
127
|
+
});
|
|
128
|
+
}) : this.renderHeadingName();
|
|
129
|
+
}
|
|
130
|
+
}, {
|
|
131
|
+
key: "renderHeadingName",
|
|
132
|
+
value: function renderHeadingName() {
|
|
133
|
+
var _ref2 = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {},
|
|
134
|
+
focused = _ref2.focused;
|
|
112
135
|
return (
|
|
113
136
|
/*#__PURE__*/
|
|
114
137
|
// When using TruncateText inside a Tooltip, a focusable wrapper element is required
|
|
@@ -117,20 +140,69 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
117
140
|
display: "block",
|
|
118
141
|
borderRadius: "small",
|
|
119
142
|
position: "relative",
|
|
120
|
-
withFocusOutline: this.state.
|
|
143
|
+
withFocusOutline: this.state.titleIsTruncated && focused,
|
|
121
144
|
as: "h2",
|
|
122
145
|
tabIndex: this.state.isTruncated ? 0 : null
|
|
123
146
|
}, /*#__PURE__*/_react.default.createElement(_uiA11yContent.ScreenReaderContent, null, this.labelText()), /*#__PURE__*/_react.default.createElement(_uiTruncateText.TruncateText, {
|
|
124
147
|
"aria-hidden": "true",
|
|
125
148
|
maxLines: 2,
|
|
126
149
|
truncate: "character",
|
|
127
|
-
onUpdate: this.
|
|
150
|
+
onUpdate: this.handleTitleUpdate
|
|
128
151
|
}, this.labelText()))
|
|
129
152
|
);
|
|
130
153
|
}
|
|
154
|
+
}, {
|
|
155
|
+
key: "renderName",
|
|
156
|
+
value: function renderName(renderProps) {
|
|
157
|
+
if (!(0, _featureCheck.featureOn)('atteq_apply_changes_to_current_quiz_attempts')) {
|
|
158
|
+
return null;
|
|
159
|
+
}
|
|
160
|
+
var focused = renderProps && renderProps.focused;
|
|
161
|
+
return (
|
|
162
|
+
/*#__PURE__*/
|
|
163
|
+
// When using TruncateText inside a Tooltip, a focusable wrapper element is required
|
|
164
|
+
// tabIndex={0} makes the div focusable and allows KO users to access the tooltip
|
|
165
|
+
_react.default.createElement(_uiView.View, {
|
|
166
|
+
display: "block",
|
|
167
|
+
borderRadius: "small",
|
|
168
|
+
position: "relative",
|
|
169
|
+
withFocusOutline: this.state.participantNameIsTruncated && focused,
|
|
170
|
+
tabIndex: this.state.participantNameIsTruncated ? 0 : null,
|
|
171
|
+
margin: "small 0"
|
|
172
|
+
}, /*#__PURE__*/_react.default.createElement(_uiA11yContent.ScreenReaderContent, null, this.props.participantName), /*#__PURE__*/_react.default.createElement(_uiTruncateText.TruncateText, {
|
|
173
|
+
"aria-hidden": "true",
|
|
174
|
+
maxLines: 2,
|
|
175
|
+
truncate: "character",
|
|
176
|
+
onUpdate: this.handleParticipantNameUpdate
|
|
177
|
+
}, /*#__PURE__*/_react.default.createElement(_uiText.Text, {
|
|
178
|
+
weight: "bold"
|
|
179
|
+
}, this.props.participantName)))
|
|
180
|
+
);
|
|
181
|
+
}
|
|
182
|
+
}, {
|
|
183
|
+
key: "renderNameWithTooltip",
|
|
184
|
+
value: function renderNameWithTooltip() {
|
|
185
|
+
var _this3 = this;
|
|
186
|
+
if (!(0, _featureCheck.featureOn)('atteq_apply_changes_to_current_quiz_attempts')) {
|
|
187
|
+
return null;
|
|
188
|
+
}
|
|
189
|
+
return this.state.titleIsTruncated ? /*#__PURE__*/_react.default.createElement(_uiTooltip.Tooltip, {
|
|
190
|
+
placement: "start",
|
|
191
|
+
renderTip: this.props.participantName,
|
|
192
|
+
mountNode: this.getTrayRef || null
|
|
193
|
+
}, function (_ref3) {
|
|
194
|
+
var focused = _ref3.focused;
|
|
195
|
+
return _this3.renderName({
|
|
196
|
+
focused: focused
|
|
197
|
+
});
|
|
198
|
+
}) : this.renderName();
|
|
199
|
+
}
|
|
131
200
|
}, {
|
|
132
201
|
key: "labelText",
|
|
133
202
|
value: function labelText() {
|
|
203
|
+
if ((0, _featureCheck.featureOn)('atteq_apply_changes_to_current_quiz_attempts')) {
|
|
204
|
+
return (0, _formatMessage.default)('In Progress Accommodation');
|
|
205
|
+
}
|
|
134
206
|
if (this.props.participantName) {
|
|
135
207
|
return this.props.participantName;
|
|
136
208
|
}
|
|
@@ -147,6 +219,7 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
147
219
|
onExited: this.handleTrayExited,
|
|
148
220
|
open: this.props.isOpen,
|
|
149
221
|
placement: "end",
|
|
222
|
+
size: (0, _featureCheck.featureOn)('atteq_apply_changes_to_current_quiz_attempts') ? 'regular' : void 0,
|
|
150
223
|
shouldCloseOnDocumentClick: true,
|
|
151
224
|
ref: this.setTrayRef
|
|
152
225
|
}, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex, {
|
|
@@ -158,7 +231,7 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
|
|
|
158
231
|
}, this.renderTitleAndCloseButton()), /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
|
|
159
232
|
shouldGrow: true,
|
|
160
233
|
padding: "0 medium"
|
|
161
|
-
}, this.renderChildren()), (0, _featureCheck.featureOn)('add_time_to_existing_quiz_sessions') && /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, null, this.renderFooter())));
|
|
234
|
+
}, this.renderNameWithTooltip(), this.renderChildren()), (0, _featureCheck.featureOn)('add_time_to_existing_quiz_sessions') && /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, null, this.renderFooter())));
|
|
162
235
|
}
|
|
163
236
|
}]);
|
|
164
237
|
ModerateTray.displayName = "ModerateTray";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@instructure/quiz-core",
|
|
3
|
-
"version": "20.30.1-snapshot.
|
|
3
|
+
"version": "20.30.1-snapshot.2+d858814aa",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "The Quiz React SDK by Instructure Inc.",
|
|
6
6
|
"author": "Instructure, Inc. Engineering and Product Design",
|
|
@@ -45,11 +45,11 @@
|
|
|
45
45
|
"@instructure/emotion": "^8.51.0",
|
|
46
46
|
"@instructure/grading-utils": "^1.0.0",
|
|
47
47
|
"@instructure/outcomes-ui": "^3.2.2",
|
|
48
|
-
"@instructure/quiz-common": "20.30.1-snapshot.
|
|
49
|
-
"@instructure/quiz-i18n": "20.30.1-snapshot.
|
|
50
|
-
"@instructure/quiz-interactions": "20.30.1-snapshot.
|
|
51
|
-
"@instructure/quiz-number-input": "20.30.1-snapshot.
|
|
52
|
-
"@instructure/quiz-rce": "20.30.1-snapshot.
|
|
48
|
+
"@instructure/quiz-common": "20.30.1-snapshot.2+d858814aa",
|
|
49
|
+
"@instructure/quiz-i18n": "20.30.1-snapshot.2+d858814aa",
|
|
50
|
+
"@instructure/quiz-interactions": "20.30.1-snapshot.2+d858814aa",
|
|
51
|
+
"@instructure/quiz-number-input": "20.30.1-snapshot.2+d858814aa",
|
|
52
|
+
"@instructure/quiz-rce": "20.30.1-snapshot.2+d858814aa",
|
|
53
53
|
"@instructure/ui-a11y-content": "^8.51.0",
|
|
54
54
|
"@instructure/ui-alerts": "^8.51.0",
|
|
55
55
|
"@instructure/ui-avatar": "^8.51.0",
|
|
@@ -113,7 +113,7 @@
|
|
|
113
113
|
"file-saver": "~2.0.5",
|
|
114
114
|
"humps": "^2.0.0",
|
|
115
115
|
"immutable": "^3.8.1",
|
|
116
|
-
"instructure-validations": "20.30.1-snapshot.
|
|
116
|
+
"instructure-validations": "20.30.1-snapshot.2+d858814aa",
|
|
117
117
|
"ipaddr.js": "^1.5.4",
|
|
118
118
|
"isomorphic-fetch": "^2.2.0",
|
|
119
119
|
"isuuid": "^0.1.0",
|
|
@@ -162,7 +162,7 @@
|
|
|
162
162
|
"jquery": "^2.2.3",
|
|
163
163
|
"karma-junit-reporter": "^2.0.1",
|
|
164
164
|
"most-subject": "^5.3.0",
|
|
165
|
-
"quiz-presets": "20.30.1-snapshot.
|
|
165
|
+
"quiz-presets": "20.30.1-snapshot.2+d858814aa",
|
|
166
166
|
"react": "^16.8.6",
|
|
167
167
|
"react-addons-test-utils": "^15.6.2",
|
|
168
168
|
"react-dom": "^16.8.6",
|
|
@@ -178,5 +178,5 @@
|
|
|
178
178
|
"publishConfig": {
|
|
179
179
|
"access": "public"
|
|
180
180
|
},
|
|
181
|
-
"gitHead": "
|
|
181
|
+
"gitHead": "d858814aa865e9bce6c56ee471b36cb2d3059688"
|
|
182
182
|
}
|