@ind-ds/core 0.1.1 → 0.2.0

package/dist/collection/components/molecules/speed-control/speed-control.js

@@ -0,0 +1,251 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Speed / rate control. Renders a slider (default) or knob for the operator to
+ * set a percentage or engineering speed, and re-emits live + committed values.
+ */
+export class IndSpeedControl {
+    /** Control name (e.g. "Conveyor speed"). */
+    label;
+    /** Current value (two-way). */
+    value = 0;
+    min = 0;
+    max = 100;
+    step = 1;
+    /** Unit (default %). */
+    unit = '%';
+    disabled = false;
+    /** Input widget. */
+    variant = 'slider';
+    /** Live value while dragging. */
+    indInput;
+    /** Committed value. */
+    indChange;
+    onInput = (e) => {
+        e.stopPropagation();
+        this.value = e.detail;
+        this.indInput.emit(e.detail);
+    };
+    onChange = (e) => {
+        e.stopPropagation();
+        this.value = e.detail;
+        this.indChange.emit(e.detail);
+    };
+    render() {
+        return (h(Host, { key: '9d36c2050ac90d11a70432f2caa3f60632a8ae41' }, h("div", { key: '9dfdd9e4bdec6ff00581cdd62c3824bc68a9e8f4', class: "card-head" }, h("span", { key: 'ed439908c8ab1cefd1d5c43a6eb3a454d0f47965', class: "card-title", part: "label" }, this.label)), this.variant === 'knob' ? (h("ind-knob", { part: "control", value: this.value, min: this.min, max: this.max, step: this.step, unit: this.unit, disabled: this.disabled, showValue: true, size: "md", onIndInput: this.onInput, onIndChange: this.onChange })) : (h("ind-slider", { part: "control", value: this.value, min: this.min, max: this.max, step: this.step, unit: this.unit, disabled: this.disabled, showValue: true, size: "md", onIndInput: this.onInput, onIndChange: this.onChange }))));
+    }
+    static get is() { return "ind-speed-control"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../_shared/card.css", "speed-control.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["../_shared/card.css", "speed-control.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Control name (e.g. \"Conveyor speed\")."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "label"
+            },
+            "value": {
+                "type": "number",
+                "mutable": true,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Current value (two-way)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "value",
+                "defaultValue": "0"
+            },
+            "min": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "min",
+                "defaultValue": "0"
+            },
+            "max": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "max",
+                "defaultValue": "100"
+            },
+            "step": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "step",
+                "defaultValue": "1"
+            },
+            "unit": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Unit (default %)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "unit",
+                "defaultValue": "'%'"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            },
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "SpeedControlVariant",
+                    "resolved": "\"knob\" | \"slider\"",
+                    "references": {
+                        "SpeedControlVariant": {
+                            "location": "local",
+                            "path": "/home/runner/work/ind-ds/ind-ds/packages/core/src/components/molecules/speed-control/speed-control.tsx",
+                            "id": "src/components/molecules/speed-control/speed-control.tsx::SpeedControlVariant"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Input widget."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "variant",
+                "defaultValue": "'slider'"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "indInput",
+                "name": "indInput",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Live value while dragging."
+                },
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                }
+            }, {
+                "method": "indChange",
+                "name": "indChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Committed value."
+                },
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                }
+            }];
+    }
+}
+//# sourceMappingURL=speed-control.js.map

package/dist/collection/components/molecules/speed-control/speed-control.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"speed-control.js","sourceRoot":"","sources":["../../../../src/components/molecules/speed-control/speed-control.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAI9E;;;GAGG;AAMH,MAAM,OAAO,eAAe;IAC1B,4CAA4C;IACpC,KAAK,CAAU;IACvB,+BAA+B;IACN,KAAK,GAAW,CAAC,CAAC;IACnC,GAAG,GAAW,CAAC,CAAC;IAChB,GAAG,GAAW,GAAG,CAAC;IAClB,IAAI,GAAW,CAAC,CAAC;IACzB,wBAAwB;IAChB,IAAI,GAAW,GAAG,CAAC;IACnB,QAAQ,GAAY,KAAK,CAAC;IAClC,oBAAoB;IACZ,OAAO,GAAwB,QAAQ,CAAC;IAEhD,iCAAiC;IACxB,QAAQ,CAAwB;IACzC,uBAAuB;IACd,SAAS,CAAwB;IAElC,OAAO,GAAG,CAAC,CAAsB,EAAE,EAAE;QAC3C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC;QACtB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;IAC/B,CAAC,CAAC;IACM,QAAQ,GAAG,CAAC,CAAsB,EAAE,EAAE;QAC5C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC;QACtB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;IAChC,CAAC,CAAC;IAEF,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,WAAW;gBACpB,6DAAM,KAAK,EAAC,YAAY,EAAC,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CACrD;YACL,IAAI,CAAC,OAAO,KAAK,MAAM,CAAC,CAAC,CAAC,CACzB,gBACE,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,QACT,IAAI,EAAC,IAAI,EACT,UAAU,EAAE,IAAI,CAAC,OAAO,EACxB,WAAW,EAAE,IAAI,CAAC,QAAQ,GAC1B,CACH,CAAC,CAAC,CAAC,CACF,kBACE,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,QACT,IAAI,EAAC,IAAI,EACT,UAAU,EAAE,IAAI,CAAC,OAAO,EACxB,WAAW,EAAE,IAAI,CAAC,QAAQ,GAC1B,CACH,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\n\nexport type SpeedControlVariant = 'slider' | 'knob';\n\n/**\n * Speed / rate control. Renders a slider (default) or knob for the operator to\n * set a percentage or engineering speed, and re-emits live + committed values.\n */\n@Component({\n  tag: 'ind-speed-control',\n  styleUrls: ['../_shared/card.css', 'speed-control.css'],\n  shadow: true,\n})\nexport class IndSpeedControl {\n  /** Control name (e.g. \"Conveyor speed\"). */\n  @Prop() label!: string;\n  /** Current value (two-way). */\n  @Prop({ mutable: true }) value: number = 0;\n  @Prop() min: number = 0;\n  @Prop() max: number = 100;\n  @Prop() step: number = 1;\n  /** Unit (default %). */\n  @Prop() unit: string = '%';\n  @Prop() disabled: boolean = false;\n  /** Input widget. */\n  @Prop() variant: SpeedControlVariant = 'slider';\n\n  /** Live value while dragging. */\n  @Event() indInput!: EventEmitter<number>;\n  /** Committed value. */\n  @Event() indChange!: EventEmitter<number>;\n\n  private onInput = (e: CustomEvent<number>) => {\n    e.stopPropagation();\n    this.value = e.detail;\n    this.indInput.emit(e.detail);\n  };\n  private onChange = (e: CustomEvent<number>) => {\n    e.stopPropagation();\n    this.value = e.detail;\n    this.indChange.emit(e.detail);\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class=\"card-head\">\n          <span class=\"card-title\" part=\"label\">{this.label}</span>\n        </div>\n        {this.variant === 'knob' ? (\n          <ind-knob\n            part=\"control\"\n            value={this.value}\n            min={this.min}\n            max={this.max}\n            step={this.step}\n            unit={this.unit}\n            disabled={this.disabled}\n            showValue\n            size=\"md\"\n            onIndInput={this.onInput}\n            onIndChange={this.onChange}\n          />\n        ) : (\n          <ind-slider\n            part=\"control\"\n            value={this.value}\n            min={this.min}\n            max={this.max}\n            step={this.step}\n            unit={this.unit}\n            disabled={this.disabled}\n            showValue\n            size=\"md\"\n            onIndInput={this.onInput}\n            onIndChange={this.onChange}\n          />\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/molecules/start-stop-control/start-stop-control.css

@@ -0,0 +1,24 @@
+:host {
+  min-width: 180px;
+  gap: var(--ind-spacing-4, 8px);
+}
+
+.head {
+  display: flex;
+  align-items: center;
+  gap: var(--ind-spacing-3, 6px);
+}
+
+.label {
+  font-size: var(--ind-font-size-md, 13px);
+  font-weight: var(--ind-font-weight-medium, 500);
+}
+
+.buttons {
+  display: flex;
+  gap: var(--ind-spacing-4, 8px);
+}
+
+.buttons ind-button {
+  flex: 1 1 0;
+}

package/dist/collection/components/molecules/start-stop-control/start-stop-control.js

@@ -0,0 +1,208 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Start / stop command pair with a running LED. Emits discrete `indStart` /
+ * `indStop` events; the parent owns the command logic and reflects state back.
+ */
+export class IndStartStopControl {
+    /** Equipment label. */
+    label;
+    /** Current run state — drives the LED and disables the redundant button. */
+    state = 'stopped';
+    /** Disable both commands. */
+    disabled = false;
+    /** Require a press-and-hold (ms) on Start to avoid accidental starts. */
+    holdToStartMs;
+    startLabel = 'Start';
+    stopLabel = 'Stop';
+    /** Fires when Start is activated. */
+    indStart;
+    /** Fires when Stop is activated. */
+    indStop;
+    isRunning() {
+        return this.state === 'running' || this.state === 'starting';
+    }
+    render() {
+        const ledState = this.state === 'fault'
+            ? 'fault'
+            : this.state === 'running'
+                ? 'running'
+                : this.state === 'starting' || this.state === 'stopping'
+                    ? 'warning'
+                    : 'stopped';
+        return (h(Host, { key: 'c548fa2649cbe177d1597c84d157625dadf09a5c', role: "group", "aria-label": this.label ?? 'Start stop control' }, h("div", { key: '653531b39e8997e8b353ad87f8f80684ca4d5095', class: "head", part: "head" }, h("ind-led", { key: '9c266b4ce3360f84ca14401e37dc2940986cd665', state: ledState, size: "md", blinking: this.state === 'starting' || this.state === 'stopping' }), this.label && h("span", { key: 'f9efc9efdc8b1c45c3ab4ae72210a3762d4a7e7b', class: "label", part: "label" }, this.label)), h("div", { key: '8aa2c5b3bda5f44d5ffe2b11be7e6bb64717f287', class: "buttons", part: "buttons" }, h("ind-button", { key: '21883367d40e0f6eb6d485cdc3adad5d6b17f6b4', variant: "primary", size: "md", label: this.startLabel, disabled: this.disabled || this.isRunning(), holdToConfirmMs: this.holdToStartMs, onIndActivate: () => this.indStart.emit() }), h("ind-button", { key: 'b53ddfd89c91d7b7c3e0cc5ae307318f70b2ffef', variant: "danger", size: "md", label: this.stopLabel, disabled: this.disabled || this.state === 'stopped', onIndActivate: () => this.indStop.emit() }))));
+    }
+    static get is() { return "ind-start-stop-control"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../_shared/card.css", "start-stop-control.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["../_shared/card.css", "start-stop-control.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Equipment label."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "label"
+            },
+            "state": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "RunState",
+                    "resolved": "\"fault\" | \"running\" | \"starting\" | \"stopped\" | \"stopping\"",
+                    "references": {
+                        "RunState": {
+                            "location": "local",
+                            "path": "/home/runner/work/ind-ds/ind-ds/packages/core/src/components/molecules/start-stop-control/start-stop-control.tsx",
+                            "id": "src/components/molecules/start-stop-control/start-stop-control.tsx::RunState"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Current run state \u2014 drives the LED and disables the redundant button."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "state",
+                "defaultValue": "'stopped'"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Disable both commands."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            },
+            "holdToStartMs": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Require a press-and-hold (ms) on Start to avoid accidental starts."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "hold-to-start-ms"
+            },
+            "startLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "start-label",
+                "defaultValue": "'Start'"
+            },
+            "stopLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "stop-label",
+                "defaultValue": "'Stop'"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "indStart",
+                "name": "indStart",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Fires when Start is activated."
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }, {
+                "method": "indStop",
+                "name": "indStop",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Fires when Stop is activated."
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
+}
+//# sourceMappingURL=start-stop-control.js.map

package/dist/collection/components/molecules/start-stop-control/start-stop-control.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"start-stop-control.js","sourceRoot":"","sources":["../../../../src/components/molecules/start-stop-control/start-stop-control.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAI9E;;;GAGG;AAMH,MAAM,OAAO,mBAAmB;IAC9B,uBAAuB;IACf,KAAK,CAAU;IACvB,4EAA4E;IACnD,KAAK,GAAa,SAAS,CAAC;IACrD,6BAA6B;IACrB,QAAQ,GAAY,KAAK,CAAC;IAClC,yEAAyE;IACjE,aAAa,CAAU;IACvB,UAAU,GAAW,OAAO,CAAC;IAC7B,SAAS,GAAW,MAAM,CAAC;IAEnC,qCAAqC;IAC5B,QAAQ,CAAsB;IACvC,oCAAoC;IAC3B,OAAO,CAAsB;IAE9B,SAAS;QACf,OAAO,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,KAAK,UAAU,CAAC;IAC/D,CAAC;IAED,MAAM;QACJ,MAAM,QAAQ,GACZ,IAAI,CAAC,KAAK,KAAK,OAAO;YACpB,CAAC,CAAC,OAAO;YACT,CAAC,CAAC,IAAI,CAAC,KAAK,KAAK,SAAS;gBACxB,CAAC,CAAC,SAAS;gBACX,CAAC,CAAC,IAAI,CAAC,KAAK,KAAK,UAAU,IAAI,IAAI,CAAC,KAAK,KAAK,UAAU;oBACtD,CAAC,CAAC,SAAS;oBACX,CAAC,CAAC,SAAS,CAAC;QACpB,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,OAAO,gBAAa,IAAI,CAAC,KAAK,IAAI,oBAAoB;YAC/D,4DAAK,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM;gBAC3B,gEAAS,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAC,IAAI,EAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,KAAK,UAAU,IAAI,IAAI,CAAC,KAAK,KAAK,UAAU,GAAI;gBACvG,IAAI,CAAC,KAAK,IAAI,6DAAM,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CAC/D;YACN,4DAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,SAAS;gBACjC,mEACE,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,IAAI,EACT,KAAK,EAAE,IAAI,CAAC,UAAU,EACtB,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,SAAS,EAAE,EAC3C,eAAe,EAAE,IAAI,CAAC,aAAa,EACnC,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,GACzC;gBACF,mEACE,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAC,IAAI,EACT,KAAK,EAAE,IAAI,CAAC,SAAS,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,EACnD,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GACxC,CACE,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\n\nexport type RunState = 'running' | 'stopped' | 'fault' | 'starting' | 'stopping';\n\n/**\n * Start / stop command pair with a running LED. Emits discrete `indStart` /\n * `indStop` events; the parent owns the command logic and reflects state back.\n */\n@Component({\n  tag: 'ind-start-stop-control',\n  styleUrls: ['../_shared/card.css', 'start-stop-control.css'],\n  shadow: true,\n})\nexport class IndStartStopControl {\n  /** Equipment label. */\n  @Prop() label?: string;\n  /** Current run state — drives the LED and disables the redundant button. */\n  @Prop({ reflect: true }) state: RunState = 'stopped';\n  /** Disable both commands. */\n  @Prop() disabled: boolean = false;\n  /** Require a press-and-hold (ms) on Start to avoid accidental starts. */\n  @Prop() holdToStartMs?: number;\n  @Prop() startLabel: string = 'Start';\n  @Prop() stopLabel: string = 'Stop';\n\n  /** Fires when Start is activated. */\n  @Event() indStart!: EventEmitter<void>;\n  /** Fires when Stop is activated. */\n  @Event() indStop!: EventEmitter<void>;\n\n  private isRunning() {\n    return this.state === 'running' || this.state === 'starting';\n  }\n\n  render() {\n    const ledState =\n      this.state === 'fault'\n        ? 'fault'\n        : this.state === 'running'\n          ? 'running'\n          : this.state === 'starting' || this.state === 'stopping'\n            ? 'warning'\n            : 'stopped';\n    return (\n      <Host role=\"group\" aria-label={this.label ?? 'Start stop control'}>\n        <div class=\"head\" part=\"head\">\n          <ind-led state={ledState} size=\"md\" blinking={this.state === 'starting' || this.state === 'stopping'} />\n          {this.label && <span class=\"label\" part=\"label\">{this.label}</span>}\n        </div>\n        <div class=\"buttons\" part=\"buttons\">\n          <ind-button\n            variant=\"primary\"\n            size=\"md\"\n            label={this.startLabel}\n            disabled={this.disabled || this.isRunning()}\n            holdToConfirmMs={this.holdToStartMs}\n            onIndActivate={() => this.indStart.emit()}\n          />\n          <ind-button\n            variant=\"danger\"\n            size=\"md\"\n            label={this.stopLabel}\n            disabled={this.disabled || this.state === 'stopped'}\n            onIndActivate={() => this.indStop.emit()}\n          />\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/molecules/tag-card/tag-card.css

@@ -0,0 +1,7 @@
+:host {
+  min-width: 150px;
+}
+
+.card-head {
+  align-items: center;
+}