@gridsuite/commons-ui 0.213.0 → 0.215.0

package/dist/components/ui/checkBoxList/CheckBoxListItem.js

@@ -0,0 +1,74 @@
+import { jsx } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { ListItem, ListItemButton } from "@mui/material";
+import { CheckBoxListItemContent } from "./CheckBoxListItemContent.js";
+import "../../../utils/conversionUtils.js";
+import "../../../utils/types/equipmentType.js";
+import "@mui/icons-material";
+import { mergeSx } from "../../../utils/styles.js";
+import "../../../utils/yupConfig.js";
+const styles = {
+  checkboxListItem: {
+    alignItems: "flex-start",
+    // this is the only way to unset the absolute positionning of the secondary action
+    "& .MuiListItemSecondaryAction-root": {
+      marginTop: "1px",
+      position: "relative",
+      top: 0,
+      right: 0,
+      transform: "none"
+    },
+    // this is the only way to unset a 48px right padding when ListItemButton is hovered
+    "& .MuiListItemButton-root": {
+      paddingRight: "0px"
+    }
+  }
+};
+function CheckBoxListItem({
+  item,
+  sx,
+  secondaryAction,
+  getItemId,
+  divider,
+  onItemClick,
+  isItemClickable,
+  disabled,
+  ...props
+}) {
+  const [hover, setHover] = useState("");
+  const handleItemClick = useCallback(() => {
+    if (!onItemClick) {
+      return;
+    }
+    if (isItemClickable) {
+      if (isItemClickable(item)) {
+        onItemClick(item);
+      }
+      return;
+    }
+    onItemClick(item);
+  }, [isItemClickable, item, onItemClick]);
+  return /* @__PURE__ */ jsx(
+    ListItem,
+    {
+      secondaryAction: secondaryAction?.(item, hover),
+      sx: mergeSx(styles.checkboxListItem, sx?.checkboxListItem),
+      onMouseEnter: () => setHover(getItemId(item)),
+      onMouseLeave: () => setHover(""),
+      disablePadding: true,
+      divider,
+      children: onItemClick ? /* @__PURE__ */ jsx(
+        ListItemButton,
+        {
+          sx: mergeSx({ alignItems: "flex-start", padding: "unset" }, sx?.checkboxButton),
+          disabled,
+          onClick: handleItemClick,
+          children: /* @__PURE__ */ jsx(CheckBoxListItemContent, { sx, ...props })
+        }
+      ) : /* @__PURE__ */ jsx(CheckBoxListItemContent, { sx, ...props })
+    }
+  );
+}
+export {
+  CheckBoxListItem
+};

package/dist/components/ui/checkBoxList/CheckBoxListItemContent.js

@@ -0,0 +1,45 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { ListItemIcon, Checkbox, ListItemText } from "@mui/material";
+import { OverflowableText } from "../overflowableText/OverflowableText.js";
+import "../../../utils/conversionUtils.js";
+import "../../../utils/types/equipmentType.js";
+import "@mui/icons-material";
+import { mergeSx } from "../../../utils/styles.js";
+import "../../../utils/yupConfig.js";
+function CheckBoxListItemContent({
+  sx,
+  label,
+  secondary,
+  onClick,
+  ...props
+}) {
+  const onCheckboxClick = (event) => {
+    event.stopPropagation();
+    onClick();
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(ListItemIcon, { sx: mergeSx({ marginTop: "0px" }, sx?.checkBoxIcon), children: /* @__PURE__ */ jsx(Checkbox, { sx: sx?.checkbox, disableRipple: true, onClick: onCheckboxClick, ...props }) }),
+    /* @__PURE__ */ jsx(
+      ListItemText,
+      {
+        sx: mergeSx(
+          {
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "flex-start",
+            paddingTop: "0px",
+            // this is to align text with default padding/margin of the checkbox
+            marginTop: "9px"
+          },
+          sx?.listItemText
+        ),
+        disableTypography: true,
+        secondary,
+        children: /* @__PURE__ */ jsx(OverflowableText, { sx: mergeSx({ width: "100%" }, sx?.label), text: label })
+      }
+    )
+  ] });
+}
+export {
+  CheckBoxListItemContent
+};

package/dist/components/ui/checkBoxList/DraggableCheckBoxListItem.js

@@ -0,0 +1,84 @@
+import { jsx } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { ListItem, ListItemButton } from "@mui/material";
+import { DraggableCheckBoxListItemContent } from "./DraggableCheckBoxListItemContent.js";
+import "../../../utils/conversionUtils.js";
+import "../../../utils/types/equipmentType.js";
+import "@mui/icons-material";
+import { mergeSx } from "../../../utils/styles.js";
+import "../../../utils/yupConfig.js";
+const styles = {
+  checkboxListItem: {
+    // this is to align ListItem children and its secondary action
+    alignItems: "flex-start",
+    // this is the only way to unset the absolute positionning of the secondary action
+    "& .MuiListItemSecondaryAction-root": {
+      marginTop: "1px",
+      position: "relative",
+      top: 0,
+      right: 0,
+      transform: "none"
+    },
+    // this is the only way to unset a 48px right padding when ListItemButton is hovered
+    "& .MuiListItemButton-root": {
+      paddingRight: "0px"
+    }
+  }
+};
+function DraggableCheckBoxListItem({
+  item,
+  sx,
+  secondaryAction,
+  getItemId,
+  isDragDisable,
+  provided,
+  divider,
+  onItemClick,
+  isItemClickable,
+  disabled,
+  ...props
+}) {
+  const [hover, setHover] = useState("");
+  const handleItemClick = useCallback(() => onItemClick?.(item), [item, onItemClick]);
+  return /* @__PURE__ */ jsx(
+    ListItem,
+    {
+      secondaryAction: secondaryAction?.(item, hover),
+      sx: mergeSx(styles.checkboxListItem, sx?.checkboxListItem),
+      onMouseEnter: () => setHover(getItemId(item)),
+      onMouseLeave: () => setHover(""),
+      disablePadding: true,
+      ref: provided.innerRef,
+      ...provided.draggableProps,
+      children: isItemClickable?.(item) ? /* @__PURE__ */ jsx(
+        ListItemButton,
+        {
+          sx: mergeSx({ alignItems: "flex-start", paddingTop: "0px" }, sx?.checkboxButton),
+          disabled,
+          onClick: handleItemClick,
+          disableGutters: true,
+          children: /* @__PURE__ */ jsx(
+            DraggableCheckBoxListItemContent,
+            {
+              provided,
+              isHighlighted: hover === getItemId(item) && !isDragDisable,
+              sx,
+              ...props
+            }
+          )
+        }
+      ) : /* @__PURE__ */ jsx(
+        DraggableCheckBoxListItemContent,
+        {
+          provided,
+          isHighlighted: hover === getItemId(item) && !isDragDisable,
+          sx,
+          ...props
+        }
+      )
+    }
+  );
+}
+export {
+  DraggableCheckBoxListItem
+};

package/dist/components/ui/checkBoxList/DraggableCheckBoxListItemContent.js

@@ -0,0 +1,38 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { DragIndicator } from "@mui/icons-material";
+import { IconButton } from "@mui/material";
+import { CheckBoxListItemContent } from "./CheckBoxListItemContent.js";
+import "../../../utils/conversionUtils.js";
+import "../../../utils/types/equipmentType.js";
+import { mergeSx } from "../../../utils/styles.js";
+import "../../../utils/yupConfig.js";
+function DraggableCheckBoxListItemContent({
+  provided,
+  isHighlighted,
+  sx,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        ...provided.dragHandleProps,
+        size: "small",
+        sx: mergeSx(
+          {
+            display: isHighlighted ? "block" : "none",
+            padding: "unset",
+            marginTop: "9px"
+            // this is to align drag button to the checkbox and label
+          },
+          sx?.dragButton
+        ),
+        children: /* @__PURE__ */ jsx(DragIndicator, {})
+      }
+    ),
+    /* @__PURE__ */ jsx(CheckBoxListItemContent, { sx, ...props })
+  ] });
+}
+export {
+  DraggableCheckBoxListItemContent
+};

package/dist/components/ui/checkBoxList/checkBoxList.type.d.ts

@@ -0,0 +1,74 @@
+import { ReactElement, ReactNode } from 'react';
+import { DraggableProvided, DragStart, DropResult } from '@hello-pangea/dnd';
+import { SxStyle } from '../../../utils/styles';
+export type CheckBoxListItemSx = {
+    checkBoxIcon?: SxStyle;
+    listItemText?: SxStyle;
+    label?: SxStyle;
+    checkboxListItem?: SxStyle;
+    checkboxButton?: SxStyle;
+    checkbox?: SxStyle;
+    dragButton?: SxStyle;
+};
+export type CheckBoxListSx = {
+    dragAndDropContainer?: SxStyle;
+    checkboxList?: SxStyle;
+};
+export type CheckBoxListItemSxMethod<T> = (item: T) => CheckBoxListItemSx;
+type CheckBoxListItemSxProps<T> = CheckBoxListSx & {
+    items: CheckBoxListItemSx | CheckBoxListItemSxMethod<T>;
+};
+export interface CheckBoxListItemProps<T> {
+    item: T;
+    sx?: CheckBoxListItemSx;
+    label: ReactNode;
+    secondary?: ReactNode;
+    onClick: () => void;
+    secondaryAction?: (item: T, hover: string) => ReactElement | null;
+    getItemId: (item: T) => string;
+    disabled?: boolean;
+    divider?: boolean;
+    checked: boolean;
+    onItemClick?: (item: T) => void;
+    isItemClickable?: (item: T) => boolean;
+}
+export interface DraggableCheckBoxListItemProps<T> extends CheckBoxListItemProps<T> {
+    isDragDisable?: boolean;
+    provided: DraggableProvided;
+}
+export interface CheckBoxListItemsProps<T> {
+    items: T[];
+    selectedItems: T[];
+    onSelectionChange?: (selectedItems: T[]) => void;
+    getItemId: (item: T) => string;
+    getItemLabel?: (item: T) => ReactNode;
+    getItemLabelSecondary?: (item: T) => ReactNode;
+    secondaryAction?: (item: T, hover: boolean) => ReactElement | null;
+    isDisabled?: (item: T) => boolean;
+    addSelectAllCheckbox?: boolean;
+    selectAllCheckBoxLabel?: string;
+    sx?: CheckBoxListItemSxProps<T>;
+    isDndActive?: boolean;
+    isDragDisable?: boolean;
+    divider?: boolean;
+    onItemClick?: (item: T) => void;
+    isItemClickable?: (item: T) => boolean;
+}
+export interface CheckboxListProps<T> extends CheckBoxListItemsProps<T> {
+    onDragStart?: (dragStart: DragStart) => void;
+    onDragEnd?: (dropResult: DropResult) => void;
+}
+export interface CheckBoxListItemContentProps {
+    sx?: CheckBoxListItemSx;
+    label: ReactNode;
+    secondary?: ReactNode;
+    onClick: () => void;
+    disabled?: boolean;
+    checked: boolean;
+    indeterminate?: boolean;
+}
+export interface DraggableCheckBoxListItemContentProps extends CheckBoxListItemContentProps {
+    provided: DraggableProvided;
+    isHighlighted: boolean;
+}
+export {};

package/dist/components/ui/csvDownloader/csv-export.type.d.ts

@@ -0,0 +1,15 @@
+import { ColDef, CsvExportParams } from 'ag-grid-community';
+import { GsLangUser } from '../../../utils';
+export type CsvDownloadProps = {
+    columns: ColDef[];
+    tableName: string;
+    tableNamePrefix?: string;
+    skipColumnHeaders?: boolean;
+    skipPinnedBottom?: boolean;
+    language: GsLangUser;
+    getData: (params?: CsvExportParams) => string | undefined | void;
+    isCopyCsv?: boolean;
+};
+export type CsvExportProps = CsvDownloadProps & {
+    disabled: boolean;
+};

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

@@ -0,0 +1,61 @@
+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 "react/jsx-runtime";
+import "@mui/icons-material";
+import "../../../utils/yupConfig.js";
+import { fetchStudyMetadata } from "../../../services/appsMetadata.js";
+const NA_VALUE = "N/A";
+const fetchCsvSeparator = async () => {
+  return fetchStudyMetadata().then((metadata) => metadata.copyCsvSeparator);
+};
+const useCsvExport = () => {
+  const intl = useIntl();
+  const getData = useCallback(
+    async (props) => {
+      const formatNAValue = (value) => {
+        return value === NA_VALUE ? intl.formatMessage({ id: "export/undefined" }) : value;
+      };
+      const hasColId = (colId) => {
+        return colId !== void 0;
+      };
+      const processCell = (params) => {
+        if (params.column.getColId() === "limitName") {
+          return formatNAValue(params.value);
+        }
+        if (typeof params.value === "number") {
+          const fractionDigits = params.column.getColDef()?.cellRendererParams?.fractionDigits ?? params.column.getColDef()?.context?.fractionDigits;
+          const roundedValue = fractionDigits != null && !Number.isNaN(params.value) ? params.value.toFixed(fractionDigits) : params.value;
+          if (props.language === LANG_FRENCH) {
+            return roundedValue.toString().replace(".", ",");
+          }
+        }
+        return params.value;
+      };
+      const getCSVFilename = (tableName) => {
+        return tableName.trim().replace(/[\\/:"*?<>|\s]/g, "-").substring(0, 27);
+      };
+      const prefix = props.tableNamePrefix ?? "";
+      const defaultSeparator = props.language === LANG_FRENCH ? ";" : ",";
+      const columnSeparatorValue = props.isCopyCsv ? await fetchCsvSeparator() ?? defaultSeparator : defaultSeparator;
+      return props.getData({
+        suppressQuotes: false,
+        skipPinnedBottom: props.skipPinnedBottom,
+        columnSeparator: columnSeparatorValue,
+        columnKeys: props.columns.map((col) => col.colId).filter(hasColId),
+        skipColumnHeaders: props.skipColumnHeaders,
+        processHeaderCallback: (params) => params.column.getColDef().headerComponentParams?.displayName ?? params.column.getColDef().headerName ?? params.column.getColId(),
+        fileName: prefix.concat(getCSVFilename(props.tableName)),
+        processCellCallback: processCell
+      });
+    },
+    [intl]
+  );
+  return { getData };
+};
+export {
+  fetchCsvSeparator,
+  useCsvExport
+};

package/dist/components/ui/dialogs/customMuiDialog/CustomMuiDialog.d.ts

@@ -0,0 +1,51 @@
+import { MouseEvent, ReactNode } from 'react';
+import { FieldErrors, FieldValues, SubmitHandler } from 'react-hook-form';
+import { DialogProps } from '@mui/material';
+import { MergedFormContextProps } from '../../../ui/reactHookForm/provider/CustomFormProvider';
+export type CustomMuiDialogProps<T extends FieldValues = FieldValues> = DialogProps & {
+    open: boolean;
+    formContext: MergedFormContextProps<T>;
+    onClose: (event?: MouseEvent) => void;
+    onSave: SubmitHandler<T>;
+    onValidationError?: (errors: FieldErrors) => void;
+    titleId: string;
+    disabledSave?: boolean;
+    onCancel?: () => void;
+    children: ReactNode;
+    isDataFetching?: boolean;
+    confirmationMessageKey?: string;
+    unscrollableFullHeight?: boolean;
+};
+/**
+ * all those styles are made to work with each other in order to control the scroll behavior:
+ * <fullHeightDialog>
+ *   <unscrollableContainer>
+ *     <unscrollableHeader/> => there may be several unscrollableHeader one after another
+ *     <scrollableContent/>
+ *   </unscrollableContainer>
+ * </fullHeightDialog>
+ */
+export declare const unscrollableDialogStyles: {
+    readonly fullHeightDialog: {
+        readonly '.MuiDialog-paper': {
+            readonly minWidth: "90vw";
+            readonly margin: "auto";
+            readonly height: "95vh";
+        };
+    };
+    readonly unscrollableContainer: {
+        readonly display: "flex";
+        readonly flexDirection: "column";
+        readonly overflowY: "hidden";
+    };
+    readonly unscrollableHeader: {
+        readonly flex: "none";
+        readonly padding: 1;
+    };
+    readonly scrollableContent: {
+        readonly flex: "auto";
+        readonly overflowY: "auto";
+        readonly padding: 1;
+    };
+};
+export declare function CustomMuiDialog<T extends FieldValues = FieldValues>({ open, formContext, onClose, onSave, isDataFetching, onValidationError, titleId, disabledSave, onCancel, children, confirmationMessageKey, unscrollableFullHeight, ...dialogProps }: Readonly<CustomMuiDialogProps<T>>): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/dialogs/customMuiDialog/CustomMuiDialog.js

@@ -0,0 +1,143 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { FormattedMessage } from "react-intl";
+import { Dialog, LinearProgress, DialogTitle, DialogContent, DialogActions } from "@mui/material";
+import { SubmitButton } from "../../reactHookForm/utils/SubmitButton.js";
+import { CancelButton } from "../../reactHookForm/utils/CancelButton.js";
+import { CustomFormProvider } from "../../reactHookForm/provider/CustomFormProvider.js";
+import { PopupConfirmationDialog } from "../popupConfirmationDialog/PopupConfirmationDialog.js";
+const styles = {
+  dialogPaper: {
+    ".MuiDialog-paper": {
+      width: "auto",
+      minWidth: "60vw",
+      margin: "auto"
+    }
+  }
+};
+const unscrollableDialogStyles = {
+  fullHeightDialog: {
+    ".MuiDialog-paper": {
+      minWidth: "90vw",
+      margin: "auto",
+      height: "95vh"
+    }
+  },
+  unscrollableContainer: {
+    display: "flex",
+    flexDirection: "column",
+    overflowY: "hidden"
+  },
+  unscrollableHeader: {
+    flex: "none",
+    padding: 1
+  },
+  scrollableContent: {
+    flex: "auto",
+    overflowY: "auto",
+    padding: 1
+  }
+};
+function CustomMuiDialog({
+  open,
+  formContext,
+  onClose,
+  onSave,
+  isDataFetching = false,
+  onValidationError,
+  titleId,
+  disabledSave,
+  onCancel,
+  children,
+  confirmationMessageKey,
+  unscrollableFullHeight = false,
+  ...dialogProps
+}) {
+  const [openConfirmationPopup, setOpenConfirmationPopup] = useState(false);
+  const [validatedData, setValidatedData] = useState();
+  const handleCancel = useCallback(
+    (event) => {
+      onCancel?.();
+      onClose(event);
+    },
+    [onCancel, onClose]
+  );
+  const handleClose = (event, reason) => {
+    if (reason === "backdropClick") {
+      return;
+    }
+    onClose(event);
+  };
+  const validate = useCallback(
+    (data) => {
+      onSave(data);
+      onClose();
+    },
+    [onClose, onSave]
+  );
+  const handleValidate = useCallback(
+    (data) => {
+      if (confirmationMessageKey) {
+        setValidatedData(data);
+        setOpenConfirmationPopup(true);
+      } else {
+        validate(data);
+      }
+    },
+    [confirmationMessageKey, validate]
+  );
+  const handlePopupConfirmation = useCallback(() => {
+    setOpenConfirmationPopup(false);
+    if (validatedData) {
+      validate(validatedData);
+    }
+  }, [validate, validatedData]);
+  const handleValidationError = useCallback(
+    (errors) => {
+      onValidationError?.(errors);
+    },
+    [onValidationError]
+  );
+  return /* @__PURE__ */ jsxs(CustomFormProvider, { ...formContext, children: [
+    /* @__PURE__ */ jsxs(
+      Dialog,
+      {
+        sx: unscrollableFullHeight ? unscrollableDialogStyles.fullHeightDialog : styles.dialogPaper,
+        open,
+        onClose: handleClose,
+        fullWidth: true,
+        ...dialogProps,
+        children: [
+          isDataFetching && /* @__PURE__ */ jsx(LinearProgress, {}),
+          /* @__PURE__ */ jsx(DialogTitle, { "data-testid": "DialogTitle", children: /* @__PURE__ */ jsx(FormattedMessage, { id: titleId }) }),
+          /* @__PURE__ */ jsx(DialogContent, { sx: unscrollableFullHeight ? unscrollableDialogStyles.unscrollableContainer : null, children }),
+          /* @__PURE__ */ jsxs(DialogActions, { children: [
+            /* @__PURE__ */ jsx(CancelButton, { onClick: handleCancel, "data-testid": "CancelButton" }),
+            /* @__PURE__ */ jsx(
+              SubmitButton,
+              {
+                variant: "outlined",
+                disabled: disabledSave,
+                onClick: formContext?.handleSubmit(handleValidate, handleValidationError),
+                "data-testid": "ValidateButton"
+              }
+            )
+          ] })
+        ]
+      }
+    ),
+    confirmationMessageKey && /* @__PURE__ */ jsx(
+      PopupConfirmationDialog,
+      {
+        message: confirmationMessageKey,
+        openConfirmationPopup,
+        setOpenConfirmationPopup,
+        handlePopupConfirmation
+      }
+    )
+  ] });
+}
+export {
+  CustomMuiDialog,
+  unscrollableDialogStyles
+};

package/dist/components/ui/dialogs/descriptionModificationDialog/DescriptionModificationDialog.js

@@ -0,0 +1,74 @@
+import { jsx } from "react/jsx-runtime";
+import { useCallback } from "react";
+import { useForm } from "react-hook-form";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { Box } from "@mui/material";
+import "../../../../utils/yupConfig.js";
+import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
+import { useSnackMessage } from "../../../../hooks/useSnackMessage.js";
+import { CustomMuiDialog } from "../customMuiDialog/CustomMuiDialog.js";
+import { ExpandingTextField } from "../../reactHookForm/text/ExpandingTextField.js";
+import { MAX_CHAR_DESCRIPTION } from "../../../../utils/constants/uiConstants.js";
+import { snackWithFallback } from "../../../../utils/error.js";
+import * as yup from "yup";
+const schema = yup.object().shape({
+  [FieldConstants.DESCRIPTION]: yup.string().max(MAX_CHAR_DESCRIPTION, "descriptionLimitError")
+});
+function DescriptionModificationDialog({
+  description,
+  open,
+  onClose,
+  updateElement,
+  updateForm
+}) {
+  const { snackError } = useSnackMessage();
+  const emptyFormData = {
+    [FieldConstants.DESCRIPTION]: description ?? ""
+  };
+  const methods = useForm({
+    defaultValues: emptyFormData,
+    resolver: yupResolver(schema)
+  });
+  const { reset } = methods;
+  const onCancel = () => {
+    reset({
+      [FieldConstants.DESCRIPTION]: ""
+    });
+    onClose();
+  };
+  const onSubmit = useCallback(
+    (data) => {
+      updateElement?.({
+        [FieldConstants.DESCRIPTION]: data[FieldConstants.DESCRIPTION]?.trim() ?? ""
+      }).catch((error) => {
+        snackWithFallback(snackError, error, { headerId: "descriptionModificationError" });
+      });
+      updateForm?.({
+        [FieldConstants.DESCRIPTION]: data[FieldConstants.DESCRIPTION]?.trim() ?? ""
+      });
+    },
+    [updateElement, updateForm, snackError]
+  );
+  return /* @__PURE__ */ jsx(
+    CustomMuiDialog,
+    {
+      open,
+      onClose: onCancel,
+      onSave: onSubmit,
+      formContext: { ...methods, validationSchema: schema, removeOptional: true },
+      titleId: "description",
+      children: /* @__PURE__ */ jsx(Box, { paddingTop: 1, children: /* @__PURE__ */ jsx(
+        ExpandingTextField,
+        {
+          name: FieldConstants.DESCRIPTION,
+          label: "descriptionProperty",
+          minRows: 3,
+          rows: 3
+        }
+      ) })
+    }
+  );
+}
+export {
+  DescriptionModificationDialog
+};