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

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
 var reactHookForm = require('react-hook-form');
 var reactSortableHoc = require('react-sortable-hoc');
 var blocks = require('@elice/blocks');
@@ -14,53 +14,55 @@ var context = require('../../context.js');
 var randomId = require('../../utils/randomId.js');
 var OptionGroupGroupListItem = require('./OptionGroupGroupListItem.js');
 
-const MAX_GROUP_INFO_COUNT = 6;
-const StyledSortableList = styled.div.withConfig({
+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({
   componentId: "sc-9aq3yn-0"
 })(["margin:1rem 0;padding:0;"]);
 //
 //
 //
-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,
+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,
     name: 'groups'
   });
-  const watchedAnswerInfo = reactHookForm.useWatch({
-    control,
+  var watchedAnswerInfo = reactHookForm.useWatch({
+    control: control,
     name: 'answerInfoDefault'
   });
-  const isMaximumGroups = groupInfoFields.length >= MAX_GROUP_INFO_COUNT;
+  var isMaximumGroups = groupInfoFields.length >= MAX_GROUP_INFO_COUNT;
   /**
    *
    */
-  const addGroupAnswerInfo = () => {
-    const cloneAnswerList = cloneDeep(watchedAnswerInfo);
+  var addGroupAnswerInfo = function addGroupAnswerInfo() {
+    var cloneAnswerList = cloneDeep__default.default(watchedAnswerInfo);
     cloneAnswerList[groupInfoFields.length] = [];
     setValue('answerInfoDefault', cloneAnswerList);
   };
   /**
    *
    */
-  const removeGroupAnswerInfo = index => {
-    const cloneAnswerList = cloneDeep(watchedAnswerInfo);
+  var removeGroupAnswerInfo = function removeGroupAnswerInfo(index) {
+    var cloneAnswerList = cloneDeep__default.default(watchedAnswerInfo);
     cloneAnswerList.splice(index, 1);
     setValue('answerInfoDefault', cloneAnswerList.filter(Boolean));
     removeGroupInfoFieldItem(Number(index));
@@ -68,12 +70,11 @@ const OptionGroupGroupInfo = () => {
   /**
    *
    */
-  const onSortEnd = ({
-    oldIndex,
-    newIndex
-  }) => {
-    const cloneAnswerList = cloneDeep(watchedAnswerInfo);
-    const temp = cloneAnswerList[oldIndex];
+  var onSortEnd = function onSortEnd(_ref) {
+    var oldIndex = _ref.oldIndex,
+      newIndex = _ref.newIndex;
+    var cloneAnswerList = cloneDeep__default.default(watchedAnswerInfo);
+    var temp = cloneAnswerList[oldIndex];
     cloneAnswerList[oldIndex] = cloneAnswerList[newIndex];
     cloneAnswerList[newIndex] = temp;
     setValue('groups', reactSortableHoc.arrayMove(watchedGroups, oldIndex, newIndex), {
@@ -84,57 +85,69 @@ const OptionGroupGroupInfo = () => {
   /**
    *
    */
-  const renderGroupOptionList = () => {
-    return React.createElement(blocks.SortableListGroup, {
+  var renderGroupOptionList = function renderGroupOptionList() {
+    return jsxRuntime.jsx(blocks.SortableListGroup, {
       onSortEnd: onSortEnd,
-      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)
-    }))));
+      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);
+        })
+      })
+    });
   };
   /**
    *
    */
-  const renderGroupOptionAddButton = () => {
-    return React.createElement(blocks.Tooltip, {
+  var renderGroupOptionAddButton = function renderGroupOptionAddButton() {
+    return jsxRuntime.jsx(blocks.Tooltip, {
       title: isMaximumGroups ? intl$1.formatMessage({
         id: 'group.option.tooltip.maxDisabled'
       }) : undefined,
-      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'
-    }))));
+      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'
+          })
+        })
+      })
+    });
   };
   //
   //
   //
-  return React.createElement(blocks.Flex, {
-    column: true
-  }, React.createElement(blocks.Text, {
-    size: "small",
-    bold: true
-  }, intl$1.formatMessage({
-    id: 'group.option.title'
-  })), renderGroupOptionList(), renderGroupOptionAddButton());
+  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()]
+  });
 };
 
 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 React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
 var reactHookForm = require('react-hook-form');
 var blocks = require('@elice/blocks');
 var designTokens = require('@elice/design-tokens');
@@ -11,126 +11,142 @@ var intl = require('@elice/intl');
 var trim = require('lodash-es/trim');
 var styled = require('styled-components');
 
-const SHEET_Z_INDEX = 982;
-const MIN_GROUP_INFO_COUNT = 2;
-const StyledSortableListItem = styled(blocks.SortableListItem).withConfig({
+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({
   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);
-const StyledSortableListItemOptionWrapper = styled.div.withConfig({
+var StyledSortableListItemOptionWrapper = styled__default.default.div.withConfig({
   componentId: "sc-hj5nic-1"
-})(["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({
+})(["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({
   componentId: "sc-hj5nic-2"
 })(["& > div{border:0;}"]);
-const OptionGroupGroupListItem = ({
-  disabled,
-  groupId,
-  groupsCount,
-  onRemoveOption
-}) => {
+var OptionGroupGroupListItem = function OptionGroupGroupListItem(_ref2) {
+  var disabled = _ref2.disabled,
+    groupId = _ref2.groupId,
+    groupsCount = _ref2.groupsCount,
+    onRemoveOption = _ref2.onRemoveOption;
   var _a, _b, _c, _d, _e;
-  const intl$1 = intl.useRawEliceIntl();
-  const {
-    control,
-    formState
-  } = reactHookForm.useFormContext();
-  const watchedAnswerInfo = reactHookForm.useWatch({
-    control,
+  var intl$1 = intl.useRawEliceIntl();
+  var _useFormContext = reactHookForm.useFormContext(),
+    control = _useFormContext.control,
+    formState = _useFormContext.formState;
+  var watchedAnswerInfo = reactHookForm.useWatch({
+    control: control,
     name: 'answerInfoDefault'
   });
-  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 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 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({
+  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({
               id: 'group.option.errorMessage.required'
-            });
-          }
-          if (!isGroupChildAnswer) {
-            return intl$1.formatMessage({
-              id: 'group.option.errorMessage.notChild'
-            });
+            })
+          },
+          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'
+              });
+            }
           }
+        },
+        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
-      }))
-    }));
+      })
+    });
   };
   /**
    *
    */
-  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 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 renderErrorMessage = () => {
+  var renderErrorMessage = function renderErrorMessage() {
     if (!errorMessage) {
       return null;
     }
-    return React.createElement(blocks.Flex, {
-      paddingleft: "0.25rem"
-    }, React.createElement(blocks.Text, {
-      size: "small",
-      role: "danger"
-    }, errorMessage));
+    return jsxRuntime.jsx(blocks.Flex, {
+      paddingleft: "0.25rem",
+      children: jsxRuntime.jsx(blocks.Text, {
+        size: "small",
+        role: "danger",
+        children: errorMessage
+      })
+    });
   };
   //
   //
   //
-  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()));
+  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()]
+    })
+  });
 };
 
 exports.default = OptionGroupGroupListItem;

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

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

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

@@ -3,6 +3,10 @@
 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);
+
 /**
  *
  */
@@ -10,7 +14,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(option => {
+    optionsDefault: Array.isArray(v.optionsDefault) ? v.optionsDefault.map(function (option) {
       var _a, _b;
       return {
         id: randomId.createRandomId(),
@@ -18,10 +22,12 @@ 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(group => ({
-      id: randomId.createRandomId(),
-      group
-    })) : []
+    groups: Array.isArray(v.groups) ? v.groups.map(function (group) {
+      return {
+        id: randomId.createRandomId(),
+        group: group
+      };
+    }) : []
   });
 }
 /**
@@ -29,14 +35,17 @@ function manipulateValue(v) {
  */
 function restoreValue(v) {
   return Object.assign(Object.assign({}, v), {
-    optionsDefault: v.optionsDefault.length ? v.optionsDefault.map(option => ({
-      title: trim(option.title),
-      content: option.content
-    })) : null,
+    optionsDefault: v.optionsDefault.length ? v.optionsDefault.map(function (option) {
+      return {
+        title: trim__default.default(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(({
-      group
-    }) => trim(group)) : null
+    groups: v.groups.length ? v.groups.map(function (_ref) {
+      var group = _ref.group;
+      return trim__default.default(group);
+    }) : null
   });
 }