kemet-ui 4.0.0 → 4.0.2

package/dist/elements/icon-lucide.js

@@ -0,0 +1,113 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+
+// src/elements/icon-lucide.ts
+var icon_lucide_exports = {};
+__export(icon_lucide_exports, {
+  default: () => KemetIconLucide
+});
+module.exports = __toCommonJS(icon_lucide_exports);
+var import_lit2 = require("lit");
+var import_decorators = require("lit/decorators.js");
+var import_query = require("lit/decorators/query.js");
+var import_repeat = require("lit/directives/repeat.js");
+
+// src/styles/elements/icon-lucide.ts
+var import_lit = require("lit");
+var stylesBase = import_lit.css`
+  :host {
+    display: inline-flex;
+  }
+`;
+
+// src/elements/icon-lucide.ts
+var KemetIconLucide = class extends import_lit2.LitElement {
+  constructor() {
+    super(...arguments);
+    this.icon = "code";
+    this.version = "latest";
+    this.size = 24;
+  }
+  render() {
+    return (0, import_repeat.repeat)([this.icon], (i) => i, (i) => import_lit2.html`<i data-lucide=${i}></i>`);
+  }
+  async firstUpdated() {
+    await this._initLucide();
+    window.lucide?.createIcons({ root: this.renderRoot });
+  }
+  willUpdate(changed) {
+    if (changed.has("icon") && this.svg) {
+      this.svg.remove();
+    }
+  }
+  updated(changed) {
+    if (changed.has("icon")) {
+      window.lucide?.createIcons({ root: this.renderRoot });
+    }
+    setTimeout(() => {
+      const svg = this.shadowRoot.querySelector("svg");
+      if (svg) {
+        svg.style.width = `${this.size.toString()}px`;
+        svg.style.height = `${this.size.toString()}px`;
+      }
+    }, 500);
+  }
+  _initLucide() {
+    if (window.lucide) return Promise.resolve();
+    const existing = Array.from(document.scripts).find((s) => s.src.includes("unpkg.com/lucide@"));
+    if (existing) {
+      return new Promise((resolve) => {
+        if (window.lucide) return resolve();
+        existing.addEventListener("load", () => resolve(), { once: true });
+      });
+    }
+    return new Promise((resolve, reject) => {
+      const s = document.createElement("script");
+      s.src = `https://unpkg.com/lucide@${this.version}`;
+      s.async = true;
+      s.onload = () => resolve();
+      s.onerror = () => reject(new Error("Failed to load Lucide"));
+      document.head.appendChild(s);
+    });
+  }
+};
+KemetIconLucide.styles = [stylesBase];
+__decorateClass([
+  (0, import_decorators.property)()
+], KemetIconLucide.prototype, "icon", 2);
+__decorateClass([
+  (0, import_decorators.property)()
+], KemetIconLucide.prototype, "version", 2);
+__decorateClass([
+  (0, import_decorators.property)()
+], KemetIconLucide.prototype, "size", 2);
+__decorateClass([
+  (0, import_query.query)("svg[data-lucide]")
+], KemetIconLucide.prototype, "svg", 2);
+KemetIconLucide = __decorateClass([
+  (0, import_decorators.customElement)("kemet-icon-lucide")
+], KemetIconLucide);
+//# sourceMappingURL=icon-lucide.js.map

package/dist/elements/icon-lucide.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/elements/icon-lucide.ts","../../src/styles/elements/icon-lucide.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { query } from 'lit/decorators/query.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { stylesBase } from '../styles/elements/icon-lucide';\n\n/**\n * @since 4.0.0\n * @status stable\n *\n * @tagname kemet-icon-lucide\n * @summary A versatile button that can be used either to submit a form, trigger an action, or link to content.\n *\n * @prop {string} icon - The name of the icon to display\n * @prop {string} version - The version of Lucide to use\n * @prop {number} size - The size of the icon\n *\n */\n\n@customElement('kemet-icon-lucide')\nexport default class KemetIconLucide extends LitElement {\n  static styles = [stylesBase];\n\n  @property() icon: string = 'code';\n  @property() version: string = 'latest';\n  @property() size: number = 24;\n  @query('svg[data-lucide]') svg!: SVGElement | null;\n\n  render() {\n    // Use repeat() with icon as the key to force node replacement when it changes.\n    return repeat([this.icon], i => i, i => html`<i data-lucide=${i}></i>`);\n  }\n\n  async firstUpdated() {\n    await this._initLucide();\n    window.lucide?.createIcons({ root: this.renderRoot });\n  }\n\n  willUpdate(changed: Map<string, unknown>) {\n    // Runs BEFORE render. Remove any prior Lucide SVG so Lit won’t try to diff into it.\n    if (changed.has('icon') && this.svg) {\n      this.svg.remove();\n    }\n  }\n\n  updated(changed: Map<string, unknown>) {\n    if (changed.has('icon')) {\n      window.lucide?.createIcons({ root: this.renderRoot })\n    }\n\n    // setTimeout is the only way to get the svg after lucide has created it\n    setTimeout(() => {\n      const svg = this.shadowRoot.querySelector('svg');\n      if (svg) {\n        svg.style.width = `${this.size.toString()}px`;\n        svg.style.height = `${this.size.toString()}px`;\n      }\n    }, 500);\n  }\n\n  private _initLucide(): Promise<void> {\n    if (window.lucide) return Promise.resolve();\n    const existing = Array.from(document.scripts).find(s => s.src.includes('unpkg.com/lucide@')) as HTMLScriptElement | undefined;\n    if (existing) {\n      return new Promise<void>(resolve => {\n        if (window.lucide) return resolve();\n        existing.addEventListener('load', () => resolve(), { once: true });\n      });\n    }\n    return new Promise<void>((resolve, reject) => {\n      const s = document.createElement('script');\n      s.src = `https://unpkg.com/lucide@${this.version}`;\n      s.async = true;\n      s.onload = () => resolve();\n      s.onerror = () => reject(new Error('Failed to load Lucide'));\n      document.head.appendChild(s);\n    });\n  }\n}\n","import { css } from \"lit\";\n\nexport const stylesBase = css`\n  :host {\n    display: inline-flex;\n  }\n`;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAAA,cAAiC;AACjC,wBAAwC;AACxC,mBAAsB;AACtB,oBAAuB;;;ACHvB,iBAAoB;AAEb,IAAM,aAAa;AAAA;AAAA;AAAA;AAAA;;;ADkB1B,IAAqB,kBAArB,cAA6C,uBAAW;AAAA,EAAxD;AAAA;AAGc,gBAAe;AACf,mBAAkB;AAClB,gBAAe;AAAA;AAAA,EAG3B,SAAS;AAEP,eAAO,sBAAO,CAAC,KAAK,IAAI,GAAG,OAAK,GAAG,OAAK,kCAAsB,CAAC,OAAO;AAAA,EACxE;AAAA,EAEA,MAAM,eAAe;AACnB,UAAM,KAAK,YAAY;AACvB,WAAO,QAAQ,YAAY,EAAE,MAAM,KAAK,WAAW,CAAC;AAAA,EACtD;AAAA,EAEA,WAAW,SAA+B;AAExC,QAAI,QAAQ,IAAI,MAAM,KAAK,KAAK,KAAK;AACnC,WAAK,IAAI,OAAO;AAAA,IAClB;AAAA,EACF;AAAA,EAEA,QAAQ,SAA+B;AACrC,QAAI,QAAQ,IAAI,MAAM,GAAG;AACvB,aAAO,QAAQ,YAAY,EAAE,MAAM,KAAK,WAAW,CAAC;AAAA,IACtD;AAGA,eAAW,MAAM;AACf,YAAM,MAAM,KAAK,WAAW,cAAc,KAAK;AAC/C,UAAI,KAAK;AACP,YAAI,MAAM,QAAQ,GAAG,KAAK,KAAK,SAAS,CAAC;AACzC,YAAI,MAAM,SAAS,GAAG,KAAK,KAAK,SAAS,CAAC;AAAA,MAC5C;AAAA,IACF,GAAG,GAAG;AAAA,EACR;AAAA,EAEQ,cAA6B;AACnC,QAAI,OAAO,OAAQ,QAAO,QAAQ,QAAQ;AAC1C,UAAM,WAAW,MAAM,KAAK,SAAS,OAAO,EAAE,KAAK,OAAK,EAAE,IAAI,SAAS,mBAAmB,CAAC;AAC3F,QAAI,UAAU;AACZ,aAAO,IAAI,QAAc,aAAW;AAClC,YAAI,OAAO,OAAQ,QAAO,QAAQ;AAClC,iBAAS,iBAAiB,QAAQ,MAAM,QAAQ,GAAG,EAAE,MAAM,KAAK,CAAC;AAAA,MACnE,CAAC;AAAA,IACH;AACA,WAAO,IAAI,QAAc,CAAC,SAAS,WAAW;AAC5C,YAAM,IAAI,SAAS,cAAc,QAAQ;AACzC,QAAE,MAAM,4BAA4B,KAAK,OAAO;AAChD,QAAE,QAAQ;AACV,QAAE,SAAS,MAAM,QAAQ;AACzB,QAAE,UAAU,MAAM,OAAO,IAAI,MAAM,uBAAuB,CAAC;AAC3D,eAAS,KAAK,YAAY,CAAC;AAAA,IAC7B,CAAC;AAAA,EACH;AACF;AA1DqB,gBACZ,SAAS,CAAC,UAAU;AAEf;AAAA,MAAX,4BAAS;AAAA,GAHS,gBAGP;AACA;AAAA,MAAX,4BAAS;AAAA,GAJS,gBAIP;AACA;AAAA,MAAX,4BAAS;AAAA,GALS,gBAKP;AACe;AAAA,MAA1B,oBAAM,kBAAkB;AAAA,GANN,gBAMQ;AANR,kBAArB;AAAA,MADC,iCAAc,mBAAmB;AAAA,GACb;","names":["import_lit"]}

package/dist/elements/icon-lucide.mjs

@@ -0,0 +1,8 @@
+import {
+  KemetIconLucide
+} from "../chunk-BJ5CZRKZ.mjs";
+import "../chunk-SAWN7RJP.mjs";
+export {
+  KemetIconLucide as default
+};
+//# sourceMappingURL=icon-lucide.mjs.map

package/dist/elements/icon-lucide.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/elements/input.d.mts

@@ -0,0 +1,4 @@
+import 'lit-html';
+import 'lit';
+import '../form-controller-BR0gZhrG.mjs';
+export { l as EnumAriaAutoComplete, o as EnumAutoComplete, r as EnumInputModes, E as EnumInputTypes, m as TypeAriaAutoComplete, p as TypeAutoComplete, s as TypeInputModes, j as TypeInputTypes, k as ariaAutoComplete, n as autoComplete, d as default, q as inputModes, i as inputTypes } from '../constants-BEtO8uLN.mjs';

package/dist/elements/input.d.ts

@@ -0,0 +1,4 @@
+import 'lit-html';
+import 'lit';
+import '../form-controller-BR0gZhrG.js';
+export { l as EnumAriaAutoComplete, o as EnumAutoComplete, r as EnumInputModes, E as EnumInputTypes, m as TypeAriaAutoComplete, p as TypeAutoComplete, s as TypeInputModes, j as TypeInputTypes, k as ariaAutoComplete, n as autoComplete, d as default, q as inputModes, i as inputTypes } from '../constants-CcB9aXsT.js';