le-kit 0.1.11 → 0.1.13

package/dist/components/le-number-input.js

@@ -0,0 +1,272 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { h as classnames } from './utils.js';
+import { d as defineCustomElement$2, a as defineCustomElement$3, b as defineCustomElement$5, c as defineCustomElement$6, e as defineCustomElement$7 } from './le-button2.js';
+import { d as defineCustomElement$4 } from './le-popover2.js';
+
+const leNumberInputCss = ":host{display:block;--le-input-bg:var(--le-color-surface, #ffffff);--le-input-color:var(--le-color-text-primary, #333333);--le-input-border:var(--le-border-width, 2px) solid var(--le-color-border-input, #007bff);--le-input-radius:var(--le-radius-sm, 4px);--le-input-padding:2px 6px;--le-input-height:1.5rem;--le-input-label-color:var(--le-color-text-primary, #333333);--le-input-desc-color:var(--le-color-text-secondary, #666666);--le-input-placeholder-color:#999999;--le-input-border-error:2px solid var(--le-color-danger, #dc3545);--le-input-error-color:var(--le-color-danger, #dc3545)}.le-input-wrapper{display:flex;flex-direction:column;gap:2px}.le-input-label{display:block;font-size:0.9em;font-weight:500;color:var(--le-input-label-color);margin-bottom:2px}.le-input-container{position:relative;display:flex;align-items:center;background:var(--le-input-bg);border:var(--le-input-border);border-radius:var(--le-input-radius);transition:border-color 0.2s}.le-input-container:focus-within{outline:2px solid var(--le-color-focus);outline-offset:2px}.le-input-container.has-error{border:var(--le-input-border-error)}:host([disabled]) .le-input-container{opacity:0.6;background-color:rgba(0,0,0,0.05);cursor:not-allowed}input{flex:1;width:100%;height:calc(var(--le-input-height) - 2px);padding:var(--le-input-padding);border:none;background:transparent;color:var(--le-input-color);font-family:inherit;font-size:inherit;outline:none;text-align:right;-moz-appearance:textfield;}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input::placeholder{color:var(--le-input-placeholder-color)}.icon-start,.icon-end{display:flex;align-items:center;justify-content:center;padding:0 8px;color:var(--le-input-desc-color)}.le-input-controls{display:flex;flex-direction:column;border-left:1px solid var(--le-color-border, #cccccc);height:100%}.le-input-control-btn{--le-button-border-radius:0;--le-button-padding-x:0;--le-button-padding-y:0;--le-button-small-font-size:9.5px;--le-button-small-padding:0 0.2rem;--le-button-icon-aspect-ratio:2;display:flex;align-items:center;justify-content:center;height:50%;cursor:pointer;background:none;border:none;color:var(--le-input-desc-color);font-size:10px;line-height:1}.le-input-control-btn:hover{background-color:rgba(0,0,0,0.05);color:var(--le-color-primary, #007bff)}.le-input-control-btn:active{background-color:rgba(0,0,0,0.1)}.le-input-description{font-size:0.85em;color:var(--le-input-desc-color);margin-top:2px}.le-input-error{font-size:0.85em;color:var(--le-input-error-color);margin-top:2px}";
+
+const LeNumberInput$1 = /*@__PURE__*/ proxyCustomElement(class LeNumberInput extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.leChange = createEvent(this, "leChange", 7);
+        this.leInput = createEvent(this, "leInput", 7);
+    }
+    get el() { return this; }
+    /**
+     * The value of the input
+     */
+    value;
+    /**
+     * The name of the input
+     */
+    name;
+    /**
+     * Label for the input
+     */
+    label;
+    /**
+     * Placeholder text
+     */
+    placeholder;
+    /**
+     * Minimum allowed value
+     */
+    min;
+    /**
+     * Maximum allowed value
+     */
+    max;
+    /**
+     * Step value for increment/decrement
+     */
+    step = 1;
+    /**
+     * Whether the input is required
+     */
+    required = false;
+    /**
+     * Whether the input is disabled
+     */
+    disabled = false;
+    /**
+     * Whether the input is read-only
+     */
+    readonly = false;
+    /**
+     * Icon for the start icon
+     */
+    iconStart;
+    /**
+     * Whether to show the spinner controls
+     */
+    showSpinners = true;
+    /**
+     * External ID for linking with external systems
+     */
+    externalId;
+    /**
+     * Internal validation state
+     */
+    isValid = true;
+    validationMessage = '';
+    /**
+     * Emitted when the value changes (on blur or Enter)
+     */
+    leChange;
+    /**
+     * Emitted when the input value changes (on keystroke/spin)
+     */
+    leInput;
+    valueChanged() {
+        this.validate();
+    }
+    validate() {
+        if (this.required && (this.value === undefined || this.value === null || isNaN(this.value))) {
+            this.isValid = false;
+            this.validationMessage = 'This field is required';
+            return;
+        }
+        if (this.value !== undefined && this.value !== null && !isNaN(this.value)) {
+            if (this.min !== undefined && this.value < this.min) {
+                this.isValid = false;
+                this.validationMessage = `Value must be at least ${this.min}`;
+                return;
+            }
+            if (this.max !== undefined && this.value > this.max) {
+                this.isValid = false;
+                this.validationMessage = `Value must be at most ${this.max}`;
+                return;
+            }
+        }
+        this.isValid = true;
+        this.validationMessage = '';
+    }
+    emitChange() {
+        this.leChange.emit({
+            value: this.value,
+            name: this.name,
+            externalId: this.externalId,
+            isValid: this.isValid
+        });
+    }
+    emitInput() {
+        this.leInput.emit({
+            value: this.value,
+            name: this.name,
+            externalId: this.externalId,
+            isValid: this.isValid
+        });
+    }
+    updateValue(newValue) {
+        if (this.disabled || this.readonly)
+            return;
+        // Round to avoid floating point errors
+        const precision = this.step.toString().split('.')[1]?.length || 0;
+        const rounded = parseFloat(newValue.toFixed(precision));
+        this.value = rounded;
+        this.validate();
+        this.emitInput();
+    }
+    handleInput = (ev) => {
+        const input = ev.target;
+        const val = parseFloat(input.value);
+        if (input.value === '') {
+            this.value = undefined;
+        }
+        else if (!isNaN(val)) {
+            this.value = val;
+        }
+        this.validate();
+        this.emitInput();
+    };
+    handleChange = () => {
+        this.validate();
+        this.emitChange();
+    };
+    handleKeyDown = (ev) => {
+        if (this.disabled || this.readonly)
+            return;
+        let multiplier = 1;
+        if (ev.shiftKey)
+            multiplier = 10;
+        if (ev.altKey)
+            multiplier = 0.1;
+        const current = this.value || 0;
+        if (ev.key === 'ArrowUp') {
+            ev.preventDefault();
+            this.updateValue(current + (this.step * multiplier));
+        }
+        else if (ev.key === 'ArrowDown') {
+            ev.preventDefault();
+            this.updateValue(current - (this.step * multiplier));
+        }
+    };
+    handleWheel = (ev) => {
+        if (this.disabled || this.readonly)
+            return;
+        // Only handle if input is focused to prevent accidental scrolling
+        if (document.activeElement !== ev.target)
+            return;
+        ev.preventDefault();
+        const current = this.value || 0;
+        if (ev.deltaY < 0) {
+            this.updateValue(current + this.step);
+        }
+        else {
+            this.updateValue(current - this.step);
+        }
+    };
+    increment = (ev) => {
+        ev.preventDefault(); // Prevent focus loss
+        const current = this.value || 0;
+        this.updateValue(current + this.step);
+        // Trigger change event for buttons as they are "final" actions usually
+        this.emitChange();
+    };
+    decrement = (ev) => {
+        ev.preventDefault();
+        const current = this.value || 0;
+        this.updateValue(current - this.step);
+        this.emitChange();
+    };
+    render() {
+        return (h("le-component", { key: '6af8d1fd4c89597f7da3be391cabccbb9d1f9800', component: "le-number-input", hostClass: classnames({ 'disabled': this.disabled }) }, h("div", { key: 'e4e0ad02f89b2eb8dd7649d2f2e70bc821cb2774', class: "le-input-wrapper" }, this.label && (h("label", { key: '30ad120d5571018ea9891340b5406f6939a1fe0e', class: "le-input-label", htmlFor: this.name }, this.label)), h("div", { key: '27b835ad1559a1ea4366c4b7c2b31d412e8b8ef7', class: classnames('le-input-container', { 'has-error': !this.isValid }) }, this.iconStart && (h("span", { key: '0164cbb985b900b4b3136061a2609987a2c06e9f', class: "icon-start" }, this.iconStart)), h("input", { key: '6d68b764f45d61b7dd4ffe435bd9e9da04c4d87a', id: this.name, type: "number", name: this.name, placeholder: this.placeholder, min: this.min, max: this.max, step: this.step, value: this.value, disabled: this.disabled, readOnly: this.readonly, required: this.required, onInput: this.handleInput, onChange: this.handleChange, onKeyDown: this.handleKeyDown, onWheel: this.handleWheel }), this.showSpinners && (h("div", { key: '7ed04341c0c27a7d37afd4baf9698ea7776702f6', class: "le-input-controls" }, h("le-button", { key: '80c96f7cbee40efd2b79f33e8401a13f187092a6', mode: "default", variant: "clear", size: "small", "icon-only": true, class: "le-input-control-btn", onClick: this.increment, disabled: this.disabled || this.readonly || (this.max !== undefined && this.value >= this.max), tabindex: "-1" }, h("span", { key: 'd56b463073ce8174c668138179f1bbc16c700d9f', slot: "icon-only" }, "\u2191")), h("le-button", { key: '74e70e65d6668cc1cee7abfaf464a60a29efa3f9', mode: "default", variant: "clear", size: "small", "icon-only": true, class: "le-input-control-btn", onClick: this.decrement, disabled: this.disabled || this.readonly || (this.min !== undefined && this.value <= this.min), tabindex: "-1" }, h("span", { key: 'e2330cdf9f431b2c9f0953e42f71e897879d10fe', slot: "icon-only" }, "\u2193"))))), !this.isValid && h("div", { key: 'ba9bb8af8c4814b4316c1f0947c50a99fd24634c', class: "le-input-error" }, this.validationMessage), h("div", { key: '30e43ac088f995fe24ab47678ca70fe771b6f1ab', class: "le-input-description" }, h("le-slot", { key: '94f4bd21e32595470781eb6b004c9acbee72b81a', name: "description", type: "text", tag: "p", label: "Description" }, h("slot", { key: 'def94a79248d1887c5416ff95b2c625df85c68d0', name: "description" }))))));
+    }
+    static get watchers() { return {
+        "value": ["valueChanged"]
+    }; }
+    static get style() { return leNumberInputCss; }
+}, [769, "le-number-input", {
+        "value": [1538],
+        "name": [1],
+        "label": [1],
+        "placeholder": [1],
+        "min": [2],
+        "max": [2],
+        "step": [2],
+        "required": [4],
+        "disabled": [4],
+        "readonly": [4],
+        "iconStart": [1, "icon-start"],
+        "showSpinners": [4, "show-spinners"],
+        "externalId": [1, "external-id"],
+        "isValid": [32],
+        "validationMessage": [32]
+    }, undefined, {
+        "value": ["valueChanged"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["le-number-input", "le-button", "le-checkbox", "le-component", "le-popover", "le-slot", "le-string-input"];
+    components.forEach(tagName => { switch (tagName) {
+        case "le-number-input":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, LeNumberInput$1);
+            }
+            break;
+        case "le-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "le-checkbox":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "le-component":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "le-popover":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "le-slot":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "le-string-input":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const LeNumberInput = LeNumberInput$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LeNumberInput, defineCustomElement };
+//# sourceMappingURL=le-number-input.js.map
+
+//# sourceMappingURL=le-number-input.js.map

package/dist/components/le-number-input.js.map

@@ -0,0 +1 @@
+{"file":"le-number-input.js","mappings":"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","names":["LeNumberInput","__stencil_proxyCustomElement"],"sources":["src/components/le-number-input/le-number-input.css?tag=le-number-input&encapsulation=shadow","src/components/le-number-input/le-number-input.tsx"],"sourcesContent":[":host {\n  display: block;\n  --le-input-bg: var(--le-color-surface, #ffffff);\n  --le-input-color: var(--le-color-text-primary, #333333);\n  --le-input-border: var(--le-border-width, 2px) solid var(--le-color-border-input, #007bff);\n  --le-input-radius: var(--le-radius-sm, 4px);\n  --le-input-padding: 2px 6px;\n  --le-input-height: 1.5rem;\n  --le-input-label-color: var(--le-color-text-primary, #333333);\n  --le-input-desc-color: var(--le-color-text-secondary, #666666);\n  --le-input-placeholder-color: #999999;\n  --le-input-border-error: 2px solid var(--le-color-danger, #dc3545);\n  --le-input-error-color: var(--le-color-danger, #dc3545);\n}\n\n.le-input-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.le-input-label {\n  display: block;\n  font-size: 0.9em;\n  font-weight: 500;\n  color: var(--le-input-label-color);\n  margin-bottom: 2px;\n}\n\n.le-input-container {\n  position: relative;\n  display: flex;\n  align-items: center;\n  background: var(--le-input-bg);\n  border: var(--le-input-border);\n  border-radius: var(--le-input-radius);\n  transition: border-color 0.2s;\n}\n\n.le-input-container:focus-within {\n  outline: 2px solid var(--le-color-focus);\n  outline-offset: 2px;\n}\n\n.le-input-container.has-error {\n  border: var(--le-input-border-error);\n}\n\n:host([disabled]) .le-input-container {\n  opacity: 0.6;\n  background-color: rgba(0,0,0,0.05);\n  cursor: not-allowed;\n}\n\ninput {\n  flex: 1;\n  width: 100%;\n  height: calc(var(--le-input-height) - 2px);\n  padding: var(--le-input-padding);\n  border: none;\n  background: transparent;\n  color: var(--le-input-color);\n  font-family: inherit;\n  font-size: inherit;\n  outline: none;\n  text-align: right; /* Aligned to end */\n  -moz-appearance: textfield; /* Remove default spinners in Firefox */\n}\n\n/* Remove default spinners in Chrome/Safari/Edge */\ninput::-webkit-outer-spin-button,\ninput::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\ninput::placeholder {\n  color: var(--le-input-placeholder-color);\n}\n\n.icon-start, .icon-end {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 8px;\n  color: var(--le-input-desc-color);\n}\n\n.le-input-controls {\n  display: flex;\n  flex-direction: column;\n  border-left: 1px solid var(--le-color-border, #cccccc);\n  height: 100%;\n}\n\n.le-input-control-btn {\n  --le-button-border-radius: 0;\n  --le-button-padding-x: 0;\n  --le-button-padding-y: 0;\n  --le-button-small-font-size: 9.5px;\n  --le-button-small-padding: 0 0.2rem;\n  --le-button-icon-aspect-ratio: 2;\n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 50%;\n  cursor: pointer;\n  background: none;\n  border: none;\n  color: var(--le-input-desc-color);\n  font-size: 10px;\n  line-height: 1;\n}\n\n.le-input-control-btn:hover {\n  background-color: rgba(0,0,0,0.05);\n  color: var(--le-color-primary, #007bff);\n}\n\n.le-input-control-btn:active {\n  background-color: rgba(0,0,0,0.1);\n}\n\n.le-input-description {\n  font-size: 0.85em;\n  color: var(--le-input-desc-color);\n  margin-top: 2px;\n}\n\n.le-input-error {\n  font-size: 0.85em;\n  color: var(--le-input-error-color);\n  margin-top: 2px;\n}\n","import { Component, Prop, Event, EventEmitter, State, h, Element, Watch } from '@stencil/core';\nimport { classnames } from '../../utils/utils';\n\n/**\n * A number input component with validation, keyboard controls, and custom spinners.\n *\n * @slot - The label text for the input\n * @slot description - Additional description text displayed below the input\n * @slot icon-start - Icon to display at the start of the input\n *\n * @cssprop --le-input-bg - Input background color\n * @cssprop --le-input-color - Input text color\n * @cssprop --le-input-border - Input border style\n * @cssprop --le-input-border-focus - Input border style when focused\n * @cssprop --le-input-border-error - Input border style when invalid\n * @cssprop --le-input-radius - Input border radius\n * @cssprop --le-input-padding - Input padding\n */\n@Component({\n  tag: 'le-number-input',\n  styleUrl: 'le-number-input.css',\n  shadow: true,\n})\nexport class LeNumberInput {\n  @Element() el: HTMLElement;\n\n  /**\n   * The value of the input\n   */\n  @Prop({ mutable: true, reflect: true }) value: number;\n\n  /**\n   * The name of the input\n   */\n  @Prop() name: string;\n\n  /**\n   * Label for the input\n   */\n  @Prop() label: string;\n\n  /**\n   * Placeholder text\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * Minimum allowed value\n   */\n  @Prop() min?: number;\n\n  /**\n   * Maximum allowed value\n   */\n  @Prop() max?: number;\n\n  /**\n   * Step value for increment/decrement\n   */\n  @Prop() step: number = 1;\n\n  /**\n   * Whether the input is required\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * Whether the input is disabled\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * Whether the input is read-only\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   * Icon for the start icon\n   */\n  @Prop() iconStart?: string;\n\n  /**\n   * Whether to show the spinner controls\n   */\n  @Prop() showSpinners: boolean = true;\n\n  /**\n   * External ID for linking with external systems\n   */\n  @Prop() externalId: string;\n\n  /**\n   * Internal validation state\n   */\n  @State() private isValid: boolean = true;\n  @State() private validationMessage: string = '';\n\n  /**\n   * Emitted when the value changes (on blur or Enter)\n   */\n  @Event() leChange: EventEmitter<{ value: number; name: string; externalId: string; isValid: boolean }>;\n\n  /**\n   * Emitted when the input value changes (on keystroke/spin)\n   */\n  @Event() leInput: EventEmitter<{ value: number; name: string; externalId: string; isValid: boolean }>;\n\n  @Watch('value')\n  valueChanged() {\n    this.validate();\n  }\n\n  private validate() {\n    if (this.required && (this.value === undefined || this.value === null || isNaN(this.value))) {\n      this.isValid = false;\n      this.validationMessage = 'This field is required';\n      return;\n    }\n\n    if (this.value !== undefined && this.value !== null && !isNaN(this.value)) {\n      if (this.min !== undefined && this.value < this.min) {\n        this.isValid = false;\n        this.validationMessage = `Value must be at least ${this.min}`;\n        return;\n      }\n      if (this.max !== undefined && this.value > this.max) {\n        this.isValid = false;\n        this.validationMessage = `Value must be at most ${this.max}`;\n        return;\n      }\n    }\n\n    this.isValid = true;\n    this.validationMessage = '';\n  }\n\n  private emitChange() {\n    this.leChange.emit({\n      value: this.value,\n      name: this.name,\n      externalId: this.externalId,\n      isValid: this.isValid\n    });\n  }\n\n  private emitInput() {\n    this.leInput.emit({\n      value: this.value,\n      name: this.name,\n      externalId: this.externalId,\n      isValid: this.isValid\n    });\n  }\n\n  private updateValue(newValue: number) {\n    if (this.disabled || this.readonly) return;\n    \n    // Round to avoid floating point errors\n    const precision = this.step.toString().split('.')[1]?.length || 0;\n    const rounded = parseFloat(newValue.toFixed(precision));\n    \n    this.value = rounded;\n    this.validate();\n    this.emitInput();\n  }\n\n  private handleInput = (ev: Event) => {\n    const input = ev.target as HTMLInputElement;\n    const val = parseFloat(input.value);\n    \n    if (input.value === '') {\n      this.value = undefined;\n    } else if (!isNaN(val)) {\n      this.value = val;\n    }\n    \n    this.validate();\n    this.emitInput();\n  };\n\n  private handleChange = () => {\n    this.validate();\n    this.emitChange();\n  };\n\n  private handleKeyDown = (ev: KeyboardEvent) => {\n    if (this.disabled || this.readonly) return;\n\n    let multiplier = 1;\n    if (ev.shiftKey) multiplier = 10;\n    if (ev.altKey) multiplier = 0.1;\n\n    const current = this.value || 0;\n\n    if (ev.key === 'ArrowUp') {\n      ev.preventDefault();\n      this.updateValue(current + (this.step * multiplier));\n    } else if (ev.key === 'ArrowDown') {\n      ev.preventDefault();\n      this.updateValue(current - (this.step * multiplier));\n    }\n  };\n\n  private handleWheel = (ev: WheelEvent) => {\n    if (this.disabled || this.readonly) return;\n    // Only handle if input is focused to prevent accidental scrolling\n    if (document.activeElement !== ev.target) return;\n\n    ev.preventDefault();\n    const current = this.value || 0;\n    \n    if (ev.deltaY < 0) {\n      this.updateValue(current + this.step);\n    } else {\n      this.updateValue(current - this.step);\n    }\n  };\n\n  private increment = (ev: Event) => {\n    ev.preventDefault(); // Prevent focus loss\n    const current = this.value || 0;\n    this.updateValue(current + this.step);\n    // Trigger change event for buttons as they are \"final\" actions usually\n    this.emitChange();\n  };\n\n  private decrement = (ev: Event) => {\n    ev.preventDefault();\n    const current = this.value || 0;\n    this.updateValue(current - this.step);\n    this.emitChange();\n  };\n\n  render() {\n    return (\n      <le-component component=\"le-number-input\" hostClass={classnames({ 'disabled': this.disabled })}>\n        <div class=\"le-input-wrapper\">\n          {this.label && (\n            <label class=\"le-input-label\" htmlFor={this.name}>{this.label}</label>\n          )}\n          \n          <div class={classnames('le-input-container', { 'has-error': !this.isValid })}>\n            {this.iconStart && (\n              <span class=\"icon-start\">{this.iconStart}</span>\n            )}\n            \n            <input\n              id={this.name}\n              type=\"number\"\n              name={this.name}\n              placeholder={this.placeholder}\n              min={this.min}\n              max={this.max}\n              step={this.step}\n              value={this.value}\n              disabled={this.disabled}\n              readOnly={this.readonly}\n              required={this.required}\n              onInput={this.handleInput}\n              onChange={this.handleChange}\n              onKeyDown={this.handleKeyDown}\n              onWheel={this.handleWheel}\n            />\n            \n            {this.showSpinners && (\n              <div class=\"le-input-controls\">\n                <le-button\n                  mode=\"default\"\n                  variant=\"clear\" \n                  size=\"small\"\n                  icon-only\n                  class=\"le-input-control-btn\" \n                  onClick={this.increment}\n                  disabled={this.disabled || this.readonly || (this.max !== undefined && this.value >= this.max)}\n                  tabindex=\"-1\"\n                >\n                  <span slot=\"icon-only\">↑</span>\n                </le-button>\n                <le-button\n                  mode=\"default\"\n                  variant=\"clear\" \n                  size=\"small\" \n                  icon-only \n                  class=\"le-input-control-btn\" \n                  onClick={this.decrement}\n                  disabled={this.disabled || this.readonly || (this.min !== undefined && this.value <= this.min)}\n                  tabindex=\"-1\"\n                >\n                  <span slot=\"icon-only\">↓</span>\n                </le-button>\n              </div>\n            )}\n          </div>\n\n          {!this.isValid && <div class=\"le-input-error\">{this.validationMessage}</div>}\n\n          <div class=\"le-input-description\">\n            <le-slot name=\"description\" type=\"text\" tag=\"p\" label=\"Description\">\n              <slot name=\"description\"></slot>\n            </le-slot>\n          </div>\n        </div>\n      </le-component>\n    );\n  }\n}\n"],"version":3}

package/dist/components/le-popover.d.ts

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

package/dist/components/le-popover.js

@@ -0,0 +1,9 @@
+import { L as LePopover$1, d as defineCustomElement$1 } from './le-popover2.js';
+
+const LePopover = LePopover$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LePopover, defineCustomElement };
+//# sourceMappingURL=le-popover.js.map
+
+//# sourceMappingURL=le-popover.js.map

package/dist/components/le-popover.js.map

@@ -0,0 +1 @@
+{"file":"le-popover.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}