@evergis/react 4.0.36 → 4.0.38

package/dist/components/Dashboard/headers/FeatureCardIconHeader/styled.d.ts

@@ -1,3 +1,4 @@
+export declare const LayerIconClickable: import('styled-components').StyledComponent<"div", any, {}, never>;
 export declare const HeaderIcon: import('styled-components').StyledComponent<"div", any, import('@evergis/uilib-gl').FlexProps, never>;
 export declare const IconHeaderWrapper: import('styled-components').StyledComponent<"div", any, {
     $fontColor?: string;

package/dist/hooks/index.d.ts

@@ -1,4 +1,5 @@
 export * from './map';
+export * from './project';
 export * from './serverNotifications';
 export * from './task';
 export * from './useAppHeight';

package/dist/hooks/project/index.d.ts

@@ -0,0 +1,5 @@
+export * from './useMaxZoomTo';
+export * from './useCustomFeatureSelect';
+export * from './useCurrentPageLayers';
+export * from './useLayerHiddenAttributes';
+export * from './useVisibleProjectItems';

package/dist/hooks/project/useCurrentPageLayers.d.ts

@@ -0,0 +1 @@
+export declare const useCurrentPageLayers: () => import('../..').ConfigLayer[];

package/dist/hooks/project/useCustomFeatureSelect.d.ts

@@ -0,0 +1,2 @@
+import { CustomFeatureSelect } from '../../components/Dashboard/types';
+export declare const useCustomFeatureSelect: () => ((layerName?: string) => [CustomFeatureSelect | undefined, CustomFeatureSelect | undefined]);

package/dist/hooks/project/useLayerHiddenAttributes.d.ts

@@ -0,0 +1 @@
+export declare const useLayerHiddenAttributes: (layerName: string) => [string[], (updatedAttributes: string[]) => void];

package/dist/hooks/project/useMaxZoomTo.d.ts

@@ -0,0 +1 @@
+export declare const useMaxZoomTo: () => ((layerName?: string) => [number | undefined, number | undefined]);

package/dist/hooks/project/useVisibleProjectItems.d.ts

@@ -0,0 +1 @@
+export declare const useVisibleProjectItems: (applyMinMaxScale?: boolean) => import('../..').ConfigLayer[];

package/dist/index.js

@@ -9,9 +9,9 @@ var api = require('@evergis/api');
 var Gradient = require('javascript-color-gradient');
 var color$1 = require('@evergis/color');
 var dateFns = require('date-fns');
+var lodash = require('lodash');
 var ru = require('date-fns/locale/ru');
 var enUS = require('date-fns/locale/en-US');
-var lodash = require('lodash');
 var signalr = require('@microsoft/signalr');
 var findAnd = require('find-and');
 var jspdf = require('jspdf');
@@ -3829,15 +3829,16 @@ const formatNumberValue = (stringFormat, value, type, noUnits = false) => {
     return currentValue?.toString() || "";
 };
 const formatAttributeValue = ({ t, type, value, stringFormat, noUnits = false }) => {
+    const isNilValue = lodash.isNil(value);
     if (type === api.AttributeType.Point) {
-        if (!stringFormat?.format || !value) {
+        if (!stringFormat?.format || isNilValue) {
             return null;
         }
         const { coordinates } = value;
         return formatPointValue({ t, stringFormat, value: coordinates });
     }
     if (type === api.AttributeType.DateTime) {
-        if (!stringFormat?.format || !value)
+        if (!stringFormat?.format || isNilValue)
             return null;
         return formatDateValue(stringFormat, value);
     }
@@ -3858,12 +3859,12 @@ const formatAttributeValue = ({ t, type, value, stringFormat, noUnits = false })
         return formatNumberValue(stringFormat, value, type, noUnits);
     }
     if (type === api.AttributeType.Json) {
-        if (!value || value?.length === 0) {
+        if (isNilValue || value?.length === 0) {
             return "";
         }
         return `${t("total", { ns: "table" })} ${value.length}`;
     }
-    return value ? value.toString() : "";
+    return !isNilValue ? value.toString() : "";
 };
 const formatNumber = (number) => {
     let result = "";
@@ -5386,6 +5387,70 @@ const useLayerParams = (layer) => {
     return layerParams;
 };
 
+const useMaxZoomTo = () => {
+    const { currentPage } = useWidgetPage();
+    return React.useCallback((layerName) => {
+        if (!layerName) {
+            return [currentPage?.options?.maxZoomTo, undefined];
+        }
+        return [currentPage?.options?.maxZoomTo, currentPage?.layers?.find(item => item.name === layerName)?.maxZoomTo];
+    }, [currentPage?.layers, currentPage?.options?.maxZoomTo]);
+};
+
+const useCustomFeatureSelect = () => {
+    const { currentPage } = useWidgetPage();
+    return React.useCallback((layerName) => {
+        if (!layerName) {
+            return [currentPage?.options?.customFeatureSelect, undefined];
+        }
+        return [
+            currentPage?.options?.customFeatureSelect,
+            currentPage?.layers?.find(item => item.name === layerName)?.customFeatureSelect,
+        ];
+    }, [currentPage?.layers, currentPage?.options?.customFeatureSelect]);
+};
+
+const useCurrentPageLayers = () => {
+    const { currentPage } = useWidgetPage();
+    return React.useMemo(() => currentPage?.layers || [], [currentPage?.layers]);
+};
+
+const useLayerHiddenAttributes = (layerName) => {
+    const { currentPage, updateConfigPage } = useWidgetPage();
+    const layerHiddenAttributes = React.useMemo(() => {
+        return currentPage?.layers?.find(item => item.name === layerName)?.hiddenAttributes ?? [];
+    }, [currentPage?.layers, layerName]);
+    const updateLayerHiddenAttributes = React.useCallback((updatedHiddenAttributes) => {
+        updateConfigPage({
+            ...currentPage,
+            layers: currentPage?.layers?.map(item => {
+                return item.name === layerName
+                    ? {
+                        ...item,
+                        hiddenAttributes: updatedHiddenAttributes,
+                    }
+                    : item;
+            }),
+        });
+    }, [currentPage, layerName, updateConfigPage]);
+    return [layerHiddenAttributes, updateLayerHiddenAttributes];
+};
+
+const useVisibleProjectItems = (applyMinMaxScale) => {
+    const { map } = useMapContext();
+    const projectItems = useCurrentPageLayers();
+    const zoomChange = React.useMemo(() => (applyMinMaxScale && map.current?.getZoom() !== undefined ? Math.round(map.current?.getZoom()) : undefined), [applyMinMaxScale, map.current?.getZoom()]);
+    return React.useMemo(() => {
+        if (map.current?.getZoom() === undefined) {
+            return [];
+        }
+        return (projectItems?.filter(item => item.isVisible &&
+            (!applyMinMaxScale ||
+                (Math.round(map.current.getZoom()) >= (item.minScale ?? 0) &&
+                    Math.round(map.current.getZoom()) <= (item.maxScale ?? 30)))) ?? []);
+    }, [projectItems, zoomChange, applyMinMaxScale]);
+};
+
 const useServerNotificationsContext = () => {
     return React.useContext(ServerNotificationsContext);
 };
@@ -6344,18 +6409,7 @@ const DataSourceInnerContainer = React.memo(({ config, elementConfig, feature, m
         setSelectedTabId,
         pageIndex,
         type,
-    }), [
-        getRenderElement,
-        config,
-        elementConfig,
-        attributes,
-        layerInfo,
-        expandedContainers,
-        selectedTabId,
-        setSelectedTabId,
-        pageIndex,
-        type,
-    ]);
+    }), [config, elementConfig, attributes, layerInfo, expandedContainers, selectedTabId, setSelectedTabId, pageIndex, type]);
     if (!InnerContainer) {
         return null;
     }
@@ -8150,6 +8204,11 @@ const FeatureCardGradientHeader = ({ isRow }) => {
                                     }) })] }), jsxRuntime.jsx(FeatureCardButtons, {})] }) }) }) }));
 };
 
+const LayerIconClickable = styled.div `
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+`;
 const HeaderFontColorMixin = styled.css `
   ${HeaderTitleContainer}, ${HeaderTitleContainer} *, ${LayerDescription} {
     color: ${({ $fontColor }) => $fontColor};
@@ -8227,13 +8286,18 @@ const IconHeaderWrapper = styled.div `
 `;
 
 const FeatureCardIconHeader = ({ isRow }) => {
-    const { layerInfo } = useWidgetContext(exports.WidgetType.FeatureCard);
+    const { t } = useGlobalContext();
+    const { layerInfo, feature } = useWidgetContext(exports.WidgetType.FeatureCard);
     const { config } = useWidgetConfig(exports.WidgetType.FeatureCard);
+    const zoomToFeatures = useZoomToFeatures();
+    const getMaxZoomTo = useMaxZoomTo();
+    const [optionsMaxZoomTo, layerMaxZoomTo] = React.useMemo(() => getMaxZoomTo(layerInfo?.name), [layerInfo?.name, getMaxZoomTo]);
     const { header } = config || {};
     const { options } = header || {};
     const { fontColor, bgColor, bigIcon } = options || {};
     const renderElement = useHeaderRender(header);
-    return (jsxRuntime.jsx(IconHeaderWrapper, { "$fontColor": fontColor, "$bgColor": bgColor, "$bigIcon": bigIcon, children: jsxRuntime.jsx(uilibGl.ThemeProvider, { theme: uilibGl.defaultTheme, children: jsxRuntime.jsxs(Header, { "$isRow": isRow, children: [jsxRuntime.jsxs(HeaderFrontView, { children: [jsxRuntime.jsxs(HeaderContainer, { children: [jsxRuntime.jsx(LayerIcon, { layerInfo: layerInfo }), jsxRuntime.jsx(FeatureCardTitle, { title: renderElement({
+    const handleIconClick = React.useCallback(() => zoomToFeatures([feature], { maxZoom: layerMaxZoomTo ?? optionsMaxZoomTo }), [zoomToFeatures, feature, layerMaxZoomTo, optionsMaxZoomTo]);
+    return (jsxRuntime.jsx(IconHeaderWrapper, { "$fontColor": fontColor, "$bgColor": bgColor, "$bigIcon": bigIcon, children: jsxRuntime.jsx(uilibGl.ThemeProvider, { theme: uilibGl.defaultTheme, children: jsxRuntime.jsxs(Header, { "$isRow": isRow, children: [jsxRuntime.jsxs(HeaderFrontView, { children: [jsxRuntime.jsxs(HeaderContainer, { children: [jsxRuntime.jsx(uilibGl.Tooltip, { arrow: true, placement: "top", content: t("zoomToFeature", { ns: "dashboard", defaultValue: "Приблизить к объекту" }), delay: [600, 0], children: ref => (jsxRuntime.jsx(LayerIconClickable, { ref: ref, onClick: handleIconClick, children: jsxRuntime.jsx(LayerIcon, { layerInfo: layerInfo }) })) }), jsxRuntime.jsx(FeatureCardTitle, { title: renderElement({
                                             id: "title",
                                             wrap: false,
                                         }), description: renderElement({
@@ -9535,7 +9599,7 @@ function getFeatureAttributes(feature = {}, layer, dataSource) {
                 readOnly: true,
             }
             : {
-                value: currentAttributes?.[attributeName] || dataSource?.features?.[0]?.properties?.[attributeName],
+                value: currentAttributes?.[attributeName] ?? dataSource?.features?.[0]?.properties?.[attributeName],
                 readOnly: attributeConfigurationType === api.AttributeConfigurationType.Calculated || !isEditable,
             };
         const clientData = layer?.configuration?.attributesConfiguration?.attributes?.find(layerAttribute => layerAttribute.attributeName === attributeName)?.clientData;
@@ -12589,6 +12653,8 @@ exports.useAppHeight = useAppHeight;
 exports.useAutoCompleteControl = useAutoCompleteControl;
 exports.useChartChange = useChartChange;
 exports.useChartData = useChartData;
+exports.useCurrentPageLayers = useCurrentPageLayers;
+exports.useCustomFeatureSelect = useCustomFeatureSelect;
 exports.useDashboardHeader = useDashboardHeader;
 exports.useDataSources = useDataSources;
 exports.useDebouncedCallback = useDebouncedCallback;
@@ -12602,10 +12668,12 @@ exports.useGlobalContext = useGlobalContext;
 exports.useHeaderRender = useHeaderRender;
 exports.useHideIfEmptyDataSource = useHideIfEmptyDataSource;
 exports.useIconsFromLayers = useIconsFromLayers;
+exports.useLayerHiddenAttributes = useLayerHiddenAttributes;
 exports.useLayerParams = useLayerParams;
 exports.useMapContext = useMapContext;
 exports.useMapDraw = useMapDraw;
 exports.useMapImages = useMapImages;
+exports.useMaxZoomTo = useMaxZoomTo;
 exports.useProjectDashboardInit = useProjectDashboardInit;
 exports.usePythonSandbox = usePythonSandbox;
 exports.usePythonTask = usePythonTask;
@@ -12616,6 +12684,7 @@ exports.useServerNotificationsContext = useServerNotificationsContext;
 exports.useShownOtherItems = useShownOtherItems;
 exports.useToggle = useToggle;
 exports.useUpdateDataSource = useUpdateDataSource;
+exports.useVisibleProjectItems = useVisibleProjectItems;
 exports.useWidgetConfig = useWidgetConfig;
 exports.useWidgetContext = useWidgetContext;
 exports.useWidgetFilters = useWidgetFilters;