@evergis/react 2.0.197 → 2.0.200
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/dist/components/Legend/components/LegendHeaderButtons.d.ts +8 -0
- package/dist/components/Legend/hooks/useSvgSymbol.d.ts +3 -3
- package/dist/components/Legend/styled.d.ts +4 -1
- package/dist/components/Legend/types.d.ts +5 -3
- package/dist/react.cjs.development.js +135 -75
- package/dist/react.cjs.development.js.map +1 -1
- package/dist/react.cjs.production.min.js +1 -1
- package/dist/react.cjs.production.min.js.map +1 -1
- package/dist/react.esm.js +136 -77
- package/dist/react.esm.js.map +1 -1
- package/dist/utils/isParameterType.d.ts +1 -1
- package/dist/utils/svg.d.ts +2 -2
- package/package.json +3 -3
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { FC } from "react";
|
|
2
|
+
import { LegendProps } from "../types";
|
|
3
|
+
declare type LegendHeaderButtonsProps = Pick<LegendProps, 'clearHiddenLegends' | 'goToClassification'> & {
|
|
4
|
+
layerName: string;
|
|
5
|
+
hasHiddenLegends?: boolean;
|
|
6
|
+
};
|
|
7
|
+
export declare const LegendHeaderButtons: FC<LegendHeaderButtonsProps>;
|
|
8
|
+
export {};
|
|
@@ -2,15 +2,15 @@
|
|
|
2
2
|
import { Color } from '@evergis/color/es/Color';
|
|
3
3
|
import { SvgPointSymbol } from '../../../core';
|
|
4
4
|
import { SvgEditorField, SvgSymbolBg } from '../types';
|
|
5
|
-
export declare const useSvgSymbol: (symbol: SvgPointSymbol, skipOffset?: boolean | undefined,
|
|
5
|
+
export declare const useSvgSymbol: (symbol: SvgPointSymbol, skipOffset?: boolean | undefined, isClassified?: boolean | undefined) => {
|
|
6
6
|
svgRef: import("react").MutableRefObject<HTMLElement | null>;
|
|
7
7
|
initSvg: () => void;
|
|
8
8
|
getSvgData: () => string;
|
|
9
|
-
manipulateSvg: ({ svg, bg, newSymbol,
|
|
9
|
+
manipulateSvg: ({ svg, bg, newSymbol, isClassified, }: {
|
|
10
10
|
svg: string;
|
|
11
11
|
bg?: SvgSymbolBg | undefined;
|
|
12
12
|
newSymbol?: import("../../../core").ClientSymbol<"svgPointSymbol", import("@evergis/api").SvgPointSymbolDc, never> | undefined;
|
|
13
|
-
|
|
13
|
+
isClassified?: boolean | undefined;
|
|
14
14
|
}) => void;
|
|
15
15
|
getUpdatedSvgSymbol: (field: keyof SvgEditorField, value: Color | number | string) => any;
|
|
16
16
|
};
|
|
@@ -22,7 +22,10 @@ export declare const MaximizedLegendContainer: import("styled-components").Style
|
|
|
22
22
|
export declare const MinimizedLegendContainer: import("styled-components").StyledComponent<"div", any, {
|
|
23
23
|
isShown?: boolean | undefined;
|
|
24
24
|
}, never>;
|
|
25
|
-
export declare const
|
|
25
|
+
export declare const LegendHeaderButton: import("styled-components").StyledComponent<"span", any, {}, never>;
|
|
26
|
+
export declare const MapLegendSectionContainer: import("styled-components").StyledComponent<"div", any, {
|
|
27
|
+
hasHiddenLegends?: boolean | undefined;
|
|
28
|
+
}, never>;
|
|
26
29
|
export declare const MapLegendSectionItems: import("styled-components").StyledComponent<"div", any, {
|
|
27
30
|
minHeight?: number | undefined;
|
|
28
31
|
maxHeight?: number | undefined;
|
|
@@ -29,11 +29,13 @@ export declare type LegendProps = {
|
|
|
29
29
|
formatValue?: (type: AttributeType, value: string | number | Date | FeaturedDcExtendedGeometry, stringFormat?: AttributeFormatDc) => string;
|
|
30
30
|
hiddenLegends?: Record<string, string[]>;
|
|
31
31
|
toggleHiddenLegend?: (layerName: string, hiddenCondition: string) => void;
|
|
32
|
+
clearHiddenLegends?: (layerName: string) => void;
|
|
33
|
+
goToClassification?: VoidFunction;
|
|
32
34
|
};
|
|
33
|
-
export declare type LegendChildrenProps = Pick<LegendProps, 'hiddenLegends' | 'toggleHiddenLegend' | 'formatValue'> & {
|
|
35
|
+
export declare type LegendChildrenProps = Pick<LegendProps, 'hiddenLegends' | 'toggleHiddenLegend' | 'formatValue' | 'clearHiddenLegends' | 'goToClassification'> & {
|
|
34
36
|
layerInfo: FeatureLayerServiceInfoDc;
|
|
35
37
|
};
|
|
36
|
-
export declare type LegendSectionProps = Pick<LegendProps, 'hiddenLegends' | 'toggleHiddenLegend' | 'formatValue'> & {
|
|
38
|
+
export declare type LegendSectionProps = Pick<LegendProps, 'hiddenLegends' | 'toggleHiddenLegend' | 'formatValue' | 'clearHiddenLegends' | 'goToClassification'> & {
|
|
37
39
|
layerName: string;
|
|
38
40
|
symbol: StyleDc['symbol'];
|
|
39
41
|
parameter: ClassificationParameterExtended;
|
|
@@ -69,7 +71,7 @@ export declare type SvgSymbolProps = {
|
|
|
69
71
|
text?: string;
|
|
70
72
|
bg?: SvgSymbolBg;
|
|
71
73
|
skipOffset?: boolean;
|
|
72
|
-
|
|
74
|
+
isClassified?: boolean;
|
|
73
75
|
fontSettings?: PointLabelSymbolDc;
|
|
74
76
|
onClick?: (svg: string, symbol: SvgPointSymbol) => void;
|
|
75
77
|
};
|
|
@@ -3223,6 +3223,7 @@ const textComparisonOperators = [...BASE_OPERATORS, ...CONTAINS_OPERATORS, ...ST
|
|
|
3223
3223
|
SvgSymbolBg["Circle"] = "circle";
|
|
3224
3224
|
})(exports.SvgSymbolBg || (exports.SvgSymbolBg = {}));
|
|
3225
3225
|
|
|
3226
|
+
const DEFAULT_STROKE_OPACITY = 0.28;
|
|
3226
3227
|
const convertSvgToBase64 = svg => "data:image/svg+xml;base64," + window.btoa(svg);
|
|
3227
3228
|
const createSvgGradient = (svg, values) => svg.gradient('linear', add => {
|
|
3228
3229
|
values == null ? void 0 : values.forEach((_ref, index) => {
|
|
@@ -3241,7 +3242,7 @@ const manipulateSvgSymbol = _ref2 => {
|
|
|
3241
3242
|
symbol,
|
|
3242
3243
|
svg,
|
|
3243
3244
|
bg,
|
|
3244
|
-
|
|
3245
|
+
isClassified
|
|
3245
3246
|
} = _ref2;
|
|
3246
3247
|
if (!symbol) return SVGContainer;
|
|
3247
3248
|
const symbolData = getParameterValue(svg || symbol.data);
|
|
@@ -3292,9 +3293,9 @@ const manipulateSvgSymbol = _ref2 => {
|
|
|
3292
3293
|
SVGContainer.find(':not(#symbol-bg)').each(item => item.center(DEFAULT_SYMBOL_WITH_BG_SIZE / 2, DEFAULT_SYMBOL_WITH_BG_SIZE / 2).fill('white'));
|
|
3293
3294
|
const symbolBg = SVGContainer.find('#symbol-bg')[0];
|
|
3294
3295
|
|
|
3295
|
-
if (
|
|
3296
|
+
if (isClassified) {
|
|
3296
3297
|
symbolBg == null ? void 0 : symbolBg.stroke({
|
|
3297
|
-
opacity:
|
|
3298
|
+
opacity: DEFAULT_STROKE_OPACITY
|
|
3298
3299
|
});
|
|
3299
3300
|
} // eslint-disable-next-line max-depth
|
|
3300
3301
|
|
|
@@ -3302,15 +3303,15 @@ const manipulateSvgSymbol = _ref2 => {
|
|
|
3302
3303
|
if (isParameterByAttribute(background == null ? void 0 : background.fillColor)) {
|
|
3303
3304
|
var _background$fillColor;
|
|
3304
3305
|
|
|
3305
|
-
|
|
3306
|
-
|
|
3306
|
+
symbolBg == null ? void 0 : symbolBg.fill(createSvgGradient(SVGContainer, background == null ? void 0 : (_background$fillColor = background.fillColor) == null ? void 0 : _background$fillColor.values));
|
|
3307
|
+
}
|
|
3307
3308
|
|
|
3308
|
-
|
|
3309
|
-
|
|
3310
|
-
|
|
3311
|
-
|
|
3312
|
-
|
|
3313
|
-
}
|
|
3309
|
+
if (isParameterByAttribute(background == null ? void 0 : background.strokeColor)) {
|
|
3310
|
+
var _background$strokeCol;
|
|
3311
|
+
|
|
3312
|
+
symbolBg == null ? void 0 : symbolBg.stroke({
|
|
3313
|
+
color: createSvgGradient(SVGContainer, background == null ? void 0 : (_background$strokeCol = background.strokeColor) == null ? void 0 : _background$strokeCol.values)
|
|
3314
|
+
});
|
|
3314
3315
|
}
|
|
3315
3316
|
} else {
|
|
3316
3317
|
SVGContainer.svg(innerSvg);
|
|
@@ -3326,6 +3327,20 @@ const manipulateSvgSymbol = _ref2 => {
|
|
|
3326
3327
|
color: strokeColor,
|
|
3327
3328
|
width: strokeWidth
|
|
3328
3329
|
});
|
|
3330
|
+
|
|
3331
|
+
if (isParameterByAttribute(figure == null ? void 0 : figure.fillColor)) {
|
|
3332
|
+
var _figure$fillColor;
|
|
3333
|
+
|
|
3334
|
+
item == null ? void 0 : item.fill(createSvgGradient(SVGContainer, figure == null ? void 0 : (_figure$fillColor = figure.fillColor) == null ? void 0 : _figure$fillColor.values));
|
|
3335
|
+
}
|
|
3336
|
+
|
|
3337
|
+
if (isParameterByAttribute(figure == null ? void 0 : figure.strokeColor)) {
|
|
3338
|
+
var _figure$strokeColor;
|
|
3339
|
+
|
|
3340
|
+
item == null ? void 0 : item.stroke({
|
|
3341
|
+
color: createSvgGradient(SVGContainer, figure == null ? void 0 : (_figure$strokeColor = figure.strokeColor) == null ? void 0 : _figure$strokeColor.values)
|
|
3342
|
+
});
|
|
3343
|
+
}
|
|
3329
3344
|
});
|
|
3330
3345
|
}
|
|
3331
3346
|
}
|
|
@@ -5850,7 +5865,7 @@ const Fullscreen = () => {
|
|
|
5850
5865
|
}));
|
|
5851
5866
|
};
|
|
5852
5867
|
|
|
5853
|
-
var _templateObject$4, _templateObject2$4, _templateObject3$3, _templateObject4$3, _templateObject5$3, _templateObject6$2, _templateObject7$2, _templateObject8$2, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37;
|
|
5868
|
+
var _templateObject$4, _templateObject2$4, _templateObject3$3, _templateObject4$3, _templateObject5$3, _templateObject6$2, _templateObject7$2, _templateObject8$2, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38;
|
|
5854
5869
|
const MapLegendDescription = /*#__PURE__*/styled__default.div(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: 0.75rem;\n"])));
|
|
5855
5870
|
const ItemText = /*#__PURE__*/styled__default.div(_templateObject2$4 || (_templateObject2$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: calc(100% - 2rem);\n font: ", ";\n"])), _ref => {
|
|
5856
5871
|
let {
|
|
@@ -5862,7 +5877,7 @@ const ItemText = /*#__PURE__*/styled__default.div(_templateObject2$4 || (_templa
|
|
|
5862
5877
|
});
|
|
5863
5878
|
const ItemSeparator = /*#__PURE__*/styled__default.div(_templateObject3$3 || (_templateObject3$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n :after {\n content: '-';\n margin: 0 0.5rem;\n font-size: 0.75rem;\n }\n"])));
|
|
5864
5879
|
const SymbolContainer = /*#__PURE__*/styled__default('span')(_templateObject4$3 || (_templateObject4$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n min-width: 16px;\n margin-right: 0.5rem;\n"])));
|
|
5865
|
-
const ClassifiedItem = /*#__PURE__*/styled__default.div(_templateObject5$3 || (_templateObject5$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n cursor: ", ";\n pointer-events: ", ";\n\n :not(:last-of-type) {\n margin-bottom: 0.25rem;\n }\n\n ", ", ", " {\n transition: opacity 150ms;\n }\n\n ", " {\n opacity: ", ";\n }\n\n ", " {\n opacity: ", ";\n }\n\n :hover {\n ", ", ", " {\n opacity: 1;\n }\n }\n"])), _ref2 => {
|
|
5880
|
+
const ClassifiedItem = /*#__PURE__*/styled__default.div(_templateObject5$3 || (_templateObject5$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n cursor: ", ";\n pointer-events: ", ";\n\n :not(:last-of-type) {\n margin-bottom: 0.25rem;\n }\n\n ", ", ", " {\n transition: opacity 150ms;\n }\n\n ", " {\n opacity: ", ";\n }\n\n ", " {\n opacity: ", ";\n }\n\n :hover {\n ", ", ", " {\n opacity: 1;\n }\n }\n\n ", " {\n margin-left: 0.5rem;\n }\n"])), _ref2 => {
|
|
5866
5881
|
let {
|
|
5867
5882
|
isClusterFillColor
|
|
5868
5883
|
} = _ref2;
|
|
@@ -5882,7 +5897,7 @@ const ClassifiedItem = /*#__PURE__*/styled__default.div(_templateObject5$3 || (_
|
|
|
5882
5897
|
isHidden
|
|
5883
5898
|
} = _ref5;
|
|
5884
5899
|
return isHidden ? 0.28 : 1;
|
|
5885
|
-
}, ItemText, SymbolContainer);
|
|
5900
|
+
}, ItemText, SymbolContainer, icons.IconButton);
|
|
5886
5901
|
const SymbolButtonWithClick = /*#__PURE__*/styled.css(_templateObject6$2 || (_templateObject6$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 3.875rem;\n height: 3.875rem;\n cursor: pointer;\n\n &:hover {\n background-color: ", ";\n }\n"])), _ref6 => {
|
|
5887
5902
|
let {
|
|
5888
5903
|
theme: {
|
|
@@ -5918,28 +5933,36 @@ const MaximizedLegendContainer = /*#__PURE__*/styled__default.div(_templateObjec
|
|
|
5918
5933
|
return isShown ? 'visible' : 'hidden';
|
|
5919
5934
|
});
|
|
5920
5935
|
const MinimizedLegendContainer = /*#__PURE__*/styled__default(MaximizedLegendContainer)(_templateObject13$1 || (_templateObject13$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: calc(100% - 1.5rem);\n padding-right: 1.5rem;\n"])));
|
|
5921
|
-
const
|
|
5922
|
-
const
|
|
5936
|
+
const LegendHeaderButton = /*#__PURE__*/styled__default.span(_templateObject14$1 || (_templateObject14$1 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
5937
|
+
const MapLegendSectionContainer = /*#__PURE__*/styled__default.div(_templateObject15$1 || (_templateObject15$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n\n :not(:last-child) {\n margin-bottom: 1rem;\n }\n\n ", " {\n padding-left: 0.75rem;\n visibility: hidden;\n\n :first-child {\n padding-left: 1rem;\n }\n\n :last-child {\n margin-left: 0.75rem;\n border-left: 1px ", " solid;\n }\n }\n \n :hover {\n ", " {\n visibility: visible;\n }\n }\n"])), LegendHeaderButton, _ref11 => {
|
|
5938
|
+
let {
|
|
5939
|
+
theme: {
|
|
5940
|
+
palette
|
|
5941
|
+
}
|
|
5942
|
+
} = _ref11;
|
|
5943
|
+
return palette.elementDeep;
|
|
5944
|
+
}, LegendHeaderButton);
|
|
5945
|
+
const MapLegendSectionItems = /*#__PURE__*/styled__default.div(_templateObject16$1 || (_templateObject16$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: ", "px;\n overflow: ", ";\n transition: height 0.5s;\n"])), _ref12 => {
|
|
5923
5946
|
let {
|
|
5924
5947
|
minHeight,
|
|
5925
5948
|
maxHeight,
|
|
5926
5949
|
isExpanded
|
|
5927
|
-
} =
|
|
5950
|
+
} = _ref12;
|
|
5928
5951
|
return isExpanded ? (maxHeight || 0) + 4 : minHeight;
|
|
5929
|
-
},
|
|
5952
|
+
}, _ref13 => {
|
|
5930
5953
|
let {
|
|
5931
5954
|
isExpanded
|
|
5932
|
-
} =
|
|
5955
|
+
} = _ref13;
|
|
5933
5956
|
return isExpanded ? 'none' : 'hidden';
|
|
5934
5957
|
});
|
|
5935
|
-
const MapLegendValueDescr = /*#__PURE__*/styled__default.div(
|
|
5958
|
+
const MapLegendValueDescr = /*#__PURE__*/styled__default.div(_templateObject17 || (_templateObject17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n min-height: 1rem;\n margin-bottom: 0.25rem;\n font-size: 0.75rem;\n font-weight: 600;\n line-height: 1rem;\n"])));
|
|
5936
5959
|
|
|
5937
5960
|
const SizeLegendItemMixin = function SizeLegendItemMixin(value) {
|
|
5938
5961
|
if (value === void 0) {
|
|
5939
5962
|
value = 0;
|
|
5940
5963
|
}
|
|
5941
5964
|
|
|
5942
|
-
return styled.css(
|
|
5965
|
+
return styled.css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 0;\n left: 50%;\n display: flex;\n align-items: flex-end;\n flex: none;\n height: inherit;\n width: inherit;\n margin: 0 auto;\n background: none;\n border: none;\n\n :after {\n content: '';\n display: flex;\n border: 1px rgba(48, 69, 79, 0.28) solid;\n border-radius: 50%;\n margin: 0 0 0 -", "px;\n width: ", "px;\n height: ", "px;\n }\n"])), value / 2, value, value);
|
|
5943
5966
|
};
|
|
5944
5967
|
|
|
5945
5968
|
const StrokeWidthLegendItemMixin = function StrokeWidthLegendItemMixin(value) {
|
|
@@ -5947,82 +5970,82 @@ const StrokeWidthLegendItemMixin = function StrokeWidthLegendItemMixin(value) {
|
|
|
5947
5970
|
value = 0;
|
|
5948
5971
|
}
|
|
5949
5972
|
|
|
5950
|
-
return styled.css(
|
|
5973
|
+
return styled.css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteralLoose(["\n position: relative;\n background: none;\n border: none;\n display: flex;\n align-items: center;\n flex: none;\n width: calc(100% - 2rem);\n height: ", "px;\n margin: 0 0 0.25rem 0;\n padding-left: 2rem;\n font-size: 0.75rem;\n\n :first-child,\n :last-child {\n height: auto;\n }\n\n :after {\n content: '';\n position: absolute;\n top: 50%;\n left: 0;\n width: 1.5rem;\n height: ", "px;\n margin-top: -", "px;\n background: rgb(224, 224, 224);\n }\n"])), value, value, Math.round(value / 2));
|
|
5951
5974
|
};
|
|
5952
5975
|
|
|
5953
|
-
const StrokeColorLegendItemMixin = /*#__PURE__*/styled.css(
|
|
5954
|
-
const MapLegendItem = /*#__PURE__*/styled__default.div(
|
|
5976
|
+
const StrokeColorLegendItemMixin = /*#__PURE__*/styled.css(_templateObject20 || (_templateObject20 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 0.5rem;\n width: 1.5rem;\n"])));
|
|
5977
|
+
const MapLegendItem = /*#__PURE__*/styled__default.div(_templateObject21 || (_templateObject21 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: ", "rem;\n background: ", ";\n border: 1px rgba(48, 69, 79, 0.1) solid;\n margin-right: -1px;\n color: rgba(48, 69, 79, 0.65);\n opacity: ", ";\n\n ", "\n\n ", "\n"])), _ref14 => {
|
|
5955
5978
|
let {
|
|
5956
5979
|
parameter
|
|
5957
|
-
} =
|
|
5980
|
+
} = _ref14;
|
|
5958
5981
|
return isParameterType(['strokeColor', 'stroke.color'], parameter) ? 0.25 : 1;
|
|
5959
|
-
},
|
|
5982
|
+
}, _ref15 => {
|
|
5960
5983
|
let {
|
|
5961
5984
|
value
|
|
5962
|
-
} =
|
|
5985
|
+
} = _ref15;
|
|
5963
5986
|
return typeof value === 'number' ? 'none' : value;
|
|
5964
|
-
},
|
|
5987
|
+
}, _ref16 => {
|
|
5965
5988
|
let {
|
|
5966
5989
|
isHidden
|
|
5967
|
-
} =
|
|
5990
|
+
} = _ref16;
|
|
5968
5991
|
return isHidden ? 0.28 : 1;
|
|
5969
|
-
},
|
|
5992
|
+
}, _ref17 => {
|
|
5970
5993
|
let {
|
|
5971
5994
|
value,
|
|
5972
5995
|
parameter
|
|
5973
|
-
} =
|
|
5996
|
+
} = _ref17;
|
|
5974
5997
|
return isParameterType('size', parameter) && SizeLegendItemMixin(value);
|
|
5975
|
-
},
|
|
5998
|
+
}, _ref18 => {
|
|
5976
5999
|
let {
|
|
5977
6000
|
value,
|
|
5978
6001
|
parameter
|
|
5979
|
-
} =
|
|
6002
|
+
} = _ref18;
|
|
5980
6003
|
return isParameterType(['strokeWidth', 'stroke.width'], parameter) && StrokeWidthLegendItemMixin(value);
|
|
5981
6004
|
});
|
|
5982
|
-
const MapLegendOther = /*#__PURE__*/styled__default(MapLegendItem)(
|
|
5983
|
-
const SizeLegendItemsMixin = /*#__PURE__*/styled.css(
|
|
5984
|
-
const StrokeWidthLegendItemsMixin = /*#__PURE__*/styled.css(
|
|
5985
|
-
const SizeMinimizedLegend = /*#__PURE__*/styled__default.div(
|
|
5986
|
-
const SizeMinimizedLegendSymbol = /*#__PURE__*/styled__default.div(
|
|
5987
|
-
const SizeMinimizedLegendLabel = /*#__PURE__*/styled__default.div(
|
|
5988
|
-
const SizeMinimizedLegendDown = /*#__PURE__*/styled__default.div(
|
|
5989
|
-
const SizeMinimizedLegendUp = /*#__PURE__*/styled__default(SizeMinimizedLegendDown)(
|
|
5990
|
-
const SingleSizeLegendItemsMixin = /*#__PURE__*/styled.css(
|
|
5991
|
-
const SingleLegendItemsMixin = /*#__PURE__*/styled.css(
|
|
6005
|
+
const MapLegendOther = /*#__PURE__*/styled__default(MapLegendItem)(_templateObject22 || (_templateObject22 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n flex: none;\n position: relative;\n width: 1rem;\n margin-left: 0.25rem;\n border-radius: 0.125rem;\n"])));
|
|
6006
|
+
const SizeLegendItemsMixin = /*#__PURE__*/styled.css(_templateObject23 || (_templateObject23 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: 2rem;\n height: 2rem;\n margin: 0 auto;\n\n ", " {\n width: auto;\n margin-left: 0;\n }\n"])), MapLegendOther);
|
|
6007
|
+
const StrokeWidthLegendItemsMixin = /*#__PURE__*/styled.css(_templateObject24 || (_templateObject24 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n flex-direction: column;\n width: auto;\n\n ", " {\n width: calc(100% - 2rem);\n margin-left: 0;\n }\n"])), MapLegendOther);
|
|
6008
|
+
const SizeMinimizedLegend = /*#__PURE__*/styled__default.div(_templateObject25 || (_templateObject25 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: nowrap;\n align-items: center;\n margin: 0.5rem 0 0.25rem;\n"])));
|
|
6009
|
+
const SizeMinimizedLegendSymbol = /*#__PURE__*/styled__default.div(_templateObject26 || (_templateObject26 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 4rem;\n margin-right: 0.75rem;\n"])));
|
|
6010
|
+
const SizeMinimizedLegendLabel = /*#__PURE__*/styled__default.div(_templateObject27 || (_templateObject27 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: 9.75rem;\n font-size: 0.75rem;\n"])));
|
|
6011
|
+
const SizeMinimizedLegendDown = /*#__PURE__*/styled__default.div(_templateObject28 || (_templateObject28 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: rgba(48, 69, 79, 0.65);\n"])));
|
|
6012
|
+
const SizeMinimizedLegendUp = /*#__PURE__*/styled__default(SizeMinimizedLegendDown)(_templateObject29 || (_templateObject29 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
6013
|
+
const SingleSizeLegendItemsMixin = /*#__PURE__*/styled.css(_templateObject30 || (_templateObject30 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 4rem;\n margin-right: 0.75rem;\n\n ", ":after {\n margin: 0 auto;\n }\n"])), MapLegendItem);
|
|
6014
|
+
const SingleLegendItemsMixin = /*#__PURE__*/styled.css(_templateObject31 || (_templateObject31 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n justify-content: center;\n width: 2rem;\n height: auto;\n margin: 0;\n ", "\n\n ", " {\n position: relative;\n top: 0;\n left: 0;\n display: flex;\n align-content: center;\n justify-content: center;\n margin: 0;\n height: auto;\n width: auto;\n\n ", "\n }\n"])), _ref19 => {
|
|
5992
6015
|
let {
|
|
5993
6016
|
isSize
|
|
5994
|
-
} =
|
|
6017
|
+
} = _ref19;
|
|
5995
6018
|
return isSize && SingleSizeLegendItemsMixin;
|
|
5996
|
-
}, MapLegendItem,
|
|
6019
|
+
}, MapLegendItem, _ref20 => {
|
|
5997
6020
|
let {
|
|
5998
6021
|
parameter
|
|
5999
|
-
} =
|
|
6022
|
+
} = _ref20;
|
|
6000
6023
|
return isParameterType(['strokeColor', 'stroke.color'], parameter) && StrokeColorLegendItemMixin;
|
|
6001
6024
|
});
|
|
6002
|
-
const MapLegendItems = /*#__PURE__*/styled__default.div(
|
|
6025
|
+
const MapLegendItems = /*#__PURE__*/styled__default.div(_templateObject32 || (_templateObject32 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n width: 100%;\n border-radius: 0.125rem;\n\n ", ";\n ", ";\n ", ";\n"])), _ref21 => {
|
|
6003
6026
|
let {
|
|
6004
6027
|
isSize
|
|
6005
|
-
} =
|
|
6028
|
+
} = _ref21;
|
|
6006
6029
|
return isSize && SizeLegendItemsMixin;
|
|
6007
|
-
},
|
|
6030
|
+
}, _ref22 => {
|
|
6008
6031
|
let {
|
|
6009
6032
|
isStrokeWidth
|
|
6010
|
-
} =
|
|
6033
|
+
} = _ref22;
|
|
6011
6034
|
return isStrokeWidth && StrokeWidthLegendItemsMixin;
|
|
6012
|
-
},
|
|
6035
|
+
}, _ref23 => {
|
|
6013
6036
|
let {
|
|
6014
6037
|
isSingle
|
|
6015
|
-
} =
|
|
6038
|
+
} = _ref23;
|
|
6016
6039
|
return isSingle && SingleLegendItemsMixin;
|
|
6017
6040
|
});
|
|
6018
|
-
const MapLegendItemsContainer = /*#__PURE__*/styled__default.div(
|
|
6019
|
-
const MapLegendValues = /*#__PURE__*/styled__default.div(
|
|
6020
|
-
const MapLegendValuesRange = /*#__PURE__*/styled__default.div(
|
|
6021
|
-
const MapLegendValuesOther = /*#__PURE__*/styled__default(MapLegendOther)(
|
|
6022
|
-
const MapLegendExpandButton = /*#__PURE__*/styled__default.div(
|
|
6023
|
-
const ClusterLegendContainer = /*#__PURE__*/styled__default.div(
|
|
6024
|
-
|
|
6025
|
-
const useSvgSymbol = (symbol, skipOffset,
|
|
6041
|
+
const MapLegendItemsContainer = /*#__PURE__*/styled__default.div(_templateObject33 || (_templateObject33 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n width: 100%;\n\n ", " {\n :first-child {\n border-top-left-radius: 0.125rem;\n border-bottom-left-radius: 0.125rem;\n }\n\n :last-child {\n border-top-right-radius: 0.125rem;\n border-bottom-right-radius: 0.125rem;\n }\n }\n"])), MapLegendItem);
|
|
6042
|
+
const MapLegendValues = /*#__PURE__*/styled__default.div(_templateObject34 || (_templateObject34 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n width: 100%;\n margin-top: 0.5rem;\n font-size: 0.75rem;\n color: rgba(48, 69, 79, 0.65);\n"])));
|
|
6043
|
+
const MapLegendValuesRange = /*#__PURE__*/styled__default.div(_templateObject35 || (_templateObject35 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n width: calc(100% - 1.25rem);\n\n div {\n flex: 1;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n\n :first-child {\n margin-right: 0.5rem;\n }\n\n :last-child {\n margin-left: 0.5rem;\n text-align: right;\n }\n }\n"])));
|
|
6044
|
+
const MapLegendValuesOther = /*#__PURE__*/styled__default(MapLegendOther)(_templateObject36 || (_templateObject36 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n justify-content: center;\n border: 0;\n overflow: visible;\n"])));
|
|
6045
|
+
const MapLegendExpandButton = /*#__PURE__*/styled__default.div(_templateObject37 || (_templateObject37 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n margin-top: 0.1rem;\n font-size: 0.625rem;\n color: #1fb3aa;\n"])));
|
|
6046
|
+
const ClusterLegendContainer = /*#__PURE__*/styled__default.div(_templateObject38 || (_templateObject38 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: -0.9rem;\n transform: scale(0.5);\n"])));
|
|
6047
|
+
|
|
6048
|
+
const useSvgSymbol = (symbol, skipOffset, isClassified) => {
|
|
6026
6049
|
const SVGWrapperRefElement = React.useRef(null);
|
|
6027
6050
|
const SVGContainer = React.useMemo(() => svg_js.SVG(), []);
|
|
6028
6051
|
const initSvg = React.useCallback(() => {
|
|
@@ -6034,14 +6057,14 @@ const useSvgSymbol = (symbol, skipOffset, isClassifiedValue) => {
|
|
|
6034
6057
|
svg,
|
|
6035
6058
|
bg,
|
|
6036
6059
|
newSymbol,
|
|
6037
|
-
|
|
6060
|
+
isClassified
|
|
6038
6061
|
} = _ref;
|
|
6039
6062
|
manipulateSvgSymbol({
|
|
6040
6063
|
SVGContainer,
|
|
6041
6064
|
symbol: newSymbol || symbol,
|
|
6042
6065
|
svg,
|
|
6043
6066
|
bg,
|
|
6044
|
-
|
|
6067
|
+
isClassified
|
|
6045
6068
|
});
|
|
6046
6069
|
}, [SVGContainer, symbol]);
|
|
6047
6070
|
const getUpdatedSvgSymbol = React.useCallback((field, value) => {
|
|
@@ -6082,7 +6105,7 @@ const useSvgSymbol = (symbol, skipOffset, isClassifiedValue) => {
|
|
|
6082
6105
|
svg: getParameterValue(data),
|
|
6083
6106
|
newSymbol,
|
|
6084
6107
|
bg: (_newSymbol$background = newSymbol.background) == null ? void 0 : _newSymbol$background.type,
|
|
6085
|
-
|
|
6108
|
+
isClassified
|
|
6086
6109
|
});
|
|
6087
6110
|
return _extends({}, newSymbol, {
|
|
6088
6111
|
data: SVGContainer.svg()
|
|
@@ -6139,7 +6162,7 @@ const SvgSymbol = /*#__PURE__*/React.memo(_ref7 => {
|
|
|
6139
6162
|
text,
|
|
6140
6163
|
fontSettings,
|
|
6141
6164
|
skipOffset,
|
|
6142
|
-
|
|
6165
|
+
isClassified,
|
|
6143
6166
|
onClick
|
|
6144
6167
|
} = _ref7;
|
|
6145
6168
|
const {
|
|
@@ -6147,7 +6170,7 @@ const SvgSymbol = /*#__PURE__*/React.memo(_ref7 => {
|
|
|
6147
6170
|
initSvg,
|
|
6148
6171
|
getSvgData,
|
|
6149
6172
|
manipulateSvg
|
|
6150
|
-
} = useSvgSymbol(symbol, skipOffset,
|
|
6173
|
+
} = useSvgSymbol(symbol, skipOffset, isClassified);
|
|
6151
6174
|
const onSelectSymbol = React.useCallback(() => {
|
|
6152
6175
|
onClick == null ? void 0 : onClick(getSvgData(), _extends({}, symbol, bg ? {
|
|
6153
6176
|
background: _extends({}, symbol.background, {
|
|
@@ -6168,9 +6191,9 @@ const SvgSymbol = /*#__PURE__*/React.memo(_ref7 => {
|
|
|
6168
6191
|
svg,
|
|
6169
6192
|
bg,
|
|
6170
6193
|
newSymbol: symbol,
|
|
6171
|
-
|
|
6194
|
+
isClassified
|
|
6172
6195
|
});
|
|
6173
|
-
}, [svg, symbol, bg, manipulateSvg,
|
|
6196
|
+
}, [svg, symbol, bg, manipulateSvg, isClassified]);
|
|
6174
6197
|
return text ? React__default.createElement(SvgSymbolContainer, null, renderSymbol, React__default.createElement(SvgSymbolLabel, {
|
|
6175
6198
|
fontSettings: fontSettings
|
|
6176
6199
|
}, text), !!(fontSettings != null && fontSettings.haloColor) && !!(fontSettings != null && fontSettings.haloWidth) && React__default.createElement(SvgSymbolLabel, {
|
|
@@ -6210,7 +6233,7 @@ const ClusterSymbolPreview = _ref => {
|
|
|
6210
6233
|
return React__default.createElement(SvgSymbol, {
|
|
6211
6234
|
svg: DEFAULT_CLUSTER_SVG,
|
|
6212
6235
|
symbol: svgSymbol,
|
|
6213
|
-
|
|
6236
|
+
isClassified: isClassified,
|
|
6214
6237
|
text: '99',
|
|
6215
6238
|
fontSettings: _extends({}, symbol.labelSymbol, {
|
|
6216
6239
|
fontSize: fontSize || ((_symbol$labelSymbol = symbol.labelSymbol) == null ? void 0 : _symbol$labelSymbol.fontSize)
|
|
@@ -6267,6 +6290,21 @@ const LegendSymbolRenderer = /*#__PURE__*/React.memo(_ref => {
|
|
|
6267
6290
|
});
|
|
6268
6291
|
});
|
|
6269
6292
|
|
|
6293
|
+
const LegendHeaderButtons = _ref => {
|
|
6294
|
+
let {
|
|
6295
|
+
layerName,
|
|
6296
|
+
hasHiddenLegends,
|
|
6297
|
+
clearHiddenLegends,
|
|
6298
|
+
goToClassification
|
|
6299
|
+
} = _ref;
|
|
6300
|
+
return React__default.createElement(React__default.Fragment, null, !!goToClassification && React__default.createElement(LegendHeaderButton, null, React__default.createElement(icons.IconButton, {
|
|
6301
|
+
onClick: goToClassification
|
|
6302
|
+
}, React__default.createElement(icons.EverCloudClassificationIcon, null))), !!clearHiddenLegends && React__default.createElement(LegendHeaderButton, null, React__default.createElement(icons.IconButton, {
|
|
6303
|
+
disabled: !hasHiddenLegends,
|
|
6304
|
+
onClick: () => clearHiddenLegends == null ? void 0 : clearHiddenLegends(layerName)
|
|
6305
|
+
}, React__default.createElement(icons.EverCloudRefreshIcon, null))));
|
|
6306
|
+
};
|
|
6307
|
+
|
|
6270
6308
|
const getConditionAttribute = (attributes, condition) => {
|
|
6271
6309
|
if (!condition) return null;
|
|
6272
6310
|
const attributeName = getAttributeNameFromCondition(condition);
|
|
@@ -6339,6 +6377,7 @@ const LegendChildren = _ref => {
|
|
|
6339
6377
|
layerInfo,
|
|
6340
6378
|
hiddenLegends,
|
|
6341
6379
|
toggleHiddenLegend,
|
|
6380
|
+
clearHiddenLegends,
|
|
6342
6381
|
formatValue
|
|
6343
6382
|
} = _ref;
|
|
6344
6383
|
if (!((_layerInfo$style = layerInfo.style) != null && (_layerInfo$style$chil = _layerInfo$style.children) != null && _layerInfo$style$chil.length)) return null;
|
|
@@ -6364,7 +6403,10 @@ const LegendChildren = _ref => {
|
|
|
6364
6403
|
onClick: () => toggleHiddenLegend == null ? void 0 : toggleHiddenLegend(layerInfo.name, hiddenCondition)
|
|
6365
6404
|
}, React__default.createElement(SymbolContainer, null, React__default.createElement(LegendSymbolRenderer, {
|
|
6366
6405
|
symbol: paramValue.symbol
|
|
6367
|
-
})), legendText
|
|
6406
|
+
})), legendText, React__default.createElement(LegendHeaderButtons, {
|
|
6407
|
+
layerName: layerInfo.name,
|
|
6408
|
+
clearHiddenLegends: clearHiddenLegends
|
|
6409
|
+
}));
|
|
6368
6410
|
}));
|
|
6369
6411
|
};
|
|
6370
6412
|
|
|
@@ -6520,6 +6562,8 @@ const MaximizedLegend = _ref => {
|
|
|
6520
6562
|
};
|
|
6521
6563
|
|
|
6522
6564
|
const LegendSection = _ref => {
|
|
6565
|
+
var _hiddenLegends$layerN, _hiddenLegends$layerN2;
|
|
6566
|
+
|
|
6523
6567
|
let {
|
|
6524
6568
|
layerName,
|
|
6525
6569
|
symbol,
|
|
@@ -6528,6 +6572,8 @@ const LegendSection = _ref => {
|
|
|
6528
6572
|
classified,
|
|
6529
6573
|
hiddenLegends,
|
|
6530
6574
|
toggleHiddenLegend,
|
|
6575
|
+
clearHiddenLegends,
|
|
6576
|
+
goToClassification,
|
|
6531
6577
|
attribute,
|
|
6532
6578
|
formatValue,
|
|
6533
6579
|
index
|
|
@@ -6535,8 +6581,15 @@ const LegendSection = _ref => {
|
|
|
6535
6581
|
const [isExpanded, toggleExpanded] = useToggle();
|
|
6536
6582
|
const [maxRef, maxNode] = useNode();
|
|
6537
6583
|
const [minRef, minNode] = useNode();
|
|
6538
|
-
if (!attribute) return null;
|
|
6539
|
-
return React__default.createElement(MapLegendSectionContainer,
|
|
6584
|
+
if (!layerName || !attribute) return null;
|
|
6585
|
+
return React__default.createElement(MapLegendSectionContainer, {
|
|
6586
|
+
hasHiddenLegends: !!(hiddenLegends != null && (_hiddenLegends$layerN = hiddenLegends[layerName]) != null && _hiddenLegends$layerN.length)
|
|
6587
|
+
}, React__default.createElement(MapLegendHeader, null, attribute.alias || attribute.name, React__default.createElement(LegendHeaderButtons, {
|
|
6588
|
+
layerName: layerName,
|
|
6589
|
+
hasHiddenLegends: !!(hiddenLegends != null && (_hiddenLegends$layerN2 = hiddenLegends[layerName]) != null && _hiddenLegends$layerN2.length),
|
|
6590
|
+
clearHiddenLegends: clearHiddenLegends,
|
|
6591
|
+
goToClassification: goToClassification
|
|
6592
|
+
})), React__default.createElement(LegendParameterDescription, {
|
|
6540
6593
|
parameter: parameter
|
|
6541
6594
|
}), React__default.createElement(MapLegendSectionItems, {
|
|
6542
6595
|
minHeight: minNode == null ? void 0 : minNode.offsetHeight,
|
|
@@ -6564,7 +6617,7 @@ const LegendSection = _ref => {
|
|
|
6564
6617
|
}, isExpanded ? 'Свернуть' : 'Развернуть'));
|
|
6565
6618
|
};
|
|
6566
6619
|
|
|
6567
|
-
const _excluded$3 = ["layerInfo", "formatValue", "hiddenLegends", "toggleHiddenLegend"];
|
|
6620
|
+
const _excluded$3 = ["layerInfo", "formatValue", "hiddenLegends", "toggleHiddenLegend", "clearHiddenLegends", "goToClassification"];
|
|
6568
6621
|
const Legend = /*#__PURE__*/React.memo(_ref => {
|
|
6569
6622
|
var _layerInfo$style, _layerInfo$style$chil;
|
|
6570
6623
|
|
|
@@ -6572,7 +6625,9 @@ const Legend = /*#__PURE__*/React.memo(_ref => {
|
|
|
6572
6625
|
layerInfo,
|
|
6573
6626
|
formatValue,
|
|
6574
6627
|
hiddenLegends,
|
|
6575
|
-
toggleHiddenLegend
|
|
6628
|
+
toggleHiddenLegend,
|
|
6629
|
+
clearHiddenLegends,
|
|
6630
|
+
goToClassification
|
|
6576
6631
|
} = _ref,
|
|
6577
6632
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
|
|
6578
6633
|
|
|
@@ -6581,7 +6636,9 @@ const Legend = /*#__PURE__*/React.memo(_ref => {
|
|
|
6581
6636
|
layerInfo: layerInfo,
|
|
6582
6637
|
formatValue: formatValue,
|
|
6583
6638
|
hiddenLegends: hiddenLegends,
|
|
6584
|
-
toggleHiddenLegend: toggleHiddenLegend
|
|
6639
|
+
toggleHiddenLegend: toggleHiddenLegend,
|
|
6640
|
+
clearHiddenLegends: clearHiddenLegends,
|
|
6641
|
+
goToClassification: goToClassification
|
|
6585
6642
|
});
|
|
6586
6643
|
}
|
|
6587
6644
|
|
|
@@ -6603,7 +6660,9 @@ const Legend = /*#__PURE__*/React.memo(_ref => {
|
|
|
6603
6660
|
index: index,
|
|
6604
6661
|
formatValue: formatValue,
|
|
6605
6662
|
hiddenLegends: hiddenLegends,
|
|
6606
|
-
toggleHiddenLegend: toggleHiddenLegend
|
|
6663
|
+
toggleHiddenLegend: toggleHiddenLegend,
|
|
6664
|
+
clearHiddenLegends: clearHiddenLegends,
|
|
6665
|
+
goToClassification: goToClassification
|
|
6607
6666
|
}, rest));
|
|
6608
6667
|
}));
|
|
6609
6668
|
});
|
|
@@ -7078,6 +7137,7 @@ exports.ItemText = ItemText;
|
|
|
7078
7137
|
exports.LabelSymbol = LabelSymbol;
|
|
7079
7138
|
exports.Legend = Legend;
|
|
7080
7139
|
exports.LegendChildren = LegendChildren;
|
|
7140
|
+
exports.LegendHeaderButton = LegendHeaderButton;
|
|
7081
7141
|
exports.LegendParameterDescription = LegendParameterDescription;
|
|
7082
7142
|
exports.LegendProvider = LegendProvider;
|
|
7083
7143
|
exports.LegendSection = LegendSection;
|