@elice/material-quiz 1.240718.0-trasncript.2 → 1.240718.1

package/cjs/components/material-quiz-edit/options/options-group/OptionGroupGroupInfo.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
 var reactHookForm = require('react-hook-form');
 var reactSortableHoc = require('react-sortable-hoc');
 var blocks = require('@elice/blocks');
@@ -14,55 +14,53 @@ var context = require('../../context.js');
 var randomId = require('../../utils/randomId.js');
 var OptionGroupGroupListItem = require('./OptionGroupGroupListItem.js');
 
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
-
-var cloneDeep__default = /*#__PURE__*/_interopDefaultCompat(cloneDeep);
-var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
-
-var MAX_GROUP_INFO_COUNT = 6;
-var StyledSortableList = styled__default.default.div.withConfig({
+const MAX_GROUP_INFO_COUNT = 6;
+const StyledSortableList = styled.div.withConfig({
   componentId: "sc-9aq3yn-0"
 })(["margin:1rem 0;padding:0;"]);
 //
 //
 //
-var OptionGroupGroupInfo = function OptionGroupGroupInfo() {
-  var intl$1 = intl.useRawEliceIntl();
-  var _useFormContext = reactHookForm.useFormContext(),
-    control = _useFormContext.control,
-    setValue = _useFormContext.setValue;
-  var _useMaterialQuizEditC = context.useMaterialQuizEditContext(),
-    disabled = _useMaterialQuizEditC.disabled;
-  var _useFieldArray = reactHookForm.useFieldArray({
-      name: 'groups',
-      keyName: 'id',
-      shouldUnregister: true
-    }),
-    groupInfoFields = _useFieldArray.fields,
-    appendGroupInfoFieldItem = _useFieldArray.append,
-    removeGroupInfoFieldItem = _useFieldArray.remove;
-  var watchedGroups = reactHookForm.useWatch({
-    control: control,
+const OptionGroupGroupInfo = () => {
+  const intl$1 = intl.useRawEliceIntl();
+  const {
+    control,
+    setValue
+  } = reactHookForm.useFormContext();
+  const {
+    disabled
+  } = context.useMaterialQuizEditContext();
+  const {
+    fields: groupInfoFields,
+    append: appendGroupInfoFieldItem,
+    remove: removeGroupInfoFieldItem
+  } = reactHookForm.useFieldArray({
+    name: 'groups',
+    keyName: 'id',
+    shouldUnregister: true
+  });
+  const watchedGroups = reactHookForm.useWatch({
+    control,
     name: 'groups'
   });
-  var watchedAnswerInfo = reactHookForm.useWatch({
-    control: control,
+  const watchedAnswerInfo = reactHookForm.useWatch({
+    control,
     name: 'answerInfoDefault'
   });
-  var isMaximumGroups = groupInfoFields.length >= MAX_GROUP_INFO_COUNT;
+  const isMaximumGroups = groupInfoFields.length >= MAX_GROUP_INFO_COUNT;
   /**
    *
    */
-  var addGroupAnswerInfo = function addGroupAnswerInfo() {
-    var cloneAnswerList = cloneDeep__default.default(watchedAnswerInfo);
+  const addGroupAnswerInfo = () => {
+    const cloneAnswerList = cloneDeep(watchedAnswerInfo);
     cloneAnswerList[groupInfoFields.length] = [];
     setValue('answerInfoDefault', cloneAnswerList);
   };
   /**
    *
    */
-  var removeGroupAnswerInfo = function removeGroupAnswerInfo(index) {
-    var cloneAnswerList = cloneDeep__default.default(watchedAnswerInfo);
+  const removeGroupAnswerInfo = index => {
+    const cloneAnswerList = cloneDeep(watchedAnswerInfo);
     cloneAnswerList.splice(index, 1);
     setValue('answerInfoDefault', cloneAnswerList.filter(Boolean));
     removeGroupInfoFieldItem(Number(index));
@@ -70,11 +68,12 @@ var OptionGroupGroupInfo = function OptionGroupGroupInfo() {
   /**
    *
    */
-  var onSortEnd = function onSortEnd(_ref) {
-    var oldIndex = _ref.oldIndex,
-      newIndex = _ref.newIndex;
-    var cloneAnswerList = cloneDeep__default.default(watchedAnswerInfo);
-    var temp = cloneAnswerList[oldIndex];
+  const onSortEnd = ({
+    oldIndex,
+    newIndex
+  }) => {
+    const cloneAnswerList = cloneDeep(watchedAnswerInfo);
+    const temp = cloneAnswerList[oldIndex];
     cloneAnswerList[oldIndex] = cloneAnswerList[newIndex];
     cloneAnswerList[newIndex] = temp;
     setValue('groups', reactSortableHoc.arrayMove(watchedGroups, oldIndex, newIndex), {
@@ -85,69 +84,57 @@ var OptionGroupGroupInfo = function OptionGroupGroupInfo() {
   /**
    *
    */
-  var renderGroupOptionList = function renderGroupOptionList() {
-    return jsxRuntime.jsx(blocks.SortableListGroup, {
+  const renderGroupOptionList = () => {
+    return React.createElement(blocks.SortableListGroup, {
       onSortEnd: onSortEnd,
-      useDragHandle: true,
-      children: jsxRuntime.jsx(StyledSortableList, {
-        children: groupInfoFields.map(function (group, index) {
-          return jsxRuntime.jsx(OptionGroupGroupListItem.default, {
-            disabled: disabled,
-            groupId: index,
-            groupsCount: groupInfoFields.length,
-            onRemoveOption: function onRemoveOption() {
-              return removeGroupAnswerInfo(index);
-            }
-          }, group.id);
-        })
-      })
-    });
+      useDragHandle: true
+    }, React.createElement(StyledSortableList, null, groupInfoFields.map((group, index) => React.createElement(OptionGroupGroupListItem.default, {
+      key: group.id,
+      disabled: disabled,
+      groupId: index,
+      groupsCount: groupInfoFields.length,
+      onRemoveOption: () => removeGroupAnswerInfo(index)
+    }))));
   };
   /**
    *
    */
-  var renderGroupOptionAddButton = function renderGroupOptionAddButton() {
-    return jsxRuntime.jsx(blocks.Tooltip, {
+  const renderGroupOptionAddButton = () => {
+    return React.createElement(blocks.Tooltip, {
       title: isMaximumGroups ? intl$1.formatMessage({
         id: 'group.option.tooltip.maxDisabled'
       }) : undefined,
-      placement: "top",
-      children: jsxRuntime.jsx("span", {
-        children: jsxRuntime.jsx(blocks.Button, {
-          borderDashed: true,
-          block: true,
-          transparent: true,
-          icon: jsxRuntime.jsx(blocks.Icon, {
-            icon: icons.eilMathsignAddBasic
-          }),
-          disabled: isMaximumGroups || disabled,
-          onClick: function onClick() {
-            appendGroupInfoFieldItem({
-              id: randomId.createRandomId(),
-              group: ''
-            });
-            addGroupAnswerInfo();
-          },
-          children: intl$1.formatMessage({
-            id: 'group.option.addButton'
-          })
-        })
-      })
-    });
+      placement: "top"
+    }, React.createElement("span", null, React.createElement(blocks.Button, {
+      borderDashed: true,
+      block: true,
+      transparent: true,
+      icon: React.createElement(blocks.Icon, {
+        icon: icons.eilMathsignAddBasic
+      }),
+      disabled: isMaximumGroups || disabled,
+      onClick: () => {
+        appendGroupInfoFieldItem({
+          id: randomId.createRandomId(),
+          group: ''
+        });
+        addGroupAnswerInfo();
+      }
+    }, intl$1.formatMessage({
+      id: 'group.option.addButton'
+    }))));
   };
   //
   //
   //
-  return jsxRuntime.jsxs(blocks.Flex, {
-    column: true,
-    children: [jsxRuntime.jsx(blocks.Text, {
-      size: "small",
-      bold: true,
-      children: intl$1.formatMessage({
-        id: 'group.option.title'
-      })
-    }), renderGroupOptionList(), renderGroupOptionAddButton()]
-  });
+  return React.createElement(blocks.Flex, {
+    column: true
+  }, React.createElement(blocks.Text, {
+    size: "small",
+    bold: true
+  }, intl$1.formatMessage({
+    id: 'group.option.title'
+  })), renderGroupOptionList(), renderGroupOptionAddButton());
 };
 
 exports.default = OptionGroupGroupInfo;

package/cjs/components/material-quiz-edit/options/options-group/OptionGroupGroupListItem.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
 var reactHookForm = require('react-hook-form');
 var blocks = require('@elice/blocks');
 var designTokens = require('@elice/design-tokens');
@@ -11,142 +11,126 @@ var intl = require('@elice/intl');
 var trim = require('lodash-es/trim');
 var styled = require('styled-components');
 
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
-
-var trim__default = /*#__PURE__*/_interopDefaultCompat(trim);
-var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
-
-var SHEET_Z_INDEX = 982;
-var MIN_GROUP_INFO_COUNT = 2;
-var StyledSortableListItem = styled__default.default(blocks.SortableListItem).withConfig({
+const SHEET_Z_INDEX = 982;
+const MIN_GROUP_INFO_COUNT = 2;
+const StyledSortableListItem = styled(blocks.SortableListItem).withConfig({
   componentId: "sc-hj5nic-0"
 })(["display:flex;z-index:", ";width:100%;padding:0;background:transparent;box-shadow:none;&:not(:last-child){margin-bottom:0.5rem;}"], SHEET_Z_INDEX + 1);
-var StyledSortableListItemOptionWrapper = styled__default.default.div.withConfig({
+const StyledSortableListItemOptionWrapper = styled.div.withConfig({
   componentId: "sc-hj5nic-1"
-})(["display:flex;align-items:center;overflow:hidden;width:100%;height:100%;border-radius:4px;border:1px solid ", ";background:", ";"], function (_ref) {
-  var isGroupChildAnswer = _ref.isGroupChildAnswer;
-  return isGroupChildAnswer ? designTokens.base.color.red8 : designTokens.base.color.gray3;
-}, designTokens.base.color.white);
-var StyledInputGroup = styled__default.default(blocks.Input).withConfig({
+})(["display:flex;align-items:center;overflow:hidden;width:100%;height:100%;border-radius:4px;border:1px solid ", ";background:", ";"], ({
+  isGroupChildAnswer
+}) => isGroupChildAnswer ? designTokens.base.color.red8 : designTokens.base.color.gray3, designTokens.base.color.white);
+const StyledInputGroup = styled(blocks.Input).withConfig({
   componentId: "sc-hj5nic-2"
 })(["& > div{border:0;}"]);
-var OptionGroupGroupListItem = function OptionGroupGroupListItem(_ref2) {
-  var disabled = _ref2.disabled,
-    groupId = _ref2.groupId,
-    groupsCount = _ref2.groupsCount,
-    onRemoveOption = _ref2.onRemoveOption;
+const OptionGroupGroupListItem = ({
+  disabled,
+  groupId,
+  groupsCount,
+  onRemoveOption
+}) => {
   var _a, _b, _c, _d, _e;
-  var intl$1 = intl.useRawEliceIntl();
-  var _useFormContext = reactHookForm.useFormContext(),
-    control = _useFormContext.control,
-    formState = _useFormContext.formState;
-  var watchedAnswerInfo = reactHookForm.useWatch({
-    control: control,
+  const intl$1 = intl.useRawEliceIntl();
+  const {
+    control,
+    formState
+  } = reactHookForm.useFormContext();
+  const watchedAnswerInfo = reactHookForm.useWatch({
+    control,
     name: 'answerInfoDefault'
   });
-  var isGroupChildAnswer = Boolean((_a = watchedAnswerInfo[groupId]) === null || _a === void 0 ? void 0 : _a.length);
-  var isMinimumGroups = groupsCount <= MIN_GROUP_INFO_COUNT;
-  var errorMessage = (_e = (_d = (_c = (_b = formState.errors) === null || _b === void 0 ? void 0 : _b.groups) === null || _c === void 0 ? void 0 : _c[groupId]) === null || _d === void 0 ? void 0 : _d.group) === null || _e === void 0 ? void 0 : _e.message;
+  const isGroupChildAnswer = Boolean((_a = watchedAnswerInfo[groupId]) === null || _a === void 0 ? void 0 : _a.length);
+  const isMinimumGroups = groupsCount <= MIN_GROUP_INFO_COUNT;
+  const errorMessage = (_e = (_d = (_c = (_b = formState.errors) === null || _b === void 0 ? void 0 : _b.groups) === null || _c === void 0 ? void 0 : _c[groupId]) === null || _d === void 0 ? void 0 : _d.group) === null || _e === void 0 ? void 0 : _e.message;
   /**
    *
    */
-  var renderOptionGroupInput = function renderOptionGroupInput() {
-    return jsxRuntime.jsx(StyledSortableListItemOptionWrapper, {
-      isGroupChildAnswer: !isGroupChildAnswer,
-      children: jsxRuntime.jsx(reactHookForm.Controller, {
-        control: control,
-        name: "groups.".concat(groupId, ".group"),
-        rules: {
-          required: {
-            value: true,
-            message: intl$1.formatMessage({
+  const renderOptionGroupInput = () => {
+    return React.createElement(StyledSortableListItemOptionWrapper, {
+      isGroupChildAnswer: !isGroupChildAnswer
+    }, React.createElement(reactHookForm.Controller, {
+      control: control,
+      name: `groups.${groupId}.group`,
+      rules: {
+        required: {
+          value: true,
+          message: intl$1.formatMessage({
+            id: 'group.option.errorMessage.required'
+          })
+        },
+        validate: e => {
+          if (!trim(e).length) {
+            return intl$1.formatMessage({
               id: 'group.option.errorMessage.required'
-            })
-          },
-          validate: function validate(e) {
-            if (!trim__default.default(e).length) {
-              return intl$1.formatMessage({
-                id: 'group.option.errorMessage.required'
-              });
-            }
-            if (!isGroupChildAnswer) {
-              return intl$1.formatMessage({
-                id: 'group.option.errorMessage.notChild'
-              });
-            }
+            });
+          }
+          if (!isGroupChildAnswer) {
+            return intl$1.formatMessage({
+              id: 'group.option.errorMessage.notChild'
+            });
           }
-        },
-        render: function render(_ref3) {
-          var field = _ref3.field,
-            fieldState = _ref3.fieldState;
-          return jsxRuntime.jsx(StyledInputGroup, Object.assign({
-            invalid: fieldState.invalid || !isGroupChildAnswer,
-            width: "full",
-            disabled: disabled
-          }, field, {
-            ref: null
-          }));
         }
-      })
-    });
+      },
+      render: ({
+        field,
+        fieldState
+      }) => React.createElement(StyledInputGroup, Object.assign({
+        invalid: fieldState.invalid || !isGroupChildAnswer,
+        width: "full",
+        disabled: disabled
+      }, field, {
+        ref: null
+      }))
+    }));
   };
   /**
    *
    */
-  var renderOptionRemoveButton = function renderOptionRemoveButton() {
-    return jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [jsxRuntime.jsx(blocks.Hspace, {
-        width: 0.5
-      }), jsxRuntime.jsx(blocks.Tooltip, {
-        title: isMinimumGroups ? intl$1.formatMessage({
-          id: 'group.option.tooltip.minDisabled'
-        }) : undefined,
-        placement: "top",
-        children: jsxRuntime.jsx("span", {
-          children: jsxRuntime.jsx(blocks.IconButton, {
-            transparent: true,
-            icon: icons.eilMathsignMultiplyBasic,
-            role: "gray6",
-            size: "micro",
-            border: false,
-            disabled: isMinimumGroups || disabled,
-            onClick: onRemoveOption
-          })
-        })
-      })]
-    });
+  const renderOptionRemoveButton = () => {
+    return React.createElement(React.Fragment, null, React.createElement(blocks.Hspace, {
+      width: 0.5
+    }), React.createElement(blocks.Tooltip, {
+      title: isMinimumGroups ? intl$1.formatMessage({
+        id: 'group.option.tooltip.minDisabled'
+      }) : undefined,
+      placement: "top"
+    }, React.createElement("span", null, React.createElement(blocks.IconButton, {
+      transparent: true,
+      icon: icons.eilMathsignMultiplyBasic,
+      role: "gray6",
+      size: "micro",
+      border: false,
+      disabled: isMinimumGroups || disabled,
+      onClick: onRemoveOption
+    }))));
   };
   /**
    *
    */
-  var renderErrorMessage = function renderErrorMessage() {
+  const renderErrorMessage = () => {
     if (!errorMessage) {
       return null;
     }
-    return jsxRuntime.jsx(blocks.Flex, {
-      paddingleft: "0.25rem",
-      children: jsxRuntime.jsx(blocks.Text, {
-        size: "small",
-        role: "danger",
-        children: errorMessage
-      })
-    });
+    return React.createElement(blocks.Flex, {
+      paddingleft: "0.25rem"
+    }, React.createElement(blocks.Text, {
+      size: "small",
+      role: "danger"
+    }, errorMessage));
   };
   //
   //
   //
-  return jsxRuntime.jsx(StyledSortableListItem, {
-    index: groupId,
-    children: jsxRuntime.jsxs(blocks.Flex, {
-      justify: "center",
-      width: "100%",
-      column: true,
-      children: [jsxRuntime.jsxs(blocks.Flex, {
-        align: "center",
-        children: [renderOptionGroupInput(), renderOptionRemoveButton()]
-      }), renderErrorMessage()]
-    })
-  });
+  return React.createElement(StyledSortableListItem, {
+    index: groupId
+  }, React.createElement(blocks.Flex, {
+    justify: "center",
+    width: "100%",
+    column: true
+  }, React.createElement(blocks.Flex, {
+    align: "center"
+  }, renderOptionGroupInput(), renderOptionRemoveButton()), renderErrorMessage()));
 };
 
 exports.default = OptionGroupGroupListItem;

package/cjs/components/material-quiz-edit/utils/checkTwoDimensionArray.js

@@ -2,11 +2,7 @@
 
 function checkTwoDimensionArray(answerInfo) {
   try {
-    return answerInfo.every(function (i) {
-      return i.every(function (j) {
-        return typeof j === 'number';
-      });
-    });
+    return answerInfo.every(i => i.every(j => typeof j === 'number'));
   } catch (_a) {
     return false;
   }

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

@@ -3,10 +3,6 @@
 var trim = require('lodash-es/trim');
 var randomId = require('./randomId.js');
 
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
-
-var trim__default = /*#__PURE__*/_interopDefaultCompat(trim);
-
 /**
  *
  */
@@ -14,7 +10,7 @@ function manipulateValue(v) {
   return Object.assign(Object.assign({}, v), {
     // convert string array to object array
     // - ref: https://github.com/react-hook-form/react-hook-form/issues/7622#issuecomment-1018893318
-    optionsDefault: Array.isArray(v.optionsDefault) ? v.optionsDefault.map(function (option) {
+    optionsDefault: Array.isArray(v.optionsDefault) ? v.optionsDefault.map(option => {
       var _a, _b;
       return {
         id: randomId.createRandomId(),
@@ -22,12 +18,10 @@ function manipulateValue(v) {
         content: (_b = option === null || option === void 0 ? void 0 : option.content) !== null && _b !== void 0 ? _b : ''
       };
     }) : [],
-    groups: Array.isArray(v.groups) ? v.groups.map(function (group) {
-      return {
-        id: randomId.createRandomId(),
-        group: group
-      };
-    }) : []
+    groups: Array.isArray(v.groups) ? v.groups.map(group => ({
+      id: randomId.createRandomId(),
+      group
+    })) : []
   });
 }
 /**
@@ -35,17 +29,14 @@ function manipulateValue(v) {
  */
 function restoreValue(v) {
   return Object.assign(Object.assign({}, v), {
-    optionsDefault: v.optionsDefault.length ? v.optionsDefault.map(function (option) {
-      return {
-        title: trim__default.default(option.title),
-        content: option.content
-      };
-    }) : null,
+    optionsDefault: v.optionsDefault.length ? v.optionsDefault.map(option => ({
+      title: trim(option.title),
+      content: option.content
+    })) : null,
     answerInfoDefault: Array.isArray(v.answerInfoDefault) || typeof v.answerInfoDefault === 'string' ? v.answerInfoDefault : undefined,
-    groups: v.groups.length ? v.groups.map(function (_ref) {
-      var group = _ref.group;
-      return trim__default.default(group);
-    }) : null
+    groups: v.groups.length ? v.groups.map(({
+      group
+    }) => trim(group)) : null
   });
 }