@material/mwc-base - npm Package Compare versions

Comparing version 0.12.0 to 0.13.0

package.json

 {
   "name": "@material/mwc-base",
-  "version": "0.12.0",
+  "version": "0.13.0",
   "description": "",
@@ -12,5 +12,5 @@ "repository": {
   "dependencies": {
-    "@material/base": "=5.0.0-canary.1c494e567.0",
-    "@material/dom": "=5.0.0-canary.1c494e567.0",
-    "@material/ripple": "=5.0.0-canary.1c494e567.0",
+    "@material/base": "=5.0.0-canary.a1a0deb3e.0",
+    "@material/dom": "=5.0.0-canary.a1a0deb3e.0",
+    "@material/ripple": "=5.0.0-canary.a1a0deb3e.0",
     "lit-element": "^2.2.1",
@@ -25,3 +25,3 @@ "tslib": "^1.10.0"
   },
-  "gitHead": "4c0dc16b89066f24fca4efcf78c36c87657f0a03"
+  "gitHead": "054d0d234704a274e8aaf7d8a8a0399f525914eb"
 }

src/utils.ts

@@ -24,5 +24,14 @@ /**
 
+/**
+ * Determines whether a node is an element.
+ *
+ * @param node Node to check
+ */
+export const isNodeElement = (node: Node): node is Element => {
+  return node.nodeType === Node.ELEMENT_NODE;
+};
+
 export function findAssignedElement(slot: HTMLSlotElement, selector: string) {
   for (const node of slot.assignedNodes({flatten: true})) {
-    if (node.nodeType === Node.ELEMENT_NODE) {
+    if (isNodeElement(node)) {
       const el = (node as HTMLElement);
@@ -54,3 +63,3 @@ if (matches(el, selector)) {
 let supportsPassive = false;
-const fn = () => {};
+const fn = () => { /* empty listener */ };
 const optionsBlock: AddEventListenerOptions = {
@@ -68,1 +77,43 @@ get passive() {
 export const supportsPassiveEventListener = supportsPassive;
+
+export const deepActiveElementPath = (doc = window.document): Element[] => {
+  let activeElement = doc.activeElement;
+  const path: Element[] = [];
+
+  if (!activeElement) {
+    return path;
+  }
+
+  while (activeElement) {
+    path.push(activeElement);
+    if (activeElement.shadowRoot) {
+      activeElement = activeElement.shadowRoot.activeElement;
+    } else {
+      break;
+    }
+  }
+
+  return path;
+};
+
+export const doesElementContainFocus = (element: HTMLElement): boolean => {
+  const activePath = deepActiveElementPath();
+
+  if (!activePath.length) {
+    return false;
+  }
+
+  const deepActiveElement = activePath[activePath.length - 1];
+  const focusEv =
+      new Event('check-if-focused', {bubbles: true, composed: true});
+  let composedPath: EventTarget[] = [];
+  const listener = (ev: Event) => {
+    composedPath = ev.composedPath();
+  };
+
+  document.body.addEventListener('check-if-focused', listener);
+  deepActiveElement.dispatchEvent(focusEv);
+  document.body.removeEventListener('check-if-focused', listener);
+
+  return composedPath.indexOf(element) !== -1;
+};

utils.d.ts

@@ -17,2 +17,8 @@ /**
 */
+/**
+ * Determines whether a node is an element.
+ *
+ * @param node Node to check
+ */
+export declare const isNodeElement: (node: Node) => node is Element;
 export declare function findAssignedElement(slot: HTMLSlotElement, selector: string): HTMLElement | null;
@@ -29,1 +35,3 @@ export declare type Constructor<T> = new (...args: any[]) => T;
 export declare const supportsPassiveEventListener = false;
+export declare const deepActiveElementPath: (doc?: Document) => Element[];
+export declare const doesElementContainFocus: (element: HTMLElement) => boolean;

utils.js

@@ -21,5 +21,13 @@ /**
 import { matches } from '@material/dom/ponyfill';
+/**
+ * Determines whether a node is an element.
+ *
+ * @param node Node to check
+ */
+export const isNodeElement = (node) => {
+    return node.nodeType === Node.ELEMENT_NODE;
+};
 export function findAssignedElement(slot, selector) {
     for (const node of slot.assignedNodes({ flatten: true })) {
-        if (node.nodeType === Node.ELEMENT_NODE) {
+        if (isNodeElement(node)) {
             const el = node;
@@ -58,2 +66,35 @@ if (matches(el, selector)) {
 export const supportsPassiveEventListener = supportsPassive;
+export const deepActiveElementPath = (doc = window.document) => {
+    let activeElement = doc.activeElement;
+    const path = [];
+    if (!activeElement) {
+        return path;
+    }
+    while (activeElement) {
+        path.push(activeElement);
+        if (activeElement.shadowRoot) {
+            activeElement = activeElement.shadowRoot.activeElement;
+        }
+        else {
+            break;
+        }
+    }
+    return path;
+};
+export const doesElementContainFocus = (element) => {
+    const activePath = deepActiveElementPath();
+    if (!activePath.length) {
+        return false;
+    }
+    const deepActiveElement = activePath[activePath.length - 1];
+    const focusEv = new Event('check-if-focused', { bubbles: true, composed: true });
+    let composedPath = [];
+    const listener = (ev) => {
+        composedPath = ev.composedPath();
+    };
+    document.body.addEventListener('check-if-focused', listener);
+    deepActiveElement.dispatchEvent(focusEv);
+    document.body.removeEventListener('check-if-focused', listener);
+    return composedPath.indexOf(element) !== -1;
+};
 //# sourceMappingURL=utils.js.map

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

51599

increased by16.26%

Number of package files

24

increased by4.35%

Lines of code

596

increased by17.79%

Dependency changes

• Updated@material/base@=5.0.0-canary.a1a0deb3e.0

• Updated@material/dom@=5.0.0-canary.a1a0deb3e.0

• Updated@material/ripple@=5.0.0-canary.a1a0deb3e.0