@github/catalyst - npm Package Compare versions

Comparing version 1.4.2 to 2.0.0-alpha1

lib/controller.d.ts

@@ -1,2 +0,2 @@
-import type { CustomElement } from './custom-element.js';
+import type { CustomElementClass } from './custom-element.js';
 /**
@@ -8,3 +8,3 @@ * Controller is a decorator to be used over a class that extends HTMLElement.
  */
-export declare function controller(classObject: CustomElement): void;
+export declare function controller<T extends CustomElementClass>(Class: T): T & import("./controllable.js").ControllableClass & import("./targetable.js").TargetableClass & import("./attrable.js").AttrableClass;
 //# sourceMappingURL=controller.d.ts.map

lib/controller.js

@@ -1,2 +0,5 @@
-import { CatalystDelegate } from './core.js';
+import { targetable } from './targetable.js';
+import { attrable } from './attrable.js';
+import { actionable } from './actionable.js';
+import { register } from './register.js';
 /**
@@ -8,5 +11,5 @@ * Controller is a decorator to be used over a class that extends HTMLElement.
  */
-export function controller(classObject) {
-    new CatalystDelegate(classObject);
+export function controller(Class) {
+    return register(actionable(attrable(targetable(Class))));
 }
 //# sourceMappingURL=controller.js.map

lib/core.d.ts

@@ -1,4 +0,4 @@
-import type { CustomElement } from './custom-element.js';
+import type { CustomElementClass } from './custom-element.js';
 export declare class CatalystDelegate {
-    constructor(classObject: CustomElement);
+    constructor(classObject: CustomElementClass);
     observedAttributes(instance: HTMLElement, observedAttributes: string[]): string[];
@@ -5,0 +5,0 @@ connectedCallback(instance: HTMLElement, connectedCallback: () => void): void;

lib/core.js

 import { register } from './register.js';
-import { bind, bindShadow } from './bind.js';
-import { autoShadowRoot } from './auto-shadow-root.js';
-import { defineObservedAttributes, initializeAttrs } from './attr.js';
 const symbol = Symbol.for('catalyst');
@@ -32,3 +29,2 @@ export class CatalystDelegate {
         });
-        defineObservedAttributes(classObject);
         register(classObject);
@@ -42,8 +38,3 @@ }
         customElements.upgrade(instance);
-        autoShadowRoot(instance);
-        initializeAttrs(instance);
-        bind(instance);
         connectedCallback?.call(instance);
-        if (instance.shadowRoot)
-            bindShadow(instance.shadowRoot);
     }
@@ -54,3 +45,2 @@ disconnectedCallback(element, disconnectedCallback) {
     attributeChangedCallback(instance, name, oldValue, newValue, attributeChangedCallback) {
-        initializeAttrs(instance);
         if (name !== 'data-catalyst' && attributeChangedCallback) {
@@ -57,0 +47,0 @@ attributeChangedCallback.call(instance, name, oldValue, newValue);

lib/custom-element.d.ts

@@ -1,5 +0,17 @@
-export interface CustomElement {
-    new (): HTMLElement;
+export interface CustomElement extends HTMLElement {
+    connectedCallback?(): void;
+    attributeChangedCallback?(name: string, oldValue: string | null, newValue: string | null): void;
+    disconnectedCallback?(): void;
+    adoptedCallback?(): void;
+    formAssociatedCallback?(form: HTMLFormElement): void;
+    formDisabledCallback?(disabled: boolean): void;
+    formResetCallback?(): void;
+    formStateRestoreCallback?(state: unknown, reason: 'autocomplete' | 'restore'): void;
+}
+export interface CustomElementClass {
+    new (...args: any[]): CustomElement;
     observedAttributes?: string[];
+    disabledFeatures?: string[];
+    formAssociated?: boolean;
 }
 //# sourceMappingURL=custom-element.d.ts.map

lib/dasherize.d.ts

 export declare const dasherize: (str: unknown) => string;
+export declare const mustDasherize: (str: unknown, type?: string) => string;
 //# sourceMappingURL=dasherize.d.ts.map

lib/dasherize.js

@@ -1,2 +0,2 @@
-export const dasherize = (str) => String(str)
+export const dasherize = (str) => String(typeof str === 'symbol' ? str.description : str)
     .replace(/([A-Z]($|[a-z]))/g, '-$1')
@@ -6,2 +6,9 @@ .replace(/--/g, '-')
     .toLowerCase();
+export const mustDasherize = (str, type = 'property') => {
+    const dashed = dasherize(str);
+    if (!dashed.includes('-')) {
+        throw new DOMException(`${type}: ${String(str)} is not a valid ${type} name`, 'SyntaxError');
+    }
+    return dashed;
+};
 //# sourceMappingURL=dasherize.js.map

lib/index.d.ts

@@ -1,8 +0,10 @@
-export { bind, listenForBind } from './bind.js';
+export { controller } from './controller.js';
 export { register } from './register.js';
-export { findTarget, findTargets } from './findtarget.js';
-export { target, targets } from './target.js';
-export { controller } from './controller.js';
-export { attr, initializeAttrs, defineObservedAttributes } from './attr.js';
-export { autoShadowRoot } from './auto-shadow-root.js';
+export { registerTag, observeElementForTags, parseElementTags } from './tag-observer.js';
+export { createMark } from './mark.js';
+export { dasherize, mustDasherize } from './dasherize.js';
+export { actionable } from './actionable.js';
+export { target, getTarget, targets, getTargets, targetChangedCallback, targetsChangedCallback, targetable } from './targetable.js';
+export { attr, getAttr, attrable, attrChangedCallback } from './attrable.js';
+export type { CustomElement, CustomElementClass } from './custom-element.js';
 //# sourceMappingURL=index.d.ts.map

lib/index.js

@@ -1,8 +0,9 @@
-export { bind, listenForBind } from './bind.js';
+export { controller } from './controller.js';
 export { register } from './register.js';
-export { findTarget, findTargets } from './findtarget.js';
-export { target, targets } from './target.js';
-export { controller } from './controller.js';
-export { attr, initializeAttrs, defineObservedAttributes } from './attr.js';
-export { autoShadowRoot } from './auto-shadow-root.js';
+export { registerTag, observeElementForTags, parseElementTags } from './tag-observer.js';
+export { createMark } from './mark.js';
+export { dasherize, mustDasherize } from './dasherize.js';
+export { actionable } from './actionable.js';
+export { target, getTarget, targets, getTargets, targetChangedCallback, targetsChangedCallback, targetable } from './targetable.js';
+export { attr, getAttr, attrable, attrChangedCallback } from './attrable.js';
 //# sourceMappingURL=index.js.map

lib/register.d.ts

@@ -1,2 +0,2 @@
-import type { CustomElement } from './custom-element.js';
+import type { CustomElementClass } from './custom-element.js';
 /**
@@ -9,3 +9,3 @@ * Register the controller as a custom element.
  */
-export declare function register(classObject: CustomElement): void;
+export declare function register<T extends CustomElementClass>(classObject: T): T;
 //# sourceMappingURL=register.d.ts.map

lib/register.js

@@ -10,3 +10,3 @@ import { dasherize } from './dasherize.js';
 export function register(classObject) {
-    const name = dasherize(classObject.name).replace(/-element$/, '');
+    const name = dasherize(classObject.name).replace(/-(element|controller|component)$/, '');
     try {
@@ -21,7 +21,7 @@ window.customElements.define(name, classObject);
         // is if the element has already been defined.
-        if (e instanceof DOMException && e.name === 'NotSupportedError')
-            return;
-        throw e;
+        if (!(e instanceof DOMException && e.name === 'NotSupportedError'))
+            throw e;
     }
+    return classObject;
 }
 //# sourceMappingURL=register.js.map

package.json

 {
   "name": "@github/catalyst",
-  "version": "1.4.2",
+  "version": "2.0.0-alpha1",
   "description": "Helpers for creating HTML Elements as Controllers",
@@ -26,6 +26,7 @@ "homepage": "https://github.github.io/catalyst",
   "scripts": {
-    "build": "tsc --build",
+    "build": "tsc --build tsconfig.build.json",
     "build:docs": "cd docs && JEKYLL_ENV=production bundle exec jekyll build",
-    "clean": "tsc --build --clean",
+    "clean": "tsc --build --clean tsconfig.build.json",
     "lint": "eslint . --ignore-path .gitignore",
+    "postlint": "tsc",
     "prepack": "npm run build",
@@ -39,14 +40,14 @@ "presize": "npm run build",
     "@github/prettier-config": "^0.0.4",
-    "@lhci/cli": "^0.7.0",
-    "@open-wc/testing": "^3.1.2",
+    "@lhci/cli": "^0.9.0",
+    "@open-wc/testing": "^3.1.4",
     "@size-limit/preset-small-lib": "^7.0.8",
-    "@typescript-eslint/eslint-plugin": "^5.16.0",
-    "@typescript-eslint/parser": "^5.16.0",
+    "@typescript-eslint/eslint-plugin": "^5.22.0",
+    "@typescript-eslint/parser": "^5.22.0",
     "@web/dev-server-esbuild": "^0.3.0",
     "@web/test-runner": "^0.13.27",
-    "eslint": "^8.12.0",
+    "eslint": "^8.14.0",
     "eslint-plugin-github": "^4.3.6",
     "sinon": "^13.0.1",
     "size-limit": "^7.0.8",
-    "tslib": "^2.3.1",
+    "tslib": "^2.4.0",
     "typescript": "^4.6.3"
@@ -58,5 +59,10 @@ },
       "import": "{controller, attr, target, targets}",
-      "limit": "1.64kb"
+      "limit": "2.5kb"
+    },
+    {
+      "path": "lib/abilities.js",
+      "import": "{providable}",
+      "limit": "1.1kb"
     }
   ]
 }

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

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed 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

Improved metrics

Total package byte prevSize

71233

increased by80.97%

Number of package files

67

increased by42.55%

Lines of code

791

increased by60.45%

Worsened metrics

Number of low quality alerts

1

increased byInfinity%

No dependency changes