@gridsuite/commons-ui 0.239.0 → 0.240.0

package/dist/features/network-modifications/shunt-compensator/creation/ShuntCompensatorCreationForm.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Stack, Grid2 } from "@mui/material";
 import "@mui/icons-material";
 import "react-intl";
 import "../../../../components/ui/overflowableText/OverflowableText.js";
@@ -31,7 +31,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";
 import { ConnectivityForm } from "../../common/connectivity/ConnectivityForm.js";
 import { PropertiesForm } from "../../common/properties/PropertiesForm.js";
 import { filledTextField } from "../../common/form.utils.js";
@@ -70,9 +70,9 @@ function ShuntCompensatorCreationForm({
   fetchBusesOrBusbarSections,
   PositionDiagramPane
 }) {
-  return /* @__PURE__ */ jsxs(Grid, { container: true, direction: "column", spacing: 2, children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 2, children: [
+    /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+      /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
         TextInput,
         {
           name: FieldConstants.EQUIPMENT_ID,
@@ -80,11 +80,11 @@ function ShuntCompensatorCreationForm({
           formProps: { autoFocus: true, ...filledTextField }
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(TextInput, { name: FieldConstants.EQUIPMENT_NAME, label: "Name", formProps: filledTextField }) })
+      /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(TextInput, { name: FieldConstants.EQUIPMENT_NAME, label: "Name", formProps: filledTextField }) })
     ] }) }),
-    /* @__PURE__ */ jsxs(Grid, { item: true, children: [
+    /* @__PURE__ */ jsxs(Grid2, { children: [
       /* @__PURE__ */ jsx(GridSection, { title: "Connectivity" }),
-      /* @__PURE__ */ jsx(Grid, { container: true, spacing: 2, children: /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(Grid2, { container: true, spacing: 2, children: /* @__PURE__ */ jsx(Grid2, { size: 12, children: /* @__PURE__ */ jsx(
         ConnectivityForm,
         {
           voltageLevelOptions,
@@ -93,11 +93,11 @@ function ShuntCompensatorCreationForm({
         }
       ) }) })
     ] }),
-    /* @__PURE__ */ jsxs(Grid, { item: true, children: [
+    /* @__PURE__ */ jsxs(Grid2, { children: [
       /* @__PURE__ */ jsx(GridSection, { title: "Characteristics" }),
-      /* @__PURE__ */ jsx(Grid, { container: true, spacing: 2, children: /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(CharacteristicsForm, { isModification: false }) }) })
+      /* @__PURE__ */ jsx(Grid2, { container: true, spacing: 2, children: /* @__PURE__ */ jsx(Grid2, { size: 12, children: /* @__PURE__ */ jsx(CharacteristicsForm, { isModification: false }) }) })
     ] }),
-    /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(PropertiesForm, { networkElementType: "shuntCompensator" }) })
+    /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsx(PropertiesForm, { networkElementType: "shuntCompensator" }) })
   ] });
 }
 export {

package/dist/features/network-modifications/shunt-compensator/creation/shuntCompensatorCreation.utils.d.ts

@@ -4,10 +4,10 @@ import { ShuntCompensatorCreationDto } from './shuntCompensatorCreation.types';
 export declare const shuntCompensatorCreationFormSchema: import('yup').ObjectSchema<NonNullable<({
     maxQAtNominalV: number | null;
     maxSusceptance: number | null;
-    maximumSectionCount: number | null;
-    sectionCount: number | null;
-    switchedOnQAtNominalV: number | null | undefined;
-    switchedOnSusceptance: number | null | undefined;
+    maximumSectionCount: number;
+    sectionCount: number;
+    switchedOnQAtNominalV: import('yup').Maybe<number | undefined>;
+    switchedOnSusceptance: import('yup').Maybe<number | undefined>;
     characteristicsChoice: string;
     shuntCompensatorType: string | null;
     equipmentID: string;
@@ -27,10 +27,10 @@ export declare const shuntCompensatorCreationFormSchema: import('yup').ObjectSch
 } | {
     maxQAtNominalV: number | null;
     maxSusceptance: number | null;
-    maximumSectionCount: number;
-    sectionCount: number;
-    switchedOnQAtNominalV: import('yup').Maybe<number | undefined>;
-    switchedOnSusceptance: import('yup').Maybe<number | undefined>;
+    maximumSectionCount: number | null;
+    sectionCount: number | null;
+    switchedOnQAtNominalV: number | null | undefined;
+    switchedOnSusceptance: number | null | undefined;
     characteristicsChoice: string;
     shuntCompensatorType: string | null;
     equipmentID: string;
@@ -58,8 +58,8 @@ export declare const shuntCompensatorCreationFormSchema: import('yup').ObjectSch
 }>, import('yup').AnyObject, {
     maxQAtNominalV: null;
     maxSusceptance: null;
-    maximumSectionCount: null;
-    sectionCount: null;
+    maximumSectionCount: undefined;
+    sectionCount: undefined;
     switchedOnQAtNominalV: undefined;
     switchedOnSusceptance: undefined;
     characteristicsChoice: undefined;
@@ -82,8 +82,8 @@ export declare const shuntCompensatorCreationFormSchema: import('yup').ObjectSch
 } | {
     maxQAtNominalV: null;
     maxSusceptance: null;
-    maximumSectionCount: undefined;
-    sectionCount: undefined;
+    maximumSectionCount: null;
+    sectionCount: null;
     switchedOnQAtNominalV: undefined;
     switchedOnSusceptance: undefined;
     characteristicsChoice: undefined;

package/dist/features/network-modifications/shunt-compensator/modification/ShuntCompensatorModificationForm.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { Grid2, TextField } from "@mui/material";
+import { Stack, Grid2, TextField } from "@mui/material";
 import { useWatch } from "react-hook-form";
 import "@mui/icons-material";
 import "react-intl";
@@ -31,7 +31,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";
 import { ConnectivityForm } from "../../common/connectivity/ConnectivityForm.js";
 import { PropertiesForm } from "../../common/properties/PropertiesForm.js";
 import { PowerMeasurementsForm } from "../../common/measurements/PowerMeasurementsForm.js";
@@ -73,7 +73,7 @@ function ShuntCompensatorModificationForm({
   PositionDiagramPane
 }) {
   const equipmentId = useWatch({ name: FieldConstants.EQUIPMENT_ID });
-  return /* @__PURE__ */ jsxs(Grid2, { container: true, direction: "column", spacing: 2, children: [
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 2, children: [
     /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
       /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
         TextField,

package/dist/features/network-modifications/shunt-compensator/modification/shuntCompensatorModification.utils.d.ts

@@ -4,10 +4,10 @@ import { ShuntCompensatorModificationDto } from './shuntCompensatorModification.
 export declare const shuntCompensatorModificationFormSchema: import('yup').ObjectSchema<NonNullable<({
     maxQAtNominalV: number | null;
     maxSusceptance: number | null;
-    maximumSectionCount: number | null;
-    sectionCount: number | null;
-    switchedOnQAtNominalV: number | null | undefined;
-    switchedOnSusceptance: number | null | undefined;
+    maximumSectionCount: number;
+    sectionCount: number;
+    switchedOnQAtNominalV: import('yup').Maybe<number | undefined>;
+    switchedOnSusceptance: import('yup').Maybe<number | undefined>;
     characteristicsChoice: string;
     shuntCompensatorType: string | null;
     equipmentID: string;
@@ -37,10 +37,10 @@ export declare const shuntCompensatorModificationFormSchema: import('yup').Objec
 } | {
     maxQAtNominalV: number | null;
     maxSusceptance: number | null;
-    maximumSectionCount: number;
-    sectionCount: number;
-    switchedOnQAtNominalV: import('yup').Maybe<number | undefined>;
-    switchedOnSusceptance: import('yup').Maybe<number | undefined>;
+    maximumSectionCount: number | null;
+    sectionCount: number | null;
+    switchedOnQAtNominalV: number | null | undefined;
+    switchedOnSusceptance: number | null | undefined;
     characteristicsChoice: string;
     shuntCompensatorType: string | null;
     equipmentID: string;
@@ -78,8 +78,8 @@ export declare const shuntCompensatorModificationFormSchema: import('yup').Objec
 }>, import('yup').AnyObject, {
     maxQAtNominalV: null;
     maxSusceptance: null;
-    maximumSectionCount: null;
-    sectionCount: null;
+    maximumSectionCount: undefined;
+    sectionCount: undefined;
     switchedOnQAtNominalV: undefined;
     switchedOnSusceptance: undefined;
     characteristicsChoice: undefined;
@@ -108,8 +108,8 @@ export declare const shuntCompensatorModificationFormSchema: import('yup').Objec
 } | {
     maxQAtNominalV: null;
     maxSusceptance: null;
-    maximumSectionCount: undefined;
-    sectionCount: undefined;
+    maximumSectionCount: null;
+    sectionCount: null;
     switchedOnQAtNominalV: undefined;
     switchedOnSusceptance: undefined;
     characteristicsChoice: undefined;

package/dist/features/network-modifications/substation/creation/SubstationCreationForm.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Stack, Grid2 } from "@mui/material";
 import "@mui/icons-material";
 import "react-intl";
 import "../../../../components/ui/overflowableText/OverflowableText.js";
@@ -64,11 +64,11 @@ import "../../../../components/composite/report/report-treeview/treeview-item.js
 import "../../../../components/composite/report/report-viewer/context/report-viewer-context.js";
 import "../../common/regulatingTerminal/RegulatingTerminalForm.js";
 function SubstationCreationForm() {
-  return /* @__PURE__ */ jsxs(Grid, { container: true, direction: "column", spacing: 2, 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(TextInput, { name: FieldConstants.EQUIPMENT_ID, label: "ID", formProps: filledTextField }) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(TextInput, { name: FieldConstants.EQUIPMENT_NAME, label: "Name", formProps: filledTextField }) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 2, children: [
+    /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(TextInput, { name: FieldConstants.EQUIPMENT_ID, label: "ID", formProps: filledTextField }) }),
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(TextInput, { name: FieldConstants.EQUIPMENT_NAME, label: "Name", formProps: filledTextField }) }),
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(
         CountrySelectionInput,
         {
           name: FieldConstants.COUNTRY,
@@ -78,7 +78,7 @@ function SubstationCreationForm() {
         }
       ) })
     ] }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(PropertiesForm, { networkElementType: "substation" }) })
+    /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsx(PropertiesForm, { networkElementType: "substation" }) })
   ] });
 }
 export {

package/dist/features/network-modifications/substation/modification/SubstationModificationForm.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { Grid, TextField } from "@mui/material";
+import { Stack, Grid2, TextField } from "@mui/material";
 import { useIntl } from "react-intl";
 import { useWatch } from "react-hook-form";
 import "@mui/icons-material";
@@ -65,9 +65,9 @@ function SubstationModificationForm({ substationToModify }) {
   const { locale } = useIntl();
   const { translate } = useLocalizedCountries(locale);
   const equipmentId = useWatch({ name: FieldConstants.EQUIPMENT_ID });
-  return /* @__PURE__ */ jsxs(Grid, { container: true, direction: "column", spacing: 2, 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, { spacing: 2, children: [
+    /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(
         TextField,
         {
           size: "small",
@@ -81,7 +81,7 @@ function SubstationModificationForm({ substationToModify }) {
           ...filledTextField
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(
         TextInput,
         {
           name: FieldConstants.EQUIPMENT_NAME,
@@ -91,7 +91,7 @@ function SubstationModificationForm({ substationToModify }) {
           clearable: true
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(
         CountrySelectionInput,
         {
           name: FieldConstants.COUNTRY,
@@ -102,7 +102,7 @@ function SubstationModificationForm({ substationToModify }) {
         }
       ) })
     ] }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(PropertiesForm, { networkElementType: "substation", isModification: true }) })
+    /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsx(PropertiesForm, { networkElementType: "substation", isModification: true }) })
   ] });
 }
 export {

package/dist/features/network-modifications/voltageLevel/creation/VoltageLevelCreationForm.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { Grid, Tabs, Tab, Box } from "@mui/material";
+import { Stack, Grid2, Tabs, Tab, Box } from "@mui/material";
 import { FormattedMessage } from "react-intl";
 import { useWatch } from "react-hook-form";
 import "@mui/icons-material";
@@ -78,9 +78,9 @@ function VoltageLevelCreationForm({
     VoltageLevelTab.SUBSTATION_TAB
   );
   const watchHideBusBarSection = useWatch({ name: FieldConstants.HIDE_BUS_BAR_SECTION });
-  return /* @__PURE__ */ jsxs(Grid, { container: true, direction: "column", spacing: 2, children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 2, children: [
+    /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+      /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
         TextInput,
         {
           name: FieldConstants.EQUIPMENT_ID,
@@ -88,9 +88,9 @@ function VoltageLevelCreationForm({
           formProps: { autoFocus: true, ...filledTextField }
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(TextInput, { name: FieldConstants.EQUIPMENT_NAME, label: "Name", formProps: filledTextField }) })
+      /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(TextInput, { name: FieldConstants.EQUIPMENT_NAME, label: "Name", formProps: filledTextField }) })
     ] }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsxs(
+    /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsxs(
       Tabs,
       {
         value: tabIndex,
@@ -132,7 +132,7 @@ function VoltageLevelCreationForm({
         ]
       }
     ) }),
-    /* @__PURE__ */ jsxs(Grid, { item: true, children: [
+    /* @__PURE__ */ jsxs(Grid2, { children: [
       /* @__PURE__ */ jsx(Box, { hidden: tabIndex !== VoltageLevelTab.SUBSTATION_TAB, children: /* @__PURE__ */ jsx(
         SubstationTab,
         {

package/dist/features/network-modifications/voltageLevel/creation/tabs/characteristicsTab/CharacteristicsTab.js

@@ -1,7 +1,7 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { useWatch } from "react-hook-form";
-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 { VoltageAdornment, KiloAmpereAdornment } from "../../../../../../utils/constants/adornments.js";
 import { FieldConstants } from "../../../../../../utils/constants/fieldConstants.js";
 import "../../../../../../utils/conversionUtils.js";
@@ -37,8 +37,8 @@ function CharacteristicsTab() {
   const watchHideNominalVoltage = useWatch({ name: FieldConstants.HIDE_NOMINAL_VOLTAGE });
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(GridSection, { title: "VoltageText" }),
-    /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
-      !watchHideNominalVoltage && /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+      !watchHideNominalVoltage && /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
         FloatInput,
         {
           name: FieldConstants.NOMINAL_V,
@@ -46,7 +46,7 @@ function CharacteristicsTab() {
           adornment: VoltageAdornment
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
         FloatInput,
         {
           name: FieldConstants.LOW_VOLTAGE_LIMIT,
@@ -54,7 +54,7 @@ function CharacteristicsTab() {
           adornment: VoltageAdornment
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
         FloatInput,
         {
           name: FieldConstants.HIGH_VOLTAGE_LIMIT,
@@ -64,8 +64,8 @@ function CharacteristicsTab() {
       ) })
     ] }),
     /* @__PURE__ */ jsx(GridSection, { title: "ShortCircuit" }),
-    /* @__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.LOW_SHORT_CIRCUIT_CURRENT_LIMIT,
@@ -73,7 +73,7 @@ function CharacteristicsTab() {
           adornment: KiloAmpereAdornment
         }
       ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
         FloatInput,
         {
           name: FieldConstants.HIGH_SHORT_CIRCUIT_CURRENT_LIMIT,

package/dist/features/network-modifications/voltageLevel/creation/tabs/structureTab/StructureTab.js

@@ -1,8 +1,8 @@
 import { jsxs, Fragment, 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 GridSection from "../../../../../../components/composite/grid/grid-section.js";
+import { GridSection } from "../../../../../../components/composite/grid/grid-section.js";
 import "@mui/icons-material";
 import "react-intl";
 import "../../../../../../components/ui/overflowableText/OverflowableText.js";
@@ -44,9 +44,9 @@ function StructureTab() {
   const displayOmnibus = watchBusBarCount > 1 || watchSectionCount > 1;
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(GridSection, { title: "BusBarSections" }),
-    /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(IntegerInput, { name: FieldConstants.BUS_BAR_COUNT, label: "BusBarCount" }) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(IntegerInput, { name: FieldConstants.SECTION_COUNT, label: "numberOfSections" }) })
+    /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+      /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(IntegerInput, { name: FieldConstants.BUS_BAR_COUNT, label: "BusBarCount" }) }),
+      /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(IntegerInput, { name: FieldConstants.SECTION_COUNT, label: "numberOfSections" }) })
     ] }),
     /* @__PURE__ */ jsx(SwitchesBetweenSections, {}),
     displayOmnibus && /* @__PURE__ */ jsxs(Fragment, { children: [

package/dist/features/network-modifications/voltageLevel/creation/tabs/structureTab/couplingOmnibus/CouplingOmnibusCreation.js

@@ -1,7 +1,7 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { useEffect } from "react";
 import { useFormContext } from "react-hook-form";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { AutocompleteInput } from "../../../../../../../components/ui/reactHookForm/autocompleteInputs/AutocompleteInput.js";
 import { FieldConstants } from "../../../../../../../utils/constants/fieldConstants.js";
 import "../../../../../../../utils/conversionUtils.js";
@@ -24,7 +24,7 @@ function CouplingOmnibusCreation({ index, sectionOptions }) {
     return () => unsubscribe();
   }, [subscribe, trigger, getValues, index]);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
       AutocompleteInput,
       {
         allowNewValue: true,
@@ -35,7 +35,7 @@ function CouplingOmnibusCreation({ index, sectionOptions }) {
         size: "small"
       }
     ) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
       AutocompleteInput,
       {
         allowNewValue: true,

package/dist/features/network-modifications/voltageLevel/creation/tabs/structureTab/switchesBetweenSections/SwitchesBetweenSections.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";
 import { SWITCH_TYPE } from "../../../voltageLevelCreation.utils.js";
 import { MAX_SECTIONS_COUNT } from "../../../voltageLevel.constants.js";
 function SwitchesBetweenSections() {

package/dist/features/network-modifications/voltageLevel/creation/tabs/substationTab/SubstationCreationSection.js

@@ -1,6 +1,6 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { useIntl } from "react-intl";
-import { Grid, IconButton } from "@mui/material";
+import { Grid2, IconButton } from "@mui/material";
 import { Delete } from "@mui/icons-material";
 import { CustomTooltip } from "../../../../../../components/ui/tooltip/CustomTooltip.js";
 import "../../../../../../components/ui/overflowableText/OverflowableText.js";
@@ -33,7 +33,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";
 import { PropertiesForm } from "../../../../common/properties/PropertiesForm.js";
 import "../../../../common/properties/propertyUtils.js";
 import "react-dom";
@@ -71,11 +71,11 @@ function SubstationCreationSection({
   const intl = useIntl();
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(GridSection, { title: "CreateSubstation" }),
-    /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(TextInput, { name: FieldConstants.SUBSTATION_CREATION_ID, label: "SubstationId" }) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(TextInput, { name: FieldConstants.SUBSTATION_NAME, label: "substationName" }) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(CountrySelectionInput, { name: FieldConstants.COUNTRY, label: "Country", size: "small" }) }),
-      showDeleteButton && onDelete && /* @__PURE__ */ jsx(Grid, { item: true, xs: 1, children: /* @__PURE__ */ jsx(CustomTooltip, { title: intl.formatMessage({ id: "DeleteRows" }), children: /* @__PURE__ */ jsx(IconButton, { onClick: onDelete, children: /* @__PURE__ */ jsx(Delete, {}) }) }) })
+    /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(TextInput, { name: FieldConstants.SUBSTATION_CREATION_ID, label: "SubstationId" }) }),
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(TextInput, { name: FieldConstants.SUBSTATION_NAME, label: "substationName" }) }),
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", children: /* @__PURE__ */ jsx(CountrySelectionInput, { name: FieldConstants.COUNTRY, label: "Country", size: "small" }) }),
+      showDeleteButton && onDelete && /* @__PURE__ */ jsx(Grid2, { size: 1, children: /* @__PURE__ */ jsx(CustomTooltip, { title: intl.formatMessage({ id: "DeleteRows" }), children: /* @__PURE__ */ jsx(IconButton, { onClick: onDelete, children: /* @__PURE__ */ jsx(Delete, {}) }) }) })
     ] }),
     /* @__PURE__ */ jsx(PropertiesForm, { id: FieldConstants.SUBSTATION_CREATION, networkElementType: "substation" })
   ] });

package/dist/features/network-modifications/voltageLevel/creation/tabs/substationTab/SubstationTab.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useWatch, useFormContext } from "react-hook-form";
 import { FormattedMessage } from "react-intl";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { useCallback, useEffect } from "react";
 import { FieldConstants } from "../../../../../../utils/constants/fieldConstants.js";
 import "../../../../../../utils/conversionUtils.js";
@@ -56,8 +56,8 @@ function SubstationTab({ substationOptions, showDeleteButton }) {
       });
     }
   }, [setValue, getValues, watchAddSubstationCreation]);
-  return watchAddSubstationCreation ? /* @__PURE__ */ jsx(SubstationCreationSection, { showDeleteButton, onDelete: handleDeleteSubstationCreation }) : /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, pt: 2, children: [
-    /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: substationOptions ? /* @__PURE__ */ jsx(
+  return watchAddSubstationCreation ? /* @__PURE__ */ jsx(SubstationCreationSection, { showDeleteButton, onDelete: handleDeleteSubstationCreation }) : /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, pt: 2, children: [
+    /* @__PURE__ */ jsx(Grid2, { size: 4, children: substationOptions ? /* @__PURE__ */ jsx(
       AutocompleteInput,
       {
         name: FieldConstants.SUBSTATION_ID,
@@ -70,8 +70,8 @@ function SubstationTab({ substationOptions, showDeleteButton }) {
         noOptionsText: ""
       }
     ) : /* @__PURE__ */ jsx(TextInput, { name: FieldConstants.SUBSTATION_ID, label: "SUBSTATION" }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, mt: 0.75, children: /* @__PURE__ */ jsx(FormattedMessage, { id: "Or" }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(AddButton, { label: "CreateSubstation", onClick: handleCreateSubstation }) })
+    /* @__PURE__ */ jsx(Grid2, { mt: 0.75, children: /* @__PURE__ */ jsx(FormattedMessage, { id: "Or" }) }),
+    /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsx(AddButton, { label: "CreateSubstation", onClick: handleCreateSubstation }) })
   ] });
 }
 export {

package/dist/features/network-modifications/voltageLevel/modification/VoltageLevelModificationForm.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useState } from "react";
-import { Grid2, TextField, Tabs, Tab, Box } from "@mui/material";
+import { Stack, Grid2, TextField, Tabs, Tab, Box } from "@mui/material";
 import { FormattedMessage } from "react-intl";
 import { useWatch } from "react-hook-form";
 import { VoltageAdornment, KiloAmpereAdornment } from "../../../../utils/constants/adornments.js";
@@ -37,7 +37,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 { BusbarSectionVoltageMeasurementsForm } from "../../common/measurements/BusbarSectionVoltageMeasurementsForm.js";
 import "../../common/regulatingTerminal/RegulatingTerminalForm.js";
 import { getTabStyle, getTabIndicatorStyle } from "../../../parameters/parameters-style.js";
@@ -78,7 +78,7 @@ function VoltageLevelModificationForm({
     0
     /* CHARACTERISTICS_TAB */
   );
-  return /* @__PURE__ */ jsxs(Grid2, { container: true, direction: "column", spacing: 2, children: [
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 2, children: [
     /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsxs(Grid2, { container: true, spacing: 2, children: [
       /* @__PURE__ */ jsx(Grid2, { size: 4, children: /* @__PURE__ */ jsx(
         TextField,

package/dist/features/network-modifications/voltageLevel/modification/voltageLevelModification.utils.d.ts

@@ -55,8 +55,8 @@ export declare const voltageLevelModificationWithMeasurementsFormSchema: import(
 } & {
     busbarSectionVMeasurements: {
         value: number | null;
-        busbarSectionId: string;
         validity: boolean | null;
+        busbarSectionId: string;
     }[] | null;
 }, import('yup').AnyObject, {
     equipmentID: undefined;

package/dist/features/parameters/common/ProviderParam.js

@@ -1,5 +1,5 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { Grid } from "@mui/material";
+import { Grid2 } from "@mui/material";
 import { FormattedMessage } from "react-intl";
 import { LineSeparator } from "./line-separator.js";
 import { parametersStyles } from "../parameters-style.js";
@@ -41,11 +41,11 @@ const styles = {
 };
 function ProviderParam({ options }) {
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(Grid, { container: true, sx: styles.providerParam, paddingRight: 1, children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: true, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: "Provider" }) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, container: true, xs: 2, sx: parametersStyles.controlItem, children: /* @__PURE__ */ jsx(MuiSelectInput, { name: PROVIDER, size: "small", fullWidth: true, options }) })
+    /* @__PURE__ */ jsxs(Grid2, { container: true, sx: styles.providerParam, paddingRight: 1, size: 12, children: [
+      /* @__PURE__ */ jsx(Grid2, { size: "grow", sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: "Provider" }) }),
+      /* @__PURE__ */ jsx(Grid2, { container: true, size: 2, children: /* @__PURE__ */ jsx(MuiSelectInput, { name: PROVIDER, size: "small", fullWidth: true, options }) })
     ] }),
-    /* @__PURE__ */ jsx(Grid, { container: true, paddingTop: 1, paddingRight: 1, children: /* @__PURE__ */ jsx(LineSeparator, {}) })
+    /* @__PURE__ */ jsx(Grid2, { container: true, paddingTop: 1, paddingRight: 1, size: 12, children: /* @__PURE__ */ jsx(LineSeparator, {}) })
   ] });
 }
 export {

package/dist/features/parameters/common/contingency-table/contingency-table.js

@@ -1,5 +1,5 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { Grid, Alert, CircularProgress } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Grid2, Stack, Alert, CircularProgress } from "@mui/material";
 import { forwardRef, useState, useImperativeHandle, useCallback, useEffect, useMemo } from "react";
 import { useIntl, FormattedMessage } from "react-intl";
 import { useFormContext } from "react-hook-form";
@@ -120,7 +120,7 @@ function ContingencyTableWithApiRef({ name, showContingencyCount = false, fetchC
       })
     );
   }, [intl]);
-  return /* @__PURE__ */ jsxs(Grid, { container: true, direction: "column", children: [
+  return /* @__PURE__ */ jsx(Grid2, { size: 12, children: /* @__PURE__ */ jsxs(Stack, { children: [
     /* @__PURE__ */ jsx(
       ParameterTableField,
       {
@@ -132,7 +132,7 @@ function ContingencyTableWithApiRef({ name, showContingencyCount = false, fetchC
       }
     ),
     showContingencyCount && renderContingencyCount()
-  ] });
+  ] }) });
 }
 const ContingencyTable = forwardRef(ContingencyTableWithApiRef);
 export {

package/dist/features/parameters/common/line-separator.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
-import { Grid, Divider } from "@mui/material";
+import { Grid2, Divider } from "@mui/material";
 function LineSeparator() {
-  return /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(Divider, {}) });
+  return /* @__PURE__ */ jsx(Grid2, { size: 12, children: /* @__PURE__ */ jsx(Divider, {}) });
 }
 export {
   LineSeparator