@gridsuite/commons-ui 0.46.0 → 0.48.0

package/dist/components/react-hook-form/directory-items-input.js

@@ -0,0 +1,185 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { FormControl, Chip, Grid, Tooltip, IconButton } from "@mui/material";
+import { OverflowableText } from "../OverflowableText/overflowable-text.js";
+import { useSnackMessage } from "../../hooks/useSnackMessage.js";
+import FieldLabel from "./utils/field-label.js";
+import FolderIcon from "@mui/icons-material/Folder";
+import { useMemo, useState, useCallback } from "react";
+import { useFieldArray, useFormContext, useController } from "react-hook-form";
+import { useIntl } from "react-intl";
+import ErrorInput from "./error-management/error-input.js";
+import MidFormError from "./error-management/mid-form-error.js";
+import { RawReadOnlyInput } from "./raw-read-only-input.js";
+import { mergeSx } from "../../utils/styles.js";
+import DirectoryItemSelector from "../DirectoryItemSelector/directory-item-selector.js";
+import { isFieldFromContextRequired } from "./utils/functions.js";
+const NAME = "name";
+const styles = {
+  formDirectoryElements1: {
+    display: "flex",
+    gap: "8px",
+    flexWrap: "wrap",
+    flexDirection: "row",
+    border: "2px solid lightgray",
+    padding: "4px",
+    borderRadius: "4px",
+    overflow: "hidden"
+  },
+  formDirectoryElementsError: (theme) => ({
+    borderColor: theme.palette.error.main
+  }),
+  formDirectoryElements2: {
+    display: "flex",
+    gap: "8px",
+    flexWrap: "wrap",
+    flexDirection: "row",
+    marginTop: 0,
+    padding: "4px",
+    overflow: "hidden"
+  },
+  addDirectoryElements: {
+    marginTop: "-5px"
+  }
+};
+const DirectoryItemsInput = ({
+  label,
+  name,
+  elementType,
+  // Used to specify type of element (Filter, Contingency list, ...)
+  equipmentTypes,
+  // Mostly used for filters, it allows the user to get elements of specific equipment only
+  itemFilter,
+  // Used to further filter the results displayed according to specific requirement
+  titleId,
+  // title of directory item selector dialogue
+  hideErrorMessage,
+  onRowChanged,
+  onChange,
+  disable = false,
+  fetchDirectoryContent,
+  fetchRootFolders,
+  fetchElementsInfos,
+  labelRequiredFromContext = true
+}) => {
+  const { snackError } = useSnackMessage();
+  const intl = useIntl();
+  const types = useMemo(() => [elementType], [elementType]);
+  const [directoryItemSelectorOpen, setDirectoryItemSelectorOpen] = useState(false);
+  const {
+    fields: elements,
+    append,
+    remove
+  } = useFieldArray({
+    name
+  });
+  const formContext = useFormContext();
+  const { getValues } = formContext;
+  const {
+    fieldState: { error }
+  } = useController({
+    name
+  });
+  const addElements = useCallback(
+    (values) => {
+      values.forEach((value) => {
+        const { icon, children, ...otherElementAttributes } = value;
+        if (getValues(name).find(
+          (v) => (v == null ? void 0 : v.id) === otherElementAttributes.id
+        ) !== void 0) {
+          snackError({
+            messageTxt: "",
+            headerId: "ElementAlreadyUsed"
+          });
+        } else {
+          append(otherElementAttributes);
+          onRowChanged && onRowChanged(true);
+          onChange && onChange(getValues(name));
+        }
+      });
+      setDirectoryItemSelectorOpen(false);
+    },
+    [append, getValues, snackError, name, onRowChanged, onChange]
+  );
+  const removeElements = useCallback(
+    (index) => {
+      remove(index);
+      onRowChanged && onRowChanged(true);
+      onChange && onChange(getValues(name));
+    },
+    [onRowChanged, remove, getValues, name, onChange]
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      FormControl,
+      {
+        sx: mergeSx(
+          styles.formDirectoryElements1,
+          (error == null ? void 0 : error.message) && styles.formDirectoryElementsError
+        ),
+        error: !!(error == null ? void 0 : error.message),
+        children: [
+          (elements == null ? void 0 : elements.length) === 0 && label && /* @__PURE__ */ jsx(
+            FieldLabel,
+            {
+              label,
+              optional: labelRequiredFromContext && !isFieldFromContextRequired(
+                name,
+                formContext,
+                getValues()
+              )
+            }
+          ),
+          (elements == null ? void 0 : elements.length) > 0 && /* @__PURE__ */ jsx(FormControl, { sx: styles.formDirectoryElements2, children: elements.map((item, index) => /* @__PURE__ */ jsx(
+            Chip,
+            {
+              size: "small",
+              onDelete: () => removeElements(index),
+              label: /* @__PURE__ */ jsx(
+                OverflowableText,
+                {
+                  text: /* @__PURE__ */ jsx(
+                    RawReadOnlyInput,
+                    {
+                      name: `${name}.${index}.${NAME}`
+                    }
+                  ),
+                  sx: { width: "100%" }
+                }
+              )
+            },
+            item.id
+          )) }),
+          /* @__PURE__ */ jsx(Grid, { item: true, xs: true, children: /* @__PURE__ */ jsx(Grid, { container: true, direction: "row-reverse", children: /* @__PURE__ */ jsx(Tooltip, { title: intl.formatMessage({ id: titleId }), children: /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              sx: styles.addDirectoryElements,
+              size: "small",
+              disabled: disable,
+              onClick: () => setDirectoryItemSelectorOpen(true),
+              children: /* @__PURE__ */ jsx(FolderIcon, {})
+            }
+          ) }) }) })
+        ]
+      }
+    ),
+    !hideErrorMessage && /* @__PURE__ */ jsx(ErrorInput, { name, InputField: MidFormError }),
+    /* @__PURE__ */ jsx(
+      DirectoryItemSelector,
+      {
+        open: directoryItemSelectorOpen,
+        onClose: addElements,
+        types,
+        equipmentTypes,
+        title: intl.formatMessage({ id: titleId }),
+        itemFilter,
+        fetchDirectoryContent,
+        fetchRootFolders,
+        fetchElementsInfos
+      }
+    )
+  ] });
+};
+export {
+  NAME,
+  DirectoryItemsInput as default
+};

package/dist/components/react-hook-form/error-management/error-input.d.ts

@@ -0,0 +1,5 @@
+export default ErrorInput;
+declare function ErrorInput({ name, InputField }: {
+    name: any;
+    InputField: any;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/react-hook-form/error-management/error-input.js

@@ -0,0 +1,42 @@
+import { jsx, Fragment } from "react/jsx-runtime";
+import { useRef, useEffect } from "react";
+import { FormattedMessage } from "react-intl";
+import { useController } from "react-hook-form";
+const ErrorInput = ({ name, InputField }) => {
+  const {
+    fieldState: { error },
+    formState: { isSubmitting }
+  } = useController({
+    name
+  });
+  const errorRef = useRef(null);
+  const errorProps = (errorMsg) => {
+    if (typeof errorMsg === "string") {
+      return {
+        id: errorMsg
+      };
+    } else if (typeof errorMsg === "object") {
+      return {
+        id: errorMsg.id,
+        values: {
+          value: errorMsg.value
+        }
+      };
+    }
+    return {};
+  };
+  useEffect(() => {
+    if (error && errorRef.current) {
+      errorRef.current.scrollIntoView({ behavior: "smooth" });
+    }
+  }, [isSubmitting]);
+  return /* @__PURE__ */ jsx(Fragment, { children: (error == null ? void 0 : error.message) && /* @__PURE__ */ jsx("div", { ref: errorRef, children: /* @__PURE__ */ jsx(
+    InputField,
+    {
+      message: /* @__PURE__ */ jsx(FormattedMessage, { ...errorProps(error == null ? void 0 : error.message) })
+    }
+  ) }) });
+};
+export {
+  ErrorInput as default
+};

package/dist/components/react-hook-form/error-management/field-error-alert.d.ts

@@ -0,0 +1,4 @@
+export default FieldErrorAlert;
+declare function FieldErrorAlert({ message }: {
+    message: any;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/react-hook-form/error-management/field-error-alert.js

@@ -0,0 +1,9 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { Grid, Alert } from "@mui/material";
+const FieldErrorAlert = ({ message }) => {
+  return /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(Alert, { severity: "error", children: message }) });
+};
+export {
+  FieldErrorAlert as default
+};

package/dist/components/react-hook-form/error-management/mid-form-error.d.ts

@@ -0,0 +1,4 @@
+export default MidFormError;
+declare function MidFormError({ message }: {
+    message: any;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/react-hook-form/error-management/mid-form-error.js

@@ -0,0 +1,20 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { Box } from "@mui/material";
+const MidFormError = ({ message }) => {
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      sx: (theme) => ({
+        color: theme.palette.error.main,
+        fontSize: "small",
+        marginLeft: theme.spacing(2),
+        marginRight: theme.spacing(2)
+      }),
+      children: message
+    }
+  );
+};
+export {
+  MidFormError as default
+};

package/dist/components/react-hook-form/numbers/float-input.d.ts

@@ -0,0 +1,18 @@
+export default FloatInput;
+declare function FloatInput(props: any): import("react/jsx-runtime").JSX.Element;
+declare namespace FloatInput {
+    const propTypes: {
+        name: import("prop-types").Requireable<string>;
+        label: import("prop-types").Requireable<string>;
+        labelValues: import("prop-types").Requireable<object>;
+        id: import("prop-types").Requireable<string>;
+        adornment: import("prop-types").Requireable<object>;
+        customAdornment: import("prop-types").Requireable<object>;
+        outputTransform: import("prop-types").Requireable<(...args: any[]) => any>;
+        inputTransform: import("prop-types").Requireable<(...args: any[]) => any>;
+        acceptValue: import("prop-types").Requireable<(...args: any[]) => any>;
+        previousValue: import("prop-types").Requireable<any>;
+        clearable: import("prop-types").Requireable<boolean>;
+        formProps: import("prop-types").Requireable<object>;
+    };
+}

package/dist/components/react-hook-form/numbers/float-input.js

@@ -0,0 +1,51 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import TextInput from "../text-input.js";
+import { isFloatNumber } from "./utils.js";
+const normalizeFixed = (number) => {
+  return number.toLocaleString("en-US", {
+    maximumFractionDigits: 20,
+    useGrouping: false
+  });
+};
+const FloatInput = (props) => {
+  const inputTransform = (value) => {
+    if (typeof value == "number" && !isNaN(value)) {
+      return normalizeFixed(value);
+    } else {
+      if (["-", "."].includes(value)) {
+        return value;
+      }
+      return value === null || isNaN(value) ? "" : value;
+    }
+  };
+  const outputTransform = (value) => {
+    if (value === "-") {
+      return value;
+    }
+    if (value === "") {
+      return null;
+    }
+    const tmp = (value == null ? void 0 : value.replace(",", ".")) || "";
+    if (tmp.endsWith(".") || tmp.includes(".") && tmp.endsWith("0")) {
+      return tmp;
+    }
+    const parsed = parseFloat(tmp);
+    return isNaN(parsed) ? null : normalizeFixed(parsed);
+  };
+  return /* @__PURE__ */ jsx(
+    TextInput,
+    {
+      acceptValue: isFloatNumber,
+      outputTransform,
+      inputTransform,
+      ...props
+    }
+  );
+};
+FloatInput.propTypes = {
+  ...TextInput.propTypes
+};
+export {
+  FloatInput as default
+};

package/dist/components/react-hook-form/numbers/integer-input.d.ts

@@ -0,0 +1,18 @@
+export default IntegerInput;
+declare function IntegerInput(props: any): import("react/jsx-runtime").JSX.Element;
+declare namespace IntegerInput {
+    const propTypes: {
+        name: import("prop-types").Requireable<string>;
+        label: import("prop-types").Requireable<string>;
+        labelValues: import("prop-types").Requireable<object>;
+        id: import("prop-types").Requireable<string>;
+        adornment: import("prop-types").Requireable<object>;
+        customAdornment: import("prop-types").Requireable<object>;
+        outputTransform: import("prop-types").Requireable<(...args: any[]) => any>;
+        inputTransform: import("prop-types").Requireable<(...args: any[]) => any>;
+        acceptValue: import("prop-types").Requireable<(...args: any[]) => any>;
+        previousValue: import("prop-types").Requireable<any>;
+        clearable: import("prop-types").Requireable<boolean>;
+        formProps: import("prop-types").Requireable<object>;
+    };
+}

package/dist/components/react-hook-form/numbers/integer-input.js

@@ -0,0 +1,36 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import TextInput from "../text-input.js";
+import { isIntegerNumber } from "./utils.js";
+const IntegerInput = (props) => {
+  const inputTransform = (value) => {
+    if ("-" === value) {
+      return value;
+    }
+    return value === null || isNaN(value) ? "" : value.toString();
+  };
+  const outputTransform = (value) => {
+    if (value === "-") {
+      return value;
+    }
+    if (value === "0") {
+      return 0;
+    }
+    return parseInt(value) || null;
+  };
+  return /* @__PURE__ */ jsx(
+    TextInput,
+    {
+      acceptValue: isIntegerNumber,
+      outputTransform,
+      inputTransform,
+      ...props
+    }
+  );
+};
+IntegerInput.propTypes = {
+  ...TextInput.propTypes
+};
+export {
+  IntegerInput as default
+};

package/dist/components/react-hook-form/numbers/utils.d.ts

@@ -0,0 +1,2 @@
+export function isIntegerNumber(val: any): boolean;
+export function isFloatNumber(val: any): boolean;

package/dist/components/react-hook-form/numbers/utils.js

@@ -0,0 +1,10 @@
+const isIntegerNumber = (val) => {
+  return /^-?[0-9]*$/.test(val);
+};
+const isFloatNumber = (val) => {
+  return /^-?[0-9]*[.,]?[0-9]*$/.test(val);
+};
+export {
+  isFloatNumber,
+  isIntegerNumber
+};

package/dist/components/react-hook-form/radio-input.d.ts

@@ -0,0 +1,18 @@
+export default RadioInput;
+declare function RadioInput({ name, label, id, options, formProps }: {
+    name: any;
+    label: any;
+    id: any;
+    options: any;
+    formProps: any;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace RadioInput {
+    namespace propTypes {
+        const name: PropTypes.Validator<string>;
+        const label: PropTypes.Requireable<string>;
+        const id: PropTypes.Requireable<string>;
+        const options: PropTypes.Validator<any[]>;
+        const formProps: PropTypes.Requireable<object>;
+    }
+}
+import PropTypes from 'prop-types';

package/dist/components/react-hook-form/radio-input.js

@@ -0,0 +1,44 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import "react";
+import PropTypes from "prop-types";
+import { FormControl, FormLabel, RadioGroup, FormControlLabel, Radio } from "@mui/material";
+import { FormattedMessage } from "react-intl";
+import { useController } from "react-hook-form";
+import FieldLabel from "./utils/field-label.js";
+const RadioInput = ({ name, label, id, options, formProps }) => {
+  const {
+    field: { onChange, value }
+  } = useController({ name });
+  return /* @__PURE__ */ jsxs(FormControl, { children: [
+    label && /* @__PURE__ */ jsx(FormLabel, { id: id ?? label, children: /* @__PURE__ */ jsx(FormattedMessage, { id: label }) }),
+    /* @__PURE__ */ jsx(
+      RadioGroup,
+      {
+        row: true,
+        "aria-labelledby": id ?? label,
+        value,
+        onChange,
+        ...formProps,
+        children: options.map((option) => /* @__PURE__ */ jsx(
+          FormControlLabel,
+          {
+            control: /* @__PURE__ */ jsx(Radio, {}),
+            value: option.id,
+            label: /* @__PURE__ */ jsx(FieldLabel, { label: option.label })
+          },
+          option.id
+        ))
+      }
+    )
+  ] });
+};
+RadioInput.propTypes = {
+  name: PropTypes.string.isRequired,
+  label: PropTypes.string,
+  id: PropTypes.string,
+  options: PropTypes.array.isRequired,
+  formProps: PropTypes.object
+};
+export {
+  RadioInput as default
+};

package/{es/components/MultipleSelectionDialog/index.js → dist/components/react-hook-form/raw-read-only-input.d.ts}

@@ -4,5 +4,6 @@
  * 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 { default } from './MultipleSelectionDialog';
+export declare function RawReadOnlyInput({ name }: {
+    name: string;
+}): any;

package/dist/components/react-hook-form/raw-read-only-input.js

@@ -0,0 +1,10 @@
+import { useController } from "react-hook-form";
+function RawReadOnlyInput({ name }) {
+  const {
+    field: { value }
+  } = useController({ name });
+  return value;
+}
+export {
+  RawReadOnlyInput
+};

package/dist/components/react-hook-form/select-input.d.ts

@@ -0,0 +1,17 @@
+export default SelectInput;
+declare function SelectInput(props: any): import("react/jsx-runtime").JSX.Element;
+declare namespace SelectInput {
+    const propTypes: {
+        name: PropTypes.Validator<string>;
+        label: PropTypes.Requireable<string>;
+        options: PropTypes.Validator<any[]>;
+        outputTransform: PropTypes.Requireable<(...args: any[]) => any>;
+        inputTransform: PropTypes.Requireable<(...args: any[]) => any>;
+        readOnly: PropTypes.Requireable<boolean>;
+        previousValue: PropTypes.Requireable<any>;
+        allowNewValue: PropTypes.Requireable<boolean>;
+        onChangeCallback: PropTypes.Requireable<(...args: any[]) => any>;
+        formProps: PropTypes.Requireable<object>;
+    };
+}
+import PropTypes from 'prop-types';

package/dist/components/react-hook-form/select-input.js

@@ -0,0 +1,31 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import PropTypes from "prop-types";
+import AutocompleteInput from "./autocomplete-input.js";
+import { useIntl } from "react-intl";
+const SelectInput = (props) => {
+  const intl = useIntl();
+  const inputTransform = (value) => props.options.find((option) => (option == null ? void 0 : option.id) === value) || null;
+  const outputTransform = (value) => {
+    return (value == null ? void 0 : value.id) ?? null;
+  };
+  return /* @__PURE__ */ jsx(
+    AutocompleteInput,
+    {
+      getOptionLabel: (option) => {
+        return (option == null ? void 0 : option.label) ? intl.formatMessage({ id: option == null ? void 0 : option.label }) : option == null ? void 0 : option.id;
+      },
+      inputTransform,
+      outputTransform,
+      readOnly: true,
+      ...props
+    }
+  );
+};
+SelectInput.propTypes = {
+  options: PropTypes.array.isRequired,
+  ...AutocompleteInput.propTypes
+};
+export {
+  SelectInput as default
+};

package/dist/components/react-hook-form/slider-input.d.ts

@@ -0,0 +1,21 @@
+export default SliderInput;
+declare function SliderInput({ name, min, max, step, size, onValueChange, }: {
+    name: any;
+    min: any;
+    max: any;
+    step: any;
+    size?: string | undefined;
+    onValueChange?: typeof identity | undefined;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace SliderInput {
+    namespace propTypes {
+        const name: PropTypes.Validator<string>;
+        const min: PropTypes.Validator<number>;
+        const max: PropTypes.Validator<number>;
+        const step: PropTypes.Validator<number>;
+        const size: PropTypes.Requireable<string>;
+        const onValueChange: PropTypes.Requireable<(...args: any[]) => any>;
+    }
+}
+import { identity } from './utils/functions';
+import PropTypes from 'prop-types';

package/dist/components/react-hook-form/slider-input.js

@@ -0,0 +1,43 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import PropTypes from "prop-types";
+import { Slider } from "@mui/material";
+import { useController } from "react-hook-form";
+import { identity } from "./utils/functions.js";
+const SliderInput = ({
+  name,
+  min,
+  max,
+  step,
+  size = "small",
+  onValueChange = identity
+}) => {
+  const {
+    field: { onChange, value }
+  } = useController({ name });
+  const handleValueChange = (e) => {
+    onChange(onValueChange(e.target.value));
+  };
+  return /* @__PURE__ */ jsx(
+    Slider,
+    {
+      size,
+      min,
+      max,
+      step,
+      value,
+      onChange: handleValueChange
+    }
+  );
+};
+SliderInput.propTypes = {
+  name: PropTypes.string.isRequired,
+  min: PropTypes.number.isRequired,
+  max: PropTypes.number.isRequired,
+  step: PropTypes.number.isRequired,
+  size: PropTypes.string,
+  onValueChange: PropTypes.func
+};
+export {
+  SliderInput as default
+};

package/dist/components/react-hook-form/text-input.d.ts

@@ -0,0 +1,33 @@
+export default TextInput;
+declare function TextInput({ name, label, labelValues, id, adornment, customAdornment, outputTransform, inputTransform, acceptValue, previousValue, clearable, formProps, }: {
+    name: any;
+    label: any;
+    labelValues: any;
+    id: any;
+    adornment: any;
+    customAdornment: any;
+    outputTransform?: typeof identity | undefined;
+    inputTransform?: typeof identity | undefined;
+    acceptValue?: (() => boolean) | undefined;
+    previousValue: any;
+    clearable: any;
+    formProps: any;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace TextInput {
+    namespace propTypes {
+        const name: PropTypes.Requireable<string>;
+        const label: PropTypes.Requireable<string>;
+        const labelValues: PropTypes.Requireable<object>;
+        const id: PropTypes.Requireable<string>;
+        const adornment: PropTypes.Requireable<object>;
+        const customAdornment: PropTypes.Requireable<object>;
+        const outputTransform: PropTypes.Requireable<(...args: any[]) => any>;
+        const inputTransform: PropTypes.Requireable<(...args: any[]) => any>;
+        const acceptValue: PropTypes.Requireable<(...args: any[]) => any>;
+        const previousValue: PropTypes.Requireable<any>;
+        const clearable: PropTypes.Requireable<boolean>;
+        const formProps: PropTypes.Requireable<object>;
+    }
+}
+import { identity } from './utils/functions';
+import PropTypes from 'prop-types';