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

package/cjs/components/material-survey-edit/MaterialSurveyEditOptionSelect.js

@@ -11,37 +11,35 @@ var styled = require('styled-components');
 var randomId = require('./utils/randomId.js');
 var context = require('./context.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-var MIN_OPTION_INFO_COUNT = 2;
-var MAX_OPTION_INFO_COUNT = 20;
-var StyledWrap = styled__default["default"].div.withConfig({
+const MIN_OPTION_INFO_COUNT = 2;
+const MAX_OPTION_INFO_COUNT = 20;
+const StyledWrap = styled.div.withConfig({
   componentId: "sc-1eiyk6z-0"
 })([""]);
-var StyledInputGroup = styled__default["default"].div.withConfig({
+const StyledInputGroup = styled.div.withConfig({
   componentId: "sc-1eiyk6z-1"
 })(["width:100%;.eb-input{margin-bottom:0.5rem;&:last-of-type{margin-bottom:0;}}"]);
-var OptionSelectOne = function OptionSelectOne() {
-  var intl = reactIntl.useIntl();
-  var _useMaterialSurveyEdi = context.useMaterialSurveyEditContext(),
-    disabled = _useMaterialSurveyEdi.disabled;
-  var _useFormContext = reactHookForm.useFormContext(),
-    control = _useFormContext.control;
-  var _useFieldArray = reactHookForm.useFieldArray({
-      name: 'questionInfoList.0.optionInfo',
-      keyName: 'id',
-      shouldUnregister: true
-    }),
-    optionInfoFields = _useFieldArray.fields,
-    appendOptionInfoFieldItem = _useFieldArray.append,
-    removeOptionInfoFieldItem = _useFieldArray.remove;
+const OptionSelectOne = () => {
+  const intl = reactIntl.useIntl();
+  const {
+    disabled
+  } = context.useMaterialSurveyEditContext();
+  const {
+    control
+  } = reactHookForm.useFormContext();
+  const {
+    fields: optionInfoFields,
+    append: appendOptionInfoFieldItem,
+    remove: removeOptionInfoFieldItem
+  } = reactHookForm.useFieldArray({
+    name: 'questionInfoList.0.optionInfo',
+    keyName: 'id',
+    shouldUnregister: true
+  });
   /**
    * Append option info.
    */
-  var appendOptionInfo = function appendOptionInfo() {
+  const appendOptionInfo = () => {
     appendOptionInfoFieldItem({
       id: randomId.createRandomId(),
       value: ''
@@ -50,78 +48,76 @@ var OptionSelectOne = function OptionSelectOne() {
   /**
    * Remove item from option info at index.
    */
-  var removeOptionInfo = function removeOptionInfo(index) {
+  const removeOptionInfo = index => {
     removeOptionInfoFieldItem(index);
   };
   //
   //
   //
-  return React__default["default"].createElement(StyledWrap, null, React__default["default"].createElement(StyledInputGroup, null, optionInfoFields.map(function (_ref, index) {
-    var id = _ref.id;
-    return React__default["default"].createElement(reactHookForm.Controller, {
-      key: id,
-      control: control,
-      name: "questionInfoList.0.optionInfo.".concat(index, ".value"),
-      rules: {
-        required: {
-          value: true,
-          message: intl.formatMessage({
-            id: 'option.common.select.errorMessage.required'
-          })
-        }
-      },
-      render: function render(_ref2) {
-        var field = _ref2.field,
-          fieldState = _ref2.fieldState;
-        var _a;
-        return React__default["default"].createElement(blocks.Input, Object.assign({
-          size: "small",
-          width: "full",
-          placeholder: intl.formatMessage({
-            id: 'option.common.select.placeholder'
-          }),
-          suffix: React__default["default"].createElement(blocks.Tooltip, {
-            title: optionInfoFields.length <= MIN_OPTION_INFO_COUNT ? intl.formatMessage({
-              id: 'option.common.select.tooltip.minOptionInfoItem'
-            }) : undefined,
-            placement: "top-start"
-          }, React__default["default"].createElement("span", null, React__default["default"].createElement(blocks.IconButton, {
-            icon: icons.eilMathsignMultiplyBasic,
-            role: "grey9",
-            size: "tiny",
-            border: false,
-            transparent: true,
-            disabled: optionInfoFields.length <= MIN_OPTION_INFO_COUNT || disabled,
-            onClick: function onClick() {
-              return removeOptionInfo(index);
-            }
-          }))),
-          readOnly: disabled,
-          invalid: fieldState.invalid,
-          invalidText: (_a = fieldState.error) === null || _a === void 0 ? void 0 : _a.message
-        }, field));
+  return React.createElement(StyledWrap, null, React.createElement(StyledInputGroup, null, optionInfoFields.map(({
+    id
+  }, index) => React.createElement(reactHookForm.Controller, {
+    key: id,
+    control: control,
+    name: `questionInfoList.0.optionInfo.${index}.value`,
+    rules: {
+      required: {
+        value: true,
+        message: intl.formatMessage({
+          id: 'option.common.select.errorMessage.required'
+        })
       }
-    });
-  })), React__default["default"].createElement(blocks.Vspace, {
+    },
+    render: ({
+      field,
+      fieldState
+    }) => {
+      var _a;
+      return React.createElement(blocks.Input, Object.assign({
+        size: "small",
+        width: "full",
+        placeholder: intl.formatMessage({
+          id: 'option.common.select.placeholder'
+        }),
+        suffix: React.createElement(blocks.Tooltip, {
+          title: optionInfoFields.length <= MIN_OPTION_INFO_COUNT ? intl.formatMessage({
+            id: 'option.common.select.tooltip.minOptionInfoItem'
+          }) : undefined,
+          placement: "top-start"
+        }, React.createElement("span", null, React.createElement(blocks.IconButton, {
+          icon: icons.eilMathsignMultiplyBasic,
+          role: "grey9",
+          size: "tiny",
+          border: false,
+          transparent: true,
+          disabled: optionInfoFields.length <= MIN_OPTION_INFO_COUNT || disabled,
+          onClick: () => removeOptionInfo(index)
+        }))),
+        readOnly: disabled,
+        invalid: fieldState.invalid,
+        invalidText: (_a = fieldState.error) === null || _a === void 0 ? void 0 : _a.message
+      }, field));
+    }
+  }))), React.createElement(blocks.Vspace, {
     height: 0.5
-  }), React__default["default"].createElement(blocks.Tooltip, {
+  }), React.createElement(blocks.Tooltip, {
     title: optionInfoFields.length >= MAX_OPTION_INFO_COUNT ? intl.formatMessage({
       id: 'option.common.select.tooltip.maxOptionInfoItem'
     }) : undefined,
     placement: "bottom"
-  }, React__default["default"].createElement("span", null, React__default["default"].createElement(blocks.Button, {
+  }, React.createElement("span", null, React.createElement(blocks.Button, {
     block: true,
     size: "micro",
     borderDashed: true,
     transparent: true,
-    icon: React__default["default"].createElement(blocks.Icon, {
+    icon: React.createElement(blocks.Icon, {
       icon: icons.eilMathsignAddCircle
     }),
     disabled: optionInfoFields.length >= MAX_OPTION_INFO_COUNT || disabled,
     onClick: appendOptionInfo
-  }, React__default["default"].createElement(reactIntl.FormattedMessage, {
+  }, React.createElement(reactIntl.FormattedMessage, {
     id: "option.common.select.addButton"
   })))));
 };
 
-exports["default"] = OptionSelectOne;
+exports.default = OptionSelectOne;

package/cjs/components/material-survey-edit/context.js

@@ -4,14 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+const MaterialSurveyEditContext = React.createContext(null);
+const useMaterialSurveyEditContext = () => React.useContext(MaterialSurveyEditContext);
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-var MaterialSurveyEditContext = React__default["default"].createContext(null);
-var useMaterialSurveyEditContext = function useMaterialSurveyEditContext() {
-  return React__default["default"].useContext(MaterialSurveyEditContext);
-};
-
-exports["default"] = MaterialSurveyEditContext;
+exports.default = MaterialSurveyEditContext;
 exports.useMaterialSurveyEditContext = useMaterialSurveyEditContext;

package/cjs/components/material-survey-edit/locales.js

@@ -1,8 +1,6 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var en = {
+const en = {
   'common.option': 'Option {number}',
   'common.errorMessage.range': 'Please enter within {min} ~ {max} characters.',
   'content.title': 'Question',
@@ -21,7 +19,7 @@ var en = {
   'option.common.select.tooltip.maxOptionInfoItem': 'You cannot enter more than 20 options.',
   'option.common.select.addButton': 'Add Option'
 };
-var ko = {
+const ko = {
   'common.option': '옵션 {number}',
   'common.errorMessage.range': '{min} ~ {max}자 이내로 입력해주세요.',
   'content.title': '질문',

package/cjs/components/material-survey-edit/utils/editValue.js

@@ -1,7 +1,5 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var randomId = require('./randomId.js');
 
 /**
@@ -9,18 +7,14 @@ var randomId = require('./randomId.js');
  */
 function manipulateValue(v) {
   return Object.assign(Object.assign({}, v), {
-    questionInfoList: v.questionInfoList.map(function (questionInfo) {
-      return Object.assign(Object.assign({}, questionInfo), {
-        // convert string array to object array
-        // - ref: https://github.com/react-hook-form/react-hook-form/issues/7622#issuecomment-1018893318
-        optionInfo: Array.isArray(questionInfo.optionInfo) ? questionInfo.optionInfo.map(function (option) {
-          return {
-            id: randomId.createRandomId(),
-            value: option
-          };
-        }) : []
-      });
-    })
+    questionInfoList: v.questionInfoList.map(questionInfo => Object.assign(Object.assign({}, questionInfo), {
+      // convert string array to object array
+      // - ref: https://github.com/react-hook-form/react-hook-form/issues/7622#issuecomment-1018893318
+      optionInfo: Array.isArray(questionInfo.optionInfo) ? questionInfo.optionInfo.map(option => ({
+        id: randomId.createRandomId(),
+        value: option
+      })) : []
+    }))
   });
 }
 /**
@@ -28,12 +22,10 @@ function manipulateValue(v) {
  */
 function restoreValue(v) {
   return Object.assign(Object.assign({}, v), {
-    questionInfoList: v.questionInfoList.map(function (questionInfo) {
+    questionInfoList: v.questionInfoList.map(questionInfo => {
       var _a;
-      var newQuestionInfo = Object.assign(Object.assign({}, questionInfo), {
-        optionInfo: ((_a = questionInfo.optionInfo) === null || _a === void 0 ? void 0 : _a.length) ? questionInfo.optionInfo.map(function (option) {
-          return option.value;
-        }) : null
+      const newQuestionInfo = Object.assign(Object.assign({}, questionInfo), {
+        optionInfo: ((_a = questionInfo.optionInfo) === null || _a === void 0 ? void 0 : _a.length) ? questionInfo.optionInfo.map(option => option.value) : null
       });
       if (!newQuestionInfo.optionInfo) {
         delete newQuestionInfo.optionInfo;

package/cjs/components/material-survey-edit/utils/randomId.js

@@ -1,7 +1,5 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 /**
  * Create random ID.
  */

package/cjs/components/shared/StyledMarkdown.js

@@ -5,12 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var markdown = require('@elice/markdown');
 var styled = require('styled-components');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-var StyledMarkdown = styled__default["default"](markdown.Markdown).withConfig({
+const StyledMarkdown = styled(markdown.Markdown).withConfig({
   componentId: "sc-h8kc9g-0"
 })(["p{margin:0 !important;}"]);
 
-exports["default"] = StyledMarkdown;
+exports.default = StyledMarkdown;

package/cjs/components/shared/SurveyContentBox.js

@@ -10,77 +10,76 @@ var designTokens = require('@elice/design-tokens');
 var styled = require('styled-components');
 var MaterialSurveyContext = require('../material-survey/context/MaterialSurveyContext.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-var StyledQuestionBox = styled__default["default"].div.withConfig({
+const StyledQuestionBox = styled.div.withConfig({
   componentId: "sc-h8ztvr-0"
-})(["display:flex;flex-direction:column;border-radius:", ";overflow:hidden;width:100%;max-height:", ";min-height:", ";"], function (_ref) {
-  var vertical = _ref.vertical;
-  return vertical ? '0' : '8px';
-}, function (_ref2) {
-  var hasFooter = _ref2.hasFooter;
-  return hasFooter ? '100%' : '';
-}, function (_ref3) {
-  var hasFooter = _ref3.hasFooter;
-  return hasFooter ? '' : '100%';
-});
-var StyledQuestionBoxHeader = styled__default["default"].div.withConfig({
+})(["display:flex;flex-direction:column;border-radius:", ";overflow:hidden;width:100%;max-height:", ";min-height:", ";"], ({
+  vertical
+}) => vertical ? '0' : '8px', ({
+  hasFooter
+}) => hasFooter ? '100%' : '', ({
+  hasFooter
+}) => hasFooter ? '' : '100%');
+const StyledQuestionBoxHeader = styled.div.withConfig({
   componentId: "sc-h8ztvr-1"
 })(["display:flex;justify-content:space-between;background-color:", ";padding:1rem 1.5rem;flex:none;height:3.5rem;"], designTokens.base.color.navy6);
-var StyledQuestionBoxBody = styled__default["default"].div.withConfig({
+const StyledQuestionBoxBody = styled.div.withConfig({
   componentId: "sc-h8ztvr-2"
-})(["padding:1.5rem;background-color:", ";flex:auto;", "})"], designTokens.base.color.navy7, function (_ref4) {
-  var hasFooter = _ref4.hasFooter;
-  return hasFooter ? 'height: 100%; overflow-y: auto;' : '';
-});
-var StyledQuestionBoxFooter = styled__default["default"].div.withConfig({
+})(["padding:1.5rem;background-color:", ";flex:auto;", "})"], designTokens.base.color.navy7, ({
+  hasFooter
+}) => hasFooter ? 'height: 100%; overflow-y: auto;' : '');
+const StyledQuestionBoxFooter = styled.div.withConfig({
   componentId: "sc-h8ztvr-3"
-})(["flex:none;display:flex;justify-content:space-between;align-items:center;padding:0.75rem 1.5rem;background-color:", ";", ""], designTokens.base.color.navy6, function (_ref5) {
-  var vertical = _ref5.vertical;
-  return vertical ? "\n          flex-direction: column;\n          align-items: flex-start;\n        " : '';
+})(["flex:none;display:flex;justify-content:space-between;align-items:center;padding:0.75rem 1.5rem;background-color:", ";", ""], designTokens.base.color.navy6, ({
+  vertical
+}) => {
+  return vertical ? `
+          flex-direction: column;
+          align-items: flex-start;
+        ` : '';
 });
-var StyledQuestionBoxFooterActions = styled__default["default"].div.withConfig({
+const StyledQuestionBoxFooterActions = styled.div.withConfig({
   componentId: "sc-h8ztvr-4"
 })(["display:flex;> *:not(:last-child){margin-right:0.75rem;}"]);
-var StyledQuestionBoxFooterStatus = styled__default["default"].div.withConfig({
+const StyledQuestionBoxFooterStatus = styled.div.withConfig({
   componentId: "sc-h8ztvr-5"
-})(["margin-left:0.75rem;", ""], function (_ref6) {
-  var vertical = _ref6.vertical;
-  return vertical ? "\n          margin-left: 0;\n          margin-top: 0.75rem;\n        " : '';
+})(["margin-left:0.75rem;", ""], ({
+  vertical
+}) => {
+  return vertical ? `
+          margin-left: 0;
+          margin-top: 0.75rem;
+        ` : '';
 });
-var SurveyContentBox = function SurveyContentBox(_a) {
-  var children = _a.children,
-    _a$footerActions = _a.footerActions,
-    footerActions = _a$footerActions === void 0 ? [] : _a$footerActions,
-    title = _a.title,
-    submitResult = _a.submitResult,
-    submitStatus = _a.submitStatus,
-    onNext = _a.onNext,
+const SurveyContentBox = _a => {
+  var {
+      children,
+      footerActions = [],
+      title,
+      submitResult,
+      submitStatus,
+      onNext
+    } = _a,
     props = tslib.__rest(_a, ["children", "footerActions", "title", "submitResult", "submitStatus", "onNext"]);
-  var intl = reactIntl.useIntl();
-  var _useMaterialSurveySta = MaterialSurveyContext.useMaterialSurveyState(),
-    vertical = _useMaterialSurveySta.vertical;
-  var hasFooter = footerActions.length > 0;
-  var header = React__default["default"].createElement(StyledQuestionBoxHeader, null, React__default["default"].createElement(blocks.Text, {
+  const intl = reactIntl.useIntl();
+  const {
+    vertical
+  } = MaterialSurveyContext.useMaterialSurveyState();
+  const hasFooter = footerActions.length > 0;
+  const header = React.createElement(StyledQuestionBoxHeader, null, React.createElement(blocks.Text, {
     bold: true,
     customStyles: {
       color: designTokens.base.color.navy0
     }
   }, title), submitResult ? submitResult : null);
-  var body = React__default["default"].createElement(StyledQuestionBoxBody, {
+  const body = React.createElement(StyledQuestionBoxBody, {
     hasFooter: hasFooter
   }, children);
-  var footer = React__default["default"].createElement(StyledQuestionBoxFooter, {
+  const footer = React.createElement(StyledQuestionBoxFooter, {
     vertical: vertical
-  }, React__default["default"].createElement(StyledQuestionBoxFooterActions, null, footerActions.map(function (action, index) {
-    return React__default["default"].createElement(blocks.Button, Object.assign({
-      key: index,
-      size: "small"
-    }, action), action.children);
-  }), typeof onNext === 'function' ? React__default["default"].createElement(blocks.Button, {
+  }, React.createElement(StyledQuestionBoxFooterActions, null, footerActions.map((action, index) => React.createElement(blocks.Button, Object.assign({
+    key: index,
+    size: "small"
+  }, action), action.children)), typeof onNext === 'function' ? React.createElement(blocks.Button, {
     size: "small",
     border: true,
     tabIndex: 0,
@@ -89,14 +88,14 @@ var SurveyContentBox = function SurveyContentBox(_a) {
     onClick: onNext
   }, intl.formatMessage({
     id: 'materialSurvey.next'
-  })) : null), React__default["default"].createElement(StyledQuestionBoxFooterStatus, {
+  })) : null), React.createElement(StyledQuestionBoxFooterStatus, {
     vertical: vertical
   }, submitStatus));
-  return React__default["default"].createElement(StyledQuestionBox, Object.assign({}, props, {
+  return React.createElement(StyledQuestionBox, Object.assign({}, props, {
     vertical: vertical,
     hasFooter: hasFooter
   }), header, body, footerActions.length > 0 ? footer : null);
 };
 
 exports.StyledQuestionBox = StyledQuestionBox;
-exports["default"] = SurveyContentBox;
+exports.default = SurveyContentBox;

package/cjs/components/shared/question-checkbox/QuestionCheckbox.js

@@ -7,18 +7,15 @@ var React = require('react');
 var styled = require('styled-components');
 var QuestionCheckboxContext = require('./QuestionCheckboxContext.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-var StyledQuestionCheckbox = styled__default["default"].div.withConfig({
+const StyledQuestionCheckbox = styled.div.withConfig({
   componentId: "sc-1ovh9lp-0"
 })(["display:flex;flex-direction:column;"]);
-var QuestionCheckbox = function QuestionCheckbox(_a) {
-  var children = _a.children,
+const QuestionCheckbox = _a => {
+  var {
+      children
+    } = _a,
     props = tslib.__rest(_a, ["children"]);
-  return React__default["default"].createElement(QuestionCheckboxContext.QuestionCheckboxContextProvider, Object.assign({}, props), React__default["default"].createElement(StyledQuestionCheckbox, null, children));
+  return React.createElement(QuestionCheckboxContext.QuestionCheckboxContextProvider, Object.assign({}, props), React.createElement(StyledQuestionCheckbox, null, children));
 };
 
-exports["default"] = QuestionCheckbox;
+exports.default = QuestionCheckbox;

package/cjs/components/shared/question-checkbox/QuestionCheckboxContext.js

@@ -1,35 +1,28 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var React = require('react');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-var QuestionCheckboxContext = React__default["default"].createContext(undefined);
+const QuestionCheckboxContext = React.createContext(undefined);
 QuestionCheckboxContext.displayName = 'QuestionCheckboxContext';
-function QuestionCheckboxContextProvider(_ref) {
-  var selectedOptions = _ref.selectedOptions,
-    onSelect = _ref.onSelect,
-    disabled = _ref.disabled,
-    children = _ref.children;
+function QuestionCheckboxContextProvider({
+  selectedOptions,
+  onSelect,
+  disabled,
+  children
+}) {
   // eslint-disable-next-line react-hooks/exhaustive-deps
-  var onSelectValue = React__default["default"].useCallback(onSelect, []);
-  var value = React__default["default"].useMemo(function () {
-    return {
-      selectedOptions: selectedOptions,
-      disabled: disabled,
-      onSelect: onSelectValue
-    };
-  }, [selectedOptions, disabled, onSelectValue]);
-  return React__default["default"].createElement(QuestionCheckboxContext.Provider, {
+  const onSelectValue = React.useCallback(onSelect, []);
+  const value = React.useMemo(() => ({
+    selectedOptions,
+    disabled,
+    onSelect: onSelectValue
+  }), [selectedOptions, disabled, onSelectValue]);
+  return React.createElement(QuestionCheckboxContext.Provider, {
     value: value
   }, children);
 }
 function useQuestionCheckboxContext() {
-  var context = React__default["default"].useContext(QuestionCheckboxContext);
+  const context = React.useContext(QuestionCheckboxContext);
   if (context === undefined) {
     throw new Error('useQuestionCheckboxContext must be used within a QuestionCheckboxContextProvider');
   }