@elice/material-runbox 1.260930.0 → 1.261005.0

package/es/components/material-runbox/timer/MaterialRunboxQuotaAlmostEndDialog.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { Dialog, DialogTitle, DialogContent, Stack, Card, Typography, Divider, DialogActions, Button } from '@elice/eds-material';
 import { useRawEliceIntl } from '@elice/intl';
 import { useEliceRunboxQuota } from '@elice/runbox-client';
-import { Dialog, DialogTitle, DialogContent, Stack, Card, Typography, Divider, DialogActions, Button } from '@mui/material';
 import { QUOTA_ALMOST_END_MINUTES, QUOTA_PER_SESSION_ALMOST_END_MINUTES } from '../hooks/useRunboxSessionEndWarning.js';
 import MaterialRunboxQuotaAmount from './MaterialRunboxQuotaAmount.js';
 import { getTimeParts } from '../../../utils/time.js';
@@ -51,7 +51,9 @@ var MaterialRunboxQuotaAlmostEndDialog = function MaterialRunboxQuotaAlmostEndDi
     }), jsx(DialogContent, {
       children: jsxs(Stack, {
         direction: "column",
-        gap: "1.5rem",
+        sx: {
+          gap: '1.5rem'
+        },
         children: [jsxs(Card, {
           elevation: 0,
           sx: {
@@ -59,12 +61,16 @@ var MaterialRunboxQuotaAlmostEndDialog = function MaterialRunboxQuotaAlmostEndDi
           },
           children: [jsxs(Stack, {
             direction: "column",
-            gap: "0.5rem",
-            padding: "1rem",
-            bgcolor: isQuotaAlmostEnd ? 'warning.opacity03' : undefined,
+            sx: {
+              bgcolor: isQuotaAlmostEnd ? 'warning.opacity03' : undefined,
+              padding: '1rem',
+              gap: '0.5rem'
+            },
             children: [jsx(Typography, {
               variant: "body2",
-              fontWeight: "bold",
+              sx: {
+                fontWeight: 'bold'
+              },
               children: intl.formatMessage({
                 id: 'runbox.timer.popover.quota.title'
               })
@@ -75,19 +81,25 @@ var MaterialRunboxQuotaAlmostEndDialog = function MaterialRunboxQuotaAlmostEndDi
             })]
           }), jsx(Divider, {}), jsxs(Stack, {
             direction: "column",
-            gap: "0.5rem",
-            padding: "1rem",
-            bgcolor: isQuotaPerSessionAlmostEnd ? 'warning.opacity03' : undefined,
+            sx: {
+              bgcolor: isQuotaPerSessionAlmostEnd ? 'warning.opacity03' : undefined,
+              padding: '1rem',
+              gap: '0.5rem'
+            },
             children: [jsx(Typography, {
               variant: "body2",
-              fontWeight: "bold",
+              sx: {
+                fontWeight: 'bold'
+              },
               children: intl.formatMessage({
                 id: 'runbox.timer.popover.quota_per_session.title'
               })
             }), quotaPerSessionInfo.isUnlimited ? jsx(Typography, {
               component: "span",
               variant: "h5",
-              fontWeight: "extraBold",
+              sx: {
+                fontWeight: 'extraBold'
+              },
               children: intl.formatMessage({
                 id: 'runbox.timer.unlimited'
               })
@@ -99,7 +111,9 @@ var MaterialRunboxQuotaAlmostEndDialog = function MaterialRunboxQuotaAlmostEndDi
           })]
         }), jsx(Typography, {
           variant: "body2",
-          whiteSpace: "pre-line",
+          sx: {
+            whiteSpace: 'pre-line'
+          },
           children: intl.formatMessage({
             id: 'runbox.timer.almost_end.dialog.quota.description'
           })

package/es/components/material-runbox/timer/MaterialRunboxQuotaAmount.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { Typography, Stack } from '@elice/eds-material';
 import { useRawEliceIntl } from '@elice/intl';
-import { Typography, Stack } from '@mui/material';
 import MaterialRunboxQuotaTimePart from './MaterialRunboxQuotaTimePart.js';
 import { getTimeParts } from '../../../utils/time.js';
 
@@ -25,9 +25,11 @@ var MaterialRunboxQuotaAmount = function MaterialRunboxQuotaAmount(_ref) {
     variant: "body2",
     children: [jsxs(Stack, {
       component: "span",
-      display: "inline-flex",
       direction: "row",
-      gap: "0.25rem",
+      sx: {
+        gap: '0.25rem',
+        display: 'inline-flex'
+      },
       children: [jsx(MaterialRunboxQuotaTimePart, {
         value: remainingHours,
         unit: "hour",

package/es/components/material-runbox/timer/MaterialRunboxQuotaPerSessionAlmostEndDialog.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { Dialog, DialogTitle, DialogContent, Stack, Card, Typography, Divider, DialogActions, Button } from '@elice/eds-material';
 import { useRawEliceIntl } from '@elice/intl';
 import { useEliceRunboxQuota } from '@elice/runbox-client';
-import { Dialog, DialogTitle, DialogContent, Stack, Card, Typography, Divider, DialogActions, Button } from '@mui/material';
 import { QUOTA_ALMOST_END_MINUTES, QUOTA_PER_SESSION_ALMOST_END_MINUTES } from '../hooks/useRunboxSessionEndWarning.js';
 import MaterialRunboxQuotaAmount from './MaterialRunboxQuotaAmount.js';
 import { getTimeParts } from '../../../utils/time.js';
@@ -52,7 +52,9 @@ var MaterialRunboxQuotaPerSessionAlmostEndDialog = function MaterialRunboxQuotaP
     }), jsx(DialogContent, {
       children: jsxs(Stack, {
         direction: "column",
-        gap: "1.5rem",
+        sx: {
+          gap: '1.5rem'
+        },
         children: [jsxs(Card, {
           elevation: 0,
           sx: {
@@ -60,19 +62,25 @@ var MaterialRunboxQuotaPerSessionAlmostEndDialog = function MaterialRunboxQuotaP
           },
           children: [jsxs(Stack, {
             direction: "column",
-            gap: "0.5rem",
-            padding: "1rem",
-            bgcolor: isQuotaAlmostEnd ? 'warning.opacity03' : undefined,
+            sx: {
+              bgcolor: isQuotaAlmostEnd ? 'warning.opacity03' : undefined,
+              padding: '1rem',
+              gap: '0.5rem'
+            },
             children: [jsx(Typography, {
               variant: "body2",
-              fontWeight: "bold",
+              sx: {
+                fontWeight: 'bold'
+              },
               children: intl.formatMessage({
                 id: 'runbox.timer.popover.quota.title'
               })
             }), quotaInfo.isUnlimited ? jsx(Typography, {
               component: "span",
               variant: "h5",
-              fontWeight: "extraBold",
+              sx: {
+                fontWeight: 'extraBold'
+              },
               children: intl.formatMessage({
                 id: 'runbox.timer.unlimited'
               })
@@ -83,12 +91,16 @@ var MaterialRunboxQuotaPerSessionAlmostEndDialog = function MaterialRunboxQuotaP
             })]
           }), jsx(Divider, {}), jsxs(Stack, {
             direction: "column",
-            gap: "0.5rem",
-            padding: "1rem",
-            bgcolor: isQuotaPerSessionAlmostEnd ? 'warning.opacity03' : undefined,
+            sx: {
+              bgcolor: isQuotaPerSessionAlmostEnd ? 'warning.opacity03' : undefined,
+              padding: '1rem',
+              gap: '0.5rem'
+            },
             children: [jsx(Typography, {
               variant: "body2",
-              fontWeight: "bold",
+              sx: {
+                fontWeight: 'bold'
+              },
               children: intl.formatMessage({
                 id: 'runbox.timer.popover.quota_per_session.title'
               })
@@ -100,7 +112,9 @@ var MaterialRunboxQuotaPerSessionAlmostEndDialog = function MaterialRunboxQuotaP
           })]
         }), jsx(Typography, {
           variant: "body2",
-          whiteSpace: "pre-line",
+          sx: {
+            whiteSpace: 'pre-line'
+          },
           children: intl.formatMessage({
             id: 'runbox.timer.almost_end.dialog.quota_per_session.description'
           })

package/es/components/material-runbox/timer/MaterialRunboxQuotaTimePart.js

@@ -1,6 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
+import { Typography } from '@elice/eds-material';
 import { useRawEliceIntl } from '@elice/intl';
-import { Typography } from '@mui/material';
 
 //
 //
@@ -24,8 +24,10 @@ var MaterialRunboxQuotaTimePart = function MaterialRunboxQuotaTimePart(_ref) {
   return jsx(Typography, {
     component: "span",
     variant: "h5",
-    fontWeight: "extraBold",
     color: color,
+    sx: {
+      fontWeight: 'extraBold'
+    },
     children: intl.formatNumberToParts(value, {
       style: 'unit',
       unit: unit,
@@ -34,7 +36,9 @@ var MaterialRunboxQuotaTimePart = function MaterialRunboxQuotaTimePart(_ref) {
       return part.type === 'unit' ? jsx(Typography, {
         component: "span",
         variant: "body2",
-        fontWeight: "regular",
+        sx: {
+          fontWeight: 'regular'
+        },
         children: part.value
       }, index) : jsx("span", {
         children: part.value

package/es/components/material-runbox/timer/MaterialRunboxTimer.js

@@ -3,11 +3,11 @@ import _styled from '@emotion/styled/base';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import React from 'react';
 import { useLocalStorage } from 'react-use';
+import { FaIcon } from '@elice/eds-kit';
+import { Chip, chipClasses, Tooltip, Typography } from '@elice/eds-material';
 import { useRawEliceIntl } from '@elice/intl';
-import { EliceIcon } from '@elice/mui-elements';
 import { useEliceRunboxRunning, useEliceRunboxQuota } from '@elice/runbox-client';
 import { faTimer } from '@fortawesome/pro-solid-svg-icons';
-import { Chip, chipClasses, Tooltip, Typography } from '@mui/material';
 import { useRunboxSessionEndWarning, QUOTA_ALMOST_END_MINUTES } from '../hooks/useRunboxSessionEndWarning.js';
 import MaterialRunboxQuotaAlmostEndDialog from './MaterialRunboxQuotaAlmostEndDialog.js';
 import MaterialRunboxQuotaPerSessionAlmostEndDialog from './MaterialRunboxQuotaPerSessionAlmostEndDialog.js';
@@ -88,7 +88,9 @@ var MaterialRunboxTimer = function MaterialRunboxTimer(_ref3) {
       arrow: true,
       placement: "bottom",
       title: jsx(Typography, {
-        color: "text.primary",
+        sx: {
+          color: 'text.primary'
+        },
         children: intl.formatMessage({
           id: 'runbox.timer.tooltip.title'
         })
@@ -109,7 +111,7 @@ var MaterialRunboxTimer = function MaterialRunboxTimer(_ref3) {
         variant: isAlmostEnd ? 'filled' : 'outlined',
         color: isAlmostEnd ? 'warning' : 'default',
         size: isSmallTabletOrSmaller ? 'small' : 'medium',
-        icon: jsx(EliceIcon, {
+        icon: jsx(FaIcon, {
           icon: faTimer
         }),
         "data-active": isTimerDetailPopoverOpen,
@@ -123,9 +125,11 @@ var MaterialRunboxTimer = function MaterialRunboxTimer(_ref3) {
           }), jsx(Typography, {
             component: "span",
             variant: "body1",
-            fontWeight: "bold",
-            whiteSpace: "pre",
-            display: "inline-block",
+            sx: {
+              display: 'inline-block',
+              whiteSpace: 'pre',
+              fontWeight: 'bold'
+            },
             children: quotaInfo.isUnlimited ? " : ".concat(intl.formatMessage({
               id: 'runbox.timer.unlimited'
             })) : " ".concat(timeString)

package/es/components/material-runbox/timer/MaterialRunboxTimerDetailPopover.d.ts

@@ -1,4 +1,4 @@
-import type { PopoverProps } from '@mui/material';
+import type { PopoverProps } from '@elice/eds-material';
 interface MaterialRunboxTimerDetailPopoverProps extends PopoverProps {
     userId: number | undefined;
     open: boolean;

package/es/components/material-runbox/timer/MaterialRunboxTimerDetailPopover.js

@@ -3,11 +3,11 @@ import { __rest } from 'tslib';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useLocalStorage } from 'react-use';
 import { getOrgUserGet } from '@elice/api-client';
+import { FaIcon } from '@elice/eds-kit';
+import { Popover, Fade, Stack, Card, Divider, Button, FormControlLabel, Typography, Checkbox, IconButton } from '@elice/eds-material';
 import { useRawEliceIntl } from '@elice/intl';
-import { EliceIcon } from '@elice/mui-elements';
 import { useEliceRunboxQuota } from '@elice/runbox-client';
 import { faXmarkLarge } from '@fortawesome/pro-regular-svg-icons';
-import { Popover, Fade, Stack, Card, Divider, Button, FormControlLabel, Typography, Checkbox, IconButton } from '@mui/material';
 import { useQuery } from '@tanstack/react-query';
 import { QUOTA_ALMOST_END_MINUTES, QUOTA_PER_SESSION_ALMOST_END_MINUTES } from '../hooks/useRunboxSessionEndWarning.js';
 import MaterialRunboxQuotaAmount from './MaterialRunboxQuotaAmount.js';
@@ -81,7 +81,7 @@ var MaterialRunboxTimerDetailPopover = function MaterialRunboxTimerDetailPopover
         top: '1rem',
         right: '1rem'
       },
-      children: jsx(EliceIcon, {
+      children: jsx(FaIcon, {
         icon: faXmarkLarge,
         onClick: handleClickClose
       })
@@ -94,17 +94,23 @@ var MaterialRunboxTimerDetailPopover = function MaterialRunboxTimerDetailPopover
     var _a;
     return jsxs(Stack, {
       direction: "column",
-      width: "100%",
-      gap: "0.5rem",
+      sx: {
+        gap: '0.5rem',
+        width: '100%'
+      },
       children: [jsx(Typography, {
         variant: "subtitle2",
-        fontWeight: "extraBold",
+        sx: {
+          fontWeight: 'extraBold'
+        },
         children: intl.formatMessage({
           id: 'runbox.timer.popover.title'
         })
       }), jsx(Typography, {
         variant: "body2",
-        whiteSpace: "pre-line",
+        sx: {
+          whiteSpace: 'pre-line'
+        },
         children: intl.formatMessage({
           id: 'runbox.timer.popover.description'
         }, {
@@ -120,18 +126,24 @@ var MaterialRunboxTimerDetailPopover = function MaterialRunboxTimerDetailPopover
     if (quotaInfo.isUnlimited) {
       return jsxs(Stack, {
         direction: "column",
-        gap: "0.5rem",
-        padding: "1rem",
+        sx: {
+          padding: '1rem',
+          gap: '0.5rem'
+        },
         children: [jsx(Typography, {
           variant: "body2",
-          fontWeight: "bold",
+          sx: {
+            fontWeight: 'bold'
+          },
           children: intl.formatMessage({
             id: 'runbox.timer.popover.quota.title'
           })
         }), jsx(Typography, {
           component: "span",
           variant: "h5",
-          fontWeight: "extraBold",
+          sx: {
+            fontWeight: 'extraBold'
+          },
           children: intl.formatMessage({
             id: 'runbox.timer.unlimited'
           })
@@ -142,12 +154,16 @@ var MaterialRunboxTimerDetailPopover = function MaterialRunboxTimerDetailPopover
     var quotaBgColor = quotaInfo.remainingQuota > QUOTA_ALMOST_END_MINUTES ? undefined : 'warning.opacity03';
     return jsxs(Stack, {
       direction: "column",
-      gap: "0.5rem",
-      padding: "1rem",
-      bgcolor: quotaBgColor,
+      sx: {
+        bgcolor: quotaBgColor,
+        padding: '1rem',
+        gap: '0.5rem'
+      },
       children: [jsx(Typography, {
         variant: "body2",
-        fontWeight: "bold",
+        sx: {
+          fontWeight: 'bold'
+        },
         children: intl.formatMessage({
           id: 'runbox.timer.popover.quota.title'
         })
@@ -165,7 +181,9 @@ var MaterialRunboxTimerDetailPopover = function MaterialRunboxTimerDetailPopover
     if (quotaPerSessionInfo.isUnlimited) {
       return jsxs(Typography, {
         variant: "body2",
-        fontWeight: "bold",
+        sx: {
+          fontWeight: 'bold'
+        },
         children: [intl.formatMessage({
           id: 'runbox.timer.popover.quota_per_session.title'
         }), " : ", intl.formatMessage({
@@ -177,12 +195,16 @@ var MaterialRunboxTimerDetailPopover = function MaterialRunboxTimerDetailPopover
     var perSessionBgColor = quotaPerSessionInfo.remainingQuota > QUOTA_PER_SESSION_ALMOST_END_MINUTES ? undefined : 'warning.opacity03';
     return jsxs(Stack, {
       direction: "column",
-      gap: "0.5rem",
-      padding: "1rem",
-      bgcolor: perSessionBgColor,
+      sx: {
+        bgcolor: perSessionBgColor,
+        padding: '1rem',
+        gap: '0.5rem'
+      },
       children: [jsx(Typography, {
         variant: "body2",
-        fontWeight: "bold",
+        sx: {
+          fontWeight: 'bold'
+        },
         children: intl.formatMessage({
           id: 'runbox.timer.popover.quota_per_session.title'
         })
@@ -192,7 +214,9 @@ var MaterialRunboxTimerDetailPopover = function MaterialRunboxTimerDetailPopover
         color: perSessionColor
       }), jsx(Typography, {
         variant: "body2",
-        color: "text.tertiary",
+        sx: {
+          color: 'text.tertiary'
+        },
         children: intl.formatMessage({
           id: 'runbox.timer.popover.quota_per_session.description'
         }, {
@@ -207,16 +231,20 @@ var MaterialRunboxTimerDetailPopover = function MaterialRunboxTimerDetailPopover
   };
   return jsx(Popover, Object.assign({
     open: open,
-    TransitionComponent: Fade,
     onClose: onClose
   }, props, {
+    slots: {
+      transition: Fade
+    },
     children: jsxs(Stack, {
-      position: "relative",
       direction: "column",
-      padding: "1.5rem",
-      gap: "1rem",
-      width: "22rem",
-      bgcolor: "background.paper",
+      sx: {
+        bgcolor: 'background.paper',
+        width: '22rem',
+        gap: '1rem',
+        padding: '1.5rem',
+        position: 'relative'
+      },
       children: [renderHeader(), renderCloseButton(), jsxs(Card, {
         elevation: 0,
         sx: {

package/es/components/shared/hooks/useBreakpoint.d.ts

@@ -1,4 +1,4 @@
-import type { Breakpoint, Breakpoints } from '@mui/material';
-type Query = Exclude<keyof Breakpoints, 'keys' | 'values' | 'between' | 'unit'>;
+import type { Breakpoint, Breakpoints } from '@elice/eds-material';
+type Query = Exclude<keyof Breakpoints, 'keys' | 'values' | 'between' | 'unit' | 'internal_mediaKeys'>;
 export declare const useBreakpoint: (key: Breakpoint, query?: Query) => boolean;
 export {};

package/es/components/shared/hooks/useBreakpoint.js

@@ -1,4 +1,4 @@
-import { useTheme, useMediaQuery } from '@mui/material';
+import { useTheme, useMediaQuery } from '@elice/eds-material';
 
 var useBreakpoint = function useBreakpoint(key) {
   var query = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'up';

package/es/components/shared/material-runbox-snackbar/MaterialRunboxSnackbar.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { SxProps, Theme } from '@mui/material';
+import type { SxProps, Theme } from '@elice/eds-material';
 interface MaterialRunboxSnackbarProps {
     snackbarKey: string;
     runboxId: string;

package/es/components/shared/material-runbox-snackbar/MaterialRunboxSnackbar.js

@@ -1,11 +1,11 @@
-import { slicedToArray as _slicedToArray, defineProperty as _defineProperty } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { slicedToArray as _slicedToArray, defineProperty as _defineProperty, toConsumableArray as _toConsumableArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React from 'react';
 import { useLocalStorage } from 'react-use';
-import { EliceIcon } from '@elice/mui-elements';
-import { useSnackbar } from '@elice/mui-x-snackbar';
+import { FaIcon } from '@elice/eds-kit';
+import { Stack, IconButton } from '@elice/eds-material';
+import { useSnackbar } from '@elice/eds-x-snackbar';
 import { faWarning, faXmark } from '@fortawesome/pro-solid-svg-icons';
-import { Stack, IconButton } from '@mui/material';
 
 //
 //
@@ -43,10 +43,11 @@ var MaterialRunboxSnackbar = function MaterialRunboxSnackbar(_ref) {
     }
     enqueueSnackbar(jsxs(Stack, {
       direction: "row",
-      alignItems: "center",
-      gap: "0.75rem",
-      sx: sx,
-      children: [jsx(EliceIcon, {
+      sx: [{
+        alignItems: 'center',
+        gap: '0.75rem'
+      }].concat(_toConsumableArray(Array.isArray(sx) ? sx : [sx])),
+      children: [jsx(FaIcon, {
         color: "warning",
         icon: faWarning
       }), message, jsx(IconButton, {
@@ -55,7 +56,7 @@ var MaterialRunboxSnackbar = function MaterialRunboxSnackbar(_ref) {
         onClick: function onClick() {
           return closeSnackbar(snackbarKey);
         },
-        children: jsx(EliceIcon, {
+        children: jsx(FaIcon, {
           icon: faXmark,
           sx: {
             margin: 'auto !important'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elice/material-runbox",
-  "version": "1.260930.0",
+  "version": "1.261005.0",
   "description": "User view and editing components of Elice material runbox",
   "repository": {
     "type": "git",
@@ -19,10 +19,10 @@
   "sideEffects": false,
   "peerDependencies": {
     "@elice/api-client": "^1",
+    "@elice/eds-kit": "^1.261005.0",
+    "@elice/eds-material": "^1.261005.0",
+    "@elice/eds-x-snackbar": "^1.261005.0",
     "@elice/intl": "^0",
-    "@elice/mui-elements": "^5",
-    "@elice/mui-system": "^5",
-    "@elice/mui-x-snackbar": "^5",
     "@elice/openapi-client-material-runbox": "^1",
     "@elice/runbox-client": "^1",
     "@elice/types": "^1",
@@ -30,15 +30,13 @@
     "@emotion/styled": "^11.10.0",
     "@fortawesome/pro-regular-svg-icons": "^6",
     "@fortawesome/pro-solid-svg-icons": "^6",
-    "@mui/icons-material": "^5.10.16",
-    "@mui/lab": "^5.0.0-alpha.112",
-    "@mui/material": "^5.10.16",
+    "@mui/icons-material": "^9.1.0",
     "@tanstack/react-query": "^4",
-    "react": "^16.8.0  || ^17.0.0 || ^18.0.0",
+    "react": "^18.0.0 || ^19.0.0",
     "react-transition-group": "^4.4.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": {
     "classnames": "^2.2.0",
@@ -50,21 +48,19 @@
   },
   "devDependencies": {
     "@elice/api-client": "1.260529.0",
+    "@elice/eds-kit": "1.261005.0",
+    "@elice/eds-material": "1.261005.0",
+    "@elice/eds-x-snackbar": "1.261005.0",
     "@elice/intl": "0.260526.0",
-    "@elice/mui-elements": "5.251204.0",
-    "@elice/mui-system": "5.251204.0",
-    "@elice/mui-x-snackbar": "^5.250108.0-controllabel.0",
     "@elice/openapi-client-material-runbox": "1.260910.0",
     "@elice/rollup-config": "^1.260406.0",
-    "@elice/runbox-client": "1.260910.0",
+    "@elice/runbox-client": "1.260915.0-edsmigration.1",
     "@elice/types": "1.260608.0",
     "@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/icons-material": "^5.10.16",
-    "@mui/lab": "^5.0.0-alpha.112",
-    "@mui/material": "^5.10.16",
+    "@mui/icons-material": "9.1.0",
     "@tanstack/react-query": "^4.29.3",
     "@types/classnames": "^2.3.1",
     "@types/react": "^18.2.0",
@@ -77,8 +73,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",