@knotx/plugins-selection 0.3.2 → 0.3.4

package/dist/index.cjs

@@ -73,8 +73,28 @@ var __privateIn = (member, obj) => Object(obj) !== obj ? __typeError('Cannot use
 var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _destroy_dec, _clearSelection_dec, _getSelected_dec, _init_dec, _interaction_dec, _registerRules_dec, _selected_dec, _a, _init;
-class Selection extends (_a = core.BasePlugin, _selected_dec = [decorators.register("selected")], _registerRules_dec = [decorators.register("registerRules")], _interaction_dec = [decorators.inject.interaction()], _init_dec = [decorators.OnInit], _getSelected_dec = [decorators.tool("Get selected items", {})], _clearSelection_dec = [decorators.tool("Clear selection", {})], _destroy_dec = [decorators.OnDestroy], _a) {
+var _destroy_dec, _clearSelection_dec, _select_dec, _getSelected_dec, _init_dec, _interaction_dec, _setElementOverlap_dec, _setClearSelectionBeforeStart_dec, _clearSelectionBeforeStart_dec, _setRuleEnabled_dec, _registerRules_dec, _selected_dec, _a, _init;
+class Selection extends (_a = core.BasePlugin, _selected_dec = [decorators.register("selected")], _registerRules_dec = [decorators.register("registerRules")], _setRuleEnabled_dec = [decorators.register("setRuleEnabled")], _clearSelectionBeforeStart_dec = [decorators.observable()], _setClearSelectionBeforeStart_dec = [decorators.register("setClearSelectionBeforeStart")], _setElementOverlap_dec = [decorators.register("setElementOverlap")], _interaction_dec = [decorators.inject.interaction()], _init_dec = [decorators.OnInit], _getSelected_dec = [decorators.tool("Get selected items", {})], _select_dec = [decorators.tool("Items that match the registered rules will be selected, manifested as the item showing a selected style.", {
+  type: "array",
+  items: {
+    type: "object",
+    properties: {
+      type: {
+        type: "string",
+        description: "item type such as node, group, etc."
+      },
+      id: {
+        type: "string"
+      }
+    },
+    additionalProperties: false,
+    required: [
+      "id",
+      "type"
+    ]
+  },
+  $schema: "http://json-schema.org/draft-07/schema#"
+})], _clearSelection_dec = [decorators.tool("Clear selection", {})], _destroy_dec = [decorators.OnDestroy], _a) {
   constructor() {
     super(...arguments);
     __runInitializers(_init, 5, this);
@@ -89,17 +109,33 @@ class Selection extends (_a = core.BasePlugin, _selected_dec = [decorators.regis
     __publicField(this, "selected", __runInitializers(_init, 8, this, [])), __runInitializers(_init, 11, this);
     __publicField(this, "registerRules", __runInitializers(_init, 12, this, (rules) => {
       rules.forEach((rule) => {
-        this.ruleMap.set(rule.className, rule);
+        this.ruleMap.set(rule.type, rule);
       });
       return () => {
         rules.forEach((rule) => {
-          if (this.ruleMap.get(rule.className) === rule) {
-            this.ruleMap.delete(rule.className);
+          if (this.ruleMap.get(rule.type) === rule) {
+            this.ruleMap.delete(rule.type);
           }
         });
       };
     })), __runInitializers(_init, 15, this);
-    __publicField(this, "interaction", __runInitializers(_init, 16, this)), __runInitializers(_init, 19, this);
+    __publicField(this, "setRuleEnabled", __runInitializers(_init, 16, this, (type, enabled) => {
+      const rule = this.ruleMap.get(type);
+      if (rule) {
+        rule.enabled = enabled;
+      }
+    })), __runInitializers(_init, 19, this);
+    __publicField(this, "clearSelectionBeforeStart", __runInitializers(_init, 20, this, true)), __runInitializers(_init, 23, this);
+    __publicField(this, "setClearSelectionBeforeStart", __runInitializers(_init, 24, this, (clearSelectionBeforeStart) => {
+      this.clearSelectionBeforeStart = clearSelectionBeforeStart;
+    })), __runInitializers(_init, 27, this);
+    __publicField(this, "setElementOverlap", __runInitializers(_init, 28, this, (overlap) => {
+      try {
+        this.selection._options.behaviour.overlap = overlap;
+      } catch (e) {
+      }
+    })), __runInitializers(_init, 31, this);
+    __publicField(this, "interaction", __runInitializers(_init, 32, this)), __runInitializers(_init, 35, this);
     __publicField(this, "onBeforeStart", (_) => {
     });
     __publicField(this, "onBeforeDrag", () => {
@@ -110,13 +146,16 @@ class Selection extends (_a = core.BasePlugin, _selected_dec = [decorators.regis
       var _a2;
       this.interaction.start(this.pluginId, "select", core.InteractionPriority.MarqueeSelection);
       if (!(event == null ? void 0 : event.ctrlKey) && !(event == null ? void 0 : event.metaKey) && !(event == null ? void 0 : event.shiftKey)) {
-        store.stored.forEach((element) => {
-          const rule = this.getElementRule(element);
-          if (rule == null ? void 0 : rule.activeClassName) {
-            element.classList.remove(rule.activeClassName);
-          }
-        });
-        (_a2 = this.selection) == null ? void 0 : _a2.clearSelection(true, true);
+        if (this.clearSelectionBeforeStart) {
+          store.stored.forEach((element) => {
+            const rule = this.getElementRule(element);
+            if (rule == null ? void 0 : rule.activeClassName) {
+              element.classList.remove(rule.activeClassName);
+            }
+            element.removeAttribute("data-selected");
+          });
+          (_a2 = this.selection) == null ? void 0 : _a2.clearSelection(true, true);
+        }
       }
     });
     __publicField(this, "onMove", ({ store: { stored, changed: { added, removed } }, selection }) => {
@@ -151,6 +190,7 @@ class Selection extends (_a = core.BasePlugin, _selected_dec = [decorators.regis
         if (rule.activeClassName) {
           element.classList.remove(rule.activeClassName);
         }
+        element.removeAttribute("data-selected");
       });
       added.forEach((element) => {
         const rule = this.getElementRule(element);
@@ -160,7 +200,7 @@ class Selection extends (_a = core.BasePlugin, _selected_dec = [decorators.regis
         const type = rule.type;
         const id = rule.idGetter(element);
         for (const [, rule2] of this.ruleMap) {
-          if (rule2.onSelected) {
+          if (rule2.enabled !== false && rule2.onSelected) {
             if (!rule2.onSelected(__spreadValues({ element, type, id }, context))) {
               selection.deselect(element, true);
               return;
@@ -170,6 +210,7 @@ class Selection extends (_a = core.BasePlugin, _selected_dec = [decorators.regis
         if (rule.activeClassName) {
           element.classList.add(rule.activeClassName);
         }
+        element.setAttribute("data-selected", "true");
       });
     });
     __publicField(this, "onStop", ({ event }) => {
@@ -185,7 +226,7 @@ class Selection extends (_a = core.BasePlugin, _selected_dec = [decorators.regis
     __publicField(this, "updateSelected", () => {
       var _a2;
       const selected = [];
-      for (const element of ((_a2 = this.selection) == null ? void 0 : _a2.getSelection()) || []) {
+      for (const element of new Set(((_a2 = this.selection) == null ? void 0 : _a2.getSelection()) || [])) {
         const rule = this.getElementRule(element);
         if (rule) {
           selected.push({ type: rule.type, id: rule.idGetter(element) });
@@ -204,10 +245,10 @@ class Selection extends (_a = core.BasePlugin, _selected_dec = [decorators.regis
         activeClassName: core.bem("node", "wrapper", "selected"),
         idGetter: (element) => element.getAttribute("data-node-id") || ""
       };
-      this.ruleMap.set(nodeRule.className, nodeRule);
+      this.ruleMap.set(nodeRule.type, nodeRule);
     }
     for (const rule of config.rules || []) {
-      this.ruleMap.set(rule.className, rule);
+      this.ruleMap.set(rule.type, rule);
     }
     if (config.enableDrag !== void 0) {
       this.enableDrag = config.enableDrag;
@@ -220,12 +261,12 @@ class Selection extends (_a = core.BasePlugin, _selected_dec = [decorators.regis
       // container,
       boundaries: [container],
       selectionAreaClass: this.selectionAreaClassName,
-      selectables: Array.from(this.ruleMap.keys()).map((className) => `.${className}`)
+      selectables: Array.from(new Set(Array.from(this.ruleMap.values()).map(({ className }) => `.${className}`)))
     }).on("beforedrag", this.onBeforeDrag).on("beforestart", this.onBeforeStart).on("start", this.onStart).on("move", this.onMove).on("stop", this.onStop);
   }
   getElementRule(element) {
-    for (const [className, rule] of this.ruleMap) {
-      if (element.classList.contains(className)) {
+    for (const [, rule] of this.ruleMap) {
+      if (rule.enabled !== false && element.classList.contains(rule.className)) {
         return rule;
       }
     }
@@ -234,6 +275,17 @@ class Selection extends (_a = core.BasePlugin, _selected_dec = [decorators.regis
   getSelected() {
     return this.selected;
   }
+  select(items) {
+    var _a2;
+    const selectors = [];
+    for (const item of items) {
+      const rule = this.ruleMap.get(item.type);
+      if (rule) {
+        selectors.push(`.${rule.className}[data-${rule.dataSelectorType || item.type}-id="${item.id}"]`);
+      }
+    }
+    (_a2 = this.selection) == null ? void 0 : _a2.select(selectors);
+  }
   clearSelection() {
     var _a2;
     (_a2 = this.selection) == null ? void 0 : _a2.clearSelection(true, false);
@@ -247,10 +299,15 @@ class Selection extends (_a = core.BasePlugin, _selected_dec = [decorators.regis
 _init = __decoratorStart(_a);
 __decorateElement(_init, 1, "init", _init_dec, Selection);
 __decorateElement(_init, 1, "getSelected", _getSelected_dec, Selection);
+__decorateElement(_init, 1, "select", _select_dec, Selection);
 __decorateElement(_init, 1, "clearSelection", _clearSelection_dec, Selection);
 __decorateElement(_init, 1, "destroy", _destroy_dec, Selection);
 __decorateElement(_init, 5, "selected", _selected_dec, Selection);
 __decorateElement(_init, 5, "registerRules", _registerRules_dec, Selection);
+__decorateElement(_init, 5, "setRuleEnabled", _setRuleEnabled_dec, Selection);
+__decorateElement(_init, 5, "clearSelectionBeforeStart", _clearSelectionBeforeStart_dec, Selection);
+__decorateElement(_init, 5, "setClearSelectionBeforeStart", _setClearSelectionBeforeStart_dec, Selection);
+__decorateElement(_init, 5, "setElementOverlap", _setElementOverlap_dec, Selection);
 __decorateElement(_init, 5, "interaction", _interaction_dec, Selection);
 __decoratorMetadata(_init, Selection);
 

package/dist/index.d.cts

@@ -1,3 +1,4 @@
+import { OverlapMode } from '@viselect/vanilla';
 import { BasePlugin } from '@knotx/core';
 
 interface SelectionSelectedItem {
@@ -9,10 +10,30 @@ declare module '@knotx/core' {
         selection: {
             selected: SelectionSelectedItem[];
             registerRules: (rules: SelectionRule[]) => () => void;
+            /**
+             * 启用/禁用规则
+             * @param type
+             * @param enabled
+             * @returns
+             */
+            setRuleEnabled: (type: string, enabled: boolean) => void;
+            /**
+             * 是否在开始选择前清除选择
+             * @param isClearSelectionBeforeStart
+             * @returns
+             */
+            setClearSelectionBeforeStart: (isClearSelectionBeforeStart: boolean) => void;
+            /**
+             * 设置元素在选中状态下被二次选中时的行为
+             * @param overlap
+             * @returns
+             */
+            setElementOverlap: (overlap: OverlapMode) => void;
         };
     }
     interface PluginTools {
         selection: {
+            select: (items: SelectionSelectedItem[]) => void;
             getSelected: () => SelectionSelectedItem[];
             clearSelection: () => void;
         };
@@ -41,6 +62,16 @@ interface SelectionRule {
         select: (elements: Element[]) => void;
         deselect: (elements: Element[]) => void;
     }) => boolean;
+    /**
+     * 数据选择器类型，用于匹配 dom 元素的 data-${type}-id 属性
+     * default: `type
+     */
+    dataSelectorType?: string;
+    /**
+     * 是否启用规则
+     * default: true
+     */
+    enabled?: boolean;
 }
 interface SelectionConfig {
     selectionAreaClassName?: string;
@@ -70,6 +101,10 @@ declare class Selection extends BasePlugin<'selection', SelectionConfig> {
     private updateFrameId;
     selected: SelectionSelectedItem[];
     registerRules: (rules: SelectionRule[]) => () => void;
+    setRuleEnabled: (type: string, enabled: boolean) => void;
+    clearSelectionBeforeStart: boolean;
+    setClearSelectionBeforeStart: (clearSelectionBeforeStart: boolean) => void;
+    setElementOverlap: (overlap: OverlapMode) => void;
     private interaction;
     init(config?: SelectionConfig): void;
     private createSelection;
@@ -81,6 +116,7 @@ declare class Selection extends BasePlugin<'selection', SelectionConfig> {
     private getElementRule;
     private updateSelected;
     getSelected(): SelectionSelectedItem[];
+    select(items: SelectionSelectedItem[]): void;
     clearSelection(): void;
     destroy(): void;
 }

package/dist/index.d.mts

@@ -1,3 +1,4 @@
+import { OverlapMode } from '@viselect/vanilla';
 import { BasePlugin } from '@knotx/core';
 
 interface SelectionSelectedItem {
@@ -9,10 +10,30 @@ declare module '@knotx/core' {
         selection: {
             selected: SelectionSelectedItem[];
             registerRules: (rules: SelectionRule[]) => () => void;
+            /**
+             * 启用/禁用规则
+             * @param type
+             * @param enabled
+             * @returns
+             */
+            setRuleEnabled: (type: string, enabled: boolean) => void;
+            /**
+             * 是否在开始选择前清除选择
+             * @param isClearSelectionBeforeStart
+             * @returns
+             */
+            setClearSelectionBeforeStart: (isClearSelectionBeforeStart: boolean) => void;
+            /**
+             * 设置元素在选中状态下被二次选中时的行为
+             * @param overlap
+             * @returns
+             */
+            setElementOverlap: (overlap: OverlapMode) => void;
         };
     }
     interface PluginTools {
         selection: {
+            select: (items: SelectionSelectedItem[]) => void;
             getSelected: () => SelectionSelectedItem[];
             clearSelection: () => void;
         };
@@ -41,6 +62,16 @@ interface SelectionRule {
         select: (elements: Element[]) => void;
         deselect: (elements: Element[]) => void;
     }) => boolean;
+    /**
+     * 数据选择器类型，用于匹配 dom 元素的 data-${type}-id 属性
+     * default: `type
+     */
+    dataSelectorType?: string;
+    /**
+     * 是否启用规则
+     * default: true
+     */
+    enabled?: boolean;
 }
 interface SelectionConfig {
     selectionAreaClassName?: string;
@@ -70,6 +101,10 @@ declare class Selection extends BasePlugin<'selection', SelectionConfig> {
     private updateFrameId;
     selected: SelectionSelectedItem[];
     registerRules: (rules: SelectionRule[]) => () => void;
+    setRuleEnabled: (type: string, enabled: boolean) => void;
+    clearSelectionBeforeStart: boolean;
+    setClearSelectionBeforeStart: (clearSelectionBeforeStart: boolean) => void;
+    setElementOverlap: (overlap: OverlapMode) => void;
     private interaction;
     init(config?: SelectionConfig): void;
     private createSelection;
@@ -81,6 +116,7 @@ declare class Selection extends BasePlugin<'selection', SelectionConfig> {
     private getElementRule;
     private updateSelected;
     getSelected(): SelectionSelectedItem[];
+    select(items: SelectionSelectedItem[]): void;
     clearSelection(): void;
     destroy(): void;
 }

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+import { OverlapMode } from '@viselect/vanilla';
 import { BasePlugin } from '@knotx/core';
 
 interface SelectionSelectedItem {
@@ -9,10 +10,30 @@ declare module '@knotx/core' {
         selection: {
             selected: SelectionSelectedItem[];
             registerRules: (rules: SelectionRule[]) => () => void;
+            /**
+             * 启用/禁用规则
+             * @param type
+             * @param enabled
+             * @returns
+             */
+            setRuleEnabled: (type: string, enabled: boolean) => void;
+            /**
+             * 是否在开始选择前清除选择
+             * @param isClearSelectionBeforeStart
+             * @returns
+             */
+            setClearSelectionBeforeStart: (isClearSelectionBeforeStart: boolean) => void;
+            /**
+             * 设置元素在选中状态下被二次选中时的行为
+             * @param overlap
+             * @returns
+             */
+            setElementOverlap: (overlap: OverlapMode) => void;
         };
     }
     interface PluginTools {
         selection: {
+            select: (items: SelectionSelectedItem[]) => void;
             getSelected: () => SelectionSelectedItem[];
             clearSelection: () => void;
         };
@@ -41,6 +62,16 @@ interface SelectionRule {
         select: (elements: Element[]) => void;
         deselect: (elements: Element[]) => void;
     }) => boolean;
+    /**
+     * 数据选择器类型，用于匹配 dom 元素的 data-${type}-id 属性
+     * default: `type
+     */
+    dataSelectorType?: string;
+    /**
+     * 是否启用规则
+     * default: true
+     */
+    enabled?: boolean;
 }
 interface SelectionConfig {
     selectionAreaClassName?: string;
@@ -70,6 +101,10 @@ declare class Selection extends BasePlugin<'selection', SelectionConfig> {
     private updateFrameId;
     selected: SelectionSelectedItem[];
     registerRules: (rules: SelectionRule[]) => () => void;
+    setRuleEnabled: (type: string, enabled: boolean) => void;
+    clearSelectionBeforeStart: boolean;
+    setClearSelectionBeforeStart: (clearSelectionBeforeStart: boolean) => void;
+    setElementOverlap: (overlap: OverlapMode) => void;
     private interaction;
     init(config?: SelectionConfig): void;
     private createSelection;
@@ -81,6 +116,7 @@ declare class Selection extends BasePlugin<'selection', SelectionConfig> {
     private getElementRule;
     private updateSelected;
     getSelected(): SelectionSelectedItem[];
+    select(items: SelectionSelectedItem[]): void;
     clearSelection(): void;
     destroy(): void;
 }

package/dist/index.js

@@ -1,5 +1,5 @@
 import { bemSelector, bem, BasePlugin, InteractionPriority } from '@knotx/core';
-import { register, inject, tool, OnInit, OnDestroy } from '@knotx/decorators';
+import { register, observable, inject, tool, OnInit, OnDestroy } from '@knotx/decorators';
 import SelectionArea from '@viselect/vanilla';
 
 var __create = Object.create;
@@ -67,8 +67,28 @@ var __privateIn = (member, obj) => Object(obj) !== obj ? __typeError('Cannot use
 var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _destroy_dec, _clearSelection_dec, _getSelected_dec, _init_dec, _interaction_dec, _registerRules_dec, _selected_dec, _a, _init;
-class Selection extends (_a = BasePlugin, _selected_dec = [register("selected")], _registerRules_dec = [register("registerRules")], _interaction_dec = [inject.interaction()], _init_dec = [OnInit], _getSelected_dec = [tool("Get selected items", {})], _clearSelection_dec = [tool("Clear selection", {})], _destroy_dec = [OnDestroy], _a) {
+var _destroy_dec, _clearSelection_dec, _select_dec, _getSelected_dec, _init_dec, _interaction_dec, _setElementOverlap_dec, _setClearSelectionBeforeStart_dec, _clearSelectionBeforeStart_dec, _setRuleEnabled_dec, _registerRules_dec, _selected_dec, _a, _init;
+class Selection extends (_a = BasePlugin, _selected_dec = [register("selected")], _registerRules_dec = [register("registerRules")], _setRuleEnabled_dec = [register("setRuleEnabled")], _clearSelectionBeforeStart_dec = [observable()], _setClearSelectionBeforeStart_dec = [register("setClearSelectionBeforeStart")], _setElementOverlap_dec = [register("setElementOverlap")], _interaction_dec = [inject.interaction()], _init_dec = [OnInit], _getSelected_dec = [tool("Get selected items", {})], _select_dec = [tool("Items that match the registered rules will be selected, manifested as the item showing a selected style.", {
+  type: "array",
+  items: {
+    type: "object",
+    properties: {
+      type: {
+        type: "string",
+        description: "item type such as node, group, etc."
+      },
+      id: {
+        type: "string"
+      }
+    },
+    additionalProperties: false,
+    required: [
+      "id",
+      "type"
+    ]
+  },
+  $schema: "http://json-schema.org/draft-07/schema#"
+})], _clearSelection_dec = [tool("Clear selection", {})], _destroy_dec = [OnDestroy], _a) {
   constructor() {
     super(...arguments);
     __runInitializers(_init, 5, this);
@@ -83,17 +103,33 @@ class Selection extends (_a = BasePlugin, _selected_dec = [register("selected")]
     __publicField(this, "selected", __runInitializers(_init, 8, this, [])), __runInitializers(_init, 11, this);
     __publicField(this, "registerRules", __runInitializers(_init, 12, this, (rules) => {
       rules.forEach((rule) => {
-        this.ruleMap.set(rule.className, rule);
+        this.ruleMap.set(rule.type, rule);
       });
       return () => {
         rules.forEach((rule) => {
-          if (this.ruleMap.get(rule.className) === rule) {
-            this.ruleMap.delete(rule.className);
+          if (this.ruleMap.get(rule.type) === rule) {
+            this.ruleMap.delete(rule.type);
           }
         });
       };
     })), __runInitializers(_init, 15, this);
-    __publicField(this, "interaction", __runInitializers(_init, 16, this)), __runInitializers(_init, 19, this);
+    __publicField(this, "setRuleEnabled", __runInitializers(_init, 16, this, (type, enabled) => {
+      const rule = this.ruleMap.get(type);
+      if (rule) {
+        rule.enabled = enabled;
+      }
+    })), __runInitializers(_init, 19, this);
+    __publicField(this, "clearSelectionBeforeStart", __runInitializers(_init, 20, this, true)), __runInitializers(_init, 23, this);
+    __publicField(this, "setClearSelectionBeforeStart", __runInitializers(_init, 24, this, (clearSelectionBeforeStart) => {
+      this.clearSelectionBeforeStart = clearSelectionBeforeStart;
+    })), __runInitializers(_init, 27, this);
+    __publicField(this, "setElementOverlap", __runInitializers(_init, 28, this, (overlap) => {
+      try {
+        this.selection._options.behaviour.overlap = overlap;
+      } catch (e) {
+      }
+    })), __runInitializers(_init, 31, this);
+    __publicField(this, "interaction", __runInitializers(_init, 32, this)), __runInitializers(_init, 35, this);
     __publicField(this, "onBeforeStart", (_) => {
     });
     __publicField(this, "onBeforeDrag", () => {
@@ -104,13 +140,16 @@ class Selection extends (_a = BasePlugin, _selected_dec = [register("selected")]
       var _a2;
       this.interaction.start(this.pluginId, "select", InteractionPriority.MarqueeSelection);
       if (!(event == null ? void 0 : event.ctrlKey) && !(event == null ? void 0 : event.metaKey) && !(event == null ? void 0 : event.shiftKey)) {
-        store.stored.forEach((element) => {
-          const rule = this.getElementRule(element);
-          if (rule == null ? void 0 : rule.activeClassName) {
-            element.classList.remove(rule.activeClassName);
-          }
-        });
-        (_a2 = this.selection) == null ? void 0 : _a2.clearSelection(true, true);
+        if (this.clearSelectionBeforeStart) {
+          store.stored.forEach((element) => {
+            const rule = this.getElementRule(element);
+            if (rule == null ? void 0 : rule.activeClassName) {
+              element.classList.remove(rule.activeClassName);
+            }
+            element.removeAttribute("data-selected");
+          });
+          (_a2 = this.selection) == null ? void 0 : _a2.clearSelection(true, true);
+        }
       }
     });
     __publicField(this, "onMove", ({ store: { stored, changed: { added, removed } }, selection }) => {
@@ -145,6 +184,7 @@ class Selection extends (_a = BasePlugin, _selected_dec = [register("selected")]
         if (rule.activeClassName) {
           element.classList.remove(rule.activeClassName);
         }
+        element.removeAttribute("data-selected");
       });
       added.forEach((element) => {
         const rule = this.getElementRule(element);
@@ -154,7 +194,7 @@ class Selection extends (_a = BasePlugin, _selected_dec = [register("selected")]
         const type = rule.type;
         const id = rule.idGetter(element);
         for (const [, rule2] of this.ruleMap) {
-          if (rule2.onSelected) {
+          if (rule2.enabled !== false && rule2.onSelected) {
             if (!rule2.onSelected(__spreadValues({ element, type, id }, context))) {
               selection.deselect(element, true);
               return;
@@ -164,6 +204,7 @@ class Selection extends (_a = BasePlugin, _selected_dec = [register("selected")]
         if (rule.activeClassName) {
           element.classList.add(rule.activeClassName);
         }
+        element.setAttribute("data-selected", "true");
       });
     });
     __publicField(this, "onStop", ({ event }) => {
@@ -179,7 +220,7 @@ class Selection extends (_a = BasePlugin, _selected_dec = [register("selected")]
     __publicField(this, "updateSelected", () => {
       var _a2;
       const selected = [];
-      for (const element of ((_a2 = this.selection) == null ? void 0 : _a2.getSelection()) || []) {
+      for (const element of new Set(((_a2 = this.selection) == null ? void 0 : _a2.getSelection()) || [])) {
         const rule = this.getElementRule(element);
         if (rule) {
           selected.push({ type: rule.type, id: rule.idGetter(element) });
@@ -198,10 +239,10 @@ class Selection extends (_a = BasePlugin, _selected_dec = [register("selected")]
         activeClassName: bem("node", "wrapper", "selected"),
         idGetter: (element) => element.getAttribute("data-node-id") || ""
       };
-      this.ruleMap.set(nodeRule.className, nodeRule);
+      this.ruleMap.set(nodeRule.type, nodeRule);
     }
     for (const rule of config.rules || []) {
-      this.ruleMap.set(rule.className, rule);
+      this.ruleMap.set(rule.type, rule);
     }
     if (config.enableDrag !== void 0) {
       this.enableDrag = config.enableDrag;
@@ -214,12 +255,12 @@ class Selection extends (_a = BasePlugin, _selected_dec = [register("selected")]
       // container,
       boundaries: [container],
       selectionAreaClass: this.selectionAreaClassName,
-      selectables: Array.from(this.ruleMap.keys()).map((className) => `.${className}`)
+      selectables: Array.from(new Set(Array.from(this.ruleMap.values()).map(({ className }) => `.${className}`)))
     }).on("beforedrag", this.onBeforeDrag).on("beforestart", this.onBeforeStart).on("start", this.onStart).on("move", this.onMove).on("stop", this.onStop);
   }
   getElementRule(element) {
-    for (const [className, rule] of this.ruleMap) {
-      if (element.classList.contains(className)) {
+    for (const [, rule] of this.ruleMap) {
+      if (rule.enabled !== false && element.classList.contains(rule.className)) {
         return rule;
       }
     }
@@ -228,6 +269,17 @@ class Selection extends (_a = BasePlugin, _selected_dec = [register("selected")]
   getSelected() {
     return this.selected;
   }
+  select(items) {
+    var _a2;
+    const selectors = [];
+    for (const item of items) {
+      const rule = this.ruleMap.get(item.type);
+      if (rule) {
+        selectors.push(`.${rule.className}[data-${rule.dataSelectorType || item.type}-id="${item.id}"]`);
+      }
+    }
+    (_a2 = this.selection) == null ? void 0 : _a2.select(selectors);
+  }
   clearSelection() {
     var _a2;
     (_a2 = this.selection) == null ? void 0 : _a2.clearSelection(true, false);
@@ -241,10 +293,15 @@ class Selection extends (_a = BasePlugin, _selected_dec = [register("selected")]
 _init = __decoratorStart(_a);
 __decorateElement(_init, 1, "init", _init_dec, Selection);
 __decorateElement(_init, 1, "getSelected", _getSelected_dec, Selection);
+__decorateElement(_init, 1, "select", _select_dec, Selection);
 __decorateElement(_init, 1, "clearSelection", _clearSelection_dec, Selection);
 __decorateElement(_init, 1, "destroy", _destroy_dec, Selection);
 __decorateElement(_init, 5, "selected", _selected_dec, Selection);
 __decorateElement(_init, 5, "registerRules", _registerRules_dec, Selection);
+__decorateElement(_init, 5, "setRuleEnabled", _setRuleEnabled_dec, Selection);
+__decorateElement(_init, 5, "clearSelectionBeforeStart", _clearSelectionBeforeStart_dec, Selection);
+__decorateElement(_init, 5, "setClearSelectionBeforeStart", _setClearSelectionBeforeStart_dec, Selection);
+__decorateElement(_init, 5, "setElementOverlap", _setElementOverlap_dec, Selection);
 __decorateElement(_init, 5, "interaction", _interaction_dec, Selection);
 __decoratorMetadata(_init, Selection);
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@knotx/plugins-selection",
-  "version": "0.3.2",
+  "version": "0.3.4",
   "description": "Selection Plugin for Knotx",
   "author": "boenfu",
   "license": "MIT",
@@ -30,13 +30,13 @@
   "dependencies": {
     "@viselect/vanilla": "^3.9.0",
     "rxjs": "^7.8.1",
-    "@knotx/core": "0.3.2",
-    "@knotx/decorators": "0.3.2"
+    "@knotx/core": "0.3.4",
+    "@knotx/decorators": "0.3.4"
   },
   "devDependencies": {
-    "@knotx/build-config": "0.3.2",
-    "@knotx/eslint-config": "0.3.2",
-    "@knotx/typescript-config": "0.3.2"
+    "@knotx/build-config": "0.3.4",
+    "@knotx/eslint-config": "0.3.4",
+    "@knotx/typescript-config": "0.3.4"
   },
   "scripts": {
     "build": "unbuild",