@material/mwc-base - npm Package Compare versions

Comparing version 0.3.6 to 0.5.0

base-element.d.ts

@@ -18,17 +18,9 @@ /**
 import { LitElement } from 'lit-element';
+import { MDCFoundation } from '@material/base';
+import { Constructor } from './utils.js';
 export * from 'lit-element';
 export { classMap } from 'lit-html/directives/class-map.js';
 export { observer } from './observer.js';
-export interface Adapter {
-    [name: string]: Function;
-}
-/** Extend this Foundation with the functions you use */
-export interface Foundation {
-    init(): void;
-    destroy(): void;
-}
-export declare var Foundation: {
-    prototype: Foundation;
-    new (adapter: Adapter): Foundation;
-};
+export { addHasRemoveClass } from './utils.js';
+export * from '@material/base/types.js';
 export declare abstract class BaseElement extends LitElement {
@@ -44,14 +36,19 @@ /**
      */
-    protected abstract readonly mdcFoundationClass: typeof Foundation;
+    protected abstract readonly mdcFoundationClass: Constructor<MDCFoundation>;
     /**
      * An instance of the MDC Foundation class to attach to the root element
      */
-    protected abstract mdcFoundation: Foundation;
+    protected abstract mdcFoundation: MDCFoundation;
     /**
      * Create the adapter for the `mdcFoundation`.
      *
-     * To extend, spread the super class version into you class:
-     * `{...super.createAdapter(), foo() => {}}`
+     * Override and return an object with the Adapter's functions implemented:
+     *
+     *    {
+     *      addClass: () => {},
+     *      removeClass: () => {},
+     *      ...
+     *    }
      */
-    protected createAdapter(): Adapter;
+    protected abstract createAdapter(): {};
     /**
@@ -58,0 +55,0 @@ * Create and attach the MDC Foundation to the instance

base-element.js

@@ -21,28 +21,9 @@ /**
 export { observer } from './observer.js';
-;
+export { addHasRemoveClass } from './utils.js';
 export class BaseElement extends LitElement {
     /**
-     * Create the adapter for the `mdcFoundation`.
-     *
-     * To extend, spread the super class version into you class:
-     * `{...super.createAdapter(), foo() => {}}`
-     */
-    createAdapter() {
-        return {
-            addClass: (className) => {
-                this.mdcRoot.classList.add(className);
-            },
-            removeClass: (className) => {
-                this.mdcRoot.classList.remove(className);
-            },
-            hasClass: (className) => {
-                return this.mdcRoot.classList.contains(className);
-            }
-        };
-    }
-    /**
      * Create and attach the MDC Foundation to the instance
      */
     createFoundation() {
-        if (this.mdcFoundation) {
+        if (this.mdcFoundation !== undefined) {
             this.mdcFoundation.destroy();
@@ -49,0 +30,0 @@ }

package.json

 {
   "name": "@material/mwc-base",
-  "version": "0.3.6",
+  "version": "0.5.0",
   "description": "",
@@ -11,4 +11,5 @@ "repository": {
   "dependencies": {
-    "lit-element": "^2.0.0-rc.2",
-    "lit-html": "^1.0.0-rc.2"
+    "@material/base": "^1.0.0",
+    "lit-element": "^2.0.1",
+    "lit-html": "^1.0.0"
   },
@@ -15,0 +16,0 @@ "publishConfig": {

src/base-element.ts

@@ -19,21 +19,11 @@ /**
 import {LitElement} from 'lit-element';
+import {MDCFoundation} from '@material/base';
+import {Constructor} from './utils.js';
+
 export * from 'lit-element';
 export {classMap} from 'lit-html/directives/class-map.js';
 export {observer} from './observer.js';
+export {addHasRemoveClass} from './utils.js';
+export * from '@material/base/types.js';
 
-export interface Adapter {
-  [name: string]: Function
-};
-
-/** Extend this Foundation with the functions you use */
-export interface Foundation {
-  init(): void;
-  destroy(): void;
-}
-
-export declare var Foundation: {
-  prototype: Foundation;
-  new(adapter: Adapter): Foundation;
-}
-
 export abstract class BaseElement extends LitElement {
@@ -51,3 +41,3 @@
    */
-  protected abstract readonly mdcFoundationClass: typeof Foundation;
+  protected abstract readonly mdcFoundationClass: Constructor<MDCFoundation>;
 
@@ -57,3 +47,3 @@ /**
    */
-  protected abstract mdcFoundation: Foundation;
+  protected abstract mdcFoundation: MDCFoundation;
 
@@ -63,18 +53,11 @@ /**
    *
-   * To extend, spread the super class version into you class:
-   * `{...super.createAdapter(), foo() => {}}`
+   * Override and return an object with the Adapter's functions implemented:
+   *
+   *    {
+   *      addClass: () => {},
+   *      removeClass: () => {},
+   *      ...
+   *    }
    */
-  protected createAdapter(): Adapter {
-    return {
-      addClass: (className: string) => {
-        this.mdcRoot.classList.add(className);
-      },
-      removeClass: (className: string) => {
-        this.mdcRoot.classList.remove(className);
-      },
-      hasClass: (className: string) => {
-        return this.mdcRoot.classList.contains(className);
-      }
-    };
-  }
+  protected abstract createAdapter(): {}
 
@@ -85,3 +68,3 @@ /**
   protected createFoundation() {
-    if (this.mdcFoundation) {
+    if (this.mdcFoundation !== undefined) {
       this.mdcFoundation.destroy();
@@ -88,0 +71,0 @@ }

src/utils.ts

@@ -33,1 +33,15 @@ /**
 }
+
+export type Constructor<T> = new (...args: any[]) => T;
+
+export function addHasRemoveClass(element: HTMLElement) {
+  return {
+    addClass: (className: string) => {
+      element.classList.add(className);
+    },
+    removeClass: (className: string) => {
+      element.classList.remove(className);
+    },
+    hasClass: (className: string) => element.classList.contains(className)
+  }
+}

utils.d.ts

@@ -21,1 +21,7 @@ /**
 export declare function findAssignedElement(slot: HTMLSlotElement, selector: string): HTMLElement | null;
+export declare type Constructor<T> = new (...args: any[]) => T;
+export declare function addHasRemoveClass(element: HTMLElement): {
+    addClass: (className: string) => void;
+    removeClass: (className: string) => void;
+    hasClass: (className: string) => boolean;
+};

utils.js

@@ -31,2 +31,13 @@ /**
 }
+export function addHasRemoveClass(element) {
+    return {
+        addClass: (className) => {
+            element.classList.add(className);
+        },
+        removeClass: (className) => {
+            element.classList.remove(className);
+        },
+        hasClass: (className) => element.classList.contains(className)
+    };
+}
 //# 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

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

Total package byte prevSize

32003

increased by0.49%

Worsened metrics

Dependency count

3

increased by50%

Lines of code

586

decreased by-1.51%

Dependency changes

• + Added@material/base@^1.0.0

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

• + Addedtslib@1.14.1(transitive)

• Updatedlit-element@^2.0.1

• Updatedlit-html@^1.0.0