@charde/core 0.0.3 → 0.0.5

package/dist/collection/components/generated/chardes-modal-form.js

@@ -0,0 +1,68 @@
+import { h } from "@stencil/core";
+/**
+ * Modal Form
+ * Auto-generated from Charisol Design System
+ */
+export class ModalForm {
+    customClass;
+    customStyle;
+    render() {
+        const cls = ["mt-6 space-y-4", this.customClass].filter(Boolean).join(' ');
+        const sty = this.customStyle || undefined;
+        return (h("div", { key: '211e390b781ccb91034de9c90cda9aac3e760547', class: cls, style: sty }, h("div", { key: '314603149d380dfb77c9f8b179373348c10fa686' }, h("label", { key: 'a6ec99a8bb68a5076ff6f64266b8efb309309561', class: "block text-sm font-medium text-gray-700 mb-2", htmlFor: "modal-email" }, "Email Address"), h("input", { key: '6d2e04f38abc415098c00a580148ef5c4a3494ef', class: "w-full px-3 py-2 border border-gray-300 rounded-md transition-colors focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent placeholder-gray-400", type: "email", placeholder: "you@example.com", id: "modal-email" }))));
+    }
+    static get is() { return "chardes-modal-form"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["chardes-modal-form.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["chardes-modal-form.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "customClass": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-class"
+            },
+            "customStyle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-style"
+            }
+        };
+    }
+}

package/dist/collection/components/generated/chardes-modal-header.css

@@ -0,0 +1 @@
+/* Styles from global utilities.css */

package/dist/collection/components/generated/chardes-modal-header.js

@@ -0,0 +1,68 @@
+import { h } from "@stencil/core";
+/**
+ * Modal Header
+ * Auto-generated from Charisol Design System
+ */
+export class ModalHeader {
+    customClass;
+    customStyle;
+    render() {
+        const cls = ["p-6 border-b border-gray-200 flex justify-between items-center", this.customClass].filter(Boolean).join(' ');
+        const sty = this.customStyle || undefined;
+        return (h("div", { key: '7ee31970fb826be3f635e6d2c1f6f670df04b303', class: cls, style: sty }, h("h3", { key: 'ac2fbd682b1f243c323df718fdae2b97d1853019', class: "text-xl font-semibold text-gray-900" }, "Modal Title"), h("button", { key: '086e7afb3e50ab4b3d4e67c370772d04e7b74e84', class: "p-2 rounded-full transition-colors hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2", type: "button", "aria-label": "Close modal" }, h("span", { key: '6c08371bf6c7619e055b6984f756f2d905a07d1b', innerHTML: `<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" /></svg>` }))));
+    }
+    static get is() { return "chardes-modal-header"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["chardes-modal-header.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["chardes-modal-header.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "customClass": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-class"
+            },
+            "customStyle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-style"
+            }
+        };
+    }
+}

package/dist/collection/components/generated/chardes-modal-title.css

@@ -0,0 +1 @@
+/* Styles from global utilities.css */

package/dist/collection/components/generated/chardes-modal-title.js

@@ -0,0 +1,88 @@
+import { h } from "@stencil/core";
+/**
+ * Modal Title
+ * Auto-generated from Charisol Design System
+ */
+export class ModalTitle {
+    customClass;
+    customStyle;
+    text;
+    render() {
+        const cls = ["text-xl font-semibold text-gray-900", this.customClass].filter(Boolean).join(' ');
+        const sty = this.customStyle || undefined;
+        return (h("h3", { key: '393ac73a261c706e5e425434928f8e8a4646501a', class: cls, style: sty }, this.text || "Modal Title"));
+    }
+    static get is() { return "chardes-modal-title"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["chardes-modal-title.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["chardes-modal-title.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "customClass": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-class"
+            },
+            "customStyle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-style"
+            },
+            "text": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "text"
+            }
+        };
+    }
+}

package/dist/collection/components/generated/chardes-modal.css

@@ -0,0 +1 @@
+/* Styles from global utilities.css */

package/dist/collection/components/generated/chardes-modal.js

@@ -0,0 +1,68 @@
+import { h } from "@stencil/core";
+/**
+ * Modal
+ * Auto-generated from Charisol Design System
+ */
+export class Modal {
+    customClass;
+    customStyle;
+    render() {
+        const cls = ["fixed inset-0 flex items-center justify-center bg-black/50 z-50 backdrop-blur-sm p-4", this.customClass].filter(Boolean).join(' ');
+        const sty = this.customStyle || undefined;
+        return (h("div", { key: 'c6ec780c57ef668f3c4cd192c62f8f56378b84ca', class: cls, style: sty }, h("div", { key: '31798a15b6a0ff48b7583529401b65e22b472c56', class: "w-full max-w-md bg-white rounded-2xl shadow-lg overflow-hidden animate-in fade-in zoom-in-95 duration-300" }, h("div", { key: '634e58084b2ce2db0ae9901e7dfb91cee91a4946', class: "p-6 border-b border-gray-200 flex justify-between items-center" }, h("h3", { key: '53027aa6e760529e8532abd0edc563d93d5fdbb8', class: "text-xl font-semibold text-gray-900" }, "Modal Title"), h("button", { key: '466280cee1a8ae9487f97848656b6b5627c890d6', class: "p-2 rounded-full transition-colors hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2", type: "button", "aria-label": "Close modal" }, h("span", { key: '24de8c4a4146b47d3c9db09d220f504db36e84d9', innerHTML: `<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" /></svg>` }))), h("div", { key: 'd56c724a8c1f7ed59d25912b833fc53dae9b0eba', class: "p-6" }, h("p", { key: '19c12ec4f7c49ee4ebd1029b3af5ac531ea3df72', class: "text-gray-700 leading-relaxed" }, "This is a beautiful modal component with interactive elements. You can click the close button, interact with form elements, and see hover effects in action."), h("div", { key: '79024cce831b0d09814ce34dfcc92ebd7d6b465c', class: "mt-6 space-y-4" }, h("div", { key: '308d4fd2086f50c102d063483f03c45de025f1ff' }, h("label", { key: '2571475fb040c1943b15f8285f24b6e602046043', class: "block text-sm font-medium text-gray-700 mb-2", htmlFor: "modal-email" }, "Email Address"), h("input", { key: 'd8b331995624d8bb83799da3363617e3828486d1', class: "w-full px-3 py-2 border border-gray-300 rounded-md transition-colors focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent placeholder-gray-400", type: "email", placeholder: "you@example.com", id: "modal-email" })))), h("div", { key: '1f471afdbc90055e7703626f64cd2d193f1ce436', class: "p-6 border-t border-gray-200 flex justify-between space-x-3" }, h("button", { key: 'bea815e33e02410e64bfad05934dbdb774969285', class: "px-4 py-2 border border-gray-300 rounded-md text-gray-700 font-medium transition-colors hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2", type: "button" }, "Cancel"), h("button", { key: 'b790f799b8504e893cb4927c8b75aabc4d2bd11c', class: "px-4 py-2 bg-blue-600 text-white rounded-md font-medium transition-colors hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2", type: "button" }, "Confirm")))));
+    }
+    static get is() { return "chardes-modal"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["chardes-modal.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["chardes-modal.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "customClass": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-class"
+            },
+            "customStyle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-style"
+            }
+        };
+    }
+}

package/dist/collection/components/generated/chardes-muzingo-primary-button.css

@@ -0,0 +1 @@
+/* Styles from global utilities.css */

package/dist/collection/components/generated/chardes-muzingo-primary-button.js

@@ -0,0 +1,68 @@
+import { h } from "@stencil/core";
+/**
+ * Muzing Tertiary Button
+ * Auto-generated from Charisol Design System
+ */
+export class MuzingoPrimaryButton {
+    customClass;
+    customStyle;
+    render() {
+        const cls = ["", this.customClass].filter(Boolean).join(' ');
+        const sty = this.customStyle || undefined;
+        return (h("div", { key: '78be5fa170b57926c83663d2aad38ef3fc6883d6', class: cls, style: sty }));
+    }
+    static get is() { return "chardes-muzingo-primary-button"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["chardes-muzingo-primary-button.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["chardes-muzingo-primary-button.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "customClass": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-class"
+            },
+            "customStyle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-style"
+            }
+        };
+    }
+}

package/dist/collection/components/generated/chardes-muzingo.css

@@ -0,0 +1 @@
+/* Styles from global utilities.css */

package/dist/collection/components/generated/chardes-muzingo.js

@@ -0,0 +1,148 @@
+import { h } from "@stencil/core";
+/**
+ * Muzingo Button
+ * Auto-generated from Charisol Design System
+ */
+export class Muzingo {
+    customClass;
+    customStyle;
+    type;
+    placeholder;
+    value;
+    inputId;
+    render() {
+        const cls = ["", this.customClass].filter(Boolean).join(' ');
+        const sty = this.customStyle || undefined;
+        return (h("input", { key: '4db2d1b54d60df0983c7218bd101dc5ce727e810', class: cls, type: this.type || "text", id: this.inputId || "", placeholder: this.placeholder || "Enter text here...", value: this.value, style: sty }));
+    }
+    static get is() { return "chardes-muzingo"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["chardes-muzingo.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["chardes-muzingo.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "customClass": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-class"
+            },
+            "customStyle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-style"
+            },
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "type"
+            },
+            "placeholder": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "placeholder"
+            },
+            "value": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "value"
+            },
+            "inputId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "input-id"
+            }
+        };
+    }
+}

package/dist/collection/components/generated/chardes-notification-toast.css

@@ -0,0 +1 @@
+/* Styles from global utilities.css */

package/dist/collection/components/generated/chardes-notification-toast.js

@@ -0,0 +1,68 @@
+import { h } from "@stencil/core";
+/**
+ * Notification Toast
+ * Auto-generated from Charisol Design System
+ */
+export class NotificationToast {
+    customClass;
+    customStyle;
+    render() {
+        const cls = ["fixed top-4 right-4 z-50 w-[350px] bg-white rounded-lg shadow-lg p-4 transition-all duration-300 ease-in-out translate-x-full opacity-0 notification-toast", this.customClass].filter(Boolean).join(' ');
+        const sty = this.customStyle || undefined;
+        return (h("div", { key: '63246616e965b3942fbe33a1a526c68823c14694', class: cls, style: sty }, h("div", { key: '82e0c040128d90a7e4dbcde7819c4081cbbca128', class: "flex items-center justify-between mb-3" }, h("div", { key: '1b5da47c658ce191e8c189f0a4f7875b2338df82', class: "flex items-center space-x-2" }, h("span", { key: '7fa81bba0be9ec918a907f4cf92203a976040706', class: "text-indigo-500 flex-shrink-0", innerHTML: `<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor"><path d="M10 2a6 6 0 00-6 6v3.586l-.707.707A1 1 0 004 14h12a1 1 0 00.707-1.707L16 11.586V8a6 6 0 00-6-6zM10 18a3 3 0 01-3-3h6a3 3 0 01-3 3z" /></svg>` }), h("h3", { key: 'a3e5d99189f0db0cde32b2973c24eaca3d955fa1', class: "text-base font-semibold text-gray-900" }, "New Notification")), h("span", { key: '384a870222cfa5925494ca91ca47497a8f6f670b', class: "text-xs text-gray-500" }, "Just now")), h("p", { key: '7137782af6c8c1ffee5f6d516db6f8a9c38b8a0a', class: "text-sm text-gray-700 leading-relaxed mb-3" }, "You have a new message from John Doe. Check your inbox for more details."), h("div", { key: 'e7abcfef4026e698d332fcf569c2ab906fa63f03', class: "flex justify-between space-x-2" }, h("button", { key: '329c3466e9cf5bc57660fc8ee2f5c79cec0088bb', class: "p-2 text-sm font-medium text-gray-600 bg-transparent border-none rounded-md pointer transition-colors hover:bg-gray-100", type: "button" }, "Dismiss"), h("button", { key: 'fc2ff0a405e4bc4f7a1d3e4eeb55a4266cc308ba', class: "p-2 text-sm font-medium text-white bg-indigo-500 border-none rounded-md pointer transition-colors hover:bg-indigo-600", type: "button" }, "View"))));
+    }
+    static get is() { return "chardes-notification-toast"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["chardes-notification-toast.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["chardes-notification-toast.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "customClass": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-class"
+            },
+            "customStyle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "custom-style"
+            }
+        };
+    }
+}

package/dist/collection/components/generated/chardes-payment-icon.css

@@ -0,0 +1 @@
+/* Styles from global utilities.css */