@instructure/quiz-core 20.17.3-rc.1 → 20.17.3-rc.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.
Files changed (5) hide show
  1. package/es/moderating/components/resources/ModerateTable/presenter.js +4 -2
  2. package/es/moderating/components/sidebar/ModerateTray/presenter.js +54 -28
  3. package/lib/moderating/components/resources/ModerateTable/presenter.js +4 -2
  4. package/lib/moderating/components/sidebar/ModerateTray/presenter.js +53 -27
  5. package/package.json +9 -9
package/es/moderating/components/resources/ModerateTable/presenter.js CHANGED
@@ -322,8 +322,9 @@ export var ModerateTable = (_dec = withStyle(generateStyle, generateComponentThe
322
322
  return jsx("div", {
323
323
  css: this.props.styles.page
324
324
  }, jsx(ModerateTray, {
325
- onClose: this.onCloseTray
326
- }, !this.props.anonymousGrading && (_ResetQuiz || (_ResetQuiz = jsx(ResetQuiz, null))), this.props.children), this.renderContent());
325
+ onClose: this.onCloseTray,
326
+ onSave: this.props.onSaveTray
327
+ }, jsx(Flex.Item, null, !this.props.anonymousGrading && (_ResetQuiz || (_ResetQuiz = jsx(ResetQuiz, null)))), this.props.children), this.renderContent());
327
328
  }
328
329
  }]);
329
330
  }(Component), _ModerateTable.propTypes = {
@@ -337,6 +338,7 @@ export var ModerateTable = (_dec = withStyle(generateStyle, generateComponentThe
337
338
  onOpenTray: PropTypes.func,
338
339
  onResultsLinkClick: PropTypes.func,
339
340
  openTray: PropTypes.func.isRequired,
341
+ onSaveTray: PropTypes.func.isRequired,
340
342
  sessionTimeLimitInSeconds: PropTypes.number,
341
343
  hasSessionTimeLimit: PropTypes.bool,
342
344
  sendSessionTimeLimit: PropTypes.func,
package/es/moderating/components/sidebar/ModerateTray/presenter.js CHANGED
@@ -5,11 +5,13 @@ import _inherits from "@babel/runtime/helpers/esm/inherits";
5
5
  import React, { Component } from 'react';
6
6
  import PropTypes from 'prop-types';
7
7
  import t from '@instructure/quiz-i18n/es/format-message';
8
+ import { Flex } from '@instructure/ui-flex';
8
9
  import { View } from '@instructure/ui-view';
9
10
  import { Tooltip } from '@instructure/ui-tooltip';
10
11
  import { Tray } from '@instructure/ui-tray';
11
- import { CloseButton } from '@instructure/ui-buttons';
12
+ import { Button, CloseButton } from '@instructure/ui-buttons';
12
13
  import { TruncateText } from '@instructure/ui-truncate-text';
14
+ import { Modal } from '@instructure/ui-modal';
13
15
  import { liveRegion } from '@instructure/quiz-common';
14
16
  import { ScreenReaderContent } from '@instructure/ui-a11y-content';
15
17
  export var ModerateTray = /*#__PURE__*/function (_Component) {
@@ -38,6 +40,38 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
38
40
  isTruncated: false
39
41
  });
40
42
  };
43
+ _this.setCloseRef = function (el) {
44
+ return _this.closeRef = el;
45
+ };
46
+ _this.setTrayRef = function (el) {
47
+ return _this.trayRef = el;
48
+ };
49
+ _this.getTrayRef = function () {
50
+ return _this.trayRef;
51
+ };
52
+ _this.handleSave = function () {
53
+ _this.props.onSave();
54
+ _this.props.closeTray();
55
+ };
56
+ _this.renderTitleAndCloseButton = function () {
57
+ return /*#__PURE__*/React.createElement(Flex, null, /*#__PURE__*/React.createElement(Flex.Item, {
58
+ shouldGrow: true,
59
+ shouldShrink: true
60
+ }, _this.state.isTruncated ? /*#__PURE__*/React.createElement(Tooltip, {
61
+ placement: "start",
62
+ renderTip: _this.labelText(),
63
+ mountNode: _this.getTrayRef || null
64
+ }, function (_ref) {
65
+ var focused = _ref.focused;
66
+ return _this.renderName({
67
+ focused: focused
68
+ });
69
+ }) : _this.renderName()), /*#__PURE__*/React.createElement(Flex.Item, null, /*#__PURE__*/React.createElement(CloseButton, {
70
+ onClick: _this.props.closeTray,
71
+ elementRef: _this.setCloseRef,
72
+ screenReaderLabel: t('Close')
73
+ })));
74
+ };
41
75
  _this.renderChildren = function () {
42
76
  return React.Children.map(_this.props.children, function (child) {
43
77
  if (!child) return null;
@@ -48,14 +82,15 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
48
82
  });
49
83
  });
50
84
  };
51
- _this.setCloseRef = function (el) {
52
- return _this.closeRef = el;
53
- };
54
- _this.setTrayRef = function (el) {
55
- return _this.trayRef = el;
56
- };
57
- _this.getTrayRef = function () {
58
- return _this.trayRef;
85
+ _this.renderFooter = function () {
86
+ return /*#__PURE__*/React.createElement(Modal.Footer, null, /*#__PURE__*/React.createElement(Button, {
87
+ onClick: _this.props.closeTray,
88
+ margin: "0 x-small 0 0"
89
+ }, t('Cancel')), /*#__PURE__*/React.createElement(Button, {
90
+ color: "primary",
91
+ type: "submit",
92
+ onClick: _this.handleSave
93
+ }, t('Apply')));
59
94
  };
60
95
  return _this;
61
96
  }
@@ -95,7 +130,6 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
95
130
  }, {
96
131
  key: "render",
97
132
  value: function render() {
98
- var _this2 = this;
99
133
  return /*#__PURE__*/React.createElement(Tray, {
100
134
  label: this.labelText(),
101
135
  liveRegion: liveRegion,
@@ -106,25 +140,16 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
106
140
  placement: "end",
107
141
  shouldCloseOnDocumentClick: true,
108
142
  ref: this.setTrayRef
109
- }, /*#__PURE__*/React.createElement(CloseButton, {
110
- placement: "start",
111
- offset: "x-small",
112
- onClick: this.props.closeTray,
113
- elementRef: this.setCloseRef,
114
- screenReaderLabel: t('Close')
115
- }), /*#__PURE__*/React.createElement(View, {
143
+ }, /*#__PURE__*/React.createElement(Flex, {
116
144
  as: "div",
117
- padding: "medium"
118
- }, this.state.isTruncated ? /*#__PURE__*/React.createElement(Tooltip, {
119
- placement: "start",
120
- renderTip: this.labelText(),
121
- mountNode: this.getTrayRef || null
122
- }, function (_ref) {
123
- var focused = _ref.focused;
124
- return _this2.renderName({
125
- focused: focused
126
- });
127
- }) : this.renderName(), this.renderChildren()));
145
+ direction: "column",
146
+ height: "100vh"
147
+ }, /*#__PURE__*/React.createElement(Flex.Item, {
148
+ padding: "small medium"
149
+ }, this.renderTitleAndCloseButton()), /*#__PURE__*/React.createElement(Flex.Item, {
150
+ shouldGrow: true,
151
+ padding: "0 medium"
152
+ }, this.renderChildren()), /*#__PURE__*/React.createElement(Flex.Item, null, this.renderFooter())));
128
153
  }
129
154
  }]);
130
155
  }(Component);
@@ -133,6 +158,7 @@ ModerateTray.propTypes = {
133
158
  closeTray: PropTypes.func.isRequired,
134
159
  isOpen: PropTypes.bool.isRequired,
135
160
  onClose: PropTypes.func,
161
+ onSave: PropTypes.func.isRequired,
136
162
  participantName: PropTypes.string
137
163
  };
138
164
  ModerateTray.defaultProps = {
package/lib/moderating/components/resources/ModerateTable/presenter.js CHANGED
@@ -329,8 +329,9 @@ var ModerateTable = exports.ModerateTable = (_dec = (0, _emotion.withStyle)(_sty
329
329
  return (0, _emotion.jsx)("div", {
330
330
  css: this.props.styles.page
331
331
  }, (0, _emotion.jsx)(_ModerateTray.default, {
332
- onClose: this.onCloseTray
333
- }, !this.props.anonymousGrading && (_ResetQuiz || (_ResetQuiz = (0, _emotion.jsx)(_ResetQuiz2.default, null))), this.props.children), this.renderContent());
332
+ onClose: this.onCloseTray,
333
+ onSave: this.props.onSaveTray
334
+ }, (0, _emotion.jsx)(_uiFlex.Flex.Item, null, !this.props.anonymousGrading && (_ResetQuiz || (_ResetQuiz = (0, _emotion.jsx)(_ResetQuiz2.default, null)))), this.props.children), this.renderContent());
334
335
  }
335
336
  }]);
336
337
  }(_react.Component), _ModerateTable.propTypes = {
@@ -344,6 +345,7 @@ var ModerateTable = exports.ModerateTable = (_dec = (0, _emotion.withStyle)(_sty
344
345
  onOpenTray: _propTypes.default.func,
345
346
  onResultsLinkClick: _propTypes.default.func,
346
347
  openTray: _propTypes.default.func.isRequired,
348
+ onSaveTray: _propTypes.default.func.isRequired,
347
349
  sessionTimeLimitInSeconds: _propTypes.default.number,
348
350
  hasSessionTimeLimit: _propTypes.default.bool,
349
351
  sendSessionTimeLimit: _propTypes.default.func,
package/lib/moderating/components/sidebar/ModerateTray/presenter.js CHANGED
@@ -13,11 +13,13 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
13
13
  var _react = _interopRequireWildcard(require("react"));
14
14
  var _propTypes = _interopRequireDefault(require("prop-types"));
15
15
  var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
16
+ var _uiFlex = require("@instructure/ui-flex");
16
17
  var _uiView = require("@instructure/ui-view");
17
18
  var _uiTooltip = require("@instructure/ui-tooltip");
18
19
  var _uiTray = require("@instructure/ui-tray");
19
20
  var _uiButtons = require("@instructure/ui-buttons");
20
21
  var _uiTruncateText = require("@instructure/ui-truncate-text");
22
+ var _uiModal = require("@instructure/ui-modal");
21
23
  var _quizCommon = require("@instructure/quiz-common");
22
24
  var _uiA11yContent = require("@instructure/ui-a11y-content");
23
25
  var ModerateTray = exports.ModerateTray = /*#__PURE__*/function (_Component) {
@@ -46,6 +48,38 @@ var ModerateTray = exports.ModerateTray = /*#__PURE__*/function (_Component) {
46
48
  isTruncated: false
47
49
  });
48
50
  };
51
+ _this.setCloseRef = function (el) {
52
+ return _this.closeRef = el;
53
+ };
54
+ _this.setTrayRef = function (el) {
55
+ return _this.trayRef = el;
56
+ };
57
+ _this.getTrayRef = function () {
58
+ return _this.trayRef;
59
+ };
60
+ _this.handleSave = function () {
61
+ _this.props.onSave();
62
+ _this.props.closeTray();
63
+ };
64
+ _this.renderTitleAndCloseButton = function () {
65
+ return /*#__PURE__*/_react.default.createElement(_uiFlex.Flex, null, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
66
+ shouldGrow: true,
67
+ shouldShrink: true
68
+ }, _this.state.isTruncated ? /*#__PURE__*/_react.default.createElement(_uiTooltip.Tooltip, {
69
+ placement: "start",
70
+ renderTip: _this.labelText(),
71
+ mountNode: _this.getTrayRef || null
72
+ }, function (_ref) {
73
+ var focused = _ref.focused;
74
+ return _this.renderName({
75
+ focused: focused
76
+ });
77
+ }) : _this.renderName()), /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, null, /*#__PURE__*/_react.default.createElement(_uiButtons.CloseButton, {
78
+ onClick: _this.props.closeTray,
79
+ elementRef: _this.setCloseRef,
80
+ screenReaderLabel: (0, _formatMessage.default)('Close')
81
+ })));
82
+ };
49
83
  _this.renderChildren = function () {
50
84
  return _react.default.Children.map(_this.props.children, function (child) {
51
85
  if (!child) return null;
@@ -56,14 +90,15 @@ var ModerateTray = exports.ModerateTray = /*#__PURE__*/function (_Component) {
56
90
  });
57
91
  });
58
92
  };
59
- _this.setCloseRef = function (el) {
60
- return _this.closeRef = el;
61
- };
62
- _this.setTrayRef = function (el) {
63
- return _this.trayRef = el;
64
- };
65
- _this.getTrayRef = function () {
66
- return _this.trayRef;
93
+ _this.renderFooter = function () {
94
+ return /*#__PURE__*/_react.default.createElement(_uiModal.Modal.Footer, null, /*#__PURE__*/_react.default.createElement(_uiButtons.Button, {
95
+ onClick: _this.props.closeTray,
96
+ margin: "0 x-small 0 0"
97
+ }, (0, _formatMessage.default)('Cancel')), /*#__PURE__*/_react.default.createElement(_uiButtons.Button, {
98
+ color: "primary",
99
+ type: "submit",
100
+ onClick: _this.handleSave
101
+ }, (0, _formatMessage.default)('Apply')));
67
102
  };
68
103
  return _this;
69
104
  }
@@ -103,7 +138,6 @@ var ModerateTray = exports.ModerateTray = /*#__PURE__*/function (_Component) {
103
138
  }, {
104
139
  key: "render",
105
140
  value: function render() {
106
- var _this2 = this;
107
141
  return /*#__PURE__*/_react.default.createElement(_uiTray.Tray, {
108
142
  label: this.labelText(),
109
143
  liveRegion: _quizCommon.liveRegion,
@@ -114,25 +148,16 @@ var ModerateTray = exports.ModerateTray = /*#__PURE__*/function (_Component) {
114
148
  placement: "end",
115
149
  shouldCloseOnDocumentClick: true,
116
150
  ref: this.setTrayRef
117
- }, /*#__PURE__*/_react.default.createElement(_uiButtons.CloseButton, {
118
- placement: "start",
119
- offset: "x-small",
120
- onClick: this.props.closeTray,
121
- elementRef: this.setCloseRef,
122
- screenReaderLabel: (0, _formatMessage.default)('Close')
123
- }), /*#__PURE__*/_react.default.createElement(_uiView.View, {
151
+ }, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex, {
124
152
  as: "div",
125
- padding: "medium"
126
- }, this.state.isTruncated ? /*#__PURE__*/_react.default.createElement(_uiTooltip.Tooltip, {
127
- placement: "start",
128
- renderTip: this.labelText(),
129
- mountNode: this.getTrayRef || null
130
- }, function (_ref) {
131
- var focused = _ref.focused;
132
- return _this2.renderName({
133
- focused: focused
134
- });
135
- }) : this.renderName(), this.renderChildren()));
153
+ direction: "column",
154
+ height: "100vh"
155
+ }, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
156
+ padding: "small medium"
157
+ }, this.renderTitleAndCloseButton()), /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
158
+ shouldGrow: true,
159
+ padding: "0 medium"
160
+ }, this.renderChildren()), /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, null, this.renderFooter())));
136
161
  }
137
162
  }]);
138
163
  }(_react.Component);
@@ -141,6 +166,7 @@ ModerateTray.propTypes = {
141
166
  closeTray: _propTypes.default.func.isRequired,
142
167
  isOpen: _propTypes.default.bool.isRequired,
143
168
  onClose: _propTypes.default.func,
169
+ onSave: _propTypes.default.func.isRequired,
144
170
  participantName: _propTypes.default.string
145
171
  };
146
172
  ModerateTray.defaultProps = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/quiz-core",
3
- "version": "20.17.3-rc.1+7c49355a8",
3
+ "version": "20.17.3-rc.2+e41ad88aa",
4
4
  "license": "MIT",
5
5
  "description": "The Quiz React SDK by Instructure Inc.",
6
6
  "author": "Instructure, Inc. Engineering and Product Design",
@@ -44,11 +44,11 @@
44
44
  "@instructure/emotion": "^8.51.0",
45
45
  "@instructure/grading-utils": "^1.0.0",
46
46
  "@instructure/outcomes-ui": "^3.2.2",
47
- "@instructure/quiz-common": "20.17.3-rc.1+7c49355a8",
48
- "@instructure/quiz-i18n": "20.17.3-rc.1+7c49355a8",
49
- "@instructure/quiz-interactions": "20.17.3-rc.1+7c49355a8",
50
- "@instructure/quiz-number-input": "20.17.3-rc.1+7c49355a8",
51
- "@instructure/quiz-rce": "20.17.3-rc.1+7c49355a8",
47
+ "@instructure/quiz-common": "20.17.3-rc.2+e41ad88aa",
48
+ "@instructure/quiz-i18n": "20.17.3-rc.2+e41ad88aa",
49
+ "@instructure/quiz-interactions": "20.17.3-rc.2+e41ad88aa",
50
+ "@instructure/quiz-number-input": "20.17.3-rc.2+e41ad88aa",
51
+ "@instructure/quiz-rce": "20.17.3-rc.2+e41ad88aa",
52
52
  "@instructure/ui-a11y-content": "^8.51.0",
53
53
  "@instructure/ui-alerts": "^8.51.0",
54
54
  "@instructure/ui-avatar": "^8.51.0",
@@ -111,7 +111,7 @@
111
111
  "file-saver": "~2.0.5",
112
112
  "humps": "^2.0.0",
113
113
  "immutable": "^3.8.1",
114
- "instructure-validations": "20.17.3-rc.1+7c49355a8",
114
+ "instructure-validations": "20.17.3-rc.2+e41ad88aa",
115
115
  "ipaddr.js": "^1.5.4",
116
116
  "isomorphic-fetch": "^2.2.0",
117
117
  "isuuid": "^0.1.0",
@@ -160,7 +160,7 @@
160
160
  "jquery": "^2.2.3",
161
161
  "karma-junit-reporter": "^2.0.1",
162
162
  "most-subject": "^5.3.0",
163
- "quiz-presets": "20.17.3-rc.1+7c49355a8",
163
+ "quiz-presets": "20.17.3-rc.2+e41ad88aa",
164
164
  "react": "^16.8.6",
165
165
  "react-addons-test-utils": "^15.6.2",
166
166
  "react-dom": "^16.8.6",
@@ -176,5 +176,5 @@
176
176
  "publishConfig": {
177
177
  "access": "public"
178
178
  },
179
- "gitHead": "7c49355a8b03cd20dabf480c2ba6c8c616a7eb65"
179
+ "gitHead": "e41ad88aaef2af576f53ff0e212c6d793db74bf4"
180
180
  }