material-toggle - npm Package Compare versions

Comparing version 1.0.5 to 1.0.6

bower.json

@@ -26,4 +26,5 @@ {
     "shadycss": "webcomponents/shadycss",
-    "shadydom": "webcomponents/shadydom"
+    "shadydom": "webcomponents/shadydom",
+    "web-component-tester": "^6.0.0"
   }
 }

dist/material-toggle.js

@@ -1,39 +0,28 @@
-/**
- * transfer attributes to input
- */
+(function () {
+'use strict';
+
+const makeTemplate = function (strings) {
+    let html = strings[strings.length - 1];
+    let template = document.createElement('template');
+    template.innerHTML = html;
+    return template;
+};
+
 const _transferAttributes = function (ce, element, allowed) {
-  allowed.forEach(function (attrName) {
-    if (ce.hasAttribute(attrName)) {
-      element.setAttribute(attrName, ce.getAttribute(attrName) || '')
-      ce.removeAttribute(attrName)
-    }
-  })
-}
-
-/**
- * get parent form
- */
+    allowed.forEach(function (attrName) {
+        if (ce.hasAttribute(attrName)) {
+            element.setAttribute(attrName, ce.getAttribute(attrName) || '');
+            ce.removeAttribute(attrName);
+        }
+    });
+};
 const _getParentForm = function (current) {
-  current = current.parentElement
-    // return form
-  if (current.constructor === HTMLFormElement) return current // eslint-disable-line no-undef
-    // return false on body
-  if (current.constructor === HTMLBodyElement) return false // eslint-disable-line no-undef
-    // dig one level deeper
-  return _getParentForm(current)
-}
-
-const makeTemplate = function (strings, ...substs) {
-  var html = ''
-  for (let i = 0; i < substs.length; i++) {
-    html += strings[i]
-    html += substs[i]
-  }
-  html += strings[strings.length - 1]
-  var template = document.createElement('template')
-  template.innerHTML = html
-  return template
-}
-
-var template = makeTemplate`<style>
+    current = current.parentElement;
+    if (current.constructor === HTMLFormElement)
+        return current;
+    if (current.constructor === HTMLBodyElement)
+        return false;
+    return _getParentForm(current);
+};
+var template = makeTemplate `<style>
     :host{
@@ -115,156 +104,125 @@ display: inline-block;
     </div>
-`
-
-/**
- * A simple (boolean) material toggle based on a checkbox, which works in a normal html form
- */
-class MaterialToggle extends HTMLElement { // eslint-disable-line no-undef
-
-  constructor () {
-    super()
-        // Attach a shadow root to the element.
-    let shadowRoot = this.attachShadow({mode: 'open'})
-    // check if polyfill is used
-    if (typeof ShadyCSS !== 'undefined') {
-      ShadyCSS.prepareTemplate(template, 'material-toggle') // eslint-disable-line no-undef
-      ShadyCSS.applyStyle(this) // eslint-disable-line no-undef
+`;
+class MaterialToggle extends HTMLElement {
+    constructor() {
+        super();
+        this._knob = null;
+        this._label = null;
+        this._checkbox = null;
+        let shadowRoot = this.attachShadow({ mode: 'open' });
+        if (typeof ShadyCSS !== 'undefined') {
+            ShadyCSS.prepareTemplate(template, 'material-toggle');
+            ShadyCSS.styleElement(this);
+        }
+        shadowRoot.appendChild(document.importNode(template.content, true));
     }
-    shadowRoot.appendChild(document.importNode(template.content, true))
-  }
-
-  connectedCallback () {
-        // get elements
-    this.$knob = this.shadowRoot.querySelector('.material-toggle__knob')
-    this.$label = document.createElement('label')
-    this.$label.innerHTML = `
+    connectedCallback() {
+        this._knob = this.shadowRoot.querySelector('.material-toggle__knob');
+        this._label = document.createElement('label');
+        this._label.innerHTML = `
             <input type="checkbox" tabindex="-1" style="position: absolute; opacity: 0; pointer-events: none;"/>
             <div class="material-toggle__label">${this.innerHTML}</div>
-        `
-        // remove potential label from slot as it is added above
-    this.innerHTML = ''
-    this.appendChild(this.$label)
-    this.$checkbox = this.querySelector('input')
-
-    _transferAttributes(this, this.$checkbox, [
-      'name',
-      'required',
-      'autofocus'
-    ])
-        // reset values
-    this.disabled = this.disabled
-    this.checked = this.checked
-        // add events
-    this._addEvents()
-  }
-
-  _addEvents () {
-        // add event
-    this.$checkbox.addEventListener('change', function (e) {
-      this.checked = e.target.checked
-    }.bind(this))
-        // move focus to main element if checkbox is focused
-    this.$checkbox.addEventListener('focus', function () {
-      this.focus()
-    }.bind(this))
-        // toggle checkbox in space
-    this.addEventListener('keydown', function (e) {
-            // space
-      if (e.keyCode === 32) {
-        this.checked = !this.$checkbox.checked
-      }
-    }.bind(this))
-        // submit form on return
-    this.addEventListener('keydown', function (e) {
-      var $form = _getParentForm(e.target)
-            // return
-      if (e.keyCode === 13) {
-        if ($form.checkValidity()) {
-          $form.submit()
-        } else if ($form.querySelector('[type="submit"]') !== null) {
-                    // needed to trigger validation
-          $form.querySelector('[type="submit"]').click()
+        `;
+        this.innerHTML = '';
+        this.appendChild(this._label);
+        this._checkbox = this.querySelector('input');
+        _transferAttributes(this, this._checkbox, [
+            'name',
+            'required',
+            'autofocus'
+        ]);
+        this.disabled = this.disabled;
+        this.checked = this.checked;
+        this._addEvents();
+    }
+    _addEvents() {
+        this._checkbox.addEventListener('change', function (e) {
+            this.checked = e.target.checked;
+        }.bind(this));
+        this._checkbox.addEventListener('focus', function () {
+            this.focus();
+        }.bind(this));
+        this.addEventListener('keydown', function (e) {
+            if (e.keyCode === 32) {
+                this.checked = !this._checkbox.checked;
+            }
+        }.bind(this));
+        this.addEventListener('keydown', function (e) {
+            var $form = _getParentForm(e.target);
+            if (e.keyCode === 13) {
+                if ($form.checkValidity()) {
+                    $form.submit();
+                }
+                else if ($form.querySelector('[type="submit"]') !== null) {
+                    $form.querySelector('[type="submit"]').click();
+                }
+                return;
+            }
+        });
+        this._label.addEventListener('mousedown', function () {
+            this._knob.classList.add('unfocused');
+        }.bind(this));
+        this._label.addEventListener('keydown', function () {
+            this._knob.classList.remove('unfocused');
+        }.bind(this));
+    }
+    static get observedAttributes() {
+        return ['disabled', 'checked', 'validity'];
+    }
+    attributeChangedCallback(attrName, oldVal, newVal) {
+        if (this.disabled) {
+            this.setAttribute('tabindex', '-1');
+            this.setAttribute('aria-disabled', 'true');
         }
-        return
-      }
-    })
-        // remove focus on click
-    this.$label.addEventListener('mousedown', function () {
-      this.$knob.classList.add('unfocused')
-    }.bind(this))
-        // add focus on mouse event
-    this.$label.addEventListener('keydown', function () {
-      this.$knob.classList.remove('unfocused')
-    }.bind(this))
-  }
-
-  static get observedAttributes () {
-    return [
-            /** @type {boolean} When given the element is totally inactive */
-      'disabled',
-            /** @type {boolean} When given the element is set to active */
-      'checked',
-            /** @type {true|false} When given, sets the validity state */
-      'validity'
-    ]
-  }
-
-  attributeChangedCallback (attrName, oldVal, newVal) {
-    if (this.disabled) {
-      this.setAttribute('tabindex', '-1')
-      this.setAttribute('aria-disabled', 'true')
-    } else {
-      this.setAttribute('tabindex', '0')
-      this.setAttribute('aria-disabled', 'false')
+        else {
+            this.setAttribute('tabindex', '0');
+            this.setAttribute('aria-disabled', 'false');
+        }
     }
-  }
-
-  get disabled () {
-    return this.hasAttribute('disabled')
-  }
-
-  set disabled (val) {
-        // Reflect the value of `disabled` as an attribute.
-    if (val) {
-      this.setAttribute('disabled', '')
-      this.$checkbox.setAttribute('disabled', '')
-    } else {
-      this.removeAttribute('disabled')
-      this.$checkbox.removeAttribute('disabled')
+    get disabled() {
+        return this.hasAttribute('disabled');
     }
-  }
-
-  get checked () {
-    return this.hasAttribute('checked')
-  }
-
-  set checked (val) {
-    if (val) {
-      this.setAttribute('checked', '')
-      if (this.$checkbox !== undefined) {
-        this.$checkbox.setAttribute('checked', '')
-      }
-    } else {
-      this.removeAttribute('checked')
-      if (this.$checkbox !== undefined) {
-        this.$checkbox.removeAttribute('checked')
-      }
+    set disabled(val) {
+        if (val) {
+            this.setAttribute('disabled', '');
+            this._checkbox.setAttribute('disabled', '');
+        }
+        else {
+            this.removeAttribute('disabled');
+            this._checkbox.removeAttribute('disabled');
+        }
     }
-  }
-
-  set validity (val) {
-        // Reflect the value of `validity` as an attribute.
-    if (val === true || val === false) {
-      this.setAttribute('validity', val)
-    } else {
-      this.removeAttribute('validity')
+    get checked() {
+        return this.hasAttribute('checked');
     }
-  }
-
-  get validity () {
-    return this.getAttribute('validity')
-  }
+    set checked(val) {
+        if (val) {
+            this.setAttribute('checked', '');
+            if (this._checkbox !== undefined) {
+                this._checkbox.setAttribute('checked', '');
+            }
+        }
+        else {
+            this.removeAttribute('checked');
+            if (this._checkbox !== undefined) {
+                this._checkbox.removeAttribute('checked');
+            }
+        }
+    }
+    set active(val) {
+        if (val === true) {
+            this.setAttribute('validity', 'true');
+        }
+        else if (val === false) {
+            this.removeAttribute('validity');
+        }
+    }
+    get validity() {
+        return this.getAttribute('validity') === 'true';
+    }
 }
 
-customElements.define('material-toggle', MaterialToggle) // eslint-disable-line no-undef
+customElements.define('material-toggle', MaterialToggle);
 
+}());
 //# sourceMappingURL=material-toggle.js.map

docs/material-toggle.js

@@ -1,39 +0,28 @@
-/**
- * transfer attributes to input
- */
+(function () {
+'use strict';
+
+const makeTemplate = function (strings) {
+    let html = strings[strings.length - 1];
+    let template = document.createElement('template');
+    template.innerHTML = html;
+    return template;
+};
+
 const _transferAttributes = function (ce, element, allowed) {
-  allowed.forEach(function (attrName) {
-    if (ce.hasAttribute(attrName)) {
-      element.setAttribute(attrName, ce.getAttribute(attrName) || '')
-      ce.removeAttribute(attrName)
-    }
-  })
-}
-
-/**
- * get parent form
- */
+    allowed.forEach(function (attrName) {
+        if (ce.hasAttribute(attrName)) {
+            element.setAttribute(attrName, ce.getAttribute(attrName) || '');
+            ce.removeAttribute(attrName);
+        }
+    });
+};
 const _getParentForm = function (current) {
-  current = current.parentElement
-    // return form
-  if (current.constructor === HTMLFormElement) return current // eslint-disable-line no-undef
-    // return false on body
-  if (current.constructor === HTMLBodyElement) return false // eslint-disable-line no-undef
-    // dig one level deeper
-  return _getParentForm(current)
-}
-
-const makeTemplate = function (strings, ...substs) {
-  var html = ''
-  for (let i = 0; i < substs.length; i++) {
-    html += strings[i]
-    html += substs[i]
-  }
-  html += strings[strings.length - 1]
-  var template = document.createElement('template')
-  template.innerHTML = html
-  return template
-}
-
-var template = makeTemplate`<style>
+    current = current.parentElement;
+    if (current.constructor === HTMLFormElement)
+        return current;
+    if (current.constructor === HTMLBodyElement)
+        return false;
+    return _getParentForm(current);
+};
+var template = makeTemplate `<style>
     :host{
@@ -115,153 +104,125 @@ display: inline-block;
     </div>
-`
-
-ShadyCSS.prepareTemplate(template, 'material-toggle') // eslint-disable-line no-undef
-/**
- * A simple (boolean) material toggle based on a checkbox, which works in a normal html form
- */
-class MaterialToggle extends HTMLElement { // eslint-disable-line no-undef
-
-  constructor () {
-    super()
-        // Attach a shadow root to the element.
-    let shadowRoot = this.attachShadow({mode: 'open'})
-    ShadyCSS.applyStyle(this) // eslint-disable-line no-undef
-    shadowRoot.appendChild(document.importNode(template.content, true))
-  }
-
-  connectedCallback () {
-        // get elements
-    this.$knob = this.shadowRoot.querySelector('.material-toggle__knob')
-    this.$label = document.createElement('label')
-    this.$label.innerHTML = `
+`;
+class MaterialToggle extends HTMLElement {
+    constructor() {
+        super();
+        this._knob = null;
+        this._label = null;
+        this._checkbox = null;
+        let shadowRoot = this.attachShadow({ mode: 'open' });
+        if (typeof ShadyCSS !== 'undefined') {
+            ShadyCSS.prepareTemplate(template, 'material-toggle');
+            ShadyCSS.styleElement(this);
+        }
+        shadowRoot.appendChild(document.importNode(template.content, true));
+    }
+    connectedCallback() {
+        this._knob = this.shadowRoot.querySelector('.material-toggle__knob');
+        this._label = document.createElement('label');
+        this._label.innerHTML = `
             <input type="checkbox" tabindex="-1" style="position: absolute; opacity: 0; pointer-events: none;"/>
             <div class="material-toggle__label">${this.innerHTML}</div>
-        `
-        // remove potential label from slot as it is added above
-    this.innerHTML = ''
-    this.appendChild(this.$label)
-    this.$checkbox = this.querySelector('input')
-
-    _transferAttributes(this, this.$checkbox, [
-      'name',
-      'required',
-      'autofocus'
-    ])
-        // reset values
-    this.disabled = this.disabled
-    this.checked = this.checked
-        // add events
-    this._addEvents()
-  }
-
-  _addEvents () {
-        // add event
-    this.$checkbox.addEventListener('change', function (e) {
-      this.checked = e.target.checked
-    }.bind(this))
-        // move focus to main element if checkbox is focused
-    this.$checkbox.addEventListener('focus', function () {
-      this.focus()
-    }.bind(this))
-        // toggle checkbox in space
-    this.addEventListener('keydown', function (e) {
-            // space
-      if (e.keyCode === 32) {
-        this.checked = !this.$checkbox.checked
-      }
-    }.bind(this))
-        // submit form on return
-    this.addEventListener('keydown', function (e) {
-      var $form = _getParentForm(e.target)
-            // return
-      if (e.keyCode === 13) {
-        if ($form.checkValidity()) {
-          $form.submit()
-        } else if ($form.querySelector('[type="submit"]') !== null) {
-                    // needed to trigger validation
-          $form.querySelector('[type="submit"]').click()
+        `;
+        this.innerHTML = '';
+        this.appendChild(this._label);
+        this._checkbox = this.querySelector('input');
+        _transferAttributes(this, this._checkbox, [
+            'name',
+            'required',
+            'autofocus'
+        ]);
+        this.disabled = this.disabled;
+        this.checked = this.checked;
+        this._addEvents();
+    }
+    _addEvents() {
+        this._checkbox.addEventListener('change', function (e) {
+            this.checked = e.target.checked;
+        }.bind(this));
+        this._checkbox.addEventListener('focus', function () {
+            this.focus();
+        }.bind(this));
+        this.addEventListener('keydown', function (e) {
+            if (e.keyCode === 32) {
+                this.checked = !this._checkbox.checked;
+            }
+        }.bind(this));
+        this.addEventListener('keydown', function (e) {
+            var $form = _getParentForm(e.target);
+            if (e.keyCode === 13) {
+                if ($form.checkValidity()) {
+                    $form.submit();
+                }
+                else if ($form.querySelector('[type="submit"]') !== null) {
+                    $form.querySelector('[type="submit"]').click();
+                }
+                return;
+            }
+        });
+        this._label.addEventListener('mousedown', function () {
+            this._knob.classList.add('unfocused');
+        }.bind(this));
+        this._label.addEventListener('keydown', function () {
+            this._knob.classList.remove('unfocused');
+        }.bind(this));
+    }
+    static get observedAttributes() {
+        return ['disabled', 'checked', 'validity'];
+    }
+    attributeChangedCallback(attrName, oldVal, newVal) {
+        if (this.disabled) {
+            this.setAttribute('tabindex', '-1');
+            this.setAttribute('aria-disabled', 'true');
         }
-        return
-      }
-    })
-        // remove focus on click
-    this.$label.addEventListener('mousedown', function () {
-      this.$knob.classList.add('unfocused')
-    }.bind(this))
-        // add focus on mouse event
-    this.$label.addEventListener('keydown', function () {
-      this.$knob.classList.remove('unfocused')
-    }.bind(this))
-  }
-
-  static get observedAttributes () {
-    return [
-            /** @type {boolean} When given the element is totally inactive */
-      'disabled',
-            /** @type {boolean} When given the element is set to active */
-      'checked',
-            /** @type {true|false} When given, sets the validity state */
-      'validity'
-    ]
-  }
-
-  attributeChangedCallback (attrName, oldVal, newVal) {
-    if (this.disabled) {
-      this.setAttribute('tabindex', '-1')
-      this.setAttribute('aria-disabled', 'true')
-    } else {
-      this.setAttribute('tabindex', '0')
-      this.setAttribute('aria-disabled', 'false')
+        else {
+            this.setAttribute('tabindex', '0');
+            this.setAttribute('aria-disabled', 'false');
+        }
     }
-  }
-
-  get disabled () {
-    return this.hasAttribute('disabled')
-  }
-
-  set disabled (val) {
-        // Reflect the value of `disabled` as an attribute.
-    if (val) {
-      this.setAttribute('disabled', '')
-      this.$checkbox.setAttribute('disabled', '')
-    } else {
-      this.removeAttribute('disabled')
-      this.$checkbox.removeAttribute('disabled')
+    get disabled() {
+        return this.hasAttribute('disabled');
     }
-  }
-
-  get checked () {
-    return this.hasAttribute('checked')
-  }
-
-  set checked (val) {
-    if (val) {
-      this.setAttribute('checked', '')
-      if (this.$checkbox !== undefined) {
-        this.$checkbox.setAttribute('checked', '')
-      }
-    } else {
-      this.removeAttribute('checked')
-      if (this.$checkbox !== undefined) {
-        this.$checkbox.removeAttribute('checked')
-      }
+    set disabled(val) {
+        if (val) {
+            this.setAttribute('disabled', '');
+            this._checkbox.setAttribute('disabled', '');
+        }
+        else {
+            this.removeAttribute('disabled');
+            this._checkbox.removeAttribute('disabled');
+        }
     }
-  }
-
-  set validity (val) {
-        // Reflect the value of `validity` as an attribute.
-    if (val === true || val === false) {
-      this.setAttribute('validity', val)
-    } else {
-      this.removeAttribute('validity')
+    get checked() {
+        return this.hasAttribute('checked');
     }
-  }
-
-  get validity () {
-    return this.getAttribute('validity')
-  }
+    set checked(val) {
+        if (val) {
+            this.setAttribute('checked', '');
+            if (this._checkbox !== undefined) {
+                this._checkbox.setAttribute('checked', '');
+            }
+        }
+        else {
+            this.removeAttribute('checked');
+            if (this._checkbox !== undefined) {
+                this._checkbox.removeAttribute('checked');
+            }
+        }
+    }
+    set active(val) {
+        if (val === true) {
+            this.setAttribute('validity', 'true');
+        }
+        else if (val === false) {
+            this.removeAttribute('validity');
+        }
+    }
+    get validity() {
+        return this.getAttribute('validity') === 'true';
+    }
 }
 
-customElements.define('material-toggle', MaterialToggle) // eslint-disable-line no-undef
+customElements.define('material-toggle', MaterialToggle);
 
+}());
 //# sourceMappingURL=material-toggle.js.map

package.json

 {
   "name": "material-toggle",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "Material Design toggle web component. No framework, vanilla js",
   "main": "dist/material-toggle.js",
+  "config": {
+    "src": "src/material-toggle.ts",
+    "moduleName": "MaterialToggle"
+  },
   "scripts": {
-    "test": "./node_modules/.bin/wct && standard 'src/*.js' | snazzy",
-    "travis": "./node_modules/.bin/wct ",
+    "standard": "standard src/*.ts --parser typescript-eslint-parser | snazzy",
+    "typescript": "tsc src/*.ts --noEmit --pretty --alwaysStrict --noUnusedLocals --allowJs --target ES5 --lib es6,dom",
+    "test": "rollup -c -m inline -o src/material-toggle.js && npm run standard &&  ./node_modules/.bin/wct && rm src/material-toggle.js",
+    "quick-test": "rollup -c -m inline -o src/material-toggle.js && npm run standard && wct --skip-selenium-install && rm src/material-toggle.js",
+    "build": "npm test && rollup -c && cp dist/material-toggle.js docs/material-toggle.js && cp -r node_modules/@webcomponents/webcomponentsjs docs/webcomponentsjs",
+    "travis": "rollup -c -m inline -o src/material-toggle.js && ./node_modules/.bin/wct && rm src/material-toggle.js",
     "cover": "./node_modules/.bin/istanbul cover ./node_modules/mocha/bin/_mocha test/*.js --report lcovonly -- -R spec && cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js && rm -rf ./coverage"
@@ -28,16 +36,18 @@ },
   "devDependencies": {
-    "@webcomponents/custom-elements": "^1.0.0-alpha.3",
-    "@webcomponents/shadycss": "github:webcomponents/shadycss",
-    "@webcomponents/shadydom": "github:webcomponents/shadydom",
-    "coveralls": "^2.11.14",
-    "gulp": "^3.9.1",
-    "gulp-sourcemaps": "^1.6.0",
+    "@webcomponents/webcomponentsjs": "^1.0.1",
+    "bower": "^1.8.0",
+    "coveralls": "^2.13.1",
     "istanbul": "^0.4.5",
+    "make-template": "^1.0.1",
     "mocha-istanbul": "^0.3.0",
+    "rollup": "^0.42.0",
+    "rollup-plugin-node-resolve": "^3.0.0",
+    "rollup-plugin-typescript": "^0.8.1",
     "snazzy": "^6.0.0",
     "standard": "^8.6.0",
-    "web-component-tester": "^5.0.0",
+    "typescript": "^2.4.0",
+    "typescript-eslint-parser": "^3.0.0",
+    "web-component-tester": "^6.0.0",
     "web-component-tester-istanbul": "^0.3.0"
-  },
-  "dependencies": {}
+  }
 }

README.md

@@ -5,3 +5,4 @@ # Material-toggle
 [![Spec Custom Elements V1](https://img.shields.io/badge/spec-custom%20elements%20v1-F52757.svg?style=flat-square)](https://www.w3.org/TR/custom-elements/)
-[![Build Status](https://img.shields.io/travis/nuclei/material-toggle/master.svg?style=flat-square)](https://travis-ci.org/nuclei/material-toggle) [![npm](https://img.shields.io/npm/v/material-toggle.svg?style=flat-square)](https://www.npmjs.com/package/material-toggle) [![npm](https://img.shields.io/npm/dt/material-toggle.svg?style=flat-square)](https://www.npmjs.com/package/material-toggle) [![npm](https://img.shields.io/npm/l/material-toggle.svg?style=flat-square)](https://github.com/nuclei/material-toggle/blob/master/LICENSE)
+[![Build Status](https://img.shields.io/travis/nuclei/material-toggle/master.svg?style=flat-square)](https://travis-ci.org/nuclei/material-toggle) [![npm](https://img.shields.io/npm/v/material-toggle.svg?style=flat-square)](https://www.npmjs.com/package/material-toggle)
+[![Known Vulnerabilities](https://snyk.io/test/github/nuclei/material-toggle/badge.svg?style=flat-square)](https://snyk.io/test/github/nuclei/material-toggle) [![npm](https://img.shields.io/npm/dt/material-toggle.svg?style=flat-square)](https://www.npmjs.com/package/material-toggle) [![npm](https://img.shields.io/npm/l/material-toggle.svg?style=flat-square)](https://github.com/nuclei/material-toggle/blob/master/LICENSE)
 
@@ -8,0 +9,0 @@ ## Demo

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Uses eval

Supply chain risk

Package uses eval() which is a dangerous function. This prevents the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

spdx disjunction for an artifact's license information

License

spdx disjunction for an artifact's license information

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Fixed alerts

spdx disjunction for an artifact's license information

License

spdx disjunction for an artifact's license information

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

3790953

increased by3090.18%

Number of package files

152

increased by700%

Lines of code

4405

increased by302.65%

Number of lines in readme file

58

increased by1.75%

Worsened metrics

Dev dependency count

15

increased by25%

Number of low license alerts

2

increased by100%

Number of low quality alerts

2

increased byInfinity%

Number of medium supply chain risk alerts

3

increased byInfinity%

No dependency changes