le-kit 0.5.2 → 0.5.4

package/dist/collection/components/le-button/le-button.js

@@ -1,460 +0,0 @@
-import { h, Fragment, Host } from "@stencil/core";
-import { classnames } from "../../utils/utils";
-/**
- * A flexible button component with multiple variants and states.
- *
- * @slot - Button text content
- * @slot icon-only - Icon for icon-only buttons
- *
- * @cssprop --le-button-bg - Button background color
- * @cssprop --le-button-color - Button text color
- * @cssprop --le-button-border-radius - Button border radius
- * @cssprop --le-button-padding-x - Button horizontal padding
- * @cssprop --le-button-padding-y - Button vertical padding
- *
- * @csspart button - The native button element
- * @csspart content - The button content wrapper
- * @csspart icon-start - The start icon slot
- * @csspart icon-end - The end icon slot
- *
- * @cmsEditable true
- * @cmsCategory Actions
- */
-export class LeButton {
-    el;
-    /**
-     * Mode of the popover should be 'default' for internal use
-     */
-    mode;
-    /**
-     * Button variant style
-     * @allowedValues solid | outlined | clear
-     */
-    variant = 'solid';
-    /**
-     * Button color theme (uses theme semantic colors)
-     * @allowedValues primary | secondary | success | warning | danger | info
-     */
-    color = 'primary';
-    /**
-     * Button size
-     * @allowedValues small | medium | large
-     */
-    size = 'medium';
-    /**
-     * Whether the button is in a selected/active state
-     */
-    selected = false;
-    /**
-     * Whether the button takes full width of its container
-     */
-    fullWidth = false;
-    /**
-     * Icon only button image or emoji
-     * if this prop is set, the button will render only the icon slot
-     */
-    iconOnly;
-    /**
-     * Start icon image or emoji
-     */
-    iconStart;
-    /**
-     * End icon image or emoji
-     */
-    iconEnd;
-    /**
-     * Whether the button is disabled
-     */
-    disabled = false;
-    /**
-     * The button type attribute
-     * @allowedValues button | submit | reset
-     */
-    type = 'button';
-    /**
-     * Optional href to make the button act as a link
-     */
-    href;
-    /**
-     * Link target when href is set
-     */
-    target;
-    /**
-     * Alignment of the button label without the end icon
-     * @allowedValues start | center | space-between | end
-     */
-    align = 'center';
-    /**
-     * Emitted when the button is clicked.
-     * This is a custom event that wraps the native click but ensures the target is the le-button.
-     */
-    leClick;
-    handleClick = (event) => {
-        // We stop the internal button click from bubbling up
-        event.stopPropagation();
-        if (this.disabled) {
-            event.preventDefault();
-            return;
-        }
-        // And emit our own click event from the host element
-        this.leClick.emit(event);
-    };
-    render() {
-        const classes = classnames(`variant-${this.variant}`, `color-${this.color}`, `size-${this.size}`, {
-            'selected': this.selected,
-            'full-width': this.fullWidth,
-            'icon-only': this.iconOnly,
-            'disabled': this.disabled,
-        });
-        const TagType = this.href ? 'a' : 'button';
-        const attrs = this.href
-            ? { href: this.href, target: this.target, role: 'button' }
-            : { type: this.type, disabled: this.disabled };
-        return (h(Host, { key: 'a42aef03b5faf34f47b50dff799316a6815babd5', class: classes }, h("le-component", { key: '86ef8acf04d43e829b83d3e225f210acefc99515', component: "le-button" }, h(TagType, { key: '44145a5244577aab167c103501b788f0088799e3', class: classnames('le-button-container', `le-button-align-${this.align}`), part: "button", ...attrs, onClick: this.handleClick }, this.iconOnly !== undefined ? (h("slot", { name: "icon-only" }, typeof this.iconOnly === 'string' ? this.iconOnly : null)) : (h(Fragment, null, h("span", { class: "le-button-label" }, this.iconStart && (h("span", { class: "icon-start", part: "icon-start" }, this.iconStart)), h("le-slot", { name: "", description: "Button text", type: "text", class: "content", part: "content" }, h("slot", null))), this.iconEnd && (h("span", { class: "icon-end", part: "icon-end" }, this.iconEnd))))))));
-    }
-    static get is() { return "le-button"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["le-button.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["le-button.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "mode": {
-                "type": "string",
-                "mutable": true,
-                "complexType": {
-                    "original": "'default' | 'admin'",
-                    "resolved": "\"admin\" | \"default\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Mode of the popover should be 'default' for internal use"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "mode"
-            },
-            "variant": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'solid' | 'outlined' | 'clear' | 'system'",
-                    "resolved": "\"clear\" | \"outlined\" | \"solid\" | \"system\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "allowedValues",
-                            "text": "solid | outlined | clear"
-                        }],
-                    "text": "Button variant style"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "variant",
-                "defaultValue": "'solid'"
-            },
-            "color": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info'",
-                    "resolved": "\"danger\" | \"info\" | \"primary\" | \"secondary\" | \"success\" | \"warning\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "allowedValues",
-                            "text": "primary | secondary | success | warning | danger | info"
-                        }],
-                    "text": "Button color theme (uses theme semantic colors)"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "color",
-                "defaultValue": "'primary'"
-            },
-            "size": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'small' | 'medium' | 'large'",
-                    "resolved": "\"large\" | \"medium\" | \"small\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "allowedValues",
-                            "text": "small | medium | large"
-                        }],
-                    "text": "Button size"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "size",
-                "defaultValue": "'medium'"
-            },
-            "selected": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Whether the button is in a selected/active state"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "selected",
-                "defaultValue": "false"
-            },
-            "fullWidth": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Whether the button takes full width of its container"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "full-width",
-                "defaultValue": "false"
-            },
-            "iconOnly": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string | Node",
-                    "resolved": "Node | string",
-                    "references": {
-                        "Node": {
-                            "location": "global",
-                            "id": "global::Node"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Icon only button image or emoji\nif this prop is set, the button will render only the icon slot"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "icon-only"
-            },
-            "iconStart": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string | Node",
-                    "resolved": "Node | string",
-                    "references": {
-                        "Node": {
-                            "location": "global",
-                            "id": "global::Node"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Start icon image or emoji"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "icon-start"
-            },
-            "iconEnd": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string | Node",
-                    "resolved": "Node | string",
-                    "references": {
-                        "Node": {
-                            "location": "global",
-                            "id": "global::Node"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "End icon image or emoji"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "icon-end"
-            },
-            "disabled": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Whether the button is disabled"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "disabled",
-                "defaultValue": "false"
-            },
-            "type": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'button' | 'submit' | 'reset'",
-                    "resolved": "\"button\" | \"reset\" | \"submit\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "allowedValues",
-                            "text": "button | submit | reset"
-                        }],
-                    "text": "The button type attribute"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "type",
-                "defaultValue": "'button'"
-            },
-            "href": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Optional href to make the button act as a link"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "href"
-            },
-            "target": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Link target when href is set"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "target"
-            },
-            "align": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'start' | 'center' | 'space-between' | 'end'",
-                    "resolved": "\"center\" | \"end\" | \"space-between\" | \"start\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "allowedValues",
-                            "text": "start | center | space-between | end"
-                        }],
-                    "text": "Alignment of the button label without the end icon"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "align",
-                "defaultValue": "'center'"
-            }
-        };
-    }
-    static get events() {
-        return [{
-                "method": "leClick",
-                "name": "click",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emitted when the button is clicked.\nThis is a custom event that wraps the native click but ensures the target is the le-button."
-                },
-                "complexType": {
-                    "original": "MouseEvent",
-                    "resolved": "MouseEvent",
-                    "references": {
-                        "MouseEvent": {
-                            "location": "global",
-                            "id": "global::MouseEvent"
-                        }
-                    }
-                }
-            }];
-    }
-    static get elementRef() { return "el"; }
-}
-//# sourceMappingURL=le-button.js.map

package/dist/collection/components/le-button/le-button.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"le-button.js","sourceRoot":"","sources":["../../../src/components/le-button/le-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, Element, Fragment, Event, EventEmitter, Host } from '@stencil/core';\nimport { classnames } from '../../utils/utils';\n\n/**\n * A flexible button component with multiple variants and states.\n *\n * @slot - Button text content\n * @slot icon-only - Icon for icon-only buttons\n *\n * @cssprop --le-button-bg - Button background color\n * @cssprop --le-button-color - Button text color\n * @cssprop --le-button-border-radius - Button border radius\n * @cssprop --le-button-padding-x - Button horizontal padding\n * @cssprop --le-button-padding-y - Button vertical padding\n *\n * @csspart button - The native button element\n * @csspart content - The button content wrapper\n * @csspart icon-start - The start icon slot\n * @csspart icon-end - The end icon slot\n *\n * @cmsEditable true\n * @cmsCategory Actions\n */\n@Component({\n  tag: 'le-button',\n  styleUrl: 'le-button.css',\n  shadow: true,\n})\nexport class LeButton {\n  @Element() el: HTMLElement;\n\n  /**\n   * Mode of the popover should be 'default' for internal use\n   */\n  @Prop({ mutable: true, reflect: true }) mode: 'default' | 'admin';\n\n  /**\n   * Button variant style\n   * @allowedValues solid | outlined | clear\n   */\n  @Prop() variant: 'solid' | 'outlined' | 'clear' | 'system' = 'solid';\n\n  /**\n   * Button color theme (uses theme semantic colors)\n   * @allowedValues primary | secondary | success | warning | danger | info\n   */\n  @Prop() color: 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info' = 'primary';\n\n  /**\n   * Button size\n   * @allowedValues small | medium | large\n   */\n  @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * Whether the button is in a selected/active state\n   */\n  @Prop() selected: boolean = false;\n\n  /**\n   * Whether the button takes full width of its container\n   */\n  @Prop({ reflect: true }) fullWidth: boolean = false;\n\n  /**\n   * Icon only button image or emoji\n   * if this prop is set, the button will render only the icon slot\n   */\n  @Prop() iconOnly?: string | Node;\n\n  /**\n   * Start icon image or emoji\n   */\n  @Prop() iconStart?: string | Node;\n\n  /**\n   * End icon image or emoji\n   */\n  @Prop() iconEnd?: string | Node;\n\n  /**\n   * Whether the button is disabled\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * The button type attribute\n   * @allowedValues button | submit | reset\n   */\n  @Prop() type: 'button' | 'submit' | 'reset' = 'button';\n\n  /**\n   * Optional href to make the button act as a link\n   */\n  @Prop() href?: string;\n\n  /**\n   * Link target when href is set\n   */\n  @Prop() target?: string;\n\n  /**\n   * Alignment of the button label without the end icon\n   * @allowedValues start | center | space-between | end\n   */\n  @Prop() align: 'start' | 'center' | 'space-between' | 'end' = 'center';\n\n  /**\n   * Emitted when the button is clicked.\n   * This is a custom event that wraps the native click but ensures the target is the le-button.\n   */\n  @Event({ eventName: 'click' }) leClick: EventEmitter<MouseEvent>;\n\n  private handleClick = (event: MouseEvent) => {\n    // We stop the internal button click from bubbling up\n    event.stopPropagation();\n\n    if (this.disabled) {\n      event.preventDefault();\n      return;\n    }\n\n    // And emit our own click event from the host element\n    this.leClick.emit(event);\n  };\n\n  render() {\n    const classes = classnames(\n      `variant-${this.variant}`,\n      `color-${this.color}`,\n      `size-${this.size}`,\n      {\n        'selected': this.selected,\n        'full-width': this.fullWidth,\n        'icon-only': this.iconOnly,\n        'disabled': this.disabled,\n      },\n    );\n\n    const TagType = this.href ? 'a' : 'button';\n    const attrs = this.href\n      ? { href: this.href, target: this.target, role: 'button' }\n      : { type: this.type, disabled: this.disabled };\n\n    return (\n      <Host class={classes}>\n        <le-component component=\"le-button\">\n          <TagType\n            class={classnames('le-button-container', `le-button-align-${this.align}`)}\n            part=\"button\"\n            {...attrs}\n            onClick={this.handleClick}\n          >\n            {this.iconOnly !== undefined ? (\n              <slot name=\"icon-only\">\n                {typeof this.iconOnly === 'string' ? this.iconOnly : null}\n              </slot>\n            ) : (\n              <Fragment>\n                <span class=\"le-button-label\">\n                  {this.iconStart && (\n                    <span class=\"icon-start\" part=\"icon-start\">\n                      {this.iconStart}\n                    </span>\n                  )}\n                  <le-slot\n                    name=\"\"\n                    description=\"Button text\"\n                    type=\"text\"\n                    class=\"content\"\n                    part=\"content\"\n                  >\n                    <slot></slot>\n                  </le-slot>\n                </span>\n                {this.iconEnd && (\n                  <span class=\"icon-end\" part=\"icon-end\">\n                    {this.iconEnd}\n                  </span>\n                )}\n              </Fragment>\n            )}\n          </TagType>\n        </le-component>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/le-card/le-card.css

@@ -1,74 +0,0 @@
-/**
- * Default mode styles for le-card
- * Uses global design tokens with component-specific overrides
- */
-:host {
-  display: block;
-  
-  /* Component-specific tokens that map to global tokens */
-  --le-card-bg: var(--le-color-surface);
-  --le-card-border-radius: var(--le-radius-lg);
-  --le-card-shadow: var(--le-shadow-md);
-  --le-card-shadow-elevated: var(--le-shadow-lg);
-  --le-card-shadow-hover: var(--le-shadow-xl);
-  --le-card-padding: var(--le-space-md);
-  --le-card-border-color: var(--le-color-border);
-  --le-card-transition: var(--le-transition-normal);
-}
-
-.card {
-  background: var(--le-card-bg);
-  border-radius: var(--le-card-border-radius);
-  overflow: hidden;
-  color: var(--le-color-text);
-  box-shadow: var(--le-card-shadow);
-}
-
-/* Variants - le-component gets the hostClass, so we use :host > le-component */
-:host > le-component.variant-outlined .card {
-  border: 1px solid var(--le-card-border-color);
-  box-shadow: none;
-}
-
-:host > le-component.variant-elevated .card {
-  box-shadow: var(--le-card-shadow-elevated);
-}
-
-/* Interactive state */
-:host > le-component.interactive .card {
-  cursor: pointer;
-  transition: transform var(--le-card-transition), box-shadow var(--le-card-transition);
-}
-
-:host > le-component.interactive .card:hover {
-  transform: translateY(-2px);
-  box-shadow: var(--le-card-shadow-hover);
-}
-
-:host > le-component.interactive .card:focus-visible {
-  outline: 2px solid var(--le-color-border-focus);
-  outline-offset: 2px;
-}
-
-/* Sections */
-.card-header {
-  padding: var(--le-card-padding);
-  padding-bottom: 0;
-}
-
-.card-header:empty {
-  display: none;
-}
-
-.card-content {
-  padding: var(--le-card-padding);
-}
-
-.card-footer {
-  padding: var(--le-card-padding);
-  padding-top: 0;
-}
-
-.card-footer:empty {
-  display: none;
-}

package/dist/collection/components/le-card/le-card.js

@@ -1,102 +0,0 @@
-import { h } from "@stencil/core";
-import { classnames } from "../../utils/utils";
-/**
- * A flexible card component with header, content, and footer slots.
- *
- * The card uses le-slot wrappers for each slot area. In admin mode,
- * le-slot shows placeholders for CMS editing. In default mode,
- * le-slot acts as a transparent passthrough.
- *
- * @slot header - Card header content (title, actions)
- * @slot - Default slot for main card content
- * @slot footer - Card footer content (buttons, links)
- *
- * @cssprop --le-card-bg - Card background color
- * @cssprop --le-card-border-radius - Card border radius
- * @cssprop --le-card-shadow - Card box shadow
- * @cssprop --le-card-padding - Card content padding
- *
- * @csspart card - The main card container
- * @csspart header - The card header section
- * @csspart content - The card content section
- * @csspart footer - The card footer section
- *
- * @cmsEditable true
- * @cmsCategory Layout
- */
-export class LeCard {
-    el;
-    /**
-     * Card variant style
-     * @allowedValues default | outlined | elevated
-     */
-    variant = 'default';
-    /**
-     * Whether the card is interactive (clickable)
-     */
-    interactive = false;
-    render() {
-        return (h("le-component", { key: 'b4203e8775f711c1ce4d8b9a4270815f122271f2', component: "le-card", hostClass: classnames(`variant-${this.variant}`, { 'interactive': this.interactive }) }, h("div", { key: '0dc9231529fc6d2eb29bc5cde2c1dbf18b332a43', class: "card", part: "card" }, h("div", { key: '511fcec73b51b0931d92e0fee4d17b108c827e74', class: "card-header", part: "header" }, h("le-slot", { key: 'e50dbadbe53ce6fa343ac7cfccb5a5d8f58fbd01', name: "header", label: "Header", description: "Card title", type: "text", tag: "h3" }, h("slot", { key: '36e1f7c3c5c1c5a9d49261d1b1406efe4004389b', name: "header" }))), h("div", { key: 'f9da55c0661d7906161b77aa22edc1c6bb7fb8d4', class: "card-content", part: "content" }, h("le-slot", { key: '01670058d67851f1bd70b21fc4111b4bf2509f25', name: "", label: "Content", description: "Card content", type: "textarea", tag: "p", required: true }, h("slot", { key: 'e6eff48970eca2b3971f0ea7bfda3ca12bd1a3a1' }))), h("div", { key: 'ccd29257bc339a0d26c4750823fc635a182123cc', class: "card-footer", part: "footer" }, h("le-slot", { key: '198499afcbb9b0e82cac6cf976ab407697263c1f', name: "footer", label: "Footer", description: "Card footer with actions", "allowed-components": "le-button,le-link" }, h("slot", { key: '4d495b49f48ac142cdf739472b48d4bfb37933af', name: "footer" }))))));
-    }
-    static get is() { return "le-card"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["le-card.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["le-card.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "variant": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'default' | 'outlined' | 'elevated'",
-                    "resolved": "\"default\" | \"elevated\" | \"outlined\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "allowedValues",
-                            "text": "default | outlined | elevated"
-                        }],
-                    "text": "Card variant style"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "variant",
-                "defaultValue": "'default'"
-            },
-            "interactive": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Whether the card is interactive (clickable)"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "interactive",
-                "defaultValue": "false"
-            }
-        };
-    }
-    static get elementRef() { return "el"; }
-}
-//# sourceMappingURL=le-card.js.map

package/dist/collection/components/le-card/le-card.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"le-card.js","sourceRoot":"","sources":["../../../src/components/le-card/le-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/C;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAMH,MAAM,OAAO,MAAM;IACN,EAAE,CAAc;IAE3B;;;OAGG;IACK,OAAO,GAAwC,SAAS,CAAC;IAEjE;;OAEG;IACK,WAAW,GAAY,KAAK,CAAC;IAErC,MAAM;QACJ,OAAO,CACL,qEAAc,SAAS,EAAC,SAAS,EAAC,SAAS,EAAE,UAAU,CAAC,WAAW,IAAI,CAAC,OAAO,EAAE,EAAE,EAAE,aAAa,EAAE,IAAI,CAAC,WAAW,EAAE,CAAC;YACrH,4DAAK,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM;gBAC3B,4DAAK,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,QAAQ;oBACpC,gEAAS,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,QAAQ,EAAC,WAAW,EAAC,YAAY,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAC,IAAI;wBACjF,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACnB,CACN;gBAEN,4DAAK,KAAK,EAAC,cAAc,EAAC,IAAI,EAAC,SAAS;oBACtC,gEAAS,IAAI,EAAC,EAAE,EAAC,KAAK,EAAC,SAAS,EAAC,WAAW,EAAC,cAAc,EAAC,IAAI,EAAC,UAAU,EAAC,GAAG,EAAC,GAAG,EAAC,QAAQ;wBAC1F,8DAAa,CACL,CACN;gBAEN,4DAAK,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,QAAQ;oBACpC,gEAAS,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,QAAQ,EAAC,WAAW,EAAC,0BAA0B,wBAAoB,mBAAmB;wBACjH,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACnB,CACN,CACF,CACO,CAChB,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Element } from '@stencil/core';\nimport { classnames } from '../../utils/utils';\n\n/**\n * A flexible card component with header, content, and footer slots.\n *\n * The card uses le-slot wrappers for each slot area. In admin mode,\n * le-slot shows placeholders for CMS editing. In default mode,\n * le-slot acts as a transparent passthrough.\n *\n * @slot header - Card header content (title, actions)\n * @slot - Default slot for main card content\n * @slot footer - Card footer content (buttons, links)\n *\n * @cssprop --le-card-bg - Card background color\n * @cssprop --le-card-border-radius - Card border radius\n * @cssprop --le-card-shadow - Card box shadow\n * @cssprop --le-card-padding - Card content padding\n *\n * @csspart card - The main card container\n * @csspart header - The card header section\n * @csspart content - The card content section\n * @csspart footer - The card footer section\n *\n * @cmsEditable true\n * @cmsCategory Layout\n */\n@Component({\n  tag: 'le-card',\n  styleUrl: 'le-card.css',\n  shadow: true,\n})\nexport class LeCard {\n  @Element() el: HTMLElement;\n\n  /**\n   * Card variant style\n   * @allowedValues default | outlined | elevated\n   */\n  @Prop() variant: 'default' | 'outlined' | 'elevated' = 'default';\n\n  /**\n   * Whether the card is interactive (clickable)\n   */\n  @Prop() interactive: boolean = false;\n\n  render() {\n    return (\n      <le-component component=\"le-card\" hostClass={classnames(`variant-${this.variant}`, { 'interactive': this.interactive })}>\n        <div class=\"card\" part=\"card\">\n          <div class=\"card-header\" part=\"header\">\n            <le-slot name=\"header\" label=\"Header\" description=\"Card title\" type=\"text\" tag=\"h3\">\n              <slot name=\"header\"></slot>\n            </le-slot>\n          </div>\n\n          <div class=\"card-content\" part=\"content\">\n            <le-slot name=\"\" label=\"Content\" description=\"Card content\" type=\"textarea\" tag=\"p\" required>\n              <slot></slot>\n            </le-slot>\n          </div>\n\n          <div class=\"card-footer\" part=\"footer\">\n            <le-slot name=\"footer\" label=\"Footer\" description=\"Card footer with actions\" allowed-components=\"le-button,le-link\">\n              <slot name=\"footer\"></slot>\n            </le-slot>\n          </div>\n        </div>\n      </le-component>\n    );\n  }\n}\n"]}