@vaadin/component-base - npm Package Compare versions

package.json

src/dom-utils.d.ts

		@@ -15,1 +15,12 @@ /**
		export function getAncestorRootNodes(node: Node): Node[];

		/**
		* Adds a value to an attribute containing space-delimited values.
		*/
		export function addValueToAttribute(element: HTMLElement, attr: string, value: string): void;

		/**
		* Removes a value from an attribute containing space-delimited values.
		* If the value is the last one, the whole attribute is removed.
		*/
		export function removeValueFromAttribute(element: HTMLElement, attr: string, value: string): void;

src/dom-utils.js

		@@ -42,1 +42,52 @@ /**
		}

		/**
		* @param {string} value
		* @return {Set<string>}
		*/
		function deserializeAttributeValue(value) {
		if (!value) {
		return new Set();
		}

		return new Set(value.split(' '));
		}

		/**
		* @param {Set<string>} values
		* @return {string}
		*/
		function serializeAttributeValue(values) {
		return [...values].join(' ');
		}

		/**
		* Adds a value to an attribute containing space-delimited values.
		*
		* @param {HTMLElement} element
		* @param {string} attr
		* @param {string} value
		*/
		export function addValueToAttribute(element, attr, value) {
		const values = deserializeAttributeValue(element.getAttribute(attr));
		values.add(value);
		element.setAttribute(attr, serializeAttributeValue(values));
		}

		/**
		* Removes a value from an attribute containing space-delimited values.
		* If the value is the last one, the whole attribute is removed.
		*
		* @param {HTMLElement} element
		* @param {string} attr
		* @param {string} value
		*/
		export function removeValueFromAttribute(element, attr, value) {
		const values = deserializeAttributeValue(element.getAttribute(attr));
		values.delete(value);
		if (values.size === 0) {
		element.removeAttribute(attr);
		return;
		}
		element.setAttribute(attr, serializeAttributeValue(values));
		}

src/element-mixin.js

src/focus-mixin.js

		@@ -7,25 +7,4 @@ /**
		import { dedupingMixin } from '@polymer/polymer/lib/utils/mixin.js';
		import { isKeyboardActive } from './focus-utils.js';

		// We consider the keyboard to be active if the window has received a keydown
		// event since the last mousedown event.
		let keyboardActive = false;

		// Listen for top-level keydown and mousedown events.
		// Use capture phase so we detect events even if they're handled.
		window.addEventListener(
		'keydown',
		() => {
		keyboardActive = true;
		},
		{ capture: true },
		);

		window.addEventListener(
		'mousedown',
		() => {
		keyboardActive = false;
		},
		{ capture: true },
		);

		/**
		@@ -44,3 +23,3 @@ * A mixin to handle `focused` and `focus-ring` attributes based on focus.
		get _keyboardActive() {
		return keyboardActive;
		return isKeyboardActive();
		}
		@@ -47,0 +26,0 @@

src/focus-utils.d.ts

		@@ -8,2 +8,8 @@ /**
		/**
		* Returns true if the window has received a keydown
		* event since the last mousedown event.
		*/
		export declare function isKeyboardActive(): boolean;

		/**
		* Returns true if the element is hidden, false otherwise.
		@@ -10,0 +16,0 @@ *

src/focus-utils.js

		@@ -7,3 +7,35 @@ /**

		// We consider the keyboard to be active if the window has received a keydown
		// event since the last mousedown event.
		let keyboardActive = false;

		// Listen for top-level keydown and mousedown events.
		// Use capture phase so we detect events even if they're handled.
		window.addEventListener(
		'keydown',
		() => {
		keyboardActive = true;
		},
		{ capture: true },
		);

		window.addEventListener(
		'mousedown',
		() => {
		keyboardActive = false;
		},
		{ capture: true },
		);

		/**
		* Returns true if the window has received a keydown
		* event since the last mousedown event.
		*
		* @return {boolean}
		*/
		export function isKeyboardActive() {
		return keyboardActive;
		}

		/**
		* Returns true if the element is hidden directly with `display: none` or `visibility: hidden`,
		@@ -10,0 +42,0 @@ * false otherwise.

New alerts