@m4l/components 7.0.0 → 7.1.2

package/components/PrintingSystem/subcomponents/PaperNode/index.js

@@ -0,0 +1,30 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useBase, evaluateWithContext } from "@m4l/core";
+import { c as classes } from "../../classes/index.js";
+import clsx from "clsx";
+const PaperNode = (props) => {
+  const { children, style = {}, className = "", title, titleSecondary } = props;
+  const { mainColor } = useBase();
+  const { sourceData } = useBase();
+  const titleFormated = evaluateWithContext(sourceData, title);
+  const titleSecondaryFormated = evaluateWithContext(sourceData, titleSecondary || "");
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: clsx(classes.paperNodeRoot, className),
+      style: {
+        ...style
+      },
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: classes.paperNodeContainerTitles, children: [
+          /* @__PURE__ */ jsx("div", { className: classes.paperNodeTitle, children: titleFormated }),
+          titleSecondary ? /* @__PURE__ */ jsx("div", { className: classes.paperNodeTitleSecondary, style: { color: mainColor }, children: titleSecondaryFormated }) : null
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: classes.paperNodeContent, children })
+      ]
+    }
+  );
+};
+export {
+  PaperNode as P
+};

package/components/PrintingSystem/subcomponents/PropertyValueNode/index.d.ts

@@ -1,2 +1,5 @@
 import { PropertyValueNodeProps } from './types';
+/**
+ * TODO: Documentar
+ */
 export declare const PropertyValueNode: (props: PropertyValueNodeProps) => import("react/jsx-runtime").JSX.Element;

package/components/PrintingSystem/subcomponents/PropertyValueNode/index.js

@@ -0,0 +1,48 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useBase, evaluateWithContext } from "@m4l/core";
+import { c as classes } from "../../classes/index.js";
+import { g as getSize } from "../../utils/getSize/index.js";
+import clsx from "clsx";
+const PropertyValueNode = (props) => {
+  const {
+    style = {},
+    className = "",
+    property,
+    children,
+    direction,
+    propertyWidth = "auto"
+  } = props;
+  const { unitSize, mainColor, sourceData } = useBase();
+  const propertyFormated = evaluateWithContext(sourceData, property);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: clsx(
+        classes.propertyValueNodeRoot,
+        direction === "column" ? classes.propertyValueNodeHorizontal : classes.propertyValueNodeVertical,
+        className
+      ),
+      style: {
+        ...style
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: classes.propertyValueNodeTitle,
+            style: {
+              width: getSize(propertyWidth, unitSize),
+              minWidth: getSize(propertyWidth, unitSize),
+              borderColor: mainColor
+            },
+            children: propertyFormated
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: classes.propertyValueNodeContent, children })
+      ]
+    }
+  );
+};
+export {
+  PropertyValueNode as P
+};

package/components/PrintingSystem/subcomponents/QRImageNode/index.d.ts

@@ -1,2 +1,5 @@
 import { QRImageNodeProps } from './types';
+/**
+ * TODO: Documentar
+ */
 export declare const QRImageNode: (props: QRImageNodeProps) => import("react/jsx-runtime").JSX.Element;

package/components/PrintingSystem/subcomponents/QRImageNode/index.js

@@ -0,0 +1,33 @@
+import { jsx } from "react/jsx-runtime";
+import { useBase } from "@m4l/core";
+import QRCode from "qrcode.react";
+const convertToPx = (size, magnitud) => {
+  if (isNaN(size)) {
+    return 0;
+  }
+  if (magnitud === "px") {
+    return size;
+  }
+  switch (magnitud) {
+    case "cm":
+      return size * 37.8;
+    case "mm":
+      return size * 3.78;
+    case "in":
+      return size * 96;
+    case "pt":
+      return size * 1.33;
+    case "pc":
+      return size * 16;
+    default:
+      return 100;
+  }
+};
+const QRImageNode = (props) => {
+  const { url, size = 8, color } = props;
+  const { unitSize } = useBase();
+  return /* @__PURE__ */ jsx(QRCode, { value: url, size: convertToPx(size, unitSize), fgColor: color, renderAs: "canvas" });
+};
+export {
+  QRImageNode as Q
+};

package/components/PrintingSystem/subcomponents/QRImageNode/types.d.ts

@@ -1,2 +1,2 @@
 import { QRImageNode } from '../../types';
-export declare type QRImageNodeProps = QRImageNode;
+export type QRImageNodeProps = QRImageNode;

package/components/PrintingSystem/subcomponents/SectionNode/index.d.ts

@@ -1,2 +1,5 @@
 import { SectionNodeProps } from './types';
+/**
+ * TODO: Documentar
+ */
 export declare const SectionNode: (props: SectionNodeProps) => import("react/jsx-runtime").JSX.Element;

package/components/PrintingSystem/subcomponents/SectionNode/index.js

@@ -0,0 +1,50 @@
+import { jsx } from "react/jsx-runtime";
+import { useBase } from "@m4l/core";
+import { c as classes } from "../../classes/index.js";
+import clsx from "clsx";
+import { g as getSize } from "../../utils/getSize/index.js";
+const SectionNode = (props) => {
+  const {
+    children,
+    className,
+    direction = "row",
+    gap = "unset",
+    style,
+    width = "auto",
+    height = "auto",
+    paddingTop = "unset",
+    paddingRight = "unset",
+    paddingBottom = "unset",
+    paddingLeft = "unset",
+    alignX = "unset",
+    alignY = "unset",
+    grow = false
+  } = props;
+  const { unitSize } = useBase();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: clsx(classes.sectionNodeRoot, className),
+      style: {
+        flexDirection: direction,
+        gap: getSize(gap, unitSize),
+        width: getSize(width, unitSize),
+        height: getSize(height, unitSize),
+        minWidth: getSize(width, unitSize),
+        minHeight: getSize(height, unitSize),
+        paddingTop: getSize(paddingTop, unitSize),
+        paddingRight: getSize(paddingRight, unitSize),
+        paddingBottom: getSize(paddingBottom, unitSize),
+        paddingLeft: getSize(paddingLeft, unitSize),
+        justifyContent: direction === "row" ? alignX : alignY,
+        alignItems: direction === "row" ? alignY : alignX,
+        flex: grow ? 1 : "unset",
+        ...style
+      },
+      children
+    }
+  );
+};
+export {
+  SectionNode as S
+};

package/components/PrintingSystem/subcomponents/SectionNode/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { SectionNode } from '../../types';
 export interface SectionNodeProps extends Omit<SectionNode, 'children'> {
     children?: React.ReactNode;

package/components/PrintingSystem/subcomponents/TextBoxNode/index.d.ts

@@ -1,2 +1,5 @@
 import { TextBoxNodeProps } from './types';
+/**
+ * TODO: Documentar
+ */
 export declare const TextBoxNode: (props: TextBoxNodeProps) => import("react/jsx-runtime").JSX.Element;

package/components/PrintingSystem/subcomponents/TextBoxNode/index.js

@@ -0,0 +1,24 @@
+import { jsx } from "react/jsx-runtime";
+import { useBase, evaluateWithContext } from "@m4l/core";
+import { c as classes } from "../../classes/index.js";
+import clsx from "clsx";
+const TextBoxNode = (props) => {
+  const { variant = "body", style, className, textAlign = "start", children } = props;
+  const { sourceData } = useBase();
+  const textFormated = evaluateWithContext(sourceData, children[1]);
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: clsx(
+        classes.textBoxNodeRoot,
+        className,
+        `${classes.textBoxNodeVariant}-${variant}`
+      ),
+      style: { textAlign, ...style },
+      children: textFormated
+    }
+  );
+};
+export {
+  TextBoxNode as T
+};

package/components/PrintingSystem/subcomponents/TextBoxNode/types.d.ts

@@ -1,2 +1,2 @@
 import { TextBoxNode } from '../../types';
-export declare type TextBoxNodeProps = TextBoxNode;
+export type TextBoxNodeProps = TextBoxNode;

package/components/PrintingSystem/types.d.ts

@@ -1,6 +1,3 @@
-/**
- * NodeType: Se usa para definir el nombre de todos los posibles componentes.
- */
 import { M4LTypographyVariants } from '@m4l/styles';
 import { CSSProperties, ReactNode } from 'react';
 import { PageNodeProps } from './subcomponents/PageNode/types';
@@ -25,11 +22,11 @@ export interface BaseProviderPrintSystem {
 /**
  * Direction: Propiedad para la dirección de contenidos
  */
-declare type Direction = 'column' | 'row';
+type Direction = 'column' | 'row';
 /**
  * Align: Propiedades de alineación de contenidos
  */
-declare type Align = 'start' | 'center' | 'end' | 'space-between' | 'space-around' | 'space-evenly';
+type Align = 'start' | 'center' | 'end' | 'space-between' | 'space-around' | 'space-evenly';
 export interface NodeTypeCollection {
     page: () => ReactNode;
     section: () => ReactNode;
@@ -166,7 +163,7 @@ export interface PropertyValue extends Omit<BaseNode, 'children'> {
     children: string | NodePrintPropertyValue[];
     direction: Direction;
 }
-export declare type NodePrintPropertyValue = SectionNode | TextBoxNode | ImageNode | FooterNode | PaperNode | DividerNode | GridNode | ChartNode | PagerNode | QRImageNode;
+export type NodePrintPropertyValue = SectionNode | TextBoxNode | ImageNode | FooterNode | PaperNode | DividerNode | GridNode | ChartNode | PagerNode | QRImageNode;
 /**
  * DividerNode: Componente que aporta una división gráfica.
  */
@@ -210,8 +207,8 @@ export interface ChartNode extends Omit<BaseNode, 'children'> {
     messageX: string;
     messageY: string;
 }
-export declare type NodePrint = SectionNode | TextBoxNode | ImageNode | HeaderNode | BodyNode | FooterNode | PaperNode | PropertyValue | DividerNode | GridNode | ChartNode | PagerNode | QRImageNode;
-export declare type NodePrintComponent = ((props: PageNodeProps) => React.JSX.Element) | ((props: SectionNodeProps) => React.JSX.Element) | ((props: HeaderNodeProps) => React.JSX.Element) | ((props: BodyNodeProps) => React.JSX.Element) | ((props: FooterNodeProps) => React.JSX.Element) | ((props: PaperNodeProps) => React.JSX.Element) | ((props: PropertyValueNodeProps) => React.JSX.Element) | ((props: GridNodeProps) => React.JSX.Element) | ((props: ChartNodeProps) => React.JSX.Element);
+export type NodePrint = SectionNode | TextBoxNode | ImageNode | HeaderNode | BodyNode | FooterNode | PaperNode | PropertyValue | DividerNode | GridNode | ChartNode | PagerNode | QRImageNode;
+export type NodePrintComponent = ((props: PageNodeProps) => React.JSX.Element) | ((props: SectionNodeProps) => React.JSX.Element) | ((props: HeaderNodeProps) => React.JSX.Element) | ((props: BodyNodeProps) => React.JSX.Element) | ((props: FooterNodeProps) => React.JSX.Element) | ((props: PaperNodeProps) => React.JSX.Element) | ((props: PropertyValueNodeProps) => React.JSX.Element) | ((props: GridNodeProps) => React.JSX.Element) | ((props: ChartNodeProps) => React.JSX.Element);
 export interface PrintingSystemProps {
     templateData: RootNode;
     sourceData: any;

package/components/PrintingSystem/utils/FactoryRender/index.d.ts

@@ -1,2 +1,5 @@
 import { FactoryRenderProps } from './types';
+/**
+ * TODO: Documentar
+ */
 export declare const FactoryRender: (props: FactoryRenderProps) => import("react/jsx-runtime").JSX.Element;

package/components/PrintingSystem/utils/FactoryRender/index.js

@@ -0,0 +1,54 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { D as DividerNode } from "../../subcomponents/DividerNode/index.js";
+import { S as SectionNode } from "../../subcomponents/SectionNode/index.js";
+import { T as TextBoxNode } from "../../subcomponents/TextBoxNode/index.js";
+import { H as HeaderNode } from "../../subcomponents/HeaderNode/index.js";
+import { I as ImageNode } from "../../subcomponents/ImageNode/index.js";
+import { B as BodyNode } from "../../subcomponents/BodyNode/index.js";
+import { F as FooterNode } from "../../subcomponents/FooterNode/index.js";
+import { P as PaperNode } from "../../subcomponents/PaperNode/index.js";
+import { P as PropertyValueNode } from "../../subcomponents/PropertyValueNode/index.js";
+import { G as GridNode } from "../../subcomponents/GridNode/index.js";
+import { C as ChartNode } from "../../subcomponents/ChartNode/index.js";
+import { P as PagerNode } from "../../subcomponents/Pager/index.js";
+import { Q as QRImageNode } from "../../subcomponents/QRImageNode/index.js";
+import { useBase, evaluateWithContext } from "@m4l/core";
+const FactoryRender = (props) => {
+  const { data: parent } = props;
+  const { children, ...otherProps } = parent || {};
+  const { sourceData } = useBase();
+  const strategiesComponents = {
+    section: SectionNode,
+    textBox: TextBoxNode,
+    divider: DividerNode,
+    image: ImageNode,
+    header: HeaderNode,
+    body: BodyNode,
+    footer: FooterNode,
+    paper: PaperNode,
+    propertyValue: PropertyValueNode,
+    grid: GridNode,
+    chart: ChartNode,
+    pager: PagerNode,
+    qrImage: QRImageNode,
+    __default__: () => {
+      throw new Error("Type no defined");
+    }
+  };
+  const Component = strategiesComponents[parent.type] ?? strategiesComponents.__default__;
+  return /* @__PURE__ */ jsxs(Component, { ...otherProps, children: [
+    Array.isArray(children) && children.length > 0 ? children.map((subComponent, _id) => {
+      return /* @__PURE__ */ jsx(
+        FactoryRender,
+        {
+          data: subComponent
+        },
+        `${subComponent.key}-${Math.random().toString(36).substring(7)}`
+      );
+    }) : null,
+    typeof children === "string" ? evaluateWithContext(sourceData, children) : null
+  ] });
+};
+export {
+  FactoryRender as F
+};

package/components/PrintingSystem/utils/PageRender/index.d.ts

@@ -1,2 +1,9 @@
 import { PageRenderProps } from './types';
+/**
+ * TODO: Documentar
+ * @author Juan Escobar - automatic
+ * @createdAt 2024-10-07 16:10:36 - automatic
+ * @updatedAt 2024-10-07 16:10:37 - automatic
+ * @updatedUser Juan Escobar - automatic
+ */
 export declare const PageRender: (props: PageRenderProps) => import("react/jsx-runtime").JSX.Element;

package/components/PrintingSystem/utils/PageRender/index.js

@@ -0,0 +1,47 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { P as PageNode } from "../../subcomponents/PageNode/index.js";
+import { BaseProvider } from "@m4l/core";
+import React from "react";
+import { F as FactoryRender } from "../FactoryRender/index.js";
+const PageRender = (props) => {
+  const {
+    data: parent,
+    id,
+    unitSize,
+    mainColor,
+    countPages,
+    HeaderGeneral,
+    FooterGeneral,
+    sourceData,
+    templateData
+  } = props;
+  const { children, ...otherProps } = parent || {};
+  return /* @__PURE__ */ jsx(
+    BaseProvider,
+    {
+      value: {
+        pageId: id,
+        unitSize,
+        mainColor,
+        countPages,
+        HeaderGeneral,
+        FooterGeneral,
+        templateData,
+        sourceData
+      },
+      children: /* @__PURE__ */ jsxs(PageNode, { ...otherProps, children: [
+        Array.isArray(children) && children.length > 0 ? children.map((subComponent, index) => {
+          return /* @__PURE__ */ jsxs(React.Fragment, { children: [
+            index === 0 && parent.type === "page" && children[0].type !== "header" ? HeaderGeneral ? /* @__PURE__ */ jsx(HeaderGeneral, { ancestor: parent }, `${parent.key}-header`) : null : null,
+            /* @__PURE__ */ jsx(FactoryRender, { data: subComponent }, `${parent.type}-${subComponent.key}`),
+            index === children.length - 1 && parent.type === "page" && children[children.length - 1].type !== "footer" ? FooterGeneral ? /* @__PURE__ */ jsx(FooterGeneral, { ancestor: parent }, `${parent.key}-footer`) : null : null
+          ] }, `fragment-page-${index}`);
+        }) : null,
+        typeof children === "string" ? children : null
+      ] })
+    }
+  );
+};
+export {
+  PageRender as P
+};

package/components/PrintingSystem/utils/PageRender/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { PageNode, RootNode } from '../../types';
 export interface PageRenderProps {
     data: PageNode;

package/components/PrintingSystem/utils/getEvalValue/index.d.ts

@@ -0,0 +1,4 @@
+/**
+ * TODO: Documentar
+ */
+export declare const getEvalValue: (sourceData: any, key: string) => string | Array<any>;

package/components/PrintingSystem/utils/getSize/index.d.ts

@@ -1 +1,4 @@
+/**
+ * TODO: Documentar
+ */
 export declare const getSize: (value: number | string, unitSize: string) => string;

package/components/PrintingSystem/utils/getSize/index.js

@@ -0,0 +1,10 @@
+const getSize = (value, unitSize) => {
+  if (typeof value === "number") {
+    return `${value}${unitSize}`;
+  } else {
+    return value;
+  }
+};
+export {
+  getSize as g
+};

package/components/PropertyValue/PropertyValue.d.ts

@@ -1,2 +1,5 @@
-import type { PropertyValueProps } from './types';
+import { PropertyValueProps } from './types';
+/**
+ * TODO: Documentar
+ */
 export declare function PropertyValue(props: PropertyValueProps): import("react/jsx-runtime").JSX.Element;

package/components/PropertyValue/PropertyValue.js

@@ -0,0 +1,201 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { P as PropertyValueRoot } from "./styles.js";
+import { useResponsiveDesktop } from "@m4l/graphics";
+import { p as propertyValueUtilityClasses } from "./classes/index.js";
+import clsx from "clsx";
+import { T as TEST_PROP_ID } from "../../test/constants_no_mock.js";
+import { T as TEST_PROPS_DATA, C as COMPONENT_PREFIX } from "./constants.js";
+import { g as getNameDataTestId } from "../../test/getNameDataTestId.js";
+import { L as Label } from "../Label/Label.js";
+import { I as Icon } from "../Icon/Icon.js";
+function PropertyValue(props) {
+  const {
+    property,
+    iconProperty,
+    value,
+    propertyWidth = 200,
+    valueHeight = "auto",
+    valueWidth = "100",
+    valueWidthMobile,
+    isForm,
+    className,
+    dataTestId = "",
+    disabled = false,
+    mandatory,
+    mandatoryMessage,
+    helperMessage
+  } = props;
+  const isDesktop = useResponsiveDesktop();
+  const getValueW = () => {
+    if (valueWidthMobile && !isDesktop) {
+      return valueWidthMobile;
+    }
+    if (valueWidth === 75 && isDesktop) {
+      return 75;
+    } else if (valueWidth === 75 && !isDesktop) {
+      return 100;
+    }
+    if (valueWidth === 50 && isDesktop) {
+      return 50;
+    } else if (valueWidth === 50 && !isDesktop) {
+      return 100;
+    }
+    if (valueWidth === 25 && isDesktop || valueWidth === 12.5 && isDesktop) {
+      return valueWidth;
+    }
+    if (valueWidth === 25 && !isDesktop) {
+      return 50;
+    }
+    if (valueWidth === 12.5 && !isDesktop) {
+      return 25;
+    }
+    return 100;
+  };
+  const ownerState = {
+    disabled: isForm && disabled ? disabled : false,
+    isForm: isForm ? true : false,
+    isMobile: !isDesktop
+  };
+  const classes = propertyValueUtilityClasses(ownerState);
+  if (!isForm) {
+    return /* @__PURE__ */ jsxs(
+      PropertyValueRoot,
+      {
+        className: clsx(classes.root, className),
+        style: {
+          gridTemplateColumns: propertyWidth ? `${propertyWidth}px 1fr` : "150px 1fr"
+        },
+        ...process.env.NODE_ENV !== "production" ? {
+          [TEST_PROPS_DATA]: JSON.stringify([
+            { property: property ? true : false, value: value ? true : false }
+          ]),
+          [TEST_PROP_ID]: getNameDataTestId(
+            COMPONENT_PREFIX,
+            "root",
+            dataTestId
+          )
+        } : {},
+        children: [
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: classes.property,
+              style: {
+                width: propertyWidth && isDesktop ? propertyWidth : "150px",
+                minWidth: propertyWidth && isDesktop ? propertyWidth : "150px"
+              },
+              ...process.env.NODE_ENV !== "production" ? {
+                [TEST_PROP_ID]: getNameDataTestId(
+                  COMPONENT_PREFIX,
+                  "property",
+                  dataTestId
+                )
+              } : {},
+              children: [
+                iconProperty ? /* @__PURE__ */ jsx(Icon, { src: iconProperty, className: classes.iconProperty }) : null,
+                /* @__PURE__ */ jsx(
+                  Label,
+                  {
+                    label: property,
+                    mandatory,
+                    mandatoryMessage,
+                    helperMessage
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: classes.value,
+              style: {
+                width: `${getValueW()}%`,
+                maxWidth: `${getValueW()}%`,
+                height: valueHeight
+              },
+              ...process.env.NODE_ENV !== "production" ? {
+                [TEST_PROP_ID]: getNameDataTestId(
+                  COMPONENT_PREFIX,
+                  "value",
+                  dataTestId
+                )
+              } : {},
+              children: value
+            }
+          )
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    PropertyValueRoot,
+    {
+      className: clsx(classes.root, className),
+      style: { gridTemplateColumns: propertyWidth ? `${propertyWidth}px 1fr` : "150px 1fr" },
+      ...process.env.NODE_ENV !== "production" ? {
+        [TEST_PROPS_DATA]: JSON.stringify([
+          { property: property ? true : false, value: value ? true : false }
+        ]),
+        [TEST_PROP_ID]: getNameDataTestId(
+          COMPONENT_PREFIX,
+          "root",
+          dataTestId
+        )
+      } : {},
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: clsx(classes.root, className),
+            style: { width: propertyWidth ? `${propertyWidth}px 1fr` : "150px 1fr" },
+            ...process.env.NODE_ENV !== "production" ? {
+              [TEST_PROPS_DATA]: JSON.stringify([
+                { property: property ? true : false, value: value ? true : false }
+              ]),
+              [TEST_PROP_ID]: getNameDataTestId(
+                COMPONENT_PREFIX,
+                "root",
+                dataTestId
+              )
+            } : {},
+            children: [
+              iconProperty ? /* @__PURE__ */ jsx(Icon, { src: iconProperty, className: classes.iconProperty }) : null,
+              /* @__PURE__ */ jsx(
+                Label,
+                {
+                  label: property,
+                  mandatory,
+                  mandatoryMessage,
+                  helperMessage
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: classes.value,
+            style: {
+              width: `${getValueW()}%`,
+              maxWidth: `${getValueW()}%`,
+              height: valueHeight
+            },
+            ...process.env.NODE_ENV !== "production" ? {
+              [TEST_PROP_ID]: getNameDataTestId(
+                COMPONENT_PREFIX,
+                "value",
+                dataTestId
+              )
+            } : {},
+            children: value
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  PropertyValue as P
+};

package/components/PropertyValue/classes/constants.js

@@ -0,0 +1,4 @@
+const componentName = "M4LPropertyValue";
+export {
+  componentName as c
+};

package/components/PropertyValue/classes/index.d.ts

@@ -2,9 +2,12 @@ import { PropertyValueClassesType } from './types';
 import { OwnerState } from '../types';
 export declare const propertyValueClasses: PropertyValueClassesType;
 export declare function getPropertyValueUtilityClass(slot: string): string;
+/**
+ * TODO: Documentar
+ */
 export declare const propertyValueUtilityClasses: (ownerState: OwnerState) => {
-    value: string;
     root: string;
+    value: string;
     property: string;
     iconProperty: string;
 };