@visactor/vgrammar-core 0.14.15 → 0.15.0-beta.0

package/cjs/interactions/element-highlight-by-group.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/interactions/element-highlight-by-group.ts"],"names":[],"mappings":"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","file":"element-highlight-by-group.js","sourcesContent":["import { isNil } from '@visactor/vutils';\nimport type { ElementHighlightOptions, IMark, IView, InteractionEvent } from '../types';\nimport { InteractionStateEnum } from '../graph/enums';\nimport { BaseInteraction } from './base';\n\nexport class ElementHighlightByGroup extends BaseInteraction<ElementHighlightOptions> {\n  static type: string = 'element-highlight-by-group';\n  type: string = ElementHighlightByGroup.type;\n\n  static defaultOptions: ElementHighlightOptions = {\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    trigger: 'pointerover',\n    triggerOff: 'pointerout'\n  };\n  options: ElementHighlightOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByGroup.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.triggerOff, handler: this.handleReset }\n    ];\n  }\n\n  clearPrevElements() {\n    const states = [this.options.highlightState, this.options.blurState];\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(states);\n      });\n    });\n  }\n\n  start(element: InteractionEvent['element']) {\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      const highlightKey = element.groupKey;\n\n      if (isNil(highlightKey)) {\n        return;\n      }\n      this._marks.forEach(mark => {\n        mark.elements.forEach(el => {\n          const isHighlight = el.groupKey === highlightKey;\n\n          if (isHighlight) {\n            el.updateStates({\n              [this.options.blurState]: false,\n              [this.options.highlightState]: true\n            });\n          } else {\n            el.updateStates({\n              [this.options.blurState]: true,\n              [this.options.highlightState]: false\n            });\n          }\n        });\n      });\n    }\n  }\n\n  reset(element: InteractionEvent['element']) {\n    const hasActiveElement = element && this._marks && this._marks.includes(element.mark);\n\n    if (hasActiveElement) {\n      this.clearPrevElements();\n    }\n  }\n\n  handleStart = (e: InteractionEvent) => {\n    this.start(e.element);\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    this.reset(e.element);\n  };\n}\n"]}
+{"version":3,"sources":["../src/interactions/element-highlight-by-group.ts"],"names":[],"mappings":"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","file":"element-highlight-by-group.js","sourcesContent":["import { isNil } from '@visactor/vutils';\nimport type { ElementHighlightOptions, IMark, IView, InteractionEvent } from '../types';\nimport { InteractionStateEnum } from '../graph/enums';\nimport { BaseInteraction } from './base';\n\nexport class ElementHighlightByGroup extends BaseInteraction<ElementHighlightOptions> {\n  static type: string = 'element-highlight-by-group';\n  type: string = ElementHighlightByGroup.type;\n\n  static defaultOptions: ElementHighlightOptions = {\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    trigger: 'pointerover',\n    triggerOff: 'pointerout'\n  };\n  options: ElementHighlightOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByGroup.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.triggerOff, handler: this.handleReset }\n    ];\n  }\n\n  resetAll() {\n    const states = [this.options.highlightState, this.options.blurState];\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(states);\n      });\n    });\n  }\n\n  start(element: InteractionEvent['element']) {\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      const highlightKey = element.groupKey;\n\n      if (isNil(highlightKey)) {\n        return;\n      }\n      this._marks.forEach(mark => {\n        mark.elements.forEach(el => {\n          const isHighlight = el.groupKey === highlightKey;\n\n          if (isHighlight) {\n            el.updateStates({\n              [this.options.blurState]: false,\n              [this.options.highlightState]: true\n            });\n          } else {\n            el.updateStates({\n              [this.options.blurState]: true,\n              [this.options.highlightState]: false\n            });\n          }\n        });\n      });\n    }\n  }\n\n  reset(element?: InteractionEvent['element']) {\n    if (element) {\n      if (this._marks && this._marks.includes(element.mark)) {\n        element.removeState([this.options.highlightState, this.options.blurState]);\n      }\n    } else {\n      this.resetAll();\n    }\n  }\n\n  handleStart = (e: InteractionEvent) => {\n    this.start(e.element);\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    const element = e.element;\n    const hasActiveElement = element && this._marks && this._marks.includes(element.mark);\n\n    if (hasActiveElement) {\n      this.resetAll();\n    }\n  };\n}\n"]}

package/cjs/interactions/element-highlight-by-key.d.ts

@@ -12,9 +12,9 @@ export declare class ElementHighlightByKey extends BaseInteraction<ElementHighli
         type: "none" | import("../types").EventType;
         handler: (e: InteractionEvent) => void;
     }[];
-    clearPrevElements(): void;
+    resetAll(): void;
     start(element: InteractionEvent['element']): void;
-    reset(element: InteractionEvent['element']): void;
+    reset(element?: InteractionEvent['element']): void;
     handleStart: (e: InteractionEvent) => void;
     handleReset: (e: InteractionEvent) => void;
 }

package/cjs/interactions/element-highlight-by-key.js

@@ -11,7 +11,7 @@ class ElementHighlightByKey extends base_1.BaseInteraction {
         super(view, options), this.type = ElementHighlightByKey.type, this.handleStart = e => {
             this.start(e.element);
         }, this.handleReset = e => {
-            e.element && this._marks && this._marks.includes(e.element.mark) && this.clearPrevElements();
+            e.element && this._marks && this._marks.includes(e.element.mark) && this.resetAll();
         }, this.options = Object.assign({}, ElementHighlightByKey.defaultOptions, options), 
         this._marks = view.getMarksBySelector(this.options.selector);
     }
@@ -27,7 +27,7 @@ class ElementHighlightByKey extends base_1.BaseInteraction {
             handler: this.handleReset
         } ];
     }
-    clearPrevElements() {
+    resetAll() {
         const states = [ this.options.highlightState, this.options.blurState ];
         this._marks.forEach((mark => {
             mark.elements.forEach((el => {
@@ -53,21 +53,7 @@ class ElementHighlightByKey extends base_1.BaseInteraction {
         }
     }
     reset(element) {
-        if (element && this._marks && this._marks.includes(element.mark)) {
-            const highlightKey = element.key;
-            if ((0, vutils_1.isNil)(highlightKey)) return;
-            this._marks.forEach((mark => {
-                mark.elements.forEach((el => {
-                    el.key === highlightKey ? el.updateStates({
-                        [this.options.blurState]: !1,
-                        [this.options.highlightState]: !0
-                    }) : el.updateStates({
-                        [this.options.blurState]: !0,
-                        [this.options.highlightState]: !1
-                    });
-                }));
-            }));
-        }
+        element ? this._marks && this._marks.includes(element.mark) && element.removeState([ this.options.highlightState, this.options.blurState ]) : this.resetAll();
     }
 }
 

package/cjs/interactions/element-highlight-by-key.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/interactions/element-highlight-by-key.ts"],"names":[],"mappings":"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","file":"element-highlight-by-key.js","sourcesContent":["import { isNil } from '@visactor/vutils';\nimport type { ElementHighlightOptions, IMark, IView, InteractionEvent } from '../types';\nimport { BaseInteraction } from './base';\nimport { InteractionStateEnum } from '../graph/enums';\n\nexport class ElementHighlightByKey extends BaseInteraction<ElementHighlightOptions> {\n  static type: string = 'element-highlight-by-key';\n  type: string = ElementHighlightByKey.type;\n\n  static defaultOptions: ElementHighlightOptions = {\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    trigger: 'pointerover',\n    triggerOff: 'pointerout'\n  };\n  options: ElementHighlightOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByKey.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.triggerOff, handler: this.handleReset }\n    ];\n  }\n\n  clearPrevElements() {\n    const states = [this.options.highlightState, this.options.blurState];\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(states);\n      });\n    });\n  }\n\n  start(element: InteractionEvent['element']) {\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      const highlightKey = element.key;\n\n      if (isNil(highlightKey)) {\n        return;\n      }\n      this._marks.forEach(mark => {\n        mark.elements.forEach(el => {\n          const isHighlight = el.key === highlightKey;\n\n          if (isHighlight) {\n            el.updateStates({\n              [this.options.blurState]: false,\n              [this.options.highlightState]: true\n            });\n          } else {\n            el.updateStates({\n              [this.options.blurState]: true,\n              [this.options.highlightState]: false\n            });\n          }\n        });\n      });\n    }\n  }\n\n  reset(element: InteractionEvent['element']) {\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      const highlightKey = element.key;\n\n      if (isNil(highlightKey)) {\n        return;\n      }\n      this._marks.forEach(mark => {\n        mark.elements.forEach(el => {\n          const isHighlight = el.key === highlightKey;\n\n          if (isHighlight) {\n            el.updateStates({\n              [this.options.blurState]: false,\n              [this.options.highlightState]: true\n            });\n          } else {\n            el.updateStates({\n              [this.options.blurState]: true,\n              [this.options.highlightState]: false\n            });\n          }\n        });\n      });\n    }\n  }\n\n  handleStart = (e: InteractionEvent) => {\n    this.start(e.element);\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    const hasActiveElement = e.element && this._marks && this._marks.includes(e.element.mark);\n\n    if (hasActiveElement) {\n      this.clearPrevElements();\n    }\n  };\n}\n"]}
+{"version":3,"sources":["../src/interactions/element-highlight-by-key.ts"],"names":[],"mappings":"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","file":"element-highlight-by-key.js","sourcesContent":["import { isNil } from '@visactor/vutils';\nimport type { ElementHighlightOptions, IMark, IView, InteractionEvent } from '../types';\nimport { BaseInteraction } from './base';\nimport { InteractionStateEnum } from '../graph/enums';\n\nexport class ElementHighlightByKey extends BaseInteraction<ElementHighlightOptions> {\n  static type: string = 'element-highlight-by-key';\n  type: string = ElementHighlightByKey.type;\n\n  static defaultOptions: ElementHighlightOptions = {\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    trigger: 'pointerover',\n    triggerOff: 'pointerout'\n  };\n  options: ElementHighlightOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByKey.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.triggerOff, handler: this.handleReset }\n    ];\n  }\n\n  resetAll() {\n    const states = [this.options.highlightState, this.options.blurState];\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(states);\n      });\n    });\n  }\n\n  start(element: InteractionEvent['element']) {\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      const highlightKey = element.key;\n\n      if (isNil(highlightKey)) {\n        return;\n      }\n      this._marks.forEach(mark => {\n        mark.elements.forEach(el => {\n          const isHighlight = el.key === highlightKey;\n\n          if (isHighlight) {\n            el.updateStates({\n              [this.options.blurState]: false,\n              [this.options.highlightState]: true\n            });\n          } else {\n            el.updateStates({\n              [this.options.blurState]: true,\n              [this.options.highlightState]: false\n            });\n          }\n        });\n      });\n    }\n  }\n\n  reset(element?: InteractionEvent['element']) {\n    if (element) {\n      if (this._marks && this._marks.includes(element.mark)) {\n        element.removeState([this.options.highlightState, this.options.blurState]);\n      }\n    } else {\n      this.resetAll();\n    }\n  }\n\n  handleStart = (e: InteractionEvent) => {\n    this.start(e.element);\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    const hasActiveElement = e.element && this._marks && this._marks.includes(e.element.mark);\n\n    if (hasActiveElement) {\n      this.resetAll();\n    }\n  };\n}\n"]}

package/cjs/interactions/element-highlight-by-legend.d.ts

@@ -14,7 +14,8 @@ export declare class ElementHighlightByLegend extends BaseInteraction<ElementHig
         handler: (e: InteractionEvent, element: IGlyphElement<any> | IElement) => void;
     }[];
     start(itemKey: IElement | IGlyphElement | string): void;
-    reset(): void;
+    resetAll(): void;
+    reset(element?: InteractionEvent['element']): void;
     handleStart: (e: InteractionEvent, element: IElement | IGlyphElement) => void;
     handleReset: (e: InteractionEvent) => void;
 }

package/cjs/interactions/element-highlight-by-legend.js

@@ -12,7 +12,7 @@ class ElementHighlightByLegend extends base_1.BaseInteraction {
             var _a, _b;
             this.start(null === (_b = null === (_a = e.detail) || void 0 === _a ? void 0 : _a.data) || void 0 === _b ? void 0 : _b.id);
         }, this.handleReset = e => {
-            this.reset();
+            this.resetAll();
         }, this.options = Object.assign({}, ElementHighlightByLegend.defaultOptions, options), 
         this._marks = view.getMarksBySelector(this.options.selector);
     }
@@ -43,14 +43,17 @@ class ElementHighlightByLegend extends base_1.BaseInteraction {
             }));
         }));
     }
-    reset() {
-        const states = [ this.options.blurState, this.options.highlightState ];
+    resetAll() {
+        const states = [ this.options.highlightState, this.options.blurState ];
         this._marks.forEach((mark => {
             mark.elements.forEach((el => {
                 el.removeState(states);
             }));
         }));
     }
+    reset(element) {
+        element ? this._marks && this._marks.includes(element.mark) && element.removeState([ this.options.highlightState, this.options.blurState ]) : this.resetAll();
+    }
 }
 
 exports.ElementHighlightByLegend = ElementHighlightByLegend, ElementHighlightByLegend.type = "element-highlight-by-legend", 

package/cjs/interactions/element-highlight-by-legend.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/interactions/element-highlight-by-legend.ts"],"names":[],"mappings":"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","file":"element-highlight-by-legend.js","sourcesContent":["import { InteractionStateEnum } from '../graph/enums';\nimport type {\n  ElementHighlightByLegendOptions,\n  IElement,\n  IGlyphElement,\n  IMark,\n  IView,\n  InteractionEvent\n} from '../types';\nimport { BaseInteraction } from './base';\nimport { LegendEvent } from '@visactor/vrender-components';\nimport { isNil } from '@visactor/vutils';\nimport { generateFilterValue } from './utils';\n\nexport class ElementHighlightByLegend extends BaseInteraction<ElementHighlightByLegendOptions> {\n  static type: string = 'element-highlight-by-legend';\n  type: string = ElementHighlightByLegend.type;\n\n  static defaultOptions: ElementHighlightByLegendOptions = {\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    filterType: 'groupKey'\n  };\n  options: ElementHighlightByLegendOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightByLegendOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByLegend.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: LegendEvent.legendItemHover,\n        handler: this.handleStart\n      },\n      { type: LegendEvent.legendItemUnHover, handler: this.handleReset }\n    ];\n  }\n\n  start(itemKey: IElement | IGlyphElement | string) {\n    if (isNil(itemKey)) {\n      return;\n    }\n    const filterValue = generateFilterValue(this.options);\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        const isHighlight = filterValue(el) === itemKey;\n\n        if (isHighlight) {\n          el.updateStates({\n            [this.options.blurState]: false,\n            [this.options.highlightState]: true\n          });\n        } else {\n          el.updateStates({\n            [this.options.blurState]: true,\n            [this.options.highlightState]: false\n          });\n        }\n      });\n    });\n  }\n\n  reset() {\n    const states = [this.options.blurState, this.options.highlightState];\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(states);\n      });\n    });\n  }\n\n  handleStart = (e: InteractionEvent, element: IElement | IGlyphElement) => {\n    this.start(e.detail?.data?.id);\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    this.reset();\n  };\n}\n"]}
+{"version":3,"sources":["../src/interactions/element-highlight-by-legend.ts"],"names":[],"mappings":"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","file":"element-highlight-by-legend.js","sourcesContent":["import { InteractionStateEnum } from '../graph/enums';\nimport type {\n  ElementHighlightByLegendOptions,\n  IElement,\n  IGlyphElement,\n  IMark,\n  IView,\n  InteractionEvent\n} from '../types';\nimport { BaseInteraction } from './base';\nimport { LegendEvent } from '@visactor/vrender-components';\nimport { isNil } from '@visactor/vutils';\nimport { generateFilterValue } from './utils';\n\nexport class ElementHighlightByLegend extends BaseInteraction<ElementHighlightByLegendOptions> {\n  static type: string = 'element-highlight-by-legend';\n  type: string = ElementHighlightByLegend.type;\n\n  static defaultOptions: ElementHighlightByLegendOptions = {\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    filterType: 'groupKey'\n  };\n  options: ElementHighlightByLegendOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightByLegendOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByLegend.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: LegendEvent.legendItemHover,\n        handler: this.handleStart\n      },\n      { type: LegendEvent.legendItemUnHover, handler: this.handleReset }\n    ];\n  }\n\n  start(itemKey: IElement | IGlyphElement | string) {\n    if (isNil(itemKey)) {\n      return;\n    }\n    const filterValue = generateFilterValue(this.options);\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        const isHighlight = filterValue(el) === itemKey;\n\n        if (isHighlight) {\n          el.updateStates({\n            [this.options.blurState]: false,\n            [this.options.highlightState]: true\n          });\n        } else {\n          el.updateStates({\n            [this.options.blurState]: true,\n            [this.options.highlightState]: false\n          });\n        }\n      });\n    });\n  }\n\n  resetAll() {\n    const states = [this.options.highlightState, this.options.blurState];\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(states);\n      });\n    });\n  }\n\n  reset(element?: InteractionEvent['element']) {\n    if (element) {\n      if (this._marks && this._marks.includes(element.mark)) {\n        element.removeState([this.options.highlightState, this.options.blurState]);\n      }\n    } else {\n      this.resetAll();\n    }\n  }\n\n  handleStart = (e: InteractionEvent, element: IElement | IGlyphElement) => {\n    this.start(e.detail?.data?.id);\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    this.resetAll();\n  };\n}\n"]}

package/cjs/interactions/element-highlight-by-name.d.ts

@@ -18,7 +18,8 @@ export declare class ElementHighlightByName extends BaseInteraction<ElementHighl
     protected _filterByName(e: InteractionEvent): boolean;
     protected _parseTargetKey(e: InteractionEvent, element: IElement | IGlyphElement): any;
     start(itemKey: IElement | IGlyphElement | string): void;
-    reset(): void;
+    resetAll(): void;
+    reset(element?: InteractionEvent['element']): void;
     handleStart: (e: InteractionEvent, element: IElement | IGlyphElement) => void;
     handleReset: (e: InteractionEvent) => void;
 }

package/cjs/interactions/element-highlight-by-name.js

@@ -14,7 +14,7 @@ class ElementHighlightByName extends base_1.BaseInteraction {
                 this.start(itemKey);
             }
         }, this.handleReset = e => {
-            (this.options.shouldReset ? this.options.shouldReset(e) : this._filterByName(e)) && this.reset();
+            (this.options.shouldReset ? this.options.shouldReset(e) : this._filterByName(e)) && this.resetAll();
         }, this.options = Object.assign({}, ElementHighlightByName.defaultOptions, options), 
         this._marks = view.getMarksBySelector(this.options.selector);
     }
@@ -53,7 +53,7 @@ class ElementHighlightByName extends base_1.BaseInteraction {
             }));
         }));
     }
-    reset() {
+    resetAll() {
         const states = [ this.options.blurState, this.options.highlightState ];
         this._marks.forEach((mark => {
             mark.elements.forEach((el => {
@@ -61,6 +61,9 @@ class ElementHighlightByName extends base_1.BaseInteraction {
             }));
         }));
     }
+    reset(element) {
+        element ? this._marks && this._marks.includes(element.mark) && element.removeState([ this.options.highlightState, this.options.blurState ]) : this.resetAll();
+    }
 }
 
 exports.ElementHighlightByName = ElementHighlightByName, ElementHighlightByName.type = "element-highlight-by-name", 

package/cjs/interactions/element-highlight-by-name.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/interactions/element-highlight-by-name.ts"],"names":[],"mappings":"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","file":"element-highlight-by-name.js","sourcesContent":["import { InteractionStateEnum } from '../graph/enums';\nimport type { ElementHighlightByNameOptions, IElement, IGlyphElement, IMark, IView, InteractionEvent } from '../types';\nimport { BaseInteraction } from './base';\nimport { array, isNil } from '@visactor/vutils';\nimport { generateFilterValue } from './utils';\n\nexport class ElementHighlightByName extends BaseInteraction<ElementHighlightByNameOptions> {\n  static type: string = 'element-highlight-by-name';\n  type: string = ElementHighlightByName.type;\n\n  static defaultOptions: ElementHighlightByNameOptions = {\n    trigger: 'pointerover',\n    triggerOff: 'pointerout',\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    filterType: 'groupKey'\n  };\n  options: ElementHighlightByNameOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightByNameOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByName.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.triggerOff, handler: this.handleReset }\n    ];\n  }\n\n  protected _filterByName(e: InteractionEvent) {\n    const names = array(this.options.graphicName);\n    return e?.target?.name && names.includes(e.target.name);\n  }\n\n  protected _parseTargetKey(e: InteractionEvent, element: IElement | IGlyphElement) {\n    return this.options.parseData\n      ? this.options.parseData(e)\n      : e.target.type === 'text'\n      ? (e.target.attribute as any).text\n      : null;\n  }\n\n  start(itemKey: IElement | IGlyphElement | string) {\n    if (isNil(itemKey)) {\n      return;\n    }\n\n    const filterValue = generateFilterValue(this.options);\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        const isHighlight = filterValue(el) === itemKey;\n        if (isHighlight) {\n          el.updateStates({\n            [this.options.blurState]: false,\n            [this.options.highlightState]: true\n          });\n        } else {\n          el.updateStates({\n            [this.options.blurState]: true,\n            [this.options.highlightState]: false\n          });\n        }\n      });\n    });\n  }\n\n  reset() {\n    const states = [this.options.blurState, this.options.highlightState];\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(states);\n      });\n    });\n  }\n\n  handleStart = (e: InteractionEvent, element: IElement | IGlyphElement) => {\n    const shoudStart = this.options.shouldStart ? this.options.shouldStart(e) : this._filterByName(e);\n    if (shoudStart) {\n      const itemKey = this._parseTargetKey(e, element);\n      this.start(itemKey);\n    }\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    const shoudReset = this.options.shouldReset ? this.options.shouldReset(e) : this._filterByName(e);\n\n    if (shoudReset) {\n      this.reset();\n    }\n  };\n}\n"]}
+{"version":3,"sources":["../src/interactions/element-highlight-by-name.ts"],"names":[],"mappings":"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","file":"element-highlight-by-name.js","sourcesContent":["import { InteractionStateEnum } from '../graph/enums';\nimport type { ElementHighlightByNameOptions, IElement, IGlyphElement, IMark, IView, InteractionEvent } from '../types';\nimport { BaseInteraction } from './base';\nimport { array, isNil } from '@visactor/vutils';\nimport { generateFilterValue } from './utils';\n\nexport class ElementHighlightByName extends BaseInteraction<ElementHighlightByNameOptions> {\n  static type: string = 'element-highlight-by-name';\n  type: string = ElementHighlightByName.type;\n\n  static defaultOptions: ElementHighlightByNameOptions = {\n    trigger: 'pointerover',\n    triggerOff: 'pointerout',\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    filterType: 'groupKey'\n  };\n  options: ElementHighlightByNameOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightByNameOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByName.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.triggerOff, handler: this.handleReset }\n    ];\n  }\n\n  protected _filterByName(e: InteractionEvent) {\n    const names = array(this.options.graphicName);\n    return e?.target?.name && names.includes(e.target.name);\n  }\n\n  protected _parseTargetKey(e: InteractionEvent, element: IElement | IGlyphElement) {\n    return this.options.parseData\n      ? this.options.parseData(e)\n      : e.target.type === 'text'\n      ? (e.target.attribute as any).text\n      : null;\n  }\n\n  start(itemKey: IElement | IGlyphElement | string) {\n    if (isNil(itemKey)) {\n      return;\n    }\n\n    const filterValue = generateFilterValue(this.options);\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        const isHighlight = filterValue(el) === itemKey;\n        if (isHighlight) {\n          el.updateStates({\n            [this.options.blurState]: false,\n            [this.options.highlightState]: true\n          });\n        } else {\n          el.updateStates({\n            [this.options.blurState]: true,\n            [this.options.highlightState]: false\n          });\n        }\n      });\n    });\n  }\n\n  resetAll() {\n    const states = [this.options.blurState, this.options.highlightState];\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(states);\n      });\n    });\n  }\n\n  reset(element?: InteractionEvent['element']) {\n    if (element) {\n      if (this._marks && this._marks.includes(element.mark)) {\n        element.removeState([this.options.highlightState, this.options.blurState]);\n      }\n    } else {\n      this.resetAll();\n    }\n  }\n\n  handleStart = (e: InteractionEvent, element: IElement | IGlyphElement) => {\n    const shoudStart = this.options.shouldStart ? this.options.shouldStart(e) : this._filterByName(e);\n    if (shoudStart) {\n      const itemKey = this._parseTargetKey(e, element);\n      this.start(itemKey);\n    }\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    const shoudReset = this.options.shouldReset ? this.options.shouldReset(e) : this._filterByName(e);\n\n    if (shoudReset) {\n      this.resetAll();\n    }\n  };\n}\n"]}

package/cjs/interactions/element-highlight.d.ts

@@ -18,7 +18,7 @@ export declare class ElementHighlight extends BaseInteraction<ElementHighlightOp
         type: EventType;
         handler: (e: InteractionEvent) => void;
     }[];
-    clearPrevElements(): void;
+    resetAll(): void;
     start(element: InteractionEvent['element']): void;
     reset(element: InteractionEvent['element']): void;
     handleStart: (e: InteractionEvent) => void;

package/cjs/interactions/element-highlight.js

@@ -11,7 +11,12 @@ class ElementHighlight extends base_1.BaseInteraction {
         super(view, options), this.type = ElementHighlight.type, this.handleStart = e => {
             this.start(e.element);
         }, this.handleReset = e => {
-            this.reset(e.element);
+            if (!this._statedElements || !this._statedElements.length) return;
+            const element = e.element;
+            if (element) {
+                const hasActiveElement = this._marks && this._marks.includes(element.mark);
+                "view" !== this._resetType || hasActiveElement ? "self" === this._resetType && hasActiveElement && this.resetAll() : this.resetAll();
+            }
         }, this.options = Object.assign({}, ElementHighlight.defaultOptions, options), this._marks = view.getMarksBySelector(this.options.selector), 
         this._stateMarks = (0, utils_1.groupMarksByState)(this._marks, [ this.options.highlightState, this.options.blurState ]);
     }
@@ -30,7 +35,7 @@ class ElementHighlight extends base_1.BaseInteraction {
             handler: this.handleReset
         }), events;
     }
-    clearPrevElements() {
+    resetAll() {
         const {highlightState: highlightState, blurState: blurState} = this.options;
         this._lastElement && (this.clearAllStates(highlightState, blurState), this.dispatchEvent("reset", {
             elements: [ this._lastElement ],
@@ -46,12 +51,10 @@ class ElementHighlight extends base_1.BaseInteraction {
                 elements: [ element ],
                 options: this.options
             });
-        } else this._lastElement && "view" === this._resetType && this.clearPrevElements();
+        } else this._lastElement && "view" === this._resetType && this.resetAll();
     }
     reset(element) {
-        if (!this._statedElements || !this._statedElements.length) return;
-        const hasActiveElement = element && this._marks && this._marks.includes(element.mark);
-        "view" !== this._resetType || hasActiveElement ? "self" === this._resetType && hasActiveElement && this.clearPrevElements() : this.clearPrevElements();
+        element ? this._marks && this._marks.includes(element.mark) && element.removeState([ this.options.highlightState, this.options.blurState ]) : this.resetAll();
     }
 }
 

package/cjs/interactions/element-highlight.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/interactions/element-highlight.ts"],"names":[],"mappings":"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","file":"element-highlight.js","sourcesContent":["import { InteractionStateEnum } from '../graph/enums';\nimport type {\n  ElementHighlightOptions,\n  EventType,\n  IElement,\n  IGlyphElement,\n  IMark,\n  IToggleStateMixin,\n  IView,\n  InteractionEvent\n} from '../types';\nimport { BaseInteraction } from './base';\nimport { groupMarksByState } from './utils';\nimport { isString } from '@visactor/vutils';\n\nexport interface ElementHighlight extends IToggleStateMixin, BaseInteraction<ElementHighlightOptions> {}\n\nexport class ElementHighlight extends BaseInteraction<ElementHighlightOptions> {\n  static type: string = 'element-highlight';\n  type: string = ElementHighlight.type;\n\n  static defaultOptions: ElementHighlightOptions = {\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    trigger: 'pointerover',\n    triggerOff: 'pointerout'\n  };\n  options: ElementHighlightOptions;\n  protected _marks?: IMark[];\n  protected _stateMarks: Record<string, IMark[]>;\n  protected _lastElement?: IElement;\n  protected _statedElements?: (IElement | IGlyphElement)[];\n  protected _resetType?: 'view' | 'self';\n\n  constructor(view: IView, options?: ElementHighlightOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlight.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n    this._stateMarks = groupMarksByState(this._marks, [this.options.highlightState, this.options.blurState]);\n  }\n\n  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    const triggerOff = this.options.triggerOff;\n    const trigger = this.options.trigger;\n    const events = [\n      {\n        type: trigger,\n        handler: this.handleStart\n      }\n    ];\n\n    let eventName = triggerOff;\n    if (isString(triggerOff) && (triggerOff as string).includes('view:')) {\n      eventName = (triggerOff as string).replace('view:', '') as EventType;\n      this._resetType = 'view';\n    } else {\n      this._resetType = 'self';\n    }\n\n    events.push({ type: eventName as EventType, handler: this.handleReset });\n\n    return events;\n  }\n\n  clearPrevElements() {\n    const { highlightState, blurState } = this.options;\n\n    if (this._lastElement) {\n      this.clearAllStates(highlightState, blurState);\n\n      this.dispatchEvent('reset', { elements: [this._lastElement], options: this.options });\n\n      this._lastElement = null;\n\n      this._statedElements = null;\n    }\n  }\n\n  start(element: InteractionEvent['element']) {\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      const { highlightState, blurState } = this.options;\n\n      if (this._lastElement === element) {\n        return;\n      }\n\n      this._statedElements = this.updateStates([element], this._statedElements, highlightState, blurState);\n\n      this._lastElement = element;\n\n      this.dispatchEvent('start', { elements: [element], options: this.options });\n    } else if (this._lastElement && this._resetType === 'view') {\n      this.clearPrevElements();\n    }\n  }\n\n  reset(element: InteractionEvent['element']) {\n    if (!this._statedElements || !this._statedElements.length) {\n      return;\n    }\n\n    const hasActiveElement = element && this._marks && this._marks.includes(element.mark);\n\n    if (this._resetType === 'view' && !hasActiveElement) {\n      this.clearPrevElements();\n    } else if (this._resetType === 'self' && hasActiveElement) {\n      this.clearPrevElements();\n    }\n  }\n\n  handleStart = (e: InteractionEvent) => {\n    this.start(e.element);\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    this.reset(e.element);\n  };\n}\n"]}
+{"version":3,"sources":["../src/interactions/element-highlight.ts"],"names":[],"mappings":"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","file":"element-highlight.js","sourcesContent":["import { InteractionStateEnum } from '../graph/enums';\nimport type {\n  ElementHighlightOptions,\n  EventType,\n  IElement,\n  IGlyphElement,\n  IMark,\n  IToggleStateMixin,\n  IView,\n  InteractionEvent\n} from '../types';\nimport { BaseInteraction } from './base';\nimport { groupMarksByState } from './utils';\nimport { isString } from '@visactor/vutils';\n\nexport interface ElementHighlight extends IToggleStateMixin, BaseInteraction<ElementHighlightOptions> {}\n\nexport class ElementHighlight extends BaseInteraction<ElementHighlightOptions> {\n  static type: string = 'element-highlight';\n  type: string = ElementHighlight.type;\n\n  static defaultOptions: ElementHighlightOptions = {\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    trigger: 'pointerover',\n    triggerOff: 'pointerout'\n  };\n  options: ElementHighlightOptions;\n  protected _marks?: IMark[];\n  protected _stateMarks: Record<string, IMark[]>;\n  protected _lastElement?: IElement;\n  protected _statedElements?: (IElement | IGlyphElement)[];\n  protected _resetType?: 'view' | 'self';\n\n  constructor(view: IView, options?: ElementHighlightOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlight.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n    this._stateMarks = groupMarksByState(this._marks, [this.options.highlightState, this.options.blurState]);\n  }\n\n  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    const triggerOff = this.options.triggerOff;\n    const trigger = this.options.trigger;\n    const events = [\n      {\n        type: trigger,\n        handler: this.handleStart\n      }\n    ];\n\n    let eventName = triggerOff;\n    if (isString(triggerOff) && (triggerOff as string).includes('view:')) {\n      eventName = (triggerOff as string).replace('view:', '') as EventType;\n      this._resetType = 'view';\n    } else {\n      this._resetType = 'self';\n    }\n\n    events.push({ type: eventName as EventType, handler: this.handleReset });\n\n    return events;\n  }\n\n  resetAll() {\n    const { highlightState, blurState } = this.options;\n\n    if (this._lastElement) {\n      this.clearAllStates(highlightState, blurState);\n\n      this.dispatchEvent('reset', { elements: [this._lastElement], options: this.options });\n\n      this._lastElement = null;\n\n      this._statedElements = null;\n    }\n  }\n\n  start(element: InteractionEvent['element']) {\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      const { highlightState, blurState } = this.options;\n\n      if (this._lastElement === element) {\n        return;\n      }\n\n      this._statedElements = this.updateStates([element], this._statedElements, highlightState, blurState);\n\n      this._lastElement = element;\n\n      this.dispatchEvent('start', { elements: [element], options: this.options });\n    } else if (this._lastElement && this._resetType === 'view') {\n      this.resetAll();\n    }\n  }\n\n  reset(element: InteractionEvent['element']) {\n    if (element) {\n      if (this._marks && this._marks.includes(element.mark)) {\n        element.removeState([this.options.highlightState, this.options.blurState]);\n      }\n    } else {\n      this.resetAll();\n    }\n  }\n\n  handleStart = (e: InteractionEvent) => {\n    this.start(e.element);\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    if (!this._statedElements || !this._statedElements.length) {\n      return;\n    }\n    const element = e.element;\n\n    if (element) {\n      const hasActiveElement = this._marks && this._marks.includes(element.mark);\n\n      if (this._resetType === 'view' && !hasActiveElement) {\n        this.resetAll();\n      } else if (this._resetType === 'self' && hasActiveElement) {\n        this.resetAll();\n      }\n    }\n  };\n}\n"]}

package/cjs/interactions/element-select-by-graphic-name.d.ts

@@ -0,0 +1,7 @@
+import type { InteractionEvent } from '../types';
+import { ElementSelect } from './element-select';
+export declare class ElementSelectByGraphicName extends ElementSelect {
+    static type: string;
+    type: string;
+    start(element: InteractionEvent['element']): void;
+}

package/cjs/interactions/element-select-by-graphic-name.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.ElementSelectByGraphicName = void 0;
+
+const element_select_1 = require("./element-select");
+
+class ElementSelectByGraphicName extends element_select_1.ElementSelect {
+    constructor() {
+        super(...arguments), this.type = ElementSelectByGraphicName.type;
+    }
+    start(element) {
+        var _a;
+        const name = null === (_a = element.getGraphicItem()) || void 0 === _a ? void 0 : _a.name;
+        name && this._marks.forEach((mark => {
+            mark.elements.forEach((el => {
+                var _a;
+                (null === (_a = el.getGraphicItem()) || void 0 === _a ? void 0 : _a.name) === name && super.start(el);
+            }));
+        }));
+    }
+}
+
+exports.ElementSelectByGraphicName = ElementSelectByGraphicName, ElementSelectByGraphicName.type = "element-select-by-graphic-name";
+//# sourceMappingURL=element-select-by-graphic-name.js.map

package/cjs/interactions/element-select-by-graphic-name.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interactions/element-select-by-graphic-name.ts"],"names":[],"mappings":";;;AACA,qDAAiD;AAEjD,MAAa,0BAA2B,SAAQ,8BAAa;IAA7D;;QAEE,SAAI,GAAW,0BAA0B,CAAC,IAAI,CAAC;IAcjD,CAAC;IAZC,KAAK,CAAC,OAAoC;;QACxC,MAAM,IAAI,GAAG,MAAA,OAAO,CAAC,cAAc,EAAE,0CAAE,IAAI,CAAC;QAC5C,IAAI,IAAI,EAAE;YACR,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBACzB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;;oBACzB,IAAI,CAAA,MAAA,EAAE,CAAC,cAAc,EAAE,0CAAE,IAAI,MAAK,IAAI,EAAE;wBACtC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;qBACjB;gBACH,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;SACJ;IACH,CAAC;;AAfH,gEAgBC;AAfQ,+BAAI,GAAW,gCAAgC,CAAC","file":"element-select-by-graphic-name.js","sourcesContent":["import type { InteractionEvent } from '../types';\nimport { ElementSelect } from './element-select';\n\nexport class ElementSelectByGraphicName extends ElementSelect {\n  static type: string = 'element-select-by-graphic-name';\n  type: string = ElementSelectByGraphicName.type;\n\n  start(element: InteractionEvent['element']) {\n    const name = element.getGraphicItem()?.name;\n    if (name) {\n      this._marks.forEach(mark => {\n        mark.elements.forEach(el => {\n          if (el.getGraphicItem()?.name === name) {\n            super.start(el);\n          }\n        });\n      });\n    }\n  }\n}\n"]}

package/cjs/interactions/element-select.d.ts

@@ -17,7 +17,7 @@ export declare class ElementSelect extends BaseInteraction<ElementSelectOptions>
         type: EventType | EventType[];
         handler: (e: InteractionEvent) => void;
     }[];
-    clearPrevElements: () => void;
+    resetAll: () => void;
     handleStart: (e: InteractionEvent) => void;
     handleReset: (e: InteractionEvent) => void;
     start(element: InteractionEvent['element']): void;

package/cjs/interactions/element-select.js

@@ -8,7 +8,7 @@ const vutils_1 = require("@visactor/vutils"), enums_1 = require("../graph/enums"
 
 class ElementSelect extends base_1.BaseInteraction {
     constructor(view, options) {
-        super(view, options), this.type = ElementSelect.type, this._resetType = [], this.clearPrevElements = () => {
+        super(view, options), this.type = ElementSelect.type, this._resetType = [], this.resetAll = () => {
             const {state: state, reverseState: reverseState} = this.options;
             this._statedElements && this._statedElements.length && (this.clearAllStates(state, reverseState), 
             this.dispatchEvent("reset", {
@@ -18,7 +18,9 @@ class ElementSelect extends base_1.BaseInteraction {
         }, this.handleStart = e => {
             this.start(e.element);
         }, this.handleReset = e => {
-            this.reset(e.element);
+            if (!this._statedElements || !this._statedElements.length) return;
+            const element = e.element, hasActiveElement = element && this._marks && this._marks.includes(element.mark);
+            (this._resetType.includes("view") && !hasActiveElement || this._resetType.includes("self") && hasActiveElement) && this.resetAll();
         }, this.options = Object.assign({}, ElementSelect.defaultOptions, options), this._marks = view.getMarksBySelector(this.options.selector), 
         this._stateMarks = (0, utils_1.groupMarksByState)(this._marks, [ this.options.state, this.options.reverseState ]);
     }
@@ -42,25 +44,22 @@ class ElementSelect extends base_1.BaseInteraction {
         if (element && this._marks && this._marks.includes(element.mark)) if (element.hasState(state)) {
             if (this._resetType.includes("self")) {
                 const newStatedElements = this._statedElements && this._statedElements.filter((el => el !== element));
-                newStatedElements && newStatedElements.length ? this._statedElements = this.updateStates(newStatedElements, this._statedElements, state, reverseState) : this.clearPrevElements();
+                newStatedElements && newStatedElements.length ? this._statedElements = this.updateStates(newStatedElements, this._statedElements, state, reverseState) : this.resetAll();
             }
         } else this._timer && clearTimeout(this._timer), element.addState(state), this._statedElements = this.updateStates(isMultiple && this._statedElements ? [ ...this._statedElements, element ] : [ element ], this._statedElements, state, reverseState), 
         this.dispatchEvent("start", {
             elements: this._statedElements,
             options: this.options
         }), this._resetType.includes("timeout") && (this._timer = setTimeout((() => {
-            this.clearPrevElements();
-        }), this.options.triggerOff)); else this._resetType.includes("view") && this._statedElements && this._statedElements.length && this.clearPrevElements();
+            this.resetAll();
+        }), this.options.triggerOff)); else this._resetType.includes("view") && this._statedElements && this._statedElements.length && this.resetAll();
     }
     reset(element) {
-        if (!this._statedElements || !this._statedElements.length) return;
-        const hasActiveElement = element && this._marks && this._marks.includes(element.mark);
-        (this._resetType.includes("view") && !hasActiveElement || this._resetType.includes("self") && hasActiveElement) && this.clearPrevElements();
+        element ? this._marks && this._marks.includes(element.mark) && element.removeState([ this.options.state, this.options.reverseState ]) : this.resetAll();
     }
 }
 
 exports.ElementSelect = ElementSelect, ElementSelect.type = "element-select", ElementSelect.defaultOptions = {
     state: enums_1.InteractionStateEnum.selected,
     trigger: "click"
-};
-//# sourceMappingURL=element-select.js.map
+};

package/cjs/interactions/element-select.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/interactions/element-select.ts"],"names":[],"mappings":"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","file":"element-select.js","sourcesContent":["import { isArray } from '@visactor/vutils';\nimport { InteractionStateEnum } from '../graph/enums';\nimport type {\n  ElementSelectOptions,\n  EventType,\n  IElement,\n  IGlyphElement,\n  IMark,\n  IToggleStateMixin,\n  IView,\n  InteractionEvent\n} from '../types';\nimport { groupMarksByState, parseTriggerOffOfSelect } from './utils';\nimport { BaseInteraction } from './base';\n\nexport interface ElementSelect extends IToggleStateMixin, BaseInteraction<ElementSelectOptions> {}\n\nexport class ElementSelect extends BaseInteraction<ElementSelectOptions> {\n  static type: string = 'element-select';\n  type: string = ElementSelect.type;\n\n  static defaultOptions: ElementSelectOptions = {\n    state: InteractionStateEnum.selected,\n    trigger: 'click'\n  };\n  protected _resetType: ('view' | 'self' | 'timeout')[] = [];\n  protected _marks?: IMark[];\n  protected _stateMarks: Record<string, IMark[]>;\n  private _timer?: number;\n  protected _statedElements?: (IElement | IGlyphElement)[];\n\n  constructor(view: IView, options?: ElementSelectOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementSelect.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n    this._stateMarks = groupMarksByState(this._marks, [this.options.state, this.options.reverseState]);\n  }\n\n  getStartState(): string {\n    return this.options.state;\n  }\n\n  protected getEvents() {\n    const triggerOff = this.options.triggerOff;\n    const trigger = this.options.trigger;\n\n    const events = [\n      {\n        type: trigger,\n        handler: this.handleStart\n      }\n    ];\n\n    const { eventNames, resetType } = parseTriggerOffOfSelect(triggerOff);\n\n    eventNames.forEach(evt => {\n      if (evt && (isArray(trigger) ? !trigger.includes(evt) : evt !== trigger)) {\n        events.push({ type: evt as EventType, handler: this.handleReset });\n      }\n    });\n\n    this._resetType = resetType;\n\n    return events;\n  }\n\n  clearPrevElements = () => {\n    const { state, reverseState } = this.options;\n\n    if (this._statedElements && this._statedElements.length) {\n      this.clearAllStates(state, reverseState);\n      this.dispatchEvent('reset', { elements: this._statedElements, options: this.options });\n\n      this._statedElements = [];\n    }\n  };\n\n  handleStart = (e: InteractionEvent) => {\n    this.start(e.element);\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    this.reset(e.element);\n  };\n\n  start(element: InteractionEvent['element']) {\n    const { state, reverseState, isMultiple } = this.options;\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      if (element.hasState(state)) {\n        if (this._resetType.includes('self')) {\n          const newStatedElements = this._statedElements && this._statedElements.filter(el => el !== element);\n\n          if (newStatedElements && newStatedElements.length) {\n            this._statedElements = this.updateStates(newStatedElements, this._statedElements, state, reverseState);\n          } else {\n            this.clearPrevElements();\n          }\n        }\n      } else {\n        if (this._timer) {\n          clearTimeout(this._timer);\n        }\n        element.addState(state);\n\n        this._statedElements = this.updateStates(\n          isMultiple && this._statedElements ? [...this._statedElements, element] : [element],\n          this._statedElements,\n          state,\n          reverseState\n        );\n        this.dispatchEvent('start', { elements: this._statedElements, options: this.options });\n\n        if (this._resetType.includes('timeout')) {\n          this._timer = setTimeout(() => {\n            this.clearPrevElements();\n          }, this.options.triggerOff as number) as unknown as number;\n        }\n      }\n    } else if (this._resetType.includes('view') && this._statedElements && this._statedElements.length) {\n      this.clearPrevElements();\n    }\n  }\n\n  reset(element: InteractionEvent['element']) {\n    if (!this._statedElements || !this._statedElements.length) {\n      return;\n    }\n\n    const hasActiveElement = element && this._marks && this._marks.includes(element.mark);\n\n    if (this._resetType.includes('view') && !hasActiveElement) {\n      this.clearPrevElements();\n    } else if (this._resetType.includes('self') && hasActiveElement) {\n      this.clearPrevElements();\n    }\n  }\n}\n"]}
+{"version":3,"sources":["../src/interactions/element-select.ts"],"names":[],"mappings":"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","file":"element-select.js","sourcesContent":["import { isArray } from '@visactor/vutils';\nimport { InteractionStateEnum } from '../graph/enums';\nimport type {\n  ElementSelectOptions,\n  EventType,\n  IElement,\n  IGlyphElement,\n  IMark,\n  IToggleStateMixin,\n  IView,\n  InteractionEvent\n} from '../types';\nimport { groupMarksByState, parseTriggerOffOfSelect } from './utils';\nimport { BaseInteraction } from './base';\n\nexport interface ElementSelect extends IToggleStateMixin, BaseInteraction<ElementSelectOptions> {}\n\nexport class ElementSelect extends BaseInteraction<ElementSelectOptions> {\n  static type: string = 'element-select';\n  type: string = ElementSelect.type;\n\n  static defaultOptions: ElementSelectOptions = {\n    state: InteractionStateEnum.selected,\n    trigger: 'click'\n  };\n  protected _resetType: ('view' | 'self' | 'timeout')[] = [];\n  protected _marks?: IMark[];\n  protected _stateMarks: Record<string, IMark[]>;\n  private _timer?: number;\n  protected _statedElements?: (IElement | IGlyphElement)[];\n\n  constructor(view: IView, options?: ElementSelectOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementSelect.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n    this._stateMarks = groupMarksByState(this._marks, [this.options.state, this.options.reverseState]);\n  }\n\n  getStartState(): string {\n    return this.options.state;\n  }\n\n  protected getEvents() {\n    const triggerOff = this.options.triggerOff;\n    const trigger = this.options.trigger;\n\n    const events = [\n      {\n        type: trigger,\n        handler: this.handleStart\n      }\n    ];\n\n    const { eventNames, resetType } = parseTriggerOffOfSelect(triggerOff);\n\n    eventNames.forEach(evt => {\n      if (evt && (isArray(trigger) ? !trigger.includes(evt) : evt !== trigger)) {\n        events.push({ type: evt as EventType, handler: this.handleReset });\n      }\n    });\n\n    this._resetType = resetType;\n\n    return events;\n  }\n\n  resetAll = () => {\n    const { state, reverseState } = this.options;\n\n    if (this._statedElements && this._statedElements.length) {\n      this.clearAllStates(state, reverseState);\n      this.dispatchEvent('reset', { elements: this._statedElements, options: this.options });\n\n      this._statedElements = [];\n    }\n  };\n\n  handleStart = (e: InteractionEvent) => {\n    this.start(e.element);\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    if (!this._statedElements || !this._statedElements.length) {\n      return;\n    }\n    const element = e.element;\n    const hasActiveElement = element && this._marks && this._marks.includes(element.mark);\n\n    if (this._resetType.includes('view') && !hasActiveElement) {\n      this.resetAll();\n    } else if (this._resetType.includes('self') && hasActiveElement) {\n      this.resetAll();\n    }\n  };\n\n  start(element: InteractionEvent['element']) {\n    const { state, reverseState, isMultiple } = this.options;\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      if (element.hasState(state)) {\n        if (this._resetType.includes('self')) {\n          const newStatedElements = this._statedElements && this._statedElements.filter(el => el !== element);\n\n          if (newStatedElements && newStatedElements.length) {\n            this._statedElements = this.updateStates(newStatedElements, this._statedElements, state, reverseState);\n          } else {\n            this.resetAll();\n          }\n        }\n      } else {\n        if (this._timer) {\n          clearTimeout(this._timer);\n        }\n        element.addState(state);\n\n        this._statedElements = this.updateStates(\n          isMultiple && this._statedElements ? [...this._statedElements, element] : [element],\n          this._statedElements,\n          state,\n          reverseState\n        );\n        this.dispatchEvent('start', { elements: this._statedElements, options: this.options });\n\n        if (this._resetType.includes('timeout')) {\n          this._timer = setTimeout(() => {\n            this.resetAll();\n          }, this.options.triggerOff as number) as unknown as number;\n        }\n      }\n    } else if (this._resetType.includes('view') && this._statedElements && this._statedElements.length) {\n      this.resetAll();\n    }\n  }\n\n  reset(element: InteractionEvent['element']) {\n    if (element) {\n      if (this._marks && this._marks.includes(element.mark)) {\n        element.removeState([this.options.state, this.options.reverseState]);\n      }\n    } else {\n      this.resetAll();\n    }\n  }\n}\n"]}

package/cjs/interactions/fish-eye.js

@@ -99,4 +99,5 @@ exports.FishEye = FishEye, FishEye.type = "fish-eye", FishEye.defaultOptions = {
     distortionX: 2,
     distortionY: 2,
     throttle: 100
-};
+};
+//# sourceMappingURL=fish-eye.js.map

package/cjs/interactions/index.d.ts

@@ -35,6 +35,8 @@ export declare const registerElementHighlightByGroup: () => void;
 export declare const registerElementActiveByLegend: () => void;
 export declare const registerElementHighlightByLegend: () => void;
 export declare const registerElementHighlightByName: () => void;
+export declare const registerElementHighlightByGraphicName: () => void;
+export declare const registerElementSelectByGraphicName: () => void;
 export declare const registerBrushHighlight: () => void;
 export declare const registerBrushActive: () => void;
 export declare const registerBrushFilter: () => void;

package/cjs/interactions/index.js

@@ -2,7 +2,8 @@
 
 Object.defineProperty(exports, "__esModule", {
     value: !0
-}), exports.registerFishEye = exports.registerViewRoam = exports.registerViewDrag = exports.registerViewScroll = exports.registerViewZoom = exports.registerCrosshair = exports.registerDimensionTooltip = exports.registerTooltip = exports.registerRollUp = exports.registerDrillDown = exports.registerBrushFilter = exports.registerBrushActive = exports.registerBrushHighlight = exports.registerElementHighlightByName = exports.registerElementHighlightByLegend = exports.registerElementActiveByLegend = exports.registerElementHighlightByGroup = exports.registerElementHighlightByKey = exports.registerElementHighlight = exports.registerElementSelect = exports.registerElementActive = exports.FishEye = exports.ViewDragMixin = exports.ViewZoomMixin = exports.ViewScrollMixin = exports.ViewRoam = exports.ViewDrag = exports.ViewScroll = exports.ViewZoom = exports.FilterMixin = exports.Crosshair = exports.DimensionTooltip = exports.Tooltip = exports.RollUp = exports.DrillDown = exports.BrushActive = exports.BrushHighlight = exports.ElementHighlightByName = exports.ElementHighlightByLegend = exports.ElementActiveByLegend = exports.ElementHighlightByGroup = exports.ElementHighlightByKey = exports.ElementHighlight = exports.ElementSelect = exports.ElementActive = exports.ViewNavigationBase = exports.BrushBase = exports.BaseInteraction = exports.BaseTooltip = void 0;
+}), exports.registerViewRoam = exports.registerViewDrag = exports.registerViewScroll = exports.registerViewZoom = exports.registerCrosshair = exports.registerDimensionTooltip = exports.registerTooltip = exports.registerRollUp = exports.registerDrillDown = exports.registerBrushFilter = exports.registerBrushActive = exports.registerBrushHighlight = exports.registerElementSelectByGraphicName = exports.registerElementHighlightByGraphicName = exports.registerElementHighlightByName = exports.registerElementHighlightByLegend = exports.registerElementActiveByLegend = exports.registerElementHighlightByGroup = exports.registerElementHighlightByKey = exports.registerElementHighlight = exports.registerElementSelect = exports.registerElementActive = exports.FishEye = exports.ViewDragMixin = exports.ViewZoomMixin = exports.ViewScrollMixin = exports.ViewRoam = exports.ViewDrag = exports.ViewScroll = exports.ViewZoom = exports.FilterMixin = exports.Crosshair = exports.DimensionTooltip = exports.Tooltip = exports.RollUp = exports.DrillDown = exports.BrushActive = exports.BrushHighlight = exports.ElementHighlightByName = exports.ElementHighlightByLegend = exports.ElementActiveByLegend = exports.ElementHighlightByGroup = exports.ElementHighlightByKey = exports.ElementHighlight = exports.ElementSelect = exports.ElementActive = exports.ViewNavigationBase = exports.BrushBase = exports.BaseInteraction = exports.BaseTooltip = void 0, 
+exports.registerFishEye = void 0;
 
 const factory_1 = require("../core/factory"), element_active_1 = require("./element-active");
 
@@ -76,7 +77,7 @@ Object.defineProperty(exports, "ElementHighlightByName", {
     }
 });
 
-const brush_highlight_1 = require("./brush-highlight");
+const element_highlight_by_graphic_name_1 = require("./element-highlight-by-graphic-name"), element_select_by_graphic_name_1 = require("./element-select-by-graphic-name"), brush_highlight_1 = require("./brush-highlight");
 
 Object.defineProperty(exports, "BrushHighlight", {
     enumerable: !0,
@@ -308,6 +309,18 @@ const registerElementHighlightByName = () => {
 
 exports.registerElementHighlightByName = registerElementHighlightByName;
 
+const registerElementHighlightByGraphicName = () => {
+    factory_1.Factory.registerInteraction(element_highlight_by_graphic_name_1.ElementHighlightByGraphicName.type, element_highlight_by_graphic_name_1.ElementHighlightByGraphicName);
+};
+
+exports.registerElementHighlightByGraphicName = registerElementHighlightByGraphicName;
+
+const registerElementSelectByGraphicName = () => {
+    factory_1.Factory.registerInteraction(element_select_by_graphic_name_1.ElementSelectByGraphicName.type, element_select_by_graphic_name_1.ElementSelectByGraphicName);
+};
+
+exports.registerElementSelectByGraphicName = registerElementSelectByGraphicName;
+
 const registerBrushHighlight = () => {
     factory_1.Factory.registerInteraction(brush_highlight_1.BrushHighlight.type, brush_highlight_1.BrushHighlight);
 };