@ind-ds/core 0.1.1 → 0.2.0

package/dist/collection/components/organisms/recipe-management-panel/recipe-management-panel.js

@@ -0,0 +1,205 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Recipe management panel: pick / load a recipe, review its parameter set and
+ * save edits. Combines `<ind-recipe-selector>` with a parameter list.
+ */
+export class IndRecipeManagementPanel {
+    heading = 'Recipe management';
+    /** Available recipes. */
+    recipes = [];
+    /** Selected recipe (two-way). */
+    value;
+    /** Parameters of the selected recipe. */
+    parameters = [];
+    /** Allow editing the parameters. */
+    editable = false;
+    indChange;
+    indLoad;
+    indSave;
+    onChange = (e) => {
+        e.stopPropagation();
+        this.value = e.detail;
+        this.indChange.emit(e.detail);
+    };
+    onLoad = (e) => {
+        e.stopPropagation();
+        this.indLoad.emit(e.detail);
+    };
+    render() {
+        return (h(Host, { key: '311d5f0738f97dc9644bfe14e6df5ee107132e80' }, h("div", { key: '8607f97cedf5ae4d8e9c1a321b8aba04d7d68344', class: "panel-head" }, h("span", { key: '2662cd5984dd0e1cef9231101451606fba385153', class: "panel-title", part: "heading" }, this.heading), h("div", { key: 'a9e120fbef91e4899e3340db5aa600b3d4a4737d', class: "panel-actions" }, h("ind-button", { key: '49dde298969047d4b94d4d58152987f42cb15863', variant: "primary", size: "sm", label: "Save", disabled: !this.editable, onIndActivate: () => this.indSave.emit() }))), h("div", { key: '792a6a721b2a7a2f98160bccee674b0449f1d3df', class: "panel-body" }, h("ind-recipe-selector", { key: '32ad3a8d71a5e3c0c28f716c94159a40bcd24c69', label: "Recipe", options: this.recipes, value: this.value, onIndChange: this.onChange, onIndLoad: this.onLoad }), this.parameters.length > 0 && (h("div", { key: 'b63fa62ebe8eb41f4d7a199229ad411a38aa2573', class: "params", part: "params" }, this.parameters.map((p, i) => (h("ind-batch-parameter-row", { key: i, label: p.label, value: p.value, unit: p.unit, target: p.target, disabled: !this.editable }))))))));
+    }
+    static get is() { return "ind-recipe-management-panel"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../_shared/panel.css", "../_shared/control-panel.css", "recipe-management-panel.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["../_shared/panel.css", "../_shared/control-panel.css", "recipe-management-panel.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "heading": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "heading",
+                "defaultValue": "'Recipe management'"
+            },
+            "recipes": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "SelectOption[]",
+                    "resolved": "SelectOption[]",
+                    "references": {
+                        "SelectOption": {
+                            "location": "import",
+                            "path": "../../atoms/select/select",
+                            "id": "src/components/atoms/select/select.tsx::SelectOption",
+                            "referenceLocation": "SelectOption"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Available recipes."
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "value": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Selected recipe (two-way)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "value"
+            },
+            "parameters": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "BatchParam[]",
+                    "resolved": "BatchParam[]",
+                    "references": {
+                        "BatchParam": {
+                            "location": "import",
+                            "path": "../batch-control-panel/batch-control-panel",
+                            "id": "src/components/organisms/batch-control-panel/batch-control-panel.tsx::BatchParam",
+                            "referenceLocation": "BatchParam"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Parameters of the selected recipe."
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "editable": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Allow editing the parameters."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "editable",
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "indChange",
+                "name": "indChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                }
+            }, {
+                "method": "indLoad",
+                "name": "indLoad",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                }
+            }, {
+                "method": "indSave",
+                "name": "indSave",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
+}
+//# sourceMappingURL=recipe-management-panel.js.map

package/dist/collection/components/organisms/recipe-management-panel/recipe-management-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"recipe-management-panel.js","sourceRoot":"","sources":["../../../../src/components/organisms/recipe-management-panel/recipe-management-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAI9E;;;GAGG;AAMH,MAAM,OAAO,wBAAwB;IAC3B,OAAO,GAAW,mBAAmB,CAAC;IAC9C,yBAAyB;IACjB,OAAO,GAAmB,EAAE,CAAC;IACrC,iCAAiC;IACR,KAAK,CAAU;IACxC,yCAAyC;IACjC,UAAU,GAAiB,EAAE,CAAC;IACtC,oCAAoC;IAC5B,QAAQ,GAAY,KAAK,CAAC;IAEzB,SAAS,CAAwB;IACjC,OAAO,CAAwB;IAC/B,OAAO,CAAsB;IAE9B,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;IACM,MAAM,GAAG,CAAC,CAAsB,EAAE,EAAE;QAC1C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;IAC9B,CAAC,CAAC;IAEF,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,YAAY;gBACrB,6DAAM,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,SAAS,IAAE,IAAI,CAAC,OAAO,CAAQ;gBAC9D,4DAAK,KAAK,EAAC,eAAe;oBACxB,mEACE,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,IAAI,EACT,KAAK,EAAC,MAAM,EACZ,QAAQ,EAAE,CAAC,IAAI,CAAC,QAAQ,EACxB,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GACxC,CACE,CACF;YACN,4DAAK,KAAK,EAAC,YAAY;gBACrB,4EACE,KAAK,EAAC,QAAQ,EACd,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,QAAQ,EAC1B,SAAS,EAAE,IAAI,CAAC,MAAM,GACtB;gBACD,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,IAAI,CAC7B,4DAAK,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,IAC9B,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAC7B,+BACE,GAAG,EAAE,CAAC,EACN,KAAK,EAAE,CAAC,CAAC,KAAK,EACd,KAAK,EAAE,CAAC,CAAC,KAAK,EACd,IAAI,EAAE,CAAC,CAAC,IAAI,EACZ,MAAM,EAAE,CAAC,CAAC,MAAM,EAChB,QAAQ,EAAE,CAAC,IAAI,CAAC,QAAQ,GACxB,CACH,CAAC,CACE,CACP,CACG,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\nimport type { SelectOption } from '../../atoms/select/select';\nimport type { BatchParam } from '../batch-control-panel/batch-control-panel';\n\n/**\n * Recipe management panel: pick / load a recipe, review its parameter set and\n * save edits. Combines `<ind-recipe-selector>` with a parameter list.\n */\n@Component({\n  tag: 'ind-recipe-management-panel',\n  styleUrls: ['../_shared/panel.css', '../_shared/control-panel.css', 'recipe-management-panel.css'],\n  shadow: true,\n})\nexport class IndRecipeManagementPanel {\n  @Prop() heading: string = 'Recipe management';\n  /** Available recipes. */\n  @Prop() recipes: SelectOption[] = [];\n  /** Selected recipe (two-way). */\n  @Prop({ mutable: true }) value?: string;\n  /** Parameters of the selected recipe. */\n  @Prop() parameters: BatchParam[] = [];\n  /** Allow editing the parameters. */\n  @Prop() editable: boolean = false;\n\n  @Event() indChange!: EventEmitter<string>;\n  @Event() indLoad!: EventEmitter<string>;\n  @Event() indSave!: EventEmitter<void>;\n\n  private onChange = (e: CustomEvent<string>) => {\n    e.stopPropagation();\n    this.value = e.detail;\n    this.indChange.emit(e.detail);\n  };\n  private onLoad = (e: CustomEvent<string>) => {\n    e.stopPropagation();\n    this.indLoad.emit(e.detail);\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class=\"panel-head\">\n          <span class=\"panel-title\" part=\"heading\">{this.heading}</span>\n          <div class=\"panel-actions\">\n            <ind-button\n              variant=\"primary\"\n              size=\"sm\"\n              label=\"Save\"\n              disabled={!this.editable}\n              onIndActivate={() => this.indSave.emit()}\n            />\n          </div>\n        </div>\n        <div class=\"panel-body\">\n          <ind-recipe-selector\n            label=\"Recipe\"\n            options={this.recipes}\n            value={this.value}\n            onIndChange={this.onChange}\n            onIndLoad={this.onLoad}\n          />\n          {this.parameters.length > 0 && (\n            <div class=\"params\" part=\"params\">\n              {this.parameters.map((p, i) => (\n                <ind-batch-parameter-row\n                  key={i}\n                  label={p.label}\n                  value={p.value}\n                  unit={p.unit}\n                  target={p.target}\n                  disabled={!this.editable}\n                />\n              ))}\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/organisms/sidebar-nav/sidebar-nav.js

@@ -8,7 +8,7 @@ import { h, Host } from "@stencil/core";
  */
 export class IndSidebarNav {
     render() {
-        return (h(Host, { key: '3ffd6c6d8afe2ed104b24ad1435d7a1d163c5071', role: "navigation" }, h("div", { key: '2a56d85274fca7043d8e5624a93cb99c8767fc74', class: "brand", part: "brand" }, h("slot", { key: 'd185e1c6570b33648700dd922e671f023b3d34fc', name: "brand" })), h("div", { key: '31aaa48b8e08549a3a4990cbe4ae74507b0a8ccb', class: "items", part: "items" }, h("slot", { key: '4ddb250ed915874ea6114588ab336e662526383f' })), h("div", { key: 'd666ea3f666be22246d6f2e2464a85b741b4bfed', class: "footer", part: "footer" }, h("slot", { key: 'fff6600b601ec97d47f2a79b983d0a7ef261db33', name: "footer" }))));
+        return (h(Host, { key: '9d04eb64c4d78199a2675d8f8908783ee03c592d', role: "navigation" }, h("div", { key: 'a4cda235f70f218c1b0074997f51484599ee1cec', class: "brand", part: "brand" }, h("slot", { key: 'ed5d43d3e799902dba9f0e725186c80ea80d9ff1', name: "brand" })), h("div", { key: '21178ccce78cf2f294d0eb93c38417db8f5a749d', class: "items", part: "items" }, h("slot", { key: '5902adf3f49022bd38fddf31edf43c458c5e7b8f' })), h("div", { key: '0789a9c4b2705f258108a77ecd1d898a5104ce85', class: "footer", part: "footer" }, h("slot", { key: '87c03fb3608b92aa1130017d79eb2fd556de5ca4', name: "footer" }))));
     }
     static get is() { return "ind-sidebar-nav"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/organisms/status-bar/status-bar.js

@@ -9,7 +9,7 @@ export class IndStatusBar {
     state = 'neutral';
     message;
     render() {
-        return (h(Host, { key: 'ea26634fed8ac15e259de910eb7bcd4e5ce3d094', role: "status", "aria-live": "polite" }, h("ind-status-dot", { key: 'a9305e75e5b0e35c5cccf526020ed00177d729e4', state: this.state, size: "sm" }), this.message && h("span", { key: '816506e0c34aaf66249bcca19fa0741841a1dae5', class: "message", part: "message" }, this.message), h("span", { key: '15edfed427f793ad354d7b71e256149323ab59b4', class: "spacer" }), h("span", { key: 'abd85f3229fbc9ad3e6257400a87bab0e9743dae', class: "end", part: "end" }, h("slot", { key: 'bc0a1f8844f91d9158ec4f265ae12cc27b443740' }))));
+        return (h(Host, { key: '0e24fa0f2693d5756328492c64d61278f52ba1aa', role: "status", "aria-live": "polite" }, h("ind-status-dot", { key: 'b3c8d0f81d67fc1c0968a5400e3e2b1ffea6e050', state: this.state, size: "sm" }), this.message && h("span", { key: 'd6c47a4b16ed872430df471f9980c4dde551a963', class: "message", part: "message" }, this.message), h("span", { key: '833ee65843c75d0df1b95ecbf29390d848147bc6', class: "spacer" }), h("span", { key: '71d6fb61744466c96639fe8e5c6b922c891d5b8d', class: "end", part: "end" }, h("slot", { key: '188dec4734c910b1da01047f0a4ccb530f267640' }))));
     }
     static get is() { return "ind-status-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/organisms/trend-viewer/trend-viewer.css

@@ -0,0 +1,45 @@
+:host {
+  min-width: 360px;
+}
+
+.series {
+  display: flex;
+  flex-direction: column;
+  gap: var(--ind-spacing-2, 4px);
+}
+
+.series-head {
+  display: flex;
+  align-items: baseline;
+  gap: var(--ind-spacing-3, 6px);
+  font-size: var(--ind-font-size-sm, 11px);
+}
+
+.series-label {
+  color: var(--ind-surface-text-secondary);
+}
+
+.series-value {
+  margin-left: auto;
+  font-family: var(--ind-font-family-mono);
+  font-weight: var(--ind-font-weight-semibold, 600);
+  color: var(--ind-surface-text-primary);
+}
+
+.legend {
+  width: 10px;
+  height: 10px;
+  border-radius: 2px;
+  flex: 0 0 auto;
+  background: var(--ind-surface-text-muted);
+}
+
+.legend-running { background: var(--ind-state-running-bg, #16a34a); }
+.legend-warning { background: var(--ind-state-warning-bg, #f59e0b); }
+.legend-fault { background: var(--ind-state-fault-bg, #dc2626); }
+.legend-default { background: var(--ind-color-palette-cyan-300, #22d3ee); }
+
+.series-spark {
+  width: 100%;
+  height: 40px;
+}

package/dist/collection/components/organisms/trend-viewer/trend-viewer.js

@@ -0,0 +1,81 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Multi-series trend viewer. Stacks one labelled `<ind-sparkline>` per series
+ * with the current value, for comparing several tags without a full charting
+ * library.
+ */
+export class IndTrendViewer {
+    heading = 'Trends';
+    /** Series to plot. */
+    series = [];
+    last(s) {
+        if (!s.points.length)
+            return '--';
+        const v = s.points[s.points.length - 1];
+        return s.precision !== undefined ? v.toFixed(s.precision) : String(v);
+    }
+    render() {
+        return (h(Host, { key: '41e4221a264008e8405251a8701cc16576758fe7' }, h("div", { key: '9c0684d404e77dbb2de77d1873b933f58a420e85', class: "panel-head" }, h("span", { key: '596e6de04ef55e07038c9d7c78cbf258767c7699', class: "panel-title", part: "heading" }, this.heading)), h("div", { key: 'fd80bafe1fbe0a0f7bccc713a6ec0a13b5eb53b3', class: "panel-body" }, this.series.length === 0 ? (h("div", { class: "panel-empty" }, "No series")) : (this.series.map((s, i) => (h("div", { class: "series", part: "series", key: i }, h("div", { class: "series-head" }, h("span", { class: `legend legend-${s.variant ?? 'default'}`, "aria-hidden": "true" }), h("span", { class: "series-label" }, s.label), h("span", { class: "series-value" }, this.last(s), s.unit ? ` ${s.unit}` : '')), h("ind-sparkline", { class: "series-spark", points: s.points, variant: s.variant ?? 'default', area: true }))))))));
+    }
+    static get is() { return "ind-trend-viewer"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../_shared/panel.css", "trend-viewer.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["../_shared/panel.css", "trend-viewer.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "heading": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "heading",
+                "defaultValue": "'Trends'"
+            },
+            "series": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "TrendSeries[]",
+                    "resolved": "TrendSeries[]",
+                    "references": {
+                        "TrendSeries": {
+                            "location": "local",
+                            "path": "/home/runner/work/ind-ds/ind-ds/packages/core/src/components/organisms/trend-viewer/trend-viewer.tsx",
+                            "id": "src/components/organisms/trend-viewer/trend-viewer.tsx::TrendSeries"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Series to plot."
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            }
+        };
+    }
+}
+//# sourceMappingURL=trend-viewer.js.map

package/dist/collection/components/organisms/trend-viewer/trend-viewer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"trend-viewer.js","sourceRoot":"","sources":["../../../../src/components/organisms/trend-viewer/trend-viewer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAWzD;;;;GAIG;AAMH,MAAM,OAAO,cAAc;IACjB,OAAO,GAAW,QAAQ,CAAC;IACnC,sBAAsB;IACd,MAAM,GAAkB,EAAE,CAAC;IAE3B,IAAI,CAAC,CAAc;QACzB,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM;YAAE,OAAO,IAAI,CAAC;QAClC,MAAM,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACxC,OAAO,CAAC,CAAC,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACxE,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,YAAY;gBACrB,6DAAM,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,SAAS,IAAE,IAAI,CAAC,OAAO,CAAQ,CAC1D;YACN,4DAAK,KAAK,EAAC,YAAY,IACpB,IAAI,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,CAC1B,WAAK,KAAK,EAAC,aAAa,gBAAgB,CACzC,CAAC,CAAC,CAAC,CACF,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACxB,WAAK,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC;gBACtC,WAAK,KAAK,EAAC,aAAa;oBACtB,YAAM,KAAK,EAAE,iBAAiB,CAAC,CAAC,OAAO,IAAI,SAAS,EAAE,iBAAc,MAAM,GAAQ;oBAClF,YAAM,KAAK,EAAC,cAAc,IAAE,CAAC,CAAC,KAAK,CAAQ;oBAC3C,YAAM,KAAK,EAAC,cAAc;wBACvB,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;wBAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CACpC,CACH;gBACN,qBAAe,KAAK,EAAC,cAAc,EAAC,MAAM,EAAE,CAAC,CAAC,MAAM,EAAE,OAAO,EAAE,CAAC,CAAC,OAAO,IAAI,SAAS,EAAE,IAAI,SAAiB,CACxG,CACP,CAAC,CACH,CACG,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Host } from '@stencil/core';\nimport type { TrendVariant } from '../../molecules/trend-widget/trend-widget';\n\nexport interface TrendSeries {\n  label: string;\n  points: number[];\n  unit?: string;\n  variant?: TrendVariant;\n  precision?: number;\n}\n\n/**\n * Multi-series trend viewer. Stacks one labelled `<ind-sparkline>` per series\n * with the current value, for comparing several tags without a full charting\n * library.\n */\n@Component({\n  tag: 'ind-trend-viewer',\n  styleUrls: ['../_shared/panel.css', 'trend-viewer.css'],\n  shadow: true,\n})\nexport class IndTrendViewer {\n  @Prop() heading: string = 'Trends';\n  /** Series to plot. */\n  @Prop() series: TrendSeries[] = [];\n\n  private last(s: TrendSeries): string {\n    if (!s.points.length) return '--';\n    const v = s.points[s.points.length - 1];\n    return s.precision !== undefined ? v.toFixed(s.precision) : String(v);\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"panel-head\">\n          <span class=\"panel-title\" part=\"heading\">{this.heading}</span>\n        </div>\n        <div class=\"panel-body\">\n          {this.series.length === 0 ? (\n            <div class=\"panel-empty\">No series</div>\n          ) : (\n            this.series.map((s, i) => (\n              <div class=\"series\" part=\"series\" key={i}>\n                <div class=\"series-head\">\n                  <span class={`legend legend-${s.variant ?? 'default'}`} aria-hidden=\"true\"></span>\n                  <span class=\"series-label\">{s.label}</span>\n                  <span class=\"series-value\">\n                    {this.last(s)}{s.unit ? ` ${s.unit}` : ''}\n                  </span>\n                </div>\n                <ind-sparkline class=\"series-spark\" points={s.points} variant={s.variant ?? 'default'} area></ind-sparkline>\n              </div>\n            ))\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/organisms/valve-control-panel/valve-control-panel.css

@@ -0,0 +1,10 @@
+:host {
+  min-width: 280px;
+}
+
+.panel-body > ind-speed-control {
+  border: 0;
+  padding: 0;
+  background: transparent;
+  min-width: 0;
+}

package/dist/collection/components/organisms/valve-control-panel/valve-control-panel.js

@@ -0,0 +1,233 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Valve control panel: `<ind-valve-card>` faceplate plus Open / Close / Stop
+ * commands and an optional position setpoint for modulating valves.
+ */
+export class IndValveControlPanel {
+    heading = 'Valve';
+    tag;
+    state = 'closed';
+    /** Current position 0–100 %. Omit for on/off valves. */
+    position;
+    /** Allow position control (modulating valve). */
+    modulating = false;
+    /** Position setpoint (two-way). */
+    positionSetpoint = 0;
+    indOpen;
+    indClose;
+    indStop;
+    indPosition;
+    onPosition = (e) => {
+        e.stopPropagation();
+        this.positionSetpoint = e.detail;
+        this.indPosition.emit(e.detail);
+    };
+    render() {
+        return (h(Host, { key: '74b95bc52371eaf3cf2f9c6fc8dac870f9d0a924' }, h("div", { key: '8eb914ce80e6ecec77ca7d90701c7b8740c7a88d', class: "panel-head" }, h("div", { key: '039a4ddd60abd0fac126532f7fee460520133f19', class: "panel-titles" }, h("span", { key: '54b8fe643cfda21aac90342cd4b410dcbf0dffd8', class: "panel-title", part: "heading" }, this.heading), this.tag && h("span", { key: 'd68d221bd943d800eb4769f4508f1286d66d9807', class: "panel-subtitle" }, this.tag))), h("div", { key: '8c48ba95fefb7786345402d7dabfdfb9295ba72c', class: "panel-body" }, h("ind-valve-card", { key: '980a0022a24169b5b61ea84eb3b8bb0eef4e4b5a', tag: this.tag, label: this.heading, state: this.state, position: this.position }), h("ind-command-group", { key: '21c3046744b5bdbceeefc6e8923427eb78d485e1', label: "Valve commands" }, h("ind-button", { key: 'f4a1689c2a5d40b6c784db28e1c4e22ca95ab2dd', variant: "primary", size: "sm", label: "Open", disabled: this.state === 'open', onIndActivate: () => this.indOpen.emit() }), h("ind-button", { key: '8cb97ed73c20e47aab7c0a489a0efe02afa30f7c', variant: "default", size: "sm", label: "Stop", onIndActivate: () => this.indStop.emit() }), h("ind-button", { key: '9e9977fa80e7b587dd72c292bdb43e92cf2c817c', variant: "danger", size: "sm", label: "Close", disabled: this.state === 'closed', onIndActivate: () => this.indClose.emit() })), this.modulating && (h("ind-speed-control", { key: 'd18050f458cac0757676b87cbcd0d9db816ba94a', label: "Position setpoint", value: this.positionSetpoint, unit: "%", onIndChange: this.onPosition })))));
+    }
+    static get is() { return "ind-valve-control-panel"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../_shared/panel.css", "../_shared/control-panel.css", "valve-control-panel.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["../_shared/panel.css", "../_shared/control-panel.css", "valve-control-panel.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "heading": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "heading",
+                "defaultValue": "'Valve'"
+            },
+            "tag": {
+                "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": "tag"
+            },
+            "state": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "ValveState",
+                    "resolved": "\"closed\" | \"fault\" | \"open\" | \"transit\"",
+                    "references": {
+                        "ValveState": {
+                            "location": "import",
+                            "path": "../../atoms/valve/valve",
+                            "id": "src/components/atoms/valve/valve.tsx::ValveState",
+                            "referenceLocation": "ValveState"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "state",
+                "defaultValue": "'closed'"
+            },
+            "position": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Current position 0\u2013100 %. Omit for on/off valves."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "position"
+            },
+            "modulating": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Allow position control (modulating valve)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "modulating",
+                "defaultValue": "false"
+            },
+            "positionSetpoint": {
+                "type": "number",
+                "mutable": true,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Position setpoint (two-way)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "position-setpoint",
+                "defaultValue": "0"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "indOpen",
+                "name": "indOpen",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }, {
+                "method": "indClose",
+                "name": "indClose",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }, {
+                "method": "indStop",
+                "name": "indStop",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }, {
+                "method": "indPosition",
+                "name": "indPosition",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                }
+            }];
+    }
+}
+//# sourceMappingURL=valve-control-panel.js.map

package/dist/collection/components/organisms/valve-control-panel/valve-control-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"valve-control-panel.js","sourceRoot":"","sources":["../../../../src/components/organisms/valve-control-panel/valve-control-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAG9E;;;GAGG;AAMH,MAAM,OAAO,oBAAoB;IACvB,OAAO,GAAW,OAAO,CAAC;IAC1B,GAAG,CAAU;IACI,KAAK,GAAe,QAAQ,CAAC;IACtD,wDAAwD;IAChD,QAAQ,CAAU;IAC1B,iDAAiD;IACzC,UAAU,GAAY,KAAK,CAAC;IACpC,mCAAmC;IACV,gBAAgB,GAAW,CAAC,CAAC;IAE7C,OAAO,CAAsB;IAC7B,QAAQ,CAAsB;IAC9B,OAAO,CAAsB;IAC7B,WAAW,CAAwB;IAEpC,UAAU,GAAG,CAAC,CAAsB,EAAE,EAAE;QAC9C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,gBAAgB,GAAG,CAAC,CAAC,MAAM,CAAC;QACjC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;IAClC,CAAC,CAAC;IAEF,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,YAAY;gBACrB,4DAAK,KAAK,EAAC,cAAc;oBACvB,6DAAM,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,SAAS,IAAE,IAAI,CAAC,OAAO,CAAQ;oBAC7D,IAAI,CAAC,GAAG,IAAI,6DAAM,KAAK,EAAC,gBAAgB,IAAE,IAAI,CAAC,GAAG,CAAQ,CACvD,CACF;YACN,4DAAK,KAAK,EAAC,YAAY;gBACrB,uEAAgB,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAI;gBAClG,0EAAmB,KAAK,EAAC,gBAAgB;oBACvC,mEAAY,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,KAAK,MAAM,EAAE,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GAAI;oBAClI,mEAAY,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,MAAM,EAAC,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GAAI;oBACjG,mEAAY,OAAO,EAAC,QAAQ,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,OAAO,EAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,GAAI,CACnH;gBACnB,IAAI,CAAC,UAAU,IAAI,CAClB,0EAAmB,KAAK,EAAC,mBAAmB,EAAC,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,IAAI,EAAC,GAAG,EAAC,WAAW,EAAE,IAAI,CAAC,UAAU,GAAI,CACrH,CACG,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\nimport type { ValveState } from '../../atoms/valve/valve';\n\n/**\n * Valve control panel: `<ind-valve-card>` faceplate plus Open / Close / Stop\n * commands and an optional position setpoint for modulating valves.\n */\n@Component({\n  tag: 'ind-valve-control-panel',\n  styleUrls: ['../_shared/panel.css', '../_shared/control-panel.css', 'valve-control-panel.css'],\n  shadow: true,\n})\nexport class IndValveControlPanel {\n  @Prop() heading: string = 'Valve';\n  @Prop() tag?: string;\n  @Prop({ reflect: true }) state: ValveState = 'closed';\n  /** Current position 0–100 %. Omit for on/off valves. */\n  @Prop() position?: number;\n  /** Allow position control (modulating valve). */\n  @Prop() modulating: boolean = false;\n  /** Position setpoint (two-way). */\n  @Prop({ mutable: true }) positionSetpoint: number = 0;\n\n  @Event() indOpen!: EventEmitter<void>;\n  @Event() indClose!: EventEmitter<void>;\n  @Event() indStop!: EventEmitter<void>;\n  @Event() indPosition!: EventEmitter<number>;\n\n  private onPosition = (e: CustomEvent<number>) => {\n    e.stopPropagation();\n    this.positionSetpoint = e.detail;\n    this.indPosition.emit(e.detail);\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class=\"panel-head\">\n          <div class=\"panel-titles\">\n            <span class=\"panel-title\" part=\"heading\">{this.heading}</span>\n            {this.tag && <span class=\"panel-subtitle\">{this.tag}</span>}\n          </div>\n        </div>\n        <div class=\"panel-body\">\n          <ind-valve-card tag={this.tag} label={this.heading} state={this.state} position={this.position} />\n          <ind-command-group label=\"Valve commands\">\n            <ind-button variant=\"primary\" size=\"sm\" label=\"Open\" disabled={this.state === 'open'} onIndActivate={() => this.indOpen.emit()} />\n            <ind-button variant=\"default\" size=\"sm\" label=\"Stop\" onIndActivate={() => this.indStop.emit()} />\n            <ind-button variant=\"danger\" size=\"sm\" label=\"Close\" disabled={this.state === 'closed'} onIndActivate={() => this.indClose.emit()} />\n          </ind-command-group>\n          {this.modulating && (\n            <ind-speed-control label=\"Position setpoint\" value={this.positionSetpoint} unit=\"%\" onIndChange={this.onPosition} />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}