@elice/material-survey 1.231227.0 → 1.240112.0-cloud.0

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 (54) hide show
  1. package/cjs/components/material-survey/MaterialSurvey.i18n.js +2 -4
  2. package/cjs/components/material-survey/MaterialSurvey.js +50 -67
  3. package/cjs/components/material-survey/MaterialSurveyInfo.js +18 -21
  4. package/cjs/components/material-survey/MaterialSurveySelectMultiple.js +74 -112
  5. package/cjs/components/material-survey/MaterialSurveySelectOne.js +71 -107
  6. package/cjs/components/material-survey/MaterialSurveyShimmer.js +19 -24
  7. package/cjs/components/material-survey/MaterialSurveyText.js +72 -110
  8. package/cjs/components/material-survey/SurveyResultBadge.js +7 -12
  9. package/cjs/components/material-survey/SurveySubmitStatusText.js +7 -10
  10. package/cjs/components/material-survey/context/MaterialSurveyContext.js +70 -110
  11. package/cjs/components/material-survey-edit/MaterialSurveyEdit.js +33 -41
  12. package/cjs/components/material-survey-edit/MaterialSurveyEditContent.js +82 -92
  13. package/cjs/components/material-survey-edit/MaterialSurveyEditOptionSelect.js +72 -76
  14. package/cjs/components/material-survey-edit/context.js +3 -9
  15. package/cjs/components/material-survey-edit/locales.js +2 -4
  16. package/cjs/components/material-survey-edit/utils/editValue.js +11 -19
  17. package/cjs/components/material-survey-edit/utils/randomId.js +0 -2
  18. package/cjs/components/shared/StyledMarkdown.js +2 -6
  19. package/cjs/components/shared/SurveyContentBox.js +54 -55
  20. package/cjs/components/shared/question-checkbox/QuestionCheckbox.js +7 -10
  21. package/cjs/components/shared/question-checkbox/QuestionCheckboxContext.js +15 -22
  22. package/cjs/components/shared/question-checkbox/QuestionCheckboxOption.js +80 -54
  23. package/cjs/components/shared/question-radio/QuestionRadio.js +7 -10
  24. package/cjs/components/shared/question-radio/QuestionRadioContext.js +15 -22
  25. package/cjs/components/shared/question-radio/QuestionRadioOption.js +71 -47
  26. package/cjs/helpers/index.js +0 -2
  27. package/cjs/index.js +7 -9
  28. package/es/components/material-survey/MaterialSurvey.i18n.js +2 -2
  29. package/es/components/material-survey/MaterialSurvey.js +39 -51
  30. package/es/components/material-survey/MaterialSurveyInfo.js +4 -3
  31. package/es/components/material-survey/MaterialSurveySelectMultiple.js +67 -101
  32. package/es/components/material-survey/MaterialSurveySelectOne.js +64 -96
  33. package/es/components/material-survey/MaterialSurveyShimmer.js +10 -10
  34. package/es/components/material-survey/MaterialSurveyText.js +67 -100
  35. package/es/components/material-survey/SurveyResultBadge.js +5 -6
  36. package/es/components/material-survey/SurveySubmitStatusText.js +4 -3
  37. package/es/components/material-survey/context/MaterialSurveyContext.js +69 -103
  38. package/es/components/material-survey-edit/MaterialSurveyEdit.js +28 -32
  39. package/es/components/material-survey-edit/MaterialSurveyEditContent.js +63 -68
  40. package/es/components/material-survey-edit/MaterialSurveyEditOptionSelect.js +67 -66
  41. package/es/components/material-survey-edit/context.js +2 -4
  42. package/es/components/material-survey-edit/locales.js +2 -2
  43. package/es/components/material-survey-edit/utils/editValue.js +11 -17
  44. package/es/components/shared/StyledMarkdown.js +1 -1
  45. package/es/components/shared/SurveyContentBox.js +51 -47
  46. package/es/components/shared/question-checkbox/QuestionCheckbox.js +5 -3
  47. package/es/components/shared/question-checkbox/QuestionCheckboxContext.js +14 -15
  48. package/es/components/shared/question-checkbox/QuestionCheckboxOption.js +76 -45
  49. package/es/components/shared/question-radio/QuestionRadio.js +5 -3
  50. package/es/components/shared/question-radio/QuestionRadioContext.js +14 -15
  51. package/es/components/shared/question-radio/QuestionRadioOption.js +67 -38
  52. package/package.json +7 -7
  53. package/cjs/_virtual/_rollupPluginBabelHelpers.js +0 -404
  54. package/es/_virtual/_rollupPluginBabelHelpers.js +0 -389
@@ -1,4 +1,3 @@
1
- import { slicedToArray as _slicedToArray, asyncToGenerator as _asyncToGenerator, regeneratorRuntime as _regeneratorRuntime } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import React from 'react';
3
2
  import { useIntl } from 'react-intl';
4
3
  import { getOrgMaterialSurveyResponseGet, getOrgMaterialSurveyResponseList, postOrgMaterialSurveyResponseAdd } from '@elice/api-client';
@@ -10,61 +9,55 @@ import { useMaterialSurveyState, useMaterialSurveyDispatch } from './context/Mat
10
9
  import SurveyResultBadge from './SurveyResultBadge.js';
11
10
  import SurveySubmitStatusText from './SurveySubmitStatusText.js';
12
11
 
13
- var StyledTextarea = styled.textarea.withConfig({
12
+ const StyledTextarea = styled.textarea.withConfig({
14
13
  componentId: "sc-16tkulg-0"
15
- })(["min-height:12rem;width:100%;padding:1rem 1.375rem;font-size:1rem;color:", ";border-radius:4px;resize:vertical;line-height:1.5rem;outline:none;background-color:", ";&::placeholder{color:", ";}&:hover{cursor:", ";}"], base.color.navy2, base.color.navy5, base.color.navy2, function (_ref) {
16
- var disabled = _ref.disabled;
17
- return disabled ? 'not-allowed' : 'text';
18
- });
19
- var MaterialSurveyText = function MaterialSurveyText() {
14
+ })(["min-height:12rem;width:100%;padding:1rem 1.375rem;font-size:1rem;color:", ";border-radius:4px;resize:vertical;line-height:1.5rem;outline:none;background-color:", ";&::placeholder{color:", ";}&:hover{cursor:", ";}"], base.color.navy2, base.color.navy5, base.color.navy2, ({
15
+ disabled
16
+ }) => disabled ? 'not-allowed' : 'text');
17
+ const MaterialSurveyText = () => {
20
18
  // context
21
- var _useMaterialSurveySta = useMaterialSurveyState(),
22
- lecture = _useMaterialSurveySta.lecture,
23
- materialSurvey = _useMaterialSurveySta.materialSurvey,
24
- userId = _useMaterialSurveySta.userId;
25
- var _useMaterialSurveyDis = useMaterialSurveyDispatch(),
26
- onSubmit = _useMaterialSurveyDis.onSubmit,
27
- onNext = _useMaterialSurveyDis.onNext,
28
- refreshOrgMaterialSurvey = _useMaterialSurveyDis.refreshOrgMaterialSurvey;
19
+ const {
20
+ lecture,
21
+ materialSurvey,
22
+ userId
23
+ } = useMaterialSurveyState();
24
+ const {
25
+ onSubmit,
26
+ onNext,
27
+ refreshOrgMaterialSurvey
28
+ } = useMaterialSurveyDispatch();
29
29
  // state
30
- var intl = useIntl();
31
- var _React$useState = React.useState(),
32
- _React$useState2 = _slicedToArray(_React$useState, 2),
33
- materialSurveyResponse = _React$useState2[0],
34
- setMaterialSurveyResponse = _React$useState2[1];
35
- var _React$useState3 = React.useState('idle'),
36
- _React$useState4 = _slicedToArray(_React$useState3, 2),
37
- submitStatus = _React$useState4[0],
38
- setSubmitStatus = _React$useState4[1];
39
- var _React$useState5 = React.useState(''),
40
- _React$useState6 = _slicedToArray(_React$useState5, 2),
41
- answer = _React$useState6[0],
42
- setAnswer = _React$useState6[1];
30
+ const intl = useIntl();
31
+ const [materialSurveyResponse, setMaterialSurveyResponse] = React.useState();
32
+ const [submitStatus, setSubmitStatus] = React.useState('idle');
33
+ const [answer, setAnswer] = React.useState('');
43
34
  // survey response fetcher
44
- React.useEffect(function () {
35
+ React.useEffect(() => {
45
36
  if (!userId && (materialSurvey === null || materialSurvey === void 0 ? void 0 : materialSurvey.lastSurveyResponseId)) {
46
- var controller = new AbortController();
47
- var signal = controller.signal;
37
+ const controller = new AbortController();
38
+ const {
39
+ signal
40
+ } = controller;
48
41
  getOrgMaterialSurveyResponseGet({
49
42
  surveyResponseId: materialSurvey.lastSurveyResponseId
50
43
  }, {
51
- signal: signal
52
- }).then(function (response) {
44
+ signal
45
+ }).then(response => {
53
46
  setMaterialSurveyResponse(response.surveyResponse);
54
47
  setAnswer(response.surveyResponse.answers[0]);
55
- }).catch(function (error) {
48
+ }).catch(error => {
56
49
  console.error(error);
57
50
  });
58
- return function () {
59
- return controller.abort();
60
- };
51
+ return () => controller.abort();
61
52
  }
62
53
  }, [materialSurvey, userId]);
63
54
  // survey response fetcher
64
- React.useEffect(function () {
55
+ React.useEffect(() => {
65
56
  if (userId && materialSurvey) {
66
- var controller = new AbortController();
67
- var signal = controller.signal;
57
+ const controller = new AbortController();
58
+ const {
59
+ signal
60
+ } = controller;
68
61
  getOrgMaterialSurveyResponseList({
69
62
  materialSurveyId: materialSurvey.id,
70
63
  filterUserIds: [userId],
@@ -73,72 +66,46 @@ var MaterialSurveyText = function MaterialSurveyText() {
73
66
  offset: 0,
74
67
  count: 1
75
68
  }, {
76
- signal: signal
77
- }).then(function (response) {
78
- var surveyResponse = response.surveyResponses[0];
69
+ signal
70
+ }).then(response => {
71
+ const surveyResponse = response.surveyResponses[0];
79
72
  setMaterialSurveyResponse(surveyResponse);
80
73
  setAnswer(typeof (surveyResponse === null || surveyResponse === void 0 ? void 0 : surveyResponse.answers[0]) === 'string' ? surveyResponse.answers[0] : '');
81
- }).catch(function (error) {
74
+ }).catch(error => {
82
75
  console.error(error);
83
76
  });
84
- return function () {
85
- return controller.abort();
86
- };
77
+ return () => controller.abort();
87
78
  }
88
79
  }, [materialSurvey, userId]);
89
80
  // submit handler
90
- var handleSubmit = /*#__PURE__*/function () {
91
- var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
92
- var _yield$postOrgMateria, surveyResponseId, _yield$getOrgMaterial, surveyResponse;
93
- return _regeneratorRuntime().wrap(function _callee$(_context) {
94
- while (1) switch (_context.prev = _context.next) {
95
- case 0:
96
- if (materialSurvey) {
97
- _context.next = 2;
98
- break;
99
- }
100
- return _context.abrupt("return");
101
- case 2:
102
- setSubmitStatus('pending');
103
- _context.prev = 3;
104
- _context.next = 6;
105
- return postOrgMaterialSurveyResponseAdd({
106
- materialSurveyId: materialSurvey.id,
107
- answers: [answer]
108
- });
109
- case 6:
110
- _yield$postOrgMateria = _context.sent;
111
- surveyResponseId = _yield$postOrgMateria.surveyResponseId;
112
- _context.next = 10;
113
- return getOrgMaterialSurveyResponseGet({
114
- surveyResponseId: surveyResponseId
115
- });
116
- case 10:
117
- _yield$getOrgMaterial = _context.sent;
118
- surveyResponse = _yield$getOrgMaterial.surveyResponse;
119
- setMaterialSurveyResponse(surveyResponse);
120
- void refreshOrgMaterialSurvey();
121
- onSubmit(true);
122
- setSubmitStatus('resolved');
123
- _context.next = 23;
124
- break;
125
- case 18:
126
- _context.prev = 18;
127
- _context.t0 = _context["catch"](3);
128
- console.error(_context.t0);
129
- onSubmit(false);
130
- setSubmitStatus('rejected');
131
- case 23:
132
- case "end":
133
- return _context.stop();
134
- }
135
- }, _callee, null, [[3, 18]]);
136
- }));
137
- return function handleSubmit() {
138
- return _ref2.apply(this, arguments);
139
- };
140
- }();
141
- var commonProps = {
81
+ const handleSubmit = async () => {
82
+ if (!materialSurvey) {
83
+ return;
84
+ }
85
+ setSubmitStatus('pending');
86
+ try {
87
+ const {
88
+ surveyResponseId
89
+ } = await postOrgMaterialSurveyResponseAdd({
90
+ materialSurveyId: materialSurvey.id,
91
+ answers: [answer]
92
+ });
93
+ const {
94
+ surveyResponse
95
+ } = await getOrgMaterialSurveyResponseGet({
96
+ surveyResponseId
97
+ });
98
+ setMaterialSurveyResponse(surveyResponse);
99
+ void refreshOrgMaterialSurvey();
100
+ onSubmit(true);
101
+ setSubmitStatus('resolved');
102
+ } catch (error) {
103
+ console.error(error);
104
+ onSubmit(false);
105
+ setSubmitStatus('rejected');
106
+ }
107
+ };
108
+ const commonProps = {
142
109
  type: 'text',
143
110
  autoFocus: answer.length === 0,
144
111
  disabled: submitStatus === 'pending' || checkUserLectureTestEnded(lecture) || !!userId,
@@ -146,7 +113,7 @@ var MaterialSurveyText = function MaterialSurveyText() {
146
113
  id: 'materialSurvey.text.placeholder'
147
114
  }),
148
115
  value: answer,
149
- onChange: function onChange(e) {
116
+ onChange: e => {
150
117
  setAnswer(e.target.value);
151
118
  }
152
119
  };
@@ -3,12 +3,11 @@ import { useIntl } from 'react-intl';
3
3
  import { BadgeNext } from '@elice/blocks';
4
4
  import { getSurveyResultStatus, SurveyResultStatus } from '../../helpers/index.js';
5
5
 
6
- var SurveyResultBadge = function SurveyResultBadge(_ref) {
7
- var materialSurveyResponse = _ref.materialSurveyResponse;
8
- var intl = useIntl();
9
- var status = React.useMemo(function () {
10
- return getSurveyResultStatus(materialSurveyResponse);
11
- }, [materialSurveyResponse]);
6
+ const SurveyResultBadge = ({
7
+ materialSurveyResponse
8
+ }) => {
9
+ const intl = useIntl();
10
+ const status = React.useMemo(() => getSurveyResultStatus(materialSurveyResponse), [materialSurveyResponse]);
12
11
  switch (status) {
13
12
  case SurveyResultStatus.Submitted:
14
13
  return React.createElement(BadgeNext, {
@@ -2,9 +2,10 @@ import React from 'react';
2
2
  import { useIntl } from 'react-intl';
3
3
  import { StatusText } from '@elice/blocks';
4
4
 
5
- var SurveySubmitStatusText = function SurveySubmitStatusText(_ref) {
6
- var status = _ref.status;
7
- var intl = useIntl();
5
+ const SurveySubmitStatusText = ({
6
+ status
7
+ }) => {
8
+ const intl = useIntl();
8
9
  switch (status) {
9
10
  case 'resolved':
10
11
  return React.createElement(StatusText, {
@@ -1,134 +1,100 @@
1
- import { slicedToArray as _slicedToArray, asyncToGenerator as _asyncToGenerator, regeneratorRuntime as _regeneratorRuntime } from '../../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import React from 'react';
3
- import { config, getOrgMaterialSurveyGet, getOrgLectureGet, getOrgCourseGet } from '@elice/api-client';
2
+ import { config, getOrgMaterialSurveyGet, getOrgCourseGet, getOrgLectureGet } from '@elice/api-client';
4
3
  import { useMaterialConfigApiClientUpdate, useMaterialFetchRaw } from '@elice/material-shared-utils';
5
4
  import { enums } from '@elice/types';
6
5
 
7
- var StateContext = React.createContext(undefined);
8
- var DispatchContext = React.createContext(undefined);
6
+ const StateContext = React.createContext(undefined);
7
+ const DispatchContext = React.createContext(undefined);
9
8
  StateContext.displayName = 'MaterialSurveyStateContext';
10
9
  DispatchContext.displayName = 'MaterialSurveyDispatchContext';
11
- function MaterialSurveyProvider(_ref) {
12
- var materialSurveyId = _ref.materialSurveyId,
13
- userId = _ref.userId,
14
- _ref$onSubmit = _ref.onSubmit,
15
- onSubmit = _ref$onSubmit === void 0 ? function () {
16
- return void 0;
17
- } : _ref$onSubmit,
18
- onNext = _ref.onNext,
19
- children = _ref.children;
20
- var _React$useState = React.useState(),
21
- _React$useState2 = _slicedToArray(_React$useState, 2),
22
- course = _React$useState2[0],
23
- setCourse = _React$useState2[1];
24
- var _React$useState3 = React.useState(),
25
- _React$useState4 = _slicedToArray(_React$useState3, 2),
26
- lecture = _React$useState4[0],
27
- setLecture = _React$useState4[1];
28
- var _React$useState5 = React.useState('idle'),
29
- _React$useState6 = _slicedToArray(_React$useState5, 2),
30
- initStatus = _React$useState6[0],
31
- setInitStatus = _React$useState6[1];
32
- var _React$useState7 = React.useState(false),
33
- _React$useState8 = _slicedToArray(_React$useState7, 2),
34
- vertical = _React$useState8[0],
35
- setVertical = _React$useState8[1];
36
- var canInit = useMaterialConfigApiClientUpdate(config.init);
37
- var _useMaterialFetchRaw = useMaterialFetchRaw(enums.LectureMaterialType.Survey, React.useCallback(function (signal) {
38
- return getOrgMaterialSurveyGet({
39
- materialSurveyId: materialSurveyId
10
+ function MaterialSurveyProvider({
11
+ materialSurveyId,
12
+ userId,
13
+ onSubmit = () => void 0,
14
+ onNext,
15
+ children
16
+ }) {
17
+ const [course, setCourse] = React.useState();
18
+ const [lecture, setLecture] = React.useState();
19
+ const [initStatus, setInitStatus] = React.useState('idle');
20
+ const [vertical, setVertical] = React.useState(false);
21
+ const canInit = useMaterialConfigApiClientUpdate(config.init);
22
+ const {
23
+ materialSurvey,
24
+ materialLecturePage,
25
+ refetch: refreshOrgMaterialSurvey
26
+ } = useMaterialFetchRaw(enums.LectureMaterialType.Survey, React.useCallback(signal => getOrgMaterialSurveyGet({
27
+ materialSurveyId
28
+ }, {
29
+ signal
30
+ }), [materialSurveyId]), canInit);
31
+ const doInitilize = React.useCallback(async () => {
32
+ const controller = new AbortController();
33
+ const {
34
+ signal
35
+ } = controller;
36
+ try {
37
+ setInitStatus('pending');
38
+ if (!materialLecturePage) {
39
+ throw new Error('materialSurvey is not ready');
40
+ }
41
+ // fetch course
42
+ const {
43
+ course
44
+ } = await getOrgCourseGet({
45
+ courseId: materialLecturePage.courseId
40
46
  }, {
41
- signal: signal
47
+ signal
42
48
  });
43
- }, [materialSurveyId]), canInit),
44
- materialSurvey = _useMaterialFetchRaw.materialSurvey,
45
- materialLecturePage = _useMaterialFetchRaw.materialLecturePage,
46
- refreshOrgMaterialSurvey = _useMaterialFetchRaw.refetch;
47
- var doInitilize = React.useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
48
- var controller, signal, _yield$getOrgCourseGe, _course, _yield$getOrgLectureG, _lecture;
49
- return _regeneratorRuntime().wrap(function _callee$(_context) {
50
- while (1) switch (_context.prev = _context.next) {
51
- case 0:
52
- controller = new AbortController();
53
- signal = controller.signal;
54
- _context.prev = 2;
55
- setInitStatus('pending');
56
- if (materialLecturePage) {
57
- _context.next = 6;
58
- break;
59
- }
60
- throw new Error('materialSurvey is not ready');
61
- case 6:
62
- _context.next = 8;
63
- return getOrgCourseGet({
64
- courseId: materialLecturePage.courseId
65
- }, {
66
- signal: signal
67
- });
68
- case 8:
69
- _yield$getOrgCourseGe = _context.sent;
70
- _course = _yield$getOrgCourseGe.course;
71
- _context.next = 12;
72
- return getOrgLectureGet({
73
- lectureId: materialLecturePage.lectureId
74
- }, {
75
- signal: signal
76
- });
77
- case 12:
78
- _yield$getOrgLectureG = _context.sent;
79
- _lecture = _yield$getOrgLectureG.lecture;
80
- setCourse(_course);
81
- setLecture(_lecture);
82
- setInitStatus('resolved');
83
- _context.next = 23;
84
- break;
85
- case 19:
86
- _context.prev = 19;
87
- _context.t0 = _context["catch"](2);
88
- console.error(_context.t0);
89
- setInitStatus('rejected');
90
- case 23:
91
- return _context.abrupt("return", function () {
92
- return controller.abort();
93
- });
94
- case 24:
95
- case "end":
96
- return _context.stop();
97
- }
98
- }, _callee, null, [[2, 19]]);
99
- })), [materialLecturePage]);
100
- React.useEffect(function () {
49
+ // fetch lecture
50
+ const {
51
+ lecture
52
+ } = await getOrgLectureGet({
53
+ lectureId: materialLecturePage.lectureId
54
+ }, {
55
+ signal
56
+ });
57
+ setCourse(course);
58
+ setLecture(lecture);
59
+ setInitStatus('resolved');
60
+ } catch (error) {
61
+ console.error(error);
62
+ setInitStatus('rejected');
63
+ }
64
+ return () => controller.abort();
65
+ }, [materialLecturePage]);
66
+ React.useEffect(() => {
101
67
  if (canInit && materialLecturePage) {
102
68
  void doInitilize();
103
69
  }
104
70
  }, [canInit, materialLecturePage, doInitilize]);
105
71
  return React.createElement(StateContext.Provider, {
106
72
  value: {
107
- course: course,
108
- lecture: lecture,
73
+ course,
74
+ lecture,
109
75
  materialSurvey: materialSurvey !== null && materialSurvey !== void 0 ? materialSurvey : undefined,
110
- userId: userId,
111
- vertical: vertical,
112
- initStatus: initStatus
76
+ userId,
77
+ vertical,
78
+ initStatus
113
79
  }
114
80
  }, React.createElement(DispatchContext.Provider, {
115
81
  value: {
116
- onSubmit: onSubmit,
117
- onNext: onNext,
118
- refreshOrgMaterialSurvey: refreshOrgMaterialSurvey,
119
- setVertical: setVertical
82
+ onSubmit,
83
+ onNext,
84
+ refreshOrgMaterialSurvey,
85
+ setVertical
120
86
  }
121
87
  }, children));
122
88
  }
123
89
  function useMaterialSurveyState() {
124
- var context = React.useContext(StateContext);
90
+ const context = React.useContext(StateContext);
125
91
  if (context === undefined) {
126
92
  throw new Error('useMaterialSurveyState must be used within a MaterialSurveyProvider');
127
93
  }
128
94
  return context;
129
95
  }
130
96
  function useMaterialSurveyDispatch() {
131
- var context = React.useContext(DispatchContext);
97
+ const context = React.useContext(DispatchContext);
132
98
  if (context === undefined) {
133
99
  throw new Error('useMaterialSurveyDispatch must be used within a MaterialSurveyProvider');
134
100
  }
@@ -8,29 +8,29 @@ import * as locales from './locales.js';
8
8
  import { en } from './locales.js';
9
9
  import MaterialSurveyEditContent from './MaterialSurveyEditContent.js';
10
10
 
11
- var MaterialSurveyEdit = forwardRef(function (_ref, ref) {
12
- var value = _ref.value,
13
- _ref$disabled = _ref.disabled,
14
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
15
- _ref$locale = _ref.locale,
16
- locale = _ref$locale === void 0 ? 'en' : _ref$locale,
17
- onChange = _ref.onChange,
18
- onFormStateChange = _ref.onFormStateChange,
19
- onFileUploadRequest = _ref.onFileUploadRequest;
20
- var formElRef = React.useRef(null);
21
- var useFormMethods = useForm({
11
+ const MaterialSurveyEdit = forwardRef(({
12
+ value,
13
+ disabled = false,
14
+ locale = 'en',
15
+ onChange,
16
+ onFormStateChange,
17
+ onFileUploadRequest
18
+ }, ref) => {
19
+ const formElRef = React.useRef(null);
20
+ const useFormMethods = useForm({
22
21
  defaultValues: manipulateValue(value),
23
22
  mode: 'onBlur'
24
23
  });
25
- var watchedMaterialSurveyEditValue = useFormMethods.watch();
26
- var _useFormMethods$formS = useFormMethods.formState,
27
- isDirty = _useFormMethods$formS.isDirty,
28
- isValid = _useFormMethods$formS.isValid;
24
+ const watchedMaterialSurveyEditValue = useFormMethods.watch();
25
+ const {
26
+ isDirty,
27
+ isValid
28
+ } = useFormMethods.formState;
29
29
  //
30
30
  // Reset from value, when `value` changes.
31
31
  // TODO: will be removed, since `CourseLecturesMaterialTemplate` removed at `elice-web`.
32
32
  //
33
- useDeepClonedCompareEffect(function () {
33
+ useDeepClonedCompareEffect(() => {
34
34
  useFormMethods.reset(manipulateValue(value), {
35
35
  keepDirty: true,
36
36
  keepErrors: true,
@@ -44,17 +44,15 @@ var MaterialSurveyEdit = forwardRef(function (_ref, ref) {
44
44
  // Emit `onChange` handler when form value changed.
45
45
  // TODO: will be removed, since `CourseLecturesMaterialTemplate` removed at `elice-web`.
46
46
  //
47
- useDeepClonedCompareEffect(function () {
48
- return onChange(restoreValue(watchedMaterialSurveyEditValue));
49
- }, [watchedMaterialSurveyEditValue]);
47
+ useDeepClonedCompareEffect(() => onChange(restoreValue(watchedMaterialSurveyEditValue)), [watchedMaterialSurveyEditValue]);
50
48
  //
51
49
  // Emit `onFormStateChange` handler when form state change.
52
50
  //
53
- React.useEffect(function () {
51
+ React.useEffect(() => {
54
52
  if (typeof onFormStateChange === 'function') {
55
53
  onFormStateChange({
56
- isDirty: isDirty,
57
- isValid: isValid
54
+ isDirty,
55
+ isValid
58
56
  });
59
57
  }
60
58
  },
@@ -63,14 +61,12 @@ var MaterialSurveyEdit = forwardRef(function (_ref, ref) {
63
61
  //
64
62
  // Set ref.
65
63
  //
66
- React.useImperativeHandle(ref, function () {
67
- return Object.assign(Object.assign({}, formElRef.current), {
68
- reset: function reset() {
69
- useFormMethods.reset(manipulateValue(value));
70
- void useFormMethods.trigger();
71
- }
72
- });
73
- }, [useFormMethods, value]);
64
+ React.useImperativeHandle(ref, () => Object.assign(Object.assign({}, formElRef.current), {
65
+ reset: () => {
66
+ useFormMethods.reset(manipulateValue(value));
67
+ void useFormMethods.trigger();
68
+ }
69
+ }), [useFormMethods, value]);
74
70
  //
75
71
  //
76
72
  //
@@ -78,8 +74,8 @@ var MaterialSurveyEdit = forwardRef(function (_ref, ref) {
78
74
  ref: formElRef
79
75
  }, React.createElement(MaterialSurveyEditContext.Provider, {
80
76
  value: {
81
- disabled: disabled,
82
- onFileUploadRequest: onFileUploadRequest
77
+ disabled,
78
+ onFileUploadRequest
83
79
  }
84
80
  }, React.createElement(IntlProvider, {
85
81
  locale: locale,