fix: close context menu on selection

pragmasoft-ua · Dec 13, 2023 · 20a8af2 · 20a8af2
1 parent 26efc76
commit 20a8af2
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 1 deletion.
diff --git a/packages/kite-chat-component/src/controllers/selection-container-controller.ts b/packages/kite-chat-component/src/controllers/selection-container-controller.ts
@@ -43,6 +43,7 @@ export class SelectionContainerController<U extends SelectableElement> {
         private host: ReactiveControllerHost & SelectableContainer<U>,
         private selectedElementTag: string,
         private eventNames: SelectionEventNames,
+        private selectionCallback?: () => void
     ) {
         this.host.addController(this);
     }
@@ -137,6 +138,7 @@ export class SelectionContainerController<U extends SelectableElement> {
         if (!e.defaultPrevented) {
             this._updateSelected(selectedElement);
             this.selectionFlag = true;
+            this.selectionCallback && this.selectionCallback();
         }
     }
 

diff --git a/packages/kite-chat-component/src/kite-chat.ts b/packages/kite-chat-component/src/kite-chat.ts
@@ -292,6 +292,10 @@ export class KiteChatElement extends
     }
   }
 
+  override _selectionCallback() {
+    this.contextMenu.hide();
+  }
+
   editMsg(messageId: string, msg: KiteMsg) {
     const msgElement = this.querySelector(
       `${KiteMsgElement.TAG}[messageId="${messageId}"]`

diff --git a/packages/kite-chat-component/src/mixins/selection-container-mixin.ts b/packages/kite-chat-component/src/mixins/selection-container-mixin.ts
@@ -22,6 +22,7 @@ export declare class SelectionContainerInterface<T extends SelectableElement> {
     unselect(el: T): void;
     selectAll(): void;
     unselectAll(): void;
+    _selectionCallback(): void
 }
 
 export const SelectionContainerMixin = <T extends Constructor<LitElement>, U extends SelectableElement>(
@@ -45,7 +46,9 @@ export const SelectionContainerMixin = <T extends Constructor<LitElement>, U ext
         @state()
         selectedElements: Array<U> = [];
 
-        protected selectionContainerController = new SelectionContainerController<U>(this, _selectedElementType.TAG, eventNames);
+        protected selectionContainerController = new SelectionContainerController<U>(
+            this, _selectedElementType.TAG, eventNames, this._selectionCallback.bind(this)
+        );
 
         unselect(el: HTMLElement) {
             if (!(el instanceof _selectedElementType)) return;
@@ -68,6 +71,10 @@ export const SelectionContainerMixin = <T extends Constructor<LitElement>, U ext
             this.selectedElements.forEach((element) => element.unselect());
             this.selectedElements = [];
         }
+
+        _selectionCallback() {
+            return;
+        }
     }
     return SelectionContainerElement as Constructor<SelectionContainerInterface<U>> & T;
 }