@visactor/vrender-components 1.1.4-alpha.0 → 1.1.4-alpha.2

package/es/jsx/index.js

@@ -1,2 +1,2 @@
 export * from "./component-type";
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/es/label/arc.js

@@ -508,4 +508,4 @@ ArcLabel.defaultAttributes = {
 export const registerArcDataLabel = () => {
     registerLabelComponent("arc", ArcLabel);
 };
-//# sourceMappingURL=arc.js.map
+//# sourceMappingURL=arc.js.map

package/es/label/base.js

@@ -648,4 +648,4 @@ LabelBase.defaultAttributes = {
     offset: 0,
     pickable: !1
 };
-//# sourceMappingURL=base.js.map
+//# sourceMappingURL=base.js.map

package/es/label/data-label-register.js

@@ -5,4 +5,4 @@ export const registerLabelComponent = (type, LabelClass) => {
 };
 
 export const getLabelComponent = type => labelComponentMap[type];
-//# sourceMappingURL=data-label-register.js.map
+//# sourceMappingURL=data-label-register.js.map

package/es/label/dataLabel.js

@@ -113,4 +113,4 @@ export class DataLabel extends AbstractComponent {
 DataLabel.defaultAttributes = {
     pickable: !1
 };
-//# sourceMappingURL=dataLabel.js.map
+//# sourceMappingURL=dataLabel.js.map

package/es/legend/discrete/discrete.d.ts

@@ -15,6 +15,7 @@ export declare class DiscreteLegend extends LegendBase<DiscreteLegendAttrs> {
     private _itemContext;
     private _scrollMask;
     private _scrollMaskContext;
+    private _stateDefinitionsCache;
     static defaultAttributes: Partial<DiscreteLegendAttrs>;
     constructor(attributes: DiscreteLegendAttrs, options?: ComponentOptions);
     render(): void;

package/es/legend/discrete/discrete.js

@@ -10,6 +10,8 @@ var __rest = this && this.__rest || function(s, e) {
 
 import { merge, isEmpty, normalizePadding, get, isValid, isNil, isFunction, isArray, minInArray, throttle, isNumberClose, clamp, isObject } from "@visactor/vutils";
 
+import { StateDefinitionCompiler } from "@visactor/vrender-core";
+
 import { graphicCreator } from "../../util/graphic-creator";
 
 import { LegendBase } from "../base";
@@ -40,7 +42,8 @@ export class DiscreteLegend extends LegendBase {
     constructor(attributes, options) {
         super((null == options ? void 0 : options.skipDefault) ? attributes : merge({}, DiscreteLegend.defaultAttributes, attributes)), 
         this.name = "discreteLegend", this._itemsContainer = null, this._itemHeightByUser = void 0, 
-        this._itemHeight = 0, this._itemMaxWidth = 0, this._contentMaxHeight = 0, this._onHover = e => {
+        this._itemHeight = 0, this._itemMaxWidth = 0, this._contentMaxHeight = 0, this._stateDefinitionsCache = new WeakMap, 
+        this._onHover = e => {
             const target = e.target;
             if (target && target.name && target.name.startsWith(LEGEND_ELEMENT_NAME.item)) {
                 const legendItem = target.delegate;
@@ -88,7 +91,7 @@ export class DiscreteLegend extends LegendBase {
         };
     }
     render() {
-        super.render(), this._lastActiveItem = null;
+        this._stateDefinitionsCache = new WeakMap, super.render(), this._lastActiveItem = null;
     }
     setSelected(selectedData) {
         var _a;
@@ -206,7 +209,7 @@ export class DiscreteLegend extends LegendBase {
         }), this._appendDataToShape(itemGroup, LEGEND_ELEMENT_NAME.item, item, itemGroup)) : (itemGroup = graphicCreator.group(Object.assign({
             x: 0,
             y: 0
-        }, backgroundStyle.style)), this._appendDataToShape(itemGroup, LEGEND_ELEMENT_NAME.item, item, itemGroup, backgroundStyle.state)), 
+        }, backgroundStyle.style)), this._appendDataToShape(itemGroup, LEGEND_ELEMENT_NAME.item, item, itemGroup, backgroundStyle.state, backgroundStyle.reuseStateDefinitions)), 
         itemGroup.id = `${null != id ? id : label}-${index}`, itemGroup.addState(isSelected ? LegendStateValue.selected : LegendStateValue.unSelected);
         const innerGroup = graphicCreator.group({
             x: 0,
@@ -223,12 +226,14 @@ export class DiscreteLegend extends LegendBase {
                 y: 0,
                 symbolType: "circle",
                 strokeBoundsBuffer: 0
-            }, shape), shapeStyle.style));
-            Object.keys(shapeStyle.state || {}).forEach((key => {
-                const color = shapeStyle.state[key].fill || shapeStyle.state[key].stroke;
-                shape.fill && isNil(shapeStyle.state[key].fill) && color && (shapeStyle.state[key].fill = color), 
-                shape.stroke && isNil(shapeStyle.state[key].stroke) && color && (shapeStyle.state[key].stroke = color);
-            })), this._appendDataToShape(itemShape, LEGEND_ELEMENT_NAME.itemShape, item, itemGroup, shapeStyle.state), 
+            }, shape), shapeStyle.style)), shapeStateNeedsItemColor = Object.keys(shapeStyle.state || {}).some((key => {
+                const state = shapeStyle.state[key];
+                return !!(state.fill || state.stroke) && (!!shape.fill && isNil(state.fill) || !!shape.stroke && isNil(state.stroke));
+            })), shapeStates = shapeStateNeedsItemColor ? merge({}, shapeStyle.state) : shapeStyle.state;
+            Object.keys(shapeStates || {}).forEach((key => {
+                const state = shapeStates[key], color = state.fill || state.stroke;
+                shape.fill && isNil(state.fill) && color && (state.fill = color), shape.stroke && isNil(state.stroke) && color && (state.stroke = color);
+            })), this._appendDataToShape(itemShape, LEGEND_ELEMENT_NAME.itemShape, item, itemGroup, shapeStates, !shapeStateNeedsItemColor && !1 !== shapeStyle.reuseStateDefinitions), 
             itemShape.addState(isSelected ? LegendStateValue.selected : LegendStateValue.unSelected), 
             innerGroup.add(itemShape);
         }
@@ -256,7 +261,7 @@ export class DiscreteLegend extends LegendBase {
             text: text,
             _originText: labelAttr.formatMethod ? label : void 0
         }), labelShape = createTextGraphicByType(labelAttributes);
-        this._appendDataToShape(labelShape, LEGEND_ELEMENT_NAME.itemLabel, item, itemGroup, labelStyle.state), 
+        this._appendDataToShape(labelShape, LEGEND_ELEMENT_NAME.itemLabel, item, itemGroup, labelStyle.state, labelStyle.reuseStateDefinitions), 
         labelShape.addState(isSelected ? LegendStateValue.selected : LegendStateValue.unSelected), 
         innerGroup.add(labelShape);
         const labelSpace = get(labelAttr, "space", DEFAULT_LABEL_SPACE);
@@ -271,7 +276,7 @@ export class DiscreteLegend extends LegendBase {
                 text: valueText,
                 _originText: valueAttr.formatMethod ? value : void 0
             }), valueShape = createTextGraphicByType(valueAttributes);
-            if (this._appendDataToShape(valueShape, LEGEND_ELEMENT_NAME.itemValue, item, itemGroup, valueStyle.state), 
+            if (this._appendDataToShape(valueShape, LEGEND_ELEMENT_NAME.itemValue, item, itemGroup, valueStyle.state, valueStyle.reuseStateDefinitions), 
             valueShape.addState(isSelected ? LegendStateValue.selected : LegendStateValue.unSelected), 
             this._itemWidthByUser) {
                 const layoutWidth = this._itemWidthByUser - parsedPadding[1] - parsedPadding[3] - shapeSize - shapeSpace - labelSpace - focusSpace - valueSpace;
@@ -342,20 +347,25 @@ export class DiscreteLegend extends LegendBase {
         }));
     }
     _updatePositionOfPager(renderStartY, compWidth, compHeight) {
-        const {pager: pager} = this.attribute, {totalPage: totalPage, isHorizontal: isHorizontal} = this._itemContext, position = pager && pager.position || "middle";
+        var _a;
+        const {pager: pager} = this.attribute, {totalPage: totalPage, isHorizontal: isHorizontal} = this._itemContext, position = pager && pager.position || "middle", hugContent = !(!pager || !pager.hugContent), pagerSpace = null !== (_a = pager && pager.space) && void 0 !== _a ? _a : DEFAULT_PAGER_SPACE;
         if (this._pagerComponent.setTotal(totalPage), isHorizontal) {
             let y;
-            y = "start" === position ? renderStartY : "end" === position ? renderStartY + compHeight - this._pagerComponent.AABBBounds.height() / 2 : renderStartY + compHeight / 2 - this._pagerComponent.AABBBounds.height() / 2, 
+            y = "start" === position ? renderStartY : "end" === position ? renderStartY + compHeight - this._pagerComponent.AABBBounds.height() / 2 : renderStartY + compHeight / 2 - this._pagerComponent.AABBBounds.height() / 2;
+            let x = compWidth - this._pagerComponent.AABBBounds.width();
+            hugContent && (x = Math.max(0, Math.min(this._itemsContainer.AABBBounds.width() + pagerSpace, x))), 
             this._pagerComponent.setAttributes({
-                x: compWidth - this._pagerComponent.AABBBounds.width(),
+                x: x,
                 y: y
             });
         } else {
             let x;
-            x = "start" === position ? 0 : "end" === position ? compWidth - this._pagerComponent.AABBBounds.width() : (compWidth - this._pagerComponent.AABBBounds.width()) / 2, 
+            x = "start" === position ? 0 : "end" === position ? compWidth - this._pagerComponent.AABBBounds.width() : (compWidth - this._pagerComponent.AABBBounds.width()) / 2;
+            let y = compHeight - this._pagerComponent.AABBBounds.height();
+            hugContent && (y = Math.max(0, Math.min(renderStartY + this._itemsContainer.AABBBounds.height() + pagerSpace, y))), 
             this._pagerComponent.setAttributes({
                 x: x,
-                y: compHeight - this._pagerComponent.AABBBounds.height()
+                y: y
             });
         }
     }
@@ -459,11 +469,14 @@ export class DiscreteLegend extends LegendBase {
             this._itemContext.totalPage = total, this._updatePositionOfPager(renderStartY, compWidth, compHeight);
         }
         defaultCurrent > 1 && (isHorizontal ? itemsContainer.setAttribute("y", -(defaultCurrent - 1) * (compHeight + spaceRow)) : itemsContainer.setAttribute("x", -(defaultCurrent - 1) * (compWidth + spaceCol)));
+        const hugContent = !!pager.hugContent;
+        let clipWidth = isHorizontal ? contentWidth : compWidth, clipHeight = isHorizontal ? compHeight : contentHeight;
+        hugContent && (isHorizontal ? clipWidth = Math.max(0, Math.min(clipWidth, itemsContainer.AABBBounds.width())) : clipHeight = Math.max(0, Math.min(clipHeight, itemsContainer.AABBBounds.height())));
         const clipGroup = graphicCreator.group({
             x: 0,
             y: renderStartY,
-            width: isHorizontal ? contentWidth : compWidth,
-            height: isHorizontal ? compHeight : contentHeight,
+            width: clipWidth,
+            height: clipHeight,
             clip: !0,
             pickable: !1
         });
@@ -606,8 +619,16 @@ export class DiscreteLegend extends LegendBase {
             item.hasState(LegendStateValue.selected) && selectedData.push(item.data);
         })), selectedData;
     }
-    _appendDataToShape(shape, name, data, delegateShape, states = {}) {
-        shape.name = name, shape.data = data, shape.delegate = delegateShape, shape.states = merge({}, DEFAULT_STATES, states);
+    _appendDataToShape(shape, name, data, delegateShape, states, reuseStateDefinitions = !0) {
+        if (shape.name = name, shape.data = data, shape.delegate = delegateShape, !reuseStateDefinitions) return void (shape.states = merge({}, DEFAULT_STATES, states));
+        const source = null != states ? states : DEFAULT_STATES, cached = this._stateDefinitionsCache.get(source);
+        if (cached) return shape.states = cached.definitions, void shape.setStateDefinitionsWithCompiled(cached.definitions, cached.compiledDefinitions);
+        const definitions = states ? merge({}, DEFAULT_STATES, states) : DEFAULT_STATES, entry = {
+            definitions: definitions,
+            compiledDefinitions: (new StateDefinitionCompiler).compile(definitions)
+        };
+        this._stateDefinitionsCache.set(source, entry), shape.states = entry.definitions, 
+        shape.setStateDefinitionsWithCompiled(entry.definitions, entry.compiledDefinitions);
     }
     _dispatchLegendEvent(eventName, legendItem, event) {
         const currentSelectedItems = this._getSelectedLegends();
@@ -624,13 +645,18 @@ export class DiscreteLegend extends LegendBase {
     }
     _handleStyle(config, item, isSelected, index, items) {
         const newConfig = {};
-        return config.style && (isFunction(config.style) ? newConfig.style = config.style(item, isSelected, index, items) : newConfig.style = config.style), 
-        config.state && (newConfig.state = {}, Object.keys(config.state).forEach((key => {
-            config.state[key] && (isFunction(config.state[key]) ? newConfig.state[key] = config.state[key](item, isSelected, index, items) : newConfig.state[key] = config.state[key]);
-        }))), newConfig;
+        if (config.style && (isFunction(config.style) ? newConfig.style = config.style(item, isSelected, index, items) : newConfig.style = config.style), 
+        config.state) {
+            const stateKeys = Object.keys(config.state), hasStateFunction = stateKeys.some((key => isFunction(config.state[key])));
+            newConfig.reuseStateDefinitions = !hasStateFunction, hasStateFunction ? (newConfig.state = {}, 
+            stateKeys.forEach((key => {
+                config.state[key] && (newConfig.state[key] = isFunction(config.state[key]) ? config.state[key](item, isSelected, index, items) : config.state[key]);
+            }))) : newConfig.state = config.state;
+        }
+        return newConfig;
     }
     release() {
-        super.release(), this.removeAllEventListeners();
+        this._stateDefinitionsCache = new WeakMap, super.release(), this.removeAllEventListeners();
     }
 }