@evergis/react 3.1.19 → 3.1.21

package/dist/index.js

@@ -3721,17 +3721,19 @@ const formatNumberValue = (stringFormat, value, type, noUnits = false) => {
 };
 const formatAttributeValue = ({ t, type, value, stringFormat, noUnits = false }) => {
     if (type === api.AttributeType.Point) {
-        if (!(stringFormat && stringFormat.format) || !value)
+        if (!stringFormat?.format || !value)
             return null;
         const { coordinates } = value;
         return formatPointValue({ t, stringFormat, value: coordinates });
     }
     if (type === api.AttributeType.DateTime) {
-        if (!(stringFormat && stringFormat.format) || !value)
+        if (!stringFormat?.format || !value)
             return null;
         return formatDateValue(stringFormat, value);
     }
     if (numberFormatTypes.includes(type) && !isNaN(value)) {
+        if (!stringFormat?.format)
+            return value.toString();
         return formatNumberValue(stringFormat, value, type, noUnits);
     }
     if (type === api.AttributeType.Json) {
@@ -6467,16 +6469,22 @@ const RoundedBackgroundContainer = React.memo(({ type, elementConfig, feature, r
     });
     const { options, style, children } = elementConfig || {};
     const { maxLength, center, fontColor, innerTemplateStyle, inlineUnits, big, bigIcon, hideEmpty, colorAttribute } = options || {};
+    const iconElement = children?.find(({ id }) => id === "icon");
     const aliasElement = children?.find(({ id }) => id === "alias");
     const unitsElement = children?.find(({ id }) => id === "units");
     const valueElement = children?.find(({ id }) => id === "value");
     const value = renderElement({ id: "value" });
     const color = React.useMemo(() => attributes?.find(({ name }) => name === colorAttribute)?.value || fontColor, [attributes, colorAttribute, fontColor]);
+    const renderIcon = React.useMemo(() => {
+        if (!iconElement)
+            return null;
+        return (jsxRuntime.jsx(uilibGl.FlexSpan, { width: iconElement.options?.width || "1rem", alignItems: "center", mr: "0.5rem", children: renderElement({ id: "icon", wrap: false }) }));
+    }, [iconElement, renderElement]);
     const renderAlias = React.useMemo(() => (jsxRuntime.jsx(ContainerAlias, { style: aliasElement?.style, children: jsxRuntime.jsx(TextTrim, { maxLength: maxLength || ALIAS_DEFAULT_MAX_LENGTH, children: renderElement({ id: "alias", wrap: false }) }) })), [aliasElement?.style, maxLength, renderElement]);
     const renderValue = React.useMemo(() => (jsxRuntime.jsxs(ContainerValue, { style: valueElement?.style, big: true, children: [value, !!unitsElement && (jsxRuntime.jsx(ContainerUnits, { style: unitsElement?.style, children: renderElement({ id: "units" }) }))] })), [valueElement?.style, value, unitsElement, renderElement]);
     if (!value && hideEmpty)
         return null;
-    return (jsxRuntime.jsxs(RoundedBackgroundContainerWrapper, { style: innerTemplateStyle || style, "$center": center, "$color": color, "$inlineUnits": inlineUnits, "$big": big, "$bigIcon": bigIcon, children: [jsxRuntime.jsxs(ContainerIconValue, { children: [renderElement({ id: "icon", wrap: false }), big ? renderAlias : renderValue] }), big ? renderValue : renderAlias] }));
+    return (jsxRuntime.jsxs(RoundedBackgroundContainerWrapper, { style: innerTemplateStyle || style, "$center": center, "$color": color, "$inlineUnits": inlineUnits, "$big": big, "$bigIcon": bigIcon, children: [jsxRuntime.jsxs(ContainerIconValue, { children: [renderIcon, big ? renderAlias : renderValue] }), big ? renderValue : renderAlias] }));
 });
 
 const AddFeatureContainer = React.memo(({ elementConfig }) => {
@@ -9187,6 +9195,9 @@ const Chart = React.memo(({ config, element, elementConfig, type, renderElement
     const formatTooltipValue = React.useCallback((value, name) => isRelated
         ? tooltipValueFromRelatedFeatures(t, value, relatedAttributes, data[0]?.layerInfo)
         : tooltipValueFromAttributes(t, value, name, formattedAttributes), [data, formattedAttributes, isRelated, relatedAttributes]);
+    const customYAxisLeft = React.useCallback(yAxisLeft => {
+        yAxisLeft.tickFormat((index) => index);
+    }, []);
     const customXAxisBottom = React.useCallback((xAxisBottom, data) => {
         xAxisBottom.tickFormat((index) => (showMarkers
             ? index % (showMarkers || 1) === 0
@@ -9240,12 +9251,13 @@ const Chart = React.memo(({ config, element, elementConfig, type, renderElement
             bottom: markers?.length ? 20 : markersMargin,
             left: markersMargin
         };
-        return (jsxRuntime.jsx(BarChartWrapper, { height: height + margin.bottom, children: jsxRuntime.jsx(BarChartContainer, { children: jsxRuntime.jsx(StyledBarChart, { data: barChartData, colors: getColorsFromFilterItems(data[0]?.items, defaultColor, formatFilterColor), minValue: getMinValueFromFilterItems(data[0]?.items), markers: markers, width: +width, height: height, barWidth: barWidth, barPadding: padding, className: "dashboardBarChart", customXAxisBottom: xAxisBottom => customXAxisBottom(xAxisBottom, barChartData), customYAxis: axis => !showLabels && axis.remove(), customBars: ({ bars }) => {
+        return (jsxRuntime.jsx(BarChartWrapper, { height: height + margin.bottom, children: jsxRuntime.jsx(BarChartContainer, { children: jsxRuntime.jsx(StyledBarChart, { data: barChartData, colors: getColorsFromFilterItems(data[0]?.items, defaultColor, formatFilterColor), minValue: getMinValueFromFilterItems(data[0]?.items), markers: markers, width: +width, height: height, barWidth: barWidth, barPadding: padding, customYAxisLeft: customYAxisLeft, customXAxisBottom: xAxisBottom => customXAxisBottom(xAxisBottom, barChartData), customYAxis: axis => !showLabels && axis.remove(), customBars: ({ bars }) => {
                         bars.attr("rx", radius);
                         bars.attr("ry", radius);
                     }, margin: margin, xAxisPadding: 0, yAxisPadding: 0, formatTooltipValue: formatTooltipValue, formatTooltipName: formatTooltipName, hideTooltipGroupName: true, dynamicTooltipEnable: true, isBarTooltip: true, onBarClick: filterName ? item => onFilter(item.name) : undefined }) }) }));
     }, [
         customXAxisBottom,
+        customYAxisLeft,
         element,
         isLineChart,
         isStackBar,