@m4l/components 9.2.44 → 9.2.45
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/DataGrid/formatters/ColumnBooleanFormatter/formatter.d.ts +1 -1
- package/components/DataGrid/formatters/ColumnBooleanFormatter/formatter.js +2 -1
- package/components/DataGrid/formatters/ColumnBooleanFormatter/types.d.ts +3 -2
- package/components/DataGrid/formatters/ColumnBooleanFormatter/useColumnBoolean.d.ts +2 -3
- package/components/DataGrid/formatters/ColumnChipStatusFormatter/formatter.js +3 -2
- package/components/DataGrid/formatters/ColumnConcatenatedValuesFormatter/formatter.d.ts +2 -4
- package/components/DataGrid/formatters/ColumnConcatenatedValuesFormatter/formatter.js +2 -1
- package/components/DataGrid/formatters/ColumnConcatenatedValuesFormatter/types.d.ts +3 -2
- package/components/DataGrid/formatters/ColumnConcatenatedValuesFormatter/useColumnConcatenatedValues.d.ts +1 -1
- package/components/DataGrid/formatters/ColumnDateFormatter/formatter.d.ts +2 -2
- package/components/DataGrid/formatters/ColumnDateFormatter/formatter.js +2 -1
- package/components/DataGrid/formatters/ColumnDateFormatter/types.d.ts +3 -2
- package/components/DataGrid/formatters/ColumnDateFormatter/useColumnDate.d.ts +5 -5
- package/components/DataGrid/formatters/ColumnIconFormatter/formatter.d.ts +1 -1
- package/components/DataGrid/formatters/ColumnNestedValueFormatter/formatter.d.ts +2 -2
- package/components/DataGrid/formatters/ColumnNestedValueFormatter/formatter.js +2 -2
- package/components/DataGrid/formatters/ColumnNestedValueFormatter/types.d.ts +3 -2
- package/components/DataGrid/formatters/ColumnNestedValueFormatter/useColumnNestedValue.d.ts +4 -4
- package/components/DataGrid/formatters/ColumnNestedValueFormatter/useColumnNestedValue.js +1 -3
- package/components/DataGrid/formatters/ColumnPointsFormatter/formatter.d.ts +2 -2
- package/components/DataGrid/formatters/ColumnPointsFormatter/formatter.js +4 -1
- package/components/DataGrid/formatters/ColumnPointsFormatter/types.d.ts +4 -3
- package/components/DataGrid/formatters/ColumnPointsFormatter/useColumnPoints.d.ts +3 -3
- package/components/DataGrid/formatters/ColumnPriceFormatter/formatter.d.ts +2 -2
- package/components/DataGrid/formatters/ColumnPriceFormatter/formatter.js +3 -1
- package/components/DataGrid/formatters/ColumnPriceFormatter/types.d.ts +3 -2
- package/components/DataGrid/formatters/ColumnPriceFormatter/useColumnPrice.d.ts +3 -3
- package/components/DataGrid/formatters/ColumnPriceFormatter/useColumnPrice.js +2 -2
- package/components/DataGrid/formatters/ColumnSetCheckFormatter/types.d.ts +2 -1
- package/components/DataGrid/formatters/ColumnSetCheckFormatter/useColumnSetCheck.d.ts +2 -2
- package/components/DataGrid/formatters/ColumnUncertaintyFormatter/formatter.d.ts +2 -2
- package/components/DataGrid/formatters/ColumnUncertaintyFormatter/formatter.js +5 -1
- package/components/DataGrid/formatters/ColumnUncertaintyFormatter/types.d.ts +5 -4
- package/components/DataGrid/formatters/ColumnUncertaintyFormatter/useColumnUncertainty.d.ts +3 -4
- package/components/formatters/UncertaintyFormatter/UncertaintyFormatter.d.ts +6 -6
- package/components/formatters/UncertaintyFormatter/UncertaintyFormatter.js +3 -3
- package/components/formatters/UncertaintyFormatter/types.d.ts +5 -5
- package/helpers/getFieldValueWithRow.d.ts +4 -0
- package/helpers/getFieldValueWithRow.js +10 -0
- package/package.json +1 -1
- package/storybook/components/DataGrid/helpers/types.d.ts +10 -9
- package/storybook/components/DataGrid/helpers/useColumns.d.ts +1 -1
- package/utils/types.d.ts +7 -0
|
@@ -2,4 +2,4 @@ import { ColumnBooleanFormatterProps } from './types';
|
|
|
2
2
|
/**
|
|
3
3
|
* Función para formatear un booleano en una columna de un DataGrid
|
|
4
4
|
*/
|
|
5
|
-
export declare function ColumnBooleanFormatter(props: ColumnBooleanFormatterProps): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export declare function ColumnBooleanFormatter<TRow>(props: ColumnBooleanFormatterProps<TRow>): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { getPropertyByString } from "@m4l/core";
|
|
3
3
|
import React from "react";
|
|
4
|
+
import { g as getFieldValueWithRow } from "../../../../helpers/getFieldValueWithRow.js";
|
|
4
5
|
import { B as BooleanFormatter } from "../../../formatters/BooleanFormatter/BooleanFormatter.js";
|
|
5
6
|
function ColumnBooleanFormatter(props) {
|
|
6
7
|
const { fieldValue, presentationType, Component = React.Fragment } = props;
|
|
7
8
|
return (obProps) => {
|
|
8
|
-
const valueMaybeString = getPropertyByString(obProps, fieldValue);
|
|
9
|
+
const valueMaybeString = getPropertyByString(obProps, getFieldValueWithRow(fieldValue));
|
|
9
10
|
let fixedValue;
|
|
10
11
|
if (typeof valueMaybeString === "boolean") {
|
|
11
12
|
fixedValue = valueMaybeString;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
+
import { DeepKeyOf } from '../../../../utils/types';
|
|
1
2
|
import { PresentationType } from '../../../formatters/BooleanFormatter/types';
|
|
2
|
-
export interface ColumnBooleanFormatterProps {
|
|
3
|
+
export interface ColumnBooleanFormatterProps<TRow> {
|
|
3
4
|
Component?: React.ElementType;
|
|
4
5
|
presentationType: PresentationType;
|
|
5
|
-
fieldValue:
|
|
6
|
+
fieldValue: DeepKeyOf<TRow>;
|
|
6
7
|
opacity?: boolean;
|
|
7
8
|
}
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import { ColumnBooleanFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
4
|
-
* el formatter de la columna, el filtro y el customSort
|
|
3
|
+
* Hook function that return the formatter, filter and customSort for a boolean column
|
|
5
4
|
*/
|
|
6
|
-
export declare const useColumnBoolean: <TRow>(props: ColumnBooleanFormatterProps) => {
|
|
5
|
+
export declare const useColumnBoolean: <TRow>(props: ColumnBooleanFormatterProps<TRow>) => {
|
|
7
6
|
formatter: (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
8
7
|
customFilter: (row: TRow, value: string) => boolean;
|
|
9
8
|
customSort: (a: TRow, b: TRow) => 0 | 1 | -1;
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { getPropertyByString } from "@m4l/core";
|
|
3
|
+
import { g as getFieldValueWithRow } from "../../../../helpers/getFieldValueWithRow.js";
|
|
3
4
|
import { C as ChipStatusFormatterColumnWrapperStyled } from "../../../formatters/ChipStatusFormatter/slots/ChipStatusFormatterSlots.js";
|
|
4
5
|
import { C as ChipStatusFormatter } from "../../../formatters/ChipStatusFormatter/ChipStatusFormatter.js";
|
|
5
6
|
const ColumnChipStatusFormatter = (props) => {
|
|
6
7
|
const { uriStatus, uriLabel, statusesColors, fallbackColor } = props;
|
|
7
8
|
return (obProps) => {
|
|
8
|
-
const
|
|
9
|
-
const
|
|
9
|
+
const label = typeof uriLabel === "string" ? getPropertyByString(obProps, getFieldValueWithRow(uriStatus.toString())) : uriLabel(obProps, uriStatus);
|
|
10
|
+
const status = getPropertyByString(obProps, getFieldValueWithRow(uriStatus.toString()));
|
|
10
11
|
return /* @__PURE__ */ jsx(
|
|
11
12
|
ChipStatusFormatter,
|
|
12
13
|
{
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
import { ColumnConcatenatedValuesFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
4
|
-
* @param props
|
|
5
|
-
* @returns
|
|
3
|
+
* Function to DataGrid that concatenates an array of strings
|
|
6
4
|
*/
|
|
7
|
-
export declare function ColumnConcatenatedValuesFormatter(props: ColumnConcatenatedValuesFormatterProps): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export declare function ColumnConcatenatedValuesFormatter<TRow>(props: ColumnConcatenatedValuesFormatterProps<TRow>): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { getPropertyByString } from "@m4l/core";
|
|
3
3
|
import React from "react";
|
|
4
|
+
import { g as getFieldValueWithRow } from "../../../../helpers/getFieldValueWithRow.js";
|
|
4
5
|
import { C as ConcatenatedFormatter } from "../../../formatters/ConcatenatedFormatter/ConcatenatedFormatter.js";
|
|
5
6
|
function ColumnConcatenatedValuesFormatter(props) {
|
|
6
7
|
const { fieldValue, fieldSeparator, Component = React.Fragment } = props;
|
|
7
8
|
return (obProps) => {
|
|
8
9
|
const values = fieldValue.map((element) => {
|
|
9
|
-
const valueMaybeString = getPropertyByString(obProps, element);
|
|
10
|
+
const valueMaybeString = getPropertyByString(obProps, getFieldValueWithRow(element));
|
|
10
11
|
let fixedValue;
|
|
11
12
|
if (typeof valueMaybeString === "string" || typeof valueMaybeString === "number") {
|
|
12
13
|
fixedValue = valueMaybeString.toString();
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { ElementType } from 'react';
|
|
2
|
-
|
|
2
|
+
import { DeepKeyOf } from '../../../../utils/types';
|
|
3
|
+
export interface ColumnConcatenatedValuesFormatterProps<TRow> {
|
|
3
4
|
Component?: ElementType;
|
|
4
|
-
fieldValue:
|
|
5
|
+
fieldValue: DeepKeyOf<TRow>[];
|
|
5
6
|
fieldSeparator: string;
|
|
6
7
|
}
|
|
@@ -2,7 +2,7 @@ import { ColumnConcatenatedValuesFormatterProps } from './types';
|
|
|
2
2
|
/**
|
|
3
3
|
* Funcion helper que retorna el formatter, filter y customSort de la columna concatenada.
|
|
4
4
|
*/
|
|
5
|
-
export declare const useColumnConcatenatedValues: <TRow>(props: ColumnConcatenatedValuesFormatterProps) => {
|
|
5
|
+
export declare const useColumnConcatenatedValues: <TRow>(props: ColumnConcatenatedValuesFormatterProps<TRow>) => {
|
|
6
6
|
formatter: (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
customFilter: (row: TRow, value: string) => boolean;
|
|
8
8
|
customSort: (a: TRow, b: TRow) => 0 | 1 | -1;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ColumnDateFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
3
|
+
* Function to format a date in a column of a DataGrid
|
|
4
4
|
*/
|
|
5
|
-
export declare function ColumnDateFormatter(props: ColumnDateFormatterProps): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export declare function ColumnDateFormatter<TRow>(props: ColumnDateFormatterProps<TRow>): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { getPropertyByString } from "@m4l/core";
|
|
3
3
|
import React from "react";
|
|
4
|
+
import { g as getFieldValueWithRow } from "../../../../helpers/getFieldValueWithRow.js";
|
|
4
5
|
import { D as DateFormatter } from "../../../formatters/DateFormatter/DateFormatter.js";
|
|
5
6
|
function ColumnDateFormatter(props) {
|
|
6
7
|
const { fieldValue, presentationType, Component = React.Fragment } = props;
|
|
7
8
|
return (obProps) => {
|
|
8
|
-
const valueMaybeDateStringNumber = getPropertyByString(obProps, fieldValue);
|
|
9
|
+
const valueMaybeDateStringNumber = getPropertyByString(obProps, getFieldValueWithRow(fieldValue));
|
|
9
10
|
let fixedValue;
|
|
10
11
|
if (typeof valueMaybeDateStringNumber === "string" || typeof valueMaybeDateStringNumber === "number" || valueMaybeDateStringNumber instanceof Date) {
|
|
11
12
|
fixedValue = valueMaybeDateStringNumber;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { PresentationType } from '../../../formatters/DateFormatter/types';
|
|
2
|
-
|
|
2
|
+
import { DeepKeyOf } from '../../../../utils/types';
|
|
3
|
+
export interface ColumnDateFormatterProps<TRow> {
|
|
3
4
|
Component?: React.ElementType;
|
|
4
5
|
presentationType: PresentationType;
|
|
5
6
|
format?: string;
|
|
6
|
-
fieldValue:
|
|
7
|
+
fieldValue: DeepKeyOf<TRow>;
|
|
7
8
|
}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { ColumnDateFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
3
|
+
* Function to filter by date in a column
|
|
4
4
|
*/
|
|
5
|
-
export declare const useCustomDateFilter: <TRow>(props: ColumnDateFormatterProps) => (row: TRow, value: string) => boolean;
|
|
5
|
+
export declare const useCustomDateFilter: <TRow>(props: ColumnDateFormatterProps<TRow>) => (row: TRow, value: string) => boolean;
|
|
6
6
|
/**
|
|
7
|
-
*
|
|
8
|
-
* customFilter
|
|
7
|
+
* Function helper that returns the formatter,
|
|
8
|
+
* customFilter and customSort of a date column
|
|
9
9
|
*/
|
|
10
|
-
export declare const useColumnDate: <TRow>(props: ColumnDateFormatterProps) => {
|
|
10
|
+
export declare const useColumnDate: <TRow>(props: ColumnDateFormatterProps<TRow>) => {
|
|
11
11
|
formatter: (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
12
12
|
customFilter: (row: TRow, value: string) => boolean;
|
|
13
13
|
customSort: (a: TRow, b: TRow) => 0 | 1 | -1;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ColumnIconFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
3
|
+
* Function to format an icon in a column of a DataGrid
|
|
4
4
|
*/
|
|
5
5
|
export declare function ColumnIconFormatter(props: ColumnIconFormatterProps): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ColumnNestedValueFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
3
|
+
* Function to format a nested value in a column of a DataGrid
|
|
4
4
|
*/
|
|
5
|
-
export declare function ColumnNestedValueFormatter(props: ColumnNestedValueFormatterProps): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export declare function ColumnNestedValueFormatter<TRow>(props: ColumnNestedValueFormatterProps<TRow>): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { getPropertyByString } from "@m4l/core";
|
|
3
3
|
import React from "react";
|
|
4
|
-
import { g as
|
|
4
|
+
import { g as getFieldValueWithRow } from "../../../../helpers/getFieldValueWithRow.js";
|
|
5
5
|
function ColumnNestedValueFormatter(props) {
|
|
6
6
|
const { fieldValue, Component = React.Fragment } = props;
|
|
7
7
|
return (obProps) => {
|
|
8
|
-
const property =
|
|
8
|
+
const property = getPropertyByString(obProps, getFieldValueWithRow(fieldValue));
|
|
9
9
|
const value = typeof property === "object" ? JSON.stringify(property) : property;
|
|
10
10
|
return /* @__PURE__ */ jsx(Component, { children: value });
|
|
11
11
|
};
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { ColumnNestedValueFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
4
|
-
*
|
|
3
|
+
* Function that return the formatter, customFilter and customSort
|
|
4
|
+
* of the column for ColumnNestedValueFormatter.
|
|
5
5
|
*/
|
|
6
|
-
export declare const useColumnNestedValue: <TRow>(props: ColumnNestedValueFormatterProps) => {
|
|
6
|
+
export declare const useColumnNestedValue: <TRow>(props: ColumnNestedValueFormatterProps<TRow>) => {
|
|
7
7
|
formatter: (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
-
customFilter: (row: TRow, value: string) =>
|
|
8
|
+
customFilter: (row: TRow, value: string) => boolean;
|
|
9
9
|
customSort: (a: TRow, b: TRow) => 0 | 1 | -1;
|
|
10
10
|
};
|
|
@@ -3,11 +3,9 @@ import { useState, useRef, useEffect, useMemo } from "react";
|
|
|
3
3
|
import { deepEqual } from "fast-equals";
|
|
4
4
|
import { g as getColumnKey } from "../../helpers/getColumnKey.js";
|
|
5
5
|
import { C as ColumnNestedValueFormatter } from "./formatter.js";
|
|
6
|
-
import { g as getNullGuard } from "../../../../utils/getNullGuard.js";
|
|
7
6
|
const getCustomNestedValueFilter = (props) => {
|
|
8
7
|
return (row, value) => {
|
|
9
|
-
const
|
|
10
|
-
const property = getNullGuard(getPropertyByString(row, keyWiouthRow));
|
|
8
|
+
const property = getPropertyByString(row, props.fieldValue) ?? "";
|
|
11
9
|
if (typeof property === "object") {
|
|
12
10
|
return Object.values(property).includes(value);
|
|
13
11
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ColumnPointsFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
3
|
+
* Formatter for column points in DataGrid
|
|
4
4
|
*/
|
|
5
|
-
export declare function ColumnPointsFormatter(props: ColumnPointsFormatterProps): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export declare function ColumnPointsFormatter<TRow>(props: ColumnPointsFormatterProps<TRow>): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,10 +1,13 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import React from "react";
|
|
3
3
|
import { P as PointsFormatter } from "../../../formatters/PointsFormatter/PointsFormatter.js";
|
|
4
|
+
import { g as getFieldValueWithRow } from "../../../../helpers/getFieldValueWithRow.js";
|
|
4
5
|
function ColumnPointsFormatter(props) {
|
|
5
6
|
const { Component = React.Fragment } = props;
|
|
7
|
+
const fieldValue = getFieldValueWithRow(props.fieldValue);
|
|
8
|
+
const fieldUnit = getFieldValueWithRow(props.fieldUnit);
|
|
6
9
|
return (obProps) => {
|
|
7
|
-
return /* @__PURE__ */ jsx(PointsFormatter, { obProps, ...props, Component });
|
|
10
|
+
return /* @__PURE__ */ jsx(PointsFormatter, { obProps, ...props, fieldValue, fieldUnit, Component });
|
|
8
11
|
};
|
|
9
12
|
}
|
|
10
13
|
export {
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
|
|
1
|
+
import { DeepKeyOf } from '../../../../utils/types';
|
|
2
|
+
export interface ColumnPointsFormatterProps<TRow> {
|
|
2
3
|
Component?: React.ElementType;
|
|
3
|
-
fieldValue:
|
|
4
|
-
fieldUnit:
|
|
4
|
+
fieldValue: DeepKeyOf<TRow>;
|
|
5
|
+
fieldUnit: DeepKeyOf<TRow>;
|
|
5
6
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { ColumnPointsFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
4
|
-
* customFilter
|
|
3
|
+
* Function to use the points of calibration in a column of a DataGrid,
|
|
4
|
+
* return formatter, customFilter and customSort.
|
|
5
5
|
*/
|
|
6
|
-
export declare const useColumnPoints: <TRow>(props: ColumnPointsFormatterProps) => {
|
|
6
|
+
export declare const useColumnPoints: <TRow>(props: ColumnPointsFormatterProps<TRow>) => {
|
|
7
7
|
formatter: (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
8
8
|
customFilter: (row: TRow, value: string) => boolean;
|
|
9
9
|
customSort: (a: TRow, b: TRow) => 0 | 1 | -1;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ColumnPriceFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
3
|
+
* Formatter for column price in DataGrid
|
|
4
4
|
*/
|
|
5
|
-
export declare function ColumnPriceFormatter(props: ColumnPriceFormatterProps): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export declare function ColumnPriceFormatter<TRow>(props: ColumnPriceFormatterProps<TRow>): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import React from "react";
|
|
3
3
|
import { P as PriceFormatter } from "../../../formatters/PriceFormatter/PriceFormatter.js";
|
|
4
|
+
import { g as getFieldValueWithRow } from "../../../../helpers/getFieldValueWithRow.js";
|
|
4
5
|
function ColumnPriceFormatter(props) {
|
|
5
6
|
const { Component = React.Fragment } = props;
|
|
7
|
+
const fieldValue = getFieldValueWithRow(props.fieldValue);
|
|
6
8
|
return (obProps) => {
|
|
7
|
-
return /* @__PURE__ */ jsx(PriceFormatter, { obProps, ...props, Component });
|
|
9
|
+
return /* @__PURE__ */ jsx(PriceFormatter, { obProps, ...props, fieldValue, Component });
|
|
8
10
|
};
|
|
9
11
|
}
|
|
10
12
|
export {
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { ColumnPriceFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
4
|
-
* customFilter
|
|
3
|
+
* Helper function to use the price column formatter.
|
|
4
|
+
* Returns formatter, customFilter and customSort.
|
|
5
5
|
*/
|
|
6
|
-
export declare const useColumnPrice: <TRow>(props: ColumnPriceFormatterProps) => {
|
|
6
|
+
export declare const useColumnPrice: <TRow>(props: ColumnPriceFormatterProps<TRow>) => {
|
|
7
7
|
formatter: (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
8
8
|
customFilter: (row: TRow, value: string) => boolean;
|
|
9
9
|
customSort: (a: TRow, b: TRow) => 0 | 1 | -1;
|
|
@@ -5,7 +5,7 @@ import { deepEqual } from "fast-equals";
|
|
|
5
5
|
import { g as getFormatPrice } from "../../../formatters/PriceFormatter/PriceFormatter.js";
|
|
6
6
|
import { g as getColumnKey } from "../../helpers/getColumnKey.js";
|
|
7
7
|
import { C as ColumnPriceFormatter } from "./formatter.js";
|
|
8
|
-
const
|
|
8
|
+
const getCustomPriceFilter = (props) => {
|
|
9
9
|
const { currencyFormatter } = useFormatter();
|
|
10
10
|
const customFilter = useCallback((row, value) => {
|
|
11
11
|
const fieldValue = getColumnKey(props.fieldValue);
|
|
@@ -42,7 +42,7 @@ const getCustomPriceSort = (props) => {
|
|
|
42
42
|
const useColumnPrice = (props) => {
|
|
43
43
|
const [stateProps, setStateProps] = useState(props);
|
|
44
44
|
const refProps = useRef({ ...props });
|
|
45
|
-
const customFilter =
|
|
45
|
+
const customFilter = getCustomPriceFilter(stateProps);
|
|
46
46
|
useEffect(() => {
|
|
47
47
|
if (!deepEqual(refProps.current, props)) {
|
|
48
48
|
refProps.current = props;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { RowKey } from '../../types';
|
|
2
|
+
import { DeepKeyOf } from '../../../../utils/types';
|
|
2
3
|
export type ColumnSetCheckFormatterProps<Row, TKey extends RowKey = RowKey> = {
|
|
3
|
-
field:
|
|
4
|
+
field: DeepKeyOf<Row>;
|
|
4
5
|
disabledGetter?: (row: Row) => boolean;
|
|
5
6
|
rowKeyGetter: (row: Row) => TKey;
|
|
6
7
|
useHook: (field: string) => [ReadonlySet<TKey>, (newHas: ReadonlySet<TKey>) => void];
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { RowKey } from '../../types';
|
|
2
2
|
import { ColumnSetCheckFormatterProps } from './types';
|
|
3
3
|
/**
|
|
4
|
-
*
|
|
5
|
-
*
|
|
4
|
+
* Helper function to use the set check column formatter.
|
|
5
|
+
* Returns formatter, customFilter and customSort.
|
|
6
6
|
*/
|
|
7
7
|
export declare const useColumnSetCheck: <TRow, TKey extends RowKey = RowKey>(props: ColumnSetCheckFormatterProps<TRow, TKey>) => {
|
|
8
8
|
formatter: (props: import('react-data-grid').FormatterProps<TRow, unknown>) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ColumnUncertaintyFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
3
|
+
* Formatter for column uncertainty in DataGrid
|
|
4
4
|
*/
|
|
5
|
-
export declare function ColumnUncertaintyFormatter(props: ColumnUncertaintyFormatterProps): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export declare function ColumnUncertaintyFormatter<TRow>(props: ColumnUncertaintyFormatterProps<TRow>): (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,10 +1,14 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import React from "react";
|
|
3
|
+
import { g as getFieldValueWithRow } from "../../../../helpers/getFieldValueWithRow.js";
|
|
3
4
|
import { U as UncertaintyFormatter } from "../../../formatters/UncertaintyFormatter/UncertaintyFormatter.js";
|
|
4
5
|
function ColumnUncertaintyFormatter(props) {
|
|
5
6
|
const { Component = React.Fragment } = props;
|
|
7
|
+
const fieldValue = getFieldValueWithRow(props.fieldValue);
|
|
8
|
+
const fieldSymbol = getFieldValueWithRow(props.fieldSymbol);
|
|
9
|
+
const fieldUnit = getFieldValueWithRow(props.fieldUnit);
|
|
6
10
|
return (obProps) => {
|
|
7
|
-
return /* @__PURE__ */ jsx(UncertaintyFormatter, { obProps, ...props, Component });
|
|
11
|
+
return /* @__PURE__ */ jsx(UncertaintyFormatter, { obProps, ...props, fieldValue, fieldSymbol, fieldUnit, Component });
|
|
8
12
|
};
|
|
9
13
|
}
|
|
10
14
|
export {
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
import { DeepKeyOf } from '../../../../utils/types';
|
|
2
|
+
export interface ColumnUncertaintyFormatterProps<TRow> {
|
|
2
3
|
Component?: React.ElementType;
|
|
3
|
-
fieldValue:
|
|
4
|
-
fieldUnit:
|
|
5
|
-
fieldSymbol:
|
|
4
|
+
fieldValue: DeepKeyOf<TRow>;
|
|
5
|
+
fieldUnit: DeepKeyOf<TRow>;
|
|
6
|
+
fieldSymbol: DeepKeyOf<TRow>;
|
|
6
7
|
}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { ColumnUncertaintyFormatterProps } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
4
|
-
*
|
|
5
|
-
* de incertidumbre.
|
|
3
|
+
* Function helper that returns the formatter,
|
|
4
|
+
* the filter and the customSort of the uncertainty column.
|
|
6
5
|
*/
|
|
7
|
-
export declare const useColumnUncertanity: <TRow>(props: ColumnUncertaintyFormatterProps) => {
|
|
6
|
+
export declare const useColumnUncertanity: <TRow>(props: ColumnUncertaintyFormatterProps<TRow>) => {
|
|
8
7
|
formatter: (obProps: any) => import("react/jsx-runtime").JSX.Element;
|
|
9
8
|
customFilter: (row: TRow, value: string) => boolean;
|
|
10
9
|
customSort: (a: TRow, b: TRow) => 0 | 1 | -1;
|
|
@@ -11,7 +11,7 @@ import { UncertaintyFormatterRootStyled } from './slots/UncertaintyFormatterSlot
|
|
|
11
11
|
* @example
|
|
12
12
|
* const obProps = {
|
|
13
13
|
* ranges: [
|
|
14
|
-
* {
|
|
14
|
+
* { cmcMin: -20, cmcMax: 0.0, cmcMinClosed: true, cmcMaxClosed: false, cmcUncertainty: 0.5 },
|
|
15
15
|
* ],
|
|
16
16
|
* symbol: 'T',
|
|
17
17
|
* unit: '°C'
|
|
@@ -29,11 +29,11 @@ export declare function getUncertaintyFormat(obProps: any, fieldValue: string, f
|
|
|
29
29
|
*
|
|
30
30
|
* const ObjFormatter = {
|
|
31
31
|
* ranges: [
|
|
32
|
-
* {
|
|
33
|
-
*
|
|
34
|
-
*
|
|
35
|
-
*
|
|
36
|
-
*
|
|
32
|
+
* { cmcMin: -20,
|
|
33
|
+
* cmcMax: 0.0,
|
|
34
|
+
* cmcMinClosed: true,
|
|
35
|
+
* cmcMaxClosed: false,
|
|
36
|
+
* cmcUncertainty: 0.5 },
|
|
37
37
|
* ],
|
|
38
38
|
* symbol: 'T',
|
|
39
39
|
* unit: '°C',
|
|
@@ -17,11 +17,11 @@ function getUncertaintyFormat(obProps, fieldValue, fieldSymbol, fieldUnit) {
|
|
|
17
17
|
return "[]";
|
|
18
18
|
}
|
|
19
19
|
ranges.map((obj, idx) => {
|
|
20
|
-
const
|
|
21
|
-
const
|
|
20
|
+
const cmcMinClosed = obj.cmcMinClosed !== true ? "<" : "≤";
|
|
21
|
+
const cmcMaxClosed = obj.cmcMaxClosed !== true ? "<" : "≤";
|
|
22
22
|
result = result.concat(
|
|
23
23
|
`${idx > 0 ? " " : ""}`,
|
|
24
|
-
obj.
|
|
24
|
+
obj.cmcMin !== obj.cmcMax ? `[${obj.cmcMin}${unit} ${cmcMinClosed} ${symbol} ${cmcMaxClosed} ${obj.cmcMax}${unit} ± ${obj.cmcUncertainty}]` : `[${obj.cmcMin}${unit} ± ${obj.cmcUncertainty}]`
|
|
25
25
|
);
|
|
26
26
|
});
|
|
27
27
|
return result;
|
|
@@ -11,23 +11,23 @@ export interface UncertaintyRange {
|
|
|
11
11
|
/**
|
|
12
12
|
* Indica si el límite inferior está cerrado (≤) o abierto (<).
|
|
13
13
|
*/
|
|
14
|
-
|
|
14
|
+
cmcMinClosed: boolean;
|
|
15
15
|
/**
|
|
16
16
|
* Valor mínimo del rango.
|
|
17
17
|
*/
|
|
18
|
-
|
|
18
|
+
cmcMin: number;
|
|
19
19
|
/**
|
|
20
20
|
* Indica si el límite superior está cerrado (≤) o abierto (<).
|
|
21
21
|
*/
|
|
22
|
-
|
|
22
|
+
cmcMaxClosed: boolean;
|
|
23
23
|
/**
|
|
24
24
|
* Valor máximo del rango.
|
|
25
25
|
*/
|
|
26
|
-
|
|
26
|
+
cmcMax: number;
|
|
27
27
|
/**
|
|
28
28
|
* Incertidumbre asociada al rango.
|
|
29
29
|
*/
|
|
30
|
-
|
|
30
|
+
cmcUncertainty: number;
|
|
31
31
|
}
|
|
32
32
|
export interface UncertaintyFormatterProps extends Pick<TypographyProps, 'color' | 'dataTestid' | 'className'> {
|
|
33
33
|
/**
|
package/package.json
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { HeaderRendererProps } from 'react-data-grid';
|
|
2
2
|
import { ChipStatusFormatterProps } from '../../../../src/components/formatters/ChipStatusFormatter/types';
|
|
3
|
+
import { DeepKeyOf } from '../../../../src/utils/types';
|
|
3
4
|
export interface SeedProps {
|
|
4
5
|
quantity: number;
|
|
5
6
|
withBoolean?: boolean;
|
|
@@ -28,7 +29,7 @@ export interface RowType {
|
|
|
28
29
|
email: string;
|
|
29
30
|
phone: string;
|
|
30
31
|
};
|
|
31
|
-
|
|
32
|
+
createdAt?: Date;
|
|
32
33
|
icon?: string;
|
|
33
34
|
interactiveCheck?: any;
|
|
34
35
|
nestedValue?: any;
|
|
@@ -36,7 +37,7 @@ export interface RowType {
|
|
|
36
37
|
unit?: string;
|
|
37
38
|
price?: number;
|
|
38
39
|
uncertainty?: {
|
|
39
|
-
ranges:
|
|
40
|
+
ranges: RangesUncertainty[];
|
|
40
41
|
symbol: string;
|
|
41
42
|
unit: string;
|
|
42
43
|
};
|
|
@@ -47,15 +48,15 @@ export interface RowType {
|
|
|
47
48
|
currentStatus: ChipStatusFormatterProps['status'];
|
|
48
49
|
};
|
|
49
50
|
}
|
|
50
|
-
interface
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
51
|
+
interface RangesUncertainty {
|
|
52
|
+
cmcMin: number;
|
|
53
|
+
cmcMax: number;
|
|
54
|
+
cmcMinClosed: boolean;
|
|
55
|
+
cmcMaxClosed: boolean;
|
|
56
|
+
cmcUncertainty: number;
|
|
56
57
|
}
|
|
57
58
|
export interface Column<TRow, TSummaryRow> {
|
|
58
|
-
key: string;
|
|
59
|
+
key: DeepKeyOf<TRow> | string;
|
|
59
60
|
name: string;
|
|
60
61
|
type: ColumnType;
|
|
61
62
|
formatter?: (props: any) => JSX.Element;
|
|
@@ -4,4 +4,4 @@ import { GetColumnsProps, RowType, Column } from './types';
|
|
|
4
4
|
* Función que retorna las columnas para el DataGrid de Storybook
|
|
5
5
|
* ****************************************************************
|
|
6
6
|
*/
|
|
7
|
-
export declare const useColumnsSeed:
|
|
7
|
+
export declare const useColumnsSeed: (props: GetColumnsProps) => readonly Column<RowType, unknown>[];
|
package/utils/types.d.ts
CHANGED
|
@@ -21,3 +21,10 @@ export type OptionalPosition = {
|
|
|
21
21
|
x?: number;
|
|
22
22
|
y?: number;
|
|
23
23
|
};
|
|
24
|
+
/**
|
|
25
|
+
* fieldValue with generic that allow to use nested attributes from a interface or object
|
|
26
|
+
* example: 'fieldValue' = 'object.field1.field2'
|
|
27
|
+
*/
|
|
28
|
+
export type DeepKeyOf<TRow> = TRow extends object ? {
|
|
29
|
+
[Key in keyof TRow & string]: NonNullable<TRow[Key]> extends object ? Key | `${Key}.${DeepKeyOf<NonNullable<TRow[Key]>>}` : Key;
|
|
30
|
+
}[keyof TRow & string] : never;
|