@evergis/react 2.0.193 → 2.0.194
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/hooks/useSvgSymbol.d.ts +4 -4
- package/dist/react.cjs.development.js +31 -22
- 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 +31 -22
- package/dist/react.esm.js.map +1 -1
- package/dist/utils/svg.d.ts +3 -3
- package/package.json +2 -2
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { Color } from
|
|
3
|
-
import { SvgEditorField, SvgSymbolBg } from
|
|
4
|
-
import { SvgPointSymbol } from
|
|
2
|
+
import { Color } from '@evergis/color/es/Color';
|
|
3
|
+
import { SvgEditorField, SvgSymbolBg } from '../types';
|
|
4
|
+
import { SvgPointSymbol } from '../../../core';
|
|
5
5
|
export declare const useSvgSymbol: (symbol: SvgPointSymbol, skipOffset?: 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, }: {
|
|
10
10
|
svg: string;
|
|
11
11
|
bg?: SvgSymbolBg | undefined;
|
|
12
12
|
newSymbol?: import("../../../core").ClientSymbol<"svgPointSymbol", import("@evergis/api").SvgPointSymbolDc, never> | undefined;
|
|
@@ -2592,7 +2592,7 @@ const getTitleFromCondition = _ref2 => {
|
|
|
2592
2592
|
} = _ref2;
|
|
2593
2593
|
const parts = condition == null ? void 0 : condition.split(' == ');
|
|
2594
2594
|
const uniqueValue = (parts == null ? void 0 : (_parts$ = parts[1]) == null ? void 0 : _parts$.slice(1, -1)) || '';
|
|
2595
|
-
return attribute && formatValue ? formatValue(attribute.type, uniqueValue, attribute.stringFormat) :
|
|
2595
|
+
return attribute && formatValue ? formatValue(attribute.type, uniqueValue, attribute.stringFormat) : uniqueValue;
|
|
2596
2596
|
};
|
|
2597
2597
|
function createValueTitleFromCondition(paramValue, attribute, formatValue, index) {
|
|
2598
2598
|
if (!attribute) return '';
|
|
@@ -3222,7 +3222,7 @@ const textComparisonOperators = [...BASE_OPERATORS, ...CONTAINS_OPERATORS, ...ST
|
|
|
3222
3222
|
})(exports.SvgSymbolBg || (exports.SvgSymbolBg = {}));
|
|
3223
3223
|
|
|
3224
3224
|
const convertSvgToBase64 = svg => "data:image/svg+xml;base64," + window.btoa(svg);
|
|
3225
|
-
const createSvgGradient = (svg, values) => svg.gradient(
|
|
3225
|
+
const createSvgGradient = (svg, values) => svg.gradient('linear', add => {
|
|
3226
3226
|
values == null ? void 0 : values.forEach((_ref, index) => {
|
|
3227
3227
|
let {
|
|
3228
3228
|
value
|
|
@@ -3244,8 +3244,8 @@ const manipulateSvgSymbol = (SVGContainer, symbol, svg, bg) => {
|
|
|
3244
3244
|
background,
|
|
3245
3245
|
figure
|
|
3246
3246
|
} = symbol;
|
|
3247
|
-
const isUploadedFile = !bg && !symbolData.includes(
|
|
3248
|
-
const innerSvg = symbolData.replace(/<\?xml[^?]*\?>|<svg[^>]*>|<\/svg>/g,
|
|
3247
|
+
const isUploadedFile = !bg && !symbolData.includes('symbol-bg') && !symbolData.includes('symbol-figure');
|
|
3248
|
+
const innerSvg = symbolData.replace(/<\?xml[^?]*\?>|<svg[^>]*>|<\/svg>/g, '');
|
|
3249
3249
|
|
|
3250
3250
|
if (isUploadedFile) {
|
|
3251
3251
|
var _$exec;
|
|
@@ -3259,11 +3259,11 @@ const manipulateSvgSymbol = (SVGContainer, symbol, svg, bg) => {
|
|
|
3259
3259
|
|
|
3260
3260
|
SVGContainer.size(size);
|
|
3261
3261
|
} else {
|
|
3262
|
-
const hasBg = bg || (innerSvg == null ? void 0 : innerSvg.includes(
|
|
3262
|
+
const hasBg = bg || (innerSvg == null ? void 0 : innerSvg.includes('symbol-bg'));
|
|
3263
3263
|
let defaultSize = hasBg ? DEFAULT_SYMBOL_WITH_BG_SIZE : DEFAULT_SYMBOL_SIZE;
|
|
3264
3264
|
const currentSize = size || defaultSize;
|
|
3265
3265
|
let viewBox = [0, 0, defaultSize, defaultSize];
|
|
3266
|
-
const strokeWidth = getParameterValue(background == null ? void 0 : background.strokeWidth) || (typeof (background == null ? void 0 : background.strokeColor) ===
|
|
3266
|
+
const strokeWidth = getParameterValue(background == null ? void 0 : background.strokeWidth) || (typeof (background == null ? void 0 : background.strokeColor) === 'object' ? 1 : 0);
|
|
3267
3267
|
|
|
3268
3268
|
if (strokeWidth) {
|
|
3269
3269
|
defaultSize += strokeWidth;
|
|
@@ -3271,7 +3271,7 @@ const manipulateSvgSymbol = (SVGContainer, symbol, svg, bg) => {
|
|
|
3271
3271
|
}
|
|
3272
3272
|
|
|
3273
3273
|
if (hasBg) {
|
|
3274
|
-
SVGContainer.size(currentSize + "px", currentSize + "px").viewbox(viewBox.join(
|
|
3274
|
+
SVGContainer.size(currentSize + "px", currentSize + "px").viewbox(viewBox.join(' '));
|
|
3275
3275
|
const currentBg = bg || (background == null ? void 0 : background.type);
|
|
3276
3276
|
|
|
3277
3277
|
if (currentBg) {
|
|
@@ -3279,23 +3279,32 @@ const manipulateSvgSymbol = (SVGContainer, symbol, svg, bg) => {
|
|
|
3279
3279
|
const fillColor = getParameterValue(background == null ? void 0 : background.fillColor);
|
|
3280
3280
|
SVGContainer.svg(currentBg === exports.SvgSymbolBg.Circle ? "<circle\n id=\"symbol-bg\"\n cx=\"" + DEFAULT_SYMBOL_WITH_BG_SIZE / 2 + "\"\n cy=\"" + DEFAULT_SYMBOL_WITH_BG_SIZE / 2 + "\"\n r=\"" + DEFAULT_SYMBOL_WITH_BG_SIZE / 2 + "\"\n fill=\"" + (fillColor || DEFAULT_SYMBOL_FILL_COLOR) + "\"\n stroke=\"" + (strokeColor || DEFAULT_SYMBOL_STROKE_COLOR) + "\"\n stroke-width=\"" + strokeWidth + "\"\n />" : "<rect\n id=\"symbol-bg\"\n width=\"" + DEFAULT_SYMBOL_WITH_BG_SIZE + "\"\n height=\"" + DEFAULT_SYMBOL_WITH_BG_SIZE + "\"\n rx=\"4\"\n fill=\"" + (fillColor || DEFAULT_SYMBOL_FILL_COLOR) + "\"\n stroke=\"" + (strokeColor || DEFAULT_SYMBOL_STROKE_COLOR) + "\"\n stroke-width=\"" + strokeWidth + "\"\n />");
|
|
3281
3281
|
SVGContainer.svg(innerSvg);
|
|
3282
|
-
SVGContainer.find(
|
|
3283
|
-
SVGContainer.find(
|
|
3282
|
+
SVGContainer.find('#symbol-bg:not(:first-child)').each(item => item.remove());
|
|
3283
|
+
SVGContainer.find(':not(#symbol-bg)').each(item => item.center(DEFAULT_SYMBOL_WITH_BG_SIZE / 2, DEFAULT_SYMBOL_WITH_BG_SIZE / 2).fill('white')); // eslint-disable-next-line max-depth
|
|
3284
3284
|
|
|
3285
3285
|
if (isParameterByAttribute(background == null ? void 0 : background.fillColor)) {
|
|
3286
3286
|
var _background$fillColor, _SVGContainer$find$;
|
|
3287
3287
|
|
|
3288
3288
|
const gradient = createSvgGradient(SVGContainer, background == null ? void 0 : (_background$fillColor = background.fillColor) == null ? void 0 : _background$fillColor.values);
|
|
3289
|
-
(_SVGContainer$find$ = SVGContainer.find(
|
|
3289
|
+
(_SVGContainer$find$ = SVGContainer.find('#symbol-bg')[0]) == null ? void 0 : _SVGContainer$find$.fill(gradient);
|
|
3290
|
+
|
|
3291
|
+
if (isParameterByAttribute(background == null ? void 0 : background.strokeColor)) {
|
|
3292
|
+
var _SVGContainer$find$2;
|
|
3293
|
+
|
|
3294
|
+
(_SVGContainer$find$2 = SVGContainer.find('#symbol-bg')[0]) == null ? void 0 : _SVGContainer$find$2.stroke({
|
|
3295
|
+
color: gradient,
|
|
3296
|
+
opacity: 0.28
|
|
3297
|
+
});
|
|
3298
|
+
}
|
|
3290
3299
|
}
|
|
3291
3300
|
} else {
|
|
3292
3301
|
SVGContainer.svg(innerSvg);
|
|
3293
3302
|
}
|
|
3294
3303
|
} else {
|
|
3295
3304
|
const fillColor = getParameterValue(figure == null ? void 0 : figure.fillColor);
|
|
3296
|
-
SVGContainer.size(currentSize + "px", currentSize + "px").viewbox(viewBox.join(
|
|
3305
|
+
SVGContainer.size(currentSize + "px", currentSize + "px").viewbox(viewBox.join(' '));
|
|
3297
3306
|
SVGContainer.svg(innerSvg);
|
|
3298
|
-
SVGContainer.find(
|
|
3307
|
+
SVGContainer.find('#symbol-figure').each(item => {
|
|
3299
3308
|
item.center(DEFAULT_SYMBOL_SIZE / 2, DEFAULT_SYMBOL_SIZE / 2).fill(fillColor || DEFAULT_SYMBOL_FILL_COLOR);
|
|
3300
3309
|
});
|
|
3301
3310
|
}
|
|
@@ -3304,13 +3313,13 @@ const manipulateSvgSymbol = (SVGContainer, symbol, svg, bg) => {
|
|
|
3304
3313
|
const rootTransform = (_$exec2 = /<svg[^>]*transform="([^"]+)"/g.exec(symbolData)) == null ? void 0 : _$exec2[1];
|
|
3305
3314
|
|
|
3306
3315
|
if (rootTransform) {
|
|
3307
|
-
const transformParts = rootTransform.slice(0, -1).split(
|
|
3316
|
+
const transformParts = rootTransform.slice(0, -1).split('(');
|
|
3308
3317
|
SVGContainer.transform({
|
|
3309
|
-
[transformParts[0]]: transformParts[1].split(
|
|
3318
|
+
[transformParts[0]]: transformParts[1].split(',')
|
|
3310
3319
|
});
|
|
3311
3320
|
}
|
|
3312
3321
|
|
|
3313
|
-
const rotatedAngle = SVGContainer.transform(
|
|
3322
|
+
const rotatedAngle = SVGContainer.transform('rotate');
|
|
3314
3323
|
|
|
3315
3324
|
if (rotatedAngle) {
|
|
3316
3325
|
SVGContainer.rotate(-rotatedAngle, 0, 0);
|
|
@@ -6097,27 +6106,27 @@ const useSvgSymbol = (symbol, skipOffset) => {
|
|
|
6097
6106
|
data,
|
|
6098
6107
|
offset
|
|
6099
6108
|
} = symbol;
|
|
6100
|
-
const newValue = value instanceof Color.Color ? value.toString(
|
|
6109
|
+
const newValue = value instanceof Color.Color ? value.toString('rgba') : value;
|
|
6101
6110
|
|
|
6102
6111
|
const newSymbol = _extends({}, JSON.parse(JSON.stringify(symbol)), {
|
|
6103
6112
|
offset: skipOffset ? DEFAULT_SYMBOL_OFFSET : isSizeClassification(field) ? getOffsetParameterValue(offset) : offset
|
|
6104
6113
|
});
|
|
6105
6114
|
|
|
6106
|
-
if (field.indexOf(
|
|
6115
|
+
if (field.indexOf('.') !== -1) {
|
|
6107
6116
|
var _newSymbol$parts$;
|
|
6108
6117
|
|
|
6109
|
-
const parts = field.split(
|
|
6118
|
+
const parts = field.split('.');
|
|
6110
6119
|
|
|
6111
6120
|
if ((_newSymbol$parts$ = newSymbol[parts[0]]) != null && _newSymbol$parts$[parts[1]]) {
|
|
6112
6121
|
newSymbol[parts[0]][parts[1]] = newValue;
|
|
6113
6122
|
} else {
|
|
6114
6123
|
newSymbol[parts[0]] = _extends({}, newSymbol[parts[0]], {
|
|
6115
6124
|
[parts[1]]: newValue
|
|
6116
|
-
}, parts[0] ===
|
|
6125
|
+
}, parts[0] === 'background' ? {
|
|
6117
6126
|
type: newSymbol.background.type,
|
|
6118
|
-
id:
|
|
6119
|
-
} : parts[0] ===
|
|
6120
|
-
id:
|
|
6127
|
+
id: 'symbol-bg'
|
|
6128
|
+
} : parts[0] === 'figure' ? {
|
|
6129
|
+
id: 'symbol-figure'
|
|
6121
6130
|
} : {});
|
|
6122
6131
|
}
|
|
6123
6132
|
} else {
|