@gridsuite/commons-ui 0.239.0 → 0.241.0

package/dist/features/network-modifications/common/connectivity/VoltageLevelConnectivityForm.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { useState, useRef, useCallback, useMemo, useEffect } from "react";
 import { useWatch } from "react-hook-form";
 import "@mui/icons-material";
@@ -107,8 +107,8 @@ function VoltageLevelConnectivityForm({
       setBusOrBusbarSectionOptions([]);
     }
   }, [fetchBusesOrBusbarSections, voltageLevelOptions, watchVoltageLevelId]);
-  return /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+    /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(
       AutocompleteInput,
       {
         isOptionEqualToValue: areIdsEqual,
@@ -131,7 +131,7 @@ function VoltageLevelConnectivityForm({
         size: "small"
       }
     ) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(
       AutocompleteInput,
       {
         allowNewValue: true,

package/dist/features/network-modifications/common/measurements/BranchActiveReactivePowerMeasurementsForm.js

@@ -1,10 +1,11 @@
-import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { Box } from "@mui/material";
 import { PowerMeasurementsForm } from "./PowerMeasurementsForm.js";
-import GridSection from "../../../../components/composite/grid/grid-section.js";
+import { GridSection } from "../../../../components/composite/grid/grid-section.js";
 function BranchActiveReactivePowerMeasurementsForm({
   equipmentToModify
 }) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
+  return /* @__PURE__ */ jsxs(Box, { sx: { width: "100%" }, children: [
     /* @__PURE__ */ jsx(GridSection, { title: "MeasurementsSection" }),
     /* @__PURE__ */ jsx(GridSection, { title: "Side1", heading: 4 }),
     /* @__PURE__ */ jsx(

package/dist/features/network-modifications/common/measurements/BusbarSectionVoltageMeasurementsForm.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useFieldArray } from "react-hook-form";
-import { Grid2 } from "@mui/material";
+import { Stack, Grid2 } from "@mui/material";
 import { useIntl, FormattedMessage } from "react-intl";
 import { VoltageAdornment } from "../../../../utils/constants/adornments.js";
 import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
@@ -69,7 +69,7 @@ function BusbarSectionVoltageMeasurementsForm({
   });
   const intl = useIntl();
   const sortedFields = fields.map((field, i) => ({ ...field, originalIndex: i })).sort((a, b) => a.busbarSectionId.localeCompare(b.busbarSectionId));
-  return /* @__PURE__ */ jsxs(Grid2, { container: true, direction: "column", spacing: 1, children: [
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 1, children: [
     fields.length === 0 && /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsx(FormattedMessage, { id: "NoBusbarSectionFound" }) }),
     sortedFields.map((field) => {
       const { busbarSectionId: bbsId, originalIndex } = field;

package/dist/features/network-modifications/common/measurements/PowerMeasurementsForm.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Stack, Grid2 } from "@mui/material";
 import { PowerWithValidityForm } from "./PowerWithValidityForm.js";
 import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
 import "../../../../utils/conversionUtils.js";
@@ -31,8 +31,8 @@ function PowerMeasurementsForm({
     activePowerId = `${idPrefix}.${activePowerId}`;
     reactivePowerId = `${idPrefix}.${reactivePowerId}`;
   }
-  return /* @__PURE__ */ jsxs(Grid, { container: true, direction: "column", spacing: 2, children: [
-    !reactivePowerOnly && /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 2, children: [
+    !reactivePowerOnly && /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsx(
       PowerWithValidityForm,
       {
         id: activePowerId,
@@ -40,7 +40,7 @@ function PowerMeasurementsForm({
         measurement: activePowerMeasurement
       }
     ) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsx(
       PowerWithValidityForm,
       {
         id: reactivePowerId,

package/dist/features/network-modifications/common/measurements/PowerWithValidityForm.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { useIntl } from "react-intl";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { CheckboxNullableInput } from "../../../../components/ui/reactHookForm/CheckboxNullableInput.js";
 import "@mui/icons-material";
 import "../../../../components/ui/overflowableText/OverflowableText.js";
@@ -42,8 +42,8 @@ function PowerWithValidityForm({ id, field, measurement }) {
     }
     return measurement.validity ? intl.formatMessage({ id: "ValidMeasurement" }) : intl.formatMessage({ id: "InvalidMeasurement" });
   }, [intl, measurement?.validity]);
-  return /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+    /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
       FloatInput,
       {
         name: `${id}.${FieldConstants.VALUE}`,
@@ -53,7 +53,7 @@ function PowerWithValidityForm({ id, field, measurement }) {
         clearable: true
       }
     ) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsx(
       CheckboxNullableInput,
       {
         name: `${id}.${FieldConstants.VALIDITY}`,

package/dist/features/network-modifications/common/properties/PropertiesForm.js

@@ -3,7 +3,7 @@ import { useState, useEffect, useCallback } from "react";
 import { useWatch, useFormContext } from "react-hook-form";
 import { fetchPredefinedProperties, initializedProperty } from "./propertyUtils.js";
 import { PropertyForm } from "./PropertyForm.js";
-import GridSection from "../../../../components/composite/grid/grid-section.js";
+import { GridSection } from "../../../../components/composite/grid/grid-section.js";
 import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
 import "../../../../utils/conversionUtils.js";
 import "../../../../utils/types/equipmentType.js";

package/dist/features/network-modifications/common/properties/PropertyForm.js

@@ -1,7 +1,7 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { useWatch } from "react-hook-form";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
 import "../../../../utils/conversionUtils.js";
 import "../../../../utils/types/equipmentType.js";
@@ -53,14 +53,14 @@ function PropertyForm({ name, index, predefinedProperties }) {
     return values.sort((a, b) => a.localeCompare(b));
   }, [watchPropertyName, predefinedProperties]);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    watchPropertyDeletionMark || watchPropertyAdded === false && watchPropertyPreviousValue ? /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+    watchPropertyDeletionMark || watchPropertyAdded === false && watchPropertyPreviousValue ? /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
       TextInput,
       {
         name: `${name}.${index}.${FieldConstants.NAME}`,
         label: "PropertyName",
         formProps: { disabled: true, ...italicFontTextField }
       }
-    ) }) : /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+    ) }) : /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
       AutocompleteInput,
       {
         name: `${name}.${index}.${FieldConstants.NAME}`,
@@ -70,7 +70,7 @@ function PropertyForm({ name, index, predefinedProperties }) {
         allowNewValue: true
       }
     ) }),
-    watchPropertyDeletionMark ? /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+    watchPropertyDeletionMark ? /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
       TextInput,
       {
         name: `${name}.${index}.${FieldConstants.VALUE}`,
@@ -78,7 +78,7 @@ function PropertyForm({ name, index, predefinedProperties }) {
         previousValue: watchPropertyPreviousValue,
         formProps: { disabled: true, ...italicFontTextField }
       }
-    ) }) : /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+    ) }) : /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
       AutocompleteInput,
       {
         name: `${name}.${index}.${FieldConstants.VALUE}`,

package/dist/features/network-modifications/common/reactiveLimits/ReactiveLimitsForm.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useWatch } from "react-hook-form";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { ReactiveCapabilityCurveTableForm } from "./reactiveCapabilityCurve/ReactiveCapabilityCurveTableForm.js";
 import { ReactivePowerAdornment } from "../../../../utils/constants/adornments.js";
 import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
@@ -34,7 +34,7 @@ import "../../../../components/ui/snackbarProvider/SnackbarProvider.js";
 import "mui-nested-menu";
 import "react-resizable-panels";
 import "react-papaparse";
-import GridItem from "../../../../components/composite/grid/grid-item.js";
+import { GridItem } from "../../../../components/composite/grid/grid-item.js";
 import { REACTIVE_LIMIT_TYPES } from "./reactiveLimits.utils.js";
 const headerIds = ["ActivePowerText", "MinimumReactivePower", "MaximumReactivePower"];
 function ReactiveLimitsForm({
@@ -85,7 +85,7 @@ function ReactiveLimitsForm({
       disabled: !isReactiveCapabilityCurveOn
     }
   );
-  return /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
+  return /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
     /* @__PURE__ */ jsx(GridItem, { size: 12, children: reactiveCapabilityCurveChoiceRadioField }),
     !isReactiveCapabilityCurveOn && /* @__PURE__ */ jsx(GridItem, { size: 4, children: minimumReactivePowerField }),
     !isReactiveCapabilityCurveOn && /* @__PURE__ */ jsx(GridItem, { size: 4, children: maximumReactivePowerField }),

package/dist/features/network-modifications/common/reactiveLimits/reactiveCapabilityCurve/ReactiveCapabilityCurveRowForm.js

@@ -32,7 +32,7 @@ import "../../../../../components/ui/snackbarProvider/SnackbarProvider.js";
 import "mui-nested-menu";
 import "react-resizable-panels";
 import "react-papaparse";
-import GridItem from "../../../../../components/composite/grid/grid-item.js";
+import { GridItem } from "../../../../../components/composite/grid/grid-item.js";
 function ReactiveCapabilityCurveRowForm({
   id,
   index,

package/dist/features/network-modifications/common/reactiveLimits/reactiveCapabilityCurve/ReactiveCapabilityCurveTableForm.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useFieldArray } from "react-hook-form";
 import { useCallback, useEffect } from "react";
-import { Grid, IconButton } from "@mui/material";
+import { Grid2, IconButton } from "@mui/material";
 import { Delete, ControlPoint } from "@mui/icons-material";
 import { FormattedMessage } from "react-intl";
 import { INSERT, REMOVE } from "./reactiveCapability.utils.js";
@@ -72,9 +72,9 @@ function ReactiveCapabilityCurveTableForm({
       }
     }
   }, [insertRow, rows]);
-  return /* @__PURE__ */ jsxs(Grid, { item: true, container: true, spacing: 2, children: [
-    /* @__PURE__ */ jsx(Grid, { container: true, children: /* @__PURE__ */ jsx(ErrorInput, { name: id, InputField: MidFormError }) }),
-    tableHeadersIds.map((header) => /* @__PURE__ */ jsx(Grid, { item: true, xs: 3, children: /* @__PURE__ */ jsx(FormattedMessage, { id: header }) }, header)),
+  return /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+    /* @__PURE__ */ jsx(Grid2, { container: true, children: /* @__PURE__ */ jsx(ErrorInput, { name: id, InputField: MidFormError }) }),
+    tableHeadersIds.map((header) => /* @__PURE__ */ jsx(Grid2, { size: 3, children: /* @__PURE__ */ jsx(FormattedMessage, { id: header }) }, header)),
     rows.map((value, index, displayedValues) => {
       let labelSuffix;
       if (index === 0) {
@@ -84,9 +84,9 @@ function ReactiveCapabilityCurveTableForm({
       } else {
         labelSuffix = index - 1;
       }
-      return /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 3, item: true, children: [
+      return /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 3, children: [
         /* @__PURE__ */ jsx(ReactiveCapabilityCurveRowForm, { id, index, labelSuffix }),
-        /* @__PURE__ */ jsx(Grid, { item: true, xs: 1, children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(Grid2, { size: 1, children: /* @__PURE__ */ jsx(
           IconButton,
           {
             onClick: () => handleRemoveRow(index),
@@ -95,7 +95,7 @@ function ReactiveCapabilityCurveTableForm({
           },
           value.id
         ) }),
-        index === displayedValues.length - 1 && /* @__PURE__ */ jsx(Grid, { item: true, xs: 1, children: /* @__PURE__ */ jsx(
+        index === displayedValues.length - 1 && /* @__PURE__ */ jsx(Grid2, { size: 1, children: /* @__PURE__ */ jsx(
           IconButton,
           {
             onClick: () => handleInsertRow(),

package/dist/features/network-modifications/common/regulatingTerminal/RegulatingTerminalForm.js

@@ -78,7 +78,7 @@ function RegulatingTerminalForm({
     setValue(`${id}.${FieldConstants.EQUIPMENT}`, null);
   }, [id, setValue]);
   return /* @__PURE__ */ jsxs(Grid2, { container: true, direction: direction ?? "row", spacing: 1, children: [
-    /* @__PURE__ */ jsx(Grid2, { size: itemSize, sx: { align: "start" }, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Grid2, { size: itemSize, children: /* @__PURE__ */ jsx(
       AutocompleteInput,
       {
         name: `${id}.${FieldConstants.VOLTAGE_LEVEL}`,
@@ -110,7 +110,7 @@ function RegulatingTerminalForm({
         allowNewValue: true
       }
     ) }),
-    /* @__PURE__ */ jsx(Grid2, { size: itemSize, sx: { align: "start" }, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Grid2, { size: itemSize, children: /* @__PURE__ */ jsx(
       AutocompleteInput,
       {
         name: `${id}.${FieldConstants.EQUIPMENT}`,

package/dist/features/network-modifications/common/setpoints/SetPointsForm.js

@@ -1,6 +1,6 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
-import GridSection from "../../../../components/composite/grid/grid-section.js";
+import { Grid2 } from "@mui/material";
+import { GridSection } from "../../../../components/composite/grid/grid-section.js";
 import { ActivePowerAdornment, ReactivePowerAdornment } from "../../../../utils/constants/adornments.js";
 import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
 import "../../../../utils/conversionUtils.js";
@@ -36,8 +36,8 @@ import "react-papaparse";
 function SetPointsForm({ previousValues, isModification = false }) {
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(GridSection, { title: "Setpoints" }),
-    /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+      /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
         FloatInput,
         {
           name: FieldConstants.ACTIVE_POWER_SET_POINT,
@@ -47,7 +47,7 @@ function SetPointsForm({ previousValues, isModification = false }) {
           clearable: isModification
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
         FloatInput,
         {
           name: FieldConstants.REACTIVE_POWER_SET_POINT,

package/dist/features/network-modifications/common/shortCircuit/ShortCircuitForm.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import "@mui/icons-material";
 import "react-intl";
 import "../../../../components/ui/overflowableText/OverflowableText.js";
@@ -32,7 +32,7 @@ import "../../../../components/ui/snackbarProvider/SnackbarProvider.js";
 import "mui-nested-menu";
 import "react-resizable-panels";
 import "react-papaparse";
-import GridItem from "../../../../components/composite/grid/grid-item.js";
+import { GridItem } from "../../../../components/composite/grid/grid-item.js";
 function ShortCircuitForm({ previousValues }) {
   const transientReactanceField = /* @__PURE__ */ jsx(
     FloatInput,
@@ -54,7 +54,7 @@ function ShortCircuitForm({ previousValues }) {
       clearable: true
     }
   );
-  return /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
+  return /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
     /* @__PURE__ */ jsx(GridItem, { size: 4, children: transientReactanceField }),
     /* @__PURE__ */ jsx(GridItem, { size: 4, children: transformerReactanceField })
   ] });

package/dist/features/network-modifications/common/voltageRegulation/VoltageRegulationForm.js

@@ -1,5 +1,5 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { Box, Grid } from "@mui/material";
+import { Box, Grid2 } from "@mui/material";
 import { useMemo } from "react";
 import { useWatch } from "react-hook-form";
 import { useIntl, FormattedMessage } from "react-intl";
@@ -33,7 +33,7 @@ import "../../../../components/ui/snackbarProvider/SnackbarProvider.js";
 import "mui-nested-menu";
 import "react-resizable-panels";
 import "react-papaparse";
-import GridItem from "../../../../components/composite/grid/grid-item.js";
+import { GridItem } from "../../../../components/composite/grid/grid-item.js";
 import { RegulatingTerminalForm } from "../regulatingTerminal/RegulatingTerminalForm.js";
 import { REGULATION_TYPES } from "./voltageRegulation.utils.js";
 function VoltageRegulationForm({
@@ -83,10 +83,10 @@ function VoltageRegulationForm({
       }
     ) }),
     /* @__PURE__ */ jsx(Box, { sx: { width: "100%" } }),
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, justifySelf: "end" }),
+    /* @__PURE__ */ jsx(Grid2, { size: 4, justifySelf: "end" }),
     /* @__PURE__ */ jsx(Box, { sx: { width: "100%" } }),
     isDistantRegulation && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, justifySelf: "end", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "RegulatingTerminalGenerator" }) }),
+      /* @__PURE__ */ jsx(Grid2, { size: 4, justifySelf: "end", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "RegulatingTerminalGenerator" }) }),
       /* @__PURE__ */ jsx(GridItem, { size: 8, children: /* @__PURE__ */ jsx(
         RegulatingTerminalForm,
         {
@@ -98,7 +98,7 @@ function VoltageRegulationForm({
           equipmentSectionType: previousEquipmentSectionType
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, justifySelf: "end" }),
+      /* @__PURE__ */ jsx(Grid2, { size: 4, justifySelf: "end" }),
       /* @__PURE__ */ jsx(GridItem, { size: 4, children: /* @__PURE__ */ jsx(
         FloatInput,
         {

package/dist/features/network-modifications/equipmentDeletion/EquipmentDeletionForm.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Stack, Grid2 } from "@mui/material";
 import { useRef, useState, useMemo, useEffect, useCallback } from "react";
 import { useWatch, useFormContext } from "react-hook-form";
 import { useHvdcLccDeletion } from "./hvdcLccDeletion/useHvdcLccDeletion.js";
@@ -154,9 +154,9 @@ function EquipmentDeletionForm({
   const handleTypeChange = useCallback(() => {
     setValue(FieldConstants.EQUIPMENT_ID, null);
   }, [setValue]);
-  return /* @__PURE__ */ jsxs(Grid, { container: true, direction: "column", children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(Stack, { children: [
+    /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(
         AutocompleteInput,
         {
           isOptionEqualToValue: richTypeEquals,
@@ -170,7 +170,7 @@ function EquipmentDeletionForm({
           formProps: filledTextField
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(
         AutocompleteInput,
         {
           isOptionEqualToValue: areIdsEqual,
@@ -187,7 +187,7 @@ function EquipmentDeletionForm({
         }
       ) })
     ] }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, children: watchSpecificData?.specificType === FieldConstants.HVDC_LINE_LCC_DELETION_SPECIFIC_TYPE && /* @__PURE__ */ jsx(HvdcLccDeletionSpecificForm, {}) })
+    /* @__PURE__ */ jsx(Grid2, { children: watchSpecificData?.specificType === FieldConstants.HVDC_LINE_LCC_DELETION_SPECIFIC_TYPE && /* @__PURE__ */ jsx(HvdcLccDeletionSpecificForm, {}) })
   ] });
 }
 export {

package/dist/features/network-modifications/equipmentDeletion/hvdcLccDeletion/HvdcLccDeletionSpecificForm.js

@@ -1,11 +1,11 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { useFieldArray } from "react-hook-form";
 import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
 import "../../../../utils/conversionUtils.js";
 import "../../../../utils/types/equipmentType.js";
 import "@mui/icons-material";
-import GridSection from "../../../../components/composite/grid/grid-section.js";
+import { GridSection } from "../../../../components/composite/grid/grid-section.js";
 import { ShuntCompensatorSelectionForm } from "./ShuntCompensatorSelectionForm.js";
 function HvdcLccDeletionSpecificForm() {
   const { fields: mcsRows1 } = useFieldArray({
@@ -16,8 +16,8 @@ function HvdcLccDeletionSpecificForm() {
   });
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(GridSection, { title: "LCCConverterStationShuntCompensators" }),
-    /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(
         ShuntCompensatorSelectionForm,
         {
           title: "Side1",
@@ -25,7 +25,7 @@ function HvdcLccDeletionSpecificForm() {
           mcsRows: mcsRows1
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(
         ShuntCompensatorSelectionForm,
         {
           title: "Side2",

package/dist/features/network-modifications/equipmentDeletion/hvdcLccDeletion/ShuntCompensatorSelectionForm.js

@@ -1,5 +1,5 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
 import "../../../../utils/conversionUtils.js";
 import "../../../../utils/types/equipmentType.js";
@@ -32,7 +32,7 @@ import "../../../../components/ui/snackbarProvider/SnackbarProvider.js";
 import "mui-nested-menu";
 import "react-resizable-panels";
 import "react-papaparse";
-import GridSection from "../../../../components/composite/grid/grid-section.js";
+import { GridSection } from "../../../../components/composite/grid/grid-section.js";
 function ShuntCompensatorSelectionForm({
   title,
   arrayFormName,
@@ -40,14 +40,14 @@ function ShuntCompensatorSelectionForm({
 }) {
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(GridSection, { title, heading: 4 }),
-    mcsRows.map((field, index) => /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 1, alignItems: "center", children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 1, children: /* @__PURE__ */ jsx(
+    mcsRows.map((field, index) => /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 1, alignItems: "center", children: [
+      /* @__PURE__ */ jsx(Grid2, { size: 1, children: /* @__PURE__ */ jsx(
         CheckboxInput,
         {
           name: `${arrayFormName}[${index}].${FieldConstants.SHUNT_COMPENSATOR_SELECTED}`
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(ReadOnlyInput, { name: `${arrayFormName}[${index}].${FieldConstants.ID}` }) })
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(ReadOnlyInput, { name: `${arrayFormName}[${index}].${FieldConstants.ID}` }) })
     ] }, field.id))
   ] });
 }

package/dist/features/network-modifications/generator/creation/GeneratorCreationForm.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { Box, Grid } from "@mui/material";
+import { Box, Grid2 } from "@mui/material";
 import { FormattedMessage } from "react-intl";
 import { useWatch } from "react-hook-form";
 import { filledTextField, italicFontTextField } from "../../common/form.utils.js";
@@ -38,7 +38,7 @@ import "mui-nested-menu";
 import "react-resizable-panels";
 import "react-papaparse";
 import "../../common/properties/propertyUtils.js";
-import GridSection from "../../../../components/composite/grid/grid-section.js";
+import { GridSection } from "../../../../components/composite/grid/grid-section.js";
 import "react-dom";
 import "autosuggest-highlight/match";
 import "autosuggest-highlight/parse";
@@ -53,7 +53,7 @@ import "react-querybuilder";
 import "uuid";
 import "../../../../components/composite/filter/explicitNaming/ExplicitNamingFilterEditionDialog.js";
 import "../../../../components/composite/filter/utils/filterFormUtils.js";
-import GridItem from "../../../../components/composite/grid/grid-item.js";
+import { GridItem } from "../../../../components/composite/grid/grid-item.js";
 import "@react-querybuilder/material";
 import "../../../../components/composite/reactQueryBuilder/CustomReactQueryBuilder.js";
 import "../../../../components/composite/reactQueryBuilder/PropertyValueEditor.js";
@@ -149,15 +149,15 @@ function GeneratorCreationForm({
     }
   );
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
+    /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
       /* @__PURE__ */ jsx(GridItem, { size: 4, children: generatorIdField }),
       /* @__PURE__ */ jsx(GridItem, { size: 4, children: generatorNameField }),
       /* @__PURE__ */ jsx(GridItem, { size: 4, children: energySourceField })
     ] }),
     /* @__PURE__ */ jsx(GridSection, { title: "Connectivity" }),
-    /* @__PURE__ */ jsx(Grid, { container: true, spacing: 2, children: /* @__PURE__ */ jsx(GridItem, { size: 12, children: connectivityForm }) }),
+    /* @__PURE__ */ jsx(Grid2, { container: true, spacing: 2, children: /* @__PURE__ */ jsx(GridItem, { size: 12, children: connectivityForm }) }),
     /* @__PURE__ */ jsx(GridSection, { title: "ActiveLimits" }),
-    /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
+    /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
       /* @__PURE__ */ jsx(GridItem, { size: 4, children: minimumActivePowerField }),
       /* @__PURE__ */ jsx(GridItem, { size: 4, children: maximumActivePowerField }),
       /* @__PURE__ */ jsx(GridItem, { size: 4, children: ratedNominalPowerField })
@@ -165,7 +165,7 @@ function GeneratorCreationForm({
     /* @__PURE__ */ jsx(GridSection, { title: "ReactiveLimits" }),
     /* @__PURE__ */ jsx(ReactiveLimitsForm, {}),
     /* @__PURE__ */ jsx(SetPointsForm, {}),
-    /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, paddingTop: 2, children: [
+    /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, paddingTop: 2, children: [
       /* @__PURE__ */ jsx(Box, { sx: { width: "100%" } }),
       /* @__PURE__ */ jsx(
         GridItem,
@@ -182,10 +182,10 @@ function GeneratorCreationForm({
     /* @__PURE__ */ jsx(GridSection, { title: "ShortCircuit" }),
     /* @__PURE__ */ jsx(ShortCircuitForm, {}),
     /* @__PURE__ */ jsx(GridSection, { title: "GenerationDispatch" }),
-    /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
+    /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
       /* @__PURE__ */ jsx(GridItem, { size: 4, children: plannedActivePowerSetPointField }),
       /* @__PURE__ */ jsx(GridItem, { size: 4, children: marginalCostField }),
-      /* @__PURE__ */ jsxs(Grid, { container: true, item: true, spacing: 2, children: [
+      /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
         /* @__PURE__ */ jsx(GridItem, { size: 4, children: plannedOutageRateField }),
         /* @__PURE__ */ jsx(GridItem, { size: 4, children: forcedOutageRateField })
       ] })

package/dist/features/network-modifications/generator/modification/GeneratorDialogHeader.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { TextField, Grid } from "@mui/material";
+import { TextField, Grid2 } from "@mui/material";
 import { useIntl } from "react-intl";
 import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
 import "../../../../utils/conversionUtils.js";
@@ -104,10 +104,10 @@ function GeneratorDialogHeader({ generatorToModify, equipmentId }) {
       previousValue: previousEnergySourceLabel
     }
   );
-  return /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: generatorIdField }),
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: generatorNameField }),
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: energySourceField })
+  return /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+    /* @__PURE__ */ jsx(Grid2, { size: "grow", children: generatorIdField }),
+    /* @__PURE__ */ jsx(Grid2, { size: "grow", children: generatorNameField }),
+    /* @__PURE__ */ jsx(Grid2, { size: "grow", children: energySourceField })
   ] });
 }
 export {