@elice/material-quiz 1.260930.0 → 1.261005.0

package/es/components/material-quiz-edit/options/option-text/OptionTextAdvanceAiGeneratorResult.js

@@ -1,10 +1,9 @@
 import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { FaIcon } from '@elice/eds-kit';
+import { styled, Paper, colors, Box, Typography, Stack, TextField } from '@elice/eds-material';
 import { useRawEliceIntl } from '@elice/intl';
-import { EliceIcon } from '@elice/mui-elements';
-import { colors } from '@elice/mui-system';
 import { faMagicWandSparkles } from '@fortawesome/pro-solid-svg-icons';
-import { styled, Paper, Box, Typography, Stack, TextField } from '@mui/material';
 import HelpyLogo from './HelpyLogo.js';
 
 var _templateObject, _templateObject2, _templateObject3;
@@ -37,23 +36,29 @@ var OptionTextAdvanceAiGeneratorResult = function OptionTextAdvanceAiGeneratorRe
   var renderResultTitle = function renderResultTitle() {
     return jsxs(Stack, {
       direction: "row",
-      gap: "0.25rem",
-      alignItems: "center",
-      children: [jsx(EliceIcon, {
+      sx: {
+        gap: '0.25rem',
+        alignItems: 'center'
+      },
+      children: [jsx(FaIcon, {
         color: "primary",
         fontSize: "small",
         icon: faMagicWandSparkles
       }), jsx(Typography, {
         variant: "subtitle2",
-        color: "text.primary",
+        sx: {
+          color: 'text.primary'
+        },
         children: intl.formatMessage({
           id: 'material_quiz_edit.option_text.advance_ai_generator.result_title'
         }, {
           span: function span(text) {
             return jsx(Typography, {
               variant: "inherit",
-              color: "primary.main",
               component: "span",
+              sx: {
+                color: 'primary.main'
+              },
               children: text
             });
           }
@@ -70,8 +75,10 @@ var OptionTextAdvanceAiGeneratorResult = function OptionTextAdvanceAiGeneratorRe
       label: intl.formatMessage({
         id: 'component.material_quiz.advance_ai_generator_result.regex.label'
       }),
-      InputProps: {
-        readOnly: true
+      slotProps: {
+        input: {
+          readOnly: true
+        }
       },
       value: pattern
     });
@@ -83,8 +90,10 @@ var OptionTextAdvanceAiGeneratorResult = function OptionTextAdvanceAiGeneratorRe
     return jsx(StyledExplanationWrapper, {
       children: jsx(StyledExplantionBlock, {
         variant: "body1",
-        color: "text.primary",
-        fontWeight: "500",
+        color: "textPrimary",
+        sx: {
+          fontWeight: 500
+        },
         children: explanation
       })
     });
@@ -94,7 +103,9 @@ var OptionTextAdvanceAiGeneratorResult = function OptionTextAdvanceAiGeneratorRe
    */
   var renderResult = function renderResult() {
     return jsxs(Stack, {
-      gap: "0.75rem",
+      sx: {
+        gap: '0.75rem'
+      },
       children: [renderResultTitle(), renderResultRegex(), renderExplanation()]
     });
   };

package/es/components/material-quiz-edit/options/option-text/OptionTextAdvanceAnswerInfoDefaultController.js

@@ -3,8 +3,8 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { useFormContext, useWatch } from 'react-hook-form';
 import { useDebounce } from 'react-use';
+import { Stack, TextField } from '@elice/eds-material';
 import { useRawEliceIntl } from '@elice/intl';
-import { Stack, TextField } from '@mui/material';
 import AnswerInfoDefaultController from './AnswerInfoDefaultController.js';
 import { useMaterialQuizCourse } from '../../hooks/useMaterialQuizCourse.js';
 import { useMaterialQuizRegex } from '../../hooks/useMaterialQuizRegex.js';
@@ -59,7 +59,9 @@ var OptionTextAdvanceAnswerInfoDefaultController = function OptionTextAdvanceAns
   //
   //
   return jsxs(Stack, {
-    gap: "1rem",
+    sx: {
+      gap: '1rem'
+    },
     children: [jsx(AnswerInfoDefaultController, {
       slotProps: {
         TextField: {
@@ -89,11 +91,13 @@ var OptionTextAdvanceAnswerInfoDefaultController = function OptionTextAdvanceAns
       helperText: isRegexShouldValidate ? intl.formatMessage({
         id: isRegexMatched ? 'common.correct_answer' : 'common.incorrect_answer'
       }) : '',
-      FormHelperTextProps: {
-        sx: {
-          color: isRegexShouldValidate ? function (theme) {
-            return theme.palette[isRegexMatched ? 'success' : 'error'].main;
-          } : 'inherit'
+      slotProps: {
+        formHelperText: {
+          sx: {
+            color: isRegexShouldValidate ? function (theme) {
+              return theme.palette[isRegexMatched ? 'success' : 'error'].main;
+            } : 'inherit'
+          }
         }
       },
       onChange: function onChange(e) {

package/es/components/material-quiz-edit/options/option-text/OptionTextAdvanceMethodNotice.js

@@ -1,6 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
+import { Alert } from '@elice/eds-material';
 import { useRawEliceIntl } from '@elice/intl';
-import { Alert } from '@mui/material';
 
 //
 //

package/es/components/material-quiz-edit/options/option-text/OptionTextAdvanceModeController.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { Stack, Box } from '@mui/material';
+import { Stack, Box } from '@elice/eds-material';
 import OptionTextAdvanceAiGeneratorAction from './OptionTextAdvanceAiGeneratorAction.js';
 import OptionTextAdvanceAnswerInfoDefaultController from './OptionTextAdvanceAnswerInfoDefaultController.js';
 import OptionTextAdvanceMethodNotice from './OptionTextAdvanceMethodNotice.js';
@@ -9,9 +9,13 @@ import OptionTextAdvanceMethodNotice from './OptionTextAdvanceMethodNotice.js';
 //
 var OptionTextAdvanceModeController = function OptionTextAdvanceModeController() {
   return jsxs(Stack, {
-    gap: "1rem",
+    sx: {
+      gap: '1rem'
+    },
     children: [jsx(OptionTextAdvanceMethodNotice, {}), jsx(Box, {
-      alignSelf: "flex-end",
+      sx: {
+        alignSelf: 'flex-end'
+      },
       children: jsx(OptionTextAdvanceAiGeneratorAction, {})
     }), jsx(OptionTextAdvanceAnswerInfoDefaultController, {})]
   });

package/es/components/shared/FallbackLoading.js

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { Stack, CircularProgress } from '@mui/material';
+import { Stack, CircularProgress } from '@elice/eds-material';
 
 //
 //
@@ -8,10 +8,12 @@ var FallbackLoading = function FallbackLoading(_ref) {
   var _ref$height = _ref.height,
     height = _ref$height === void 0 ? '18.75rem' : _ref$height;
   return jsx(Stack, {
-    justifyContent: "center",
-    alignItems: "center",
-    gap: "1rem",
-    height: height,
+    sx: {
+      justifyContent: 'center',
+      alignItems: 'center',
+      gap: '1rem',
+      height: height
+    },
     children: jsx(CircularProgress, {})
   });
 };

package/es/components/shared/NoData.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { Stack, Box, Typography } from '@mui/material';
+import { Stack, Box, Typography } from '@elice/eds-material';
 import img from '../../assets/imgs/list_empty.png.js';
 
 //
@@ -26,8 +26,10 @@ var NoData = function NoData(_ref) {
     if (typeof title === 'string') {
       return jsx(Typography, {
         variant: "h6",
-        color: "text.secondary",
-        fontWeight: 800,
+        sx: {
+          color: 'text.secondary',
+          fontWeight: 800
+        },
         children: title
       });
     }
@@ -37,21 +39,27 @@ var NoData = function NoData(_ref) {
   //
   //
   return jsxs(Stack, {
-    justifyContent: "center",
-    alignItems: "center",
-    gap: "1rem",
-    height: height,
-    padding: padding,
+    sx: {
+      justifyContent: 'center',
+      alignItems: 'center',
+      gap: '1rem',
+      height: height,
+      padding: padding
+    },
     children: [!hideImage ? jsx(Box, {
       component: "img",
       src: imgSrc !== null && imgSrc !== void 0 ? imgSrc : img,
       alt: "empty image",
-      width: imgWidth
+      sx: {
+        width: imgWidth
+      }
     }) : null, jsx(Stack, {
-      justifyContent: "center",
-      alignItems: "center",
-      gap: "0.25rem",
-      textAlign: "center",
+      sx: {
+        justifyContent: 'center',
+        alignItems: 'center',
+        gap: '0.25rem',
+        textAlign: 'center'
+      },
       children: renderTitle()
     }), action ? jsx(Box, {
       children: action

package/es/components/shared/QuestionBox.js

@@ -6,10 +6,10 @@ import React, { useEffect } from 'react';
 import { useIntersection } from 'react-use';
 import { Button, Text, Box as Box$1 } from '@elice/blocks';
 import { base } from '@elice/design-tokens';
+import { useTheme, Stack, Box, Typography, Button as Button$1, Avatar } from '@elice/eds-material';
 import { useRawEliceIntl } from '@elice/intl';
 import { MarkdownTypography } from '@elice/markdown';
 import { useHelpyLogo } from '@elice/material-shared-utils';
-import { useTheme, Stack, Box, Typography, Button as Button$1, Avatar } from '@mui/material';
 import animateScrollTo from 'animated-scroll-to';
 import { getQuizResultStatus, QuizResultStatus } from '../../helpers/index.js';
 import { useMaterialQuizState } from '../material-quiz/context/MaterialQuizContext.js';
@@ -148,15 +148,19 @@ var QuestionBox = function QuestionBox(_a) {
     vertical: vertical,
     ref: headerRef,
     children: jsxs(Stack, {
-      width: "100%",
       direction: "row",
-      justifyContent: "space-between",
-      flexWrap: "wrap",
-      alignItems: "center",
-      gap: "1.25rem",
+      sx: {
+        width: '100%',
+        justifyContent: 'space-between',
+        flexWrap: 'wrap',
+        alignItems: 'center',
+        gap: '1.25rem'
+      },
       children: [jsxs(Box, {
-        display: "flex",
-        alignItems: "center",
+        sx: {
+          display: 'flex',
+          alignItems: 'center'
+        },
         children: [titlePrefix ? jsx(Text, {
           bold: true,
           size: "large",
@@ -166,12 +170,14 @@ var QuestionBox = function QuestionBox(_a) {
           },
           children: titlePrefix
         }) : null, ((_b = course === null || course === void 0 ? void 0 : course.preference) === null || _b === void 0 ? void 0 : _b.renderMarkdownInQuizOptions) ? jsx(StyledMarkdownTypography, {
-          color: "text.primary",
+          color: "textPrimary",
           variant: "subtitle2",
           children: title
         }) : jsx(Typography, {
-          color: "text.primary",
           variant: "subtitle2",
+          sx: {
+            color: 'text.primary'
+          },
           children: title
         })]
       }), getQuizResultStatus(materialQuizResponse) === QuizResultStatus.Wrong ? jsx(Button$1, {
@@ -192,7 +198,9 @@ var QuestionBox = function QuestionBox(_a) {
         onClick: onHint,
         children: jsx(Typography, {
           variant: "button",
-          color: "text.primary",
+          sx: {
+            color: 'text.primary'
+          },
           children: intl.formatMessage({
             id: 'materialQuiz.hint'
           })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elice/material-quiz",
-  "version": "1.260930.0",
+  "version": "1.261005.0",
   "description": "User view and editing components of Elice material quiz",
   "repository": {
     "type": "git",
@@ -21,12 +21,12 @@
     "@elice/api-client": "^1",
     "@elice/blocks": "^1",
     "@elice/design-tokens": "^1",
+    "@elice/eds-kit": "^1.261005.0",
+    "@elice/eds-material": "^1.261005.0",
     "@elice/file-client": "^1",
     "@elice/icons": "^1",
     "@elice/intl": "^0",
     "@elice/markdown": "^1",
-    "@elice/mui-elements": "^5",
-    "@elice/mui-system": "^5",
     "@elice/openapi-client-course": "^1",
     "@elice/openapi-client-file": "^1",
     "@elice/types": "^1",
@@ -35,15 +35,12 @@
     "@emotion/styled": "^11.10.0",
     "@fortawesome/pro-regular-svg-icons": "^6",
     "@fortawesome/pro-solid-svg-icons": "^6",
-    "@mui/lab": "^5.0.0-alpha.112",
-    "@mui/material": "^5.10.16",
-    "@mui/x-data-grid": "^6.7.0",
-    "@mui/x-date-pickers": "^6.7.0",
+    "@mui/lab": "^9.0.0-beta.9",
     "@tanstack/react-query": "^4",
-    "react": "^16.8.0  || ^17.0.0 || ^18.0.0",
+    "react": "^18.0.0 || ^19.0.0",
     "react-use": "^17.0.0",
-    "@elice/material-shared-types": "1.260930.0",
-    "@elice/material-shared-utils": "1.260930.0"
+    "@elice/material-shared-types": "1.261005.0",
+    "@elice/material-shared-utils": "1.261005.0"
   },
   "dependencies": {
     "@dnd-kit/core": "^6.1.0",
@@ -66,26 +63,23 @@
     "@elice/api-client": "1.260529.0",
     "@elice/blocks": "1.260723.0",
     "@elice/design-tokens": "^1.220803.0",
-    "@elice/file-client": "^1.250307.0",
+    "@elice/eds-kit": "1.261005.0",
+    "@elice/eds-material": "1.261005.0",
+    "@elice/file-client": "1.250914.0-edsmigration.1",
     "@elice/icons": "^1.230814.0",
     "@elice/icons-legacy": "npm:@elice/icons@0.230814.0",
     "@elice/intl": "0.260526.0",
-    "@elice/markdown": "1.241015.0",
-    "@elice/mui-elements": "5.251204.0",
-    "@elice/mui-system": "5.251204.0",
+    "@elice/markdown": "1.260915.0-edsmigration.1",
     "@elice/openapi-client-course": "^1.250702.0",
     "@elice/openapi-client-file": "^1.240619.0",
     "@elice/rollup-config": "^1.260406.0",
     "@elice/types": "1.260608.0",
-    "@elice/wysiwyg": "1.241015.0",
+    "@elice/wysiwyg": "1.260915.0-edsmigration.1",
     "@emotion/react": "^11.10.0",
     "@emotion/styled": "^11.10.0",
     "@fortawesome/pro-regular-svg-icons": "^6.4.2",
     "@fortawesome/pro-solid-svg-icons": "^6.4.2",
-    "@mui/lab": "^5.0.0-alpha.112",
-    "@mui/material": "^5.10.16",
-    "@mui/x-data-grid": "^6.7.0",
-    "@mui/x-date-pickers": "^6.7.0",
+    "@mui/lab": "9.0.0-beta.9",
     "@tanstack/react-query": "^4.29.3",
     "@types/classnames": "^2.3.1",
     "@types/jquery": "^3.5.13",
@@ -102,8 +96,8 @@
     "react-use": "^17.2.4",
     "rollup": "^4.0.0",
     "typescript": "~5.9.3",
-    "@elice/material-shared-types": "1.260930.0",
-    "@elice/material-shared-utils": "1.260930.0"
+    "@elice/material-shared-types": "1.261005.0",
+    "@elice/material-shared-utils": "1.261005.0"
   },
   "scripts": {
     "start": "run-s watch",