xv-webcomponents 0.1.3 → 0.1.4

package/dist/xv-webcomponents/xv-button-v2.entry.js

@@ -1,10 +1,11 @@
-import { r as registerInstance, h, g as getElement } from './index-5f0a9e2d.js';
+import { r as registerInstance, a as createEvent, h, g as getElement } from './index-13275c1e.js';
 
 const XvButton = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
+        this.buttonClick = createEvent(this, "buttonClick", 7);
         /** Button label */
-        this.label = 'Click me';
+        this.label = '';
         /** Variant */
         this.variant = 'primary';
         /** Size */
@@ -13,6 +14,13 @@ const XvButton = class {
         this.disabled = false;
         /** Automatically detected brand */
         this.detectedBrand = 'default-brand';
+        /** Handle click only if not disabled */
+        this.handleClick = () => {
+            if (this.disabled) {
+                return;
+            }
+            this.buttonClick.emit();
+        };
     }
     applyGlobalStyles() {
         var _a;
@@ -27,7 +35,7 @@ const XvButton = class {
         this.applyGlobalStyles();
     }
     render() {
-        return (h("button", { key: '1e146a747f3adf613331a392d2a30f0789e0fee1', class: `xv-button ${this.variant} ${this.size}`, disabled: this.disabled }, this.label));
+        return (h("button", { key: '9b22f48938f306ca1b8b5b4862fe44202ba8bdfb', class: `xv-button ${this.variant} ${this.size}`, disabled: this.disabled, onClick: this.handleClick }, this.label));
     }
     get el() { return getElement(this); }
 };

package/dist/xv-webcomponents/xv-button-v2.entry.js.map

@@ -1 +1 @@
-{"file":"xv-button-v2.entry.esm.js","mappings":";;MAMa,QAAQ;IAJrB;;;QAQU,UAAK,GAAW,UAAU,CAAC;;QAG3B,YAAO,GAA8D,SAAS,CAAC;;QAG/E,SAAI,GAAiC,QAAQ,CAAC;;QAG9C,aAAQ,GAAY,KAAK,CAAC;;QAGzB,kBAAa,GAAW,eAAe,CAAC;KAsBlD;IApBS,iBAAiB;;QACvB,MAAM,WAAW,GAAG,QAAQ,CAAC,cAAc,CAAC,aAAa,CAAoB,CAAC;QAC9E,IAAI,WAAW,EAAE;YACf,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;YACnD,UAAU,CAAC,SAAS,GAAG,gBAAgB,WAAW,CAAC,IAAI,KAAK,CAAC;YAC7D,MAAA,IAAI,CAAC,EAAE,CAAC,UAAU,0CAAE,WAAW,CAAC,UAAU,CAAC,CAAC;SAC7C;KACF;IAED,iBAAiB;QACf,IAAI,CAAC,iBAAiB,EAAE,CAAC;KAC1B;IAED,MAAM;QACJ,QACE,+DAAQ,KAAK,EAAE,aAAa,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,IAAI,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAC7E,IAAI,CAAC,KAAK,CACJ,EACT;KACH;;;;;;","names":[],"sources":["src/components/xv-button/xv-button.tsx"],"sourcesContent":["import { Component, Prop, State, h, Element } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'xv-button-v2',\r\n  shadow: true, // ✅ Enables Shadow DOM\r\n})\r\nexport class XvButton {\r\n  @Element() el!: HTMLElement;\r\n\r\n  /** Button label */\r\n  @Prop() label: string = 'Click me';\r\n\r\n  /** Variant */\r\n  @Prop() variant: 'accent' | 'primary' | 'secondary' | 'tertiary' | 'ghost' = 'primary';\r\n\r\n  /** Size */\r\n  @Prop() size: 'small' | 'medium' | 'large' = 'medium';\r\n\r\n  /** Disabled state */\r\n  @Prop() disabled: boolean = false;\r\n\r\n  /** Automatically detected brand */\r\n  @State() detectedBrand: string = 'default-brand';\r\n\r\n  private applyGlobalStyles() {\r\n    const globalStyle = document.getElementById(\"brand-style\") as HTMLLinkElement;\r\n    if (globalStyle) {\r\n      const styleClone = document.createElement(\"style\");\r\n      styleClone.innerHTML = `@import url('${globalStyle.href}');`;\r\n      this.el.shadowRoot?.appendChild(styleClone);\r\n    }\r\n  }\r\n  \r\n  componentWillLoad() {\r\n    this.applyGlobalStyles();\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <button class={`xv-button ${this.variant} ${this.size}`} disabled={this.disabled}>\r\n        {this.label}\r\n      </button>\r\n    );\r\n  }\r\n}\r\n"],"version":3}
+{"file":"xv-button-v2.entry.esm.js","mappings":";;MAOa,QAAQ;IAJrB;;;;QAQU,UAAK,GAAW,EAAE,CAAC;;QAGnB,YAAO,GAA8D,SAAS,CAAC;;QAG/E,SAAI,GAAiC,QAAQ,CAAC;;QAG9C,aAAQ,GAAY,KAAK,CAAC;;QAGzB,kBAAa,GAAW,eAAe,CAAC;;QAgBzC,gBAAW,GAAG;YACpB,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACjB,OAAO;aACR;YACD,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;SACzB,CAAC;KAiBH;IAhCS,iBAAiB;;QACrB,MAAM,WAAW,GAAG,QAAQ,CAAC,cAAc,CAAC,aAAa,CAAoB,CAAC;QAC9E,IAAI,WAAW,EAAE;YACf,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;YACnD,UAAU,CAAC,SAAS,GAAG,gBAAgB,WAAW,CAAC,IAAI,KAAK,CAAC;YAC7D,MAAA,IAAI,CAAC,EAAE,CAAC,UAAU,0CAAE,WAAW,CAAC,UAAU,CAAC,CAAC;SAC/C;KACF;IAUD,iBAAiB;QACf,IAAI,CAAC,iBAAiB,EAAE,CAAC;KAC1B;IAED,MAAM;QACJ,QACE,+DACE,KAAK,EAAE,aAAa,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,IAAI,EAAE,EAC/C,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,WAAW,IAExB,IAAI,CAAC,KAAK,CACJ,EACT;KACH;;;;;;","names":[],"sources":["src/components/xv-button/xv-button.tsx"],"sourcesContent":["import { Component, Prop, State, Event, EventEmitter, h, Element } from '@stencil/core';\r\n\r\n\r\n@Component({\r\n  tag: 'xv-button-v2',\r\n  shadow: true,\r\n})\r\nexport class XvButton {\r\n  @Element() el!: HTMLElement;\r\n\r\n  /** Button label */\r\n  @Prop() label: string = '';\r\n\r\n  /** Variant */\r\n  @Prop() variant: 'accent' | 'primary' | 'secondary' | 'tertiary' | 'ghost' = 'primary';\r\n\r\n  /** Size */\r\n  @Prop() size: 'small' | 'medium' | 'large' = 'medium';\r\n\r\n  /** Disabled state */\r\n  @Prop() disabled: boolean = false;\r\n\r\n  /** Automatically detected brand */\r\n  @State() detectedBrand: string = 'default-brand';\r\n\r\n  /** Emits when the button is clicked */\r\n  @Event() buttonClick!: EventEmitter<void>;\r\n\r\n\r\n  private applyGlobalStyles() {\r\n      const globalStyle = document.getElementById(\"brand-style\") as HTMLLinkElement;\r\n      if (globalStyle) {\r\n        const styleClone = document.createElement(\"style\");\r\n        styleClone.innerHTML = `@import url('${globalStyle.href}');`;\r\n        this.el.shadowRoot?.appendChild(styleClone);\r\n    }\r\n  }\r\n\r\n  /** Handle click only if not disabled */\r\n  private handleClick = () => {\r\n    if (this.disabled) {\r\n      return;\r\n    }\r\n    this.buttonClick.emit();\r\n  };\r\n\r\n  componentWillLoad() {\r\n    this.applyGlobalStyles();\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <button\r\n        class={`xv-button ${this.variant} ${this.size}`}\r\n        disabled={this.disabled}\r\n        onClick={this.handleClick}\r\n      >\r\n        {this.label}\r\n      </button>\r\n    );\r\n  }\r\n}\r\n"],"version":3}

package/dist/xv-webcomponents/xv-checkbox-v2.entry.js

@@ -1,4 +1,28 @@
-export { X as xv_checkbox_v2 } from './xv-checkbox-08da5153.js';
-import './index-5f0a9e2d.js';
+import { r as registerInstance, h, g as getElement } from './index-13275c1e.js';
+
+const XvCheckbox = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.detectedBrand = 'default-brand';
+    }
+    applyGlobalStyles() {
+        var _a;
+        const globalStyle = document.getElementById("brand-style");
+        if (globalStyle) {
+            const styleClone = document.createElement("style");
+            styleClone.innerHTML = `@import url('${globalStyle.href}');`;
+            (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(styleClone);
+        }
+    }
+    componentWillLoad() {
+        this.applyGlobalStyles();
+    }
+    render() {
+        return (h("label", { key: 'b544b537b4e76e19f9e1901b7f2a00f025f1fa0b', class: "checkbox-container" }, h("input", { key: '7cda215dd2eec83d5045ccb906273b6d557b64e0', type: "checkbox" }), h("span", { key: 'd0a6a818186ba1f14234a6c25c5c0d06ea6b3f7d', class: "checkmark" }), h("slot", { key: '16b46b8b55f2307302dd377305b9b02022964e58' })));
+    }
+    get el() { return getElement(this); }
+};
+
+export { XvCheckbox as xv_checkbox_v2 };
 
 //# sourceMappingURL=xv-checkbox-v2.entry.js.map

package/dist/xv-webcomponents/xv-checkbox-v2.entry.js.map

@@ -1 +1 @@
-{"file":"xv-checkbox-v2.entry.esm.js","mappings":";","names":[],"sources":[],"sourcesContent":[],"version":3}
+{"file":"xv-checkbox-v2.entry.esm.js","mappings":";;MAMa,UAAU;IAJvB;;QAMW,kBAAa,GAAW,eAAe,CAAC;KAwBlD;IAtBS,iBAAiB;;QACvB,MAAM,WAAW,GAAG,QAAQ,CAAC,cAAc,CAAC,aAAa,CAAoB,CAAC;QAC9E,IAAI,WAAW,EAAE;YACf,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;YACnD,UAAU,CAAC,SAAS,GAAG,gBAAgB,WAAW,CAAC,IAAI,KAAK,CAAC;YAC7D,MAAA,IAAI,CAAC,EAAE,CAAC,UAAU,0CAAE,WAAW,CAAC,UAAU,CAAC,CAAC;SAC7C;KACF;IAED,iBAAiB;QACf,IAAI,CAAC,iBAAiB,EAAE,CAAC;KAC1B;IAED,MAAM;QACJ,QACE,8DAAO,KAAK,EAAC,oBAAoB,IAC/B,8DAAO,IAAI,EAAC,UAAU,GAAG,EACzB,6DAAM,KAAK,EAAC,WAAW,GAAQ,EAC/B,8DAAa,CACP,EACR;KACH;;;;;;","names":[],"sources":["src/components/xv-checkbox/xv-checkbox.tsx"],"sourcesContent":["import { Component, h, Element, State } from '@stencil/core';\n\n@Component({\n  tag: 'xv-checkbox-v2',\n  shadow: true, // ✅ Shadow DOM aktiviert\n})\nexport class XvCheckbox {\n  @Element() el!: HTMLElement;\n  @State() detectedBrand: string = 'default-brand';\n\n  private applyGlobalStyles() {\n    const globalStyle = document.getElementById(\"brand-style\") as HTMLLinkElement;\n    if (globalStyle) {\n      const styleClone = document.createElement(\"style\");\n      styleClone.innerHTML = `@import url('${globalStyle.href}');`;\n      this.el.shadowRoot?.appendChild(styleClone);\n    }\n  }\n\n  componentWillLoad() {\n    this.applyGlobalStyles();\n  }\n\n  render() {\n    return (\n      <label class=\"checkbox-container\">\n        <input type=\"checkbox\" />\n        <span class=\"checkmark\"></span>\n        <slot></slot>\n      </label>\n    );\n  }\n}\n"],"version":3}

package/dist/xv-webcomponents/xv-webcomponents.esm.js

@@ -1,5 +1,5 @@
-import { B as BUILD, c as consoleDevInfo, H, d as doc, N as NAMESPACE, p as promiseResolve, b as bootstrapLazy } from './index-5f0a9e2d.js';
-export { s as setNonce } from './index-5f0a9e2d.js';
+import { B as BUILD, c as consoleDevInfo, H, d as doc, N as NAMESPACE, p as promiseResolve, b as bootstrapLazy } from './index-13275c1e.js';
+export { s as setNonce } from './index-13275c1e.js';
 import { g as globalScripts } from './app-globals-0f993ce5.js';
 
 /*
@@ -43,7 +43,7 @@ var patchCloneNodeFix = (HTMLElementPrototype) => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["xv-button-v2",[[1,"xv-button-v2",{"label":[1],"variant":[1],"size":[1],"disabled":[4],"detectedBrand":[32]}]]],["xv-checkbox",[[1,"xv-checkbox",{"detectedBrand":[32]}]]],["xv-checkbox-v2",[[1,"xv-checkbox-v2",{"detectedBrand":[32]}]]]], options);
+  return bootstrapLazy([["xv-button-v2",[[1,"xv-button-v2",{"label":[1],"variant":[1],"size":[1],"disabled":[4],"detectedBrand":[32]}]]],["xv-checkbox-v2",[[1,"xv-checkbox-v2",{"detectedBrand":[32]}]]]], options);
 });
 
 //# sourceMappingURL=xv-webcomponents.esm.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xv-webcomponents",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "description": "Reusable Web Components for XV Applications",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",

package/dist/components/xv-checkbox.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface XvCheckbox extends Components.XvCheckbox, HTMLElement {}
-export const XvCheckbox: {
-    prototype: XvCheckbox;
-    new (): XvCheckbox;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/xv-webcomponents/xv-checkbox-08da5153.js

@@ -1,28 +0,0 @@
-import { r as registerInstance, h, g as getElement } from './index-5f0a9e2d.js';
-
-const XvCheckbox = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.detectedBrand = 'default-brand';
-    }
-    applyGlobalStyles() {
-        var _a;
-        const globalStyle = document.getElementById("brand-style");
-        if (globalStyle) {
-            const styleClone = document.createElement("style");
-            styleClone.innerHTML = `@import url('${globalStyle.href}');`;
-            (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(styleClone);
-        }
-    }
-    componentWillLoad() {
-        this.applyGlobalStyles();
-    }
-    render() {
-        return (h("label", { key: '72bd9b9d8ad781ba74a48a34184c5c9d49075930', class: "checkbox-container" }, h("input", { key: 'a645daae3cd3954cd6c170bc1f2d64f7b329fe42', type: "checkbox" }), h("span", { key: '6602efce427536b37edac417bab976c36cf196b1', class: "checkmark" }), h("slot", { key: 'a044876008987287768ec232dc769d6375f8270c' })));
-    }
-    get el() { return getElement(this); }
-};
-
-export { XvCheckbox as X };
-
-//# sourceMappingURL=xv-checkbox-08da5153.js.map

package/dist/xv-webcomponents/xv-checkbox-08da5153.js.map

@@ -1 +0,0 @@
-{"file":"xv-checkbox-08da5153.js","mappings":";;MAMa,UAAU;IAJvB;;QAMW,kBAAa,GAAW,eAAe,CAAC;KAwBlD;IAtBS,iBAAiB;;QACvB,MAAM,WAAW,GAAG,QAAQ,CAAC,cAAc,CAAC,aAAa,CAAoB,CAAC;QAC9E,IAAI,WAAW,EAAE;YACf,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;YACnD,UAAU,CAAC,SAAS,GAAG,gBAAgB,WAAW,CAAC,IAAI,KAAK,CAAC;YAC7D,MAAA,IAAI,CAAC,EAAE,CAAC,UAAU,0CAAE,WAAW,CAAC,UAAU,CAAC,CAAC;SAC7C;KACF;IAED,iBAAiB;QACf,IAAI,CAAC,iBAAiB,EAAE,CAAC;KAC1B;IAED,MAAM;QACJ,QACE,8DAAO,KAAK,EAAC,oBAAoB,IAC/B,8DAAO,IAAI,EAAC,UAAU,GAAG,EACzB,6DAAM,KAAK,EAAC,WAAW,GAAQ,EAC/B,8DAAa,CACP,EACR;KACH;;;;;;","names":[],"sources":["src/components/xv-checkbox/xv-checkbox.tsx"],"sourcesContent":["import { Component, h, Element, State } from '@stencil/core';\n\n@Component({\n  tag: 'xv-checkbox-v2',\n  shadow: true, // ✅ Shadow DOM aktiviert\n})\nexport class XvCheckbox {\n  @Element() el!: HTMLElement;\n  @State() detectedBrand: string = 'default-brand';\n\n  private applyGlobalStyles() {\n    const globalStyle = document.getElementById(\"brand-style\") as HTMLLinkElement;\n    if (globalStyle) {\n      const styleClone = document.createElement(\"style\");\n      styleClone.innerHTML = `@import url('${globalStyle.href}');`;\n      this.el.shadowRoot?.appendChild(styleClone);\n    }\n  }\n\n  componentWillLoad() {\n    this.applyGlobalStyles();\n  }\n\n  render() {\n    return (\n      <label class=\"checkbox-container\">\n        <input type=\"checkbox\" />\n        <span class=\"checkmark\"></span>\n        <slot></slot>\n      </label>\n    );\n  }\n}\n"],"version":3}

package/dist/xv-webcomponents/xv-checkbox.entry.js

@@ -1,4 +0,0 @@
-export { X as xv_checkbox } from './xv-checkbox-08da5153.js';
-import './index-5f0a9e2d.js';
-
-//# sourceMappingURL=xv-checkbox.entry.js.map

package/dist/xv-webcomponents/xv-checkbox.entry.js.map

@@ -1 +0,0 @@
-{"file":"xv-checkbox.entry.esm.js","mappings":";","names":[],"sources":[],"sourcesContent":[],"version":3}