@vaadin/component-base 23.1.0-rc1 → 23.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/component-base",
-  "version": "23.1.0-rc1",
+  "version": "23.1.0",
   "publishConfig": {
     "access": "public"
   },
@@ -42,5 +42,5 @@
     "@vaadin/testing-helpers": "^0.3.2",
     "sinon": "^13.0.2"
   },
-  "gitHead": "5ecb85e16e938df827fefca4bd2a665a1e29913e"
+  "gitHead": "322bba42b83f908a78cd972b06acadc5da95a69d"
 }

package/src/controller-mixin.js

@@ -5,6 +5,11 @@
  */
 import { dedupingMixin } from '@polymer/polymer/lib/utils/mixin.js';
 
+/**
+ * @typedef ReactiveController
+ * @type {import('lit').ReactiveController}
+ */
+
 /**
  * A mixin for connecting controllers to the element.
  *
@@ -17,7 +22,7 @@ export const ControllerMixin = dedupingMixin(
         super();
 
         /**
-         * @type {Set<import('lit').ReactiveController>}
+         * @type {Set<ReactiveController>}
          */
         this.__controllers = new Set();
       }
@@ -47,7 +52,7 @@ export const ControllerMixin = dedupingMixin(
       /**
        * Registers a controller to participate in the element update cycle.
        *
-       * @param {import('lit').ReactiveController} controller
+       * @param {ReactiveController} controller
        * @protected
        */
       addController(controller) {
@@ -61,7 +66,7 @@ export const ControllerMixin = dedupingMixin(
       /**
        * Removes a controller from the element.
        *
-       * @param {import('lit').ReactiveController} controller
+       * @param {ReactiveController} controller
        * @protected
        */
       removeController(controller) {

package/src/dom-utils.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @license
+ * Copyright (c) 2021 - 2022 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */
+
+/**
+ * Returns an array of ancestor root nodes for the given node.
+ *
+ * A root node is either a document node or a document fragment node (Shadow Root).
+ * The array is collected by a bottom-up DOM traversing that starts with the given node
+ * and involves both the light DOM and ancestor shadow DOM trees.
+ */
+export function getAncestorRootNodes(node: Node): Node[];

package/src/dom-utils.js

@@ -0,0 +1,41 @@
+/**
+ * @license
+ * Copyright (c) 2021 - 2022 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */
+
+/**
+ * Returns an array of ancestor root nodes for the given node.
+ *
+ * A root node is either a document node or a document fragment node (Shadow Root).
+ * The array is collected by a bottom-up DOM traversing that starts with the given node
+ * and involves both the light DOM and ancestor shadow DOM trees.
+ *
+ * @param {Node} node
+ * @return {Node[]}
+ */
+export function getAncestorRootNodes(node) {
+  const result = [];
+
+  while (node) {
+    if (node.nodeType === Node.DOCUMENT_NODE) {
+      result.push(node);
+      break;
+    }
+
+    if (node.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
+      result.push(node);
+      node = node.host;
+      continue;
+    }
+
+    if (node.assignedSlot) {
+      node = node.assignedSlot;
+      continue;
+    }
+
+    node = node.parentNode;
+  }
+
+  return result;
+}

package/src/element-mixin.js

@@ -39,7 +39,7 @@ const registered = new Set();
 export const ElementMixin = (superClass) =>
   class VaadinElementMixin extends DirMixin(superClass) {
     static get version() {
-      return '23.1.0-rc1';
+      return '23.1.0';
     }
 
     /** @protected */

package/src/keyboard-mixin.d.ts

@@ -14,7 +14,20 @@ export declare function KeyboardMixin<T extends Constructor<HTMLElement>>(base:
 
 export declare class KeyboardMixinClass {
   /**
-   * A handler for the `keydown` event. By default, it does nothing.
+   * A handler for the "Enter" key. By default, it does nothing.
+   * Override the method to implement your own behavior.
+   */
+  protected _onEnter(event: KeyboardEvent): void;
+
+  /**
+   * A handler for the "Escape" key. By default, it does nothing.
+   * Override the method to implement your own behavior.
+   */
+  protected _onEscape(event: KeyboardEvent): void;
+
+  /**
+   * A handler for the `keydown` event. By default, it calls
+   * separate methods for handling "Enter" and "Escape" keys.
    * Override the method to implement your own behavior.
    */
   protected _onKeyDown(event: KeyboardEvent): void;

package/src/keyboard-mixin.js

@@ -29,14 +29,24 @@ export const KeyboardMixin = dedupingMixin(
       }
 
       /**
-       * A handler for the `keydown` event. By default, it does nothing.
+       * A handler for the `keydown` event. By default, it calls
+       * separate methods for handling "Enter" and "Escape" keys.
        * Override the method to implement your own behavior.
        *
-       * @param {KeyboardEvent} _event
+       * @param {KeyboardEvent} event
        * @protected
        */
-      _onKeyDown(_event) {
-        // To be implemented.
+      _onKeyDown(event) {
+        switch (event.key) {
+          case 'Enter':
+            this._onEnter(event);
+            break;
+          case 'Escape':
+            this._onEscape(event);
+            break;
+          default:
+            break;
+        }
       }
 
       /**
@@ -49,5 +59,27 @@ export const KeyboardMixin = dedupingMixin(
       _onKeyUp(_event) {
         // To be implemented.
       }
+
+      /**
+       * A handler for the "Enter" key. By default, it does nothing.
+       * Override the method to implement your own behavior.
+       *
+       * @param {KeyboardEvent} _event
+       * @protected
+       */
+      _onEnter(_event) {
+        // To be implemented.
+      }
+
+      /**
+       * A handler for the "Escape" key. By default, it does nothing.
+       * Override the method to implement your own behavior.
+       *
+       * @param {KeyboardEvent} _event
+       * @protected
+       */
+      _onEscape(_event) {
+        // To be implemented.
+      }
     },
 );