@m4l/components 0.2.34 → 0.2.36

package/components/commercial/SectionCommercial/styles.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+export declare const SectionCommercialRoot: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
+    ref?: import("react").Ref<unknown> | undefined;
+    children?: import("react").ReactNode;
+    direction?: import("@mui/system").ResponsiveStyleValue<"column" | "row" | "column-reverse" | "row-reverse"> | undefined;
+    spacing?: import("@mui/system").ResponsiveStyleValue<string | number> | undefined;
+    divider?: import("react").ReactNode;
+    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, "ref" | "children" | "direction" | keyof import("@mui/material/OverridableComponent").CommonProps | ("px" | "p" | "top" | "minWidth" | "maxWidth" | "width" | "gridTemplateRows" | "right" | "left" | "height" | "bottom" | "gridTemplateColumns" | "color" | "flex" | "margin" | "boxSizing" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "textTransform" | "position" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "zIndex" | "boxShadow" | "maxHeight" | "minHeight" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "pt" | "pr" | "pb" | "pl" | "py" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "marginInline" | "marginInlineStart" | "marginInlineEnd" | "marginBlock" | "marginBlockStart" | "marginBlockEnd" | "padding" | "paddingX" | "paddingY" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "typography" | "textAlign") | "sx" | "spacing" | "divider"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/components/commercial/SectionCommercial/types.d.ts

@@ -1,9 +1,8 @@
-import { ReactNode } from "react";
-import { StackProps } from "../../mui_extended";
+import { ReactNode } from 'react';
+import { StackProps } from '../../mui_extended';
 export interface SectionComercialProps extends StackProps {
     children: ReactNode;
     contentWith?: 'fullWidth' | 'boxed';
     columnReverse?: boolean;
 }
-export interface OnwerState extends Pick<SectionComercialProps, 'contentWith' | 'columnReverse'> {
-}
+export declare type OnwerState = Pick<SectionComercialProps, 'contentWith' | 'columnReverse'>;

package/components/commercial/TopBar/component/ConteinItem/subcomponets/NavItem/index.d.ts

@@ -1,4 +1,4 @@
-import { NavItemRootProps } from "./types";
+import { NavItemRootProps } from './types';
 /**
  * @description Componente que es el NavItemRoot que es el boton con la posibilidad de tener un accordion
  * @param props - Props de el componente NavItemRoot

package/components/commercial/TopBar/component/ConteinItem/subcomponets/NavItem/subcomponents/ArrowIcon/styles.d.ts

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

package/components/commercial/TopBar/component/ConteinItem/subcomponets/NavItem/types.d.ts

@@ -1,4 +1,4 @@
-import { MenuDataType } from "../../../../../../SideBar";
+import { MenuDataType } from '../../../../../../SideBar';
 export interface NavItemRootProps {
     itemRootData: MenuDataType;
 }

package/components/commercial/TopBar/context/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { TopBarProviderProps, TopBarProviderValue } from "./type";
+import { TopBarProviderProps, TopBarProviderValue } from './type';
 /**
  * @param TopBarContext  Creación de variable de contexto para compartir el estado y almacenar una configuración inicial
  */

package/components/commercial/TopBar/context/type.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from "react";
-import { Classes, TopBarProps } from "../type";
+import { ReactNode } from 'react';
+import { Classes, TopBarProps } from '../type';
 /**
  * @interface TopBarProviderValue Hereda propiedades de TopBarProps y almacena classes
  */

package/components/commercial/TopBar/index.7aeb6ec0.js

@@ -0,0 +1,234 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { T as TEST_PROP_ID } from "../../../test/constants_no_mock.86c553a9.js";
+import { generateUtilityClasses, styled, useTheme, Box, Grid } from "@mui/material";
+import { unstable_composeClasses } from "@mui/base";
+import { g as getComponentUtilityClass } from "../../../utils/index.0718eeac.js";
+import { createContext, useContext, useState } from "react";
+import { useEnvironment } from "@m4l/core";
+import { I as Icon } from "../../Icon/index.ee7b85c9.js";
+import clsx from "clsx";
+import { g as getNameDataTestId } from "../../../test/getNameDataTestId.0faeade8.js";
+import { A as Accordion } from "../../mui_extended/Accordion/index.d08a0361.js";
+import { B as Button } from "../../mui_extended/Button/index.5395d101.js";
+import { P as Popover } from "../../mui_extended/Popover/index.4e7340b4.js";
+const componentName = "M4LTopBar";
+const TopBarClasses = generateUtilityClasses(componentName, [
+  "root",
+  "ContainerImageComercial",
+  "SimplebarComercial",
+  "ItemRoot",
+  "ItemSelect",
+  "ContainerAccordion",
+  "ContainerAccordionCase1",
+  "IconAndButton",
+  "IsActive"
+]);
+function getTopBarClassesUtilityClass() {
+  const slots = {
+    root: ["root"],
+    ContainerImageComercial: ["ContainerImageComercial"],
+    SimplebarComercial: ["SimplebarComercial"],
+    ItemRoot: ["ItemRoot"],
+    ItemSelect: ["ItemSelect"],
+    ContainerAccordion: ["ContainerAccordion"],
+    ContainerAccordionCase1: ["ContainerAccordionCase1"],
+    IconAndButton: ["IconAndButton"]
+  };
+  const composedClasses = unstable_composeClasses(slots, getComponentUtilityClass(componentName), {});
+  return {
+    ...composedClasses
+  };
+}
+const initialstate = {
+  dataMenu: [],
+  classes: getTopBarClassesUtilityClass(),
+  dataTestId: ""
+};
+const TopBarContext = createContext(initialstate);
+const TopBarProvider = (props) => {
+  const { children, value } = props;
+  const { dataMenu: DataMenu, classes, dataTestId } = value;
+  return /* @__PURE__ */ jsx(
+    TopBarContext.Provider,
+    {
+      value: { dataMenu: DataMenu, classes, dataTestId },
+      children
+    }
+  );
+};
+const useTopBar = () => useContext(TopBarContext);
+const useTopBar$1 = useTopBar;
+const ArrowIconRoot = styled("div")(() => ({
+  display: "flex",
+  alignSelf: "center",
+  lineHeight: 0
+}));
+function ArrowIcon(props) {
+  const { openState } = props;
+  const { host_static_assets, environment_assets } = useEnvironment();
+  return /* @__PURE__ */ jsx(ArrowIconRoot, { className: "", children: /* @__PURE__ */ jsx(
+    Icon,
+    {
+      src: `${host_static_assets}/${environment_assets}/frontend/components/sidebar/assets/icons/ChevronRight.svg`,
+      rotationAngle: openState ? 270 : 90,
+      size: "medium"
+    }
+  ) });
+}
+const isActive = (data) => {
+  const path = window.location.pathname;
+  if (data.path === path) {
+    return true;
+  }
+  if (data.children) {
+    return data.children.some((item) => isActive(item));
+  }
+  return false;
+};
+const NavItemRoot = (props) => {
+  const theme = useTheme();
+  const { classes, dataTestId } = useTopBar$1();
+  const { itemRootData } = props;
+  const { title, children, module_id } = itemRootData;
+  const [anchorEl, setAnchorEl] = useState(null);
+  const [openedPopoverId, setOpenedPopoverId] = useState(null);
+  const handleClick = (event, popoverId) => {
+    setAnchorEl(event.currentTarget);
+    setOpenedPopoverId(popoverId);
+  };
+  const handleClose = () => {
+    setAnchorEl(null);
+    setOpenedPopoverId(null);
+  };
+  const renderMenuItems = (items) => {
+    return items.map((item, index) => /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: item.children ? item.children && item.children.length > 0 && /* @__PURE__ */ jsx(Accordion, { label: item.title, children: renderMenuItems(item.children) }) : /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: clsx(
+          classes.ItemSelect,
+          item.path === window.location.pathname ? TopBarClasses.IsActive : null
+        ),
+        ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId(componentName, "ItemSelect", dataTestId) } : {},
+        children: /* @__PURE__ */ jsx(Button, { variant: "text", href: item.path, fullWidth: true, children: item.title })
+      }
+    ) }, index));
+  };
+  const renderPopover = () => {
+    return /* @__PURE__ */ jsx(
+      Popover,
+      {
+        elevation: 3,
+        id: module_id,
+        open: openedPopoverId === itemRootData.module_id ? true : false,
+        anchorEl,
+        onClose: handleClose,
+        anchorOrigin: {
+          vertical: "bottom",
+          horizontal: "center"
+        },
+        transformOrigin: {
+          vertical: "top",
+          horizontal: "center"
+        },
+        arrowType: "top-center",
+        sx: { ...theme.components?.M4LPopoverTopBar?.styleOverrides },
+        children: /* @__PURE__ */ jsx(Grid, { container: true, spacing: 0.5, children: children && children.length > 0 && renderMenuItems(children) })
+      }
+    );
+  };
+  const render = () => {
+    if (itemRootData.children && itemRootData.path) {
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: classes.ContainerAccordionCase1,
+          ...process.env.NODE_ENV !== "production" ? {
+            [TEST_PROP_ID]: getNameDataTestId(
+              componentName,
+              "ContainerAccordionCase1",
+              dataTestId
+            )
+          } : {},
+          children: [
+            /* @__PURE__ */ jsx(Button, { size: "medium", variant: "text", href: itemRootData.path, children: title }),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "text",
+                id: module_id,
+                onClick: (e) => handleClick(e, module_id),
+                endIcon: /* @__PURE__ */ jsx(ArrowIcon, { openState: openedPopoverId === module_id ? true : false })
+              }
+            ),
+            renderPopover()
+          ]
+        }
+      );
+    }
+    if (itemRootData.children) {
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: classes.ContainerAccordion,
+          ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId(componentName, "ContainerAccordion", dataTestId) } : {},
+          children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                "aria-describedby": module_id,
+                variant: "text",
+                size: "medium",
+                onClick: (e) => handleClick(e, itemRootData.module_id),
+                endIcon: /* @__PURE__ */ jsx(ArrowIcon, { openState: openedPopoverId === module_id ? true : false }),
+                children: title
+              }
+            ),
+            renderPopover()
+          ]
+        }
+      );
+    }
+    if (itemRootData.path)
+      return /* @__PURE__ */ jsx(Button, { variant: "text", size: "medium", href: itemRootData.path, "aria-describedby": module_id, children: /* @__PURE__ */ jsx("div", { children: title }) });
+  };
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      className: clsx(
+        classes.ItemRoot,
+        isActive(itemRootData) || openedPopoverId === itemRootData.module_id ? TopBarClasses.IsActive : null
+      ),
+      ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId(componentName, "ItemRoot", dataTestId) } : {},
+      children: render()
+    }
+  );
+};
+const ConteinItem = () => {
+  const { dataMenu: DataMenu, classes, dataTestId } = useTopBar$1();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: classes.SimplebarComercial,
+      ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId(componentName, "SimplebarComercial", dataTestId) } : {},
+      children: DataMenu.map((group) => /* @__PURE__ */ jsx(NavItemRoot, { itemRootData: group }, group.module_id))
+    }
+  );
+};
+const TopBarRoot = styled("header")(({ theme }) => ({
+  ...theme.components?.M4LTopBar?.styleOverrides
+}));
+const TopBar = (props) => {
+  const { dataMenu: DataMenu, dataTestId } = props;
+  const classes = getTopBarClassesUtilityClass();
+  return /* @__PURE__ */ jsx(
+    TopBarRoot,
+    {
+      className: classes.root,
+      ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId(componentName, "root", dataTestId) } : {},
+      children: /* @__PURE__ */ jsx(TopBarProvider, { value: { dataMenu: DataMenu, classes, dataTestId }, children: /* @__PURE__ */ jsx(ConteinItem, {}) })
+    }
+  );
+};
+export {
+  TopBar as T
+};

package/components/commercial/TopBar/style.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const TopBarRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;

package/components/commercial/TopBar/type.d.ts

@@ -1,5 +1,5 @@
-import { MenuDataType } from "../HamburgerMenu";
-import { getTopBarClassesUtilityClass } from "./classes";
+import { MenuDataType } from '../HamburgerMenu';
+import { getTopBarClassesUtilityClass } from './classes';
 export interface TopBarProps {
     dataMenu: Array<MenuDataType>;
     dataTestId: string;

package/components/commercial/TopBar/utils/isActive/index.d.ts

@@ -1,4 +1,4 @@
-import { MenuDataType } from "../../../../SideBar";
+import { MenuDataType } from '../../../../SideBar';
 /**
  * @description Util que sirve para verificar si la ruta actual del navegador es igual a un data.src del array
  * @param {TopBarMenuDataType} data - Propiedades de isActive

package/components/commercial/{index.89ad149c.js → index.b90488db.js}

@@ -1,15 +1,13 @@
+import { jsxs, jsx } from "react/jsx-runtime";
 import { useState } from "react";
 import { styled } from "@mui/material/";
 import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.86c553a9.js";
 import { useEnvironment } from "@m4l/core";
-import { jsxs, jsx } from "react/jsx-runtime";
-import { S as SideBar } from "../SideBar/index.b0359a2b.js";
-import { I as IconButton } from "../mui_extended/IconButton/index.f8a3021b.js";
-const HamburgerMenuRoot = styled("header")(({
-  theme
-}) => ({
+import { S as SideBar } from "../SideBar/index.5d1f4a23.js";
+import { I as IconButton } from "../mui_extended/IconButton/index.b0ee4965.js";
+const HamburgerMenuRoot = styled("header")(({ theme }) => ({
   ...theme.components?.M4LHamburgerMenuCommercial?.styleOverrides
 }));
 const componentName = "M4LHamburgerMenuCommercial";
@@ -32,15 +30,9 @@ const getNameDataTestId = (KEY) => {
   return `${HAMBURGER_MENU_PREFIX}-${KEY}`;
 };
 const HamburgerMenu = (props) => {
-  const {
-    data,
-    itemClick
-  } = props;
+  const { data, itemClick } = props;
   const [visible, setVisible] = useState(false);
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
+  const { host_static_assets, environment_assets } = useEnvironment();
   const handlerOnVisible = () => {
     setVisible((val) => !val);
   };
@@ -49,33 +41,43 @@ const HamburgerMenu = (props) => {
       setVisible(false);
     }
   };
-  const Classes2 = useHamburgerMenuComercialUtilityClasses();
+  const classes = useHamburgerMenuComercialUtilityClasses();
   const handlerItemActive = (item) => {
     return window.location.pathname === item.path;
   };
-  return /* @__PURE__ */ jsxs(HamburgerMenuRoot, {
-    className: Classes2.root,
-    ...process.env.NODE_ENV !== "production" ? {
-      [TEST_PROP_ID]: getNameDataTestId("root")
-    } : {},
-    children: [/* @__PURE__ */ jsx(IconButton, {
-      src: `${host_static_assets}/${environment_assets}/frontend/web_comercial/menu.svg`,
-      className: Classes2.ImageLogo,
-      variant: "secondary",
-      onClick: () => handlerOnVisible()
-    }), /* @__PURE__ */ jsx(SideBar, {
-      menuData: data,
-      visible,
-      onClick: (item) => itemClick(item),
-      isItemActive: handlerItemActive,
-      onToggleCollapse: handleCollapseToggle,
-      onToggleVisible: handlerOnVisible,
-      collapsed: false,
-      companyLogoSmallUrl: "",
-      companyName: "",
-      variantStyle: "variantComercial"
-    })]
-  });
+  return /* @__PURE__ */ jsxs(
+    HamburgerMenuRoot,
+    {
+      className: classes.root,
+      ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId("root") } : {},
+      children: [
+        /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            src: `${host_static_assets}/${environment_assets}/frontend/web_comercial/menu.svg`,
+            className: classes.ImageLogo,
+            variant: "secondary",
+            onClick: () => handlerOnVisible()
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          SideBar,
+          {
+            menuData: data,
+            visible,
+            onClick: (item) => itemClick(item),
+            isItemActive: handlerItemActive,
+            onToggleCollapse: handleCollapseToggle,
+            onToggleVisible: handlerOnVisible,
+            collapsed: false,
+            companyLogoSmallUrl: "",
+            companyName: "",
+            variantStyle: "variantComercial"
+          }
+        )
+      ]
+    }
+  );
 };
 export {
   HamburgerMenu as H

package/components/formatters/BooleanFormatter/{index.9ccf9298.js → index.0c2d8e35.js}

@@ -1,50 +1,40 @@
+import { jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { useModuleDictionary, useEnvironment } from "@m4l/core";
-import { I as Icon } from "../../Icon/index.ad330e78.js";
-import { W as WrapperComponent } from "../../WrapperComponent/index.5e872594.js";
-import { F as FormatterRoot, f as formatterClasses } from "../index.03471e3f.js";
+import { I as Icon } from "../../Icon/index.ee7b85c9.js";
+import { W as WrapperComponent } from "../../WrapperComponent/index.57964195.js";
+import { F as FormatterRoot, f as formatterClasses } from "../index.b816c6b6.js";
 import clsx from "clsx";
-import { jsx } from "react/jsx-runtime";
 const BOOLEAN_FORMATTER_DICTIONARY_KEY = `boolean_formatter`;
 const LABEL_BOOLEAN_YES = `${BOOLEAN_FORMATTER_DICTIONARY_KEY}.boolean_yes`;
 const LABEL_BOOLEAN_NO = `${BOOLEAN_FORMATTER_DICTIONARY_KEY}.boolean_no`;
 const LABEL_BOOLEAN_TRUE = `${BOOLEAN_FORMATTER_DICTIONARY_KEY}.boolean_true`;
 const LABEL_BOOLEAN_FALSE = `${BOOLEAN_FORMATTER_DICTIONARY_KEY}.boolean_false`;
 function BooleanFormatter(props) {
-  const {
-    presentationType,
-    value,
-    Component = WrapperComponent
-  } = props;
-  const {
-    getLabel
-  } = useModuleDictionary();
-  const {
-    host_static_assets,
-    environment_assets
-  } = useEnvironment();
+  const { presentationType, value, Component = WrapperComponent } = 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`;
   const memoComponent = useMemo(() => {
     if (presentationType === "string_yes_no") {
-      return /* @__PURE__ */ jsx(Component, {
-        children: final_value ? getLabel(LABEL_BOOLEAN_YES) : getLabel(LABEL_BOOLEAN_NO)
-      });
+      return /* @__PURE__ */ jsx(Component, { children: final_value ? getLabel(LABEL_BOOLEAN_YES) : getLabel(LABEL_BOOLEAN_NO) });
     }
     if (presentationType === "string_true_false") {
-      return /* @__PURE__ */ jsx(Component, {
-        children: final_value ? getLabel(LABEL_BOOLEAN_TRUE) : getLabel(LABEL_BOOLEAN_FALSE)
-      });
+      return /* @__PURE__ */ jsx(Component, { children: final_value ? getLabel(LABEL_BOOLEAN_TRUE) : getLabel(LABEL_BOOLEAN_FALSE) });
     }
-    return /* @__PURE__ */ jsx(FormatterRoot, {
-      children: /* @__PURE__ */ jsx(Component, {
-        children: /* @__PURE__ */ jsx(Icon, {
-          src: final_value ? srcCheckTrue : srcCheckFalse,
-          className: clsx(formatterClasses.root, formatterClasses.booleanFormatterIcon, final_value && formatterClasses.booleanFormatterCheck)
-        })
-      })
-    });
+    return /* @__PURE__ */ jsx(FormatterRoot, { children: /* @__PURE__ */ jsx(Component, { children: /* @__PURE__ */ jsx(
+      Icon,
+      {
+        src: final_value ? srcCheckTrue : srcCheckFalse,
+        className: clsx(
+          formatterClasses.root,
+          formatterClasses.booleanFormatterIcon,
+          final_value && formatterClasses.booleanFormatterCheck
+        )
+      }
+    ) }) });
   }, [final_value]);
   return memoComponent;
 }

package/components/formatters/DateFormatter/{index.578a9f53.js → index.2ef6f261.js}

@@ -1,10 +1,8 @@
-import { useFormatter } from "@m4l/graphics";
-import { W as WrapperComponent } from "../../WrapperComponent/index.5e872594.js";
 import { jsx } from "react/jsx-runtime";
+import { useFormatter } from "@m4l/graphics";
+import { W as WrapperComponent } from "../../WrapperComponent/index.57964195.js";
 function getFormatDate(presentationType, value, format) {
-  const {
-    dateFormatter
-  } = useFormatter();
+  const { dateFormatter } = useFormatter();
   let finalFormat = format || dateFormatter.datetimeFormat;
   let result;
   let resultDate;
@@ -36,15 +34,8 @@ function getFormatDate(presentationType, value, format) {
   }
 }
 function DateFormatter(props) {
-  const {
-    presentationType,
-    value,
-    format,
-    Component = WrapperComponent
-  } = props;
-  return /* @__PURE__ */ jsx(Component, {
-    children: getFormatDate(presentationType, value, format)
-  });
+  const { presentationType, value, format, Component = WrapperComponent } = props;
+  return /* @__PURE__ */ jsx(Component, { children: getFormatDate(presentationType, value, format) });
 }
 export {
   DateFormatter as D,

package/components/formatters/FormatterRoot/styles.d.ts

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

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

@@ -1,4 +1,4 @@
-import { ReactElement } from "react";
+import { ReactElement } from 'react';
 export interface FormatterRootProps {
     children: ReactElement;
 }

package/components/formatters/PointsFormatter/{index.8a4fa393.js → index.d8a4ee54.js}

@@ -1,6 +1,6 @@
-import { evaluateWithContext } from "@m4l/core";
-import { W as WrapperComponent } from "../../WrapperComponent/index.5e872594.js";
 import { jsx } from "react/jsx-runtime";
+import { evaluateWithContext } from "@m4l/core";
+import { W as WrapperComponent } from "../../WrapperComponent/index.57964195.js";
 function getFormatPoints(obProps, fieldValue, fieldUnit, chainPoint) {
   let result = "";
   const points = evaluateWithContext(obProps, fieldValue);
@@ -16,15 +16,8 @@ function getFormatPoints(obProps, fieldValue, fieldUnit, chainPoint) {
   return result;
 }
 function PointsFormatter(props) {
-  const {
-    obProps,
-    fieldValue,
-    fieldUnit,
-    Component = WrapperComponent
-  } = props;
-  return /* @__PURE__ */ jsx(Component, {
-    children: getFormatPoints(obProps, fieldValue, fieldUnit)
-  });
+  const { obProps, fieldValue, fieldUnit, Component = WrapperComponent } = props;
+  return /* @__PURE__ */ jsx(Component, { children: getFormatPoints(obProps, fieldValue, fieldUnit) });
 }
 export {
   PointsFormatter as P,

package/components/formatters/PriceFormatter/{index.83cbe7be.js → index.97f75b4b.js}

@@ -1,7 +1,7 @@
+import { jsx } from "react/jsx-runtime";
 import { getPropertyByString } from "@m4l/core";
 import { useFormatter } from "@m4l/graphics";
-import { W as WrapperComponent } from "../../WrapperComponent/index.5e872594.js";
-import { jsx } from "react/jsx-runtime";
+import { W as WrapperComponent } from "../../WrapperComponent/index.57964195.js";
 function getFormatPrice(obProps, fieldValue, currency, decimalDigits) {
   let result = "";
   const value = getPropertyByString(obProps, fieldValue);
@@ -25,17 +25,9 @@ function getFormatPrice(obProps, fieldValue, currency, decimalDigits) {
   return result;
 }
 function PriceFormatter(props) {
-  const {
-    obProps,
-    fieldValue,
-    Component = WrapperComponent
-  } = props;
-  const {
-    currencyFormatter
-  } = useFormatter();
-  return /* @__PURE__ */ jsx(Component, {
-    children: getFormatPrice(obProps, fieldValue, currencyFormatter.code, currencyFormatter.decimalDigits)
-  });
+  const { obProps, fieldValue, Component = WrapperComponent } = props;
+  const { currencyFormatter } = useFormatter();
+  return /* @__PURE__ */ jsx(Component, { children: getFormatPrice(obProps, fieldValue, currencyFormatter.code, currencyFormatter.decimalDigits) });
 }
 export {
   PriceFormatter as P,

package/components/formatters/UncertaintyFormatter/{index.08e1b79f.js → index.c3ffdebc.js}

@@ -1,6 +1,6 @@
-import { getPropertyByString } from "@m4l/core";
-import { W as WrapperComponent } from "../../WrapperComponent/index.5e872594.js";
 import { jsx } from "react/jsx-runtime";
+import { getPropertyByString } from "@m4l/core";
+import { W as WrapperComponent } from "../../WrapperComponent/index.57964195.js";
 function getUncertaintyFormat(obProps, fieldValue, fieldSymbol, fieldUnit) {
   let result = "";
   const ranges = getPropertyByString(obProps, fieldValue);
@@ -12,21 +12,16 @@ function getUncertaintyFormat(obProps, fieldValue, fieldSymbol, fieldUnit) {
   ranges.map((obj, idx) => {
     const cmc_min_closed = obj.cmc_min_closed != true ? "<" : "\u2264";
     const cmc_max_closed = obj.cmc_max_closed != true ? "<" : "\u2264";
-    result = result.concat(`${idx > 0 ? " " : ""}`, obj.cmc_min !== obj.cmc_max ? `[${obj.cmc_min}${unit} ${cmc_min_closed} ${symbol} ${cmc_max_closed} ${obj.cmc_max}${unit} \xB1 ${obj.cmc_uncertainty}]` : `[${obj.cmc_min}${unit} \xB1 ${obj.cmc_uncertainty}]`);
+    result = result.concat(
+      `${idx > 0 ? " " : ""}`,
+      obj.cmc_min !== obj.cmc_max ? `[${obj.cmc_min}${unit} ${cmc_min_closed} ${symbol} ${cmc_max_closed} ${obj.cmc_max}${unit} \xB1 ${obj.cmc_uncertainty}]` : `[${obj.cmc_min}${unit} \xB1 ${obj.cmc_uncertainty}]`
+    );
   });
   return result;
 }
 function UncertaintyFormatter(props) {
-  const {
-    obProps,
-    fieldValue,
-    fieldSymbol,
-    fieldUnit,
-    Component = WrapperComponent
-  } = props;
-  return /* @__PURE__ */ jsx(Component, {
-    children: getUncertaintyFormat(obProps, fieldValue, fieldSymbol, fieldUnit)
-  });
+  const { obProps, fieldValue, fieldSymbol, fieldUnit, Component = WrapperComponent } = props;
+  return /* @__PURE__ */ jsx(Component, { children: getUncertaintyFormat(obProps, fieldValue, fieldSymbol, fieldUnit) });
 }
 export {
   UncertaintyFormatter as U,