@elice/material-survey 1.230328.0 → 1.230418.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/_virtual/_rollupPluginBabelHelpers.js +409 -0
  2. package/cjs/components/material-survey/MaterialSurvey.i18n.js +2 -2
  3. package/cjs/components/material-survey/MaterialSurvey.js +56 -51
  4. package/cjs/components/material-survey/MaterialSurveyInfo.js +6 -5
  5. package/cjs/components/material-survey/MaterialSurveySelectMultiple.js +117 -91
  6. package/cjs/components/material-survey/MaterialSurveySelectOne.js +110 -81
  7. package/cjs/components/material-survey/MaterialSurveyShimmer.js +13 -12
  8. package/cjs/components/material-survey/MaterialSurveyText.js +111 -80
  9. package/cjs/components/material-survey/SurveyResultBadge.js +9 -8
  10. package/cjs/components/material-survey/SurveySubmitStatusText.js +6 -8
  11. package/cjs/components/material-survey/context/MaterialSurveyContext.js +102 -79
  12. package/cjs/components/material-survey-edit/MaterialSurveyEdit.js +45 -38
  13. package/cjs/components/material-survey-edit/MaterialSurveyEditContent.js +79 -83
  14. package/cjs/components/material-survey-edit/MaterialSurveyEditOptionSelect.js +71 -76
  15. package/cjs/components/material-survey-edit/context.js +4 -2
  16. package/cjs/components/material-survey-edit/locales.js +2 -2
  17. package/cjs/components/material-survey-edit/utils/editValue.js +17 -16
  18. package/cjs/components/shared/StyledMarkdown.js +4 -2
  19. package/cjs/components/shared/SurveyContentBox.js +48 -54
  20. package/cjs/components/shared/question-checkbox/QuestionCheckbox.js +7 -9
  21. package/cjs/components/shared/question-checkbox/QuestionCheckboxContext.js +15 -18
  22. package/cjs/components/shared/question-checkbox/QuestionCheckboxOption.js +48 -103
  23. package/cjs/components/shared/question-radio/QuestionRadio.js +7 -9
  24. package/cjs/components/shared/question-radio/QuestionRadioContext.js +15 -18
  25. package/cjs/components/shared/question-radio/QuestionRadioOption.js +41 -87
  26. package/cjs/helpers/index.js +0 -3
  27. package/cjs/index.js +7 -7
  28. package/es/_virtual/_rollupPluginBabelHelpers.js +394 -0
  29. package/es/components/material-survey/MaterialSurvey.i18n.js +2 -2
  30. package/es/components/material-survey/MaterialSurvey.js +51 -46
  31. package/es/components/material-survey/MaterialSurveyInfo.js +3 -4
  32. package/es/components/material-survey/MaterialSurveySelectMultiple.js +109 -85
  33. package/es/components/material-survey/MaterialSurveySelectOne.js +102 -75
  34. package/es/components/material-survey/MaterialSurveyShimmer.js +10 -11
  35. package/es/components/material-survey/MaterialSurveyText.js +106 -77
  36. package/es/components/material-survey/SurveyResultBadge.js +6 -7
  37. package/es/components/material-survey/SurveySubmitStatusText.js +3 -7
  38. package/es/components/material-survey/context/MaterialSurveyContext.js +103 -80
  39. package/es/components/material-survey-edit/MaterialSurveyEdit.js +41 -36
  40. package/es/components/material-survey-edit/MaterialSurveyEditContent.js +75 -81
  41. package/es/components/material-survey-edit/MaterialSurveyEditOptionSelect.js +68 -75
  42. package/es/components/material-survey-edit/context.js +4 -2
  43. package/es/components/material-survey-edit/locales.js +2 -2
  44. package/es/components/material-survey-edit/utils/editValue.js +17 -16
  45. package/es/components/shared/StyledMarkdown.js +1 -1
  46. package/es/components/shared/SurveyContentBox.js +48 -54
  47. package/es/components/shared/question-checkbox/QuestionCheckbox.js +4 -8
  48. package/es/components/shared/question-checkbox/QuestionCheckboxContext.js +15 -18
  49. package/es/components/shared/question-checkbox/QuestionCheckboxOption.js +45 -102
  50. package/es/components/shared/question-radio/QuestionRadio.js +4 -8
  51. package/es/components/shared/question-radio/QuestionRadioContext.js +15 -18
  52. package/es/components/shared/question-radio/QuestionRadioOption.js +38 -86
  53. package/es/helpers/index.js +0 -3
  54. package/package.json +8 -8
@@ -1,3 +1,4 @@
1
+ import { slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
1
2
  import React from 'react';
2
3
  import { useFormContext, Controller } from 'react-hook-form';
3
4
  import { useIntl, FormattedMessage } from 'react-intl';
@@ -9,33 +10,34 @@ import { createRandomId } from './utils/randomId.js';
9
10
  import { useMaterialSurveyEditContext } from './context.js';
10
11
  import OptionSelectOne from './MaterialSurveyEditOptionSelect.js';
11
12
 
12
- const MIN_TEXT_LENGTH = 1;
13
- const MAX_TEXT_LENGTH = 128;
14
- const StyledSurveyOptionTypeSelectWrap = styled.div.withConfig({
13
+ var MIN_TEXT_LENGTH = 1;
14
+ var MAX_TEXT_LENGTH = 128;
15
+ var StyledSurveyOptionTypeSelectWrap = styled.div.withConfig({
15
16
  componentId: "sc-r4ms68-0"
16
17
  })(["display:flex;max-width:12rem;"]);
17
-
18
- const MaterialSurveyEditContent = () => {
19
- const intl = useIntl();
20
- const {
21
- disabled,
22
- onFileUploadRequest
23
- } = useMaterialSurveyEditContext();
24
- const {
25
- control,
26
- watch,
27
- setValue
28
- } = useFormContext();
29
- const [watchedOptionType, watchedOptionInfo] = watch(['questionInfoList.0.optionType', 'questionInfoList.0.optionInfo']); //
18
+ var MaterialSurveyEditContent = function MaterialSurveyEditContent() {
19
+ var intl = useIntl();
20
+ var _useMaterialSurveyEdi = useMaterialSurveyEditContext(),
21
+ disabled = _useMaterialSurveyEdi.disabled,
22
+ onFileUploadRequest = _useMaterialSurveyEdi.onFileUploadRequest;
23
+ var _useFormContext = useFormContext(),
24
+ control = _useFormContext.control,
25
+ watch = _useFormContext.watch,
26
+ setValue = _useFormContext.setValue;
27
+ var _watch = watch(['questionInfoList.0.optionType', 'questionInfoList.0.optionInfo']),
28
+ _watch2 = _slicedToArray(_watch, 2),
29
+ watchedOptionType = _watch2[0],
30
+ watchedOptionInfo = _watch2[1];
31
+ //
30
32
  // Change `optionInfo` according to `optionType`.
31
33
  //
32
-
33
- React.useEffect(() => {
34
- const get = () => {
34
+ React.useEffect(function () {
35
+ var get = function get() {
35
36
  switch (watchedOptionType) {
36
37
  case enums.SurveyOptionType.SelectOne:
37
38
  case enums.SurveyOptionType.SelectMultiple:
38
- return watchedOptionInfo.length > 0 ? watchedOptionInfo : // add default option info
39
+ return watchedOptionInfo.length > 0 ? watchedOptionInfo :
40
+ // add default option info
39
41
  [{
40
42
  id: createRandomId(),
41
43
  value: intl.formatMessage({
@@ -51,29 +53,25 @@ const MaterialSurveyEditContent = () => {
51
53
  number: 2
52
54
  })
53
55
  }];
54
-
55
56
  case enums.SurveyOptionType.Text:
56
57
  return [];
57
-
58
58
  default:
59
59
  return [];
60
60
  }
61
61
  };
62
-
63
62
  setValue('questionInfoList.0.optionInfo', get());
64
- }, // eslint-disable-next-line react-hooks/exhaustive-deps
63
+ },
64
+ // eslint-disable-next-line react-hooks/exhaustive-deps
65
65
  [watchedOptionType, setValue, intl]);
66
66
  /**
67
67
  * Input of option info and answer info,
68
68
  * according to option type.
69
69
  */
70
-
71
- const Option = React.useMemo(() => {
70
+ var Option = React.useMemo(function () {
72
71
  switch (watchedOptionType) {
73
72
  case enums.SurveyOptionType.SelectOne:
74
73
  case enums.SurveyOptionType.SelectMultiple:
75
74
  return OptionSelectOne;
76
-
77
75
  case enums.SurveyOptionType.Text:
78
76
  default:
79
77
  return React.Fragment;
@@ -82,8 +80,7 @@ const MaterialSurveyEditContent = () => {
82
80
  /**
83
81
  * Render input for survey title.
84
82
  */
85
-
86
- const renderQuestionTitleInput = () => {
83
+ var renderQuestionTitleInput = function renderQuestionTitleInput() {
87
84
  return React.createElement(FormInputVerticalLayout, {
88
85
  label: React.createElement(Label, {
89
86
  size: "small",
@@ -120,12 +117,10 @@ const MaterialSurveyEditContent = () => {
120
117
  })
121
118
  }
122
119
  },
123
- render: ({
124
- field,
125
- fieldState
126
- }) => {
120
+ render: function render(_ref) {
121
+ var field = _ref.field,
122
+ fieldState = _ref.fieldState;
127
123
  var _a;
128
-
129
124
  return React.createElement(Input, Object.assign({
130
125
  size: "small",
131
126
  width: "full",
@@ -144,9 +139,7 @@ const MaterialSurveyEditContent = () => {
144
139
  /**
145
140
  * Render input for survey description.
146
141
  */
147
-
148
-
149
- const renderQuestionDescriptionInput = () => {
142
+ var renderQuestionDescriptionInput = function renderQuestionDescriptionInput() {
150
143
  return React.createElement(FormInputVerticalLayout, {
151
144
  label: React.createElement(Label, {
152
145
  size: "small"
@@ -156,24 +149,23 @@ const MaterialSurveyEditContent = () => {
156
149
  input: React.createElement(Controller, {
157
150
  control: control,
158
151
  name: "questionInfoList.0.questionDescription",
159
- render: ({
160
- field
161
- }) => React.createElement(MarkdownEditor, Object.assign({
162
- enableFooter: true,
163
- placeholder: intl.formatMessage({
164
- id: 'content.description.placeholder'
165
- }),
166
- onFileUploadRequest: onFileUploadRequest
167
- }, field))
152
+ render: function render(_ref2) {
153
+ var field = _ref2.field;
154
+ return React.createElement(MarkdownEditor, Object.assign({
155
+ enableFooter: true,
156
+ placeholder: intl.formatMessage({
157
+ id: 'content.description.placeholder'
158
+ }),
159
+ onFileUploadRequest: onFileUploadRequest
160
+ }, field));
161
+ }
168
162
  })
169
163
  });
170
164
  };
171
165
  /**
172
166
  * Render input of option type, option info and answer info.
173
167
  */
174
-
175
-
176
- const renderOptionInput = () => {
168
+ var renderOptionInput = function renderOptionInput() {
177
169
  return React.createElement(FormInputVerticalLayout, {
178
170
  label: React.createElement(Label, {
179
171
  size: "small",
@@ -184,44 +176,46 @@ const MaterialSurveyEditContent = () => {
184
176
  input: React.createElement(React.Fragment, null, React.createElement(Controller, {
185
177
  control: control,
186
178
  name: "questionInfoList.0.optionType",
187
- render: ({
188
- field
189
- }) => React.createElement(Tooltip, {
190
- title: disabled ? intl.formatMessage({
191
- id: 'content.option.tooltip.disabled'
192
- }) : undefined,
193
- placement: "top-end"
194
- }, React.createElement(StyledSurveyOptionTypeSelectWrap, null, React.createElement(Select, Object.assign({
195
- size: "small",
196
- width: "small",
197
- readOnly: disabled
198
- }, field, {
199
- onChange: v => field.onChange(Number(v))
200
- }), React.createElement("option", {
201
- value: enums.SurveyOptionType.SelectOne,
202
- children: intl.formatMessage({
203
- id: 'content.option.select.items.selectOne'
204
- })
205
- }), React.createElement("option", {
206
- value: enums.SurveyOptionType.SelectMultiple,
207
- children: intl.formatMessage({
208
- id: 'content.option.select.items.selectMultiple'
209
- })
210
- }), React.createElement("option", {
211
- value: enums.SurveyOptionType.Text,
212
- children: intl.formatMessage({
213
- id: 'content.option.select.items.text'
214
- })
215
- }))))
179
+ render: function render(_ref3) {
180
+ var field = _ref3.field;
181
+ return React.createElement(Tooltip, {
182
+ title: disabled ? intl.formatMessage({
183
+ id: 'content.option.tooltip.disabled'
184
+ }) : undefined,
185
+ placement: "top-end"
186
+ }, React.createElement(StyledSurveyOptionTypeSelectWrap, null, React.createElement(Select, Object.assign({
187
+ size: "small",
188
+ width: "small",
189
+ readOnly: disabled
190
+ }, field, {
191
+ onChange: function onChange(v) {
192
+ return field.onChange(Number(v));
193
+ }
194
+ }), React.createElement("option", {
195
+ value: enums.SurveyOptionType.SelectOne,
196
+ children: intl.formatMessage({
197
+ id: 'content.option.select.items.selectOne'
198
+ })
199
+ }), React.createElement("option", {
200
+ value: enums.SurveyOptionType.SelectMultiple,
201
+ children: intl.formatMessage({
202
+ id: 'content.option.select.items.selectMultiple'
203
+ })
204
+ }), React.createElement("option", {
205
+ value: enums.SurveyOptionType.Text,
206
+ children: intl.formatMessage({
207
+ id: 'content.option.select.items.text'
208
+ })
209
+ }))));
210
+ }
216
211
  }), React.createElement(Vspace, {
217
212
  height: 0.5
218
213
  }), React.createElement(Option, null))
219
214
  });
220
- }; //
215
+ };
216
+ //
221
217
  //
222
218
  //
223
-
224
-
225
219
  return React.createElement(React.Fragment, null, renderQuestionTitleInput(), renderQuestionDescriptionInput(), renderOptionInput());
226
220
  };
227
221
 
@@ -7,37 +7,32 @@ import styled from 'styled-components';
7
7
  import { createRandomId } from './utils/randomId.js';
8
8
  import { useMaterialSurveyEditContext } from './context.js';
9
9
 
10
- const MIN_OPTION_INFO_COUNT = 2;
11
- const MAX_OPTION_INFO_COUNT = 20;
12
- const StyledWrap = styled.div.withConfig({
10
+ var MIN_OPTION_INFO_COUNT = 2;
11
+ var MAX_OPTION_INFO_COUNT = 20;
12
+ var StyledWrap = styled.div.withConfig({
13
13
  componentId: "sc-1eiyk6z-0"
14
14
  })([""]);
15
- const StyledInputGroup = styled.div.withConfig({
15
+ var StyledInputGroup = styled.div.withConfig({
16
16
  componentId: "sc-1eiyk6z-1"
17
17
  })(["width:100%;.eb-input{margin-bottom:0.5rem;&:last-of-type{margin-bottom:0;}}"]);
18
-
19
- const OptionSelectOne = () => {
20
- const intl = useIntl();
21
- const {
22
- disabled
23
- } = useMaterialSurveyEditContext();
24
- const {
25
- control
26
- } = useFormContext();
27
- const {
28
- fields: optionInfoFields,
29
- append: appendOptionInfoFieldItem,
30
- remove: removeOptionInfoFieldItem
31
- } = useFieldArray({
32
- name: 'questionInfoList.0.optionInfo',
33
- keyName: 'id',
34
- shouldUnregister: true
35
- });
18
+ var OptionSelectOne = function OptionSelectOne() {
19
+ var intl = useIntl();
20
+ var _useMaterialSurveyEdi = useMaterialSurveyEditContext(),
21
+ disabled = _useMaterialSurveyEdi.disabled;
22
+ var _useFormContext = useFormContext(),
23
+ control = _useFormContext.control;
24
+ var _useFieldArray = useFieldArray({
25
+ name: 'questionInfoList.0.optionInfo',
26
+ keyName: 'id',
27
+ shouldUnregister: true
28
+ }),
29
+ optionInfoFields = _useFieldArray.fields,
30
+ appendOptionInfoFieldItem = _useFieldArray.append,
31
+ removeOptionInfoFieldItem = _useFieldArray.remove;
36
32
  /**
37
33
  * Append option info.
38
34
  */
39
-
40
- const appendOptionInfo = () => {
35
+ var appendOptionInfo = function appendOptionInfo() {
41
36
  appendOptionInfoFieldItem({
42
37
  id: createRandomId(),
43
38
  value: ''
@@ -46,61 +41,59 @@ const OptionSelectOne = () => {
46
41
  /**
47
42
  * Remove item from option info at index.
48
43
  */
49
-
50
-
51
- const removeOptionInfo = index => {
44
+ var removeOptionInfo = function removeOptionInfo(index) {
52
45
  removeOptionInfoFieldItem(index);
53
- }; //
46
+ };
54
47
  //
55
48
  //
56
-
57
-
58
- return React.createElement(StyledWrap, null, React.createElement(StyledInputGroup, null, optionInfoFields.map(({
59
- id
60
- }, index) => React.createElement(Controller, {
61
- key: id,
62
- control: control,
63
- name: `questionInfoList.0.optionInfo.${index}.value`,
64
- rules: {
65
- required: {
66
- value: true,
67
- message: intl.formatMessage({
68
- id: 'option.common.select.errorMessage.required'
69
- })
49
+ //
50
+ return React.createElement(StyledWrap, null, React.createElement(StyledInputGroup, null, optionInfoFields.map(function (_ref, index) {
51
+ var id = _ref.id;
52
+ return React.createElement(Controller, {
53
+ key: id,
54
+ control: control,
55
+ name: "questionInfoList.0.optionInfo.".concat(index, ".value"),
56
+ rules: {
57
+ required: {
58
+ value: true,
59
+ message: intl.formatMessage({
60
+ id: 'option.common.select.errorMessage.required'
61
+ })
62
+ }
63
+ },
64
+ render: function render(_ref2) {
65
+ var field = _ref2.field,
66
+ fieldState = _ref2.fieldState;
67
+ var _a;
68
+ return React.createElement(Input, Object.assign({
69
+ size: "small",
70
+ width: "full",
71
+ placeholder: intl.formatMessage({
72
+ id: 'option.common.select.placeholder'
73
+ }),
74
+ suffix: React.createElement(Tooltip, {
75
+ title: optionInfoFields.length <= MIN_OPTION_INFO_COUNT ? intl.formatMessage({
76
+ id: 'option.common.select.tooltip.minOptionInfoItem'
77
+ }) : undefined,
78
+ placement: "top-start"
79
+ }, React.createElement("span", null, React.createElement(IconButton, {
80
+ icon: eilMathsignMultiplyBasic,
81
+ role: "grey9",
82
+ size: "tiny",
83
+ border: false,
84
+ transparent: true,
85
+ disabled: optionInfoFields.length <= MIN_OPTION_INFO_COUNT || disabled,
86
+ onClick: function onClick() {
87
+ return removeOptionInfo(index);
88
+ }
89
+ }))),
90
+ readOnly: disabled,
91
+ invalid: fieldState.invalid,
92
+ invalidText: (_a = fieldState.error) === null || _a === void 0 ? void 0 : _a.message
93
+ }, field));
70
94
  }
71
- },
72
- render: ({
73
- field,
74
- fieldState
75
- }) => {
76
- var _a;
77
-
78
- return React.createElement(Input, Object.assign({
79
- size: "small",
80
- width: "full",
81
- placeholder: intl.formatMessage({
82
- id: 'option.common.select.placeholder'
83
- }),
84
- suffix: React.createElement(Tooltip, {
85
- title: optionInfoFields.length <= MIN_OPTION_INFO_COUNT ? intl.formatMessage({
86
- id: 'option.common.select.tooltip.minOptionInfoItem'
87
- }) : undefined,
88
- placement: "top-start"
89
- }, React.createElement("span", null, React.createElement(IconButton, {
90
- icon: eilMathsignMultiplyBasic,
91
- role: "grey9",
92
- size: "tiny",
93
- border: false,
94
- transparent: true,
95
- disabled: optionInfoFields.length <= MIN_OPTION_INFO_COUNT || disabled,
96
- onClick: () => removeOptionInfo(index)
97
- }))),
98
- readOnly: disabled,
99
- invalid: fieldState.invalid,
100
- invalidText: (_a = fieldState.error) === null || _a === void 0 ? void 0 : _a.message
101
- }, field));
102
- }
103
- }))), React.createElement(Vspace, {
95
+ });
96
+ })), React.createElement(Vspace, {
104
97
  height: 0.5
105
98
  }), React.createElement(Tooltip, {
106
99
  title: optionInfoFields.length >= MAX_OPTION_INFO_COUNT ? intl.formatMessage({
@@ -1,6 +1,8 @@
1
1
  import React from 'react';
2
2
 
3
- const MaterialSurveyEditContext = React.createContext(null);
4
- const useMaterialSurveyEditContext = () => React.useContext(MaterialSurveyEditContext);
3
+ var MaterialSurveyEditContext = React.createContext(null);
4
+ var useMaterialSurveyEditContext = function useMaterialSurveyEditContext() {
5
+ return React.useContext(MaterialSurveyEditContext);
6
+ };
5
7
 
6
8
  export { MaterialSurveyEditContext as default, useMaterialSurveyEditContext };
@@ -1,4 +1,4 @@
1
- const en = {
1
+ var en = {
2
2
  'common.option': '옵션 {number}',
3
3
  'common.errorMessage.range': '{min} ~ {max}자 이내로 입력해주세요.',
4
4
  'content.title': '질문',
@@ -17,7 +17,7 @@ const en = {
17
17
  'option.common.select.tooltip.maxOptionInfoItem': '선택지는 20개 초과하여 입력할 수 없습니다.',
18
18
  'option.common.select.addButton': '보기 추가'
19
19
  };
20
- const ko = {
20
+ var ko = {
21
21
  'common.option': '옵션 {number}',
22
22
  'common.errorMessage.range': '{min} ~ {max}자 이내로 입력해주세요.',
23
23
  'content.title': '질문',
@@ -3,36 +3,37 @@ import { createRandomId } from './randomId.js';
3
3
  /**
4
4
  *
5
5
  */
6
-
7
6
  function manipulateValue(v) {
8
7
  return Object.assign(Object.assign({}, v), {
9
- questionInfoList: v.questionInfoList.map(questionInfo => Object.assign(Object.assign({}, questionInfo), {
10
- // convert string array to object array
11
- // - ref: https://github.com/react-hook-form/react-hook-form/issues/7622#issuecomment-1018893318
12
- optionInfo: Array.isArray(questionInfo.optionInfo) ? questionInfo.optionInfo.map(option => ({
13
- id: createRandomId(),
14
- value: option
15
- })) : []
16
- }))
8
+ questionInfoList: v.questionInfoList.map(function (questionInfo) {
9
+ return Object.assign(Object.assign({}, questionInfo), {
10
+ // convert string array to object array
11
+ // - ref: https://github.com/react-hook-form/react-hook-form/issues/7622#issuecomment-1018893318
12
+ optionInfo: Array.isArray(questionInfo.optionInfo) ? questionInfo.optionInfo.map(function (option) {
13
+ return {
14
+ id: createRandomId(),
15
+ value: option
16
+ };
17
+ }) : []
18
+ });
19
+ })
17
20
  });
18
21
  }
19
22
  /**
20
23
  * Restore manipulation from `manipulateValue()`.
21
24
  */
22
-
23
25
  function restoreValue(v) {
24
26
  return Object.assign(Object.assign({}, v), {
25
- questionInfoList: v.questionInfoList.map(questionInfo => {
27
+ questionInfoList: v.questionInfoList.map(function (questionInfo) {
26
28
  var _a;
27
-
28
- const newQuestionInfo = Object.assign(Object.assign({}, questionInfo), {
29
- optionInfo: ((_a = questionInfo.optionInfo) === null || _a === void 0 ? void 0 : _a.length) ? questionInfo.optionInfo.map(option => option.value) : null
29
+ var newQuestionInfo = Object.assign(Object.assign({}, questionInfo), {
30
+ optionInfo: ((_a = questionInfo.optionInfo) === null || _a === void 0 ? void 0 : _a.length) ? questionInfo.optionInfo.map(function (option) {
31
+ return option.value;
32
+ }) : null
30
33
  });
31
-
32
34
  if (!newQuestionInfo.optionInfo) {
33
35
  delete newQuestionInfo.optionInfo;
34
36
  }
35
-
36
37
  return newQuestionInfo;
37
38
  })
38
39
  });
@@ -1,7 +1,7 @@
1
1
  import { Markdown } from '@elice/markdown';
2
2
  import styled from 'styled-components';
3
3
 
4
- const StyledMarkdown = styled(Markdown).withConfig({
4
+ var StyledMarkdown = styled(Markdown).withConfig({
5
5
  componentId: "sc-h8kc9g-0"
6
6
  })(["p{margin:0 !important;}"]);
7
7
 
@@ -6,78 +6,72 @@ import { base } from '@elice/design-tokens';
6
6
  import styled from 'styled-components';
7
7
  import { useMaterialSurveyState } from '../material-survey/context/MaterialSurveyContext.js';
8
8
 
9
- const StyledQuestionBox = styled.div.withConfig({
9
+ var StyledQuestionBox = styled.div.withConfig({
10
10
  componentId: "sc-h8ztvr-0"
11
- })(["display:flex;flex-direction:column;border-radius:", ";overflow:hidden;width:100%;max-height:", ";min-height:", ";"], ({
12
- vertical
13
- }) => vertical ? '0' : '8px', ({
14
- hasFooter
15
- }) => hasFooter ? '100%' : '', ({
16
- hasFooter
17
- }) => hasFooter ? '' : '100%');
18
- const StyledQuestionBoxHeader = styled.div.withConfig({
11
+ })(["display:flex;flex-direction:column;border-radius:", ";overflow:hidden;width:100%;max-height:", ";min-height:", ";"], function (_ref) {
12
+ var vertical = _ref.vertical;
13
+ return vertical ? '0' : '8px';
14
+ }, function (_ref2) {
15
+ var hasFooter = _ref2.hasFooter;
16
+ return hasFooter ? '100%' : '';
17
+ }, function (_ref3) {
18
+ var hasFooter = _ref3.hasFooter;
19
+ return hasFooter ? '' : '100%';
20
+ });
21
+ var StyledQuestionBoxHeader = styled.div.withConfig({
19
22
  componentId: "sc-h8ztvr-1"
20
23
  })(["display:flex;justify-content:space-between;background-color:", ";padding:1rem 1.5rem;flex:none;height:3.5rem;"], base.color.navy6);
21
- const StyledQuestionBoxBody = styled.div.withConfig({
24
+ var StyledQuestionBoxBody = styled.div.withConfig({
22
25
  componentId: "sc-h8ztvr-2"
23
- })(["padding:1.5rem;background-color:", ";flex:auto;", "})"], base.color.navy7, ({
24
- hasFooter
25
- }) => hasFooter ? 'height: 100%; overflow-y: auto;' : '');
26
- const StyledQuestionBoxFooter = styled.div.withConfig({
26
+ })(["padding:1.5rem;background-color:", ";flex:auto;", "})"], base.color.navy7, function (_ref4) {
27
+ var hasFooter = _ref4.hasFooter;
28
+ return hasFooter ? 'height: 100%; overflow-y: auto;' : '';
29
+ });
30
+ var StyledQuestionBoxFooter = styled.div.withConfig({
27
31
  componentId: "sc-h8ztvr-3"
28
- })(["flex:none;display:flex;justify-content:space-between;align-items:center;padding:0.75rem 1.5rem;background-color:", ";", ""], base.color.navy6, ({
29
- vertical
30
- }) => {
31
- return vertical ? `
32
- flex-direction: column;
33
- align-items: flex-start;
34
- ` : '';
32
+ })(["flex:none;display:flex;justify-content:space-between;align-items:center;padding:0.75rem 1.5rem;background-color:", ";", ""], base.color.navy6, function (_ref5) {
33
+ var vertical = _ref5.vertical;
34
+ return vertical ? "\n flex-direction: column;\n align-items: flex-start;\n " : '';
35
35
  });
36
- const StyledQuestionBoxFooterActions = styled.div.withConfig({
36
+ var StyledQuestionBoxFooterActions = styled.div.withConfig({
37
37
  componentId: "sc-h8ztvr-4"
38
38
  })(["display:flex;> *:not(:last-child){margin-right:0.75rem;}"]);
39
- const StyledQuestionBoxFooterStatus = styled.div.withConfig({
39
+ var StyledQuestionBoxFooterStatus = styled.div.withConfig({
40
40
  componentId: "sc-h8ztvr-5"
41
- })(["margin-left:0.75rem;", ""], ({
42
- vertical
43
- }) => {
44
- return vertical ? `
45
- margin-left: 0;
46
- margin-top: 0.75rem;
47
- ` : '';
41
+ })(["margin-left:0.75rem;", ""], function (_ref6) {
42
+ var vertical = _ref6.vertical;
43
+ return vertical ? "\n margin-left: 0;\n margin-top: 0.75rem;\n " : '';
48
44
  });
49
-
50
- const SurveyContentBox = _a => {
51
- var {
52
- children,
53
- footerActions = [],
54
- title,
55
- submitResult,
56
- submitStatus,
57
- onNext
58
- } = _a,
59
- props = __rest(_a, ["children", "footerActions", "title", "submitResult", "submitStatus", "onNext"]);
60
-
61
- const intl = useIntl();
62
- const {
63
- vertical
64
- } = useMaterialSurveyState();
65
- const hasFooter = footerActions.length > 0;
66
- const header = React.createElement(StyledQuestionBoxHeader, null, React.createElement(Text, {
45
+ var SurveyContentBox = function SurveyContentBox(_a) {
46
+ var children = _a.children,
47
+ _a$footerActions = _a.footerActions,
48
+ footerActions = _a$footerActions === void 0 ? [] : _a$footerActions,
49
+ title = _a.title,
50
+ submitResult = _a.submitResult,
51
+ submitStatus = _a.submitStatus,
52
+ onNext = _a.onNext,
53
+ props = __rest(_a, ["children", "footerActions", "title", "submitResult", "submitStatus", "onNext"]);
54
+ var intl = useIntl();
55
+ var _useMaterialSurveySta = useMaterialSurveyState(),
56
+ vertical = _useMaterialSurveySta.vertical;
57
+ var hasFooter = footerActions.length > 0;
58
+ var header = React.createElement(StyledQuestionBoxHeader, null, React.createElement(Text, {
67
59
  bold: true,
68
60
  customStyles: {
69
61
  color: base.color.navy0
70
62
  }
71
63
  }, title), submitResult ? submitResult : null);
72
- const body = React.createElement(StyledQuestionBoxBody, {
64
+ var body = React.createElement(StyledQuestionBoxBody, {
73
65
  hasFooter: hasFooter
74
66
  }, children);
75
- const footer = React.createElement(StyledQuestionBoxFooter, {
67
+ var footer = React.createElement(StyledQuestionBoxFooter, {
76
68
  vertical: vertical
77
- }, React.createElement(StyledQuestionBoxFooterActions, null, footerActions.map((action, index) => React.createElement(Button, Object.assign({
78
- key: index,
79
- size: "small"
80
- }, action), action.children)), typeof onNext === 'function' ? React.createElement(Button, {
69
+ }, React.createElement(StyledQuestionBoxFooterActions, null, footerActions.map(function (action, index) {
70
+ return React.createElement(Button, Object.assign({
71
+ key: index,
72
+ size: "small"
73
+ }, action), action.children);
74
+ }), typeof onNext === 'function' ? React.createElement(Button, {
81
75
  size: "small",
82
76
  border: true,
83
77
  tabIndex: 0,
@@ -3,16 +3,12 @@ import React from 'react';
3
3
  import styled from 'styled-components';
4
4
  import { QuestionCheckboxContextProvider } from './QuestionCheckboxContext.js';
5
5
 
6
- const StyledQuestionCheckbox = styled.div.withConfig({
6
+ var StyledQuestionCheckbox = styled.div.withConfig({
7
7
  componentId: "sc-1ovh9lp-0"
8
8
  })(["display:flex;flex-direction:column;"]);
9
-
10
- const QuestionCheckbox = _a => {
11
- var {
12
- children
13
- } = _a,
14
- props = __rest(_a, ["children"]);
15
-
9
+ var QuestionCheckbox = function QuestionCheckbox(_a) {
10
+ var children = _a.children,
11
+ props = __rest(_a, ["children"]);
16
12
  return React.createElement(QuestionCheckboxContextProvider, Object.assign({}, props), React.createElement(StyledQuestionCheckbox, null, children));
17
13
  };
18
14