@gridsuite/commons-ui 0.238.0 → 0.240.0

package/dist/features/parameters/dynamic-simulation/solver/solver-parameters.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { useEffect } from "react";
 import { useFormContext, useWatch } from "react-hook-form";
 import { SolverType } from "../../../../utils/types/dynamic-simulation.type.js";
@@ -38,7 +38,7 @@ function SolverParameters({ path }) {
       sx: { width: "100%" }
     }
   ];
-  return /* @__PURE__ */ jsxs(Grid, { container: true, children: [
+  return /* @__PURE__ */ jsxs(Grid2, { container: true, children: [
     params.map((param) => {
       const { name, type, ...otherParams } = param;
       return /* @__PURE__ */ jsx(ParameterField, { id: path, name: param.name, type: param.type, ...otherParams }, param.name);

package/dist/features/parameters/dynamic-simulation/time-delay/time-delay-parameters.d.ts

@@ -1,3 +1,3 @@
 export declare function TimeDelayParameters({ path }: Readonly<{
     path: string;
-}>): import("react/jsx-runtime").JSX.Element;
+}>): import("react").JSX.Element;

package/dist/features/parameters/dynamic-simulation/time-delay/time-delay-parameters.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import "../../../../utils/conversionUtils.js";
 import "../../../../utils/types/equipmentType.js";
 import { ParameterType } from "../../../../utils/types/parameters.type.js";
@@ -19,7 +19,7 @@ const params = [
   }
 ];
 function TimeDelayParameters({ path }) {
-  return /* @__PURE__ */ jsx(Grid, { container: true, children: params.map((param) => {
+  return /* @__PURE__ */ jsx(Grid2, { container: true, children: params.map((param) => {
     const { name, type, ...otherParams } = param;
     return /* @__PURE__ */ jsx(ParameterField, { id: path, name: param.name, type: param.type, ...otherParams }, param.name);
   }) });

package/dist/features/parameters/index.js

@@ -1,4 +1,4 @@
-import { ComputingType, formatComputingTypeLabel, isValidComputingType } from "./common/computing-type.js";
+import { formatComputingTypeLabel, isValidComputingType } from "./common/computing-type.js";
 import { COMMON_PARAMETERS, CONTINGENCIES, CONTINGENCY_LISTS, CONTINGENCY_LISTS_INFOS, PARAM_SA_FLOW_PROPORTIONAL_THRESHOLD, PARAM_SA_HIGH_VOLTAGE_ABSOLUTE_THRESHOLD, PARAM_SA_HIGH_VOLTAGE_PROPORTIONAL_THRESHOLD, PARAM_SA_LOW_VOLTAGE_ABSOLUTE_THRESHOLD, PARAM_SA_LOW_VOLTAGE_PROPORTIONAL_THRESHOLD, PARAM_SA_PROVIDER, PROVIDER, SPECIFIC_PARAMETERS, VERSION_PARAMETER, VOLTAGE_LEVEL } from "./common/constants.js";
 import { LineSeparator } from "./common/line-separator.js";
 import { LabelledButton, SwitchWithLabel, TabPanel } from "./common/parameters.js";
@@ -69,7 +69,6 @@ export {
   CONTINGENCY_LISTS_INFOS,
   COUNTRIES_TO_BALANCE,
   CUSTOM_REAL_TIME_STATE_ESTIMATION,
-  ComputingType,
   ContingencyTable,
   CreateParameterDialog,
   CustomVoltageLevelTable,

package/dist/features/parameters/loadflow/load-flow-general-parameters.d.ts

@@ -3,6 +3,6 @@ interface LoadFlowGeneralParametersProps {
     provider: string;
     specificParams: SpecificParameterInfos[];
 }
-declare function LoadFlowGeneralParameters({ provider, specificParams }: Readonly<LoadFlowGeneralParametersProps>): import("react/jsx-runtime").JSX.Element;
+declare function LoadFlowGeneralParameters({ provider, specificParams }: Readonly<LoadFlowGeneralParametersProps>): import("react").JSX.Element;
 declare const _default: import('react').MemoExoticComponent<typeof LoadFlowGeneralParameters>;
 export default _default;

package/dist/features/parameters/loadflow/load-flow-parameters-content.d.ts

@@ -9,5 +9,5 @@ type LoadFlowParametersContentProps = {
     params: LoadFlowParametersInfos | null;
     defaultLimitReductions: ILimitReductionsByVoltageLevel[];
 };
-declare function LoadFlowParametersContent({ selectedTab, currentProvider, specificParameters, params, defaultLimitReductions, }: Readonly<LoadFlowParametersContentProps>): import("react/jsx-runtime").JSX.Element;
+declare function LoadFlowParametersContent({ selectedTab, currentProvider, specificParameters, params, defaultLimitReductions, }: Readonly<LoadFlowParametersContentProps>): import("react").JSX.Element;
 export default LoadFlowParametersContent;

package/dist/features/parameters/loadflow/load-flow-parameters-content.js

@@ -1,13 +1,13 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Box, Grid } from "@mui/material";
+import { Box, Grid2 } from "@mui/material";
 import { TabValues } from "./load-flow-parameters-utils.js";
 import LoadFlowGeneralParameters from "./load-flow-general-parameters.js";
-import { TabPanel } from "../common/parameters.js";
-import "react";
-import "react-intl";
 import "../../../utils/conversionUtils.js";
 import "../../../utils/types/equipmentType.js";
 import "@mui/icons-material";
+import { TabPanel } from "../common/parameters.js";
+import "react";
+import "react-intl";
 import "localized-countries";
 import "localized-countries/data/fr";
 import "localized-countries/data/en";
@@ -62,9 +62,9 @@ function LoadFlowParametersContent({
   params,
   defaultLimitReductions
 }) {
-  return /* @__PURE__ */ jsx(Box, { sx: styles.wrapper, children: /* @__PURE__ */ jsx(Grid, { container: true, sx: styles.container, children: /* @__PURE__ */ jsxs(Grid, { item: true, sx: styles.maxWidth, children: [
+  return /* @__PURE__ */ jsx(Box, { sx: styles.wrapper, children: /* @__PURE__ */ jsx(Grid2, { container: true, sx: styles.container, children: /* @__PURE__ */ jsxs(Grid2, { sx: styles.maxWidth, children: [
     /* @__PURE__ */ jsx(TabPanel, { value: selectedTab, index: TabValues.GENERAL, children: /* @__PURE__ */ jsx(LoadFlowGeneralParameters, { provider: currentProvider, specificParams: specificParameters }) }),
-    /* @__PURE__ */ jsx(TabPanel, { value: selectedTab, index: TabValues.LIMIT_REDUCTIONS, children: /* @__PURE__ */ jsx(Grid, { container: true, sx: { width: "100%" }, children: currentProvider === PARAM_PROVIDER_OPENLOADFLOW ? /* @__PURE__ */ jsx(LimitReductionsTableForm, { limits: params?.limitReductions ?? defaultLimitReductions }) : /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(TabPanel, { value: selectedTab, index: TabValues.LIMIT_REDUCTIONS, children: /* @__PURE__ */ jsx(Grid2, { container: true, sx: { width: "100%" }, children: currentProvider === PARAM_PROVIDER_OPENLOADFLOW ? /* @__PURE__ */ jsx(LimitReductionsTableForm, { limits: params?.limitReductions ?? defaultLimitReductions }) : /* @__PURE__ */ jsx(
       ParameterLineSlider,
       {
         name: PARAM_LIMIT_REDUCTION,

package/dist/features/parameters/loadflow/load-flow-parameters-dialog.d.ts

@@ -1,2 +1,2 @@
 import { ParametersEditionDialogProps } from '../common';
-export declare function LoadFlowParametersEditionDialog({ id, open, onClose, titleId, name, description, activeDirectory, userProfile, language, isDeveloperMode, }: Readonly<ParametersEditionDialogProps>): import("react/jsx-runtime").JSX.Element;
+export declare function LoadFlowParametersEditionDialog({ id, open, onClose, titleId, name, description, activeDirectory, userProfile, language, isDeveloperMode, }: Readonly<ParametersEditionDialogProps>): import("react").JSX.Element;

package/dist/features/parameters/loadflow/load-flow-parameters-dialog.js

@@ -5,6 +5,7 @@ import "../../../components/ui/dialogs/elementSaveDialog/ElementSaveDialog.js";
 import "../../../utils/conversionUtils.js";
 import { ElementType } from "../../../utils/types/elementType.js";
 import "../../../utils/types/equipmentType.js";
+import { ComputingType } from "../../../utils/types/computing-type.js";
 import { LANG_ENGLISH } from "../../../utils/langs.js";
 import "@mui/icons-material";
 import { getLoadFlowDefaultLimitReductions, getLoadFlowProviders, fetchLoadFlowParameters, setLoadFlowParameters, getLoadFlowSpecificParametersDescription } from "../../../services/loadflow.js";
@@ -20,9 +21,12 @@ import "notistack";
 import { useParametersBackend, OptionalServicesStatus } from "../../../hooks/use-parameters-backend.js";
 import "@hello-pangea/dnd";
 import "../../../components/ui/overflowableText/OverflowableText.js";
-import { ComputingType } from "../common/computing-type.js";
-import "../../../components/ui/reactHookForm/provider/CustomFormProvider.js";
+import { LoadFlowProvider } from "./load-flow-parameters-provider.js";
+import { useLoadFlowParametersForm } from "./use-load-flow-parameters-form.js";
+import { LoadFlowParametersForm } from "./load-flow-parameters-form.js";
+import { NameElementEditorForm } from "../common/name-element-editor/name-element-editor-form.js";
 import "yup";
+import "../../../components/ui/reactHookForm/provider/CustomFormProvider.js";
 import "../../../components/ui/reactHookForm/numbers/RangeInput.js";
 import "@material-symbols/svg-400/outlined/left_panel_open.svg?react";
 import "@material-symbols/svg-400/outlined/arrows_output.svg?react";
@@ -35,15 +39,6 @@ import "../../../components/ui/snackbarProvider/SnackbarProvider.js";
 import "mui-nested-menu";
 import "react-resizable-panels";
 import "react-papaparse";
-import "../common/widget/parameter-line-slider.js";
-import "../common/limitreductions/columns-definitions.js";
-import "../common/contingency-table/contingency-table.js";
-import "../common/contingency-table/columns-definitions.js";
-import "@hookform/resolvers/yup";
-import { NameElementEditorForm } from "../common/name-element-editor/name-element-editor-form.js";
-import { LoadFlowProvider } from "./load-flow-parameters-provider.js";
-import { useLoadFlowParametersForm } from "./use-load-flow-parameters-form.js";
-import { LoadFlowParametersForm } from "./load-flow-parameters-form.js";
 function LoadFlowParametersEditionDialog({
   id,
   open,

package/dist/features/parameters/loadflow/load-flow-parameters-form.d.ts

@@ -7,5 +7,5 @@ interface LoadFlowParametersFormProps {
     renderTitleFields?: () => ReactNode;
     renderActions?: () => ReactNode;
 }
-export declare function LoadFlowParametersForm({ loadflowMethods, language, renderTitleFields, renderActions, }: Readonly<LoadFlowParametersFormProps>): import("react/jsx-runtime").JSX.Element;
+export declare function LoadFlowParametersForm({ loadflowMethods, language, renderTitleFields, renderActions, }: Readonly<LoadFlowParametersFormProps>): import("react").JSX.Element;
 export {};

package/dist/features/parameters/loadflow/load-flow-parameters-form.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Box, Grid, LinearProgress } from "@mui/material";
+import { Box, Grid2, LinearProgress } from "@mui/material";
 import LoadFlowParametersHeader from "./load-flow-parameters-header.js";
 import LoadFlowParametersContent from "./load-flow-parameters-content.js";
 import "@mui/icons-material";
@@ -87,7 +87,7 @@ function LoadFlowParametersForm({
           formattedProviders
         }
       ),
-      /* @__PURE__ */ jsx(Grid, { container: true, sx: styles.content, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(Grid2, { container: true, sx: styles.content, children: /* @__PURE__ */ jsx(
         LoadFlowParametersContent,
         {
           selectedTab,

package/dist/features/parameters/loadflow/load-flow-parameters-header.d.ts

@@ -8,5 +8,5 @@ declare function LoadFlowParametersHeader({ selectedTab, handleTabChange, tabInd
         id: string;
         label: string;
     }[];
-}>): import("react/jsx-runtime").JSX.Element;
+}>): React.JSX.Element;
 export default LoadFlowParametersHeader;

package/dist/features/parameters/loadflow/load-flow-parameters-header.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Box, Grid, Tabs, Tab } from "@mui/material";
+import { Box, Grid2, Tabs, Tab } from "@mui/material";
 import { FormattedMessage } from "react-intl";
 import { TabValues } from "./load-flow-parameters-utils.js";
 import { parametersStyles, getTabStyle } from "../parameters-style.js";
@@ -47,7 +47,7 @@ function LoadFlowParametersHeader({
   formattedProviders
 }) {
   return /* @__PURE__ */ jsx(Box, { sx: { flexGrow: 0, paddingLeft: 1, paddingTop: 1 }, children: /* @__PURE__ */ jsxs(
-    Grid,
+    Grid2,
     {
       container: true,
       spacing: 1,
@@ -58,8 +58,8 @@ function LoadFlowParametersHeader({
       },
       justifyContent: "space-between",
       children: [
-        /* @__PURE__ */ jsx(Grid, { item: true, xs: 5, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: "Provider" }) }),
-        /* @__PURE__ */ jsx(Grid, { item: true, xs: "auto", sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(Grid2, { size: "grow", sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: "Provider" }) }),
+        /* @__PURE__ */ jsx(Grid2, { container: true, size: "auto", sx: { justifyContent: "flex-end" }, children: /* @__PURE__ */ jsx(
           MuiSelectInput,
           {
             "data-testid": "LfProvider",
@@ -69,7 +69,7 @@ function LoadFlowParametersHeader({
           }
         ) }),
         /* @__PURE__ */ jsx(LineSeparator, {}),
-        /* @__PURE__ */ jsx(Grid, { item: true, sx: { width: "100%" }, children: /* @__PURE__ */ jsxs(Tabs, { value: selectedTab, onChange: handleTabChange, children: [
+        /* @__PURE__ */ jsx(Grid2, { size: 12, children: /* @__PURE__ */ jsxs(Tabs, { value: selectedTab, onChange: handleTabChange, children: [
           /* @__PURE__ */ jsx(
             Tab,
             {

package/dist/features/parameters/loadflow/load-flow-parameters-inline.d.ts

@@ -1,11 +1,10 @@
 import { UUID } from 'node:crypto';
 import { UseParametersBackendReturnProps } from '../../../utils/types/parameters.type';
-import { ComputingType } from '../common/computing-type';
-import { GsLang } from '../../../utils';
+import { ComputingType, GsLang } from '../../../utils';
 export declare function LoadFlowParametersInline({ studyUuid, language, parametersBackend, setHaveDirtyFields, isDeveloperMode, }: Readonly<{
     studyUuid: UUID | null;
     language: GsLang;
     parametersBackend: UseParametersBackendReturnProps<ComputingType.LOAD_FLOW>;
     setHaveDirtyFields: (isDirty: boolean) => void;
     isDeveloperMode: boolean;
-}>): import("react/jsx-runtime").JSX.Element;
+}>): import("react").JSX.Element;

package/dist/features/parameters/loadflow/load-flow-parameters-inline.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useCallback, useEffect } from "react";
-import { Box, Grid } from "@mui/material";
+import { Box, Grid2 } from "@mui/material";
 import { useIntl, FormattedMessage } from "react-intl";
 import { LoadFlowProvider } from "./load-flow-parameters-provider.js";
 import { parametersStyles } from "../parameters-style.js";
@@ -103,10 +103,9 @@ function LoadFlowParametersInline({
         return /* @__PURE__ */ jsxs(Box, { children: [
           /* @__PURE__ */ jsx(LineSeparator, {}),
           /* @__PURE__ */ jsxs(
-            Grid,
+            Grid2,
             {
               container: true,
-              item: true,
               sx: mergeSx(parametersStyles.controlParametersItem, parametersStyles.marginTopButton, {
                 paddingBottom: 0
               }),

package/dist/features/parameters/loadflow/load-flow-parameters-provider.d.ts

@@ -1,4 +1,4 @@
 import { ReactNode } from 'react';
 export declare function LoadFlowProvider({ children }: Readonly<{
     children: ReactNode;
-}>): import("react/jsx-runtime").JSX.Element;
+}>): import("react").JSX.Element;

package/dist/features/parameters/loadflow/load-flow-parameters-utils.js

@@ -1,12 +1,12 @@
 import * as yup from "yup";
-import { COMMON_PARAMETERS } from "../common/constants.js";
+import "../../../utils/conversionUtils.js";
+import "../../../utils/types/equipmentType.js";
 import "react/jsx-runtime";
+import "@mui/icons-material";
+import { COMMON_PARAMETERS } from "../common/constants.js";
 import "@mui/material";
 import "react-intl";
 import "react";
-import "../../../utils/conversionUtils.js";
-import "../../../utils/types/equipmentType.js";
-import "@mui/icons-material";
 import "localized-countries";
 import "localized-countries/data/fr";
 import "localized-countries/data/en";
@@ -31,12 +31,12 @@ import "mui-nested-menu";
 import "react-resizable-panels";
 import "react-papaparse";
 import "../common/widget/parameter-line-slider.js";
-import { LIMIT_REDUCTIONS_FORM, toFormValuesLimitReductions, IST_FORM, LIMIT_DURATION_FORM } from "../common/limitreductions/columns-definitions.js";
+import { IST_FORM, LIMIT_DURATION_FORM, LIMIT_REDUCTIONS_FORM, toFormValuesLimitReductions } from "../common/limitreductions/columns-definitions.js";
 import "../common/contingency-table/contingency-table.js";
 import "../common/contingency-table/columns-definitions.js";
 import "@hookform/resolvers/yup";
 import "../../../components/composite/filter/HeaderFilterForm.js";
-import { HVDC_AC_EMULATION, CONNECTED_MODE, COUNTRIES_TO_BALANCE, BALANCE_TYPE, DC, PHASE_SHIFTER_REGULATION_ON, DC_POWER_FACTOR, DC_USE_TRANSFORMER_RATIO, SHUNT_COMPENSATOR_VOLTAGE_CONTROL_ON, DISTRIBUTED_SLACK, WRITE_SLACK_BUS, READ_SLACK_BUS, TWT_SPLIT_SHUNT_ADMITTANCE, USE_REACTIVE_LIMITS, VOLTAGE_INIT_MODE, PARAM_PROVIDER_OPENLOADFLOW, PARAM_LIMIT_REDUCTION, DEFAULT_LIMIT_REDUCTION_VALUE } from "./constants.js";
+import { DC_POWER_FACTOR, DC_USE_TRANSFORMER_RATIO, SHUNT_COMPENSATOR_VOLTAGE_CONTROL_ON, DISTRIBUTED_SLACK, WRITE_SLACK_BUS, READ_SLACK_BUS, TWT_SPLIT_SHUNT_ADMITTANCE, USE_REACTIVE_LIMITS, VOLTAGE_INIT_MODE, HVDC_AC_EMULATION, CONNECTED_MODE, COUNTRIES_TO_BALANCE, BALANCE_TYPE, DC, PHASE_SHIFTER_REGULATION_ON, PARAM_PROVIDER_OPENLOADFLOW, PARAM_LIMIT_REDUCTION, DEFAULT_LIMIT_REDUCTION_VALUE } from "./constants.js";
 var TabValues = /* @__PURE__ */ ((TabValues2) => {
   TabValues2["GENERAL"] = "General";
   TabValues2["LIMIT_REDUCTIONS"] = "LimitReductions";

package/dist/features/parameters/loadflow/use-load-flow-parameters-form.d.ts

@@ -3,9 +3,8 @@ import { SyntheticEvent } from 'react';
 import { UUID } from 'node:crypto';
 import { TabValues } from './load-flow-parameters-utils';
 import { LoadFlowParametersInfos } from './load-flow-parameters-type';
-import { ComputingType } from '../common';
 import { ILimitReductionsByVoltageLevel } from '../common/limitreductions/columns-definitions';
-import { SpecificParameterInfos, UseParametersBackendReturnProps } from '../../../utils';
+import { ComputingType, SpecificParameterInfos, UseParametersBackendReturnProps } from '../../../utils';
 import * as yup from 'yup';
 export interface UseLoadFlowParametersFormReturn {
     formMethods: UseFormReturn;

package/dist/features/parameters/loadflow/use-load-flow-parameters-form.js

@@ -3,15 +3,15 @@ import { yupResolver } from "@hookform/resolvers/yup";
 import { useState, useRef, useCallback, useMemo, useEffect, useEffectEvent } from "react";
 import * as yup from "yup";
 import { TabValues, getCommonLoadFlowParametersFormSchema, mapLimitReductions, setLimitReductions } from "./load-flow-parameters-utils.js";
-import { PROVIDER, SPECIFIC_PARAMETERS, COMMON_PARAMETERS, VERSION_PARAMETER } from "../common/constants.js";
-import "react/jsx-runtime";
-import "@mui/material";
-import "react-intl";
 import "../../../utils/conversionUtils.js";
 import { snackWithFallback } from "../../../utils/error.js";
 import { ElementType } from "../../../utils/types/elementType.js";
 import "../../../utils/types/equipmentType.js";
+import "react/jsx-runtime";
 import "@mui/icons-material";
+import { PROVIDER, SPECIFIC_PARAMETERS, COMMON_PARAMETERS, VERSION_PARAMETER } from "../common/constants.js";
+import "@mui/material";
+import "react-intl";
 import { updateParameter } from "../../../services/explore.js";
 import "localized-countries";
 import "localized-countries/data/fr";

package/dist/features/parameters/network-visualizations/map-parameters.d.ts

@@ -1 +1 @@
-export declare function MapParameters(): import("react/jsx-runtime").JSX.Element;
+export declare function MapParameters(): import("react").JSX.Element;

package/dist/features/parameters/network-visualizations/map-parameters.js

@@ -1,14 +1,14 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { FormattedMessage } from "react-intl";
 import { useState, useEffect } from "react";
 import { MAP_BASE_MAP, NetworkVisualizationTabValues, PARAM_MAP_BASEMAP, PARAM_LINE_FULL_PATH, PARAM_LINE_PARALLEL_PATH, INTL_LINE_FLOW_MODE_OPTIONS, LINE_FLOW_MODE, PARAM_LINE_FLOW_MODE, MAP_MANUAL_REFRESH, PARAM_MAP_MANUAL_REFRESH } from "./constants.js";
-import { LineSeparator } from "../common/line-separator.js";
-import { parametersStyles } from "../parameters-style.js";
 import "../../../utils/conversionUtils.js";
 import { snackWithFallback } from "../../../utils/error.js";
 import "../../../utils/types/equipmentType.js";
 import "@mui/icons-material";
+import { LineSeparator } from "../common/line-separator.js";
+import { parametersStyles } from "../parameters-style.js";
 import { fetchStudyMetadata } from "../../../services/appsMetadata.js";
 import "localized-countries";
 import "localized-countries/data/fr";
@@ -59,12 +59,12 @@ function MapParameters() {
     });
   }, [setBaseMapOptions, snackError]);
   const lineSwitch = (name, label) => /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: label }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, container: true, xs: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(SwitchInput, { name: `${NetworkVisualizationTabValues.MAP}.${name}` }) })
+    /* @__PURE__ */ jsx(Grid2, { size: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: label }) }),
+    /* @__PURE__ */ jsx(Grid2, { container: true, size: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(SwitchInput, { name: `${NetworkVisualizationTabValues.MAP}.${name}` }) })
   ] });
   const lineFlow = (name, label, options) => /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: label }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Grid2, { size: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: label }) }),
+    /* @__PURE__ */ jsx(Grid2, { size: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(
       MuiSelectInput,
       {
         fullWidth: true,
@@ -75,8 +75,8 @@ function MapParameters() {
     ) })
   ] });
   const mapBaseMap = /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: MAP_BASE_MAP }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Grid2, { size: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: MAP_BASE_MAP }) }),
+    /* @__PURE__ */ jsx(Grid2, { size: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(
       MuiSelectInput,
       {
         fullWidth: true,
@@ -87,7 +87,7 @@ function MapParameters() {
     ) })
   ] });
   return /* @__PURE__ */ jsxs(
-    Grid,
+    Grid2,
     {
       container: true,
       spacing: 1,

package/dist/features/parameters/network-visualizations/network-area-diagram-parameters.d.ts

@@ -1 +1 @@
-export declare function NetworkAreaDiagramParameters(): import("react/jsx-runtime").JSX.Element;
+export declare function NetworkAreaDiagramParameters(): import("react").JSX.Element;

package/dist/features/parameters/network-visualizations/network-area-diagram-parameters.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { FormattedMessage } from "react-intl";
 import { NAD_POSITIONS_GENERATION_MODE_LABEL, NetworkVisualizationTabValues, PARAM_NAD_POSITIONS_GENERATION_MODE, NAD_POSITIONS_GENERATION_MODE } from "./constants.js";
 import { parametersStyles } from "../parameters-style.js";
@@ -34,7 +34,7 @@ import "react-resizable-panels";
 import "react-papaparse";
 function NetworkAreaDiagramParameters() {
   return /* @__PURE__ */ jsxs(
-    Grid,
+    Grid2,
     {
       container: true,
       spacing: 1,
@@ -42,8 +42,8 @@ function NetworkAreaDiagramParameters() {
       marginTop: -3,
       justifyContent: "space-between",
       children: [
-        /* @__PURE__ */ jsx(Grid, { item: true, xs: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: NAD_POSITIONS_GENERATION_MODE_LABEL }) }),
-        /* @__PURE__ */ jsx(Grid, { item: true, container: true, xs: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(Grid2, { size: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: NAD_POSITIONS_GENERATION_MODE_LABEL }) }),
+        /* @__PURE__ */ jsx(Grid2, { container: true, size: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(
           MuiSelectInput,
           {
             fullWidth: true,

package/dist/features/parameters/network-visualizations/network-visualizations-form.d.ts

@@ -7,5 +7,5 @@ interface NetworkVisualizationParametersFormProps {
     renderActions?: () => ReactNode;
     userProfile: UserProfile | null;
 }
-export declare function NetworkVisualizationParametersForm({ networkVisuMethods, renderTitleFields, renderActions, userProfile, }: Readonly<NetworkVisualizationParametersFormProps>): import("react/jsx-runtime").JSX.Element;
+export declare function NetworkVisualizationParametersForm({ networkVisuMethods, renderTitleFields, renderActions, userProfile, }: Readonly<NetworkVisualizationParametersFormProps>): import("react").JSX.Element;
 export {};

package/dist/features/parameters/network-visualizations/network-visualizations-form.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Grid, LinearProgress, Tabs, Tab } from "@mui/material";
+import { Stack, LinearProgress, Tabs, Tab } from "@mui/material";
 import { useState, useEffect } from "react";
 import { FormattedMessage } from "react-intl";
 import "@mui/icons-material";
@@ -62,9 +62,9 @@ function NetworkVisualizationParametersForm({
 }) {
   const componentLibraries = useGetAvailableComponentLibraries(userProfile);
   const { formMethods, formSchema, selectedTab, handleTabChange, paramsLoading } = networkVisuMethods;
-  return /* @__PURE__ */ jsx(CustomFormProvider, { validationSchema: formSchema, ...formMethods, removeOptional: true, children: /* @__PURE__ */ jsxs(Grid, { container: true, direction: "column", children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, container: true, direction: "column", children: renderTitleFields?.() }),
-    paramsLoading ? /* @__PURE__ */ jsx(LinearProgress, {}) : /* @__PURE__ */ jsxs(Grid, { item: true, container: true, direction: "column", children: [
+  return /* @__PURE__ */ jsx(CustomFormProvider, { validationSchema: formSchema, ...formMethods, removeOptional: true, children: /* @__PURE__ */ jsxs(Stack, { children: [
+    /* @__PURE__ */ jsx(Stack, { children: renderTitleFields?.() }),
+    paramsLoading ? /* @__PURE__ */ jsx(LinearProgress, {}) : /* @__PURE__ */ jsxs(Stack, { children: [
       /* @__PURE__ */ jsxs(Tabs, { value: selectedTab, variant: "scrollable", onChange: handleTabChange, children: [
         /* @__PURE__ */ jsx(Tab, { label: /* @__PURE__ */ jsx(FormattedMessage, { id: "Map" }), value: NetworkVisualizationTabValues.MAP }),
         /* @__PURE__ */ jsx(
@@ -87,11 +87,8 @@ function NetworkVisualizationParametersForm({
       /* @__PURE__ */ jsx(TabPanel, { value: selectedTab, index: NetworkVisualizationTabValues.NETWORK_AREA_DIAGRAM, children: /* @__PURE__ */ jsx(NetworkAreaDiagramParameters, {}) })
     ] }),
     /* @__PURE__ */ jsx(
-      Grid,
+      Stack,
       {
-        item: true,
-        container: true,
-        direction: "column",
         sx: {
           position: "absolute",
           bottom: "30px"

package/dist/features/parameters/network-visualizations/network-visualizations-parameters-dialog.d.ts

@@ -1,2 +1,2 @@
 import { ParametersEditionDialogProps } from '../common';
-export declare function NetworkVisualizationsParametersEditionDialog({ id, open, onClose, titleId, name, description, activeDirectory, language, userProfile, }: Readonly<ParametersEditionDialogProps>): import("react/jsx-runtime").JSX.Element;
+export declare function NetworkVisualizationsParametersEditionDialog({ id, open, onClose, titleId, name, description, activeDirectory, language, userProfile, }: Readonly<ParametersEditionDialogProps>): import("react").JSX.Element;

package/dist/features/parameters/network-visualizations/network-visualizations-parameters-inline.d.ts

@@ -6,4 +6,4 @@ export declare function NetworkVisualizationParametersInline({ studyUuid, setHav
     setHaveDirtyFields: (isDirty: boolean) => void;
     userProfile: UserProfile | null;
     parameters: NetworkVisualizationParameters | null;
-}>): import("react/jsx-runtime").JSX.Element;
+}>): import("react").JSX.Element;

package/dist/features/parameters/network-visualizations/network-visualizations-parameters-inline.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useCallback, useEffect } from "react";
-import { Box, Grid } from "@mui/material";
+import { Box, Grid2 } from "@mui/material";
 import { useIntl, FormattedMessage } from "react-intl";
 import "../../../utils/conversionUtils.js";
 import { snackWithFallback } from "../../../utils/error.js";
@@ -88,7 +88,7 @@ function NetworkVisualizationParametersInline({
       networkVisuMethods,
       renderActions: () => {
         return /* @__PURE__ */ jsxs(Box, { children: [
-          /* @__PURE__ */ jsxs(Grid, { container: true, item: true, children: [
+          /* @__PURE__ */ jsxs(Grid2, { container: true, children: [
             /* @__PURE__ */ jsx(
               LabelledButton,
               {

package/dist/features/parameters/network-visualizations/single-line-diagram-parameters.d.ts

@@ -7,4 +7,4 @@
 export interface SingleLineDiagramParametersProps {
     componentLibraries: string[];
 }
-export declare function SingleLineDiagramParameters({ componentLibraries }: Readonly<SingleLineDiagramParametersProps>): import("react/jsx-runtime").JSX.Element;
+export declare function SingleLineDiagramParameters({ componentLibraries }: Readonly<SingleLineDiagramParametersProps>): import("react").JSX.Element;

package/dist/features/parameters/network-visualizations/single-line-diagram-parameters.js

@@ -1,12 +1,12 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { useMemo } from "react";
 import { FormattedMessage } from "react-intl";
-import { LineSeparator } from "../common/line-separator.js";
-import { parametersStyles } from "../parameters-style.js";
 import "../../../utils/conversionUtils.js";
 import "../../../utils/types/equipmentType.js";
 import "@mui/icons-material";
+import { LineSeparator } from "../common/line-separator.js";
+import { parametersStyles } from "../parameters-style.js";
 import "localized-countries";
 import "localized-countries/data/fr";
 import "localized-countries/data/en";
@@ -49,12 +49,12 @@ function SingleLineDiagramParameters({ componentLibraries }) {
     return INTL_SUBSTATION_LAYOUT_OPTIONS;
   }, []);
   const labelPosition = (name, label) => /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: label }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, container: true, xs: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(SwitchInput, { name: `${NetworkVisualizationTabValues.SINGLE_LINE_DIAGRAM}.${name}` }) })
+    /* @__PURE__ */ jsx(Grid2, { size: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: label }) }),
+    /* @__PURE__ */ jsx(Grid2, { container: true, size: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(SwitchInput, { name: `${NetworkVisualizationTabValues.SINGLE_LINE_DIAGRAM}.${name}` }) })
   ] });
   const substationLineDropDown = /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: SUBSTATION_LAYOUT }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Grid2, { size: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: SUBSTATION_LAYOUT }) }),
+    /* @__PURE__ */ jsx(Grid2, { size: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(
       MuiSelectInput,
       {
         fullWidth: true,
@@ -65,8 +65,8 @@ function SingleLineDiagramParameters({ componentLibraries }) {
     ) })
   ] });
   const componentLineDropDown = /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: COMPONENT_LIBRARY }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Grid2, { size: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: COMPONENT_LIBRARY }) }),
+    /* @__PURE__ */ jsx(Grid2, { size: 4, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(
       MuiSelectInput,
       {
         fullWidth: true,
@@ -79,7 +79,7 @@ function SingleLineDiagramParameters({ componentLibraries }) {
     ) })
   ] });
   return /* @__PURE__ */ jsxs(
-    Grid,
+    Grid2,
     {
       container: true,
       spacing: 1,

package/dist/features/parameters/pcc-min/pcc-min-parameters-dialog.d.ts

@@ -1,2 +1,2 @@
 import { ParametersEditionDialogProps } from '../common';
-export declare function PccMinParametersEditionDialog({ id, open, onClose, titleId, name, description, activeDirectory, language, }: Readonly<ParametersEditionDialogProps>): import("react/jsx-runtime").JSX.Element;
+export declare function PccMinParametersEditionDialog({ id, open, onClose, titleId, name, description, activeDirectory, language, }: Readonly<ParametersEditionDialogProps>): import("react").JSX.Element;

package/dist/features/parameters/pcc-min/pcc-min-parameters-form.d.ts

@@ -25,5 +25,5 @@ interface PccMinParametersFormProps {
     renderTitleFields?: () => ReactNode;
     renderActions?: () => ReactNode;
 }
-export declare function PccMinParametersForm({ pccMinMethods, renderTitleFields, renderActions, }: Readonly<PccMinParametersFormProps>): import("react/jsx-runtime").JSX.Element;
+export declare function PccMinParametersForm({ pccMinMethods, renderTitleFields, renderActions, }: Readonly<PccMinParametersFormProps>): import("react").JSX.Element;
 export {};

package/dist/features/parameters/pcc-min/pcc-min-parameters-form.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Box, Grid, LinearProgress } from "@mui/material";
+import { Box, Grid2, Stack, LinearProgress } from "@mui/material";
 import "@mui/icons-material";
 import "react-intl";
 import "../../../components/ui/overflowableText/OverflowableText.js";
@@ -72,8 +72,8 @@ function PccMinParametersForm({
         position: "relative"
       },
       children: [
-        /* @__PURE__ */ jsxs(Grid, { item: true, container: true, sx: renderActions ? styles.gridWithActions : styles.gridWithoutActions, children: [
-          /* @__PURE__ */ jsx(Grid, { item: true, container: true, direction: "column", children: renderTitleFields?.() }),
+        /* @__PURE__ */ jsxs(Grid2, { container: true, sx: renderActions ? styles.gridWithActions : styles.gridWithoutActions, children: [
+          /* @__PURE__ */ jsx(Stack, { children: renderTitleFields?.() }),
           paramsLoading ? /* @__PURE__ */ jsx(LinearProgress, {}) : /* @__PURE__ */ jsx(
             Box,
             {
@@ -81,7 +81,7 @@ function PccMinParametersForm({
                 height: "100%",
                 width: "100%"
               },
-              children: /* @__PURE__ */ jsx(Grid, { item: true, container: true, direction: "column", children: /* @__PURE__ */ jsx(
+              children: /* @__PURE__ */ jsx(Stack, { children: /* @__PURE__ */ jsx(
                 ParameterLineDirectoryItemsInput,
                 {
                   name: FILTERS,
@@ -96,11 +96,8 @@ function PccMinParametersForm({
           )
         ] }),
         renderActions && /* @__PURE__ */ jsx(
-          Grid,
+          Stack,
           {
-            item: true,
-            container: true,
-            direction: "column",
             sx: {
               position: "fixed",
               bottom: "15px"