@evergis/react 3.1.133 → 4.0.0

package/dist/index.js

@@ -3633,8 +3633,9 @@ exports.DateFormat = void 0;
 })(exports.DateFormat || (exports.DateFormat = {}));
 const stringDateParsers = [dateFns.parseJSON, dateFns.parseISO, rawDate => new Date(rawDate)];
 const getDate = (rawDate) => {
-    if (!rawDate)
+    if (!rawDate) {
         return null;
+    }
     if (typeof rawDate === "string") {
         for (const parser of stringDateParsers) {
             const date = parser(rawDate);
@@ -3652,7 +3653,7 @@ const formatDate$1 = (date, { dateFormat = exports.DateFormat.ClientDefaultForma
     if (dateFns.isValid(dateValue)) {
         return dateFns.format(dateValue, dateFormat);
     }
-    return defaultValue.toString();
+    return `${defaultValue}`;
 };
 
 const debounce = (callback, delay) => {
@@ -3668,13 +3669,6 @@ const debounce = (callback, delay) => {
 };
 
 const TIME_ZONE_FORMAT = ' "GMT"z'; // eslint-disable-line
-const numberFormatTypes = [
-    api.AttributeType.Int32,
-    api.AttributeType.Int64,
-    api.AttributeType.Double,
-    api.AttributeType.MultiPolygon,
-    api.AttributeType.Polyline,
-];
 exports.ScalingFactor = void 0;
 (function (ScalingFactor) {
     ScalingFactor[ScalingFactor["Default"] = 1] = "Default";
@@ -3829,8 +3823,9 @@ const formatNumberValue = (stringFormat, value, type, noUnits = false) => {
 };
 const formatAttributeValue = ({ t, type, value, stringFormat, noUnits = false }) => {
     if (type === api.AttributeType.Point) {
-        if (!stringFormat?.format || !value)
+        if (!stringFormat?.format || !value) {
             return null;
+        }
         const { coordinates } = value;
         return formatPointValue({ t, stringFormat, value: coordinates });
     }
@@ -3839,9 +3834,20 @@ const formatAttributeValue = ({ t, type, value, stringFormat, noUnits = false })
             return null;
         return formatDateValue(stringFormat, value);
     }
-    if (numberFormatTypes.includes(type) && !isNaN(value)) {
-        if (!stringFormat)
+    if ([
+        api.AttributeType.Int32,
+        api.AttributeType.Int64,
+        api.AttributeType.Double,
+        api.AttributeType.Polygon,
+        api.AttributeType.LineString,
+        api.AttributeType.MultiPoint,
+        api.AttributeType.MultiPolygon,
+        api.AttributeType.MultiLineString,
+    ].includes(type) &&
+        !isNaN(value)) {
+        if (!stringFormat) {
             return value.toString();
+        }
         return formatNumberValue(stringFormat, value, type, noUnits);
     }
     if (type === api.AttributeType.Json) {
@@ -3907,6 +3913,10 @@ const isLayerService = (value) => isObject(value) && "name" in value;
 
 const isNumeric = (number) => !isNaN(parseFloat(number)) && isFinite(number);
 
+const metersPerPixel = (zoom, lat) => {
+    return (156543.03 * Math.cos(lat * (Math.PI / 180))) / 2 ** zoom;
+};
+
 const useAutoCompleteControl = (items) => {
     const [value, setValue] = React.useState("");
     const [options, setOptions] = React.useState([]);
@@ -4349,11 +4359,11 @@ const getDataSource = (dataSourceName, dataSources) => dataSources?.find(({ name
 const getDataSourceFilterValue = ({ filterName, filterProp, attributeAlias, dataSource, selectedFilters, }) => {
     if (lodash.isNil(selectedFilters[filterName]))
         return null;
-    const feature = dataSource?.features?.find(({ attributes }) => attributes[attributeAlias] ===
+    const feature = dataSource?.features?.find(({ properties }) => properties[attributeAlias] ===
         (Array.isArray(selectedFilters[filterName].value)
             ? selectedFilters[filterName].value[0]
             : selectedFilters[filterName].value));
-    return feature?.attributes?.[filterProp];
+    return feature?.properties?.[filterProp];
 };
 
 const getSelectedFilterValue = (filterName, selectedFilters, defaultValue) => {
@@ -4471,9 +4481,12 @@ const createConfigPage = (props) => {
 };
 
 const getAttributesConfiguration = (layer) => {
-    const configuration = layer?.configuration ?? {};
+    const configuration = layer?.configuration ??
+        {};
     const emptyAttributesConfiguration = {
-        geometryAttribute: layer?.geometryType === api.GeometryType.Unknown ? undefined : GEOMETRY_ATTRIBUTE,
+        geometryAttribute: layer?.layerDefinition?.geometryType === api.OgcGeometryType.Unknown
+            ? undefined
+            : GEOMETRY_ATTRIBUTE,
         idAttribute: DEFAULT_ID_ATTRIBUTE_NAME,
         tableName: "",
     };
@@ -4492,7 +4505,7 @@ const getLayerDefinition = (layer) => {
         attributes: {},
         geometryAttribute,
         idAttribute,
-        geometryType: api.GeometryType.Unknown,
+        geometryType: api.OgcGeometryType.Unknown,
         titleAttribute: "",
     };
     if (!isLayerService(layer) || !("layerDefinition" in layer)) {
@@ -4501,7 +4514,8 @@ const getLayerDefinition = (layer) => {
     return {
         ...emptyLayerDefinition,
         ...(layer.layerDefinition || {}),
-        attributes: layer.layerDefinition.attributes || emptyLayerDefinition.attributes,
+        attributes: layer.layerDefinition.attributes ||
+            emptyLayerDefinition.attributes,
     };
 };
 
@@ -5270,73 +5284,6 @@ const useRedrawLayer = () => {
     }, [map]);
 };
 
-const findAttributeInExpression = (expression) => {
-    if (Array.isArray(expression) && expression.length === 2 && expression[0] === "get") {
-        return [expression[1]];
-    }
-    return expression.reduce((acc, curr) => {
-        if (!Array.isArray(curr)) {
-            return acc;
-        }
-        if (curr[0] === "get") {
-            return [...new Set([...acc, curr[1]])];
-        }
-        return [...new Set([...acc, ...findAttributeInExpression(curr)])];
-    }, []);
-};
-
-const getActualExtrusionHeight = (paint) => {
-    return Array.isArray(paint?.["fill-extrusion-height"]) && paint?.["fill-extrusion-height"][0] === "+"
-        ? paint?.["fill-extrusion-height"][1]
-        : paint?.["fill-extrusion-height"];
-};
-
-const extractAttributesFromObject = (obj) => {
-    if (!obj || lodash.isEmpty(obj)) {
-        return [];
-    }
-    return Object.entries(obj).reduce((acc, [, value]) => {
-        if (!Array.isArray(value)) {
-            return acc;
-        }
-        return [...new Set([...acc, ...findAttributeInExpression(value)])];
-    }, []);
-};
-const parseClientStyle = (style) => {
-    if (!style) {
-        return [];
-    }
-    return style?.items?.reduce((acc, curr) => {
-        const paintAttributes = extractAttributesFromObject(curr.paint);
-        const layoutAttributes = extractAttributesFromObject(curr.layout);
-        const filterAttributes = curr.filter
-            ? findAttributeInExpression(curr.filter)
-            : [];
-        return [...new Set([...acc, ...paintAttributes, ...layoutAttributes, ...filterAttributes])];
-    }, []);
-};
-
-const convertSpToTurfFeature = (geometry) => {
-    if (!geometry) {
-        return;
-    }
-    switch (geometry.type) {
-        case api.GeometryType.Point:
-            return turf.point(geometry.coordinates);
-        case api.GeometryType.Multipoint:
-            return turf.multiPoint(geometry.coordinates);
-        case api.GeometryType.Polyline:
-            return turf.multiLineString(geometry.coordinates);
-        case api.GeometryType.Polygon:
-        case api.GeometryType.Envelope:
-            return turf.polygon(geometry.coordinates);
-        case api.GeometryType.MultiPolygon:
-            return turf.multiPolygon(geometry.coordinates);
-        case api.GeometryType.GeometryCollection:
-            return turf.geometryCollection(geometry.geometries);
-    }
-};
-
 const useZoomToFeatures = () => {
     const { map } = useMapContext();
     return React.useCallback((features, padding) => {
@@ -5345,7 +5292,7 @@ const useZoomToFeatures = () => {
         }
         const currentFeatureCenter = turf.bbox({
             type: "FeatureCollection",
-            features: features.map(feature => convertSpToTurfFeature(feature.geometry)),
+            features: features,
         });
         map.current.fitBounds(currentFeatureCenter, { padding: padding ?? 150 });
     }, [map]);
@@ -6008,9 +5955,9 @@ function getValueIndex(items, attributes) {
 const getChartMarkers = (items, markers, dataSources) => {
     if (typeof markers === "string") {
         const dataSource = getDataSource(markers, dataSources);
-        return dataSource?.features?.map(({ attributes }) => ({
-            ...attributes,
-            value: getValueIndex(items, attributes),
+        return dataSource?.features?.map(({ properties }) => ({
+            ...properties,
+            value: getValueIndex(items, properties),
         })) || [];
     }
     return (markers?.map(marker => ({
@@ -6188,7 +6135,7 @@ const useRenderContainerItem = (type, renderElement) => {
             options: { noUnits: hasUnits, ...child.options },
         }));
         const attr = attribute
-            ? layerInfo?.layerAttributes?.find(({ attributeName }) => attributeName === attribute)
+            ? layerInfo?.configuration?.attributesConfiguration?.attributes?.find(({ attributeName }) => attributeName === attribute)
             : null;
         if (hasIcon) {
             elementChildren[iconIndex] = {
@@ -6433,7 +6380,7 @@ const DataSourceProgressContainer = React.memo(({ config, elementConfig, type, i
     const { dataSource, layerInfo } = useRelatedDataSourceAttributes({
         type,
         elementConfig,
-        dataSources
+        dataSources,
     });
     const { attributes } = layerInfo?.configuration?.attributesConfiguration || {};
     const { id, options, children, style } = elementConfig || {};
@@ -6444,19 +6391,25 @@ const DataSourceProgressContainer = React.memo(({ config, elementConfig, type, i
     const totalUnits = React.useMemo(() => unitsElement?.type === "attributeUnits"
         ? attributes?.find(({ attributeName }) => attributeName === unitsElement.attributeName)?.stringFormat
             ?.unitsLabel
-        : dataSource?.features?.[0]?.attributes[unitsElement?.attributeName], [attributes, dataSource?.features, unitsElement?.attributeName, unitsElement?.type]);
+        : dataSource?.features?.[0]?.properties[unitsElement?.attributeName], [attributes, dataSource?.features, unitsElement?.attributeName, unitsElement?.type]);
     const totalValue = React.useMemo(() => {
         const attribute = attributes?.find(({ attributeName }) => attributeName === valueElement?.attributeName);
         const { type: attributeType, stringFormat } = attribute || {};
-        const result = dataSource?.features?.reduce((total, feature) => total + feature.attributes[valueElement?.attributeName], 0);
-        return formatAttributeValue({ t, type: attributeType, value: result, stringFormat, noUnits: !!unitsElement?.type });
+        const result = dataSource?.features?.reduce((total, feature) => total + feature.properties[valueElement?.attributeName], 0);
+        return formatAttributeValue({
+            t,
+            type: attributeType,
+            value: result,
+            stringFormat,
+            noUnits: !!unitsElement?.type,
+        });
     }, [attributes, dataSource?.features, unitsElement?.type, valueElement?.attributeName]);
     const currentMaxValue = React.useMemo(() => {
         if (typeof maxValue === "string") {
-            return dataSource?.features?.[0]?.attributes[maxValue];
+            return dataSource?.features?.[0]?.properties[maxValue];
         }
         return (maxValue ||
-            dataSource?.features?.reduce((result, item) => Math.max(result, item.attributes[valueElement?.attributeName]), 0));
+            dataSource?.features?.reduce((result, item) => Math.max(result, item.properties[valueElement?.attributeName]), 0));
     }, [dataSource?.features, maxValue, valueElement?.attributeName]);
     if (!relatedDataSource)
         return null;
@@ -6464,7 +6417,10 @@ const DataSourceProgressContainer = React.memo(({ config, elementConfig, type, i
         return jsxRuntime.jsx(DataSourceError, { name: elementConfig.templateName });
     }
     const isVisible = isVisibleContainer(id, expandable, expanded, expandedContainers);
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ExpandableTitle, { elementConfig: elementConfig, type: type, renderElement: renderElement }), !isVisible ? null : dataSource ? (jsxRuntime.jsxs(DataSourceProgressContainerWrapper, { id: id, style: style, children: [sliceItems(dataSource?.features)?.map((feature, index) => (jsxRuntime.jsx(DataSourceInnerContainer, { type: type, index: index, feature: feature, config: config, elementConfig: elementConfig, maxValue: currentMaxValue, innerComponent: innerComponent }, index))), checkIsSliced(dataSource?.features) && (jsxRuntime.jsx(ContainerToggler, { toggled: showMore, onClick: onShowMore, children: showMore ? t("hide", { ns: "dashboard", defaultValue: "Свернуть" }) : t("showAll", { ns: "dashboard", defaultValue: "Показать все" }) })), showTotal && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(uilibGl.Divider, {}), jsxRuntime.jsxs(ProgressTotal, { children: [jsxRuntime.jsx(ProgressTotalTitle, { children: t("total", { ns: "dashboard", defaultValue: "Итого" }) }), jsxRuntime.jsxs(ProgressValue, { children: [totalValue, jsxRuntime.jsx(ProgressUnits, { children: totalUnits })] })] })] }))] })) : (jsxRuntime.jsx(ContainerLoading, {})), jsxRuntime.jsx(HiddenTitleItems, { elementConfig: elementConfig, config: config, type: type })] }));
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ExpandableTitle, { elementConfig: elementConfig, type: type, renderElement: renderElement }), !isVisible ? null : dataSource ? (jsxRuntime.jsxs(DataSourceProgressContainerWrapper, { id: id, style: style, children: [sliceItems(dataSource?.features)?.map((feature, index) => (jsxRuntime.jsx(DataSourceInnerContainer, { type: type, index: index, feature: feature, config: config, elementConfig: elementConfig, maxValue: currentMaxValue, innerComponent: innerComponent }, index))), checkIsSliced(dataSource?.features) && (jsxRuntime.jsx(ContainerToggler, { toggled: showMore, onClick: onShowMore, children: showMore ? t("hide", { ns: "dashboard", defaultValue: "Свернуть" }) : t("showAll", {
+                            ns: "dashboard",
+                            defaultValue: "Показать все",
+                        }) })), showTotal && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(uilibGl.Divider, {}), jsxRuntime.jsxs(ProgressTotal, { children: [jsxRuntime.jsx(ProgressTotalTitle, { children: t("total", { ns: "dashboard", defaultValue: "Итого" }) }), jsxRuntime.jsxs(ProgressValue, { children: [totalValue, jsxRuntime.jsx(ProgressUnits, { children: totalUnits })] })] })] }))] })) : (jsxRuntime.jsx(ContainerLoading, {})), jsxRuntime.jsx(HiddenTitleItems, { elementConfig: elementConfig, config: config, type: type })] }));
 });
 
 const ProgressContainer = React.memo(({ type, elementConfig, feature, maxValue, index, renderElement }) => {
@@ -7400,12 +7356,6 @@ exports.ThemeName = void 0;
     ThemeName["Dark"] = "dark";
 })(exports.ThemeName || (exports.ThemeName = {}));
 
-exports.TmsType = void 0;
-(function (TmsType) {
-    TmsType["WMS"] = "WMS";
-    TmsType["TMS"] = "TMS";
-    TmsType["ArcGIS"] = "ArcGIS";
-})(exports.TmsType || (exports.TmsType = {}));
 exports.EditGeometryType = void 0;
 (function (EditGeometryType) {
     EditGeometryType["Raster"] = "raster";
@@ -7547,7 +7497,7 @@ const useEditControl = (type, elementConfig) => {
         attributes,
     ]);
     const dataSource = React.useMemo(() => dataSources?.find(({ name }) => name === control.relatedDataSource), [control.relatedDataSource, dataSources]);
-    const items = React.useMemo(() => dataSource?.features.map(item => item.attributes[control?.attributeName] || null) || [], [dataSource?.features, control?.attributeName]);
+    const items = React.useMemo(() => dataSource?.features.map(item => item.properties[control?.attributeName] || null) || [], [dataSource?.features, control?.attributeName]);
     const onChange = React.useCallback((newValue) => {
         changeControls({
             [control?.targetAttributeName]: newValue,
@@ -7918,8 +7868,8 @@ const HeaderTitle = ({ noFeature }) => {
     const { t } = useGlobalContext();
     const { attributes, layerInfo, feature } = useWidgetContext(exports.WidgetType.FeatureCard);
     const zoomToFeatures = useZoomToFeatures();
-    const { alias, name, layerDefinition } = layerInfo || {};
-    const resultDescription = alias || name || "";
+    const { configuration, layerDefinition } = layerInfo || {};
+    const resultDescription = configuration?.alias || configuration?.name || "";
     const resultTitle = React.useMemo(() => {
         const layerDefinitionAttribute = layerDefinition && attributes?.length
             ? attributes.find(item => item.name === layerDefinition.titleAttribute)
@@ -7967,20 +7917,20 @@ var img = "data:image/svg+xml,%3csvg width='32' height='32' viewBox='0 0 32 32'
 
 const LayerIcon = ({ layerInfo, error }) => {
     const renderSymbol = React.useMemo(() => {
-        if (!layerInfo.geometryType || error) {
+        if (!layerInfo?.layerDefinition?.geometryType || error) {
             return (jsxRuntime.jsx(AlertIconContainer, { children: jsxRuntime.jsx(uilibGl.Icon, { kind: "warning" }) }));
         }
-        switch (layerInfo.geometryType) {
-            case api.GeometryType.Polyline:
+        switch (layerInfo?.layerDefinition?.geometryType) {
+            case api.OgcGeometryType.MultiLineString:
                 return jsxRuntime.jsx("img", { src: img$1, alt: "" });
-            case api.GeometryType.Polygon:
-            case api.GeometryType.MultiPolygon:
+            case api.OgcGeometryType.Polygon:
+            case api.OgcGeometryType.MultiPolygon:
                 return jsxRuntime.jsx("img", { src: img, alt: "" });
-            case api.GeometryType.Point:
+            case api.OgcGeometryType.Point:
             default:
                 return jsxRuntime.jsx("img", { src: img$2, alt: "" });
         }
-    }, [layerInfo.geometryType]);
+    }, [layerInfo?.layerDefinition?.geometryType]);
     return jsxRuntime.jsx(LayerIconContainer, { children: renderSymbol });
 };
 
@@ -8524,8 +8474,8 @@ const ElementControl = ({ elementConfig }) => {
             return [];
         }
         return dataSource.features.map(item => ({
-            value: item.attributes?.[attributeName] || "",
-            text: item.attributes?.[control?.attributeName || attributeName] || "",
+            value: item.properties?.[attributeName] || "",
+            text: item.properties?.[control?.attributeName || attributeName] || "",
         }));
     }, [control?.attributeName, dataSource?.features, attributeName]);
     const isDisabled = React.useMemo(() => {
@@ -8861,7 +8811,7 @@ const ElementSlideshow = ({ elementConfig, type, renderElement }) => {
     const images = React.useMemo(() => {
         const dataSource = relatedDataSource ? dataSources?.find(({ name }) => name === relatedDataSource) : null;
         const array = dataSource
-            ? dataSource.features.map(feature => feature.attributes[attributeName])
+            ? dataSource.features.map(feature => feature.properties[attributeName])
             : getSlideshowImages({
                 element: elementConfig,
                 attribute: attributes?.find(({ name }) => name === attributeName),
@@ -9044,20 +8994,20 @@ const getDataFromRelatedFeatures = ({ t, config, filters, relatedConfig, dataSou
     }
     const { colors } = config.options;
     const layerDefinition = getLayerDefinition(layerInfo);
-    let data = JSON.parse(JSON.stringify(dataSource?.features));
+    let data = [...dataSource?.features];
     const sortAttribute = config?.options?.orderByValue
         ? relatedConfig.attributeName
         : config?.options?.orderByTitle
             ? relatedConfig.attributeTitle
             : null;
     if (sortAttribute) {
-        data.sort((a, b) => b.attributes[sortAttribute] - a.attributes[sortAttribute]);
+        data.sort((a, b) => b.properties[sortAttribute] - a.properties[sortAttribute]);
     }
     const isOtherSliced = config?.options?.otherItems && config.options.otherItems < data.length;
     const otherValue = isOtherSliced
         ? data
             .slice(config.options.otherItems)
-            .reduce((prev, { attributes }) => prev + attributes[relatedConfig.attributeName], 0)
+            .reduce((prev, { properties }) => prev + properties[relatedConfig.attributeName], 0)
         : null;
     if (isOtherSliced) {
         data = data.slice(0, config?.options?.otherItems);
@@ -9073,9 +9023,9 @@ const getDataFromRelatedFeatures = ({ t, config, filters, relatedConfig, dataSou
         if (relatedConfig?.filterName && !filter) {
             return acc;
         }
-        const attributeName = feature.attributes[relatedConfig.attributeName];
-        const attributeTitle = feature.attributes[relatedConfig.attributeTitle];
-        const attributeColor = feature.attributes[relatedConfig.attributeColor];
+        const attributeName = feature.properties[relatedConfig.attributeName];
+        const attributeTitle = feature.properties[relatedConfig.attributeTitle];
+        const attributeColor = feature.properties[relatedConfig.attributeColor];
         return [
             ...acc,
             {
@@ -9087,8 +9037,8 @@ const getDataFromRelatedFeatures = ({ t, config, filters, relatedConfig, dataSou
                 }),
                 value: attributeName === null ? null : Number(attributeName),
                 color: attributeColor || gradientArray?.[index] || FEATURE_CARD_OTHER_COLOR,
-                min: filter?.attributeMin ? feature.attributes[filter.attributeMin] : null,
-                max: filter?.attributeMin ? feature.attributes[filter.attributeMax] : null
+                min: filter?.attributeMin ? feature.properties[filter.attributeMin] : null,
+                max: filter?.attributeMin ? feature.properties[filter.attributeMax] : null
             }
         ];
     }, []);
@@ -9383,7 +9333,7 @@ function getFeatureAttributes(feature = {}, layer, dataSource) {
     if (!layerDefinition) {
         return [];
     }
-    const currentAttributes = !feature && dataSource ? dataSource.features[0].attributes : feature?.attributes;
+    const currentAttributes = !feature && dataSource ? dataSource.features[0].properties : feature?.properties;
     const { id: idValue } = feature || {};
     const { idAttribute, attributes } = layerDefinition || {};
     const layerAttributes = idAttribute
@@ -9400,10 +9350,10 @@ function getFeatureAttributes(feature = {}, layer, dataSource) {
                 readOnly: true,
             }
             : {
-                value: currentAttributes?.[attributeName] || dataSource?.features?.[0]?.attributes?.[attributeName],
+                value: currentAttributes?.[attributeName] || dataSource?.features?.[0]?.properties?.[attributeName],
                 readOnly: isCalculated || !isEditable,
             };
-        const clientData = layer.layerAttributes?.find(layerAttribute => layerAttribute.attributeName === attributeName)?.clientData;
+        const clientData = layer?.configuration?.attributesConfiguration?.attributes?.find(layerAttribute => layerAttribute.attributeName === attributeName)?.clientData;
         return {
             id: attributeName,
             name: attributeName,
@@ -9574,10 +9524,10 @@ const getListOptions = (items, filterName, configFilters) => {
     if (!filter)
         return [];
     return (items?.map(item => ({
-        text: item.attributes[filter.attributeAlias || DEFAULT_ATTRIBUTE_NAME],
-        value: item.attributes[filter.attributeValue || DEFAULT_ATTRIBUTE_NAME],
-        min: filter.attributeMin ? item.attributes[filter.attributeMin] : null,
-        max: filter.attributeMax ? item.attributes[filter.attributeMax] : null,
+        text: item.properties[filter.attributeAlias || DEFAULT_ATTRIBUTE_NAME],
+        value: item.properties[filter.attributeValue || DEFAULT_ATTRIBUTE_NAME],
+        min: filter.attributeMin ? item.properties[filter.attributeMin] : null,
+        max: filter.attributeMax ? item.properties[filter.attributeMax] : null,
     })) || []);
 };
 
@@ -9702,7 +9652,7 @@ const useBarChartFilter = ({ type, filter, elementConfig }) => {
     const [selectedPixels, setSelectedPixels] = React.useState(null);
     const { filterName } = filter.options;
     const { options } = elementConfig;
-    const { barHeight, barWidth = DEFAULT_BAR_WIDTH, padding = DEFAULT_BAR_PADDING, height = DEFAULT_BAR_CHART_HEIGHT, radius = DEFAULT_BARCHART_RADIUS, width: configWidth, markers: configMarkers, colors: configColors, colorAttribute, defaultColor, primaryColor, drawMinMax } = options || {};
+    const { barHeight, barWidth = DEFAULT_BAR_WIDTH, padding = DEFAULT_BAR_PADDING, height = DEFAULT_BAR_CHART_HEIGHT, radius = DEFAULT_BARCHART_RADIUS, width: configWidth, markers: configMarkers, colors: configColors, colorAttribute, defaultColor, primaryColor, drawMinMax, } = options || {};
     const barFullWidth = barWidth + padding;
     const { filters: configFilters } = currentPage;
     const configFilter = React.useMemo(() => getConfigFilter(filterName, configFilters), [configFilters, filterName]);
@@ -9717,9 +9667,9 @@ const useBarChartFilter = ({ type, filter, elementConfig }) => {
             dataSourceName: configFilter?.relatedDataSource,
             attributeName: configFilter?.attributeValue,
             attributeTitle: configFilter?.attributeAlias,
-            attributeColor: colorAttribute
+            attributeColor: colorAttribute,
         },
-        layerInfo: { layerDefinition: { attributes: dataSource?.attributeDefinition } }
+        layerInfo: { layerDefinition: { attributes: dataSource?.attributeDefinition } },
     }), [
         colorAttribute,
         configFilter?.attributeAlias,
@@ -9728,7 +9678,7 @@ const useBarChartFilter = ({ type, filter, elementConfig }) => {
         configFilters,
         dataSource,
         elementConfig,
-        t
+        t,
     ]);
     const amount = React.useMemo(() => filterItems?.length || 0, [filterItems?.length]);
     const width = React.useMemo(() => configWidth || amount * barFullWidth, [amount, barFullWidth, configWidth]);
@@ -9764,8 +9714,8 @@ const useBarChartFilter = ({ type, filter, elementConfig }) => {
                     ...item,
                     color: selectedRange && index >= selectedRange[0] && index <= selectedRange[1]
                         ? primaryColor || theme.palette.primary
-                        : defaultColor || theme.palette.elementDeep
-                }
+                        : defaultColor || theme.palette.elementDeep,
+                },
             ];
         });
     }, [defaultColor, hasDefinedColors, primaryColor, selectedRange, theme.palette.elementDeep, theme.palette.primary]);
@@ -9793,8 +9743,8 @@ const useBarChartFilter = ({ type, filter, elementConfig }) => {
             [filterName]: {
                 value: valueRange,
                 min: valueRange[0],
-                max: valueRange[1]
-            }
+                max: valueRange[1],
+            },
         }, configFilter?.resetFilters);
     }, [changeFilters, configFilter?.resetFilters, filterName, getValueRange]);
     const prevDisabled = React.useMemo(() => loading || !selectedPixels || selectedPixels?.[0] - barFullWidth < 0, [barFullWidth, loading, selectedPixels]);
@@ -9852,7 +9802,7 @@ const useBarChartFilter = ({ type, filter, elementConfig }) => {
         onPrev,
         onNext,
         onSelect,
-        onBarClick
+        onBarClick,
     };
 };
 const BarChartFilter = ({ type, config, elementConfig, filter }) => {
@@ -9860,7 +9810,7 @@ const BarChartFilter = ({ type, config, elementConfig, filter }) => {
     const { configFilters, loading, height, data, barWidth, barHeight, attributeValue, padding, selectedRange, prevDisabled, nextDisabled, onPrev, onNext, ...rest } = useBarChartFilter({
         type,
         elementConfig,
-        filter
+        filter,
     });
     const renderSelectedRange = React.useMemo(() => {
         if (!selectedRange)
@@ -9889,8 +9839,8 @@ const RangeDateFilter = ({ type, filter }) => {
     const { filterName, label, minValue, maxValue, withTime } = filter.options;
     const configFilter = React.useMemo(() => getConfigFilter(filterName, configFilters), [configFilters, filterName]);
     const dataSource = React.useMemo(() => getDataSource(configFilter?.relatedDataSource, dataSources), [configFilter?.relatedDataSource, dataSources]);
-    const { minFromData, maxFromData } = React.useMemo(() => dataSource?.features?.reduce((prev, { attributes }) => {
-        const date = getDate(attributes[configFilter?.attributeValue]);
+    const { minFromData, maxFromData } = React.useMemo(() => dataSource?.features?.reduce((prev, { properties }) => {
+        const date = getDate(properties[configFilter?.attributeValue]);
         return {
             minFromData: !prev.minFromData ? date : date < prev.minFromData ? date : prev.minFromData,
             maxFromData: !prev.maxFromData ? date : date > prev.maxFromData ? date : prev.maxFromData
@@ -10111,7 +10061,7 @@ const ChipsFilter = ({ type, filter, elementConfig, }) => {
             return [];
         const features = dataSource.features;
         return features.map(feature => {
-            const attrs = feature.attributes;
+            const attrs = feature.properties;
             const text = attrs[configFilter.attributeAlias || DEFAULT_ATTRIBUTE_NAME];
             const value = attrs[configFilter.attributeValue || DEFAULT_ATTRIBUTE_NAME];
             const chipIcon = iconAttribute
@@ -10284,21 +10234,21 @@ const getProxyService = (layer) => {
     if (!isProxyService(layer))
         return {
             layers: [],
-            sourceType: "",
             sourceUrl: "",
-            copyrightText: "",
+            sourceType: "",
+            layerDefinition: layer?.layerDefinition,
             legend: {
                 layers: [],
             },
         };
-    const { layers, sourceType, sourceUrl, legend, copyrightText } = layer;
+    const { layers, sourceType, sourceUrl, legend, layerDefinition } = layer;
     return {
         layers: layers || [],
-        copyrightText: copyrightText || "",
         sourceUrl: sourceUrl || "",
         sourceType: sourceType || "",
+        layerDefinition,
         legend: {
-            layers: (legend && legend.layers) || [],
+            layers: legend?.layers || [],
         },
     };
 };
@@ -10313,10 +10263,12 @@ function getLayerInfo(layer) {
         name: layer?.name || "",
         configuration: {
             ...configuration,
+            name: layer?.name || "",
             layers: configLayers.filter(isCompositeLayerConfiguration),
             attributesConfiguration,
         },
-        acl: configuration.acl,
+        acl: layer?.acl,
+        layerDefinition,
         condition: ("condition" in configuration && configuration.condition) || undefined,
         tableName: attributesConfiguration.tableName,
         idAttribute: attributesConfiguration.idAttribute,
@@ -10357,8 +10309,8 @@ const getSlideshowImages = ({ element, attribute, }) => {
 
 const getSvgUrl = ({ elementConfig, layerInfo, attributes, }) => {
     let url = "";
-    if (elementConfig.attributeIcon && layerInfo.layerAttributes) {
-        const iconAttribute = layerInfo.layerAttributes.find(({ attributeName }) => attributeName === elementConfig.attributeIcon)?.icon;
+    if (elementConfig.attributeIcon && layerInfo?.configuration?.attributesConfiguration?.attributes) {
+        const iconAttribute = layerInfo?.configuration?.attributesConfiguration?.attributes.find(({ attributeName }) => attributeName === elementConfig.attributeIcon)?.icon;
         url = iconAttribute?.resourceId || iconAttribute?.url;
     }
     else {
@@ -10640,7 +10592,7 @@ const useChartData = ({ element, type }) => {
                             relatedConfig: relatedAxis,
                             dataSource: featureDataSource,
                             layerInfo: layerInfo ||
-                                { layerDefinition: { attributes: featureDataSource.attributeDefinition } }
+                                { layerDefinition: { attributes: featureDataSource.attributeDefinition } },
                         })
                         : null,
                     color: axisColor,
@@ -10659,8 +10611,8 @@ const useChartData = ({ element, type }) => {
                 attributeName: null,
                 attributeUnits: null,
                 dataSourceName: null,
-                color: null
-            }
+                color: null,
+            },
         ];
     }, [
         currentPage?.dataSources,
@@ -10670,7 +10622,7 @@ const useChartData = ({ element, type }) => {
         t,
         attributes,
         layerInfos,
-        dataSources
+        dataSources,
     ]);
     const [data, setData] = React.useState(fetchedData);
     React.useEffect(() => {
@@ -10779,7 +10731,7 @@ const useDataSources = ({ type: widgetType, config, attributes, filters, layerPa
             const queryResponse = await api.eql.getPagedQueryResult({ saveInHistory: false }, getProps);
             const descriptionResponse = await api.eql.getQueryDescription(getProps);
             return {
-                items: queryResponse.items,
+                items: queryResponse.features,
                 attributeDefinition: descriptionResponse,
             };
         }
@@ -10827,7 +10779,7 @@ const useDataSources = ({ type: widgetType, config, attributes, filters, layerPa
                 !!currentDataSources[index].url ||
                 !!currentDataSources[index].resourceId;
             newDataSources[index].layerName = currentDataSources[index].layerName;
-            const items = response.status === "rejected" ? null : response.value?.items || response.items;
+            const items = response.status === "rejected" ? null : response.value?.features || response.items;
             newDataSources[index].features =
                 response.status === "rejected"
                     ? null
@@ -11262,7 +11214,7 @@ const Chart = React.memo(({ config, element, elementConfig, type, renderElement
                     const attribute = layerInfo?.layerDefinition.attributes[attributeName];
                     const dataSource = getDataSource(dataSourceName, dataSources);
                     const units = attributeUnits
-                        ? dataSource?.features?.[0]?.attributes?.[attributeUnits]
+                        ? dataSource?.features?.[0]?.properties?.[attributeUnits]
                         : attribute?.stringFormat?.unitsLabel;
                     const formatValue = attribute
                         ? formatAttributeValue({
@@ -11482,8 +11434,8 @@ const FeatureCardHeader = () => {
 const FeatureCardTitle = ({ title, description }) => {
     const { t } = useGlobalContext();
     const { attributes, layerInfo, feature } = useWidgetContext(exports.WidgetType.FeatureCard);
-    const { alias, name, layerDefinition, titleAttribute } = layerInfo || {};
-    const resultDescription = description || alias || name || "";
+    const { configuration, layerDefinition } = layerInfo || {};
+    const resultDescription = description || configuration?.alias || configuration?.name || "";
     const resultTitle = React.useMemo(() => {
         const layerDefinitionAttribute = layerDefinition && attributes?.length
             ? attributes.find(item => item.name === layerDefinition.titleAttribute)
@@ -11491,8 +11443,8 @@ const FeatureCardTitle = ({ title, description }) => {
         const layerDefinitionTitle = layerDefinition?.titleAttribute && layerDefinitionAttribute?.value
             ? layerDefinitionAttribute.value
             : null;
-        const sourceTitleAttribute = titleAttribute && attributes?.length ? attributes.find(item => item.name === titleAttribute) : null;
-        const sourceTitle = titleAttribute && sourceTitleAttribute?.value ? sourceTitleAttribute.value : null;
+        const sourceTitleAttribute = layerDefinition?.titleAttribute && attributes?.length ? attributes.find(item => item.name === layerDefinition?.titleAttribute) : null;
+        const sourceTitle = layerDefinition?.titleAttribute && sourceTitleAttribute?.value ? sourceTitleAttribute.value : null;
         return (title ||
             (!!sourceTitle &&
                 formatAttributeValue({ t, type: sourceTitleAttribute.type, value: sourceTitle, stringFormat: sourceTitleAttribute.stringFormat })) ||
@@ -11504,7 +11456,7 @@ const FeatureCardTitle = ({ title, description }) => {
                     stringFormat: layerDefinitionAttribute.stringFormat,
                 })) ||
             feature?.id);
-    }, [attributes, feature?.id, layerDefinition, title, titleAttribute]);
+    }, [attributes, feature?.id, layerDefinition, title]);
     return (jsxRuntime.jsxs(HeaderTitleContainer, { children: [jsxRuntime.jsx(FeatureTitleContainer, { children: jsxRuntime.jsx(uilibGl.FlexSpan, { children: resultTitle }) }), jsxRuntime.jsx(LayerDescription, { title: resultDescription, children: resultDescription })] }));
 };
 
@@ -11822,22 +11774,22 @@ const RasterLayer = ({ layer, tileUrl, visible, beforeId, filterVersion, }) => {
 
 const getClientStyleItemPrefixSuffix = (geometryType, itemType) => {
     switch (geometryType) {
-        case api.GeometryType.Point:
+        case api.OgcGeometryType.Point:
             switch (itemType) {
                 case "symbol":
                     return ["point-label-layer-", "-label"];
                 default:
                     return ["point-layer-", ""];
             }
-        case api.GeometryType.Polyline:
+        case api.OgcGeometryType.MultiLineString:
             switch (itemType) {
                 case "symbol":
                     return ["polyline-label-layer-", "-label"];
                 default:
                     return ["polyline-layer-", ""];
             }
-        case api.GeometryType.Polygon:
-        case api.GeometryType.MultiPolygon:
+        case api.OgcGeometryType.Polygon:
+        case api.OgcGeometryType.MultiPolygon:
             switch (itemType) {
                 case "line":
                     return ["polygon-stroke-layer-", "-stroke"];
@@ -11853,6 +11805,52 @@ const getClientStyleItemPrefixSuffix = (geometryType, itemType) => {
     }
 };
 
+const findAttributeInExpression = (expression) => {
+    if (Array.isArray(expression) && expression.length === 2 && expression[0] === "get") {
+        return [expression[1]];
+    }
+    return expression.reduce((acc, curr) => {
+        if (!Array.isArray(curr)) {
+            return acc;
+        }
+        if (curr[0] === "get") {
+            return [...new Set([...acc, curr[1]])];
+        }
+        return [...new Set([...acc, ...findAttributeInExpression(curr)])];
+    }, []);
+};
+
+const getActualExtrusionHeight = (paint) => {
+    return Array.isArray(paint?.["fill-extrusion-height"]) && paint?.["fill-extrusion-height"][0] === "+"
+        ? paint?.["fill-extrusion-height"][1]
+        : paint?.["fill-extrusion-height"];
+};
+
+const extractAttributesFromObject = (obj) => {
+    if (!obj || lodash.isEmpty(obj)) {
+        return [];
+    }
+    return Object.entries(obj).reduce((acc, [, value]) => {
+        if (!Array.isArray(value)) {
+            return acc;
+        }
+        return [...new Set([...acc, ...findAttributeInExpression(value)])];
+    }, []);
+};
+const parseClientStyle = (style) => {
+    if (!style) {
+        return [];
+    }
+    return style?.items?.reduce((acc, curr) => {
+        const paintAttributes = extractAttributesFromObject(curr.paint);
+        const layoutAttributes = extractAttributesFromObject(curr.layout);
+        const filterAttributes = curr.filter
+            ? findAttributeInExpression(curr.filter)
+            : [];
+        return [...new Set([...acc, ...paintAttributes, ...layoutAttributes, ...filterAttributes])];
+    }, []);
+};
+
 const VectorLayer = ({ layer, tileUrl, visible, beforeId, getLayerTempStyle, filterVersion, }) => {
     const clientStyle = layer?.configuration?.clientStyle;
     const { idAttribute, geometryType } = layer.layerDefinition || {};
@@ -11884,7 +11882,7 @@ const VectorLayer = ({ layer, tileUrl, visible, beforeId, getLayerTempStyle, fil
     const renderLayerByGeometryType = React.useCallback(() => {
         const visibility = visible ? "visible" : "none";
         switch (geometryType) {
-            case api.GeometryType.Point:
+            case api.OgcGeometryType.Point:
                 return (jsxRuntime.jsx(MapGL.Layer, { id: layer.name, type: "circle", "source-layer": "default", beforeId: beforeId, layout: {
                         ...getLayerTempStyle?.(layer.name, "circle")?.layout,
                         visibility,
@@ -11892,8 +11890,8 @@ const VectorLayer = ({ layer, tileUrl, visible, beforeId, getLayerTempStyle, fil
                         ...DEFAULT_CIRCLE_PAINT,
                         ...getLayerTempStyle?.(layer.name, "circle")?.paint,
                     } }));
-            case api.GeometryType.Polygon:
-            case api.GeometryType.MultiPolygon:
+            case api.OgcGeometryType.Polygon:
+            case api.OgcGeometryType.MultiPolygon:
                 return [
                     jsxRuntime.jsx(MapGL.Layer, { id: layer.name, type: "fill", "source-layer": "default", beforeId: beforeId, layout: {
                             ...getLayerTempStyle?.(layer.name, "fill")?.layout,
@@ -11931,7 +11929,7 @@ const VectorLayer = ({ layer, tileUrl, visible, beforeId, getLayerTempStyle, fil
                             ...getLayerTempStyle?.(layer.name, "fill-extrusion")?.paint,
                         } }, `polygon-extrusion-layer-${layer.name}`),
                 ];
-            case api.GeometryType.Polyline:
+            case api.OgcGeometryType.MultiLineString:
                 return (jsxRuntime.jsx(MapGL.Layer, { id: layer.name, type: "line", "source-layer": "default", beforeId: beforeId, layout: {
                         ...getLayerTempStyle?.(layer.name, "line")?.layout,
                         visibility,
@@ -12203,7 +12201,6 @@ exports.applyQueryFilters = applyQueryFilters;
 exports.applyVarsToCondition = applyVarsToCondition;
 exports.checkEqualOrIncludes = checkEqualOrIncludes;
 exports.checkIsLoading = checkIsLoading;
-exports.convertSpToTurfFeature = convertSpToTurfFeature;
 exports.createConfigLayer = createConfigLayer;
 exports.createConfigPage = createConfigPage;
 exports.createNewPageId = createNewPageId;
@@ -12274,6 +12271,7 @@ exports.isNumeric = isNumeric;
 exports.isObject = isObject;
 exports.isProxyService = isProxyService;
 exports.isVisibleContainer = isVisibleContainer;
+exports.metersPerPixel = metersPerPixel;
 exports.numberOptions = numberOptions;
 exports.parseClientStyle = parseClientStyle;
 exports.parseIconNames = parseIconNames;