@phosphor/domutils
- Version 1.1.4
- Published
- 25.8 kB
- No dependencies
- BSD-3-Clause license
Install
npm i @phosphor/domutils
yarn add @phosphor/domutils
pnpm add @phosphor/domutils
Overview
PhosphorJS - DOM Utilities
Index
Namespaces
namespace ClipboardExt
namespace ClipboardExt {}
The namespace for clipboard related functionality.
function copyText
copyText: (text: string) => void;
Copy text to the system clipboard.
Parameter text
The text to copy to the clipboard.
namespace ElementExt
namespace ElementExt {}
The namespace for element related utilities.
function boxSizing
boxSizing: (element: Element) => IBoxSizing;
Compute the box sizing for an element.
Parameter element
The element of interest.
Returns
The box sizing data for the specified element.
function hitTest
hitTest: (element: Element, clientX: number, clientY: number) => boolean;
Test whether a client position lies within an element.
Parameter element
The DOM element of interest.
Parameter clientX
The client X coordinate of interest.
Parameter clientY
The client Y coordinate of interest.
Returns
Whether the point is within the given element.
function scrollIntoViewIfNeeded
scrollIntoViewIfNeeded: (area: Element, element: Element) => void;
Vertically scroll an element into view if needed.
Parameter area
The scroll area element.
Parameter element
The element of interest.
#### Notes This follows the "nearest" behavior of the native
scrollIntoView
method, which is not supported by all browsers. https://drafts.csswg.org/cssom-view/#element-scrolling-membersIf the element fully covers the visible area or is fully contained within the visible area, no scrolling will take place. Otherwise, the nearest edges of the area and element are aligned.
function sizeLimits
sizeLimits: (element: Element) => ISizeLimits;
Compute the size limits for an element.
Parameter element
The element of interest.
Returns
The size limit data for the specified element.
interface IBoxSizing
interface IBoxSizing {}
An object which holds the border and padding data for an element.
property borderBottom
borderBottom: number;
The bottom border width, in pixels.
property borderLeft
borderLeft: number;
The left border width, in pixels.
property borderRight
borderRight: number;
The right border width, in pixels.
property borderTop
borderTop: number;
The top border width, in pixels.
property horizontalSum
horizontalSum: number;
The sum of horizontal border and padding.
property paddingBottom
paddingBottom: number;
The bottom padding width, in pixels.
property paddingLeft
paddingLeft: number;
The left padding width, in pixels.
property paddingRight
paddingRight: number;
The right padding width, in pixels.
property paddingTop
paddingTop: number;
The top padding width, in pixels.
property verticalSum
verticalSum: number;
The sum of vertical border and padding.
interface ISizeLimits
interface ISizeLimits {}
An object which holds the min and max size data for an element.
namespace Platform
namespace Platform {}
The namespace for platform related utilities.
variable IS_EDGE
const IS_EDGE: boolean;
A flag indicating whether the browser is Edge.
variable IS_IE
const IS_IE: boolean;
A flag indicating whether the browser is IE.
variable IS_MAC
const IS_MAC: boolean;
A flag indicating whether the platform is Mac.
variable IS_WIN
const IS_WIN: boolean;
A flag indicating whether the platform is Windows.
function accelKey
accelKey: (event: KeyboardEvent | MouseEvent) => boolean;
Test whether the
accel
key is pressed.Parameter event
The keyboard or mouse event of interest.
Returns
Whether the
accel
key is pressed.#### Notes On Mac the
accel
key is the command key. On all other platforms theaccel
key is the control key.
namespace Selector
namespace Selector {}
The namespace for selector related utilities.
function calculateSpecificity
calculateSpecificity: (selector: string) => number;
Calculate the specificity of a single CSS selector.
Parameter selector
The CSS selector of interest.
Returns
The specificity of the selector.
#### Undefined Behavior The selector is invalid.
#### Notes This is based on https://www.w3.org/TR/css3-selectors/#specificity
A larger number represents a more specific selector.
The smallest possible specificity is
0
.The result is represented as a hex number
0x<aa><bb><cc>
where each component is the count of the respective selector clause.If the selector contains commas, only the first clause is used.
The computed result is cached, so subsequent calculations for the same selector are extremely fast.
function isValid
isValid: (selector: string) => boolean;
Test whether a selector is a valid CSS selector.
Parameter selector
The CSS selector of interest.
Returns
true
if the selector is valid,false
otherwise.#### Notes The computed result is cached, so subsequent tests for the same selector are extremely fast.
function matches
matches: (element: Element, selector: string) => boolean;
Test whether an element matches a CSS selector.
Parameter element
The element of interest.
Parameter selector
The valid CSS selector of interest.
Returns
true
if the element is a match,false
otherwise.#### Notes This function uses the builtin browser capabilities when possible, falling back onto a document query otherwise.
Package Files (5)
Dependencies (0)
No dependencies.
Dev Dependencies (14)
Peer Dependencies (0)
No peer dependencies.
Badge
To add a badge like this oneto your package's README, use the codes available below.
You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@phosphor/domutils
.
- Markdown[](https://www.jsdocs.io/package/@phosphor/domutils)
- HTML<a href="https://www.jsdocs.io/package/@phosphor/domutils"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>
- Updated .
Package analyzed in 1531 ms. - Missing or incorrect documentation? Open an issue for this package.