@material/mwc-base - npm Package Compare versions

Comparing version 0.6.0 to 0.7.0

base-element.d.ts

@@ -17,4 +17,4 @@ /**
 */
+import { MDCFoundation } from '@material/base';
 import { LitElement } from 'lit-element';
-import { MDCFoundation } from '@material/base';
 import { Constructor } from './utils.js';
@@ -57,3 +57,3 @@ export * from 'lit-element';
     protected createFoundation(): void;
-    firstUpdated(): void;
+    protected firstUpdated(): void;
 }

form-element.d.ts

@@ -33,3 +33,3 @@ /**
     protected abstract formElement: HTMLElement;
-    createRenderRoot(): ShadowRoot;
+    protected createRenderRoot(): ShadowRoot;
     /**
@@ -41,3 +41,3 @@ * Implement ripple getter for Ripple integration with mwc-formfield
     setAriaLabel(label: string): void;
-    firstUpdated(): void;
+    protected firstUpdated(): void;
 }

form-element.js

@@ -36,3 +36,3 @@ /**
         super.firstUpdated();
-        this.mdcRoot.addEventListener('change', e => {
+        this.mdcRoot.addEventListener('change', (e) => {
             this.dispatchEvent(new Event('change', e));
@@ -39,0 +39,0 @@ });

observer.js

@@ -1,2 +0,4 @@
-export const observer = (observer) => (proto, propName) => {
+export const observer = (observer) => 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+(proto, propName) => {
     // if we haven't wrapped `updated` in this class, do so
@@ -20,3 +22,5 @@ if (!proto.constructor._observers) {
         proto.constructor._observers = new Map();
-        observers.forEach((v, k) => proto.constructor._observers.set(k, v));
+        observers.forEach(
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        (v, k) => proto.constructor._observers.set(k, v));
     }
@@ -23,0 +27,0 @@ // set this method

package.json

 {
   "name": "@material/mwc-base",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "",
   "repository": {
     "type": "git",
-    "url": "https://github.com/material-components/material-components-web-components.git"
+    "url": "https://github.com/material-components/material-components-web-components.git",
+    "directory": "packages/base"
   },
   "license": "Apache-2.0",
   "dependencies": {
-    "@material/base": "^1.0.0",
-    "lit-element": "^2.0.1",
+    "@material/base": "^3.0.0",
+    "@material/dom": "^3.1.0",
+    "lit-element": "^2.2.1",
     "lit-html": "^1.0.0"
@@ -18,3 +20,3 @@ },
   },
-  "gitHead": "1961a2530cc20bc020bba88f4da76d085ad1f1e0"
+  "gitHead": "c8c5d01ad2103af63e3d7656b5d1acc5ccaa05db"
 }

README.md

@@ -5,2 +5,2 @@ # mwc-base
 
-A suite of shared libraries and utility functions for [Material Components](https://material.io/components/)[Web Components](https://www.webcomponents.org/introduction)
+A suite of shared libraries and utility functions for [Material Components](https://material.io/components/) [Web Components](https://www.webcomponents.org/introduction)

src/base-element.ts

@@ -18,4 +18,5 @@ /**
 
+import {MDCFoundation} from '@material/base';
 import {LitElement} from 'lit-element';
-import {MDCFoundation} from '@material/base';
+
 import {Constructor} from './utils.js';
@@ -30,3 +31,2 @@
 export abstract class BaseElement extends LitElement {
-
   /**
@@ -73,5 +73,5 @@ * Root element for MDC Foundation usage.
 
-  firstUpdated() {
+  protected firstUpdated() {
     this.createFoundation();
   }
-}
+}

src/form-element.ts

@@ -38,3 +38,3 @@ /**
 
-  createRenderRoot() {
+  protected createRenderRoot() {
     return this.attachShadow({mode: 'open', delegatesFocus: true});
@@ -61,8 +61,8 @@ }
 
-  firstUpdated() {
+  protected firstUpdated() {
     super.firstUpdated();
-    this.mdcRoot.addEventListener('change', e => {
+    this.mdcRoot.addEventListener('change', (e) => {
       this.dispatchEvent(new Event('change', e));
     });
   }
-}
+}

src/observer.ts

@@ -20,27 +20,32 @@ /**
 export interface Observer {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   (value: any, old: any): void;
 }
 
-export const observer = (observer: Observer) => (proto: any, propName: PropertyKey) => {
-  // if we haven't wrapped `updated` in this class, do so
-  if (!proto.constructor._observers) {
-    proto.constructor._observers = new Map<PropertyKey, Observer>();
-    const userUpdated = proto.updated;
-    proto.updated = function(changedProperties: PropertyValues) {
-      userUpdated.call(this, changedProperties);
-      changedProperties.forEach((v, k) => {
-        const observer = this.constructor._observers.get(k);
-        if (observer !== undefined) {
-          observer.call(this, this[k], v);
-        }
-      });
+export const observer = (observer: Observer) =>
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (proto: any, propName: PropertyKey) => {
+      // if we haven't wrapped `updated` in this class, do so
+      if (!proto.constructor._observers) {
+        proto.constructor._observers = new Map<PropertyKey, Observer>();
+        const userUpdated = proto.updated;
+        proto.updated = function(changedProperties: PropertyValues) {
+          userUpdated.call(this, changedProperties);
+          changedProperties.forEach((v, k) => {
+            const observer = this.constructor._observers.get(k);
+            if (observer !== undefined) {
+              observer.call(this, this[k], v);
+            }
+          });
+        };
+        // clone any existing observers (superclasses)
+      } else if (!proto.constructor.hasOwnProperty('_observers')) {
+        const observers = proto.constructor._observers;
+        proto.constructor._observers = new Map();
+        observers.forEach(
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            (v: any, k: PropertyKey) => proto.constructor._observers.set(k, v));
+      }
+      // set this method
+      proto.constructor._observers.set(propName, observer);
     };
-  // clone any existing observers (superclasses)
-  } else if (!proto.constructor.hasOwnProperty('_observers')) {
-    const observers = proto.constructor._observers;
-    proto.constructor._observers  = new Map();
-    observers.forEach((v: any, k: PropertyKey) => proto.constructor._observers.set(k, v));
-  }
-  // set this method
-  proto.constructor._observers.set(propName, observer);
-};

src/utils.ts

@@ -21,2 +21,5 @@ /**
  */
+
+import {matches} from '@material/dom/ponyfill';
+
 export function findAssignedElement(slot: HTMLSlotElement, selector: string) {
@@ -26,3 +29,3 @@ for (const node of slot.assignedNodes({flatten: true})) {
       const el = (node as HTMLElement);
-      if (el.matches(selector)) {
+      if (matches(el, selector)) {
         return el;
@@ -36,2 +39,3 @@ }
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export type Constructor<T> = new (...args: any[]) => T;
@@ -47,4 +51,19 @@
     },
-    hasClass: (className: string) => element.classList.contains(className)
+    hasClass: (className: string) => element.classList.contains(className),
+  };
+}
+
+let supportsPassive = false;
+const fn = () => {};
+const optionsBlock: AddEventListenerOptions = {
+  get passive() {
+    supportsPassive = true;
+    return false;
   }
-}
+};
+document.addEventListener('x', fn, optionsBlock);
+document.removeEventListener('x', fn);
+/**
+ * Do event listeners suport the `passive` option?
+ */
+export const supportsPassiveEventListener = supportsPassive;

utils.d.ts

@@ -17,5 +17,2 @@ /**
 */
-/**
- * Return an element assigned to a given slot that matches the given selector
- */
 export declare function findAssignedElement(slot: HTMLSlotElement, selector: string): HTMLElement | null;
@@ -28,1 +25,5 @@ export declare type Constructor<T> = new (...args: any[]) => T;
 };
+/**
+ * Do event listeners suport the `passive` option?
+ */
+export declare const supportsPassiveEventListener = false;

utils.js

@@ -20,2 +20,3 @@ /**
  */
+import { matches } from '@material/dom/ponyfill';
 export function findAssignedElement(slot, selector) {
@@ -25,3 +26,3 @@ for (const node of slot.assignedNodes({ flatten: true })) {
             const el = node;
-            if (el.matches(selector)) {
+            if (matches(el, selector)) {
                 return el;
@@ -41,5 +42,19 @@ }
         },
-        hasClass: (className) => element.classList.contains(className)
+        hasClass: (className) => element.classList.contains(className),
     };
 }
+let supportsPassive = false;
+const fn = () => { };
+const optionsBlock = {
+    get passive() {
+        supportsPassive = true;
+        return false;
+    }
+};
+document.addEventListener('x', fn, optionsBlock);
+document.removeEventListener('x', fn);
+/**
+ * Do event listeners suport the `passive` option?
+ */
+export const supportsPassiveEventListener = supportsPassive;
 //# sourceMappingURL=utils.js.map

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Lines of code

487

increased by7.27%

Number of lines in readme file

6

increased by20%

Worsened metrics

Total package byte prevSize

42319

decreased by-83.13%

Dependency count

4

increased by33.33%

Number of package files

19

decreased by-13.64%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@material/dom@^3.1.0

• + Added@material/base@3.1.0(transitive)

• + Added@material/dom@3.1.0(transitive)

• - Removed@material/base@1.0.0(transitive)

• Updated@material/base@^3.0.0

• Updatedlit-element@^2.2.1