@material/mwc-base
Advanced tools
Comparing version 0.12.0 to 0.13.0
{ | ||
"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" | ||
} |
@@ -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; | ||
}; |
@@ -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; |
43
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 |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
51599
24
596