@ind-ds/core 0.1.1 → 0.2.1

package/dist/collection/components/atoms/button/button.js

@@ -1,215 +0,0 @@
-import { h, Host, } from "@stencil/core";
-export class IndButton {
-    /** Visual variant. `danger` should be paired with `holdToConfirmMs` for critical actions. */
-    variant = 'default';
-    /** Size. */
-    size = 'md';
-    /** Disabled state. */
-    disabled = false;
-    /** Optional accessible label (falls back to slotted text). */
-    label;
-    /**
-     * If > 0, the button must be held this many milliseconds before activating.
-     * Use for critical actions (Stop, Trip, Reset) to prevent accidental clicks —
-     * standard NAMUR / safety-instrumented operating practice.
-     */
-    holdToConfirmMs = 0;
-    /** Fired on click (or after hold completes if `holdToConfirmMs > 0`). */
-    indActivate;
-    progress = 0;
-    holdStart = 0;
-    rafHandle = null;
-    startHold = (e) => {
-        if (this.disabled)
-            return;
-        e.preventDefault();
-        if (this.holdToConfirmMs <= 0) {
-            this.indActivate.emit();
-            return;
-        }
-        this.holdStart = performance.now();
-        this.progress = 0;
-        this.tick();
-    };
-    tick = () => {
-        const elapsed = performance.now() - this.holdStart;
-        this.progress = Math.min(1, elapsed / this.holdToConfirmMs);
-        if (this.progress >= 1) {
-            this.cancelHold();
-            this.indActivate.emit();
-            return;
-        }
-        this.rafHandle = requestAnimationFrame(this.tick);
-    };
-    cancelHold = () => {
-        if (this.rafHandle !== null) {
-            cancelAnimationFrame(this.rafHandle);
-            this.rafHandle = null;
-        }
-        this.progress = 0;
-    };
-    onKeyDown = (e) => {
-        if (e.key === ' ' || e.key === 'Enter') {
-            e.preventDefault();
-            this.startHold(e);
-        }
-    };
-    disconnectedCallback() {
-        this.cancelHold();
-    }
-    render() {
-        const isHolding = this.progress > 0 && this.progress < 1;
-        return (h(Host, { key: 'bbafede18f13eac5486d9cae0c2bd727375e7762' }, h("button", { key: '82bf34d3c9943e33edd5c8863be6457d3c201ece', type: "button", class: { btn: true, 'is-holding': isHolding }, part: "btn", disabled: this.disabled, "aria-label": this.label, "aria-describedby": this.holdToConfirmMs > 0 ? 'hold-hint' : undefined, onPointerDown: this.startHold, onPointerUp: this.cancelHold, onPointerLeave: this.cancelHold, onPointerCancel: this.cancelHold, onKeyDown: this.onKeyDown, onKeyUp: this.cancelHold }, h("span", { key: '75252fda5e1229f6c335df277b0c09a18d0b621d', class: "content", part: "content" }, h("slot", { key: 'f9a158deadf76da0cf1e13680c1b1dd444273387' }, this.label)), this.holdToConfirmMs > 0 && (h("span", { key: '7ba778902c08b3d8fe6b1c6a963c4ab645369110', class: "hold-progress", part: "hold-progress", style: { transform: `scaleX(${this.progress})` }, "aria-hidden": "true" }))), this.holdToConfirmMs > 0 && (h("span", { key: '9c2f72de9486bfed4855c5dc81dbf54161c97842', id: "hold-hint", class: "sr-only" }, "Hold to confirm (", this.holdToConfirmMs, " ms)"))));
-    }
-    static get is() { return "ind-button"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["button.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["button.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "variant": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ButtonVariant",
-                    "resolved": "\"danger\" | \"default\" | \"ghost\" | \"primary\"",
-                    "references": {
-                        "ButtonVariant": {
-                            "location": "local",
-                            "path": "/home/runner/work/ind-ds/ind-ds/packages/core/src/components/atoms/button/button.tsx",
-                            "id": "src/components/atoms/button/button.tsx::ButtonVariant"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Visual variant. `danger` should be paired with `holdToConfirmMs` for critical actions."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "variant",
-                "defaultValue": "'default'"
-            },
-            "size": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ButtonSize",
-                    "resolved": "\"lg\" | \"md\" | \"sm\"",
-                    "references": {
-                        "ButtonSize": {
-                            "location": "local",
-                            "path": "/home/runner/work/ind-ds/ind-ds/packages/core/src/components/atoms/button/button.tsx",
-                            "id": "src/components/atoms/button/button.tsx::ButtonSize"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Size."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "size",
-                "defaultValue": "'md'"
-            },
-            "disabled": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Disabled state."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "disabled",
-                "defaultValue": "false"
-            },
-            "label": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string | undefined",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Optional accessible label (falls back to slotted text)."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "label"
-            },
-            "holdToConfirmMs": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "If > 0, the button must be held this many milliseconds before activating.\nUse for critical actions (Stop, Trip, Reset) to prevent accidental clicks \u2014\nstandard NAMUR / safety-instrumented operating practice."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "hold-to-confirm-ms",
-                "defaultValue": "0"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "progress": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "indActivate",
-                "name": "indActivate",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Fired on click (or after hold completes if `holdToConfirmMs > 0`)."
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }];
-    }
-}
-//# sourceMappingURL=button.js.map

package/dist/collection/components/atoms/canvas-layer/canvas-layer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas-layer.js","sourceRoot":"","sources":["../../../../src/components/atoms/canvas-layer/canvas-layer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,cAAc;IACzB,iEAAiE;IACzD,CAAC,GAAW,CAAC,CAAC;IACtB,+DAA+D;IACvD,CAAC,GAAW,CAAC,CAAC;IACtB,2BAA2B;IACnB,QAAQ,GAAW,CAAC,CAAC;IAC7B,4BAA4B;IACpB,KAAK,GAAW,CAAC,CAAC;IAC1B,sBAAsB;IACd,CAAC,GAAW,CAAC,CAAC;IACtB,qEAAqE;IAC5C,MAAM,GAA0B,QAAQ,CAAC;IAElE,MAAM;QACJ,MAAM,SAAS,GAAG,IAAI,CAAC,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,iBAAiB,CAAC;QACzF,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,IAAI,EAAE,GAAG,IAAI,CAAC,CAAC,GAAG;gBAClB,GAAG,EAAE,GAAG,IAAI,CAAC,CAAC,GAAG;gBACjB,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;gBACtB,SAAS,EAAE,GAAG,SAAS,WAAW,IAAI,CAAC,QAAQ,cAAc,IAAI,CAAC,KAAK,GAAG;aAC3E;YAED,8DAAQ,CACH,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Host } from '@stencil/core';\n\n@Component({\n  tag: 'ind-canvas-layer',\n  styleUrl: 'canvas-layer.css',\n  shadow: true,\n})\nexport class IndCanvasLayer {\n  /** Horizontal position as a percentage of the parent (0–100). */\n  @Prop() x: number = 0;\n  /** Vertical position as a percentage of the parent (0–100). */\n  @Prop() y: number = 0;\n  /** Rotation in degrees. */\n  @Prop() rotation: number = 0;\n  /** Uniform scale factor. */\n  @Prop() scale: number = 1;\n  /** Stacking order. */\n  @Prop() z: number = 0;\n  /** Anchor the placed content by its center (default) or top-left. */\n  @Prop({ reflect: true }) anchor: 'center' | 'top-left' = 'center';\n\n  render() {\n    const translate = this.anchor === 'center' ? 'translate(-50%, -50%)' : 'translate(0, 0)';\n    return (\n      <Host\n        style={{\n          left: `${this.x}%`,\n          top: `${this.y}%`,\n          zIndex: String(this.z),\n          transform: `${translate} rotate(${this.rotation}deg) scale(${this.scale})`,\n        }}\n      >\n        <slot />\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/atoms/checkbox/checkbox.css

@@ -1,92 +0,0 @@
-:host {
-  display: inline-flex;
-  font-family: var(--ind-font-family-sans);
-  font-size: var(--ind-font-size-base, 12px);
-  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));
-  --_size: 16px;
-}
-
-:host([size="sm"]) { --_size: 12px; }
-:host([size="md"]) { --_size: 16px; }
-:host([size="lg"]) { --_size: 20px; }
-
-.wrap {
-  display: inline-flex;
-  align-items: center;
-  gap: var(--ind-spacing-3, 6px);
-  cursor: pointer;
-  user-select: none;
-}
-
-.box {
-  position: relative;
-  display: inline-block;
-  width: var(--_size);
-  height: var(--_size);
-  flex-shrink: 0;
-}
-
-.native {
-  position: absolute;
-  inset: 0;
-  margin: 0;
-  opacity: 0;
-  cursor: inherit;
-}
-
-.mark {
-  position: relative;
-  display: block;
-  width: 100%;
-  height: 100%;
-  background: var(--ind-surface-sunken, light-dark(#ffffff, #000000));
-  border: 1px solid var(--ind-surface-border-default, #2a3340);
-  border-radius: var(--ind-radius-sm, 2px);
-  transition:
-    background var(--ind-motion-duration-fast, 120ms),
-    border-color var(--ind-motion-duration-fast, 120ms);
-}
-
-.mark::after {
-  content: "";
-  position: absolute;
-  inset: 0;
-  display: block;
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: 70%;
-  opacity: 0;
-  transition: opacity var(--ind-motion-duration-fast, 120ms);
-}
-
-:host([checked]) .mark,
-:host([indeterminate]) .mark {
-  background: var(--ind-button-primary-bg, #2563eb);
-  border-color: var(--ind-button-primary-border, #60a5fa);
-}
-
-:host([checked]) .mark::after {
-  opacity: 1;
-  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M3 8.5l3.5 3.5L13 5'/></svg>");
-}
-
-:host([indeterminate]) .mark::after {
-  opacity: 1;
-  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' d='M3 8h10'/></svg>");
-}
-
-.native:focus-visible + .mark {
-  outline: 2px solid var(--ind-surface-focus-ring, #22d3ee);
-  outline-offset: 2px;
-}
-
-:host([disabled]) {
-  opacity: 0.5;
-}
-:host([disabled]) .wrap {
-  cursor: not-allowed;
-}
-
-.label {
-  line-height: 1.2;
-}

package/dist/collection/components/atoms/checkbox/checkbox.js

@@ -1,214 +0,0 @@
-import { h, Host, } from "@stencil/core";
-export class IndCheckbox {
-    host;
-    checked = false;
-    indeterminate = false;
-    disabled = false;
-    size = 'md';
-    label;
-    name;
-    value;
-    indChange;
-    componentDidLoad() {
-        this.syncIndeterminate();
-    }
-    syncIndeterminate() {
-        const input = this.host.shadowRoot?.querySelector('input');
-        if (input)
-            input.indeterminate = this.indeterminate;
-    }
-    onChange = (e) => {
-        const next = e.target.checked;
-        this.checked = next;
-        this.indChange.emit(next);
-    };
-    render() {
-        const ariaChecked = this.indeterminate ? 'mixed' : this.checked ? 'true' : 'false';
-        return (h(Host, { key: 'd4b48a80703ea584c4db306d26fcaebd990f9d87' }, h("label", { key: 'd101498325e34b2d4ce87189aaf82930f81fd831', class: "wrap", part: "wrap" }, h("span", { key: '8363b37e0c6a9a082dbab4e0bb26b09506cb4b00', class: "box", part: "box" }, h("input", { key: '2c2a0d2e10c70a97aa2c983941f14bd3c6bc30dd', type: "checkbox", class: "native", part: "native", checked: this.checked, disabled: this.disabled, name: this.name, value: this.value, "aria-checked": ariaChecked, onChange: this.onChange }), h("span", { key: '41f5ba40d9c2e27e899366e9de111d3aa4a3817c', class: "mark", part: "mark", "aria-hidden": "true" })), this.label && h("span", { key: 'c9955a662691ac94a2be379edc332f550f09b53e', class: "label", part: "label" }, this.label))));
-    }
-    static get is() { return "ind-checkbox"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["checkbox.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["checkbox.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "checked": {
-                "type": "boolean",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "checked",
-                "defaultValue": "false"
-            },
-            "indeterminate": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "indeterminate",
-                "defaultValue": "false"
-            },
-            "disabled": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "disabled",
-                "defaultValue": "false"
-            },
-            "size": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "CheckboxSize",
-                    "resolved": "\"lg\" | \"md\" | \"sm\"",
-                    "references": {
-                        "CheckboxSize": {
-                            "location": "local",
-                            "path": "/home/runner/work/ind-ds/ind-ds/packages/core/src/components/atoms/checkbox/checkbox.tsx",
-                            "id": "src/components/atoms/checkbox/checkbox.tsx::CheckboxSize"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "size",
-                "defaultValue": "'md'"
-            },
-            "label": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string | undefined",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "label"
-            },
-            "name": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string | undefined",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "name"
-            },
-            "value": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string | undefined",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "value"
-            }
-        };
-    }
-    static get events() {
-        return [{
-                "method": "indChange",
-                "name": "indChange",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                }
-            }];
-    }
-    static get elementRef() { return "host"; }
-    static get watchers() {
-        return [{
-                "propName": "indeterminate",
-                "methodName": "syncIndeterminate"
-            }];
-    }
-}
-//# sourceMappingURL=checkbox.js.map

package/dist/collection/components/atoms/compressor/compressor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"compressor.js","sourceRoot":"","sources":["../../../../src/components/atoms/compressor/compressor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAQzD,MAAM,OAAO,aAAa;IACxB,qBAAqB;IACI,KAAK,GAAmB,SAAS,CAAC;IAC3D,mBAAmB;IACM,IAAI,GAAkB,IAAI,CAAC;IACpD,oCAAoC;IAC5B,GAAG,CAAU;IACrB,mBAAmB;IACX,KAAK,CAAU;IAEvB,MAAM;QACJ,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,GAAG,IAAI,YAAY,CAAC;QACpD,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,KAAK,gBAAa,GAAG,IAAI,MAAM,IAAI,CAAC,KAAK,EAAE;YAEpD,4DAAK,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,WAAW,iBAAa,MAAM;gBACxD,+DAAQ,KAAK,EAAC,MAAM,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,IAAI,GAAG;gBAC9C,gEAAS,KAAK,EAAC,QAAQ,EAAC,MAAM,EAAC,wBAAwB,GAAG;gBAC1D,0DAAG,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,eAAe,EAAE,WAAW,EAAE;oBACrD,6DAAM,KAAK,EAAC,QAAQ,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,GAAG,CACpD,CACA;YACL,CAAC,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAC3B,4DAAK,KAAK,EAAC,SAAS;gBACjB,IAAI,CAAC,GAAG,IAAI,6DAAM,KAAK,EAAC,KAAK,IAAE,IAAI,CAAC,GAAG,CAAQ;gBAC/C,IAAI,CAAC,KAAK,IAAI,6DAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CAClD,CACP,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Host } from '@stencil/core';\nimport type { EquipmentState, EquipmentSize } from '../_equipment/types';\n\n@Component({\n  tag: 'ind-compressor',\n  styleUrls: ['../_equipment/equipment.css', 'compressor.css'],\n  shadow: true,\n})\nexport class IndCompressor {\n  /** Process state. */\n  @Prop({ reflect: true }) state: EquipmentState = 'stopped';\n  /** Visual size. */\n  @Prop({ reflect: true }) size: EquipmentSize = 'md';\n  /** Equipment tag (e.g. \"K-401\"). */\n  @Prop() tag?: string;\n  /** Human label. */\n  @Prop() label?: string;\n\n  render() {\n    const name = this.label ?? this.tag ?? 'compressor';\n    return (\n      <Host role=\"img\" aria-label={`${name} — ${this.state}`}>\n        {/* Centrifugal compressor: trapezoid casing (wide inlet → narrow outlet). */}\n        <svg class=\"symbol\" viewBox=\"0 0 48 36\" aria-hidden=\"true\">\n          <circle class=\"body\" cx=\"20\" cy=\"18\" r=\"16\" />\n          <polygon class=\"accent\" points=\"10,8 30,14 30,22 10,28\" />\n          <g class=\"spin\" style={{ transformOrigin: '20px 18px' }}>\n            <line class=\"stroke\" x1=\"20\" y1=\"6\" x2=\"20\" y2=\"30\" />\n          </g>\n        </svg>\n        {(this.tag || this.label) && (\n          <div class=\"caption\">\n            {this.tag && <span class=\"tag\">{this.tag}</span>}\n            {this.label && <span class=\"label\">{this.label}</span>}\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/atoms/connection-indicator/connection-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"connection-indicator.js","sourceRoot":"","sources":["../../../../src/components/atoms/connection-indicator/connection-indicator.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAKzD,MAAM,cAAc,GAAoC;IACtD,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE,aAAa;IACzB,YAAY,EAAE,cAAc;IAC5B,KAAK,EAAE,kBAAkB;CAC1B,CAAC;AAOF,MAAM,OAAO,sBAAsB;IACjC,wBAAwB;IACC,KAAK,GAAoB,cAAc,CAAC;IAEjE,YAAY;IACa,IAAI,GAAmB,IAAI,CAAC;IAErD,wEAAwE;IAChE,KAAK,CAAU;IAEvB,MAAM;QACJ,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,IAAI,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACtD,OAAO,CACL,EAAC,IAAI,qDACH,IAAI,EAAC,QAAQ,eACF,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,gBAC9C,IAAI,IAAI,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC;YAE9C,6DAAM,KAAK,EAAC,KAAK,EAAC,IAAI,EAAC,KAAK,iBAAa,MAAM,GAAG;YACjD,IAAI,IAAI,6DAAM,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,IAAE,IAAI,CAAQ,CAClD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type ConnectionState = 'connected' | 'connecting' | 'disconnected' | 'error';\nexport type ConnectionSize = 'sm' | 'md' | 'lg';\n\nconst DEFAULT_LABELS: Record<ConnectionState, string> = {\n  connected: 'Connected',\n  connecting: 'Connecting…',\n  disconnected: 'Disconnected',\n  error: 'Connection error',\n};\n\n@Component({\n  tag: 'ind-connection-indicator',\n  styleUrl: 'connection-indicator.css',\n  shadow: true,\n})\nexport class IndConnectionIndicator {\n  /** Connection state. */\n  @Prop({ reflect: true }) state: ConnectionState = 'disconnected';\n\n  /** Size. */\n  @Prop({ reflect: true }) size: ConnectionSize = 'md';\n\n  /** Override the default text label. Pass an empty string to hide it. */\n  @Prop() label?: string;\n\n  render() {\n    const text = this.label ?? DEFAULT_LABELS[this.state];\n    return (\n      <Host\n        role=\"status\"\n        aria-live={this.state === 'error' ? 'assertive' : 'polite'}\n        aria-label={text || DEFAULT_LABELS[this.state]}\n      >\n        <span class=\"dot\" part=\"dot\" aria-hidden=\"true\" />\n        {text && <span class=\"label\" part=\"label\">{text}</span>}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/atoms/conveyor/conveyor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"conveyor.js","sourceRoot":"","sources":["../../../../src/components/atoms/conveyor/conveyor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAUzD,MAAM,OAAO,WAAW;IACtB,kDAAkD;IACzB,KAAK,GAAmB,SAAS,CAAC;IAC3D,6BAA6B;IACJ,SAAS,GAAsB,SAAS,CAAC;IAClE,mBAAmB;IACM,IAAI,GAAkB,IAAI,CAAC;IACpD,qCAAqC;IAC7B,GAAG,CAAU;IACrB,mBAAmB;IACX,KAAK,CAAU;IAEvB,MAAM;QACJ,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,GAAG,IAAI,UAAU,CAAC;QAClD,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,KAAK,gBAAa,GAAG,IAAI,MAAM,IAAI,CAAC,KAAK,EAAE;YACpD,4DAAK,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,WAAW,iBAAa,MAAM;gBACxD,+DAAQ,KAAK,EAAC,MAAM,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,GAAG,GAAG;gBAC7C,+DAAQ,KAAK,EAAC,MAAM,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,GAAG,GAAG;gBAC7C,6DAAM,KAAK,EAAC,QAAQ,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,GAAG;gBACrD,6DAAM,KAAK,EAAC,QAAQ,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,GAAG;gBACvD,6DAAM,KAAK,EAAC,MAAM,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,GAAG,CACjD;YACL,CAAC,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAC3B,4DAAK,KAAK,EAAC,SAAS;gBACjB,IAAI,CAAC,GAAG,IAAI,6DAAM,KAAK,EAAC,KAAK,IAAE,IAAI,CAAC,GAAG,CAAQ;gBAC/C,IAAI,CAAC,KAAK,IAAI,6DAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CAClD,CACP,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Host } from '@stencil/core';\nimport type { EquipmentState, EquipmentSize } from '../_equipment/types';\n\nexport type ConveyorDirection = 'forward' | 'reverse';\n\n@Component({\n  tag: 'ind-conveyor',\n  styleUrls: ['../_equipment/equipment.css', 'conveyor.css'],\n  shadow: true,\n})\nexport class IndConveyor {\n  /** Process state. `running` animates the belt. */\n  @Prop({ reflect: true }) state: EquipmentState = 'stopped';\n  /** Belt travel direction. */\n  @Prop({ reflect: true }) direction: ConveyorDirection = 'forward';\n  /** Visual size. */\n  @Prop({ reflect: true }) size: EquipmentSize = 'md';\n  /** Equipment tag (e.g. \"CV-501\"). */\n  @Prop() tag?: string;\n  /** Human label. */\n  @Prop() label?: string;\n\n  render() {\n    const name = this.label ?? this.tag ?? 'conveyor';\n    return (\n      <Host role=\"img\" aria-label={`${name} — ${this.state}`}>\n        <svg class=\"symbol\" viewBox=\"0 0 64 28\" aria-hidden=\"true\">\n          <circle class=\"body\" cx=\"12\" cy=\"14\" r=\"9\" />\n          <circle class=\"body\" cx=\"52\" cy=\"14\" r=\"9\" />\n          <line class=\"stroke\" x1=\"12\" y1=\"5\" x2=\"52\" y2=\"5\" />\n          <line class=\"stroke\" x1=\"12\" y1=\"23\" x2=\"52\" y2=\"23\" />\n          <line class=\"belt\" x1=\"12\" y1=\"14\" x2=\"52\" y2=\"14\" />\n        </svg>\n        {(this.tag || this.label) && (\n          <div class=\"caption\">\n            {this.tag && <span class=\"tag\">{this.tag}</span>}\n            {this.label && <span class=\"label\">{this.label}</span>}\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/atoms/cooler/cooler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cooler.js","sourceRoot":"","sources":["../../../../src/components/atoms/cooler/cooler.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAQzD,MAAM,OAAO,SAAS;IACpB,qBAAqB;IACI,KAAK,GAAmB,SAAS,CAAC;IAC3D,mBAAmB;IACM,IAAI,GAAkB,IAAI,CAAC;IACpD,qCAAqC;IAC7B,GAAG,CAAU;IACrB,mBAAmB;IACX,KAAK,CAAU;IAEvB,MAAM;QACJ,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,GAAG,IAAI,QAAQ,CAAC;QAChD,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,KAAK,gBAAa,GAAG,IAAI,MAAM,IAAI,CAAC,KAAK,EAAE;YAEpD,4DAAK,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,WAAW,iBAAa,MAAM;gBACxD,+DAAQ,KAAK,EAAC,MAAM,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,IAAI,GAAG;gBAC9C,0DAAG,KAAK,EAAC,OAAO;oBACd,6DAAM,KAAK,EAAC,MAAM,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,GAAG;oBACrD,6DAAM,KAAK,EAAC,MAAM,EAAC,EAAE,EAAC,MAAM,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,MAAM,EAAC,EAAE,EAAC,IAAI,GAAG;oBACzD,6DAAM,KAAK,EAAC,MAAM,EAAC,EAAE,EAAC,MAAM,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,MAAM,EAAC,EAAE,EAAC,IAAI,GAAG,CACvD,CACA;YACL,CAAC,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAC3B,4DAAK,KAAK,EAAC,SAAS;gBACjB,IAAI,CAAC,GAAG,IAAI,6DAAM,KAAK,EAAC,KAAK,IAAE,IAAI,CAAC,GAAG,CAAQ;gBAC/C,IAAI,CAAC,KAAK,IAAI,6DAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CAClD,CACP,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Host } from '@stencil/core';\nimport type { EquipmentState, EquipmentSize } from '../_equipment/types';\n\n@Component({\n  tag: 'ind-cooler',\n  styleUrls: ['../_equipment/equipment.css', 'cooler.css'],\n  shadow: true,\n})\nexport class IndCooler {\n  /** Process state. */\n  @Prop({ reflect: true }) state: EquipmentState = 'stopped';\n  /** Visual size. */\n  @Prop({ reflect: true }) size: EquipmentSize = 'md';\n  /** Equipment tag (e.g. \"CL-701\"). */\n  @Prop() tag?: string;\n  /** Human label. */\n  @Prop() label?: string;\n\n  render() {\n    const name = this.label ?? this.tag ?? 'cooler';\n    return (\n      <Host role=\"img\" aria-label={`${name} — ${this.state}`}>\n        {/* Cooler: circle with a snowflake. */}\n        <svg class=\"symbol\" viewBox=\"0 0 48 48\" aria-hidden=\"true\">\n          <circle class=\"body\" cx=\"24\" cy=\"24\" r=\"16\" />\n          <g class=\"flake\">\n            <line class=\"coil\" x1=\"24\" y1=\"12\" x2=\"24\" y2=\"36\" />\n            <line class=\"coil\" x1=\"13.6\" y1=\"18\" x2=\"34.4\" y2=\"30\" />\n            <line class=\"coil\" x1=\"13.6\" y1=\"30\" x2=\"34.4\" y2=\"18\" />\n          </g>\n        </svg>\n        {(this.tag || this.label) && (\n          <div class=\"caption\">\n            {this.tag && <span class=\"tag\">{this.tag}</span>}\n            {this.label && <span class=\"label\">{this.label}</span>}\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/atoms/counter/counter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"counter.js","sourceRoot":"","sources":["../../../../src/components/atoms/counter/counter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAUzD,MAAM,OAAO,UAAU;IACrB,qBAAqB;IACb,KAAK,GAAW,CAAC,CAAC;IAE1B,mEAAmE;IAC3D,GAAG,CAAU;IAErB,sBAAsB;IACG,OAAO,GAAmB,SAAS,CAAC;IAE7D,YAAY;IACa,IAAI,GAAgB,IAAI,CAAC;IAElD,gDAAgD;IACxC,KAAK,CAAU;IAEvB,sEAAsE;IAC7C,WAAW,GAAY,KAAK,CAAC;IAE9C,OAAO;QACb,IAAI,IAAI,CAAC,GAAG,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG;YAAE,OAAO,GAAG,IAAI,CAAC,GAAG,GAAG,CAAC;QAC3E,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC;IAED,MAAM;QACJ,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,KAAK,KAAK,CAAC,CAAC;QACrD,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,QAAQ,gBAAa,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE;YAClF,IAAI,CAAC,KAAK,IAAI,6DAAM,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ;YACnE,6DAAM,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,IAAI,EAAC,OAAO,IAC1D,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,EAAE,CACtB,CACF,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type CounterVariant = 'neutral' | 'success' | 'info' | 'warning' | 'error';\nexport type CounterSize = 'sm' | 'md' | 'lg';\n\n@Component({\n  tag: 'ind-counter',\n  styleUrl: 'counter.css',\n  shadow: true,\n})\nexport class IndCounter {\n  /** Numeric value. */\n  @Prop() value: number = 0;\n\n  /** Clamp the displayed value, rendering e.g. \"99+\" beyond this. */\n  @Prop() max?: number;\n\n  /** Semantic color. */\n  @Prop({ reflect: true }) variant: CounterVariant = 'neutral';\n\n  /** Size. */\n  @Prop({ reflect: true }) size: CounterSize = 'md';\n\n  /** Optional label rendered before the count. */\n  @Prop() label?: string;\n\n  /** Render as a small circular dot when the value is 0 (no number). */\n  @Prop({ reflect: true }) dotWhenZero: boolean = false;\n\n  private display(): string {\n    if (this.max !== undefined && this.value > this.max) return `${this.max}+`;\n    return String(this.value);\n  }\n\n  render() {\n    const zeroDot = this.dotWhenZero && this.value === 0;\n    return (\n      <Host role=\"status\" aria-label={`${this.label ? this.label + ': ' : ''}${this.value}`}>\n        {this.label && <span class=\"label\" part=\"label\">{this.label}</span>}\n        <span class={{ count: true, 'is-dot': zeroDot }} part=\"count\">\n          {!zeroDot && this.display()}\n        </span>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/atoms/datetime-picker/datetime-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datetime-picker.js","sourceRoot":"","sources":["../../../../src/components/atoms/datetime-picker/datetime-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAU9E,MAAM,OAAO,iBAAiB;IAC5B,mDAAmD;IAC1B,IAAI,GAAiB,gBAAgB,CAAC;IAC/D,yBAAyB;IACA,KAAK,GAAW,EAAE,CAAC;IAC5C,uBAAuB;IACf,GAAG,CAAU;IACrB,uBAAuB;IACf,GAAG,CAAU;IACrB,2CAA2C;IACnC,IAAI,CAAmB;IAC/B,gBAAgB;IACS,QAAQ,GAAY,KAAK,CAAC;IACnD,qBAAqB;IACI,OAAO,GAAY,KAAK,CAAC;IAClD,YAAY;IACa,IAAI,GAAiB,IAAI,CAAC;IACnD,qBAAqB;IACb,KAAK,CAAU;IACvB,0BAA0B;IAClB,IAAI,CAAU;IAEtB,uBAAuB;IACd,SAAS,CAAwB;IAElC,QAAQ,GAAG,CAAC,CAAQ,EAAE,EAAE;QAC9B,MAAM,CAAC,GAAI,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC;QAC/C,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC;QACf,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,8DAAO,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM;gBAC5B,IAAI,CAAC,KAAK,IAAI,6DAAM,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ;gBACnE,8DACE,KAAK,EAAC,OAAO,EACb,IAAI,EAAC,OAAO,EACZ,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,IAAI,EAAE,IAAI,CAAC,IAAyB,EACpC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,kBACT,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,gBACjC,IAAI,CAAC,KAAK,EACtB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GACvB,CACI,CACH,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\n\nexport type DateTimeMode = 'datetime-local' | 'date' | 'time' | 'month' | 'week';\nexport type DateTimeSize = 'sm' | 'md' | 'lg';\n\n@Component({\n  tag: 'ind-datetime-picker',\n  styleUrl: 'datetime-picker.css',\n  shadow: true,\n})\nexport class IndDateTimePicker {\n  /** Picker mode (maps to the native input type). */\n  @Prop({ reflect: true }) mode: DateTimeMode = 'datetime-local';\n  /** Current ISO value. */\n  @Prop({ mutable: true }) value: string = '';\n  /** Min bound (ISO). */\n  @Prop() min?: string;\n  /** Max bound (ISO). */\n  @Prop() max?: string;\n  /** Step (seconds for time-based modes). */\n  @Prop() step?: number | string;\n  /** Disabled. */\n  @Prop({ reflect: true }) disabled: boolean = false;\n  /** Invalid state. */\n  @Prop({ reflect: true }) invalid: boolean = false;\n  /** Size. */\n  @Prop({ reflect: true }) size: DateTimeSize = 'md';\n  /** Visible label. */\n  @Prop() label?: string;\n  /** Field name (forms). */\n  @Prop() name?: string;\n\n  /** Fires on commit. */\n  @Event() indChange!: EventEmitter<string>;\n\n  private onChange = (e: Event) => {\n    const v = (e.target as HTMLInputElement).value;\n    this.value = v;\n    this.indChange.emit(v);\n  };\n\n  render() {\n    return (\n      <Host>\n        <label class=\"wrap\" part=\"wrap\">\n          {this.label && <span class=\"label\" part=\"label\">{this.label}</span>}\n          <input\n            class=\"input\"\n            part=\"input\"\n            type={this.mode}\n            value={this.value}\n            min={this.min}\n            max={this.max}\n            step={this.step as unknown as string}\n            name={this.name}\n            disabled={this.disabled}\n            aria-invalid={this.invalid ? 'true' : 'false'}\n            aria-label={this.label}\n            onChange={this.onChange}\n          />\n        </label>\n      </Host>\n    );\n  }\n}\n"]}