@m4l/components 0.1.9 → 0.1.10

package/components/DataGrid/formatters/columnBooleanFormatter/index.d.ts

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

package/components/DataGrid/formatters/columnBooleanFormatter/types.d.ts

@@ -0,0 +1,7 @@
+import { ComponentType } from 'react';
+import { PresentationType } from '../../../../components/formatters/BooleanFormatter/types';
+export interface ColumnBooleanFormatterProps {
+    Component?: ComponentType;
+    presentationType: PresentationType;
+    fieldValue: string;
+}

package/components/DataGrid/formatters/columnDateFormatter/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { ColumnDateFormatterProps } from './types';
+export declare function columnDateFormatter(props: ColumnDateFormatterProps): (obProps: any) => JSX.Element;

package/components/DataGrid/formatters/columnDateFormatter/types.d.ts

@@ -0,0 +1,8 @@
+import { ComponentType } from 'react';
+import { PresentationType } from '../../../formatters/DateFormatter/types';
+export interface ColumnDateFormatterProps {
+    Component?: ComponentType;
+    presentationType: PresentationType;
+    format?: string;
+    fieldValue: string;
+}

package/components/DataGrid/formatters/index.d.ts

@@ -1,4 +1,6 @@
 export { columnUncertaintyFormatter } from './columnUncertaintyFormatter';
 export { columnPointsFormatter } from './columnPointsFormatter';
 export { columnNestedValueFormatter } from './columnNestedValueFormatter';
+export { columnBooleanFormatter } from './columnBooleanFormatter';
+export { columnDateFormatter } from './columnDateFormatter';
 export type { ColumnUncertaintyFormatterProps } from './columnUncertaintyFormatter/types';

package/components/DataGrid/index.js

@@ -82,6 +82,9 @@ const OriginalDataGridWrapperStyled = styled("div")(({
       right: "0px",
       top: "25%",
       bottom: "25%"
+    },
+    "& .m4l_icon": {
+      height: "100%"
     }
   },
   "& .rdg-cell.rdg-cell-align-left": {

package/components/DynamicFilter/index.js

@@ -1,6 +1,6 @@
 import { S as ScrollBar } from "../ScrollBar/index.js";
 import { styled } from "@mui/material/styles";
-import require$$0, { useRef, useState, useMemo, useCallback, useEffect, createContext, useContext } from "react";
+import React, { useRef, useState, useMemo, useCallback, useEffect, createContext, useContext } from "react";
 import { useModuleDictionary, useHostTools, useEnvironment, voidFunction, useFlagsPresent } from "@m4l/core";
 import * as Yup from "yup";
 import { useFormContext, useWatch } from "react-hook-form";
@@ -13,8 +13,9 @@ import "../hook-form/RHFCheckbox/index.js";
 import { R as RHFDateTime } from "../hook-form/RHFDateTime/index.js";
 import "@mui/x-date-pickers";
 import { R as RHFTextField } from "../hook-form/RHFTextField/index.js";
-import "../../index.js";
+import "../hook-form/RHFPeriod/index.js";
 import { I as Icon } from "../Icon/index.js";
+import "../../index.js";
 import { L as LabelMemuItem, b as Actions, g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.js";
 import "@mui/material/Button";
 import { F as FilterButton } from "../mui_extended/Button/index.js";
@@ -690,7 +691,7 @@ const strategiesEditFilterComponent = {
   number: NumberFilter,
   boolean: BooleanFilter,
   datetime: DateTimeFilter,
-  __default__: require$$0.Fragment
+  __default__: React.Fragment
 };
 const PopupEditFilterComponent = (props) => {
   const {

package/components/ErrorLabel/index.d.ts

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

package/components/Icon/index.js

@@ -66,7 +66,7 @@ function Icon(props) {
   }, [src]);
   const placeHolder = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDI2LjMuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNhcGFfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiCgkgdmlld0JveD0iMCAwIDcwIDcwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA3MCA3MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiM2MzczODE7fQo8L3N0eWxlPgo8Zz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00NSw4LjdjMS40LTEuNSwzLjQtMi4zLDUuNC0yLjNzMy45LDAuOCw1LjQsMi4zczIuNCwzLjUsMi41LDUuN2MwLDIuMi0wLjksNC4yLTIuNCw1LjdzLTMuNSwyLjMtNS41LDIuMgoJCWMtMi4xLDAuMS00LTAuNy01LjUtMi4yYy0xLjQtMS41LTIuMy0zLjUtMi40LTUuN0M0Mi42LDEyLjIsNDMuNSwxMC4yLDQ1LDguN3oiLz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik02OC40LDYyLjFjLTAuMywwLjUtMC43LDAuOC0xLjIsMS4xcy0xLDAuNC0xLjYsMC40SDQuM2MtMC42LDAtMS4xLTAuMS0xLjYtMC40cy0wLjktMC42LTEuMi0xLjEKCQljLTAuMi0wLjUtMC40LTEtMC40LTEuNXMwLjEtMS4xLDAuNC0xLjVsMjMtMzYuNGMwLjMtMC41LDAuNy0wLjgsMS4yLTEuMXMxLTAuNCwxLjYtMC40czEuMSwwLjEsMS42LDAuNHMwLjksMC42LDEuMiwxLjEKCQlsMTEuNSwxOC4yYzAuMiwwLjMsMC41LDAuNSwwLjgsMC43czAuNiwwLjMsMSwwLjNjMC4zLDAsMC43LTAuMSwxLTAuM3MwLjYtMC40LDAuOC0wLjdsMy4xLTQuOWMwLjMtMC41LDAuNy0wLjgsMS4yLTEuMQoJCXMxLTAuNCwxLjYtMC40czEuMSwwLjEsMS42LDAuNGMwLjUsMC4zLDAuOSwwLjYsMS4yLDEuMWwxNC42LDIzLjFjMC4zLDAuNSwwLjMsMSwwLjMsMS41UzY4LjcsNjEuNyw2OC40LDYyLjF6Ii8+CjwvZz4KPC9zdmc+Cg==";
   return /* @__PURE__ */ jsx(WrapperPlaceHolder, {
-    id: "IconReact",
+    className: "m4l_icon",
     children: resource ? /* @__PURE__ */ jsx(DivIcon, {
       src: resource,
       size: finalSize,

package/components/formatters/BooleanFormatter/index.js

@@ -1,17 +1,23 @@
-import require$$0 from "react";
-import { useModuleDictionary } from "@m4l/core";
-import { Checkbox } from "@mui/material";
+import { useModuleDictionary, useEnvironment, getPropertyByString } from "@m4l/core";
+import React from "react";
+import { I as Icon } from "../../Icon/index.js";
 import { jsx } from "react/jsx-runtime";
 function BooleanFormatter(props) {
   const {
     presentationType,
     value,
-    Component = require$$0.Fragment
+    Component = React.Fragment
   } = props;
   const {
     getLabel
   } = useModuleDictionary();
+  const {
+    host_static_assets,
+    environment_assets
+  } = useEnvironment();
   const final_value = value ?? false;
+  const srcCheckTrue = `${host_static_assets}/${environment_assets}/frontend/components/data_grid/components/boolean_formatter/assets/icons/check_true.svg`;
+  const srcCheckFalse = `${host_static_assets}/${environment_assets}/frontend/components/data_grid/components/boolean_formatter/assets/icons/check_false.svg`;
   if (presentationType === "string_yes_no") {
     return /* @__PURE__ */ jsx(Component, {
       children: final_value ? getLabel("formatters.boolean_yes") : getLabel("formatters.boolean_no")
@@ -22,12 +28,25 @@ function BooleanFormatter(props) {
       children: final_value ? getLabel("formatters.boolean_true") : getLabel("formatters.boolean_false")
     });
   }
-  return /* @__PURE__ */ jsx(Checkbox, {
-    checked: final_value,
-    size: "small",
-    readOnly: true,
-    disableFocusRipple: true,
-    disableRipple: true
+  return /* @__PURE__ */ jsx(Component, {
+    children: /* @__PURE__ */ jsx(Icon, {
+      src: final_value ? srcCheckTrue : srcCheckFalse,
+      bgColor: "action.disabled"
+    })
   });
 }
-export { BooleanFormatter as B };
+function columnBooleanFormatter(props) {
+  const {
+    fieldValue,
+    presentationType,
+    Component = React.Fragment
+  } = props;
+  return (obProps) => {
+    return /* @__PURE__ */ jsx(BooleanFormatter, {
+      presentationType,
+      value: getPropertyByString(obProps, fieldValue),
+      Component
+    });
+  };
+}
+export { BooleanFormatter as B, columnBooleanFormatter as c };

package/components/formatters/BooleanFormatter/types.d.ts

@@ -1,7 +1,7 @@
-import { ComponentForrmaterType } from '../types';
+import { ComponentType } from 'react';
 export declare type PresentationType = 'string_yes_no' | 'string_true_false' | 'check';
 export interface BooleanFormatterProps {
-    Component?: ComponentForrmaterType;
+    Component?: ComponentType;
     presentationType: PresentationType;
     value?: boolean;
 }

package/components/formatters/DateFormatter/index.js

@@ -1,12 +1,14 @@
-import { useEnvironment, useHostTools } from "@m4l/core";
-import require$$0 from "react";
+import React from "react";
+import { useEnvironment, useHostTools, getPropertyByString } from "@m4l/core";
+import "../../Icon/index.js";
+import "@mui/material/styles";
 import { jsx, Fragment } from "react/jsx-runtime";
 function DateFormatter(props) {
   const {
     presentationType,
     value,
     format,
-    Component = require$$0.Fragment
+    Component = React.Fragment
   } = props;
   const {
     dfnsFormat
@@ -43,20 +45,22 @@ function DateFormatter(props) {
   } catch (e) {
     result = "err_typing";
   }
-  switch (Component) {
-    case "div":
-      return /* @__PURE__ */ jsx("div", {
-        className: "DateFormatter",
-        children: result
-      });
-    case "span":
-      return /* @__PURE__ */ jsx("span", {
-        className: "DateFormatter",
-        children: result
-      });
-  }
   return /* @__PURE__ */ jsx(Component, {
     children: result
   });
 }
-export { DateFormatter as D };
+function columnDateFormatter(props) {
+  const {
+    fieldValue,
+    presentationType,
+    Component = React.Fragment
+  } = props;
+  return (obProps) => {
+    return /* @__PURE__ */ jsx(DateFormatter, {
+      presentationType,
+      value: getPropertyByString(obProps, fieldValue),
+      Component
+    });
+  };
+}
+export { DateFormatter as D, columnDateFormatter as c };

package/components/formatters/DateFormatter/types.d.ts

@@ -1,8 +1,8 @@
 import { Maybe } from '@m4l/core';
-import { ComponentForrmaterType } from '../types';
+import { ComponentType } from 'react';
 export declare type PresentationType = 'date' | 'datetime' | 'time';
 export interface DateFormatterProps {
-    Component?: ComponentForrmaterType;
+    Component?: ComponentType;
     presentationType: PresentationType;
     format?: string;
     value: Maybe<Date | string | number>;

package/components/formatters/index.js

@@ -1,13 +1,14 @@
-import require$$0 from "react";
+import React from "react";
 import { jsx, Fragment } from "react/jsx-runtime";
 import { getPropertyByString } from "@m4l/core";
-import "@mui/material";
+import "../Icon/index.js";
+import "@mui/material/styles";
 function UncertaintyFormatter(props) {
   const {
     value,
     unit,
     symbol,
-    Component = require$$0.Fragment
+    Component = React.Fragment
   } = props;
   if (value === void 0 || value === null || !Array.isArray(value)) {
     return /* @__PURE__ */ jsx(Fragment, {
@@ -28,7 +29,7 @@ function PointsFormatter(props) {
   const {
     value,
     unit,
-    Component = require$$0.Fragment
+    Component = React.Fragment
   } = props;
   console.log("points", value);
   if (value === void 0 || value === null || !Array.isArray(value)) {
@@ -50,7 +51,7 @@ function PointsFormatter(props) {
 function PriceFormatter(props) {
   const {
     value,
-    Component = require$$0.Fragment
+    Component = React.Fragment
   } = props;
   return /* @__PURE__ */ jsx(Component, {
     children: `${value}$Cop`
@@ -100,7 +101,7 @@ function columnPointsFormatter(props) {
 function columnNestedValueFormatter(props) {
   const {
     fieldValue,
-    Component = require$$0.Fragment
+    Component = React.Fragment
   } = props;
   return (obProps) => {
     console.log("columnNestedValueFormatter", obProps, fieldValue);

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/index.js

@@ -1,22 +1,21 @@
 export { I as IconButton, a as IconButtonAnimate } from "./components/mui_extended/IconButton/index.js";
 import "framer-motion";
-import { styled, Skeleton, Autocomplete, TextField } from "@mui/material";
-import { jsx, jsxs } from "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 { useMemo, useState, useEffect } from "react";
-import { useFormContext, Controller } from "react-hook-form";
+import { useState, useEffect } from "react";
+import "react-hook-form";
 export { F as FormProvider } from "./components/hook-form/FormProvider/index.js";
-import { useModuleDictionary, useModuleSkeleton, useEnvironment, useNetwork, useFlags } from "@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";
-import { I as Icon } from "./components/Icon/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";
-import { g as getCommonActionsDictionary } from "./components/CommonActions/components/Actions/index.js";
 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";
@@ -66,8 +65,8 @@ 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 { 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";
@@ -78,6 +77,7 @@ 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 "./index.js";
 import "./utils/index.js";
 import "./react-data-grid.js";
 import "clsx";
@@ -86,66 +86,8 @@ import "prop-types";
 import "react-dom";
 import "simplebar-react";
 import "yup";
-import "./index.js";
 import "./react-resizable.js";
 import "react-helmet-async";
-const Wrapper$1 = 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 Wrapper = styled("p")(({
   theme
 }) => ({
@@ -160,162 +102,6 @@ const ErrorLabel = (props) => {
     children: message
   });
 };
-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$1, {
-        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: (e2) => {
-              onTotalChange(selPeriodTime, e2.target.value === "" ? "" : parseInt(e2.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());
-}
 const useFormAddEdit = (props) => {
   const { initialValues, objectId, endPoint, formatDataEnpoint } = props;
   const [formValues, setFormValues] = useState(initialValues);
@@ -334,9 +120,9 @@ const useFormAddEdit = (props) => {
         (response) => {
           if (mounted) {
             if (formatDataEnpoint) {
-              setFormValues(formatDataEnpoint(response.data));
+              setFormValues(formatDataEnpoint(response));
             } else {
-              setFormValues(response.data);
+              setFormValues(response);
             }
             setStatusLoad("reload_values_provider");
           }
@@ -355,4 +141,4 @@ const useFormAddEdit = (props) => {
   }, [statusLoad]);
   return { formValues, statusLoad };
 };
-export { ErrorLabel, RHFPeriod, getPeriodComponetsDictionary, useFormAddEdit };
+export { ErrorLabel, useFormAddEdit };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m4l/components",
-  "version": "0.1.9",
+  "version": "0.1.10",
   "license": "UNLICENSED",
   "dependencies": {
     "@m4l/core": "*",

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);

package/react-json-view.js

@@ -1,9 +1,9 @@
 import { c as commonjsGlobal, g as getDefaultExportFromCjs } from "./commonjs.js";
-import require$$0 from "react";
+import React from "react";
 var main = { exports: {} };
 (function(module, exports) {
   !function(e, t) {
-    module.exports = t(require$$0);
+    module.exports = t(React);
   }(commonjsGlobal, function(e) {
     return function(e2) {
       var t = {};

package/react-lazy-load-image-component.js

@@ -1,4 +1,4 @@
-import require$$0 from "react";
+import React from "react";
 import require$$2 from "react-dom";
 var build = { exports: {} };
 (() => {
@@ -200,7 +200,7 @@ var build = { exports: {} };
   var n = {};
   (() => {
     r.r(n), r.d(n, { LazyLoadComponent: () => J, LazyLoadImage: () => ue, trackWindowScroll: () => C });
-    const e2 = require$$0;
+    const e2 = React;
     var t2 = r.n(e2), o = r(697);
     const i = require$$2;
     var c = r.n(i);

package/react-resizable.js

@@ -1,4 +1,4 @@
-import require$$0 from "react";
+import React$2 from "react";
 import { c as cjs } from "./react-draggable.js";
 import { u as utils } from "./utils/index.js";
 import require$$1 from "prop-types";
@@ -47,7 +47,7 @@ var resizableProps = {
 propTypes.resizableProps = resizableProps;
 Resizable$1.__esModule = true;
 Resizable$1.default = void 0;
-var React$1 = _interopRequireWildcard$1(require$$0);
+var React$1 = _interopRequireWildcard$1(React$2);
 var _reactDraggable = cjs.exports;
 var _utils = utils;
 var _propTypes$1 = propTypes;
@@ -335,7 +335,7 @@ Resizable.defaultProps = {
 var ResizableBox$2 = {};
 ResizableBox$2.__esModule = true;
 ResizableBox$2.default = void 0;
-var React = _interopRequireWildcard(require$$0);
+var React = _interopRequireWildcard(React$2);
 var _propTypes = _interopRequireDefault(require$$1);
 var _Resizable = _interopRequireDefault(Resizable$1);
 var _propTypes2 = propTypes;

package/react-splitter-layout.js

@@ -1,10 +1,10 @@
 import { g as getDefaultExportFromCjs } from "./commonjs.js";
 import require$$1 from "prop-types";
-import require$$0 from "react";
+import React from "react";
 var lib = { exports: {} };
 (function(module, exports) {
   !function(e, t) {
-    module.exports = t(require$$1, require$$0);
+    module.exports = t(require$$1, React);
   }(window, function(e, t) {
     return function(e2) {
       var t2 = {};

package/utils/index.js

@@ -1,4 +1,4 @@
-import require$$0 from "react";
+import React from "react";
 const getPaletteColor = function(palette, s) {
   s = s.replace(/\[(\w+)\]/g, ".$1");
   s = s.replace(/^\./, "");
@@ -518,7 +518,7 @@ function log() {
 var utils = {};
 utils.__esModule = true;
 utils.cloneElement = cloneElement;
-var _react = _interopRequireDefault(require$$0);
+var _react = _interopRequireDefault(React);
 function _interopRequireDefault(obj) {
   return obj && obj.__esModule ? obj : { default: obj };
 }