@m4l/components 9.1.73 → 9.1.75

package/components/DataGrid/formatters/ColumnConcatenatedValueFormatter/index.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { getPropertyByString } from "@m4l/core";
-import { C as ConcatenatedFormatter } from "../../../formatters/ConcatenatedFormatter/index.js";
+import { C as ConcatenatedFormatter } from "../../../formatters/ConcatenatedFormatter/ConcatenatedFormatter.js";
 function ColumnConcatenatedValueFormatter(props) {
   const { fieldValue, fieldSeparator, Component } = props;
   return (obProps) => {

package/components/DataGrid/formatters/ColumnDateFormatter/index.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { getPropertyByString } from "@m4l/core";
-import { D as DateFormatter } from "../../../formatters/DateFormatter/index.js";
+import { D as DateFormatter } from "../../../formatters/DateFormatter/DateFormatter.js";
 function ColumnDateFormatter(props) {
   const { fieldValue, presentationType, Component } = props;
   return (obProps) => {

package/components/ObjectLogs/index.d.ts

@@ -1,5 +1,9 @@
 import { LogsProps } from './types';
 /**
  * TODO: Documentar
+ * @author cesar - automatic
+ * @createdAt 2025-01-15 15:48:39 - automatic
+ * @updatedAt 2025-01-15 15:48:39 - automatic
+ * @updatedUser cesar - automatic
  */
 export declare function ObjectLogs(props: LogsProps): import("react/jsx-runtime").JSX.Element;

package/components/ObjectLogs/index.js

@@ -3,7 +3,7 @@ import { useState, useCallback, useMemo, useEffect } from "react";
 import { useModuleDictionary, useEnvironment, usePaginate } from "@m4l/core";
 import { C as Container, A as Actions, G as GridWrapper } from "./styles.js";
 import { D as DataGrid } from "../DataGrid/index.js";
-import { D as DateFormatter } from "../formatters/DateFormatter/index.js";
+import { D as DateFormatter } from "../formatters/DateFormatter/DateFormatter.js";
 import { D as DetailFormatter } from "./components/DetailFormatter/index.js";
 import { D as DynamicFilter } from "../DynamicFilter/DynamicFilter.js";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.js";

package/components/formatters/ConcatenatedFormatter/ConcatenatedFormatter.d.ts

@@ -0,0 +1,32 @@
+import { default as React } from 'react';
+import { ConcatenatedFormatterRootStyled } from './slots/ConcatenatedFormatterSlots';
+import { ConcatenatedFormatterProps } from './types';
+/**
+ * Concatena un arrays de strings y/o numbers. Retorna un string
+ * @param values Array de strings o numnbers a concatenar
+ * @param separator String utilizado como separador entre componentes del array
+ * @returns string
+ *  @example
+ * const data = ['10 enero','15 febrero','22 marzo']
+ *
+ * const result = getFormatConcatenated(data,' | ');
+ * console.log(result); // "10 enero | 15 febrero | 22 marzo"
+ */
+export declare function getFormatConcatenated(values: Array<string | number>, separator: string | number): string;
+/**
+ * Concatena un arrays de strings y/o numbers. Retorna un JSX
+ * @param props {values: Array<string> Valores a concatenar, separator: string Separador entre valores concatenados, Component: ElementType Componente que abraza la respuesta}
+ * @returns
+ * @example
+ * ```tsx
+ *
+ * <ConcatenatedFormatter
+ * value = {['10 enero','15 febrero','22 marzo']}
+ * separator= ' | '
+ * color='text.primary'
+ * size='medium'
+ * variant='body'
+ * />
+ * ```
+ */
+export declare function ConcatenatedFormatter<T extends React.ElementType = typeof ConcatenatedFormatterRootStyled>(props: ConcatenatedFormatterProps): JSX.Element;

package/components/formatters/ConcatenatedFormatter/ConcatenatedFormatter.js

@@ -0,0 +1,62 @@
+import { jsx, Fragment } from "react/jsx-runtime";
+import clsx from "clsx";
+import React, { useMemo } from "react";
+import { g as getPropDataTestId } from "../../../test/getNameDataTestId.js";
+import { a as getComponentSlotRoot } from "../../../utils/getComponentSlotRoot.js";
+import { C as ConcatenatedFormatterRootStyled } from "./slots/ConcatenatedFormatterSlots.js";
+import { C as CONTATENATED_FORMATTER_KEY_COMPONENT } from "./constants.js";
+import { C as ConcatenatedFormatterSlots } from "./slots/ConcatenatedFormatterEnum.js";
+import { u as useComponentSize } from "../../../hooks/useComponentSize/useComponentSize.js";
+function getFormatConcatenated(values, separator) {
+  const returnSymbol = "";
+  if (values === null) {
+    return returnSymbol;
+  }
+  if (!Array.isArray(values)) {
+    return values.toString();
+  } else {
+    if (values.length === 0) {
+      return returnSymbol;
+    } else {
+      const result = values.map((value) => {
+        if (value === null || value === void 0) {
+          return returnSymbol;
+        } else {
+          if (typeof value === "string" || typeof value === "number") {
+            return value.toString();
+          } else {
+            return returnSymbol;
+          }
+        }
+      });
+      const output = result.join(separator.toString());
+      return output.trim();
+    }
+  }
+}
+function ConcatenatedFormatter(props) {
+  const { values = [], separator = " ", Component = ConcatenatedFormatterRootStyled, color, size = "medium", dataTestid, className } = props;
+  const { currentSize } = useComponentSize(size);
+  const formatterContatenated = useMemo(
+    () => getFormatConcatenated(values, separator),
+    [values, separator]
+  );
+  if (Component === React.Fragment) {
+    return /* @__PURE__ */ jsx(Fragment, { children: formatterContatenated });
+  }
+  return /* @__PURE__ */ jsx(
+    Component,
+    {
+      color,
+      size: currentSize,
+      variant: "body",
+      className: clsx(getComponentSlotRoot(CONTATENATED_FORMATTER_KEY_COMPONENT), className),
+      ...getPropDataTestId(CONTATENATED_FORMATTER_KEY_COMPONENT, ConcatenatedFormatterSlots.root, dataTestid),
+      children: formatterContatenated
+    }
+  );
+}
+export {
+  ConcatenatedFormatter as C,
+  getFormatConcatenated as g
+};

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

@@ -0,0 +1,2 @@
+import { ConcatenatedFormatterStyles } from './types';
+export declare const concatenatedFormatterStyles: ConcatenatedFormatterStyles;

package/components/formatters/ConcatenatedFormatter/ConcatenatedFormatter.styles.js

@@ -0,0 +1,11 @@
+const concatenatedFormatterStyles = {
+  root: {
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center",
+    alignItems: "flex-start"
+  }
+};
+export {
+  concatenatedFormatterStyles as c
+};

package/components/formatters/ConcatenatedFormatter/constants.d.ts

@@ -0,0 +1 @@
+export declare const CONTATENATED_FORMATTER_KEY_COMPONENT = "M4LConcatenatedFormatter";

package/components/formatters/ConcatenatedFormatter/constants.js

@@ -0,0 +1,4 @@
+const CONTATENATED_FORMATTER_KEY_COMPONENT = "M4LConcatenatedFormatter";
+export {
+  CONTATENATED_FORMATTER_KEY_COMPONENT as C
+};

package/components/formatters/ConcatenatedFormatter/slots/ConcatenatedFormatterEnum.d.ts

@@ -0,0 +1,3 @@
+export declare enum ConcatenatedFormatterSlots {
+    root = "root"
+}

package/components/formatters/ConcatenatedFormatter/slots/ConcatenatedFormatterEnum.js

@@ -0,0 +1,7 @@
+var ConcatenatedFormatterSlots = /* @__PURE__ */ ((ConcatenatedFormatterSlots2) => {
+  ConcatenatedFormatterSlots2["root"] = "root";
+  return ConcatenatedFormatterSlots2;
+})(ConcatenatedFormatterSlots || {});
+export {
+  ConcatenatedFormatterSlots as C
+};

package/components/formatters/ConcatenatedFormatter/slots/ConcatenatedFormatterSlots.d.ts

@@ -0,0 +1 @@
+export declare const ConcatenatedFormatterRootStyled: import('@emotion/styled').StyledComponent<Pick<import('../../../mui_extended/Typography/types').TypographyProps, keyof import('../../../mui_extended/Typography/types').TypographyProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, {}, {}>;

package/components/formatters/ConcatenatedFormatter/slots/ConcatenatedFormatterSlots.js

@@ -0,0 +1,12 @@
+import { styled } from "@mui/material";
+import { T as Typography } from "../../../mui_extended/Typography/Typography.js";
+import { c as concatenatedFormatterStyles } from "../ConcatenatedFormatter.styles.js";
+import { C as CONTATENATED_FORMATTER_KEY_COMPONENT } from "../constants.js";
+import { C as ConcatenatedFormatterSlots } from "./ConcatenatedFormatterEnum.js";
+const ConcatenatedFormatterRootStyled = styled(Typography, {
+  name: CONTATENATED_FORMATTER_KEY_COMPONENT,
+  slot: ConcatenatedFormatterSlots.root
+})(concatenatedFormatterStyles.root);
+export {
+  ConcatenatedFormatterRootStyled as C
+};

package/components/formatters/ConcatenatedFormatter/test/index.test.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -1,11 +1,31 @@
 import { ElementType } from 'react';
+import { Theme } from '@mui/material';
+import { Sizes } from '@m4l/styles';
+import { M4LOverridesStyleRules } from 'src/@types/augmentations';
+import { TypographyProps } from '../../mui_extended/Typography/types';
+import { ConcatenatedFormatterSlots as Slots } from './slots/ConcatenatedFormatterEnum';
+import { CONTATENATED_FORMATTER_KEY_COMPONENT } from './constants';
 /**
  * values: Array de strings a concatenar
  * separator: String usado para concatenar el array de strings
  * Component: Tipo de componente HTML que "abraza" el resultado
  */
-export interface ConcatenatedFormatterProps {
+export interface ConcatenatedFormatterProps extends Pick<TypographyProps, 'color' | 'dataTestid' | 'className'> {
+    /**
+     * Valores de información que se usarán para concatenar al texto final.
+     */
     values: Array<string | number>;
+    /**
+     * Cadena de texto que se usa para dividir los valores de información final.
+     */
     separator?: string | number;
+    /**
+     *  Componente personalizado que puede dar la presentación del formatter
+     */
     Component?: ElementType;
+    /**
+     * Tamaño del componente.
+     */
+    size?: Extract<Sizes, 'small' | 'medium'>;
 }
+export type ConcatenatedFormatterStyles = M4LOverridesStyleRules<keyof typeof Slots, typeof CONTATENATED_FORMATTER_KEY_COMPONENT, Theme>;

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

@@ -0,0 +1,38 @@
+import { default as React } from 'react';
+import { DateFormatterProps, PresentationType } from './types';
+declare type Maybe<T> = T | undefined | null;
+/**
+ * Formatea un valor de fecha en formato UTC, a un formato legible para humanos. Retorna un string
+ * @param presentationType Fecha, fecha-hora u hora
+ * @param value Valor a convertir
+ * @param format Formato
+ * @returns string
+ * @author cesar - automatic
+ * @createdAt 2025-01-15 15:48:39 - automatic
+ * @updatedAt 2025-01-15 15:48:39 - automatic
+ * @updatedUser cesar - automatic
+ */
+export declare function useFormatDate(presentationType: PresentationType, value: Maybe<Date | string | number>, format?: string): string;
+/**
+ * DateFormatter
+ * A component for formatting date values into various presentation styles such as text or custom wrappers.
+ * @param {DateFormatterProps} props - The properties for the component.
+ * presentationType - Specifies how the date value should be represented:
+ * - `'datetime'`: Displays date and time.
+ * - `'date'`: Displays only the date.
+ * - `'time'`: Displays only the time.
+ * [value=null] - The date value to be formatted.
+ * [Component=DateFormatterRootStyled] - A custom wrapper component for the formatted output.
+ * [dataTestId] - A unique identifier for testing purposes, used as a `data-testid` attribute.
+ * [className] - A custom class name to apply to the component.
+ * @example
+ * <DateFormatter presentationType="datetime" value={new Date()} />
+ * // Renders "2024-12-06 15:57:50"
+ * @returns JSX.Element
+ * @author cesar
+ * @createdAt 2025-01-15 15:48:39 - automatic
+ * @updatedAt 2025-01-15 15:48:39 - automatic
+ * @updatedUser cesar - automatic
+ */
+export declare function DateFormatter<T extends React.ElementType>(props: DateFormatterProps<T>): import("react/jsx-runtime").JSX.Element;
+export {};

package/components/formatters/DateFormatter/DateFormatter.js

@@ -0,0 +1,73 @@
+import { jsx, Fragment } from "react/jsx-runtime";
+import React, { useMemo } from "react";
+import { useFormatter } from "@m4l/graphics";
+import { D as DateFormatterRootStyled } from "./slots/DateFormatterSlots.js";
+import { D as DateFormatterSlots } from "./slots/DateFormatterEnum.js";
+import clsx from "clsx";
+import { a as getComponentSlotRoot } from "../../../utils/getComponentSlotRoot.js";
+import { g as getPropDataTestId } from "../../../test/getNameDataTestId.js";
+import { D as DATE_FORMATTER_KEY_COMPONENT } from "./constants.js";
+function useFormatDate(presentationType, value, format) {
+  const { dateFormatter } = useFormatter();
+  let finalFormat = format || dateFormatter.datetimeFormat;
+  let result;
+  let resultDate;
+  if (value === void 0 || value === null) {
+    return "-";
+  }
+  switch (presentationType) {
+    case "datetime":
+      finalFormat = format || dateFormatter.datetimeFormat;
+      break;
+    case "date":
+      finalFormat = format || dateFormatter.dateFormat;
+      break;
+    case "time":
+      finalFormat = format || dateFormatter.timeFormat;
+      break;
+  }
+  try {
+    if (typeof value === "number" || typeof value === "string") {
+      resultDate = new Date(value);
+    } else {
+      resultDate = value;
+    }
+    result = dateFormatter.formatDate(resultDate, finalFormat);
+    return result;
+  } catch (_e) {
+    result = "-";
+    return result;
+  }
+}
+function DateFormatter(props) {
+  const {
+    presentationType,
+    value,
+    format,
+    Component = DateFormatterRootStyled,
+    dataTestId,
+    className,
+    componentProps
+  } = props;
+  const formattedDate = useFormatDate(presentationType, value, format);
+  const memoComponent = useMemo(() => {
+    return formattedDate;
+  }, [formattedDate]);
+  if (Component === React.Fragment) {
+    return /* @__PURE__ */ jsx(Fragment, { children: memoComponent });
+  }
+  return /* @__PURE__ */ jsx(
+    Component,
+    {
+      className: clsx(getComponentSlotRoot(DATE_FORMATTER_KEY_COMPONENT), className),
+      ...getPropDataTestId(DATE_FORMATTER_KEY_COMPONENT, DateFormatterSlots.root, dataTestId),
+      role: "dateFormatter-role",
+      ...componentProps,
+      children: memoComponent
+    }
+  );
+}
+export {
+  DateFormatter as D,
+  useFormatDate as u
+};

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

@@ -0,0 +1,2 @@
+import { DateFormatterStyles } from './types';
+export declare const dateFormatterStyles: DateFormatterStyles;

package/components/formatters/DateFormatter/DateFormatter.styles.js

@@ -0,0 +1,17 @@
+const dateFormatterStyles = {
+  /**
+   * Root style
+   * @author cesar - automatic
+   * @createdAt 2025-01-15 15:48:39 - automatic
+   * @updatedAt 2025-01-15 15:48:39 - automatic
+   * @updatedUser cesar - automatic
+   */
+  root: () => ({
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "flex-start"
+  })
+};
+export {
+  dateFormatterStyles as d
+};

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

@@ -0,0 +1 @@
+export declare const DATE_FORMATTER_KEY_COMPONENT = "M4LDateFormatter";

package/components/formatters/DateFormatter/constants.js

@@ -0,0 +1,4 @@
+const DATE_FORMATTER_KEY_COMPONENT = "M4LDateFormatter";
+export {
+  DATE_FORMATTER_KEY_COMPONENT as D
+};

package/components/formatters/DateFormatter/slots/DateFormatterEnum.d.ts

@@ -0,0 +1,3 @@
+export declare enum DateFormatterSlots {
+    root = "root"
+}

package/components/formatters/DateFormatter/slots/DateFormatterEnum.js

@@ -0,0 +1,7 @@
+var DateFormatterSlots = /* @__PURE__ */ ((DateFormatterSlots2) => {
+  DateFormatterSlots2["root"] = "root";
+  return DateFormatterSlots2;
+})(DateFormatterSlots || {});
+export {
+  DateFormatterSlots as D
+};

package/components/formatters/DateFormatter/slots/DateFormatterSlots.d.ts

@@ -0,0 +1 @@
+export declare const DateFormatterRootStyled: import('@emotion/styled').StyledComponent<Pick<import('../../../mui_extended/Typography/types').TypographyProps, keyof import('../../../mui_extended/Typography/types').TypographyProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown>, {}, {}>;

package/components/formatters/DateFormatter/slots/DateFormatterSlots.js

@@ -0,0 +1,12 @@
+import { styled } from "@mui/material/styles";
+import { D as DATE_FORMATTER_KEY_COMPONENT } from "../constants.js";
+import { D as DateFormatterSlots } from "./DateFormatterEnum.js";
+import { d as dateFormatterStyles } from "../DateFormatter.styles.js";
+import { T as Typography } from "../../../mui_extended/Typography/Typography.js";
+const DateFormatterRootStyled = styled(Typography, {
+  name: DATE_FORMATTER_KEY_COMPONENT,
+  slot: DateFormatterSlots.root
+})(dateFormatterStyles?.root);
+export {
+  DateFormatterRootStyled as D
+};

package/components/formatters/DateFormatter/tests/DateFormatter.test.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -1,9 +1,37 @@
 import { Maybe } from '@m4l/core';
+import { DateFormatterRootStyled } from './slots/DateFormatterSlots';
+import { DATE_FORMATTER_KEY_COMPONENT } from './constants';
+import { OverridesStyleRules } from '@mui/material/styles/overrides';
+import { Theme } from '@mui/material';
+import { DateFormatterSlots } from './slots/DateFormatterEnum';
+/**
+ * Maps to the keys in `DateFormatterSlots`, defining slot-specific styling or customization.
+ */
+export type DateFormatter = keyof typeof DateFormatterSlots;
+/**
+ * Defines the presentation type for the DateFormatter component.
+ */
 export type PresentationType = 'date' | 'datetime' | 'time';
+/**
+ * Value that can be formatted by the DateFormatter component.
+ */
 export type valueType = Date | string | number;
-export interface DateFormatterProps {
-    Component?: React.ElementType;
+export interface DateFormatterProps<T extends React.ElementType = typeof DateFormatterRootStyled> {
+    Component?: T;
     presentationType: PresentationType;
     format?: string;
     value: Maybe<Date | string | number>;
+    dataTestId?: string;
+    className?: string;
+    /**
+     * Props for the custom component.
+     */
+    componentProps?: React.ComponentPropsWithoutRef<T>;
 }
+/**
+ * Styles for customizing the `BooleanFormatter` component.
+ *
+ * This type allows partial overriding of the default styles through Material-UI's `OverridesStyleRules`.
+ * It integrates with the Material-UI `Theme` to ensure consistent theming.
+ */
+export type DateFormatterStyles = OverridesStyleRules<DateFormatter, typeof DATE_FORMATTER_KEY_COMPONENT, Theme>;

package/components/formatters/index.d.ts

@@ -1,8 +1,8 @@
 export { BooleanFormatter } from './BooleanFormatter/BooleanFormatter';
-export { useFormatDate as getFormatDate, DateFormatter } from './DateFormatter';
+export { useFormatDate as getFormatDate, DateFormatter } from './DateFormatter/DateFormatter';
 export { UncertaintyFormatter, getUncertaintyFormat } from './UncertaintyFormatter';
 export { PointsFormatter, getFormatPoints } from './PointsFormatter/PointsFormatter';
-export { getFormatConcatenated, ConcatenatedFormatter } from './ConcatenatedFormatter';
+export { getFormatConcatenated, ConcatenatedFormatter } from './ConcatenatedFormatter/ConcatenatedFormatter';
 export { useFormatPeriod, PeriodFormatter } from './PeriodFormatter/PeriodFormatter';
 export { PriceFormatter, getFormatPrice } from './PriceFormatter';
 export * from './DistanceToNowFormatter';

package/components/mui_extended/Typography/typography.styles.js

@@ -1,3 +1,4 @@
+import { g as getHeightSizeStyles } from "../../../utils/getHeightSizeStyles.js";
 import { g as getTypographyStyles } from "../../../utils/getTypographyStyles.js";
 const typographyStyles = {
   /**
@@ -5,8 +6,8 @@ const typographyStyles = {
    * Componente extendido de MUI Typography, que permite personalizar los estilos del componente.
    * @author Bruce Escobar - automatic
    * @createdAt 2024-10-22 09:41:31 - automatic
-   * @updatedAt 2025-01-08 10:36:41 - automatic
-   * @updatedUser Andrés Quintero - automatic
+   * @updatedAt 2025-01-20 10:20:09 - automatic
+   * @updatedUser cesar - automatic
    */
   root: ({ ownerState, theme }) => ({
     cursor: "default",
@@ -38,7 +39,20 @@ const typographyStyles = {
       )
     }
   }),
-  skeleton: {}
+  /**
+   * Slot: skeleton
+   * @author cesar - automatic
+   * @createdAt 2025-01-20 09:47:08 - automatic
+   * @updatedAt 2025-01-20 10:20:09 - automatic
+   * @updatedUser cesar - automatic
+   */
+  skeleton: ({ theme, ownerState }) => ({
+    ...getHeightSizeStyles(
+      theme.generalSettings.isMobile,
+      ownerState.size || "medium",
+      "base"
+    )
+  })
 };
 export {
   typographyStyles as t

package/index.js

@@ -42,10 +42,10 @@ import { R as R11 } from "./components/hook-form/RHFTextField/RHFTextField.js";
 import { R as R12 } from "./components/hook-form/RHFTextFieldPassword/RHFTextFieldPassword.js";
 import { R as R13 } from "./components/hook-form/RHFUpload/RHFUploadImage/RHFUploadImage.js";
 import { B } from "./components/formatters/BooleanFormatter/BooleanFormatter.js";
-import { D as D2, u as u4 } from "./components/formatters/DateFormatter/index.js";
+import { D as D2, u as u4 } from "./components/formatters/DateFormatter/DateFormatter.js";
 import { U, g as g7 } from "./components/formatters/UncertaintyFormatter/index.js";
 import { P as P2, g as g8 } from "./components/formatters/PointsFormatter/PointsFormatter.js";
-import { C, g as g9 } from "./components/formatters/ConcatenatedFormatter/index.js";
+import { C, g as g9 } from "./components/formatters/ConcatenatedFormatter/ConcatenatedFormatter.js";
 import { P as P3, u as u5 } from "./components/formatters/PeriodFormatter/PeriodFormatter.js";
 import { P as P4, g as g10 } from "./components/formatters/PriceFormatter/index.js";
 import { g as g11 } from "./components/formatters/DistanceToNowFormatter/dictionary.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m4l/components",
-  "version": "9.1.73",
+  "version": "9.1.75",
   "license": "UNLICENSED",
   "lint-staged": {
     "*.{js,ts,tsx}": "eslint --fix --max-warnings 0"

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

@@ -1,14 +0,0 @@
-import { ConcatenatedFormatterProps } from './types';
-/**
- * Concatena un arrays de strings y/o numbers. Retorna un string
- * @param values Array de strings o numnbers a concatenar
- * @param separator String utilizado como separador entre componentes del array
- * @returns string
- */
-export declare function getFormatConcatenated(values: Array<string | number>, separator: string | number): string;
-/**
- * Concatena un arrays de strings y/o numbers. Retorna un JSX
- * @param props {values: Array<string> Valores a concatenar, separator: string Separador entre valores concatenados, Component: ElementType Componente que abraza la respuesta}
- * @returns
- */
-export declare function ConcatenatedFormatter(props: ConcatenatedFormatterProps): JSX.Element;

package/components/formatters/ConcatenatedFormatter/index.js

@@ -1,37 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { W as WrapperComponent } from "../../WrapperComponent/index.js";
-function getFormatConcatenated(values, separator) {
-  const returnSymbol = "";
-  if (values === null) {
-    return returnSymbol;
-  }
-  if (!Array.isArray(values)) {
-    return values.toString();
-  } else {
-    if (values.length === 0) {
-      return returnSymbol;
-    } else {
-      const result = values.map((value) => {
-        if (value === null || value === void 0) {
-          return returnSymbol;
-        } else {
-          if (typeof value === "string" || typeof value === "number") {
-            return value.toString();
-          } else {
-            return returnSymbol;
-          }
-        }
-      });
-      const output = result.join(separator.toString());
-      return output.trim();
-    }
-  }
-}
-function ConcatenatedFormatter(props) {
-  const { values = [], separator = " ", Component = WrapperComponent } = props;
-  return /* @__PURE__ */ jsx(Component, { children: getFormatConcatenated(values, separator) });
-}
-export {
-  ConcatenatedFormatter as C,
-  getFormatConcatenated as g
-};

package/components/formatters/ConcatenatedFormatter/index.test.d.ts

@@ -1,4 +0,0 @@
-/**
- * @jest-environment jsdom
- */
-export {};

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

@@ -1,17 +0,0 @@
-import { DateFormatterProps, PresentationType } from './types';
-declare type Maybe<T> = T | undefined | null;
-/**
- * Formatea un valor de fecha en formato UTC, a un formato legible para humanos. Retorna un string
- * @param presentationType Fecha, fecha-hora u hora
- * @param value Valor a convertir
- * @param format Formato
- * @returns string
- */
-export declare function useFormatDate(presentationType: PresentationType, value: Maybe<Date | string | number>, format?: string): string;
-/**
- * Formatea un valor de fecha en formato UTC, a un formato legible para humanos. Retorna un JSX
- * @param props DateFormatterProps
- * @returns
- */
-export declare function DateFormatter(props: DateFormatterProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/components/formatters/DateFormatter/index.js

@@ -1,43 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { useFormatter } from "@m4l/graphics";
-import { W as WrapperComponent } from "../../WrapperComponent/index.js";
-function useFormatDate(presentationType, value, format) {
-  const { dateFormatter } = useFormatter();
-  let finalFormat = format || dateFormatter.datetimeFormat;
-  let result;
-  let resultDate;
-  if (value === void 0 || value === null) {
-    return "-";
-  }
-  switch (presentationType) {
-    case "datetime":
-      finalFormat = format || dateFormatter.datetimeFormat;
-      break;
-    case "date":
-      finalFormat = format || dateFormatter.dateFormat;
-      break;
-    case "time":
-      finalFormat = format || dateFormatter.timeFormat;
-      break;
-  }
-  try {
-    if (typeof value === "number" || typeof value === "string") {
-      resultDate = new Date(value);
-    } else {
-      resultDate = value;
-    }
-    result = dateFormatter.formatDate(resultDate, finalFormat);
-    return result;
-  } catch (_e) {
-    result = "-";
-    return result;
-  }
-}
-function DateFormatter(props) {
-  const { presentationType, value, format, Component = WrapperComponent } = props;
-  return /* @__PURE__ */ jsx(Component, { children: useFormatDate(presentationType, value, format) });
-}
-export {
-  DateFormatter as D,
-  useFormatDate as u
-};