Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

domestique

Package Overview
Dependencies
Maintainers
1
Versions
8
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

domestique - npm Package Compare versions

Comparing version 1.0.0 to 1.1.0

src/dimension/in-viewport.js

11

index.js

@@ -0,1 +1,6 @@

import inViewport from './src/dimension/in-viewport';
import scrollbarSize from './src/dimension/scrollbar-size';
import viewportHeight from './src/dimension/viewport-height';
import viewportWidth from './src/dimension/viewport-width';
import create from './src/element/create';

@@ -16,2 +21,8 @@ import {addClass, hasClass, removeClass} from './src/element/class';

export {
// Dimension
inViewport,
scrollbarSize,
viewportHeight,
viewportWidth,
// Element

@@ -18,0 +29,0 @@ create,

7

package.json
{
"name": "domestique",
"version": "1.0.0",
"version": "1.1.0",
"description": "A modular DOM helper library.",

@@ -16,2 +16,3 @@ "repository": "https://github.com/jsor/domestique.git",

"utility",
"dimension",
"element",

@@ -59,6 +60,6 @@ "event",

"babel-preset-env": "^1.7.0",
"browserstack-runner": "^0.7.0",
"browserstack-runner": "^0.8.0",
"chai": "^4.1.2",
"istanbul-instrumenter-loader": "^3.0.1",
"karma": "^2.0.4",
"karma": "^3.0.0",
"karma-chai": "^0.1.0",

@@ -65,0 +66,0 @@ "karma-chrome-launcher": "^2.2.0",

@@ -39,21 +39,10 @@ Domestique

* [Element](#element)
* [create()](#create)
* [addClass()](#addclass)
* [removeClass()](#removeclass)
* [hasClass()](#hasclass)
* [data()](#data)
* [Event](#event)
* [ready()](#ready)
* [on()](#on)
* [off()](#off)
* [delegate()](#delegate)
* [dispatch()](#dispatch)
* [Query](#query)
* [find()](#find)
* [closest()](#closest)
* [matches()](#matches)
```javascript
import {
// Dimension
scrollbarSize,
viewport,
viewportHeight,
viewportWidth,
// Element

@@ -80,5 +69,96 @@ create,

API
---
* [Dimension](#dimension)
* [inViewport()](#inviewport)
* [scrollbarSize()](#scrollbarsize)
* [viewportHeight()](#viewportheight)
* [viewportWidth()](#viewportwidth)
* [Element](#element)
* [create()](#create)
* [addClass()](#addclass)
* [removeClass()](#removeclass)
* [hasClass()](#hasclass)
* [data()](#data)
* [Event](#event)
* [ready()](#ready)
* [on()](#on)
* [off()](#off)
* [delegate()](#delegate)
* [dispatch()](#dispatch)
* [Query](#query)
* [find()](#find)
* [closest()](#closest)
* [matches()](#matches)
### Dimension
### inViewport()
```
inViewport(element: Element): bool
```
Returns `true` if any part of an element is in the viewport.
#### Example
```javascript
const inVp = inViewport(element);
```
### scrollbarSize()
```
scrollbarSize(): number
```
Returns the size of the scrollbar in pixels.
#### Example
```javascript
const size = scrollbarSize();
```
### viewportHeight()
```
viewportHeight(): number
```
Returns the viewport height.
Note: The height represent the CSS viewport height
([@media (height)](https://www.w3.org/TR/mediaqueries-4/#height)) including the
size of a rendered scroll bar (if any).
#### Example
```javascript
const vpHeight = viewportHeight();
```
### viewportWidth()
```
viewportWidth(): number
```
Returns the viewport width.
Note: The width represent the CSS viewport width
([@media (width)](https://www.w3.org/TR/mediaqueries-4/#width)) including the
size of a rendered scroll bar (if any).
#### Example
```javascript
const vpWidth = viewportWidth();
```
### Element
### create()
#### create()

@@ -89,5 +169,6 @@ ```

Creates a DOM element from a HTML string.
Creates a DOM element from a HTML string. If it's already a DOM node, the node
is returned as is.
#### Example
##### Example

@@ -98,3 +179,3 @@ ```javascript

### addClass()
#### addClass()

@@ -107,3 +188,3 @@ ```

#### Example
##### Example

@@ -115,3 +196,3 @@ ```javascript

### removeClass()
#### removeClass()

@@ -124,3 +205,3 @@ ```

#### Example
##### Example

@@ -132,3 +213,3 @@ ```javascript

### hasClass()
#### hasClass()

@@ -141,3 +222,3 @@ ```

#### Example
##### Example

@@ -149,3 +230,3 @@ ```javascript

### data()
#### data()

@@ -158,3 +239,3 @@ ```

#### Example
##### Example

@@ -187,3 +268,3 @@ ```html

### ready()
#### ready()

@@ -198,3 +279,3 @@ ```

#### Example
##### Example

@@ -207,3 +288,3 @@ ```javascript

### on()
#### on()

@@ -228,3 +309,3 @@ ```

#### Example
##### Example

@@ -250,3 +331,3 @@ ```javascript

### off()
#### off()

@@ -259,3 +340,3 @@ ```

#### Example
##### Example

@@ -271,3 +352,3 @@ ```javascript

### delegate()
#### delegate()

@@ -284,3 +365,3 @@ ```

#### Example
##### Example

@@ -306,6 +387,6 @@ ```javascript

### dispatch()
#### dispatch()
```
dispatch(target: EventTarget, type: string[, eventInit: CustomEventInit]): function
dispatch(target: EventTarget, type: string[, eventInit: CustomEventInit]): bool
```

@@ -316,8 +397,12 @@

#### Example
The function returns `false` if the event is cancelable and at least one of the
event handlers which handled this event called `Event.preventDefault()`.
Otherwise it returns `true`.
##### Example
```javascript
dispatch(document, 'click');
const clickNotCancelled = dispatch(document, 'click');
dispatch(
const myEventNotCancelled = dispatch(
document.querySelector('.my-button'),

@@ -324,0 +409,0 @@ 'my:event',

@@ -0,2 +1,10 @@

function check(element) {
return element && element.classList;
}
export function addClass(element, classNames) {
if (!check(element)) {
return;
}
classNames.split(' ').forEach(className => {

@@ -8,2 +16,6 @@ element.classList.add(className);

export function removeClass(element, classNames) {
if (!check(element)) {
return;
}
classNames.split(' ').forEach(className => {

@@ -15,2 +27,6 @@ element.classList.remove(className);

export function hasClass(element, classNames) {
if (!check(element)) {
return;
}
return classNames.split(' ').every(className => {

@@ -17,0 +33,0 @@ return element.classList.contains(className);

@@ -23,2 +23,6 @@ /*

export default function create(html) {
if (html.nodeType) {
return html;
}
let element = document.createElement('div');

@@ -25,0 +29,0 @@

@@ -10,2 +10,6 @@ /*

export default function data(element, key) {
if (!element || typeof element.getAttribute !== 'function') {
return null;
}
const name = 'data-' + key.replace(regExpMultiDash, '-$&').toLowerCase();

@@ -12,0 +16,0 @@ const data = element.getAttribute(name);

export default function dispatch(target, type, eventInit = {}) {
if (!target || typeof target.dispatchEvent !== 'function') {
return true;
}
eventInit.bubbles = eventInit.bubbles || false;

@@ -3,0 +7,0 @@ eventInit.cancelable = eventInit.cancelable || false;

import optionsArgument from './options-argument';
export default function off(target, type, listener, options = {capture: false}) {
if (!target || typeof target.removeEventListener !== 'function') {
return () => {};
}
target.removeEventListener(type, listener, optionsArgument(options));
}

@@ -6,2 +6,6 @@ import optionsSupport from './options-support';

export default function on(target, type, listener, options = {capture: false}) {
if (!target || typeof target.addEventListener !== 'function') {
return () => {};
}
let callback = listener;

@@ -8,0 +12,0 @@

import matches from './matches';
export default function closest(element, selector) {
if (!element || !selector) {
if (!element) {
return null;

@@ -17,3 +17,3 @@ }

element = element.parentElement || element.parentNode;
element = element.parentNode;
} while (element && element.nodeType === 1);

@@ -20,0 +20,0 @@

@@ -1,11 +0,12 @@

export default function find(selector, element = document) {
if (
!selector ||
!element ||
typeof element.querySelectorAll !== 'function'
) {
export default function find(selector, element) {
// Check here for explicitly passed element argument.
// find('selector', undefined) must return an empty array instead of using
// document as context.
const context = arguments.length > 1 ? element : document;
if (!context || typeof context.querySelectorAll !== 'function') {
return [];
}
return [].slice.call(element.querySelectorAll(selector));
return [].slice.call(context.querySelectorAll(selector));
}
export default function matches(element, selector) {
if (!element || !selector) {
if (!element) {
return false;

@@ -10,3 +10,7 @@ }

return nativeMatches && nativeMatches.call(element, selector);
if (typeof nativeMatches !== 'function') {
return false;
}
return nativeMatches.call(element, selector);
}
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc