@santi020k/lumen-elements 1.6.0 → 1.7.0

package/dist/element-base.d.ts

@@ -0,0 +1,26 @@
+export type LumenCustomElementRegistry = Pick<CustomElementRegistry, 'define' | 'get'>;
+export interface LumenElementConfig {
+    attributeClassAliases?: Record<string, string>;
+    attributeClasses?: Record<string, Record<string, string>>;
+    baseClassName: string;
+    defaults?: Record<string, string>;
+    observedAttributes?: readonly string[];
+    role?: string;
+    tagName: string;
+}
+export type LumenElementConstructor = CustomElementConstructor & {
+    config: LumenElementConfig;
+};
+export declare class LumenElement extends HTMLElement {
+    static config: LumenElementConfig;
+    static get observedAttributes(): readonly string[];
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(_name?: string, _previousValue?: string | null, _value?: string | null): void;
+    protected get config(): LumenElementConfig;
+    private applyDefaults;
+    private applyClassNames;
+}
+export declare const createLumenElementClass: (config: LumenElementConfig) => LumenElementConstructor;
+export declare const defineLumenElement: (config: LumenElementConfig, element: CustomElementConstructor, registry?: LumenCustomElementRegistry) => void;
+//# sourceMappingURL=element-base.d.ts.map

package/dist/element-base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"element-base.d.ts","sourceRoot":"","sources":["../src/element-base.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,0BAA0B,GAAG,IAAI,CAC3C,qBAAqB,EACrB,QAAQ,GAAG,KAAK,CACjB,CAAA;AAED,MAAM,WAAW,kBAAkB;IACjC,qBAAqB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAC9C,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAA;IACzD,aAAa,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACjC,kBAAkB,CAAC,EAAE,SAAS,MAAM,EAAE,CAAA;IACtC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,CAAA;CAChB;AAED,MAAM,MAAM,uBAAuB,GAAG,wBAAwB,GAAG;IAC/D,MAAM,EAAE,kBAAkB,CAAA;CAC3B,CAAA;AA2BD,qBAAa,YAAa,SAAQ,WAAW;IAC3C,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAA;IAEjC,MAAM,KAAK,kBAAkB,sBAI5B;IAED,iBAAiB;IAMjB,oBAAoB;IAIpB,wBAAwB,CACtB,KAAK,CAAC,EAAE,MAAM,EACd,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,EAC9B,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI;IAKxB,SAAS,KAAK,MAAM,uBAEnB;IAED,OAAO,CAAC,aAAa;IAYrB,OAAO,CAAC,eAAe;CA4BxB;AAED,eAAO,MAAM,uBAAuB,GAClC,QAAQ,kBAAkB,KACzB,uBAEF,CAAA;AAED,eAAO,MAAM,kBAAkB,GAC7B,QAAQ,kBAAkB,EAC1B,SAAS,wBAAwB,EACjC,WAAW,0BAA0B,KACpC,IAQF,CAAA"}

package/dist/element-base.js

@@ -0,0 +1,66 @@
+import { composeClassName } from '@santi020k/lumen-core';
+const appliedClassNames = new WeakMap();
+const mergeClassNames = (...classNames) => composeClassName(...classNames)
+    .split(/\s+/)
+    .filter(Boolean);
+const resolveAttributeClassName = (element, config, attributeName, classMap) => {
+    const canonicalAttribute = config.attributeClassAliases?.[attributeName];
+    if (canonicalAttribute && element.hasAttribute(canonicalAttribute))
+        return undefined;
+    const attributeValue = element.hasAttribute(attributeName) ?
+        element.getAttribute(attributeName) || 'true' :
+        config.defaults?.[attributeName];
+    return attributeValue ? classMap[attributeValue] : undefined;
+};
+export class LumenElement extends HTMLElement {
+    static config;
+    static get observedAttributes() {
+        return this.config.observedAttributes ?? Object.keys(this.config.attributeClasses ?? {});
+    }
+    connectedCallback() {
+        this.applyDefaults();
+        this.applyClassNames();
+    }
+    disconnectedCallback() {
+    }
+    attributeChangedCallback(_name, _previousValue, _value) {
+        this.applyClassNames();
+    }
+    get config() {
+        return this.constructor.config;
+    }
+    applyDefaults() {
+        for (const [name, value] of Object.entries(this.config.defaults ?? {})) {
+            if (!this.hasAttribute(name)) {
+                this.setAttribute(name, value);
+            }
+        }
+        if (this.config.role && !this.hasAttribute('role')) {
+            this.setAttribute('role', this.config.role);
+        }
+    }
+    applyClassNames() {
+        const previousClassNames = appliedClassNames.get(this) ?? [];
+        for (const className of previousClassNames) {
+            this.classList.remove(className);
+        }
+        const classNames = mergeClassNames(this.config.baseClassName);
+        for (const [attributeName, classMap] of Object.entries(this.config.attributeClasses ?? {})) {
+            const className = resolveAttributeClassName(this, this.config, attributeName, classMap);
+            if (className) {
+                classNames.push(...mergeClassNames(className));
+            }
+        }
+        this.classList.add(...classNames);
+        appliedClassNames.set(this, classNames);
+    }
+}
+export const createLumenElementClass = (config) => class extends LumenElement {
+    static config = config;
+};
+export const defineLumenElement = (config, element, registry) => {
+    const targetRegistry = registry ?? (typeof customElements === 'undefined' ? undefined : customElements);
+    if (targetRegistry && !targetRegistry.get(config.tagName)) {
+        targetRegistry.define(config.tagName, element);
+    }
+};

package/dist/index.d.ts

@@ -1,2 +1,3 @@
 export * from './define.js';
+export type { LumenTabsChangeDetail, LumenTabsChangeEvent } from '@santi020k/lumen-core';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,YAAY,EACV,qBAAqB,EACrB,oBAAoB,EACrB,MAAM,uBAAuB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@santi020k/lumen-elements",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "publishConfig": {
     "access": "public"
   },
@@ -9,6 +9,7 @@
   "sideEffects": [
     "./layers.css",
     "./styles.css",
+    "./styles/critical.css",
     "./dist/define.js"
   ],
   "main": "./dist/index.js",
@@ -23,20 +24,46 @@
       "types": "./dist/define.d.ts",
       "import": "./dist/define.js"
     },
+    "./components/badge": {
+      "types": "./dist/components/badge.d.ts",
+      "import": "./dist/components/badge.js"
+    },
+    "./components/button": {
+      "types": "./dist/components/button.d.ts",
+      "import": "./dist/components/button.js"
+    },
+    "./components/card": {
+      "types": "./dist/components/card.d.ts",
+      "import": "./dist/components/card.js"
+    },
+    "./components/combobox": {
+      "types": "./dist/components/combobox.d.ts",
+      "import": "./dist/components/combobox.js"
+    },
+    "./components/foundations": {
+      "types": "./dist/components/foundations.d.ts",
+      "import": "./dist/components/foundations.js"
+    },
     "./styles.css": "./styles.css",
+    "./styles/critical.css": "./styles/critical.css",
     "./layers.css": "./layers.css",
     "./package.json": "./package.json"
   },
   "files": [
+    "bin",
     "dist",
     "layers.css",
     "styles.css",
+    "styles",
     "README.md",
     "LICENSE"
   ],
+  "bin": {
+    "lumen": "./bin/lumen.mjs"
+  },
   "dependencies": {
-    "@santi020k/lumen": "^1.6.0",
-    "@santi020k/lumen-core": "^1.4.0"
+    "@santi020k/lumen": "^1.7.0",
+    "@santi020k/lumen-core": "^1.7.0"
   },
   "devDependencies": {
     "@vitest/coverage-v8": "^4.1.11",
@@ -80,6 +107,7 @@
     "test:coverage": "vitest run --config ../../vitest.config.ts --project elements --coverage",
     "lint": "eslint . --no-warn-ignored --max-warnings=0",
     "lint:fix": "eslint . --fix --no-warn-ignored --max-warnings=0",
+    "measure:registration": "pnpm run build && node scripts/measure-registration.mjs",
     "clean": "rm -rf dist coverage"
   }
 }