@m4l/components 0.1.8 → 0.1.10

package/components/hook-form/RHFPeriod/index.js

@@ -0,0 +1,227 @@
+import { useModuleDictionary, useModuleSkeleton, useEnvironment } from "@m4l/core";
+import { styled, Skeleton, Autocomplete, TextField } from "@mui/material";
+import { useMemo } from "react";
+import { useFormContext, Controller } from "react-hook-form";
+import { I as Icon } from "../../Icon/index.js";
+import { ErrorLabel } from "../../../index.js";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { g as getCommonActionsDictionary } from "../../CommonActions/components/Actions/index.js";
+import "@mui/material/Button";
+import "../../mui_extended/Button/index.js";
+import "react-router-dom";
+import "../../../contexts/ModalContext/index.js";
+import "@mui/lab";
+const Wrapper = styled("div")(({
+  theme
+}) => ({
+  width: "100%",
+  display: "flex",
+  flexDirection: "column",
+  justifyContent: "center",
+  alignItems: "flex-start",
+  gap: theme.spacing(1)
+}));
+const ContainerPeriod = styled("div")(({
+  theme,
+  error
+}) => ({
+  display: "flex",
+  width: "100%",
+  height: "auto",
+  alignItems: "center",
+  gap: theme.spacing(1),
+  border: error ? `1px solid ${theme.palette.error.main}` : `1px solid ${theme.palette.divider}`,
+  padding: theme.spacing(0.5, 1),
+  borderRadius: "4px",
+  "& .MuiAutocomplete-root, & .MuiTextField-root": {
+    width: "100%"
+  },
+  "& .MuiAutocomplete-root .MuiTextField-root": {
+    width: "100%"
+  },
+  "& .MuiTextField-root .MuiInput-input": {
+    padding: "5px!important"
+  }
+}));
+const SKTWrapper = styled("div")(({
+  theme
+}) => ({
+  display: "flex",
+  width: "auto",
+  height: "37.5px",
+  alignItems: "center",
+  gap: theme.spacing(1),
+  border: `1px solid ${theme.palette.divider}`,
+  padding: theme.spacing(0.5, 1),
+  borderRadius: "4px"
+}));
+const Gap = styled("div")(({
+  theme
+}) => ({
+  width: "1px",
+  height: "20px",
+  backgroundColor: theme.palette.divider
+}));
+var ETimePeriods = /* @__PURE__ */ ((ETimePeriods2) => {
+  ETimePeriods2[ETimePeriods2["YEARS"] = 0] = "YEARS";
+  ETimePeriods2[ETimePeriods2["MONTHS"] = 1] = "MONTHS";
+  ETimePeriods2[ETimePeriods2["DAYS"] = 2] = "DAYS";
+  return ETimePeriods2;
+})(ETimePeriods || {});
+const getSelPeriodTime = (period) => {
+  if (!period)
+    return ETimePeriods.YEARS;
+  if (period.selPeriodTime)
+    return period.selPeriodTime;
+  if (period.years && period.years > 0)
+    return ETimePeriods.YEARS;
+  if (period.months && period.months > 0)
+    return ETimePeriods.MONTHS;
+  if (period.days && period.days > 0)
+    return ETimePeriods.DAYS;
+  return ETimePeriods.YEARS;
+};
+const getSingleValue = (period) => {
+  if (!period)
+    return "";
+  if (period.singleValue !== void 0)
+    return period.singleValue;
+  if (period.years && period.years > 0)
+    return period.years;
+  if (period.months && period.months > 0)
+    return period.months;
+  if (period.days && period.days > 0)
+    return period.days;
+  return "";
+};
+const RHFPeriod = (props) => {
+  const {
+    name,
+    variant = "monoperiod"
+  } = props;
+  const {
+    getLabel
+  } = useModuleDictionary();
+  const isSkeleton = useModuleSkeleton();
+  const {
+    control
+  } = useFormContext();
+  const {
+    host_static_assets,
+    environment_assets
+  } = useEnvironment();
+  const options = useMemo(() => [{
+    id: 0,
+    label: getLabel("period.years")
+  }, {
+    id: 1,
+    label: getLabel("period.months")
+  }, {
+    id: 2,
+    label: getLabel("period.days")
+  }], [getLabel]);
+  if (isSkeleton) {
+    return /* @__PURE__ */ jsxs(SKTWrapper, {
+      children: [/* @__PURE__ */ jsx(Skeleton, {
+        variant: "rounded",
+        width: "100%"
+      }), /* @__PURE__ */ jsx(Gap, {}), /* @__PURE__ */ jsx(Skeleton, {
+        variant: "rounded",
+        width: "100%"
+      }), /* @__PURE__ */ jsx(Skeleton, {
+        variant: "circular",
+        width: 20,
+        sx: {
+          minWidth: "20px",
+          minHeight: "20px"
+        }
+      })]
+    });
+  }
+  return /* @__PURE__ */ jsx(Controller, {
+    name,
+    control,
+    render: ({
+      field: {
+        onChange,
+        value
+      },
+      fieldState: {
+        error
+      }
+    }) => {
+      const selPeriodTime = getSelPeriodTime(value);
+      const singleValue = getSingleValue(value);
+      const onTotalChange = (newPeriodTime, newValue) => {
+        const newPeriod = {
+          selPeriodTime: newPeriodTime,
+          singleValue: newValue,
+          variant
+        };
+        if (newValue !== "" && newValue > 0) {
+          newPeriod.years = 0;
+          newPeriod.months = 0;
+          newPeriod.days = 0;
+          if (newPeriodTime === ETimePeriods.YEARS)
+            newPeriod.years = newValue;
+          if (newPeriodTime === ETimePeriods.MONTHS)
+            newPeriod.months = newValue;
+          if (newPeriodTime === ETimePeriods.DAYS)
+            newPeriod.days = newValue;
+        }
+        onChange(newPeriod);
+      };
+      const onChangeTime = (newPeriodTime) => {
+        if (newPeriodTime) {
+          onTotalChange(newPeriodTime.id, singleValue);
+        }
+      };
+      return /* @__PURE__ */ jsxs(Wrapper, {
+        children: [/* @__PURE__ */ jsxs(ContainerPeriod, {
+          error: !!error,
+          children: [/* @__PURE__ */ jsx(Autocomplete, {
+            options,
+            value: options[selPeriodTime],
+            disableClearable: true,
+            onChange: (_event, autcValue) => {
+              onChangeTime(autcValue);
+            },
+            renderInput: (params) => {
+              return /* @__PURE__ */ jsx(TextField, {
+                ...params,
+                fullWidth: true,
+                variant: "standard",
+                SelectProps: {
+                  native: true
+                },
+                InputProps: {
+                  disableUnderline: true,
+                  ...params.InputProps
+                },
+                autoComplete: "off"
+              }, `tx_async_${params.id}`);
+            }
+          }), /* @__PURE__ */ jsx(Gap, {}), /* @__PURE__ */ jsx(TextField, {
+            type: "number",
+            variant: "standard",
+            value: singleValue,
+            InputProps: {
+              disableUnderline: true
+            },
+            onChange: (e) => {
+              onTotalChange(selPeriodTime, e.target.value === "" ? "" : parseInt(e.target.value));
+            }
+          }), /* @__PURE__ */ jsx(Icon, {
+            src: `${host_static_assets}/${environment_assets}/frontend/components/period/assets/icons/clock.svg`
+          })]
+        }), error && /* @__PURE__ */ jsx(ErrorLabel, {
+          message: error.message || ""
+        })]
+      });
+    }
+  });
+};
+function getPeriodComponetsDictionary() {
+  return ["period"].concat(getCommonActionsDictionary());
+}
+export { RHFPeriod as R, getPeriodComponetsDictionary as g };

package/components/hook-form/RHFPeriod/styles.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { WrapperProps } from './types';
+export declare const Wrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ContainerPeriod: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & WrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const SKTWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Gap: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/hook-form/RHFPeriod/types.d.ts

@@ -0,0 +1,29 @@
+export declare type PeriodProps = {
+    name: string;
+    variant?: 'single';
+};
+export declare enum ETimePeriods {
+    YEARS = 0,
+    MONTHS = 1,
+    DAYS = 2
+}
+export declare type PeriodVariant = 'monoperiod' | 'multiperiod';
+export declare type PeriodTime = {
+    id: number;
+    label: string;
+};
+export declare type PeriodType = {
+    variant: PeriodVariant;
+    selPeriodTime: ETimePeriods;
+    singleValue: number | '';
+    years?: number;
+    months?: number;
+    days?: number;
+};
+export interface WrapperProps {
+    error: boolean;
+}
+export declare type RHFPeriodProps = {
+    name: string;
+    variant?: PeriodVariant;
+};

package/components/hook-form/RHFUpload/index.js

@@ -219,10 +219,9 @@ function RHFUploadImage({
   const handleDrop = useCallback((acceptedFiles) => {
     const file = acceptedFiles[0];
     if (file) {
-      setValue(name, {
-        ...file,
+      setValue(name, Object.assign(file, {
         preview: URL.createObjectURL(file)
-      });
+      }));
     }
   }, [setValue]);
   return /* @__PURE__ */ jsx(Controller, {

package/components/hook-form/index.d.ts

@@ -1,4 +1,5 @@
 export { FormProvider } from './FormProvider';
+export type { FormInitialValues, FormStatusLoad } from './FormProvider/types';
 export { RHFAutocomplete } from './RHFAutocomplete';
 export { RHFAutocompleteAsync } from './RHFAutocompleteAsync';
 export { RHFCheckbox } from './RHFCheckbox';
@@ -7,4 +8,7 @@ export { RHFMultiCheckbox } from './RHFMultiCheckbox';
 export { RHFSelect } from './RHFSelect';
 export { RHFTextField } from './RHFTextField';
 export { RHFRadioGroup } from './RHFRadioGroup';
+export { RHFPeriod } from './RHFPeriod';
+export type { PeriodType } from './RHFPeriod/types';
+export { getPeriodComponetsDictionary } from './RHFPeriod/dictionary';
 export * from './RHFUpload';

package/components/index.d.ts

@@ -3,14 +3,17 @@ export * from '../components/hook-form';
 export * from '../components/mui_extended';
 export * from '../components/CompanyLogo';
 export * from './formatters';
+export * from './formatters/types';
 export * from './formatters/dicctionary';
 export { DataGrid } from '../components/DataGrid';
-export type { Column, EditorProps } from 'react-data-grid';
+export * from '../components/DataGrid/formatters';
+export type { Column, EditorProps, FormatterProps } from 'react-data-grid';
 export type { RowKey } from '../components/DataGrid/types';
 export { getDataGridComponentsDictionary as getGridComponentsDictionary } from '../components/DataGrid/dictionary';
 export { TextEditor, NumberEditor } from '../components/DataGrid/components/editors/TextEditor';
 export * from '../components/DynamicFilter';
 export * from '../components/DynamicFilter/dictionary';
+export * from '../components/ErrorLabel';
 export type { FilterFieldApply, RawFilterFieldApply, InitialFilterFieldApply, } from '../components/DynamicFilter/types';
 export * from './CommonActions/';
 export * from './CommonActions/dictionary';

package/components/mui_extended/Accordion/components/AccordionLabel.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { AccordionLabelProps } from '../types';
+export declare const AccordionLabel: (props: AccordionLabelProps) => JSX.Element;

package/components/mui_extended/Accordion/index.js

@@ -1,7 +1,64 @@
-import { Accordion as Accordion$1, AccordionSummary, Skeleton, AccordionDetails } from "@mui/material";
+import { Skeleton, Accordion as Accordion$1, AccordionSummary, AccordionDetails } from "@mui/material";
 import { I as IconButton } from "../IconButton/index.js";
 import { useEnvironment, useModuleSkeleton } from "@m4l/core";
-import { jsxs, jsx } from "react/jsx-runtime";
+import { I as Icon } from "../../Icon/index.js";
+import { styled } from "@mui/material/styles";
+import { jsx, jsxs } from "react/jsx-runtime";
+styled("div")(({
+  theme
+}) => ({
+  display: "flex",
+  justifyContent: "space-between",
+  alignItems: "center",
+  borderRadius: theme.spacing(0.5),
+  height: theme.spacing(4.5),
+  minHeight: theme.spacing(4.5),
+  backgroundColor: theme.palette.background.header,
+  paddingLeft: theme.spacing(2),
+  paddingRight: theme.spacing(2),
+  marginBottom: "0px"
+}));
+const WrapperAccordionLabel = styled("div")(({
+  theme
+}) => ({
+  display: "flex",
+  justifyContent: "flex-start",
+  alignItems: "center",
+  gap: theme.spacing(2)
+}));
+const Label = styled("span")(({
+  theme
+}) => ({
+  ...theme.typography.subtitle2
+}));
+const AccordionLabel = (props) => {
+  const {
+    isSkeleton,
+    label,
+    SKTWidht,
+    SKTHeight,
+    labelIcon
+  } = props;
+  return /* @__PURE__ */ jsx("div", {
+    children: isSkeleton ? /* @__PURE__ */ jsxs(WrapperAccordionLabel, {
+      children: [labelIcon && /* @__PURE__ */ jsx(Skeleton, {
+        variant: "circular",
+        width: "16px",
+        height: "16px"
+      }), /* @__PURE__ */ jsx(Skeleton, {
+        variant: "text",
+        width: SKTWidht,
+        height: SKTHeight
+      })]
+    }) : /* @__PURE__ */ jsxs(WrapperAccordionLabel, {
+      children: [labelIcon && /* @__PURE__ */ jsx(Icon, {
+        src: labelIcon
+      }), /* @__PURE__ */ jsx(Label, {
+        children: label
+      })]
+    })
+  });
+};
 function Accordion(props) {
   const {
     label,
@@ -9,7 +66,8 @@ function Accordion(props) {
     SKTHeight,
     children,
     accordionProps,
-    summaryProps
+    summaryProps,
+    labelIcon
   } = props;
   const {
     host_static_assets,
@@ -32,11 +90,13 @@ function Accordion(props) {
         src: `${host_static_assets}/${environment_assets}/frontend/components/accordion/assets/icons/expanded.svg`
       }),
       ...summaryProps,
-      children: isSkeleton ? /* @__PURE__ */ jsx(Skeleton, {
-        variant: "text",
-        width: SKTWidht,
-        height: SKTHeight
-      }) : label
+      children: /* @__PURE__ */ jsx(AccordionLabel, {
+        isSkeleton,
+        label,
+        SKTWidht,
+        SKTHeight,
+        labelIcon
+      })
     }), /* @__PURE__ */ jsx(AccordionDetails, {
       children
     })]

package/components/mui_extended/Accordion/styles.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const SKTAccordionWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const WrapperAccordionLabel: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Label: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/components/mui_extended/Accordion/types.d.ts

@@ -5,6 +5,10 @@ export declare type AccordionProps = {
     children: ReactNode;
     accordionProps?: MUIAccordionProps;
     summaryProps?: AccordionSummaryProps;
+    labelIcon?: string;
     SKTWidht?: string | number;
     SKTHeight?: string | number;
 };
+export interface AccordionLabelProps extends Pick<AccordionProps, 'label' | 'SKTWidht' | 'SKTHeight' | 'labelIcon'> {
+    isSkeleton: boolean;
+}

package/components/mui_extended/Tab/index.d.ts

@@ -1,2 +1,3 @@
 /// <reference types="react" />
-export declare function Tab(props: any): JSX.Element;
+import { TabProps } from './types';
+export declare function Tab(props: TabProps): JSX.Element;

package/components/mui_extended/Tab/types.d.ts

@@ -0,0 +1,5 @@
+import { TabProps as MUITabProps } from '@mui/material';
+export interface TabProps extends MUITabProps {
+    SKTWidth: string | number;
+    SKTHeight: string | number;
+}

package/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export { useFormAddEdit } from './useFormAddEdit';
+export { useModal } from './useModal';

package/hooks/useFormAddEdit/index.d.ts

@@ -0,0 +1,6 @@
+import { FormStatusLoad } from '../../components/hook-form/FormProvider/types';
+import { UseFormAddEditProps } from './types';
+export declare const useFormAddEdit: (props: UseFormAddEditProps) => {
+    formValues: import("react-hook-form").FieldValues;
+    statusLoad: FormStatusLoad;
+};

package/hooks/useFormAddEdit/types.d.ts

@@ -0,0 +1,8 @@
+import { FieldValues } from 'react-hook-form';
+import { FormInitialValues } from '../../components/hook-form/FormProvider/types';
+export interface UseFormAddEditProps {
+    objectId?: number;
+    endPoint: string;
+    initialValues: FormInitialValues;
+    formatDataEnpoint?: (data: FieldValues) => FormInitialValues;
+}

package/index.d.ts

@@ -1,4 +1,4 @@
 export * from './components';
 export * from './contexts';
-export * from './hooks/useModal';
+export * from './hooks';
 export { Logo } from './assets/Logo';

package/index.js

@@ -1,32 +1,35 @@
 export { I as IconButton, a as IconButtonAnimate } from "./components/mui_extended/IconButton/index.js";
 import "framer-motion";
-import "@mui/material";
-import "react/jsx-runtime";
+import { styled } from "@mui/material";
+import { jsx } from "react/jsx-runtime";
 export { L as LoadingScreen } from "./components/animate/LoadingScreen/index.js";
-import "react";
+import { useState, useEffect } from "react";
 import "react-hook-form";
 export { F as FormProvider } from "./components/hook-form/FormProvider/index.js";
-import "@m4l/core";
+import { useNetwork, useFlags } from "@m4l/core";
 export { R as RHFAutocomplete } from "./components/hook-form/RHFAutocomplete/index.js";
 export { R as RHFAutocompleteAsync } from "./components/hook-form/RHFAutocompleteAsync/index.js";
 export { R as RHFCheckbox } from "./components/hook-form/RHFCheckbox/index.js";
 export { R as RHFDateTime } from "./components/hook-form/RHFDateTime/index.js";
 import "@mui/x-date-pickers";
 export { R as RHFTextField } from "./components/hook-form/RHFTextField/index.js";
+export { R as RHFPeriod, g as getPeriodComponetsDictionary } from "./components/hook-form/RHFPeriod/index.js";
+export { I as Icon } from "./components/Icon/index.js";
+import "@mui/material/styles";
+export { b as Actions, M as MenuActions, d as defaultCommonActionsDictionary, g as getCommonActionsDictionary } from "./components/CommonActions/components/Actions/index.js";
+import "@mui/material/Button";
+export { B as Button, L as LoadingButton } from "./components/mui_extended/Button/index.js";
+import "react-router-dom";
+export { M as ModalContext, a as ModalProvider } from "./contexts/ModalContext/index.js";
+import "@mui/lab";
 import "./lodash.js";
 import "react-dropzone";
-import "@mui/material/styles";
 import "./react-lazy-load-image-component.js";
 export { I as Image } from "./components/Image/index.js";
 export { R as RHFUploadImage } from "./components/hook-form/RHFUpload/index.js";
-export { I as Icon } from "./components/Icon/index.js";
+export { A as Accordion } from "./components/mui_extended/Accordion/index.js";
 export { A as Avatar } from "./components/mui_extended/Avatar/index.js";
-import "react-router-dom";
-import "@mui/material/Button";
-export { B as Button, L as LoadingButton } from "./components/mui_extended/Button/index.js";
-import "@mui/lab";
 export { M as MenuPopover } from "./components/mui_extended/MenuPopover/index.js";
-export { b as Actions, M as MenuActions, d as defaultCommonActionsDictionary, g as getCommonActionsDictionary } from "./components/CommonActions/components/Actions/index.js";
 export { P as Pager, g as getPagerComponentsDictionary } from "./components/mui_extended/Pager/index.js";
 export { T as Tab } from "./components/mui_extended/Tab/index.js";
 import "@m4l/graphics";
@@ -34,7 +37,6 @@ export { C as CompanyLogo } from "./components/CompanyLogo/index.js";
 export { D as DataGrid, N as NumberEditor, T as TextEditor, g as getGridComponentsDictionary } from "./components/DataGrid/index.js";
 import "react-dnd";
 import "react-dnd-html5-backend";
-export { M as ModalContext, a as ModalProvider } from "./contexts/ModalContext/index.js";
 export { S as ScrollBar } from "./components/ScrollBar/index.js";
 export { D as DynamicFilter, d as defaultDynamicFilterDictionary, g as getDynamicFilterComponentsDictionary } from "./components/DynamicFilter/index.js";
 import "simplebar/dist/simplebar.min.css";
@@ -59,14 +61,13 @@ export { M as MotionLazyContainer } from "./components/animate/MotionLazyContain
 export { R as RHFMultiCheckbox } from "./components/hook-form/RHFMultiCheckbox/index.js";
 export { R as RHFSelect } from "./components/hook-form/RHFSelect/index.js";
 export { R as RHFRadioGroup } from "./components/hook-form/RHFRadioGroup/index.js";
-export { A as Accordion } from "./components/mui_extended/Accordion/index.js";
 export { B as BoxIcon } from "./components/mui_extended/BoxIcon/index.js";
 export { B as Breadcrumbs } from "./components/mui_extended/Breadcrumbs/index.js";
 export { L as LinkWithRoute } from "./components/mui_extended/LinkWithRoute/index.js";
 export { T as Typography } from "./components/mui_extended/Typography/index.js";
-export { B as BooleanFormatter } from "./components/formatters/BooleanFormatter/index.js";
-export { D as DateFormatter } from "./components/formatters/DateFormatter/index.js";
-export { d as defaultFormattersDictionary, g as getFormattersComponentsDictionary } from "./components/formatters/index.js";
+export { B as BooleanFormatter, c as columnBooleanFormatter } from "./components/formatters/BooleanFormatter/index.js";
+export { D as DateFormatter, c as columnDateFormatter } from "./components/formatters/DateFormatter/index.js";
+export { P as PointsFormatter, a as PriceFormatter, U as UncertaintyFormatter, e as columnNestedValueFormatter, b as columnPointsFormatter, c as columnUncertaintyFormatter, d as defaultFormattersDictionary, g as getFormattersComponentsDictionary } from "./components/formatters/index.js";
 export { A as ActionCancel } from "./components/CommonActions/components/ActionCancel/index.js";
 export { A as ActionIntro } from "./components/CommonActions/components/ActionIntro/index.js";
 export { A as ActionFormCancel } from "./components/CommonActions/components/ActionFormCancel/index.js";
@@ -76,13 +77,68 @@ export { S as ScrollToTop } from "./components/ScrollToTop/index.js";
 export { u as useModal } from "./hooks/useModal/index.js";
 export { L as Logo } from "./assets/Logo/index.js";
 import "./node_modules.js";
-import "./commonjs.js";
-import "react-dom";
-import "prop-types";
-import "clsx";
+import "./index.js";
 import "./utils/index.js";
 import "./react-data-grid.js";
+import "clsx";
+import "./commonjs.js";
+import "prop-types";
+import "react-dom";
 import "simplebar-react";
 import "yup";
 import "./react-resizable.js";
 import "react-helmet-async";
+const Wrapper = styled("p")(({
+  theme
+}) => ({
+  ...theme.typography.caption,
+  color: theme.palette.error.main
+}));
+const ErrorLabel = (props) => {
+  const {
+    message
+  } = props;
+  return /* @__PURE__ */ jsx(Wrapper, {
+    children: message
+  });
+};
+const useFormAddEdit = (props) => {
+  const { initialValues, objectId, endPoint, formatDataEnpoint } = props;
+  const [formValues, setFormValues] = useState(initialValues);
+  const [statusLoad, setStatusLoad] = useState(
+    objectId === void 0 ? "new" : "edit"
+  );
+  const { networkOperation } = useNetwork();
+  const { addFlag } = useFlags();
+  useEffect(() => {
+    let mounted = true;
+    if (statusLoad === "edit") {
+      networkOperation({
+        method: "GET",
+        endPoint: `${endPoint}/${objectId}`
+      }).then(
+        (response) => {
+          if (mounted) {
+            if (formatDataEnpoint) {
+              setFormValues(formatDataEnpoint(response));
+            } else {
+              setFormValues(response);
+            }
+            setStatusLoad("reload_values_provider");
+          }
+        },
+        () => {
+          setStatusLoad("error");
+        }
+      );
+    } else if (statusLoad === "new" || statusLoad === "reload_values_provider") {
+      addFlag("form_loaded");
+      setStatusLoad("ready");
+    }
+    return () => {
+      mounted = false;
+    };
+  }, [statusLoad]);
+  return { formValues, statusLoad };
+};
+export { ErrorLabel, useFormAddEdit };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m4l/components",
-  "version": "0.1.8",
+  "version": "0.1.10",
   "license": "UNLICENSED",
   "dependencies": {
     "@m4l/core": "*",
@@ -8,8 +8,8 @@
     "react-helmet-async": "^1.3.0",
     "react-hook-form": "^7.33.1",
     "react-router-dom": "^6.3.0",
-    "yup": "^0.32.11",
-    "simplebar-react": "2.4.1"
+    "simplebar-react": "2.4.1",
+    "yup": "^0.32.11"
   },
   "peerDependencies": {
     "@mui/lab": "^5.0.0-alpha.89",

package/react-draggable.js

@@ -1,4 +1,4 @@
-import require$$0 from "react";
+import React$1 from "react";
 import require$$1 from "prop-types";
 import require$$2 from "react-dom";
 import clsx from "clsx";
@@ -18,7 +18,7 @@ Object.defineProperty(DraggableCore$2, "__esModule", {
   value: true
 });
 DraggableCore$2.default = void 0;
-var React = _interopRequireWildcard(require$$0);
+var React = _interopRequireWildcard(React$1);
 var _propTypes = _interopRequireDefault(require$$1);
 var _reactDom = _interopRequireDefault(require$$2);
 var _domFns = domFns;
@@ -480,7 +480,7 @@ _defineProperty(DraggableCore$1, "defaultProps", {
     }
   });
   exports.default = void 0;
-  var React2 = _interopRequireWildcard2(require$$0);
+  var React2 = _interopRequireWildcard2(React$1);
   var _propTypes2 = _interopRequireDefault2(require$$1);
   var _reactDom2 = _interopRequireDefault2(require$$2);
   var _clsx2 = _interopRequireDefault2(clsx);