@gridsuite/commons-ui 0.228.0 → 0.230.0

package/dist/components/composite/filter/explicitNaming/ExplicitNamingFilterForm.js

@@ -1,15 +1,15 @@
-import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { useEffect, useMemo, useCallback } from "react";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useEffect, useMemo, useCallback, useState, useRef } from "react";
 import { useIntl } from "react-intl";
 import { useWatch } from "react-hook-form";
-import { Box } from "@mui/material";
+import { Grid2, Alert } from "@mui/material";
 import { v4 } from "uuid";
 import * as yup from "yup";
 import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
 import { CustomAgGridTable } from "../../agGridTable/CustomAgGridTable.js";
 import { SelectInput } from "../../../ui/reactHookForm/selectInputs/SelectInput.js";
 import { isInjection } from "../../../../utils/types/equipmentTypes.js";
-import { NumericEditor } from "../../agGridTable/cellEditors/numericEditor.js";
+import { suppressNonNumericKeyboardEvent, NumericEditor } from "../../agGridTable/cellEditors/numericEditor.js";
 import { InputWithPopupConfirmation } from "../../../ui/reactHookForm/selectInputs/InputWithPopupConfirmation.js";
 import { toFloatOrNullValue } from "../../../ui/reactHookForm/utils/functions.js";
 import { DISTRIBUTION_KEY } from "../constants/FilterConstants.js";
@@ -18,17 +18,13 @@ import { useSnackMessage } from "../../../../hooks/useSnackMessage.js";
 import { ElementType } from "../../../../utils/types/elementType.js";
 import { ModifyElementSelection } from "../../../ui/dialogs/modifyElementSelection/ModifyElementSelection.js";
 import { exportFilter } from "../../../../services/study.js";
-import { unscrollableDialogStyles } from "../../../ui/dialogs/customMuiDialog/CustomMuiDialog.js";
-import "../../../ui/dialogs/descriptionModificationDialog/DescriptionModificationDialog.js";
-import "../../../ui/dialogs/elementSaveDialog/ElementSaveDialog.js";
+import { FILTER_EQUIPMENTS_ATTRIBUTES } from "./ExplicitNamingFilterConstants.js";
 import "../../../../utils/conversionUtils.js";
 import { snackWithFallback } from "../../../../utils/error.js";
 import "../../../../utils/types/equipmentType.js";
+import { LANG_SYSTEM } from "../../../../utils/langs.js";
 import "@mui/icons-material";
-import "@hello-pangea/dnd";
 import "../../../ui/overflowableText/OverflowableText.js";
-import { FILTER_EQUIPMENTS_ATTRIBUTES } from "./ExplicitNamingFilterConstants.js";
-import { filterStyles } from "../HeaderFilterForm.js";
 import "localized-countries";
 import "localized-countries/data/fr";
 import "localized-countries/data/en";
@@ -41,10 +37,14 @@ 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.svg?react";
+import "../../../ui/dialogs/descriptionModificationDialog/DescriptionModificationDialog.js";
 import "../../../ui/reactHookForm/expandableInput/ExpandableInput.js";
+import "@hello-pangea/dnd";
+import "../../../ui/dialogs/elementSaveDialog/ElementSaveDialog.js";
 import "../../../ui/snackbarProvider/SnackbarProvider.js";
 import "mui-nested-menu";
 import "react-resizable-panels";
+import { CsvPicker } from "../../../ui/csvPicker/csv-picker.js";
 const explicitNamingFilterSchema = {
   [FILTER_EQUIPMENTS_ATTRIBUTES]: yup.array().of(
     yup.object().shape({
@@ -118,6 +118,7 @@ function ExplicitNamingFilterForm({
         editable: true,
         singleClickEdit: true,
         cellEditor: NumericEditor,
+        suppressKeyboardEvent: suppressNonNumericKeyboardEvent,
         flex: 1
       });
     }
@@ -129,25 +130,35 @@ function ExplicitNamingFilterForm({
     }),
     []
   );
-  const csvFileHeaders = useMemo(() => {
-    const newCsvFileHeaders = [intl.formatMessage({ id: FieldConstants.EQUIPMENT_ID })];
-    if (forGeneratorBatteryOrLoad) {
-      newCsvFileHeaders.push(intl.formatMessage({ id: DISTRIBUTION_KEY }));
-    }
-    return newCsvFileHeaders;
-  }, [intl, forGeneratorBatteryOrLoad]);
-  const getDataFromCsvFile = useCallback((csvData) => {
-    if (csvData) {
-      return csvData.map((value) => {
-        return {
-          [FieldConstants.AG_GRID_ROW_UUID]: v4(),
-          [FieldConstants.EQUIPMENT_ID]: value[0]?.trim(),
-          [DISTRIBUTION_KEY]: toFloatOrNullValue(value[1]?.trim())
-        };
-      });
-    }
-    return [];
-  }, []);
+  const csvFileHeaders = useMemo(() => columnDefs.map((c) => c.headerName), [columnDefs]);
+  const getDataFromCsvFile = useCallback(
+    (csvData) => {
+      const [equipmentIdHeader, distributionKeyHeader] = csvFileHeaders;
+      return csvData.map((row) => ({
+        [FieldConstants.AG_GRID_ROW_UUID]: v4(),
+        [FieldConstants.EQUIPMENT_ID]: row[equipmentIdHeader]?.trim() ?? null,
+        [DISTRIBUTION_KEY]: distributionKeyHeader ? toFloatOrNullValue(row[distributionKeyHeader]?.trim()) : null
+      }));
+    },
+    [csvFileHeaders]
+  );
+  const [selectedFile, setSelectedFile] = useState();
+  const [fileErrorMessage, setFileErrorMessage] = useState();
+  const tableRef = useRef(null);
+  useEffect(() => {
+    setSelectedFile(void 0);
+    setFileErrorMessage(void 0);
+  }, [watchEquipmentType]);
+  const getTemplateData = useCallback(() => [csvFileHeaders], [csvFileHeaders]);
+  const getTableData = useCallback(() => {
+    const rows = getValues(FILTER_EQUIPMENTS_ATTRIBUTES) ?? [];
+    return [
+      csvFileHeaders,
+      ...rows.map(
+        (r) => forGeneratorBatteryOrLoad ? [r[FieldConstants.EQUIPMENT_ID] ?? "", r[DISTRIBUTION_KEY] ?? ""] : [r[FieldConstants.EQUIPMENT_ID] ?? ""]
+      )
+    ];
+  }, [csvFileHeaders, forGeneratorBatteryOrLoad, getValues]);
   const openConfirmationPopup = () => {
     return getValues(FILTER_EQUIPMENTS_ATTRIBUTES).some(
       (row) => row[DISTRIBUTION_KEY] || row[FieldConstants.EQUIPMENT_ID]
@@ -170,69 +181,89 @@ function ExplicitNamingFilterForm({
       (error) => snackWithFallback(snackError, error, { headerId: "convertIntoExplicitNamingFilterError" })
     );
   };
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(Box, { sx: unscrollableDialogStyles.unscrollableHeader, children: [
-      /* @__PURE__ */ jsx(
-        InputWithPopupConfirmation,
-        {
-          Input: SelectInput,
-          name: FieldConstants.EQUIPMENT_TYPE,
-          options: Object.values(FILTER_EQUIPMENTS),
-          disabled: !!sourceFilterForExplicitNamingConversion || isEditing && !isDeveloperMode,
-          label: "equipmentType",
-          shouldOpenPopup: openConfirmationPopup,
-          resetOnConfirmation: handleResetOnConfirmation,
-          message: "changeTypeMessage",
-          validateButtonLabel: "button.changeType",
-          sx: filterStyles.textField,
-          "data-testid": "EquipmentTypeSelector"
-        }
-      ),
-      sourceFilterForExplicitNamingConversion && /* @__PURE__ */ jsx(
-        ModifyElementSelection,
-        {
-          elementType: ElementType.STUDY,
-          onElementValidated: onStudySelected,
-          dialogOpeningButtonLabel: "selectStudyDialogButton",
-          dialogTitleLabel: "selectStudyDialogTitle",
-          dialogMessageLabel: "selectStudyText",
-          noElementMessageLabel: "noSelectedStudyText"
-        }
-      )
-    ] }),
-    watchEquipmentType && /* @__PURE__ */ jsx(
-      CustomAgGridTable,
-      {
-        name: FILTER_EQUIPMENTS_ATTRIBUTES,
-        columnDefs,
-        defaultColDef,
-        makeDefaultRowData,
-        pagination: true,
-        paginationPageSize: 100,
-        rowSelection: {
-          mode: "multiRow",
-          enableClickSelection: false,
-          checkboxes: true,
-          headerCheckbox: true
-        },
-        alwaysShowVerticalScroll: true,
-        csvProps: {
-          fileName: intl.formatMessage({
-            id: "filterCsvFileName"
-          }),
-          fileHeaders: csvFileHeaders,
-          getDataFromCsv: getDataFromCsvFile,
-          language
-        },
-        cssProps: {
-          padding: 1,
-          "& .ag-root-wrapper-body": {
-            maxHeight: "unset"
+  return /* @__PURE__ */ jsxs(
+    Grid2,
+    {
+      container: true,
+      direction: "column",
+      spacing: 2,
+      padding: 1,
+      sx: { flexGrow: 1, flexWrap: "nowrap", minHeight: 0 },
+      children: [
+        /* @__PURE__ */ jsxs(Grid2, { container: true, justifyContent: "space-between", alignItems: "center", children: [
+          /* @__PURE__ */ jsxs(Grid2, { children: [
+            /* @__PURE__ */ jsx(
+              InputWithPopupConfirmation,
+              {
+                Input: SelectInput,
+                name: FieldConstants.EQUIPMENT_TYPE,
+                options: Object.values(FILTER_EQUIPMENTS),
+                disabled: !!sourceFilterForExplicitNamingConversion || isEditing && !isDeveloperMode,
+                label: "equipmentType",
+                shouldOpenPopup: openConfirmationPopup,
+                resetOnConfirmation: handleResetOnConfirmation,
+                message: "changeTypeMessage",
+                validateButtonLabel: "button.changeType",
+                sx: { width: 400, maxWidth: "100%" },
+                "data-testid": "EquipmentTypeSelector"
+              }
+            ),
+            sourceFilterForExplicitNamingConversion && /* @__PURE__ */ jsx(
+              ModifyElementSelection,
+              {
+                elementType: ElementType.STUDY,
+                onElementValidated: onStudySelected,
+                dialogOpeningButtonLabel: "selectStudyDialogButton",
+                dialogTitleLabel: "selectStudyDialogTitle",
+                dialogMessageLabel: "selectStudyText",
+                noElementMessageLabel: "noSelectedStudyText"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsx(
+            CsvPicker,
+            {
+              label: "UploadCSV",
+              header: csvFileHeaders,
+              language: language ?? LANG_SYSTEM,
+              disabled: !watchEquipmentType,
+              selectedFile,
+              onFileChange: setSelectedFile,
+              onFileError: setFileErrorMessage,
+              getTableData: () => getValues(FILTER_EQUIPMENTS_ATTRIBUTES),
+              onAppend: (results) => tableRef.current?.append(getDataFromCsvFile(results.data)),
+              onReplace: (results) => tableRef.current?.replace(getDataFromCsvFile(results.data))
+            }
+          ) })
+        ] }),
+        fileErrorMessage && /* @__PURE__ */ jsx(Grid2, { children: /* @__PURE__ */ jsx(Alert, { severity: "error", children: fileErrorMessage }) }),
+        watchEquipmentType && /* @__PURE__ */ jsx(Grid2, { sx: { flexGrow: 1, minHeight: 0, display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ jsx(
+          CustomAgGridTable,
+          {
+            ref: tableRef,
+            name: FILTER_EQUIPMENTS_ATTRIBUTES,
+            columnDefs,
+            defaultColDef,
+            makeDefaultRowData,
+            pagination: true,
+            rowSelection: {
+              mode: "multiRow",
+              enableClickSelection: false,
+              checkboxes: true,
+              headerCheckbox: true
+            },
+            alwaysShowVerticalScroll: true,
+            csvProps: {
+              fileName: intl.formatMessage({ id: "filterCsvFileName" }),
+              language,
+              getTemplateData,
+              getTableData
+            }
           }
-        }
-      }
-    )
-  ] });
+        ) })
+      ]
+    }
+  );
 }
 export {
   ExplicitNamingFilterForm,

package/dist/components/composite/index.js

@@ -43,10 +43,9 @@ import { GroupValueEditor } from "./reactQueryBuilder/compositeRuleEditor/GroupV
 import { RuleValueEditor } from "./reactQueryBuilder/compositeRuleEditor/RuleValueEditor.js";
 import { useConvertValue } from "./reactQueryBuilder/hooks/useConvertValue.js";
 import { useValid } from "./reactQueryBuilder/hooks/useValid.js";
-import { BottomRightButtons } from "./agGridTable/BottomRightButtons.js";
+import { BottomTableButtons } from "./agGridTable/BottomTableButtons.js";
 import { CustomAgGridTable } from "./agGridTable/CustomAgGridTable.js";
-import { NumericEditor } from "./agGridTable/cellEditors/numericEditor.js";
-import { CsvUploader } from "./agGridTable/csvUploader/CsvUploader.js";
+import { NumericEditor, suppressNonNumericKeyboardEvent } from "./agGridTable/cellEditors/numericEditor.js";
 import { CUSTOM_AGGRID_THEME, styles } from "./customAGGrid/customAggrid.style.js";
 import { CustomAGGrid } from "./customAGGrid/customAggrid.js";
 import { SeparatorCellRenderer } from "./customAGGrid/separatorCellRenderer.js";
@@ -55,7 +54,7 @@ export {
   AutocompleteWithFavorites,
   BooleanCellRenderer,
   BooleanNullableCellRenderer,
-  BottomRightButtons,
+  BottomTableButtons,
   COMBINATOR_OPTIONS,
   CONTINGENCY_LIST_EQUIPMENTS,
   CONVERTERS_MODE_OPTIONS,
@@ -64,7 +63,6 @@ export {
   CombinatorType,
   ContingencyCellRenderer,
   CountryValueEditor,
-  CsvUploader,
   CustomAGGrid,
   CustomAgGridTable,
   CustomReactQueryBuilder,
@@ -139,6 +137,7 @@ export {
   saveExpertFilter,
   saveExplicitNamingFilter,
   styles,
+  suppressNonNumericKeyboardEvent,
   testQuery,
   useConvertValue,
   useElementSearch,

package/dist/components/index.js

@@ -68,6 +68,7 @@ import { ResizeHandle } from "./ui/resizablePanels/ResizeHandle.js";
 import { CsvExport } from "./ui/csvDownloader/csv-export.js";
 import { ExportCsvButton } from "./ui/csvDownloader/export-csv-button.js";
 import { fetchCsvSeparator, useCsvExport } from "./ui/csvDownloader/use-csv-export.js";
+import { CsvPicker } from "./ui/csvPicker/csv-picker.js";
 import { TreeViewFinder, generateTreeViewFinderClass } from "./ui/treeViewFinder/TreeViewFinder.js";
 import { doesNodeHasChildren } from "./ui/treeViewFinder/TreeViewUtils.js";
 import { DirectoryItemSelector } from "./ui/directoryItemSelector/DirectoryItemSelector.js";
@@ -116,10 +117,9 @@ import { GroupValueEditor } from "./composite/reactQueryBuilder/compositeRuleEdi
 import { RuleValueEditor } from "./composite/reactQueryBuilder/compositeRuleEditor/RuleValueEditor.js";
 import { useConvertValue } from "./composite/reactQueryBuilder/hooks/useConvertValue.js";
 import { useValid } from "./composite/reactQueryBuilder/hooks/useValid.js";
-import { BottomRightButtons } from "./composite/agGridTable/BottomRightButtons.js";
+import { BottomTableButtons } from "./composite/agGridTable/BottomTableButtons.js";
 import { CustomAgGridTable } from "./composite/agGridTable/CustomAgGridTable.js";
-import { NumericEditor } from "./composite/agGridTable/cellEditors/numericEditor.js";
-import { CsvUploader } from "./composite/agGridTable/csvUploader/CsvUploader.js";
+import { NumericEditor, suppressNonNumericKeyboardEvent } from "./composite/agGridTable/cellEditors/numericEditor.js";
 import { CUSTOM_AGGRID_THEME, styles } from "./composite/customAGGrid/customAggrid.style.js";
 import { CustomAGGrid } from "./composite/customAGGrid/customAggrid.js";
 import { SeparatorCellRenderer } from "./composite/customAGGrid/separatorCellRenderer.js";
@@ -135,7 +135,7 @@ export {
   BooleanCellRenderer,
   BooleanInput,
   BooleanNullableCellRenderer,
-  BottomRightButtons,
+  BottomTableButtons,
   ButtonReadOnlyInput,
   COMBINATOR_OPTIONS,
   CONTINGENCY_LIST_EQUIPMENTS,
@@ -153,7 +153,7 @@ export {
   CountrySelectionInput,
   CountryValueEditor,
   CsvExport,
-  CsvUploader,
+  CsvPicker,
   CustomAGGrid,
   CustomAgGridTable,
   CustomFormContext,
@@ -296,6 +296,7 @@ export {
   saveExpertFilter,
   saveExplicitNamingFilter,
   styles,
+  suppressNonNumericKeyboardEvent,
   testQuery,
   toFloatOrNullValue,
   unscrollableDialogStyles,

package/dist/components/ui/csvDownloader/use-csv-export.js

@@ -2,7 +2,7 @@ import { useCallback } from "react";
 import { useIntl } from "react-intl";
 import "../../../utils/conversionUtils.js";
 import "../../../utils/types/equipmentType.js";
-import { LANG_FRENCH } from "../../../utils/langs.js";
+import { getCsvDelimiter, LANG_FRENCH } from "../../../utils/langs.js";
 import "react/jsx-runtime";
 import "@mui/icons-material";
 import { fetchStudyMetadata } from "../../../services/appsMetadata.js";
@@ -37,7 +37,7 @@ const useCsvExport = () => {
         return tableName.trim().replace(/[\\/:"*?<>|\s]/g, "-").substring(0, 27);
       };
       const prefix = props.tableNamePrefix ?? "";
-      const defaultSeparator = props.language === LANG_FRENCH ? ";" : ",";
+      const defaultSeparator = getCsvDelimiter(props.language);
       const columnSeparatorValue = props.isCopyCsv ? await fetchCsvSeparator() ?? defaultSeparator : defaultSeparator;
       return props.getData({
         suppressQuotes: false,

package/dist/components/ui/csvPicker/csv-picker-confirmation-dialog.d.ts

@@ -0,0 +1,11 @@
+import { ParseResult } from 'papaparse';
+export interface CsvPickerConfirmationDialogProps<TData = unknown> {
+    pendingImport: {
+        results: ParseResult<TData>;
+        file: File;
+    } | null;
+    onReplace: (results: ParseResult<TData>, file: File) => void;
+    onAppend: (results: ParseResult<TData>, file: File) => void;
+    onClose: () => void;
+}
+export declare function CsvPickerConfirmationDialog<TData = unknown>({ pendingImport, onReplace, onAppend, onClose, }: CsvPickerConfirmationDialogProps<TData>): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/csvPicker/csv-picker-confirmation-dialog.js

@@ -0,0 +1,65 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useIntl, FormattedMessage } from "react-intl";
+import { Dialog, DialogTitle, DialogContent, DialogContentText, DialogActions, Button } from "@mui/material";
+import "../overflowableText/OverflowableText.js";
+import "../../../utils/conversionUtils.js";
+import "../../../utils/types/equipmentType.js";
+import "@mui/icons-material";
+import "react";
+import "react-hook-form";
+import "localized-countries";
+import "localized-countries/data/fr";
+import "localized-countries/data/en";
+import "notistack";
+import "../reactHookForm/provider/CustomFormProvider.js";
+import { CancelButton } from "../reactHookForm/utils/CancelButton.js";
+import "yup";
+import "../treeViewFinder/TreeViewFinder.js";
+import "../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.svg?react";
+import "../dialogs/descriptionModificationDialog/DescriptionModificationDialog.js";
+import "../reactHookForm/expandableInput/ExpandableInput.js";
+function CsvPickerConfirmationDialog({
+  pendingImport,
+  onReplace,
+  onAppend,
+  onClose
+}) {
+  const intl = useIntl();
+  return /* @__PURE__ */ jsxs(Dialog, { open: pendingImport !== null, "aria-labelledby": "csv-picker-confirmation", children: [
+    /* @__PURE__ */ jsx(DialogTitle, { id: "csv-picker-confirmation", children: "Confirmation" }),
+    /* @__PURE__ */ jsx(DialogContent, { children: /* @__PURE__ */ jsx(DialogContentText, { children: intl.formatMessage({ id: "keepCSVDataMessage" }) }) }),
+    /* @__PURE__ */ jsxs(DialogActions, { children: [
+      /* @__PURE__ */ jsx(CancelButton, { onClick: onClose }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outlined",
+          onClick: () => {
+            onReplace(pendingImport.results, pendingImport.file);
+            onClose();
+          },
+          children: /* @__PURE__ */ jsx(FormattedMessage, { id: "replace" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outlined",
+          onClick: () => {
+            onAppend(pendingImport.results, pendingImport.file);
+            onClose();
+          },
+          children: /* @__PURE__ */ jsx(FormattedMessage, { id: "add" })
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  CsvPickerConfirmationDialog
+};

package/dist/components/ui/csvPicker/csv-picker.d.ts

@@ -0,0 +1,24 @@
+import { ParseConfig, ParseResult } from 'papaparse';
+type CsvPickerCallbacks<TData> = {
+    onComplete: (results: ParseResult<TData>, file: File) => void;
+    onAppend?: never;
+    onReplace?: never;
+} | {
+    onComplete?: never;
+    onAppend: (results: ParseResult<TData>, file: File) => void;
+    onReplace: (results: ParseResult<TData>, file: File) => void;
+};
+export type CsvPickerProps<TData = unknown> = {
+    label: string;
+    header: string[];
+    maxLineNumber?: number;
+    disabled?: boolean;
+    language: string;
+    parseConfig?: Partial<ParseConfig<TData>>;
+    selectedFile?: File;
+    onFileChange: (file: File | undefined) => void;
+    onFileError: (error: string | undefined) => void;
+    getTableData?: () => unknown[];
+} & CsvPickerCallbacks<TData>;
+export declare function CsvPicker<TData = unknown>({ label, header, maxLineNumber, disabled, language, parseConfig, selectedFile, onFileChange, onFileError, onComplete, onAppend, onReplace, getTableData, }: CsvPickerProps<TData>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/ui/csvPicker/csv-picker.js

@@ -0,0 +1,123 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { useIntl, FormattedMessage } from "react-intl";
+import { Button } from "@mui/material";
+import { useCSVReader } from "react-papaparse";
+import { equalsArrayAnyOrder } from "../../../utils/algos.js";
+import "../../../utils/conversionUtils.js";
+import "../../../utils/types/equipmentType.js";
+import { hasNonEmptyRows } from "../../../utils/functions.js";
+import { getCsvDelimiter } from "../../../utils/langs.js";
+import "@mui/icons-material";
+import { CsvPickerConfirmationDialog } from "./csv-picker-confirmation-dialog.js";
+function CsvPicker({
+  label,
+  header,
+  maxLineNumber,
+  disabled = false,
+  language,
+  parseConfig,
+  selectedFile,
+  onFileChange,
+  onFileError,
+  onComplete,
+  onAppend,
+  onReplace,
+  getTableData
+}) {
+  const intl = useIntl();
+  const { CSVReader } = useCSVReader();
+  const [pendingImport, setPendingImport] = useState(null);
+  const handleUploadAccepted = useCallback(
+    (results, acceptedFile) => {
+      if (results.data.length === 0) {
+        onFileError(intl.formatMessage({ id: "noDataInCsvFile" }, { filename: acceptedFile.name }));
+      } else if (!equalsArrayAnyOrder(header, Object.keys(results.data[0]))) {
+        console.warn("Wrong CSV headers");
+        console.warn("Expected:", header);
+        console.warn("Actual:", Object.keys(results.data[0]));
+        onFileError(intl.formatMessage({ id: "wrongCsvHeadersError" }, { filename: acceptedFile.name }));
+      } else if (maxLineNumber && results.data.length > maxLineNumber) {
+        onFileError(
+          intl.formatMessage(
+            { id: "tooManyLinesInCsvFile" },
+            { value: maxLineNumber, filename: acceptedFile.name }
+          )
+        );
+      } else {
+        onFileError(void 0);
+        if (onAppend && onReplace) {
+          if (hasNonEmptyRows(getTableData?.())) {
+            setPendingImport({ results, file: acceptedFile });
+          } else {
+            onReplace(results, acceptedFile);
+            onFileChange(acceptedFile);
+          }
+        } else {
+          onComplete?.(results, acceptedFile);
+          onFileChange(acceptedFile);
+        }
+      }
+    },
+    [header, intl, maxLineNumber, onAppend, onComplete, onFileChange, onFileError, onReplace, getTableData]
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      CSVReader,
+      {
+        config: {
+          header: true,
+          skipEmptyLines: true,
+          comments: "#",
+          delimiter: getCsvDelimiter(language),
+          ...parseConfig
+        },
+        onUploadAccepted: handleUploadAccepted,
+        children: ({ getRootProps, ProgressBar }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              style: {
+                marginRight: "10px",
+                fontWeight: "bold"
+              },
+              children: selectedFile ? selectedFile.name : intl.formatMessage({ id: "uploadMessage" })
+            }
+          ),
+          /* @__PURE__ */ jsxs(Button, { ...getRootProps(), variant: "outlined", disabled, children: [
+            /* @__PURE__ */ jsx(FormattedMessage, { id: label }),
+            /* @__PURE__ */ jsx(
+              ProgressBar,
+              {
+                style: {
+                  position: "absolute",
+                  inset: 0,
+                  width: "100%",
+                  height: "100%"
+                }
+              }
+            )
+          ] })
+        ] })
+      }
+    ),
+    onAppend && onReplace && /* @__PURE__ */ jsx(
+      CsvPickerConfirmationDialog,
+      {
+        pendingImport,
+        onReplace: (r, f) => {
+          onReplace(r, f);
+          onFileChange(f);
+        },
+        onAppend: (r, f) => {
+          onAppend(r, f);
+          onFileChange(f);
+        },
+        onClose: () => setPendingImport(null)
+      }
+    )
+  ] });
+}
+export {
+  CsvPicker
+};

package/dist/components/{composite/agGridTable/csvUploader → ui/csvPicker}/index.d.ts

@@ -1,7 +1,7 @@
 /**
- * Copyright (c) 2024, RTE (http://www.rte-france.com)
+ * 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 './CsvUploader';
+export * from './csv-picker';

package/dist/components/ui/csvPicker/index.js

@@ -0,0 +1,4 @@
+import { CsvPicker } from "./csv-picker.js";
+export {
+  CsvPicker
+};

package/dist/components/ui/dialogs/elementSaveDialog/ElementSaveDialog.js

@@ -118,7 +118,7 @@ function ElementSaveDialog({
     onClose();
   }, [onClose, reset, initialOperation]);
   useEffect(() => {
-    if (!isCreateMode) {
+    if (!isCreateMode || !defaultName && !prefixIdForGeneratedName) {
       return;
     }
     const name = defaultName ?? `${intl.formatMessage({ id: prefixIdForGeneratedName })}-${(/* @__PURE__ */ new Date()).toISOString()}`;

package/dist/components/ui/index.d.ts

@@ -16,5 +16,6 @@ export * from './icons';
 export * from './menus';
 export * from './resizablePanels';
 export * from './csvDownloader';
+export * from './csvPicker';
 export * from './treeViewFinder';
 export * from './directoryItemSelector';

package/dist/components/ui/index.js

@@ -68,6 +68,7 @@ import { ResizeHandle } from "./resizablePanels/ResizeHandle.js";
 import { CsvExport } from "./csvDownloader/csv-export.js";
 import { ExportCsvButton } from "./csvDownloader/export-csv-button.js";
 import { fetchCsvSeparator, useCsvExport } from "./csvDownloader/use-csv-export.js";
+import { CsvPicker } from "./csvPicker/csv-picker.js";
 import { TreeViewFinder, generateTreeViewFinderClass } from "./treeViewFinder/TreeViewFinder.js";
 import { doesNodeHasChildren } from "./treeViewFinder/TreeViewUtils.js";
 import { DirectoryItemSelector } from "./directoryItemSelector/DirectoryItemSelector.js";
@@ -88,6 +89,7 @@ export {
   CountriesInput,
   CountrySelectionInput,
   CsvExport,
+  CsvPicker,
   CustomFormContext,
   CustomFormProvider,
   CustomMenuItem,