@stencil-kit/core 0.0.1 → 0.0.2

package/dist/collection/components/my-modal/my-modal.css

@@ -0,0 +1,88 @@
+:host {
+  display: contents;
+}
+
+.modal-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+  padding: 16px;
+  box-sizing: border-box;
+}
+
+.modal {
+  background: #fff;
+  border-radius: 12px;
+  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+  display: flex;
+  flex-direction: column;
+  max-height: 90vh;
+  width: 100%;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  animation: modal-in 0.2s ease;
+}
+
+@keyframes modal-in {
+  from { opacity: 0; transform: scale(0.95) translateY(-10px); }
+  to   { opacity: 1; transform: scale(1) translateY(0); }
+}
+
+.modal--small  { max-width: 400px; }
+.modal--medium { max-width: 560px; }
+.modal--large  { max-width: 800px; }
+
+.modal-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 20px 24px;
+  border-bottom: 1px solid #e5e7eb;
+}
+
+.modal-title {
+  font-size: 18px;
+  font-weight: 700;
+  color: #111827;
+}
+
+.modal-close {
+  background: none;
+  border: none;
+  font-size: 18px;
+  color: #6b7280;
+  cursor: pointer;
+  padding: 4px 8px;
+  border-radius: 6px;
+  line-height: 1;
+  transition: background 0.15s;
+}
+
+.modal-close:hover {
+  background: #f3f4f6;
+  color: #111827;
+}
+
+.modal-body {
+  padding: 24px;
+  overflow-y: auto;
+  flex: 1;
+  color: #374151;
+  font-size: 15px;
+  line-height: 1.6;
+}
+
+.modal-footer {
+  padding: 16px 24px;
+  border-top: 1px solid #e5e7eb;
+  display: flex;
+  justify-content: flex-end;
+  gap: 12px;
+}
+
+.modal-footer:empty {
+  display: none;
+}

package/dist/collection/components/my-modal/my-modal.js

@@ -0,0 +1,119 @@
+import { h } from "@stencil/core";
+export class MyModal {
+    open = false;
+    modalTitle = '';
+    size = 'medium';
+    myClose;
+    handleOpenChange(open) {
+        document.body.style.overflow = open ? 'hidden' : '';
+    }
+    close() {
+        this.open = false;
+        this.myClose.emit();
+    }
+    render() {
+        if (!this.open)
+            return null;
+        return (h("div", { class: "modal-overlay", onClick: () => this.close() }, h("div", { class: `modal modal--${this.size}`, onClick: (e) => e.stopPropagation() }, h("div", { class: "modal-header" }, h("span", { class: "modal-title" }, this.modalTitle), h("button", { class: "modal-close", onClick: () => this.close() }, "\u2715")), h("div", { class: "modal-body" }, h("slot", null)), h("div", { class: "modal-footer" }, h("slot", { name: "footer" })))));
+    }
+    static get is() { return "my-modal"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["my-modal.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["my-modal.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "open": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "open",
+                "defaultValue": "false"
+            },
+            "modalTitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "modal-title",
+                "defaultValue": "''"
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'small' | 'medium' | 'large'",
+                    "resolved": "\"large\" | \"medium\" | \"small\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "size",
+                "defaultValue": "'medium'"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "myClose",
+                "name": "myClose",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
+    static get watchers() {
+        return [{
+                "propName": "open",
+                "methodName": "handleOpenChange"
+            }];
+    }
+}

package/dist/components/index.js

@@ -1 +1 @@
-export{g as getAssetPath,r as render,s as setAssetPath,a as setNonce,b as setPlatformOptions}from"./p-BJi3ojZX.js";function t(s,t,e){return(s||"")+(t?" "+t:"")+(e?" "+e:"")}export{t as format}
+export{g as getAssetPath,r as render,s as setAssetPath,a as setNonce,b as setPlatformOptions}from"./p-qbDrUNkY.js";function t(s,t,e){return(s||"")+(t?" "+t:"")+(e?" "+e:"")}export{t as format}

package/dist/components/my-alert.d.ts

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

package/dist/components/my-alert.js

@@ -0,0 +1 @@
+import{t as e,p as s,H as t,c as r,h as o}from"./p-qbDrUNkY.js";const i=s(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.myDismiss=r(this,"myDismiss")}type="info";alertTitle="";dismissible=!1;dismissed=!1;myDismiss;icons={success:"✓",warning:"⚠",error:"✕",info:"ℹ"};dismiss(){this.dismissed=!0,this.myDismiss.emit()}render(){return this.dismissed?null:o("div",{class:"alert alert--"+this.type,role:"alert"},o("span",{class:"alert-icon"},this.icons[this.type]),o("div",{class:"alert-content"},this.alertTitle&&o("strong",{class:"alert-title"},this.alertTitle),o("span",{class:"alert-message"},o("slot",null))),this.dismissible&&o("button",{class:"alert-dismiss",onClick:()=>this.dismiss()},"✕"))}static get style(){return":host{display:block}.alert{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:8px;border-left:4px solid;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;font-size:14px;line-height:1.5}.alert-icon{font-size:16px;font-weight:700;flex-shrink:0;margin-top:1px}.alert-content{flex:1;display:flex;flex-direction:column;gap:2px}.alert-title{font-size:14px;font-weight:700}.alert-message{opacity:0.9}.alert-dismiss{background:none;border:none;font-size:14px;cursor:pointer;padding:0 4px;border-radius:4px;opacity:0.6;transition:opacity 0.15s;flex-shrink:0;line-height:1}.alert-dismiss:hover{opacity:1}.alert--success{background:#f0fdf4;border-color:#10b981;color:#065f46}.alert--success .alert-icon{color:#10b981}.alert--warning{background:#fffbeb;border-color:#f59e0b;color:#78350f}.alert--warning .alert-icon{color:#f59e0b}.alert--error{background:#fef2f2;border-color:#ef4444;color:#7f1d1d}.alert--error .alert-icon{color:#ef4444}.alert--info{background:#eff6ff;border-color:#3b82f6;color:#1e3a8a}.alert--info .alert-icon{color:#3b82f6}"}},[769,"my-alert",{type:[1],alertTitle:[1,"alert-title"],dismissible:[4],dismissed:[32]}]);function l(){"undefined"!=typeof customElements&&["my-alert"].forEach((s=>{"my-alert"===s&&(customElements.get(e(s))||customElements.define(e(s),i))}))}l();const a=i,n=l;export{a as MyAlert,n as defineCustomElement}

package/dist/components/my-badge.js

@@ -1 +1 @@
-import{t as e,p as o,H as t,h as a}from"./p-BJi3ojZX.js";const i=o(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}color="neutral";size="medium";pill=!1;render(){return a("span",{key:"33a316730b54199e32c7ecbd1160997411e5ff95",class:`badge badge--${this.color} badge--${this.size} ${this.pill?"badge--pill":""}`},a("slot",{key:"eb7a3e46ea27e7d714dcc60723ca7f5801204674"}))}static get style(){return":host{display:inline-block}.badge{display:inline-flex;align-items:center;justify-content:center;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;font-weight:600;border-radius:4px;transition:all 0.2s ease}.badge--pill{border-radius:100px}.badge--small{padding:4px 8px;font-size:11px;line-height:1}.badge--medium{padding:6px 12px;font-size:13px;line-height:1}.badge--large{padding:8px 16px;font-size:15px;line-height:1}.badge--success{background-color:#10b981;color:white}.badge--warning{background-color:#f59e0b;color:white}.badge--error{background-color:#ef4444;color:white}.badge--info{background-color:#3b82f6;color:white}.badge--neutral{background-color:#6b7280;color:white}.badge:hover{opacity:0.9;transform:scale(1.05)}"}},[769,"my-badge",{color:[1],size:[1],pill:[4]}]);function n(){"undefined"!=typeof customElements&&["my-badge"].forEach((o=>{"my-badge"===o&&(customElements.get(e(o))||customElements.define(e(o),i))}))}n();const s=i,l=n;export{s as MyBadge,l as defineCustomElement}
+import{t as e,p as o,H as t,h as a}from"./p-qbDrUNkY.js";const i=o(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}color="neutral";size="medium";pill=!1;render(){return a("span",{key:"33a316730b54199e32c7ecbd1160997411e5ff95",class:`badge badge--${this.color} badge--${this.size} ${this.pill?"badge--pill":""}`},a("slot",{key:"eb7a3e46ea27e7d714dcc60723ca7f5801204674"}))}static get style(){return":host{display:inline-block}.badge{display:inline-flex;align-items:center;justify-content:center;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;font-weight:600;border-radius:4px;transition:all 0.2s ease}.badge--pill{border-radius:100px}.badge--small{padding:4px 8px;font-size:11px;line-height:1}.badge--medium{padding:6px 12px;font-size:13px;line-height:1}.badge--large{padding:8px 16px;font-size:15px;line-height:1}.badge--success{background-color:#10b981;color:white}.badge--warning{background-color:#f59e0b;color:white}.badge--error{background-color:#ef4444;color:white}.badge--info{background-color:#3b82f6;color:white}.badge--neutral{background-color:#6b7280;color:white}.badge:hover{opacity:0.9;transform:scale(1.05)}"}},[769,"my-badge",{color:[1],size:[1],pill:[4]}]);function n(){"undefined"!=typeof customElements&&["my-badge"].forEach((o=>{"my-badge"===o&&(customElements.get(e(o))||customElements.define(e(o),i))}))}n();const s=i,r=n;export{s as MyBadge,r as defineCustomElement}

package/dist/components/my-button.js

@@ -1 +1 @@
-import{t as e,p as t,H as n,h as a}from"./p-BJi3ojZX.js";const r=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}variant="primary";size="medium";disabled=!1;render(){return a("button",{key:"94d04ac3ac7441f76510463322200c2b7a01d569",class:`btn btn--${this.variant} btn--${this.size}`,disabled:this.disabled},a("slot",{key:"80f6c9a56010f80635288b16804d33c780232da5"}))}static get style(){return":host{display:inline-block}.btn{font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:all 0.2s ease;text-align:center;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px rgba(0, 0, 0, 0.15)}.btn:active:not(:disabled){transform:translateY(0)}.btn:disabled{opacity:0.5;cursor:not-allowed}.btn--small{padding:8px 16px;font-size:14px}.btn--medium{padding:12px 24px;font-size:16px}.btn--large{padding:16px 32px;font-size:18px}.btn--primary{background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);color:white}.btn--primary:hover:not(:disabled){background:linear-gradient(135deg, #5568d3 0%, #63408a 100%)}.btn--secondary{background:linear-gradient(135deg, #f093fb 0%, #f5576c 100%);color:white}.btn--secondary:hover:not(:disabled){background:linear-gradient(135deg, #d97ee0 0%, #db4a5d 100%)}.btn--danger{background:linear-gradient(135deg, #fa709a 0%, #fee140 100%);color:#333}.btn--danger:hover:not(:disabled){background:linear-gradient(135deg, #e55d87 0%, #e5ca2b 100%)}"}},[769,"my-button",{variant:[1],size:[1],disabled:[4]}]);function d(){"undefined"!=typeof customElements&&["my-button"].forEach((t=>{"my-button"===t&&(customElements.get(e(t))||customElements.define(e(t),r))}))}d();const i=r,o=d;export{i as MyButton,o as defineCustomElement}
+import{t as e,p as t,H as n,h as a}from"./p-qbDrUNkY.js";const r=t(class extends n{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}variant="primary";size="medium";disabled=!1;render(){return a("button",{key:"94d04ac3ac7441f76510463322200c2b7a01d569",class:`btn btn--${this.variant} btn--${this.size}`,disabled:this.disabled},a("slot",{key:"80f6c9a56010f80635288b16804d33c780232da5"}))}static get style(){return":host{display:inline-block}.btn{font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:all 0.2s ease;text-align:center;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px rgba(0, 0, 0, 0.15)}.btn:active:not(:disabled){transform:translateY(0)}.btn:disabled{opacity:0.5;cursor:not-allowed}.btn--small{padding:8px 16px;font-size:14px}.btn--medium{padding:12px 24px;font-size:16px}.btn--large{padding:16px 32px;font-size:18px}.btn--primary{background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);color:white}.btn--primary:hover:not(:disabled){background:linear-gradient(135deg, #5568d3 0%, #63408a 100%)}.btn--secondary{background:linear-gradient(135deg, #f093fb 0%, #f5576c 100%);color:white}.btn--secondary:hover:not(:disabled){background:linear-gradient(135deg, #d97ee0 0%, #db4a5d 100%)}.btn--danger{background:linear-gradient(135deg, #fa709a 0%, #fee140 100%);color:#333}.btn--danger:hover:not(:disabled){background:linear-gradient(135deg, #e55d87 0%, #e5ca2b 100%)}"}},[769,"my-button",{variant:[1],size:[1],disabled:[4]}]);function d(){"undefined"!=typeof customElements&&["my-button"].forEach((t=>{"my-button"===t&&(customElements.get(e(t))||customElements.define(e(t),r))}))}d();const i=r,o=d;export{i as MyButton,o as defineCustomElement}

package/dist/components/my-card.js

@@ -1 +1 @@
-import{t as e,p as a,H as t,h as o}from"./p-BJi3ojZX.js";const c=a(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}cardTitle;subtitle;elevation="medium";render(){return o("div",{key:"771331816e786b93963b10dcc4577c89da6385c5",class:"card card--"+this.elevation},this.cardTitle&&o("div",{key:"525c2dfdda668cb45895f6f1e9b55e6923b9538d",class:"card__header"},o("h3",{key:"a3025832b6ce60e73dce68f575bca6fbb1143913",class:"card__title"},this.cardTitle),this.subtitle&&o("p",{key:"3c3f094449a06aa41b63db17b3ab27e7e29be437",class:"card__subtitle"},this.subtitle)),o("div",{key:"628c69443cf48fb07ee98fde44c0c2f6de148ed5",class:"card__content"},o("slot",{key:"f0c2c156603f2179314e7c58aabefbeda3b2e911"})),o("div",{key:"8f5a30d595399c6a606a5cde67c393aca93e3d0d",class:"card__footer"},o("slot",{key:"1cb72bdc25ce96673d85c9fc86ff5661975cd412",name:"footer"})))}static get style(){return":host{display:block}.card{background:white;border-radius:12px;overflow:hidden;transition:all 0.3s ease;border:1px solid #e5e7eb}.card:hover{transform:translateY(-4px)}.card--low{box-shadow:0 1px 3px rgba(0, 0, 0, 0.1)}.card--low:hover{box-shadow:0 4px 6px rgba(0, 0, 0, 0.1)}.card--medium{box-shadow:0 4px 6px rgba(0, 0, 0, 0.1)}.card--medium:hover{box-shadow:0 10px 15px rgba(0, 0, 0, 0.15)}.card--high{box-shadow:0 10px 15px rgba(0, 0, 0, 0.15)}.card--high:hover{box-shadow:0 20px 25px rgba(0, 0, 0, 0.2)}.card__header{padding:24px 24px 0}.card__title{margin:0;font-size:24px;font-weight:700;color:#1f2937;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif}.card__subtitle{margin:8px 0 0;font-size:14px;color:#6b7280;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif}.card__content{padding:24px;color:#374151;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;line-height:1.6}.card__footer{padding:0 24px 24px;display:flex;gap:12px;align-items:center}.card__footer:empty{display:none}"}},[769,"my-card",{cardTitle:[1,"card-title"],subtitle:[1],elevation:[1]}]);function d(){"undefined"!=typeof customElements&&["my-card"].forEach((a=>{"my-card"===a&&(customElements.get(e(a))||customElements.define(e(a),c))}))}d();const s=c,r=d;export{s as MyCard,r as defineCustomElement}
+import{t as e,p as a,H as t,h as o}from"./p-qbDrUNkY.js";const c=a(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}cardTitle;subtitle;elevation="medium";render(){return o("div",{key:"771331816e786b93963b10dcc4577c89da6385c5",class:"card card--"+this.elevation},this.cardTitle&&o("div",{key:"525c2dfdda668cb45895f6f1e9b55e6923b9538d",class:"card__header"},o("h3",{key:"a3025832b6ce60e73dce68f575bca6fbb1143913",class:"card__title"},this.cardTitle),this.subtitle&&o("p",{key:"3c3f094449a06aa41b63db17b3ab27e7e29be437",class:"card__subtitle"},this.subtitle)),o("div",{key:"628c69443cf48fb07ee98fde44c0c2f6de148ed5",class:"card__content"},o("slot",{key:"f0c2c156603f2179314e7c58aabefbeda3b2e911"})),o("div",{key:"8f5a30d595399c6a606a5cde67c393aca93e3d0d",class:"card__footer"},o("slot",{key:"1cb72bdc25ce96673d85c9fc86ff5661975cd412",name:"footer"})))}static get style(){return":host{display:block}.card{background:white;border-radius:12px;overflow:hidden;transition:all 0.3s ease;border:1px solid #e5e7eb}.card:hover{transform:translateY(-4px)}.card--low{box-shadow:0 1px 3px rgba(0, 0, 0, 0.1)}.card--low:hover{box-shadow:0 4px 6px rgba(0, 0, 0, 0.1)}.card--medium{box-shadow:0 4px 6px rgba(0, 0, 0, 0.1)}.card--medium:hover{box-shadow:0 10px 15px rgba(0, 0, 0, 0.15)}.card--high{box-shadow:0 10px 15px rgba(0, 0, 0, 0.15)}.card--high:hover{box-shadow:0 20px 25px rgba(0, 0, 0, 0.2)}.card__header{padding:24px 24px 0}.card__title{margin:0;font-size:24px;font-weight:700;color:#1f2937;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif}.card__subtitle{margin:8px 0 0;font-size:14px;color:#6b7280;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif}.card__content{padding:24px;color:#374151;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;line-height:1.6}.card__footer{padding:0 24px 24px;display:flex;gap:12px;align-items:center}.card__footer:empty{display:none}"}},[769,"my-card",{cardTitle:[1,"card-title"],subtitle:[1],elevation:[1]}]);function d(){"undefined"!=typeof customElements&&["my-card"].forEach((a=>{"my-card"===a&&(customElements.get(e(a))||customElements.define(e(a),c))}))}d();const s=c,r=d;export{s as MyCard,r as defineCustomElement}

package/dist/components/my-component.js

@@ -1 +1 @@
-import{t,p as e,H as s,h as o}from"./p-BJi3ojZX.js";import{format as n}from"./index.js";const i=e(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}first;middle;last;getText(){return n(this.first,this.middle,this.last)}render(){return o("div",{key:"543ff9a15c7d307e7e59a1143b033faeee29b1cb"},"Hello, World! I'm ",this.getText())}static get style(){return":host{display:block}"}},[513,"my-component",{first:[1],middle:[1],last:[1]}]);function m(){"undefined"!=typeof customElements&&["my-component"].forEach((e=>{"my-component"===e&&(customElements.get(t(e))||customElements.define(t(e),i))}))}m();const r=i,c=m;export{r as MyComponent,c as defineCustomElement}
+import{t,p as e,H as s,h as o}from"./p-qbDrUNkY.js";import{format as n}from"./index.js";const r=e(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}first;middle;last;getText(){return n(this.first,this.middle,this.last)}render(){return o("div",{key:"543ff9a15c7d307e7e59a1143b033faeee29b1cb"},"Hello, World! I'm ",this.getText())}static get style(){return":host{display:block}"}},[513,"my-component",{first:[1],middle:[1],last:[1]}]);function m(){"undefined"!=typeof customElements&&["my-component"].forEach((e=>{"my-component"===e&&(customElements.get(t(e))||customElements.define(t(e),r))}))}m();const i=r,c=m;export{i as MyComponent,c as defineCustomElement}

package/dist/components/my-dropdown.d.ts

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

package/dist/components/my-dropdown.js

@@ -0,0 +1 @@
+import{t as o,p as e,H as r,c as d,h as t}from"./p-qbDrUNkY.js";const s=e(class extends r{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.myChange=d(this,"myChange")}options=[];value="";placeholder="Select an option";label="";disabled=!1;error="";isOpen=!1;myChange;get parsedOptions(){if("string"==typeof this.options)try{return JSON.parse(this.options)}catch{return[]}return this.options}get selectedLabel(){const o=this.parsedOptions.find((o=>o.value===this.value));return o?o.label:this.placeholder}select(o){this.myChange.emit(o),this.isOpen=!1}render(){return t("div",{key:"2e99fe0d9bd2ee48e0827ddcb4feec85ad102b36",class:"dropdown-wrapper "+(this.error?"dropdown-wrapper--error":"")},this.label&&t("label",{key:"c69f0dcc8c6f0cadd7e3896ebacd43a5dfdfccda",class:"dropdown-label"},this.label),t("div",{key:"2f9e442f6a92be57ffe694dd9ec53586fbf548e0",class:`dropdown ${this.isOpen?"dropdown--open":""} ${this.disabled?"dropdown--disabled":""}`},t("button",{key:"46d0696358cac16b51127cabb408a7290a54ea1a",class:"dropdown-trigger",disabled:this.disabled,onClick:()=>!this.disabled&&(this.isOpen=!this.isOpen)},t("span",{key:"16acade80b5ff899084acbfb753ca869f9f5f237",class:this.value?"":"dropdown-placeholder"},this.selectedLabel),t("span",{key:"426582643773176b7dbaeacc22b46b27ececa60b",class:"dropdown-arrow"},this.isOpen?"▲":"▼")),this.isOpen&&t("ul",{key:"f1cbe6f1af273ed5b3437985ecb5bd1ec73ca318",class:"dropdown-menu"},this.parsedOptions.map((o=>t("li",{class:"dropdown-item "+(o.value===this.value?"dropdown-item--selected":""),onClick:()=>this.select(o.value)},o.label))))),this.error&&t("span",{key:"d14cac844bb832778afa7592869eb96dcfeb10a2",class:"dropdown-error"},this.error))}static get style(){return":host{display:block}.dropdown-wrapper{display:flex;flex-direction:column;gap:6px;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif}.dropdown-label{font-size:14px;font-weight:600;color:#374151}.dropdown{position:relative}.dropdown-trigger{width:100%;padding:10px 14px;font-size:15px;border:2px solid #d1d5db;border-radius:8px;background:#fff;color:#111827;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px;transition:border-color 0.2s, box-shadow 0.2s;text-align:left;box-sizing:border-box}.dropdown-trigger:hover:not(:disabled){border-color:#667eea}.dropdown--open .dropdown-trigger{border-color:#667eea;box-shadow:0 0 0 3px rgba(102, 126, 234, 0.15)}.dropdown--disabled .dropdown-trigger{background:#f3f4f6;color:#9ca3af;cursor:not-allowed}.dropdown-placeholder{color:#9ca3af}.dropdown-arrow{font-size:11px;color:#6b7280;flex-shrink:0}.dropdown-menu{position:absolute;top:calc(100% + 4px);left:0;right:0;background:#fff;border:2px solid #667eea;border-radius:8px;box-shadow:0 8px 24px rgba(0, 0, 0, 0.12);list-style:none;margin:0;padding:4px;z-index:100;max-height:240px;overflow-y:auto}.dropdown-item{padding:10px 12px;border-radius:6px;cursor:pointer;font-size:15px;color:#111827;transition:background 0.15s}.dropdown-item:hover{background:#f3f4f6}.dropdown-item--selected{background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);color:white}.dropdown-item--selected:hover{background:linear-gradient(135deg, #5568d3 0%, #63408a 100%)}.dropdown-wrapper--error .dropdown-trigger{border-color:#ef4444}.dropdown-error{font-size:13px;color:#ef4444}"}},[513,"my-dropdown",{options:[1],value:[1],placeholder:[1],label:[1],disabled:[4],error:[1],isOpen:[32]}]);function a(){"undefined"!=typeof customElements&&["my-dropdown"].forEach((e=>{"my-dropdown"===e&&(customElements.get(o(e))||customElements.define(o(e),s))}))}a();const n=s,i=a;export{n as MyDropdown,i as defineCustomElement}

package/dist/components/my-input.d.ts

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

package/dist/components/my-input.js

@@ -0,0 +1 @@
+import{t as e,p as r,H as t,c as i,h as o}from"./p-qbDrUNkY.js";const s=r(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.myChange=i(this,"myChange"),this.myBlur=i(this,"myBlur")}label="";placeholder="";value="";type="text";error="";disabled=!1;required=!1;myChange;myBlur;render(){return o("div",{key:"9ee947b792e9829d2aa329b5314ea61515e460b1",class:"input-wrapper "+(this.error?"input-wrapper--error":"")},this.label&&o("label",{key:"f0e912275821438feb4518ed2618a49971625470",class:"input-label"},this.label,this.required&&o("span",{key:"c7033d3974315c8fd4a25b7f408f263852b47920",class:"input-required"},"*")),o("input",{key:"e5858925769f01801051fe54da86bd805b3594e2",class:"input-field",type:this.type,placeholder:this.placeholder,value:this.value,disabled:this.disabled,onInput:e=>this.myChange.emit(e.target.value),onBlur:()=>this.myBlur.emit()}),this.error&&o("span",{key:"f07db0cbdc2d9d91a48ea3cb67e74cc56f039ee6",class:"input-error"},this.error))}static get style(){return":host{display:block}.input-wrapper{display:flex;flex-direction:column;gap:6px;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif}.input-label{font-size:14px;font-weight:600;color:#374151}.input-required{color:#ef4444;margin-left:2px}.input-field{padding:10px 14px;font-size:15px;border:2px solid #d1d5db;border-radius:8px;outline:none;transition:border-color 0.2s ease, box-shadow 0.2s ease;background:#fff;color:#111827;width:100%;box-sizing:border-box}.input-field:focus{border-color:#667eea;box-shadow:0 0 0 3px rgba(102, 126, 234, 0.15)}.input-field:disabled{background:#f3f4f6;color:#9ca3af;cursor:not-allowed}.input-wrapper--error .input-field{border-color:#ef4444}.input-wrapper--error .input-field:focus{box-shadow:0 0 0 3px rgba(239, 68, 68, 0.15)}.input-error{font-size:13px;color:#ef4444}"}},[513,"my-input",{label:[1],placeholder:[1],value:[1],type:[1],error:[1],disabled:[4],required:[4]}]);function a(){"undefined"!=typeof customElements&&["my-input"].forEach((r=>{"my-input"===r&&(customElements.get(e(r))||customElements.define(e(r),s))}))}a();const l=s,n=a;export{l as MyInput,n as defineCustomElement}

package/dist/components/my-modal.d.ts

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

package/dist/components/my-modal.js

@@ -0,0 +1 @@
+import{t as e,p as o,H as t,c as a,h as s}from"./p-qbDrUNkY.js";const l=o(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.myClose=a(this,"myClose")}open=!1;modalTitle="";size="medium";myClose;handleOpenChange(e){document.body.style.overflow=e?"hidden":""}close(){this.open=!1,this.myClose.emit()}render(){return this.open?s("div",{class:"modal-overlay",onClick:()=>this.close()},s("div",{class:"modal modal--"+this.size,onClick:e=>e.stopPropagation()},s("div",{class:"modal-header"},s("span",{class:"modal-title"},this.modalTitle),s("button",{class:"modal-close",onClick:()=>this.close()},"✕")),s("div",{class:"modal-body"},s("slot",null)),s("div",{class:"modal-footer"},s("slot",{name:"footer"})))):null}static get watchers(){return{open:[{handleOpenChange:0}]}}static get style(){return":host{display:contents}.modal-overlay{position:fixed;inset:0;background:rgba(0, 0, 0, 0.5);display:flex;align-items:center;justify-content:center;z-index:1000;padding:16px;box-sizing:border-box}.modal{background:#fff;border-radius:12px;box-shadow:0 20px 60px rgba(0, 0, 0, 0.3);display:flex;flex-direction:column;max-height:90vh;width:100%;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;animation:modal-in 0.2s ease}@keyframes modal-in{from{opacity:0;transform:scale(0.95) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal--small{max-width:400px}.modal--medium{max-width:560px}.modal--large{max-width:800px}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid #e5e7eb}.modal-title{font-size:18px;font-weight:700;color:#111827}.modal-close{background:none;border:none;font-size:18px;color:#6b7280;cursor:pointer;padding:4px 8px;border-radius:6px;line-height:1;transition:background 0.15s}.modal-close:hover{background:#f3f4f6;color:#111827}.modal-body{padding:24px;overflow-y:auto;flex:1;color:#374151;font-size:15px;line-height:1.6}.modal-footer{padding:16px 24px;border-top:1px solid #e5e7eb;display:flex;justify-content:flex-end;gap:12px}.modal-footer:empty{display:none}"}},[769,"my-modal",{open:[1028],modalTitle:[1,"modal-title"],size:[1]},void 0,{open:[{handleOpenChange:0}]}]);function n(){"undefined"!=typeof customElements&&["my-modal"].forEach((o=>{"my-modal"===o&&(customElements.get(e(o))||customElements.define(e(o),l))}))}n();const i=l,d=n;export{i as MyModal,d as defineCustomElement}

package/dist/components/p-qbDrUNkY.js

@@ -0,0 +1 @@
+function t(t,e,n){const l="undefined"!=typeof HTMLElement?HTMLElement.prototype:null;for(;t&&t!==l;){const l=Object.getOwnPropertyDescriptor(t,e);if(l&&(!n||l.get))return l;t=Object.getPrototypeOf(t)}}var e,n=(e,n)=>{var l;Object.entries(null!=(l=n.l.t)?l:{}).map((([l,[o]])=>{if(31&o||32&o){const o=e[l],s=t(Object.getPrototypeOf(e),l,!0)||Object.getOwnPropertyDescriptor(e,l);s&&Object.defineProperty(e,l,{get(){return s.get.call(this)},set(t){s.set.call(this,t)},configurable:!0,enumerable:!0}),n.o.has(l)?e[l]=n.o.get(l):void 0!==o&&(e[l]=o)}}))},l=t=>{if(t.__stencil__getHostRef)return t.__stencil__getHostRef()},o=(t,e)=>e in t,s=(t,e)=>(0,console.error)(t,e),r=new Map,i="undefined"!=typeof window?window:{},c=i.HTMLElement||class{},u={i:0,u:"",jmp:t=>t(),raf:t=>requestAnimationFrame(t),ael:(t,e,n,l)=>t.addEventListener(e,n,l),rel:(t,e,n,l)=>t.removeEventListener(e,n,l),ce:(t,e)=>new CustomEvent(t,e)},f=(()=>{try{return!!i.document.adoptedStyleSheets&&(new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replaceSync)}catch(t){}return!1})(),a=!!f&&(()=>!!i.document&&Object.getOwnPropertyDescriptor(i.document.adoptedStyleSheets,"length").writable)(),d=!1,p=[],h=[],m=(t,e)=>n=>{t.push(n),d||(d=!0,e&&4&u.i?$(y):u.raf(y))},b=t=>{for(let e=0;e<t.length;e++)try{t[e](performance.now())}catch(t){s(t)}t.length=0},y=()=>{b(p),b(h),(d=p.length>0)&&u.raf(y)},$=t=>Promise.resolve(undefined).then(t),v=m(h,!0),w=t=>{const e=new URL(t,u.u);return e.origin!==i.location.origin?e.href:e.pathname},g=t=>u.u=t;function j(){const t=this.attachShadow({mode:"open"});void 0===e&&(e=null),e&&(a?t.adoptedStyleSheets.push(e):t.adoptedStyleSheets=[...t.adoptedStyleSheets,e])}var O,S=new WeakMap,k=t=>"sc-"+t.p,M=t=>"object"==(t=typeof t)||"function"===t,E=(t,e,...n)=>{let l=null,o=null,s=!1,r=!1;const i=[],c=e=>{for(let n=0;n<e.length;n++)l=e[n],Array.isArray(l)?c(l):null!=l&&"boolean"!=typeof l&&((s="function"!=typeof t&&!M(l))&&(l=String(l)),s&&r?i[i.length-1].h+=l:i.push(s?A(null,l):l),r=s)};if(c(n),e){e.key&&(o=e.key);{const t=e.className||e.class;t&&(e.class="object"!=typeof t?t:Object.keys(t).filter((e=>t[e])).join(" "))}}const u=A(t,null);return u.m=e,i.length>0&&(u.$=i),u.v=o,u},A=(t,e)=>({i:0,j:t,h:null!=e?e:null,O:null,$:null,m:null,v:null}),C={},x=t=>{if(!t)return;const e=Object.keys(t);if(0===e.length)return;let n=!1;for(const l of e){if(n)break;for(const e of t[l])if("string"==typeof e){n=!0;break}}if(!n)return t;const l={};for(const n of e)l[n]=t[n].map((t=>"string"==typeof t?{[t]:0}:t));return l},L=(t,e)=>null==t||M(t)?t:4&e?"false"!==t&&(""===t||!!t):1&e?String(t):t,_=(t,e)=>{const n=t;return{emit:t=>D(n,e,{bubbles:!0,composed:!0,cancelable:!0,detail:t})}},D=(t,e,n)=>{const l=u.ce(e,n);return t.dispatchEvent(l),l},H=(t,e,n,s,r,c)=>{if(n===s)return;let f=o(t,e),a=e.toLowerCase();if("class"===e){const e=t.classList,l=R(n);let o=R(s);e.remove(...l.filter((t=>t&&!o.includes(t)))),e.add(...o.filter((t=>t&&!l.includes(t))))}else if("key"===e);else if(t.__lookupSetter__(e)||"o"!==e[0]||"n"!==e[1]){if("a"===e[0]&&e.startsWith("attr:")){const n=e.slice(5);let o;{const e=l(t);if(e&&e.l&&e.l.t){const t=e.l.t[n];t&&t[1]&&(o=t[1])}}return o||(o=n.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase()),void(null==s||!1===s?!1===s&&""!==t.getAttribute(o)||t.removeAttribute(o):t.setAttribute(o,!0===s?"":s))}if("p"===e[0]&&e.startsWith("prop:")){const n=e.slice(5);try{t[n]=s}catch(t){}return}{const l=M(s);if((f||l&&null!==s)&&!r)try{if(t.tagName.includes("-"))t[e]!==s&&(t[e]=s);else{const l=null==s?"":s;"list"===e?f=!1:null!=n&&t[e]===l||("function"==typeof t.__lookupSetter__(e)?t[e]=l:t.setAttribute(e,l))}}catch(t){}null==s||!1===s?!1===s&&""!==t.getAttribute(e)||t.removeAttribute(e):(!f||4&c||r)&&!l&&1===t.nodeType&&t.setAttribute(e,s=!0===s?"":s)}}else if(e="-"===e[2]?e.slice(3):o(i,a)?a.slice(2):a[2]+e.slice(3),n||s){const l=e.endsWith(U);e=e.replace(W,""),n&&u.rel(t,e,n,l),s&&u.ael(t,e,s,l)}},P=/\s/,R=t=>("object"==typeof t&&t&&"baseVal"in t&&(t=t.baseVal),t&&"string"==typeof t?t.split(P):[]),U="Capture",W=new RegExp(U+"$"),N=(t,e,n)=>{const l=11===e.O.nodeType&&e.O.host?e.O.host:e.O,o=t&&t.m||{},s=e.m||{};for(const t of V(Object.keys(o)))t in s||H(l,t,o[t],void 0,n,e.i);for(const t of V(Object.keys(s)))H(l,t,o[t],s[t],n,e.i)};function V(t){return t.includes("ref")?[...t.filter((t=>"ref"!==t)),"ref"]:t}var q=!1,z=!1,F=(t,e,n)=>{const l=e.$[n];let o,s,r=0;if(null!=l.h)o=l.O=i.document.createTextNode(l.h);else{if(!i.document)throw new Error("You are trying to render a Stencil component in an environment that doesn't support the DOM.");if(o=l.O=i.document.createElement(l.j),N(null,l,z),l.$){const e="template"===l.j?o.content:o;for(r=0;r<l.$.length;++r)s=F(t,l,r),s&&e.appendChild(s)}}return o["s-hn"]=O,o},T=(t,e,n,l,o,s)=>{let r,i=t;for(i.shadowRoot&&i.tagName===O&&(i=i.shadowRoot),"template"===n.j&&(i=i.content);o<=s;++o)l[o]&&(r=F(null,n,o),r&&(l[o].O=r,G(i,r,e)))},Y=(t,e,n)=>{for(let l=e;l<=n;++l){const e=t[l];if(e){const t=e.O;t&&t.remove()}}},Z=(t,e,n=!1)=>t.j===e.j&&(n?(n&&!t.v&&e.v&&(t.v=e.v),!0):t.v===e.v),B=(t,e,n=!1)=>{const l=e.O=t.O,o=t.$,s=e.$,r=e.h;null==r?("slot"!==e.j||q||t.S!==e.S&&(e.O["s-sn"]=e.S||"",(t=>{u.i|=1;const e=t.closest(O.toLowerCase());if(null!=e){const n=Array.from(e.__childNodes||e.childNodes).find((t=>t["s-cr"])),l=Array.from(t.__childNodes||t.childNodes);for(const t of n?l.reverse():l)null!=t["s-sh"]&&(G(e,t,null!=n?n:null),t["s-sh"]=void 0)}u.i&=-2})(e.O.parentElement)),N(t,e,z),null!==o&&null!==s?((t,e,n,l,o=!1)=>{let s,r,i=0,c=0,u=0,f=0,a=e.length-1,d=e[0],p=e[a],h=l.length-1,m=l[0],b=l[h];const y="template"===n.j?t.content:t;for(;i<=a&&c<=h;)if(null==d)d=e[++i];else if(null==p)p=e[--a];else if(null==m)m=l[++c];else if(null==b)b=l[--h];else if(Z(d,m,o))B(d,m,o),d=e[++i],m=l[++c];else if(Z(p,b,o))B(p,b,o),p=e[--a],b=l[--h];else if(Z(d,b,o))B(d,b,o),G(y,d.O,p.O.nextSibling),d=e[++i],b=l[--h];else if(Z(p,m,o))B(p,m,o),G(y,p.O,d.O),p=e[--a],m=l[++c];else{for(u=-1,f=i;f<=a;++f)if(e[f]&&null!==e[f].v&&e[f].v===m.v){u=f;break}u>=0?(r=e[u],r.j!==m.j?s=F(e&&e[c],n,u):(B(r,m,o),e[u]=void 0,s=r.O),m=l[++c]):(s=F(e&&e[c],n,c),m=l[++c]),s&&G(d.O.parentNode,s,d.O)}i>a?T(t,null==l[h+1]?null:l[h+1].O,n,l,c,h):c>h&&Y(e,i,a)})(l,o,e,s,n):null!==s?(null!==t.h&&(l.textContent=""),T(l,null,e,s,0,s.length-1)):!n&&null!==o&&Y(o,0,o.length-1)):t.h!==r&&(l.data=r)},G=(t,e,n)=>t.__insertBefore?t.__insertBefore(e,n):null==t?void 0:t.insertBefore(e,n),I=(t,e,n=!1)=>{const l=t.$hostElement$,o=t.l,s=t.k||A(null,null);var r;const i=(r=e)&&r.j===C?e:E(null,null,e);if(O=l.tagName,n&&i.m)for(const t of Object.keys(i.m))l.hasAttribute(t)&&!["key","ref","style","class"].includes(t)&&(i.m[t]=l[t]);i.j=null,i.i|=4,t.k=i,i.O=s.O=l.shadowRoot||l,q=!(!(1&o.i)||128&o.i),B(s,i,n)},J=(t,e)=>{if(e&&!t.M&&e["s-p"]){const n=e["s-p"].push(new Promise((l=>t.M=()=>{e["s-p"].splice(n-1,1),l()})))}},K=(t,e)=>{if(t.i|=16,4&t.i)return void(t.i|=512);J(t,t.A);const n=()=>Q(t,e);if(!e)return v(n);queueMicrotask((()=>{n()}))},Q=(t,e)=>{const n=t.$hostElement$,l=n;if(!l)throw new Error(`Can't render component <${n.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`);let o;return o=st(l,e?"componentWillLoad":"componentWillUpdate",void 0,n),o=X(o,(()=>st(l,"componentWillRender",void 0,n))),X(o,(()=>et(t,l,e)))},X=(t,e)=>tt(t)?t.then(e).catch((t=>{console.error(t),e()})):e(),tt=t=>t instanceof Promise||t&&t.then&&"function"==typeof t.then,et=async(t,e,n)=>{var l;const o=t.$hostElement$,s=o["s-rc"];n&&(t=>{const e=t.l,n=t.$hostElement$,l=e.i,o=((t,e)=>{var n,l,o;const s=k(e),c=r.get(s);if(!i.document)return s;if(t=11===t.nodeType?t:i.document,c)if("string"==typeof c){let o,r=S.get(t=t.head||t);if(r||S.set(t,r=new Set),!r.has(s)){o=i.document.createElement("style"),o.textContent=c;const d=null!=(n=u.C)?n:function(){var t,e,n;return null!=(n=null==(e=null==(t=i.document.head)?void 0:t.querySelector('meta[name="csp-nonce"]'))?void 0:e.getAttribute("content"))?n:void 0}();if(null!=d&&o.setAttribute("nonce",d),!(1&e.i))if("HEAD"===t.nodeName){const e=t.querySelectorAll("link[rel=preconnect]"),n=e.length>0?e[e.length-1].nextSibling:t.querySelector("style");t.insertBefore(o,(null==n?void 0:n.parentNode)===t?n:null)}else if("host"in t)if(f){const e=new(null!=(l=t.defaultView)?l:t.ownerDocument.defaultView).CSSStyleSheet;e.replaceSync(c),a?t.adoptedStyleSheets.unshift(e):t.adoptedStyleSheets=[e,...t.adoptedStyleSheets]}else{const e=t.querySelector("style");e?e.textContent=c+e.textContent:t.prepend(o)}else t.append(o);1&e.i&&t.insertBefore(o,null),4&e.i&&(o.textContent+="slot-fb{display:contents}slot-fb[hidden]{display:none}"),r&&r.add(s)}}else{let e=S.get(t);if(e||S.set(t,e=new Set),!e.has(s)){const n=null!=(o=t.defaultView)?o:t.ownerDocument.defaultView;let l;if(c.constructor===n.CSSStyleSheet)l=c;else{l=new n.CSSStyleSheet;for(let t=0;t<c.cssRules.length;t++)l.insertRule(c.cssRules[t].cssText,t)}a?t.adoptedStyleSheets.push(l):t.adoptedStyleSheets=[...t.adoptedStyleSheets,l],e.add(s)}}return s})(n.shadowRoot?n.shadowRoot:n.getRootNode(),e);10&l&&(n["s-sc"]=o,n.classList.add(o+"-h"))})(t);nt(t,e,o,n),s&&(s.map((t=>t())),o["s-rc"]=void 0);{const e=null!=(l=o["s-p"])?l:[],n=()=>lt(t);0===e.length?n():(Promise.all(e).then(n).catch(n),t.i|=4,e.length=0)}},nt=(t,e,n,l)=>{try{e=e.render(),t.i&=-17,t.i|=2,I(t,e,l)}catch(e){s(e,t.$hostElement$)}return null},lt=t=>{const e=t.$hostElement$,n=e,l=t.A;st(n,"componentDidRender",void 0,e),64&t.i?st(n,"componentDidUpdate",void 0,e):(t.i|=64,rt(e),st(n,"componentDidLoad",void 0,e),t.L(e),l||ot()),t.M&&(t.M(),t.M=void 0),512&t.i&&$((()=>K(t,!1))),t.i&=-517},ot=()=>{$((()=>D(i,"appload",{detail:{namespace:"stencil-library"}})))},st=(t,e,n,l)=>{if(t&&t[e])try{return t[e](n)}catch(t){s(t,l)}},rt=t=>t.classList.add("hydrated"),it=(t,e,n,o)=>{const r=l(t);if(!r)return;const i=t,c=r.o.get(e),u=r.i,f=i;n=L(n,o.t[e][0]);const a=Number.isNaN(c)&&Number.isNaN(n);if(n!==c&&!a){if(r.o.set(e,n),o._){const t=o._[e];t&&t.map((t=>{try{const[[l,o]]=Object.entries(t);(128&u||1&o)&&(f?f[l](n,c,e):r.D.push((()=>{r.H[l](n,c,e)})))}catch(t){s(t,i)}}))}if(2&u){if(f.componentShouldUpdate&&!1===f.componentShouldUpdate(n,c,e)&&!(16&u))return;16&u||K(r,!1)}}},ct=(e,n)=>{var o,s;const r=e.prototype;{e.watchers&&!n._&&(n._=x(e.watchers)),e.deserializers&&!n.P&&(n.P=e.deserializers),e.serializers&&!n.R&&(n.R=e.serializers);const i=Object.entries(null!=(o=n.t)?o:{});i.map((([e,[o]])=>{if(31&o||32&o){const{get:s,set:i}=t(r,e)||{};s&&(n.t[e][0]|=2048),i&&(n.t[e][0]|=4096),Object.defineProperty(r,e,{get(){return s?s.apply(this):(t=e,l(this).o.get(t));var t},configurable:!0,enumerable:!0}),Object.defineProperty(r,e,{set(t){const s=l(this);if(s){if(i)return void 0===(32&o?this[e]:s.$hostElement$[e])&&s.o.get(e)&&(t=s.o.get(e)),i.apply(this,[L(t,o)]),void it(this,e,t=32&o?this[e]:s.$hostElement$[e],n);it(this,e,t,n)}}})}}));{const t=new Map;r.attributeChangedCallback=function(e,o,s){u.jmp((()=>{var c;const u=t.get(e),f=l(this);if(this.hasOwnProperty(u),r.hasOwnProperty(u)&&"number"==typeof this[u]&&this[u]==s)return;if(null==u){const t=null==f?void 0:f.i;if(f&&t&&!(8&t)&&s!==o){const l=this,r=null==(c=n._)?void 0:c[e];null==r||r.forEach((n=>{const[[r,i]]=Object.entries(n);null!=l[r]&&(128&t||1&i)&&l[r].call(l,s,o,e)}))}return}const a=i.find((([t])=>t===u)),d=a&&4&a[1][0],p=d&&null===s&&void 0===this[u];d&&(s=null!==s&&"false"!==s);const h=Object.getOwnPropertyDescriptor(r,u);p||s==this[u]||h.get&&!h.set||(this[u]=s)}))},e.observedAttributes=Array.from(new Set([...Object.keys(null!=(s=n._)?s:{}),...i.filter((([t,e])=>31&e[0])).map((([e,n])=>{const l=n[1]||e;return t.set(l,e),l}))]))}}return e},ut=(t,e)=>{const o={i:e[0],p:e[1]};try{o.t=e[2],o._=x(t._),o.P=t.P,o.R=t.R;const i=t.prototype.connectedCallback,c=t.prototype.disconnectedCallback;return Object.assign(t.prototype,{__hasHostListenerAttached:!1,__registerHost(){((t,e)=>{const l={i:0,$hostElement$:t,l:e,o:new Map,U:new Map};l.W=new Promise((t=>l.L=t)),t["s-p"]=[],t["s-rc"]=[];const o=l;t.__stencil__getHostRef=()=>o,512&e.i&&n(t,l)})(this,o)},connectedCallback(){if(!this.__hasHostListenerAttached){if(!l(this))return;this.__hasHostListenerAttached=!0}(t=>{if(!(1&u.i)){const e=l(t);if(!e)return;const n=e.l,o=()=>{};if(1&e.i)(null==e?void 0:e.H)||(null==e?void 0:e.W)&&e.W.then((()=>{}));else{e.i|=1;{let n=t;for(;n=n.parentNode||n.host;)if(n["s-p"]){J(e,e.A=n);break}}n.t&&Object.entries(n.t).map((([e,[n]])=>{if(31&n&&Object.prototype.hasOwnProperty.call(t,e)){const n=t[e];delete t[e],t[e]=n}})),(async(t,e,n)=>{let l;try{if(!(32&e.i)&&(e.i|=32,l=t.constructor,customElements.whenDefined(t.localName).then((()=>e.i|=128)),l&&l.style)){let t;"string"==typeof l.style&&(t=l.style);const e=k(n);if(!r.has(e)){const l=()=>{};((t,e,n)=>{let l=r.get(t);f&&n?(l=l||new CSSStyleSheet,"string"==typeof l?l=e:l.replaceSync(e)):l=e,r.set(t,l)})(e,t,!!(1&n.i)),l()}}const o=e.A,s=()=>K(e,!0);o&&o["s-rc"]?o["s-rc"].push(s):s()}catch(n){s(n,t),e.M&&(e.M(),e.M=void 0),e.L&&e.L(t)}})(t,e,n)}o()}})(this),i&&i.call(this)},disconnectedCallback(){(async t=>{1&u.i||l(t),S.has(t)&&S.delete(t),t.shadowRoot&&S.has(t.shadowRoot)&&S.delete(t.shadowRoot)})(this),c&&c.call(this)},__attachShadow(){if(this.shadowRoot){if("open"!==this.shadowRoot.mode)throw new Error(`Unable to re-use existing shadow root for ${o.p}! Mode is set to ${this.shadowRoot.mode} but Stencil only supports open shadow roots.`)}else j.call(this,o)}}),Object.defineProperty(t,"is",{value:o.p,configurable:!0}),ct(t,o)}catch(e){return s(e),t}},ft=t=>u.C=t,at=t=>Object.assign(u,t),dt=new WeakMap;function pt(t,e){let n=dt.get(e);n||(n={i:0,l:{i:0,p:e.tagName},$hostElement$:e},dt.set(e,n)),I(n,t)}function ht(t){return t}export{c as H,ft as a,at as b,_ as c,w as g,E as h,ut as p,pt as r,g as s,ht as t}

package/dist/esm/{index-Bdf40fwG.js → index-Bvqd98ac.js}

@@ -1,5 +1,5 @@
 const NAMESPACE = 'stencil-library';
-const BUILD = /* stencil-library */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", lazyLoad: true, prop: true, propChangeCallback: false, updatable: true};
+const BUILD = /* stencil-library */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", lazyLoad: true, propChangeCallback: true, state: true, updatable: true};
 
 /*
  Stencil Client Platform v4.43.5 | MIT Licensed | https://stenciljs.com
@@ -58,7 +58,7 @@ var registerInstance = (lazyInstance, hostRef) => {
   if (!hostRef) return;
   lazyInstance.__stencil__getHostRef = () => hostRef;
   hostRef.$lazyInstance$ = lazyInstance;
-  if (hostRef.$cmpMeta$.$flags$ & 512 /* hasModernPropertyDecls */ && (BUILD.prop)) {
+  if (hostRef.$cmpMeta$.$flags$ & 512 /* hasModernPropertyDecls */ && (BUILD.state)) {
     reWireGetterSetter(lazyInstance, hostRef);
   }
 };
@@ -417,6 +417,31 @@ var newVNode = (tag, text) => {
 var Host = {};
 var isHost = (node) => node && node.$tag$ === Host;
 
+// src/runtime/normalize-watchers.ts
+var normalizeWatchers = (raw) => {
+  if (!raw) return void 0;
+  const keys = Object.keys(raw);
+  if (keys.length === 0) return void 0;
+  let hasLegacy = false;
+  for (const propName of keys) {
+    if (hasLegacy) break;
+    for (const h2 of raw[propName]) {
+      if (typeof h2 === "string") {
+        hasLegacy = true;
+        break;
+      }
+    }
+  }
+  if (!hasLegacy) return raw;
+  const out = {};
+  for (const propName of keys) {
+    out[propName] = raw[propName].map(
+      (h2) => typeof h2 === "string" ? { [h2]: 0 } : h2
+    );
+  }
+  return out;
+};
+
 // src/runtime/parse-property-value.ts
 var parsePropertyValue = (propValue, propType, isFormAssociated) => {
   if (propValue != null && !isComplexType(propValue)) {
@@ -432,6 +457,25 @@ var parsePropertyValue = (propValue, propType, isFormAssociated) => {
   }
   return propValue;
 };
+var getElement = (ref) => {
+  var _a;
+  return (_a = getHostRef(ref)) == null ? void 0 : _a.$hostElement$ ;
+};
+
+// src/runtime/event-emitter.ts
+var createEvent = (ref, name, flags) => {
+  const elm = getElement(ref);
+  return {
+    emit: (detail) => {
+      return emitEvent(elm, name, {
+        bubbles: true,
+        composed: true,
+        cancelable: true,
+        detail
+      });
+    }
+  };
+};
 var emitEvent = (elm, name, opts) => {
   const ev = plt.ce(name, opts);
   elm.dispatchEvent(ev);
@@ -442,7 +486,7 @@ var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRen
     return;
   }
   let isProp = isMemberInElement(elm, memberName);
-  memberName.toLowerCase();
+  let ln = memberName.toLowerCase();
   if (memberName === "class") {
     const classList = elm.classList;
     const oldClasses = parseClassList(oldValue);
@@ -451,7 +495,25 @@ var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRen
       classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
       classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
     }
-  } else if (memberName === "key") ; else if (memberName[0] === "a" && memberName.startsWith("attr:")) {
+  } else if (memberName === "key") ; else if ((!isProp ) && memberName[0] === "o" && memberName[1] === "n") {
+    if (memberName[2] === "-") {
+      memberName = memberName.slice(3);
+    } else if (isMemberInElement(win, ln)) {
+      memberName = ln.slice(2);
+    } else {
+      memberName = ln[2] + memberName.slice(3);
+    }
+    if (oldValue || newValue) {
+      const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
+      memberName = memberName.replace(CAPTURE_EVENT_REGEX, "");
+      if (oldValue) {
+        plt.rel(elm, memberName, oldValue, capture);
+      }
+      if (newValue) {
+        plt.ael(elm, memberName, newValue, capture);
+      }
+    }
+  } else if (memberName[0] === "a" && memberName.startsWith("attr:")) {
     const propName = memberName.slice(5);
     let attrName;
     {
@@ -526,6 +588,8 @@ var parseClassList = (value) => {
   }
   return value.split(parseClassListRegex);
 };
+var CAPTURE_EVENT_SUFFIX = "Capture";
+var CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + "$");
 
 // src/runtime/vdom/update-element.ts
 var updateElement = (oldVnode, newVnode, isSvgMode2, isInitialRender) => {
@@ -981,6 +1045,7 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
       `Couldn't find host element for "${cmpMeta.$tagName$}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/stenciljs/core/issues/5457).`
     );
   }
+  const elm = hostRef.$hostElement$ ;
   const oldVal = hostRef.$instanceValues$.get(propName);
   const flags = hostRef.$flags$;
   const instance = hostRef.$lazyInstance$ ;
@@ -991,6 +1056,27 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
   const didValueChange = newVal !== oldVal && !areBothNaN;
   if ((!(flags & 8 /* isConstructingInstance */) || oldVal === void 0) && didValueChange) {
     hostRef.$instanceValues$.set(propName, newVal);
+    if (cmpMeta.$watchers$) {
+      const watchMethods = cmpMeta.$watchers$[propName];
+      if (watchMethods) {
+        watchMethods.map((watcher) => {
+          try {
+            const [[watchMethodName, watcherFlags]] = Object.entries(watcher);
+            if (flags & 128 /* isWatchReady */ || watcherFlags & 1 /* Immediate */) {
+              if (!instance) {
+                hostRef.$fetchedCbList$.push(() => {
+                  hostRef.$lazyInstance$[watchMethodName](newVal, oldVal, propName);
+                });
+              } else {
+                instance[watchMethodName](newVal, oldVal, propName);
+              }
+            }
+          } catch (e) {
+            consoleError(e, elm);
+          }
+        });
+      }
+    }
     if (flags & 2 /* hasRendered */) {
       if (instance.componentShouldUpdate) {
         const shouldUpdate = instance.componentShouldUpdate(newVal, oldVal, propName);
@@ -1010,6 +1096,17 @@ var proxyComponent = (Cstr, cmpMeta, flags) => {
   var _a, _b;
   const prototype = Cstr.prototype;
   if (cmpMeta.$members$ || BUILD.propChangeCallback) {
+    {
+      if (Cstr.watchers && !cmpMeta.$watchers$) {
+        cmpMeta.$watchers$ = normalizeWatchers(Cstr.watchers);
+      }
+      if (Cstr.deserializers && !cmpMeta.$deserializers$) {
+        cmpMeta.$deserializers$ = Cstr.deserializers;
+      }
+      if (Cstr.serializers && !cmpMeta.$serializers$) {
+        cmpMeta.$serializers$ = Cstr.serializers;
+      }
+    }
     const members = Object.entries((_a = cmpMeta.$members$) != null ? _a : {});
     members.map(([memberName, [memberFlags]]) => {
       if ((memberFlags & 31 /* Prop */ || (flags & 2 /* proxyState */) && memberFlags & 32 /* State */)) {
@@ -1162,6 +1259,11 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
           throw new Error(`Constructor for "${cmpMeta.$tagName$}#${hostRef.$modeName$}" was not found`);
         }
         if (!Cstr.isProxied) {
+          {
+            cmpMeta.$watchers$ = normalizeWatchers(Cstr.watchers);
+            cmpMeta.$serializers$ = Cstr.serializers;
+            cmpMeta.$deserializers$ = Cstr.deserializers;
+          }
           proxyComponent(Cstr, cmpMeta, 2 /* proxyState */);
           Cstr.isProxied = true;
         }
@@ -1177,6 +1279,9 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
         {
           hostRef.$flags$ &= -9 /* isConstructingInstance */;
         }
+        {
+          hostRef.$flags$ |= 128 /* isWatchReady */;
+        }
         endNewInstance();
         {
           fireConnectedCallback(hostRef.$lazyInstance$, elm);
@@ -1308,6 +1413,7 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
   plt.$resourcesUrl$ = new URL(options.resourcesUrl || "./", win.document.baseURI).href;
   lazyBundles.map((lazyBundle) => {
     lazyBundle[1].map((compactMeta) => {
+      var _a2, _b;
       const cmpMeta = {
         $flags$: compactMeta[0],
         $tagName$: compactMeta[1],
@@ -1317,6 +1423,11 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
       {
         cmpMeta.$members$ = compactMeta[2];
       }
+      {
+        cmpMeta.$watchers$ = normalizeWatchers(compactMeta[4]);
+        cmpMeta.$serializers$ = (_a2 = compactMeta[5]) != null ? _a2 : {};
+        cmpMeta.$deserializers$ = (_b = compactMeta[6]) != null ? _b : {};
+      }
       const tagName = transformTag(cmpMeta.$tagName$);
       const HostElement = class extends HTMLElement {
         ["s-p"];
@@ -1421,4 +1532,4 @@ function transformTag(tag) {
   return tag;
 }
 
-export { bootstrapLazy as b, h, promiseResolve as p, registerInstance as r, setNonce as s };
+export { bootstrapLazy as b, createEvent as c, h, promiseResolve as p, registerInstance as r, setNonce as s };

package/dist/esm/loader.js

@@ -1,11 +1,11 @@
-import { b as bootstrapLazy } from './index-Bdf40fwG.js';
-export { s as setNonce } from './index-Bdf40fwG.js';
+import { b as bootstrapLazy } from './index-Bvqd98ac.js';
+export { s as setNonce } from './index-Bvqd98ac.js';
 import { g as globalScripts } from './app-globals-DQuL1Twl.js';
 
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await globalScripts();
-  return bootstrapLazy([["my-badge",[[769,"my-badge",{"color":[1],"size":[1],"pill":[4]}]]],["my-button",[[769,"my-button",{"variant":[1],"size":[1],"disabled":[4]}]]],["my-card",[[769,"my-card",{"cardTitle":[1,"card-title"],"subtitle":[1],"elevation":[1]}]]],["my-component",[[513,"my-component",{"first":[1],"middle":[1],"last":[1]}]]]], options);
+  return bootstrapLazy([["my-alert",[[769,"my-alert",{"type":[1],"alertTitle":[1,"alert-title"],"dismissible":[4],"dismissed":[32]}]]],["my-badge",[[769,"my-badge",{"color":[1],"size":[1],"pill":[4]}]]],["my-button",[[769,"my-button",{"variant":[1],"size":[1],"disabled":[4]}]]],["my-card",[[769,"my-card",{"cardTitle":[1,"card-title"],"subtitle":[1],"elevation":[1]}]]],["my-component",[[513,"my-component",{"first":[1],"middle":[1],"last":[1]}]]],["my-dropdown",[[513,"my-dropdown",{"options":[1],"value":[1],"placeholder":[1],"label":[1],"disabled":[4],"error":[1],"isOpen":[32]}]]],["my-input",[[513,"my-input",{"label":[1],"placeholder":[1],"value":[1],"type":[1],"error":[1],"disabled":[4],"required":[4]}]]],["my-modal",[[769,"my-modal",{"open":[1028],"modalTitle":[1,"modal-title"],"size":[1]},null,{"open":[{"handleOpenChange":0}]}]]]], options);
 };
 
 export { defineCustomElements };

package/dist/esm/my-alert.entry.js

@@ -0,0 +1,33 @@
+import { r as registerInstance, c as createEvent, h } from './index-Bvqd98ac.js';
+
+const myAlertCss = () => `:host{display:block}.alert{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:8px;border-left:4px solid;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;font-size:14px;line-height:1.5}.alert-icon{font-size:16px;font-weight:700;flex-shrink:0;margin-top:1px}.alert-content{flex:1;display:flex;flex-direction:column;gap:2px}.alert-title{font-size:14px;font-weight:700}.alert-message{opacity:0.9}.alert-dismiss{background:none;border:none;font-size:14px;cursor:pointer;padding:0 4px;border-radius:4px;opacity:0.6;transition:opacity 0.15s;flex-shrink:0;line-height:1}.alert-dismiss:hover{opacity:1}.alert--success{background:#f0fdf4;border-color:#10b981;color:#065f46}.alert--success .alert-icon{color:#10b981}.alert--warning{background:#fffbeb;border-color:#f59e0b;color:#78350f}.alert--warning .alert-icon{color:#f59e0b}.alert--error{background:#fef2f2;border-color:#ef4444;color:#7f1d1d}.alert--error .alert-icon{color:#ef4444}.alert--info{background:#eff6ff;border-color:#3b82f6;color:#1e3a8a}.alert--info .alert-icon{color:#3b82f6}`;
+
+const MyAlert = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.myDismiss = createEvent(this, "myDismiss");
+    }
+    type = 'info';
+    alertTitle = '';
+    dismissible = false;
+    dismissed = false;
+    myDismiss;
+    icons = {
+        success: '✓',
+        warning: '⚠',
+        error: '✕',
+        info: 'ℹ',
+    };
+    dismiss() {
+        this.dismissed = true;
+        this.myDismiss.emit();
+    }
+    render() {
+        if (this.dismissed)
+            return null;
+        return (h("div", { class: `alert alert--${this.type}`, role: "alert" }, h("span", { class: "alert-icon" }, this.icons[this.type]), h("div", { class: "alert-content" }, this.alertTitle && h("strong", { class: "alert-title" }, this.alertTitle), h("span", { class: "alert-message" }, h("slot", null))), this.dismissible && (h("button", { class: "alert-dismiss", onClick: () => this.dismiss() }, "\u2715"))));
+    }
+};
+MyAlert.style = myAlertCss();
+
+export { MyAlert as my_alert };