@gridsuite/commons-ui 0.266.0 → 0.267.0

package/dist/components/ui/inputs/checkbox-autocomplete/checkbox-autocomplete.js

@@ -105,6 +105,7 @@ function CheckboxAutocomplete({
       disableCloseOnSelect: true,
       size: "small",
       disableListWrap: true,
+      slots: { popper: StyledPopper },
       options,
       noOptionsText: intl.formatMessage({ id: "noOption" }),
       getOptionLabel,
@@ -116,8 +117,8 @@ function CheckboxAutocomplete({
       inputValue,
       onChange: handleChange,
       onBlur: handleBlur,
-      slots: { popper: StyledPopper },
       slotProps: {
+        ...otherProps?.slotProps,
         listbox: { component: virtualize ? VirtualizedList : void 0 }
       }
     }

package/dist/components/ui/reactHookForm/CheckboxNullableInput.js

@@ -36,6 +36,7 @@ function CheckboxNullableInput({
     onChange?.(newValue);
   }, [rhfOnChange, onChange, value]);
   const currentLabel = typeof label === "function" ? label(value) : label;
+  const { slotProps, ...otherFormProps } = formProps ?? {};
   return /* @__PURE__ */ jsxs(FormControl, { fullWidth: true, size: "small", children: [
     /* @__PURE__ */ jsx(
       FormControlLabel,
@@ -51,9 +52,10 @@ function CheckboxNullableInput({
             slotProps: {
               input: {
                 "aria-label": "primary checkbox"
-              }
+              },
+              ...slotProps
             },
-            ...formProps
+            ...otherFormProps
           }
         ),
         label: !label ? "" : intl.formatMessage({

package/dist/components/ui/reactHookForm/autocompleteInputs/MultipleAutocompleteInput.js

@@ -20,6 +20,7 @@ function MultipleAutocompleteInput({ name, ...props }) {
     const newValues = values.map((val) => val.trim());
     return newValues.filter((val, index) => newValues.indexOf(val) === index);
   };
+  const { slotProps, ...otherProps } = props;
   return /* @__PURE__ */ jsx(
     AutocompleteInput,
     {
@@ -34,8 +35,8 @@ function MultipleAutocompleteInput({ name, ...props }) {
       onBlur: handleOnBlur,
       blurOnSelect: false,
       multiple: true,
-      slotProps: { chip: { size: "small" } },
-      ...props
+      slotProps: { chip: { size: "small" }, ...slotProps },
+      ...otherProps
     }
   );
 }

package/dist/components/ui/reactHookForm/booleans/BooleanInput.d.ts

@@ -8,5 +8,5 @@ export type BooleanInputProps<TInput extends InputTypes> = {
     formProps?: InputProps<TInput>;
     Input: TInput;
 };
-export declare function BooleanInput<TInput extends InputTypes>({ name, label, formProps, Input, ...props }: Readonly<BooleanInputProps<TInput>>): JSX.Element;
+export declare function BooleanInput<TInput extends InputTypes>({ name, label, formProps, Input, }: Readonly<BooleanInputProps<TInput>>): JSX.Element;
 export {};

package/dist/components/ui/reactHookForm/booleans/BooleanInput.js

@@ -7,10 +7,9 @@ function BooleanInput({
   name,
   label,
   formProps,
-  Input,
-  ...props
+  Input
 }) {
-  const { onChange, ...otherFormProps } = formProps ?? { onChange: void 0 };
+  const { onChange, slotProps, ...otherFormProps } = formProps ?? { onChange: void 0 };
   const {
     field: { onChange: onChangeRhf, value, ref }
   } = useController({ name });
@@ -28,9 +27,8 @@ function BooleanInput({
       checked: value,
       onChange: handleChangeValue,
       inputRef: ref,
-      slotProps: { input: { "aria-label": "primary checkbox" } },
-      ...otherFormProps,
-      ...props
+      slotProps: { input: { "aria-label": "primary checkbox" }, ...slotProps },
+      ...otherFormProps
     }
   );
   if (label) {

package/dist/components/ui/reactHookForm/tableInputs/table-numerical-input.js

@@ -64,6 +64,7 @@ function TableNumericalInput({
   const handleClearValue = () => {
     onChange(outputTransform(previousValue));
   };
+  const { slotProps, ...otherProps } = props;
   return /* @__PURE__ */ jsx(
     TextField,
     {
@@ -103,10 +104,11 @@ function TableNumericalInput({
             // to have '.' as decimal separator
             ...inputProps
           }
-        }
+        },
+        ...slotProps
       },
       ...hideErrorMessage ? {} : genHelperError(error?.message),
-      ...props
+      ...otherProps
     }
   );
 }

package/dist/components/ui/reactHookForm/tableInputs/table-text-input.d.ts

@@ -4,5 +4,5 @@ interface TableTextInputProps {
     hideErrorMessage?: boolean;
     inputProps?: InputBaseComponentProps;
 }
-export declare function TableTextInput({ name, hideErrorMessage, inputProps, ...props }: Readonly<TableTextInputProps>): import("react").JSX.Element;
+export declare function TableTextInput({ name, hideErrorMessage, inputProps }: Readonly<TableTextInputProps>): import("react").JSX.Element;
 export {};

package/dist/components/ui/reactHookForm/tableInputs/table-text-input.js

@@ -5,7 +5,7 @@ import "react-intl";
 import "react";
 import "@mui/icons-material";
 import { genHelperError } from "../utils/functions.js";
-function TableTextInput({ name, hideErrorMessage, inputProps, ...props }) {
+function TableTextInput({ name, hideErrorMessage, inputProps }) {
   const {
     field: { onChange, value, ref },
     fieldState: { error }
@@ -37,8 +37,7 @@ function TableTextInput({ name, hideErrorMessage, inputProps, ...props }) {
           }
         }
       },
-      ...hideErrorMessage ? {} : genHelperError(error?.message),
-      ...props
+      ...hideErrorMessage ? {} : genHelperError(error?.message)
     }
   );
 }

package/dist/components/ui/reactHookForm/text/ExpandingTextField.js

@@ -27,34 +27,36 @@ function ExpandingTextField({
   const descriptionLength = descriptionWatch?.length ?? 0;
   const descriptionCounter = `${descriptionLength}/${maxCharactersNumber}`;
   const rowsToDisplay = isFocused ? rows : minRows;
+  const { slotProps, ...otherProps } = textFieldFormProps ?? {};
   const formProps = {
     size: "medium",
     multiline: true,
     onFocus: handleFocus,
     onBlur: handleBlur,
-    InputProps: {
-      style: {
-        textOverflow: "ellipsis",
-        overflow: "hidden",
-        // disable scrolling
-        whiteSpace: "pre",
-        resize: "none"
-        // or 'horizontal' for horizontal resizing
-      },
-      inputProps: { "data-testid": "DescriptionInputField" }
-    },
     helperText: /* @__PURE__ */ jsx(Typography, { variant: "caption", children: descriptionCounter }),
     slotProps: {
+      input: {
+        style: {
+          textOverflow: "ellipsis",
+          overflow: "hidden",
+          // disable scrolling
+          whiteSpace: "pre",
+          resize: "none"
+          // or 'horizontal' for horizontal resizing
+        },
+        inputProps: { "data-testid": "DescriptionInputField" }
+      },
       formHelperText: {
         sx: {
           ml: "auto",
           color: (theme) => isOverTheLimit ? theme.palette.error.main : theme.palette.text.secondary
         }
-      }
+      },
+      ...slotProps
     },
     ...rowsToDisplay && { rows: rowsToDisplay },
     ...sx && { sx },
-    ...textFieldFormProps
+    ...otherProps
   };
   return /* @__PURE__ */ jsx(TextInput, { name, label, formProps, ...otherTexFieldProps });
 }

package/dist/components/ui/reactHookForm/text/TextInput.js

@@ -56,6 +56,7 @@ function TextInput({
     values: labelValues,
     optional: !isFieldRequired(name, validationSchema, getValues()) && !formProps?.disabled && !removeOptional
   });
+  const { slotProps, ...otherFormProps } = formProps ?? {};
   return /* @__PURE__ */ jsx(
     Field,
     {
@@ -73,7 +74,8 @@ function TextInput({
             clearable && transformedValue !== void 0 && transformedValue !== "" && /* @__PURE__ */ jsx(IconButton, { onClick: handleClearValue, size: "small", children: /* @__PURE__ */ jsx(Clear, { fontSize: "small" }) }),
             customAdornment && { ...customAdornment }
           ] })
-        }
+        },
+        ...slotProps
       },
       inputRef: ref,
       ...clearable && adornment && {
@@ -89,7 +91,7 @@ function TextInput({
         }
       ),
       ...genHelperError(error?.message),
-      ...formProps,
+      ...otherFormProps,
       ...adornment && { ...finalAdornment }
     },
     id ?? label

package/dist/components/ui/reactHookForm/text/UniqueNameInput.js

@@ -41,6 +41,7 @@ function UniqueNameInput({
     isValidating && /* @__PURE__ */ jsx(CircularProgress, { size: "1rem" }),
     showOk && /* @__PURE__ */ jsx(Check, { style: { color: "green" } })
   ] });
+  const { slotProps, ...otherFormProps } = formProps ?? {};
   return /* @__PURE__ */ jsx(
     TextField,
     {
@@ -64,9 +65,10 @@ function UniqueNameInput({
           inputProps: {
             "data-testid": "NameInputField"
           }
-        }
+        },
+        ...slotProps
       },
-      ...formProps
+      ...otherFormProps
     }
   );
 }

package/dist/components/ui/reactHookForm/utils/TextFieldWithAdornment.js

@@ -3,7 +3,7 @@ import { useState, useCallback } from "react";
 import { Clear } from "@mui/icons-material";
 import { InputAdornment, IconButton, TextField } from "@mui/material";
 function TextFieldWithAdornment(props) {
-  const { adornmentPosition, adornmentText, value, variant, handleClearValue, ...otherProps } = props;
+  const { adornmentPosition, adornmentText, value, variant, handleClearValue, slotProps, ...otherProps } = props;
   const [isFocused, setIsFocused] = useState(false);
   const getAdornmentStyle = useCallback((innerVariant) => {
     if (innerVariant === "filled") {
@@ -54,6 +54,7 @@ function TextFieldWithAdornment(props) {
       onFocus: () => setIsFocused(true),
       onBlur: () => setIsFocused(false),
       slotProps: {
+        ...slotProps,
         input: adornmentPosition === "start" ? withStartAdornmentText() : withEndAdornmentText()
       }
     }

package/dist/features/index.js

@@ -162,6 +162,8 @@ import { SWITCH_TYPE, buildNewBusbarSections, getCreateSwitchesEmptyFormData, ge
 import { SwitchKind } from "./network-modifications/voltageLevel/creation/voltageLevelCreation.types.js";
 import { VoltageLevelModificationForm } from "./network-modifications/voltageLevel/modification/VoltageLevelModificationForm.js";
 import { voltageLevelModificationDtoToForm, voltageLevelModificationEmptyFormData, voltageLevelModificationFormSchema, voltageLevelModificationFormToDto, voltageLevelModificationWithMeasurementsDtoToForm, voltageLevelModificationWithMeasurementsFormSchema, voltageLevelModificationWithMeasurementsFormToDto } from "./network-modifications/voltageLevel/modification/voltageLevelModification.utils.js";
+import { createVoltageLevelTopologyDtoToForm, createVoltageLevelTopologyEmptyFormData, createVoltageLevelTopologyFormSchema, createVoltageLevelTopologyFormToDto } from "./network-modifications/voltageLevel/topology/voltageLevelTopologyCreation.utils.js";
+import { CreateVoltageLevelTopologyForm } from "./network-modifications/voltageLevel/topology/CreateVoltageLevelTopologyForm.js";
 import { LOAD_TAB_FIELDS, LoadDialogTab } from "./network-modifications/load/common/load.utils.js";
 import { LoadDialogTabs } from "./network-modifications/load/common/LoadDialogTabs.js";
 import { LoadDialogTabsContent } from "./network-modifications/load/common/LoadDialogTabsContent.js";
@@ -307,6 +309,7 @@ export {
   ConnectivityForm,
   ContingencyTable,
   CreateParameterDialog,
+  CreateVoltageLevelTopologyForm,
   CustomVoltageLevelTable,
   CustomVoltageLevelTableCell,
   CustomVoltageLevelTableRow,
@@ -637,6 +640,10 @@ export {
   createPropertyModification,
   createRootNetworkChipCellSx,
   createRowSx,
+  createVoltageLevelTopologyDtoToForm,
+  createVoltageLevelTopologyEmptyFormData,
+  createVoltageLevelTopologyFormSchema,
+  createVoltageLevelTopologyFormToDto,
   creationPropertiesSchema,
   dispatchUser,
   emptyFormData,

package/dist/features/network-modifications/common/connectivity/connectivity.type.d.ts

@@ -21,7 +21,7 @@ export interface Connectivity {
     connectionPosition?: number;
     terminalConnected?: boolean;
 }
-type PositionDiagramPaneType = React.ComponentType<{
+export type PositionDiagramPaneType = React.ComponentType<{
     open: boolean;
     onClose: () => void;
     voltageLevelId: string;

package/dist/features/network-modifications/index.js

@@ -90,6 +90,8 @@ import { SWITCH_TYPE, buildNewBusbarSections, getCreateSwitchesEmptyFormData, ge
 import { SwitchKind } from "./voltageLevel/creation/voltageLevelCreation.types.js";
 import { VoltageLevelModificationForm } from "./voltageLevel/modification/VoltageLevelModificationForm.js";
 import { voltageLevelModificationDtoToForm, voltageLevelModificationEmptyFormData, voltageLevelModificationFormSchema, voltageLevelModificationFormToDto, voltageLevelModificationWithMeasurementsDtoToForm, voltageLevelModificationWithMeasurementsFormSchema, voltageLevelModificationWithMeasurementsFormToDto } from "./voltageLevel/modification/voltageLevelModification.utils.js";
+import { createVoltageLevelTopologyDtoToForm, createVoltageLevelTopologyEmptyFormData, createVoltageLevelTopologyFormSchema, createVoltageLevelTopologyFormToDto } from "./voltageLevel/topology/voltageLevelTopologyCreation.utils.js";
+import { CreateVoltageLevelTopologyForm } from "./voltageLevel/topology/CreateVoltageLevelTopologyForm.js";
 import { LOAD_TAB_FIELDS, LoadDialogTab } from "./load/common/load.utils.js";
 import { LoadDialogTabs } from "./load/common/LoadDialogTabs.js";
 import { LoadDialogTabsContent } from "./load/common/LoadDialogTabsContent.js";
@@ -159,6 +161,7 @@ export {
   CHARACTERISTICS_CHOICES,
   CharacteristicsForm,
   ConnectivityForm,
+  CreateVoltageLevelTopologyForm,
   EQUIPMENTS_FIELDS,
   EQUIPMENT_TYPE_ORDER,
   EquipmentDeletionForm,
@@ -257,6 +260,10 @@ export {
   copyEquipmentPropertiesForCreation,
   createConnectivityData,
   createPropertyModification,
+  createVoltageLevelTopologyDtoToForm,
+  createVoltageLevelTopologyEmptyFormData,
+  createVoltageLevelTopologyFormSchema,
+  createVoltageLevelTopologyFormToDto,
   creationPropertiesSchema,
   emptyFormData,
   emptyLineSegment,

package/dist/features/network-modifications/voltageLevel/index.d.ts

@@ -7,3 +7,4 @@
 export * from './creation';
 export * from './voltage-level.type';
 export * from './modification';
+export * from './topology';

package/dist/features/network-modifications/voltageLevel/index.js

@@ -68,7 +68,10 @@ import { SWITCH_TYPE, buildNewBusbarSections, getCreateSwitchesEmptyFormData, ge
 import { SwitchKind } from "./creation/voltageLevelCreation.types.js";
 import { VoltageLevelModificationForm } from "./modification/VoltageLevelModificationForm.js";
 import { voltageLevelModificationDtoToForm, voltageLevelModificationEmptyFormData, voltageLevelModificationFormSchema, voltageLevelModificationFormToDto, voltageLevelModificationWithMeasurementsDtoToForm, voltageLevelModificationWithMeasurementsFormSchema, voltageLevelModificationWithMeasurementsFormToDto } from "./modification/voltageLevelModification.utils.js";
+import { createVoltageLevelTopologyDtoToForm, createVoltageLevelTopologyEmptyFormData, createVoltageLevelTopologyFormSchema, createVoltageLevelTopologyFormToDto } from "./topology/voltageLevelTopologyCreation.utils.js";
+import { CreateVoltageLevelTopologyForm } from "./topology/CreateVoltageLevelTopologyForm.js";
 export {
+  CreateVoltageLevelTopologyForm,
   MAX_SECTIONS_COUNT,
   SWITCH_TYPE,
   SwitchKind,
@@ -76,6 +79,10 @@ export {
   VoltageLevelCreationForm,
   VoltageLevelModificationForm,
   buildNewBusbarSections,
+  createVoltageLevelTopologyDtoToForm,
+  createVoltageLevelTopologyEmptyFormData,
+  createVoltageLevelTopologyFormSchema,
+  createVoltageLevelTopologyFormToDto,
   getCreateSwitchesEmptyFormData,
   getCreateSwitchesValidationSchema,
   translateSwitchKinds,

package/dist/features/network-modifications/voltageLevel/topology/CreateVoltageLevelTopologyForm.d.ts

@@ -0,0 +1,6 @@
+import { PositionDiagramPaneType } from '../../common';
+export interface CreateVoltageLevelTopologyFormProps {
+    voltageLevelId: string;
+    PositionDiagramPane?: PositionDiagramPaneType;
+}
+export declare function CreateVoltageLevelTopologyForm({ voltageLevelId, PositionDiagramPane, }: Readonly<CreateVoltageLevelTopologyFormProps>): import("react").JSX.Element;

package/dist/features/network-modifications/voltageLevel/topology/CreateVoltageLevelTopologyForm.js

@@ -0,0 +1,135 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { useState, useMemo } from "react";
+import { TextField, Stack, Grid, Button, Tooltip, Box } from "@mui/material";
+import { useIntl, FormattedMessage } from "react-intl";
+import { InfoOutlined } from "@mui/icons-material";
+import "../../../../components/ui/overflowableText/OverflowableText.js";
+import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
+import "../../../../utils/conversionUtils.js";
+import "../../../../utils/types/equipmentType.js";
+import "react-hook-form";
+import "localized-countries";
+import "localized-countries/data/fr";
+import "localized-countries/data/en";
+import "notistack";
+import "../../../../components/ui/reactHookForm/provider/CustomFormProvider.js";
+import { useCustomFormContext } from "../../../../components/ui/reactHookForm/provider/useCustomFormContext.js";
+import "yup";
+import "../../../../components/ui/treeViewFinder/TreeViewFinder.js";
+import { IntegerInput } from "../../../../components/ui/reactHookForm/numbers/IntegerInput.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";
+import "@material-symbols/svg-400/outlined/arrows_input.svg?react";
+import "@material-symbols/svg-400/outlined/left_panel_close.svg?react";
+import "@material-symbols/svg-400/outlined/add_notes-fill.svg?react";
+import "../../../../components/ui/dialogs/descriptionModificationDialog/DescriptionModificationDialog.js";
+import "../../../../components/ui/reactHookForm/expandableInput/ExpandableInput.js";
+import "../../../../components/ui/reactHookForm/directory-item-input/directory-item-utils.js";
+import "@hello-pangea/dnd";
+import "../../../../components/ui/dialogs/elementSaveDialog/ElementSaveDialog.js";
+import "../../../../components/ui/snackbarProvider/SnackbarProvider.js";
+import "mui-nested-menu";
+import "react-resizable-panels";
+import "react-papaparse";
+import { SwitchesBetweenSections } from "../creation/tabs/structureTab/switchesBetweenSections/SwitchesBetweenSections.js";
+import { filledTextField } from "../../common/form.utils.js";
+import "../../common/properties/propertyUtils.js";
+import "react-dom";
+import "autosuggest-highlight/match";
+import "autosuggest-highlight/parse";
+import "clsx";
+import "../../../../components/composite/filter/FilterCreationDialog.js";
+import "../../../../components/composite/filter/HeaderFilterForm.js";
+import "../../../../components/composite/filter/explicitNaming/ExplicitNamingFilterForm.js";
+import "../../../../components/composite/filter/expert/ExpertFilterForm.js";
+import "../../../../components/composite/filter/expert/ExpertFilterEditionDialog.js";
+import "../../../../components/composite/filter/expert/expertFilterConstants.js";
+import "react-querybuilder";
+import "uuid";
+import "../../../../components/composite/filter/explicitNaming/ExplicitNamingFilterEditionDialog.js";
+import "../../../../components/composite/filter/utils/filterFormUtils.js";
+import "@react-querybuilder/material";
+import "../../../../components/composite/reactQueryBuilder/CustomReactQueryBuilder.js";
+import "../../../../components/composite/reactQueryBuilder/PropertyValueEditor.js";
+import "../../../../components/composite/agGridTable/BottomTableButtons.js";
+import "../../../../components/composite/agGridTable/CustomAgGridTable.js";
+import "ag-grid-community";
+import "../../../../components/composite/customAGGrid/customAggrid.js";
+import "../../../../components/composite/customAGGrid/context/custom-aggrid-context.js";
+import "mathjs";
+import "../../../../components/composite/report/report-viewer/log-table/log-table.js";
+import "react-window";
+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";
+import "@mui/material/colors";
+import "@mui/x-charts";
+import "../../common/currentLimits/limitsPane.utils.js";
+import "../creation/voltageLevel.constants.js";
+import "../creation/voltageLevelCreation.utils.js";
+function CreateVoltageLevelTopologyForm({
+  voltageLevelId,
+  PositionDiagramPane
+}) {
+  const [isDiagramPaneOpen, setIsDiagramPaneOpen] = useState(false);
+  const intl = useIntl();
+  const { isNodeBuilt } = useCustomFormContext();
+  const handleCloseDiagramPane = () => {
+    setIsDiagramPaneOpen(false);
+  };
+  const handleClickOpenDiagramPane = () => {
+    setIsDiagramPaneOpen(true);
+  };
+  const voltageLevelIdField = useMemo(
+    () => /* @__PURE__ */ jsx(
+      TextField,
+      {
+        size: "small",
+        fullWidth: true,
+        label: intl.formatMessage({ id: "VoltageLevelId" }),
+        value: voltageLevelId ?? "",
+        slotProps: {
+          input: {
+            readOnly: true
+          }
+        },
+        disabled: true,
+        ...filledTextField
+      }
+    ),
+    [intl, voltageLevelId]
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(Stack, { children: [
+      /* @__PURE__ */ jsx(Grid, { children: /* @__PURE__ */ jsxs(Stack, { spacing: 2, children: [
+        /* @__PURE__ */ jsx(Grid, { children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 3, alignItems: "center", children: [
+          /* @__PURE__ */ jsx(Grid, { size: 4, children: voltageLevelIdField }),
+          PositionDiagramPane && isNodeBuilt && /* @__PURE__ */ jsx(Grid, { children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 1, children: [
+            /* @__PURE__ */ jsx(Grid, { children: /* @__PURE__ */ jsx(Button, { onClick: handleClickOpenDiagramPane, variant: "outlined", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "CreateCouplingDeviceDiagramButton" }) }) }),
+            /* @__PURE__ */ jsx(Grid, { children: /* @__PURE__ */ jsx(
+              Tooltip,
+              {
+                title: intl.formatMessage({ id: "builtNodeTooltipForDiagram" }),
+                children: /* @__PURE__ */ jsx(InfoOutlined, { color: "info", fontSize: "small" })
+              }
+            ) })
+          ] }) })
+        ] }) }),
+        /* @__PURE__ */ jsx(Grid, { children: /* @__PURE__ */ jsx(Grid, { container: true, spacing: 3, children: /* @__PURE__ */ jsx(Grid, { size: 4, children: /* @__PURE__ */ jsx(IntegerInput, { name: FieldConstants.SECTION_COUNT, label: "SectionCount" }) }) }) })
+      ] }) }),
+      /* @__PURE__ */ jsx(Grid, { children: /* @__PURE__ */ jsx(SwitchesBetweenSections, {}) })
+    ] }),
+    PositionDiagramPane && /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
+      PositionDiagramPane,
+      {
+        open: isDiagramPaneOpen,
+        onClose: handleCloseDiagramPane,
+        voltageLevelId
+      }
+    ) })
+  ] });
+}
+export {
+  CreateVoltageLevelTopologyForm
+};

package/dist/features/network-modifications/voltageLevel/topology/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) 2026, RTE (http://www.rte-france.com)
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+export * from './voltageLevelTopologyCreation.types';
+export * from './voltageLevelTopologyCreation.utils';
+export * from './CreateVoltageLevelTopologyForm';

package/dist/features/network-modifications/voltageLevel/topology/index.js

@@ -0,0 +1,9 @@
+import { createVoltageLevelTopologyDtoToForm, createVoltageLevelTopologyEmptyFormData, createVoltageLevelTopologyFormSchema, createVoltageLevelTopologyFormToDto } from "./voltageLevelTopologyCreation.utils.js";
+import { CreateVoltageLevelTopologyForm } from "./CreateVoltageLevelTopologyForm.js";
+export {
+  CreateVoltageLevelTopologyForm,
+  createVoltageLevelTopologyDtoToForm,
+  createVoltageLevelTopologyEmptyFormData,
+  createVoltageLevelTopologyFormSchema,
+  createVoltageLevelTopologyFormToDto
+};

package/dist/features/network-modifications/voltageLevel/topology/voltageLevelTopologyCreation.types.d.ts

@@ -0,0 +1,8 @@
+import { ModificationType } from '../../../../utils';
+export interface CreateVoltageLevelTopologyInfos {
+    type: ModificationType;
+    uuid?: string;
+    voltageLevelId: string;
+    sectionCount?: number | null;
+    switchKinds?: string[] | null;
+}

package/dist/features/network-modifications/voltageLevel/topology/voltageLevelTopologyCreation.types.js

@@ -0,0 +1 @@
+

package/dist/features/network-modifications/voltageLevel/topology/voltageLevelTopologyCreation.utils.d.ts

@@ -0,0 +1,25 @@
+import { IntlShape } from 'react-intl';
+import { DeepNullable } from '../../../../utils';
+import { CreateVoltageLevelTopologyInfos } from './voltageLevelTopologyCreation.types';
+/**
+ * Copyright (c) 2026, RTE (http://www.rte-france.com)
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+import * as yup from 'yup';
+export declare const createVoltageLevelTopologyFormSchema: yup.ObjectSchema<{
+    sectionCount: number | null;
+    switchesBetweenSections: string | null | undefined;
+    switchKinds: {
+        switchKind: string;
+    }[] | null | undefined;
+}, yup.AnyObject, {
+    sectionCount: undefined;
+    switchesBetweenSections: undefined;
+    switchKinds: "";
+}, "">;
+export type CreateVoltageLevelTopologyDialogSchemaForm = yup.InferType<typeof createVoltageLevelTopologyFormSchema>;
+export declare const createVoltageLevelTopologyEmptyFormData: DeepNullable<CreateVoltageLevelTopologyDialogSchemaForm>;
+export declare const createVoltageLevelTopologyDtoToForm: (editData: CreateVoltageLevelTopologyInfos | undefined, intl: IntlShape) => DeepNullable<CreateVoltageLevelTopologyDialogSchemaForm>;
+export declare const createVoltageLevelTopologyFormToDto: (voltageLevelTopology: CreateVoltageLevelTopologyDialogSchemaForm, voltageLevelId: string) => CreateVoltageLevelTopologyInfos;

package/dist/features/network-modifications/voltageLevel/topology/voltageLevelTopologyCreation.utils.js

@@ -0,0 +1,48 @@
+import * as yup from "yup";
+import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
+import "../../../../utils/conversionUtils.js";
+import "../../../../utils/types/equipmentType.js";
+import { ModificationType } from "../../../../utils/types/modificationType.js";
+import "react/jsx-runtime";
+import "@mui/icons-material";
+import { MAX_SECTIONS_COUNT } from "../creation/voltageLevel.constants.js";
+const createVoltageLevelTopologyFormSchema = yup.object().shape({
+  [FieldConstants.SECTION_COUNT]: yup.number().required().nullable().min(1, "AtLeastOneSectionAdded").max(MAX_SECTIONS_COUNT, "SectionCountMustBeLessThanOrEqualToTwenty"),
+  [FieldConstants.SWITCHES_BETWEEN_SECTIONS]: yup.string().nullable().when([FieldConstants.SECTION_COUNT], {
+    is: (sectionCount) => sectionCount > 1,
+    then: (schema) => schema.required()
+  }),
+  [FieldConstants.SWITCH_KINDS]: yup.array().of(
+    yup.object().shape({
+      [FieldConstants.SWITCH_KIND]: yup.string().required()
+    })
+  ).nullable()
+}).required();
+const createVoltageLevelTopologyEmptyFormData = {
+  [FieldConstants.SECTION_COUNT]: null,
+  [FieldConstants.SWITCHES_BETWEEN_SECTIONS]: "",
+  [FieldConstants.SWITCH_KINDS]: []
+};
+const createVoltageLevelTopologyDtoToForm = (editData, intl) => {
+  const switchKinds = editData?.switchKinds?.map((switchKind) => ({ [FieldConstants.SWITCH_KIND]: switchKind })) || [];
+  const switchesBetweenSections = editData?.switchKinds?.map((switchKind) => intl.formatMessage({ id: switchKind })).join(" / ") || "";
+  return {
+    [FieldConstants.SECTION_COUNT]: editData?.sectionCount ?? null,
+    [FieldConstants.SWITCHES_BETWEEN_SECTIONS]: switchesBetweenSections,
+    [FieldConstants.SWITCH_KINDS]: switchKinds
+  };
+};
+const createVoltageLevelTopologyFormToDto = (voltageLevelTopology, voltageLevelId) => ({
+  type: ModificationType.CREATE_VOLTAGE_LEVEL_TOPOLOGY,
+  voltageLevelId,
+  sectionCount: voltageLevelTopology[FieldConstants.SECTION_COUNT],
+  switchKinds: voltageLevelTopology[FieldConstants.SWITCH_KINDS]?.map(
+    (switchKindData) => switchKindData[FieldConstants.SWITCH_KIND]
+  )
+});
+export {
+  createVoltageLevelTopologyDtoToForm,
+  createVoltageLevelTopologyEmptyFormData,
+  createVoltageLevelTopologyFormSchema,
+  createVoltageLevelTopologyFormToDto
+};

package/dist/index.js

@@ -357,6 +357,8 @@ import { SWITCH_TYPE, buildNewBusbarSections, getCreateSwitchesEmptyFormData, ge
 import { SwitchKind } from "./features/network-modifications/voltageLevel/creation/voltageLevelCreation.types.js";
 import { VoltageLevelModificationForm } from "./features/network-modifications/voltageLevel/modification/VoltageLevelModificationForm.js";
 import { voltageLevelModificationDtoToForm, voltageLevelModificationEmptyFormData, voltageLevelModificationFormSchema, voltageLevelModificationFormToDto, voltageLevelModificationWithMeasurementsDtoToForm, voltageLevelModificationWithMeasurementsFormSchema, voltageLevelModificationWithMeasurementsFormToDto } from "./features/network-modifications/voltageLevel/modification/voltageLevelModification.utils.js";
+import { createVoltageLevelTopologyDtoToForm, createVoltageLevelTopologyEmptyFormData, createVoltageLevelTopologyFormSchema, createVoltageLevelTopologyFormToDto } from "./features/network-modifications/voltageLevel/topology/voltageLevelTopologyCreation.utils.js";
+import { CreateVoltageLevelTopologyForm } from "./features/network-modifications/voltageLevel/topology/CreateVoltageLevelTopologyForm.js";
 import { LOAD_TAB_FIELDS, LoadDialogTab } from "./features/network-modifications/load/common/load.utils.js";
 import { LoadDialogTabs } from "./features/network-modifications/load/common/LoadDialogTabs.js";
 import { LoadDialogTabsContent } from "./features/network-modifications/load/common/LoadDialogTabsContent.js";
@@ -629,6 +631,7 @@ export {
   CountrySelectionInput,
   CountryValueEditor,
   CreateParameterDialog,
+  CreateVoltageLevelTopologyForm,
   CsvDownloadButton,
   CsvExport,
   CsvPicker,
@@ -1261,6 +1264,10 @@ export {
   createPropertyModification,
   createRootNetworkChipCellSx,
   createRowSx,
+  createVoltageLevelTopologyDtoToForm,
+  createVoltageLevelTopologyEmptyFormData,
+  createVoltageLevelTopologyFormSchema,
+  createVoltageLevelTopologyFormToDto,
   creationPropertiesSchema,
   csvEn,
   csvFr,

package/dist/translations/en/networkModificationsEn.d.ts

@@ -300,4 +300,11 @@ export declare const networkModificationsEn: {
     copyLink: string;
     linkCopied: string;
     linkCopyError: string;
+    CreateVoltageLevelTopology: string;
+    CreateVoltageLevelTopologyError: string;
+    CreateCouplingDeviceDiagramButton: string;
+    builtNodeTooltipForDiagram: string;
+    AtLeastOneSectionAdded: string;
+    SectionCount: string;
+    VoltageLevelId: string;
 };

package/dist/translations/en/networkModificationsEn.js

@@ -294,7 +294,15 @@ const networkModificationsEn = {
   StateEstimationTab: "State estimation",
   copyLink: "Copy link",
   linkCopied: "Link copied",
-  linkCopyError: "Error while attempting to copy link"
+  linkCopyError: "Error while attempting to copy link",
+  // Voltage level topology creation
+  CreateVoltageLevelTopology: "Adding a busbar",
+  CreateVoltageLevelTopologyError: "Error while creating a voltage level topology",
+  CreateCouplingDeviceDiagramButton: "Show voltage level",
+  builtNodeTooltipForDiagram: "Current diagram taking into account all applied modifications",
+  AtLeastOneSectionAdded: "At least one busbar section must be added",
+  SectionCount: "Section count",
+  VoltageLevelId: "Voltage level ID"
 };
 export {
   networkModificationsEn

package/dist/translations/fr/networkModificationsFr.d.ts

@@ -300,4 +300,11 @@ export declare const networkModificationsFr: {
     copyLink: string;
     linkCopied: string;
     linkCopyError: string;
+    CreateVoltageLevelTopology: string;
+    CreateVoltageLevelTopologyError: string;
+    CreateCouplingDeviceDiagramButton: string;
+    builtNodeTooltipForDiagram: string;
+    AtLeastOneSectionAdded: string;
+    SectionCount: string;
+    VoltageLevelId: string;
 };

package/dist/translations/fr/networkModificationsFr.js

@@ -294,7 +294,15 @@ const networkModificationsFr = {
   StateEstimationTab: "Estimation d'état",
   copyLink: "Copier le lien",
   linkCopied: "Lien copié",
-  linkCopyError: "Erreur lors de la copie du lien"
+  linkCopyError: "Erreur lors de la copie du lien",
+  // Voltage level topology creation
+  CreateVoltageLevelTopology: "Ajouter un jeu de barre",
+  CreateVoltageLevelTopologyError: "Erreur lors de la création d'une topologie de poste",
+  CreateCouplingDeviceDiagramButton: "Voir le poste",
+  builtNodeTooltipForDiagram: "Diagramme courant prenant en compte toutes les modifications réalisées",
+  AtLeastOneSectionAdded: "Il faut ajouter au moins une section de jeu de barre",
+  SectionCount: "Nombre de sections",
+  VoltageLevelId: "ID Poste"
 };
 export {
   networkModificationsFr

package/dist/utils/constants/fieldConstants.d.ts

@@ -113,10 +113,19 @@ export declare enum FieldConstants {
     SWITCH_KINDS = "switchKinds",
     SWITCH_KIND = "switchKind",
     ADD_SUBSTATION_CREATION = "addSubstationCreationId",
+    ALL_BUS_BAR_SECTIONS = "allBusbarSections",
     BUS_BAR_COUNT = "busbarCount",
+    BUS_BAR_INDEX = "busbarIndex",
     BUS_BAR_SECTION_ID1 = "busbarSectionId1",
     BUS_BAR_SECTION_ID2 = "busbarSectionId2",
+    BUSBAR_SECTION_ID = "busbarSectionId",
     COUPLING_OMNIBUS = "couplingOmnibus",
+    IS_AFTER_BUSBAR_SECTION_ID = "isAfterBusBarSectionId",
+    NEW_SWITCH_STATES = "newSwitchStates",
+    SWITCH_AFTER_NOT_REQUIRED = "switchAfterNotRequired",
+    SWITCH_BEFORE_NOT_REQUIRED = "switchBeforeNotRequired",
+    SWITCHES_AFTER_SECTIONS = "switchesAfterSections",
+    SWITCHES_BEFORE_SECTIONS = "switchesBeforeSections",
     ENABLE_OLG_MODIFICATION = "enableOLGModification",
     HIDE_BUS_BAR_SECTION = "hideBusBarSection",
     HIDE_NOMINAL_VOLTAGE = "hideNominalVoltage",

package/dist/utils/constants/fieldConstants.js

@@ -107,10 +107,19 @@ var FieldConstants = /* @__PURE__ */ ((FieldConstants2) => {
   FieldConstants2["SWITCH_KINDS"] = "switchKinds";
   FieldConstants2["SWITCH_KIND"] = "switchKind";
   FieldConstants2["ADD_SUBSTATION_CREATION"] = "addSubstationCreationId";
+  FieldConstants2["ALL_BUS_BAR_SECTIONS"] = "allBusbarSections";
   FieldConstants2["BUS_BAR_COUNT"] = "busbarCount";
+  FieldConstants2["BUS_BAR_INDEX"] = "busbarIndex";
   FieldConstants2["BUS_BAR_SECTION_ID1"] = "busbarSectionId1";
   FieldConstants2["BUS_BAR_SECTION_ID2"] = "busbarSectionId2";
+  FieldConstants2["BUSBAR_SECTION_ID"] = "busbarSectionId";
   FieldConstants2["COUPLING_OMNIBUS"] = "couplingOmnibus";
+  FieldConstants2["IS_AFTER_BUSBAR_SECTION_ID"] = "isAfterBusBarSectionId";
+  FieldConstants2["NEW_SWITCH_STATES"] = "newSwitchStates";
+  FieldConstants2["SWITCH_AFTER_NOT_REQUIRED"] = "switchAfterNotRequired";
+  FieldConstants2["SWITCH_BEFORE_NOT_REQUIRED"] = "switchBeforeNotRequired";
+  FieldConstants2["SWITCHES_AFTER_SECTIONS"] = "switchesAfterSections";
+  FieldConstants2["SWITCHES_BEFORE_SECTIONS"] = "switchesBeforeSections";
   FieldConstants2["ENABLE_OLG_MODIFICATION"] = "enableOLGModification";
   FieldConstants2["HIDE_BUS_BAR_SECTION"] = "hideBusBarSection";
   FieldConstants2["HIDE_NOMINAL_VOLTAGE"] = "hideNominalVoltage";

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@gridsuite/commons-ui",
-    "version": "0.266.0",
+    "version": "0.267.0",
     "description": "common react components for gridsuite applications",
     "author": "gridsuite team",
     "homepage": "https://github.com/gridsuite",