@ind-ds/core 0.1.0 → 0.2.0

package/dist/esm/ind-production-cell.entry.js

@@ -0,0 +1,28 @@
+import { r as registerInstance, h, H as Host } from './index-Bls_NlWP.js';
+
+const panelCss = () => `:host{display:flex;flex-direction:column;background:var(--ind-surface-panel);border:1px solid var(--ind-surface-border-default);border-radius:var(--ind-radius-md, 3px);font-family:var(--ind-font-family-sans);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));box-sizing:border-box;overflow:hidden;font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1)}.panel-head{display:flex;align-items:center;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-4, 8px) var(--ind-spacing-5, 12px);border-bottom:1px solid var(--ind-surface-border-subtle);background:var(--ind-surface-raised);flex:0 0 auto}.panel-titles{display:flex;flex-direction:column;min-width:0}.panel-title{font-size:var(--ind-font-size-md, 13px);font-weight:var(--ind-font-weight-semibold, 600);line-height:1.2}.panel-subtitle{font-size:var(--ind-font-size-xs, 10px);text-transform:uppercase;letter-spacing:0.06em;color:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0))}.panel-tag{font-family:var(--ind-font-family-mono);font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-secondary)}.panel-actions{margin-left:auto;display:flex;align-items:center;gap:var(--ind-spacing-3, 6px)}.panel-body{display:flex;flex-direction:column;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-5, 12px);min-height:0}.panel-toolbar{display:flex;align-items:center;gap:var(--ind-spacing-3, 6px);padding:var(--ind-spacing-3, 6px) var(--ind-spacing-5, 12px);border-bottom:1px solid var(--ind-surface-border-subtle);flex:0 0 auto}.panel-list{display:flex;flex-direction:column;overflow:auto}.panel-grid{display:grid;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-5, 12px)}.panel-empty{padding:var(--ind-spacing-7, 20px);text-align:center;color:var(--ind-surface-text-muted);font-size:var(--ind-font-size-sm, 11px)}.panel-spacer{flex:1 1 auto}`;
+
+const productionCellCss = () => `:host{min-width:420px}:host([state="fault"]){border-color:var(--ind-state-fault-bg, #dc2626)}`;
+
+const IndProductionCell = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+    }
+    heading;
+    /** Cell identifier. */
+    cellId;
+    /** Aggregate cell state. */
+    state = 'unknown';
+    /** Grid columns for the body. */
+    columns = 2;
+    render() {
+        const dot = this.state === 'unknown' ? 'neutral' : this.state;
+        return (h(Host, { key: '35e4fcdd6cb701885f2c78537be16a7ecd8e91ba' }, h("div", { key: '76d6be37943e5aa81675df3b2a8bfc49039b32ec', class: "panel-head" }, h("ind-status-dot", { key: '3407e7603e49002642fc75617e9519c6adf169d3', state: dot, size: "md" }), h("div", { key: 'a6d0d7a42ca56de8b66cb7ea7779894025b6fab4', class: "panel-titles" }, h("span", { key: '4b60ee48fefdae0ef2dbad4e3c2b147c27c7cd6f', class: "panel-title", part: "heading" }, this.heading), this.cellId && h("span", { key: 'a16755ee33fd0d8da31a3ff87dde88e6fdec174f', class: "panel-subtitle" }, this.cellId)), h("div", { key: '6d1c9d2ee8ed24496af1fb5d3832248b90612fb2', class: "panel-actions" }, h("slot", { key: '5b0ac0adccd56c0ae2eb9634cc58e7c98de63fb6', name: "actions" }))), h("div", { key: '2da43e932bbe6d6690d25d265da175b0d7a4f97b', class: "panel-grid", part: "grid", style: { gridTemplateColumns: `repeat(${this.columns}, minmax(0, 1fr))` } }, h("slot", { key: '1bfbe1ceab5d508e28a6359e6bb105266c776768' }))));
+    }
+};
+IndProductionCell.style = panelCss() + productionCellCss();
+
+export { IndProductionCell as ind_production_cell };
+//# sourceMappingURL=ind-production-cell.entry.js.map
+
+//# sourceMappingURL=ind-production-cell.entry.js.map

package/dist/esm/ind-production-cell.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ind-production-cell.entry.js","sources":["src/components/organisms/_shared/panel.css?tag=ind-production-cell&encapsulation=shadow","src/components/organisms/production-cell/production-cell.css?tag=ind-production-cell&encapsulation=shadow","src/components/organisms/production-cell/production-cell.tsx"],"sourcesContent":["/* Shared chrome for organism panels. Pulled in first via\n * `styleUrls: ['../_shared/panel.css', 'xxx.css']`. */\n:host {\n  display: flex;\n  flex-direction: column;\n  background: var(--ind-surface-panel);\n  border: 1px solid var(--ind-surface-border-default);\n  border-radius: var(--ind-radius-md, 3px);\n  font-family: var(--ind-font-family-sans);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n  box-sizing: border-box;\n  overflow: hidden;\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n}\n\n.panel-head {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-4, 8px) var(--ind-spacing-5, 12px);\n  border-bottom: 1px solid var(--ind-surface-border-subtle);\n  background: var(--ind-surface-raised);\n  flex: 0 0 auto;\n}\n\n.panel-titles {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.panel-title {\n  font-size: var(--ind-font-size-md, 13px);\n  font-weight: var(--ind-font-weight-semibold, 600);\n  line-height: 1.2;\n}\n\n.panel-subtitle {\n  font-size: var(--ind-font-size-xs, 10px);\n  text-transform: uppercase;\n  letter-spacing: 0.06em;\n  color: var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));\n}\n\n.panel-tag {\n  font-family: var(--ind-font-family-mono);\n  font-size: var(--ind-font-size-sm, 11px);\n  color: var(--ind-surface-text-secondary);\n}\n\n.panel-actions {\n  margin-left: auto;\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n}\n\n.panel-body {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-5, 12px);\n  min-height: 0;\n}\n\n.panel-toolbar {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n  padding: var(--ind-spacing-3, 6px) var(--ind-spacing-5, 12px);\n  border-bottom: 1px solid var(--ind-surface-border-subtle);\n  flex: 0 0 auto;\n}\n\n.panel-list {\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n}\n\n.panel-grid {\n  display: grid;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-5, 12px);\n}\n\n.panel-empty {\n  padding: var(--ind-spacing-7, 20px);\n  text-align: center;\n  color: var(--ind-surface-text-muted);\n  font-size: var(--ind-font-size-sm, 11px);\n}\n\n.panel-spacer {\n  flex: 1 1 auto;\n}\n",":host {\n  min-width: 420px;\n}\n\n:host([state=\"fault\"]) {\n  border-color: var(--ind-state-fault-bg, #dc2626);\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\nimport type { EquipmentCardState } from '../../molecules/equipment-status-card/equipment-status-card';\n\n/**\n * Production cell container: groups the machines / equipment of a work cell\n * under a single header with an aggregate state. Slot the machine overviews or\n * equipment cards into the body.\n */\n@Component({\n  tag: 'ind-production-cell',\n  styleUrls: ['../_shared/panel.css', 'production-cell.css'],\n  shadow: true,\n})\nexport class IndProductionCell {\n  @Prop() heading!: string;\n  /** Cell identifier. */\n  @Prop() cellId?: string;\n  /** Aggregate cell state. */\n  @Prop({ reflect: true }) state: EquipmentCardState = 'unknown';\n  /** Grid columns for the body. */\n  @Prop() columns: number = 2;\n\n  render() {\n    const dot = this.state === 'unknown' ? 'neutral' : this.state;\n    return (\n      <Host>\n        <div class=\"panel-head\">\n          <ind-status-dot state={dot as any} size=\"md\" />\n          <div class=\"panel-titles\">\n            <span class=\"panel-title\" part=\"heading\">{this.heading}</span>\n            {this.cellId && <span class=\"panel-subtitle\">{this.cellId}</span>}\n          </div>\n          <div class=\"panel-actions\"><slot name=\"actions\" /></div>\n        </div>\n        <div\n          class=\"panel-grid\"\n          part=\"grid\"\n          style={{ gridTemplateColumns: `repeat(${this.columns}, minmax(0, 1fr))` }}\n        >\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,yzDAAyzD,CAAC;;ACAl1D,MAAM,iBAAiB,GAAG,MAAM,CAAC,6FAA6F,CAAC;;MCalH,iBAAiB,GAAA,MAAA;;;;AACpB,IAAA,OAAO;;AAEP,IAAA,MAAM;;IAEW,KAAK,GAAuB,SAAS;;IAEtD,OAAO,GAAW,CAAC;IAE3B,MAAM,GAAA;AACJ,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,KAAK,SAAS,GAAG,SAAS,GAAG,IAAI,CAAC,KAAK;AAC7D,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,YAAY,EAAA,EACrB,CAAA,CAAA,gBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAgB,KAAK,EAAE,GAAU,EAAE,IAAI,EAAC,IAAI,EAAA,CAAG,EAC/C,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,cAAc,EAAA,EACvB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,SAAS,EAAA,EAAE,IAAI,CAAC,OAAO,CAAQ,EAC7D,IAAI,CAAC,MAAM,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,gBAAgB,EAAA,EAAE,IAAI,CAAC,MAAM,CAAQ,CAC7D,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,eAAe,EAAA,EAAC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,SAAS,EAAA,CAAG,CAAM,CACpD,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,YAAY,EAClB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,EAAE,mBAAmB,EAAE,CAAA,OAAA,EAAU,IAAI,CAAC,OAAO,CAAA,iBAAA,CAAmB,EAAE,EAAA,EAEzE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACJ,CACD;;;;;;;"}

package/dist/esm/ind-production-dashboard.entry.js

@@ -0,0 +1,25 @@
+import { r as registerInstance, h, H as Host } from './index-Bls_NlWP.js';
+
+const panelCss = () => `:host{display:flex;flex-direction:column;background:var(--ind-surface-panel);border:1px solid var(--ind-surface-border-default);border-radius:var(--ind-radius-md, 3px);font-family:var(--ind-font-family-sans);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));box-sizing:border-box;overflow:hidden;font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1)}.panel-head{display:flex;align-items:center;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-4, 8px) var(--ind-spacing-5, 12px);border-bottom:1px solid var(--ind-surface-border-subtle);background:var(--ind-surface-raised);flex:0 0 auto}.panel-titles{display:flex;flex-direction:column;min-width:0}.panel-title{font-size:var(--ind-font-size-md, 13px);font-weight:var(--ind-font-weight-semibold, 600);line-height:1.2}.panel-subtitle{font-size:var(--ind-font-size-xs, 10px);text-transform:uppercase;letter-spacing:0.06em;color:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0))}.panel-tag{font-family:var(--ind-font-family-mono);font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-secondary)}.panel-actions{margin-left:auto;display:flex;align-items:center;gap:var(--ind-spacing-3, 6px)}.panel-body{display:flex;flex-direction:column;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-5, 12px);min-height:0}.panel-toolbar{display:flex;align-items:center;gap:var(--ind-spacing-3, 6px);padding:var(--ind-spacing-3, 6px) var(--ind-spacing-5, 12px);border-bottom:1px solid var(--ind-surface-border-subtle);flex:0 0 auto}.panel-list{display:flex;flex-direction:column;overflow:auto}.panel-grid{display:grid;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-5, 12px)}.panel-empty{padding:var(--ind-spacing-7, 20px);text-align:center;color:var(--ind-surface-text-muted);font-size:var(--ind-font-size-sm, 11px)}.panel-spacer{flex:1 1 auto}`;
+
+const productionDashboardCss = () => `:host{min-width:520px}`;
+
+const IndProductionDashboard = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+    }
+    heading = 'Production';
+    /** Context subtitle (e.g. "Line 2 · Shift A"). */
+    subtitle;
+    /** Number of grid columns. */
+    columns = 4;
+    render() {
+        return (h(Host, { key: 'bee0bf466d41d96ba449a47f5b24fbf0d82bdc62' }, h("div", { key: 'db5b706d5fa704aaaa3c555f534c03eb4eca35aa', class: "panel-head" }, h("div", { key: 'b5937e5a4db9bacb744e75fb53a853e26259cb4a', class: "panel-titles" }, h("span", { key: '7c52d8676b46635712dc906d5cb063913cd032ed', class: "panel-title", part: "heading" }, this.heading), this.subtitle && h("span", { key: '30f1b6fc4c3a5b5013c40dff32365d713fdc0017', class: "panel-subtitle" }, this.subtitle)), h("div", { key: '0aeae273ba718813861d84725e10959c9324ee9a', class: "panel-actions" }, h("slot", { key: 'bf3482af0847676d8749ecfd52f3941e2ad85ade', name: "actions" }))), h("div", { key: '935b9923c0b4d88bcb0835d099e8ed0687bbb7c3', class: "panel-grid", part: "grid", style: { gridTemplateColumns: `repeat(${this.columns}, minmax(0, 1fr))` } }, h("slot", { key: '630520d4b536738422ca4c7e8f7fba0e834da108' }))));
+    }
+};
+IndProductionDashboard.style = panelCss() + productionDashboardCss();
+
+export { IndProductionDashboard as ind_production_dashboard };
+//# sourceMappingURL=ind-production-dashboard.entry.js.map
+
+//# sourceMappingURL=ind-production-dashboard.entry.js.map

package/dist/esm/ind-production-dashboard.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ind-production-dashboard.entry.js","sources":["src/components/organisms/_shared/panel.css?tag=ind-production-dashboard&encapsulation=shadow","src/components/organisms/production-dashboard/production-dashboard.css?tag=ind-production-dashboard&encapsulation=shadow","src/components/organisms/production-dashboard/production-dashboard.tsx"],"sourcesContent":["/* Shared chrome for organism panels. Pulled in first via\n * `styleUrls: ['../_shared/panel.css', 'xxx.css']`. */\n:host {\n  display: flex;\n  flex-direction: column;\n  background: var(--ind-surface-panel);\n  border: 1px solid var(--ind-surface-border-default);\n  border-radius: var(--ind-radius-md, 3px);\n  font-family: var(--ind-font-family-sans);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n  box-sizing: border-box;\n  overflow: hidden;\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n}\n\n.panel-head {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-4, 8px) var(--ind-spacing-5, 12px);\n  border-bottom: 1px solid var(--ind-surface-border-subtle);\n  background: var(--ind-surface-raised);\n  flex: 0 0 auto;\n}\n\n.panel-titles {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.panel-title {\n  font-size: var(--ind-font-size-md, 13px);\n  font-weight: var(--ind-font-weight-semibold, 600);\n  line-height: 1.2;\n}\n\n.panel-subtitle {\n  font-size: var(--ind-font-size-xs, 10px);\n  text-transform: uppercase;\n  letter-spacing: 0.06em;\n  color: var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));\n}\n\n.panel-tag {\n  font-family: var(--ind-font-family-mono);\n  font-size: var(--ind-font-size-sm, 11px);\n  color: var(--ind-surface-text-secondary);\n}\n\n.panel-actions {\n  margin-left: auto;\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n}\n\n.panel-body {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-5, 12px);\n  min-height: 0;\n}\n\n.panel-toolbar {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n  padding: var(--ind-spacing-3, 6px) var(--ind-spacing-5, 12px);\n  border-bottom: 1px solid var(--ind-surface-border-subtle);\n  flex: 0 0 auto;\n}\n\n.panel-list {\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n}\n\n.panel-grid {\n  display: grid;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-5, 12px);\n}\n\n.panel-empty {\n  padding: var(--ind-spacing-7, 20px);\n  text-align: center;\n  color: var(--ind-surface-text-muted);\n  font-size: var(--ind-font-size-sm, 11px);\n}\n\n.panel-spacer {\n  flex: 1 1 auto;\n}\n",":host {\n  min-width: 520px;\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\n/**\n * Production overview dashboard. Slot KPI / tag / trend molecules into the\n * grid; an optional `shift` subtitle and `actions` slot sit in the header.\n */\n@Component({\n  tag: 'ind-production-dashboard',\n  styleUrls: ['../_shared/panel.css', 'production-dashboard.css'],\n  shadow: true,\n})\nexport class IndProductionDashboard {\n  @Prop() heading: string = 'Production';\n  /** Context subtitle (e.g. \"Line 2 · Shift A\"). */\n  @Prop() subtitle?: string;\n  /** Number of grid columns. */\n  @Prop() columns: number = 4;\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.subtitle && <span class=\"panel-subtitle\">{this.subtitle}</span>}\n          </div>\n          <div class=\"panel-actions\"><slot name=\"actions\" /></div>\n        </div>\n        <div\n          class=\"panel-grid\"\n          part=\"grid\"\n          style={{ gridTemplateColumns: `repeat(${this.columns}, minmax(0, 1fr))` }}\n        >\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,yzDAAyzD,CAAC;;ACAl1D,MAAM,sBAAsB,GAAG,MAAM,CAAC,sBAAsB,CAAC;;MCWhD,sBAAsB,GAAA,MAAA;;;;IACzB,OAAO,GAAW,YAAY;;AAE9B,IAAA,QAAQ;;IAER,OAAO,GAAW,CAAC;IAE3B,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,YAAY,EAAA,EACrB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,cAAc,EAAA,EACvB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,SAAS,EAAA,EAAE,IAAI,CAAC,OAAO,CAAQ,EAC7D,IAAI,CAAC,QAAQ,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,gBAAgB,EAAA,EAAE,IAAI,CAAC,QAAQ,CAAQ,CACjE,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,eAAe,EAAA,EAAC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,SAAS,EAAA,CAAG,CAAM,CACpD,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,YAAY,EAClB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,EAAE,mBAAmB,EAAE,CAAA,OAAA,EAAU,IAAI,CAAC,OAAO,mBAAmB,EAAE,EAAA,EAEzE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACJ,CACD;;;;;;;"}

package/dist/esm/ind-production-line-overview.entry.js

@@ -0,0 +1,25 @@
+import { r as registerInstance, h, H as Host } from './index-Bls_NlWP.js';
+
+const panelCss = () => `:host{display:flex;flex-direction:column;background:var(--ind-surface-panel);border:1px solid var(--ind-surface-border-default);border-radius:var(--ind-radius-md, 3px);font-family:var(--ind-font-family-sans);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));box-sizing:border-box;overflow:hidden;font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1)}.panel-head{display:flex;align-items:center;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-4, 8px) var(--ind-spacing-5, 12px);border-bottom:1px solid var(--ind-surface-border-subtle);background:var(--ind-surface-raised);flex:0 0 auto}.panel-titles{display:flex;flex-direction:column;min-width:0}.panel-title{font-size:var(--ind-font-size-md, 13px);font-weight:var(--ind-font-weight-semibold, 600);line-height:1.2}.panel-subtitle{font-size:var(--ind-font-size-xs, 10px);text-transform:uppercase;letter-spacing:0.06em;color:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0))}.panel-tag{font-family:var(--ind-font-family-mono);font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-secondary)}.panel-actions{margin-left:auto;display:flex;align-items:center;gap:var(--ind-spacing-3, 6px)}.panel-body{display:flex;flex-direction:column;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-5, 12px);min-height:0}.panel-toolbar{display:flex;align-items:center;gap:var(--ind-spacing-3, 6px);padding:var(--ind-spacing-3, 6px) var(--ind-spacing-5, 12px);border-bottom:1px solid var(--ind-surface-border-subtle);flex:0 0 auto}.panel-list{display:flex;flex-direction:column;overflow:auto}.panel-grid{display:grid;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-5, 12px)}.panel-empty{padding:var(--ind-spacing-7, 20px);text-align:center;color:var(--ind-surface-text-muted);font-size:var(--ind-font-size-sm, 11px)}.panel-spacer{flex:1 1 auto}`;
+
+const productionLineOverviewCss = () => `:host{min-width:520px}.line{display:flex;align-items:center;gap:var(--ind-spacing-3, 6px);padding:var(--ind-spacing-5, 12px);overflow-x:auto}.station{display:flex;flex-direction:column;gap:var(--ind-spacing-2, 4px);min-width:96px;padding:var(--ind-spacing-4, 8px);background:var(--ind-surface-sunken);border:1px solid var(--ind-surface-border-default);border-radius:var(--ind-radius-sm, 2px);border-top:3px solid var(--ind-surface-border-strong)}.station-fault{border-top-color:var(--ind-state-fault-bg, #dc2626)}.station-warning{border-top-color:var(--ind-state-warning-bg, #f59e0b)}.station-running{border-top-color:var(--ind-state-running-bg, #16a34a)}.station-maintenance{border-top-color:var(--ind-state-maintenance-bg, #2563eb)}.station-head{display:flex;align-items:center;gap:var(--ind-spacing-2, 4px)}.station-tag{font-family:var(--ind-font-family-mono);font-size:var(--ind-font-size-xs, 10px);color:var(--ind-surface-text-muted)}.station-name{font-size:var(--ind-font-size-base, 12px);font-weight:var(--ind-font-weight-medium, 500)}.station-rate{font-family:var(--ind-font-family-mono);font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-secondary)}.arrow{color:var(--ind-surface-text-muted);font-size:var(--ind-font-size-lg, 14px);flex:0 0 auto}`;
+
+const IndProductionLineOverview = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+    }
+    heading = 'Production line';
+    stations = [];
+    render() {
+        return (h(Host, { key: 'acef84fa40b80a710503ad9f3310c954500b7c46' }, h("div", { key: '6a473b0aad1ea689c562bcfa8e3ca744e35de922', class: "panel-head" }, h("span", { key: '8bcb4d572b94aae2cb3f37e5e08bc41596f6f6d3', class: "panel-title", part: "heading" }, this.heading)), h("div", { key: '88742d308c8ba3b58b9a1a5b9b4ee9afed5c1b03', class: "line", part: "line" }, this.stations.map((s, i) => [
+            h("div", { class: `station station-${s.state}`, part: "station", key: `s${i}` }, h("div", { class: "station-head" }, h("ind-status-dot", { state: (s.state === 'unknown' ? 'neutral' : s.state), size: "sm" }), s.tag && h("span", { class: "station-tag" }, s.tag)), h("span", { class: "station-name" }, s.name), s.rate !== undefined && (h("span", { class: "station-rate" }, s.rate, s.unit ? ` ${s.unit}` : ''))),
+            i < this.stations.length - 1 ? (h("span", { class: "arrow", part: "arrow", "aria-hidden": "true", key: `a${i}` }, "\u2192")) : null,
+        ]))));
+    }
+};
+IndProductionLineOverview.style = panelCss() + productionLineOverviewCss();
+
+export { IndProductionLineOverview as ind_production_line_overview };
+//# sourceMappingURL=ind-production-line-overview.entry.js.map
+
+//# sourceMappingURL=ind-production-line-overview.entry.js.map

package/dist/esm/ind-production-line-overview.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ind-production-line-overview.entry.js","sources":["src/components/organisms/_shared/panel.css?tag=ind-production-line-overview&encapsulation=shadow","src/components/organisms/production-line-overview/production-line-overview.css?tag=ind-production-line-overview&encapsulation=shadow","src/components/organisms/production-line-overview/production-line-overview.tsx"],"sourcesContent":["/* Shared chrome for organism panels. Pulled in first via\n * `styleUrls: ['../_shared/panel.css', 'xxx.css']`. */\n:host {\n  display: flex;\n  flex-direction: column;\n  background: var(--ind-surface-panel);\n  border: 1px solid var(--ind-surface-border-default);\n  border-radius: var(--ind-radius-md, 3px);\n  font-family: var(--ind-font-family-sans);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n  box-sizing: border-box;\n  overflow: hidden;\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n}\n\n.panel-head {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-4, 8px) var(--ind-spacing-5, 12px);\n  border-bottom: 1px solid var(--ind-surface-border-subtle);\n  background: var(--ind-surface-raised);\n  flex: 0 0 auto;\n}\n\n.panel-titles {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.panel-title {\n  font-size: var(--ind-font-size-md, 13px);\n  font-weight: var(--ind-font-weight-semibold, 600);\n  line-height: 1.2;\n}\n\n.panel-subtitle {\n  font-size: var(--ind-font-size-xs, 10px);\n  text-transform: uppercase;\n  letter-spacing: 0.06em;\n  color: var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));\n}\n\n.panel-tag {\n  font-family: var(--ind-font-family-mono);\n  font-size: var(--ind-font-size-sm, 11px);\n  color: var(--ind-surface-text-secondary);\n}\n\n.panel-actions {\n  margin-left: auto;\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n}\n\n.panel-body {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-5, 12px);\n  min-height: 0;\n}\n\n.panel-toolbar {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n  padding: var(--ind-spacing-3, 6px) var(--ind-spacing-5, 12px);\n  border-bottom: 1px solid var(--ind-surface-border-subtle);\n  flex: 0 0 auto;\n}\n\n.panel-list {\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n}\n\n.panel-grid {\n  display: grid;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-5, 12px);\n}\n\n.panel-empty {\n  padding: var(--ind-spacing-7, 20px);\n  text-align: center;\n  color: var(--ind-surface-text-muted);\n  font-size: var(--ind-font-size-sm, 11px);\n}\n\n.panel-spacer {\n  flex: 1 1 auto;\n}\n",":host {\n  min-width: 520px;\n}\n\n.line {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n  padding: var(--ind-spacing-5, 12px);\n  overflow-x: auto;\n}\n\n.station {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ind-spacing-2, 4px);\n  min-width: 96px;\n  padding: var(--ind-spacing-4, 8px);\n  background: var(--ind-surface-sunken);\n  border: 1px solid var(--ind-surface-border-default);\n  border-radius: var(--ind-radius-sm, 2px);\n  border-top: 3px solid var(--ind-surface-border-strong);\n}\n\n.station-fault { border-top-color: var(--ind-state-fault-bg, #dc2626); }\n.station-warning { border-top-color: var(--ind-state-warning-bg, #f59e0b); }\n.station-running { border-top-color: var(--ind-state-running-bg, #16a34a); }\n.station-maintenance { border-top-color: var(--ind-state-maintenance-bg, #2563eb); }\n\n.station-head {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-2, 4px);\n}\n\n.station-tag {\n  font-family: var(--ind-font-family-mono);\n  font-size: var(--ind-font-size-xs, 10px);\n  color: var(--ind-surface-text-muted);\n}\n\n.station-name {\n  font-size: var(--ind-font-size-base, 12px);\n  font-weight: var(--ind-font-weight-medium, 500);\n}\n\n.station-rate {\n  font-family: var(--ind-font-family-mono);\n  font-size: var(--ind-font-size-sm, 11px);\n  color: var(--ind-surface-text-secondary);\n}\n\n.arrow {\n  color: var(--ind-surface-text-muted);\n  font-size: var(--ind-font-size-lg, 14px);\n  flex: 0 0 auto;\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\nimport type { EquipmentCardState } from '../../molecules/equipment-status-card/equipment-status-card';\n\nexport interface LineStation {\n  name: string;\n  tag?: string;\n  state: EquipmentCardState;\n  /** Optional throughput / rate readout. */\n  rate?: number;\n  unit?: string;\n}\n\n/**\n * Left-to-right production line overview: a sequence of station status tiles\n * connected by flow arrows. Each tile shows state, tag and an optional rate.\n */\n@Component({\n  tag: 'ind-production-line-overview',\n  styleUrls: ['../_shared/panel.css', 'production-line-overview.css'],\n  shadow: true,\n})\nexport class IndProductionLineOverview {\n  @Prop() heading: string = 'Production line';\n  @Prop() stations: LineStation[] = [];\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=\"line\" part=\"line\">\n          {this.stations.map((s, i) => [\n            <div class={`station station-${s.state}`} part=\"station\" key={`s${i}`}>\n              <div class=\"station-head\">\n                <ind-status-dot state={(s.state === 'unknown' ? 'neutral' : s.state) as any} size=\"sm\" />\n                {s.tag && <span class=\"station-tag\">{s.tag}</span>}\n              </div>\n              <span class=\"station-name\">{s.name}</span>\n              {s.rate !== undefined && (\n                <span class=\"station-rate\">{s.rate}{s.unit ? ` ${s.unit}` : ''}</span>\n              )}\n            </div>,\n            i < this.stations.length - 1 ? (\n              <span class=\"arrow\" part=\"arrow\" aria-hidden=\"true\" key={`a${i}`}>→</span>\n            ) : null,\n          ])}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,yzDAAyzD,CAAC;;ACAl1D,MAAM,yBAAyB,GAAG,MAAM,CAAC,yvCAAyvC,CAAC;;MCqBtxC,yBAAyB,GAAA,MAAA;;;;IAC5B,OAAO,GAAW,iBAAiB;IACnC,QAAQ,GAAkB,EAAE;IAEpC,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,YAAY,EAAA,EACrB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,SAAS,EAAA,EAAE,IAAI,CAAC,OAAO,CAAQ,CAC1D,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM,IAC1B,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK;AAC3B,YAAA,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,CAAA,gBAAA,EAAmB,CAAC,CAAC,KAAK,CAAA,CAAE,EAAE,IAAI,EAAC,SAAS,EAAC,GAAG,EAAE,CAAA,CAAA,EAAI,CAAC,CAAA,CAAE,EAAA,EACnE,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,cAAc,EAAA,EACvB,CAAA,CAAA,gBAAA,EAAA,EAAgB,KAAK,GAAG,CAAC,CAAC,KAAK,KAAK,SAAS,GAAG,SAAS,GAAG,CAAC,CAAC,KAAK,CAAQ,EAAE,IAAI,EAAC,IAAI,EAAA,CAAG,EACxF,CAAC,CAAC,GAAG,IAAI,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,aAAa,EAAA,EAAE,CAAC,CAAC,GAAG,CAAQ,CAC9C,EACN,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,cAAc,IAAE,CAAC,CAAC,IAAI,CAAQ,EACzC,CAAC,CAAC,IAAI,KAAK,SAAS,KACnB,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,cAAc,EAAA,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,IAAI,GAAG,CAAA,CAAA,EAAI,CAAC,CAAC,IAAI,CAAA,CAAE,GAAG,EAAE,CAAQ,CACvE,CACG;AACN,YAAA,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,IAC1B,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAA,aAAA,EAAa,MAAM,EAAC,GAAG,EAAE,CAAA,CAAA,EAAI,CAAC,CAAA,CAAE,EAAA,EAAA,QAAA,CAAU,IACxE,IAAI;SACT,CAAC,CACE,CACD;;;;;;;"}

package/dist/esm/ind-progress-ring.entry.js

@@ -0,0 +1,45 @@
+import { r as registerInstance, h, H as Host } from './index-Bls_NlWP.js';
+
+const progressRingCss = () => `:host{position:relative;display:inline-flex;align-items:center;justify-content:center;font-family:var(--ind-font-family-mono, ui-monospace, monospace);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));--_size:40px;--_fill:var(--ind-button-primary-bg, #2563eb)}:host([size="sm"]){--_size:28px}:host([size="md"]){--_size:40px}:host([size="lg"]){--_size:56px}:host([variant="success"]){--_fill:var(--ind-feedback-success-bg, #16a34a)}:host([variant="warning"]){--_fill:var(--ind-feedback-warning-bg, #f59e0b)}:host([variant="error"]){--_fill:var(--ind-feedback-error-bg, #dc2626)}.ring{display:block;width:var(--_size);height:var(--_size)}.track{fill:none;stroke:var(--ind-surface-border-default, #2a3340);stroke-width:4}.bar{fill:none;stroke:var(--_fill);stroke-width:4;stroke-linecap:round;transition:stroke-dashoffset var(--ind-motion-duration-base, 200ms) var(--ind-motion-easing-standard, ease)}:host([indeterminate]) .ring{animation:ind-ring-spin 1.1s linear infinite}.value{position:absolute;font-size:var(--ind-font-size-xs, 10px);font-weight:var(--ind-font-weight-semibold, 600);font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1)}:host([size="lg"]) .value{font-size:var(--ind-font-size-sm, 11px)}@keyframes ind-ring-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){:host([indeterminate]) .ring{animation-duration:2.4s}}`;
+
+const IndProgressRing = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+    }
+    /** Current value (0–`max`). */
+    value = 0;
+    /** Max value. */
+    max = 100;
+    /** Color intent. */
+    variant = 'default';
+    /** Size. */
+    size = 'md';
+    /** Indeterminate spinner (no value). */
+    indeterminate = false;
+    /** Show the percentage in the center. */
+    showValue = false;
+    /** Optional unit/suffix when showing the value (defaults to %). */
+    unit;
+    /** Accessible label. */
+    label;
+    r = 16;
+    cx = 20;
+    percent() {
+        if (this.max <= 0)
+            return 0;
+        return Math.min(100, Math.max(0, (this.value / this.max) * 100));
+    }
+    render() {
+        const circumference = 2 * Math.PI * this.r;
+        const pct = this.percent();
+        const offset = circumference * (1 - pct / 100);
+        const centerText = this.unit ? `${Math.round(pct)}${this.unit}` : `${Math.round(pct)}%`;
+        return (h(Host, { key: 'e117120c3cc822479f06ba401cb850d23d2de8ca', role: "progressbar", "aria-valuenow": this.indeterminate ? undefined : Math.round(pct), "aria-valuemin": 0, "aria-valuemax": 100, "aria-label": this.label }, h("svg", { key: 'a695b3827b8bf196340793940581fbd09c63d81f', class: "ring", part: "ring", viewBox: "0 0 40 40", "aria-hidden": "true" }, h("circle", { key: 'f6441867ee9f600ffd975d552f7e39a4c96ae841', class: "track", part: "track", cx: this.cx, cy: this.cx, r: this.r }), h("circle", { key: '1768950bd68071f2e0a2080d7be4891db0f177ce', class: "bar", part: "bar", cx: this.cx, cy: this.cx, r: this.r, "stroke-dasharray": circumference, "stroke-dashoffset": this.indeterminate ? circumference * 0.7 : offset, transform: `rotate(-90 ${this.cx} ${this.cx})` })), this.showValue && !this.indeterminate && (h("span", { key: '9b39b1e3056fe2e203cdd62fbafe0e0213c932a3', class: "value", part: "value" }, centerText))));
+    }
+};
+IndProgressRing.style = progressRingCss();
+
+export { IndProgressRing as ind_progress_ring };
+//# sourceMappingURL=ind-progress-ring.entry.js.map
+
+//# sourceMappingURL=ind-progress-ring.entry.js.map

package/dist/esm/ind-progress-ring.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ind-progress-ring.entry.js","sources":["src/components/atoms/progress-ring/progress-ring.css?tag=ind-progress-ring&encapsulation=shadow","src/components/atoms/progress-ring/progress-ring.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  font-family: var(--ind-font-family-mono, ui-monospace, monospace);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n  --_size: 40px;\n  --_fill: var(--ind-button-primary-bg, #2563eb);\n}\n\n:host([size=\"sm\"]) { --_size: 28px; }\n:host([size=\"md\"]) { --_size: 40px; }\n:host([size=\"lg\"]) { --_size: 56px; }\n\n:host([variant=\"success\"]) { --_fill: var(--ind-feedback-success-bg, #16a34a); }\n:host([variant=\"warning\"]) { --_fill: var(--ind-feedback-warning-bg, #f59e0b); }\n:host([variant=\"error\"])   { --_fill: var(--ind-feedback-error-bg, #dc2626); }\n\n.ring {\n  display: block;\n  width: var(--_size);\n  height: var(--_size);\n}\n\n.track {\n  fill: none;\n  stroke: var(--ind-surface-border-default, #2a3340);\n  stroke-width: 4;\n}\n\n.bar {\n  fill: none;\n  stroke: var(--_fill);\n  stroke-width: 4;\n  stroke-linecap: round;\n  transition: stroke-dashoffset var(--ind-motion-duration-base, 200ms) var(--ind-motion-easing-standard, ease);\n}\n\n:host([indeterminate]) .ring {\n  animation: ind-ring-spin 1.1s linear infinite;\n}\n\n.value {\n  position: absolute;\n  font-size: var(--ind-font-size-xs, 10px);\n  font-weight: var(--ind-font-weight-semibold, 600);\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n}\n\n:host([size=\"lg\"]) .value { font-size: var(--ind-font-size-sm, 11px); }\n\n@keyframes ind-ring-spin {\n  to { transform: rotate(360deg); }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  :host([indeterminate]) .ring { animation-duration: 2.4s; }\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type ProgressRingVariant = 'default' | 'success' | 'warning' | 'error';\nexport type ProgressRingSize = 'sm' | 'md' | 'lg';\n\n@Component({\n  tag: 'ind-progress-ring',\n  styleUrl: 'progress-ring.css',\n  shadow: true,\n})\nexport class IndProgressRing {\n  /** Current value (0–`max`). */\n  @Prop() value: number = 0;\n  /** Max value. */\n  @Prop() max: number = 100;\n  /** Color intent. */\n  @Prop({ reflect: true }) variant: ProgressRingVariant = 'default';\n  /** Size. */\n  @Prop({ reflect: true }) size: ProgressRingSize = 'md';\n  /** Indeterminate spinner (no value). */\n  @Prop({ reflect: true }) indeterminate: boolean = false;\n  /** Show the percentage in the center. */\n  @Prop() showValue: boolean = false;\n  /** Optional unit/suffix when showing the value (defaults to %). */\n  @Prop() unit?: string;\n  /** Accessible label. */\n  @Prop() label?: string;\n\n  private readonly r = 16;\n  private readonly cx = 20;\n\n  private percent(): number {\n    if (this.max <= 0) return 0;\n    return Math.min(100, Math.max(0, (this.value / this.max) * 100));\n  }\n\n  render() {\n    const circumference = 2 * Math.PI * this.r;\n    const pct = this.percent();\n    const offset = circumference * (1 - pct / 100);\n    const centerText = this.unit ? `${Math.round(pct)}${this.unit}` : `${Math.round(pct)}%`;\n    return (\n      <Host\n        role=\"progressbar\"\n        aria-valuenow={this.indeterminate ? undefined : Math.round(pct)}\n        aria-valuemin={0}\n        aria-valuemax={100}\n        aria-label={this.label}\n      >\n        <svg class=\"ring\" part=\"ring\" viewBox=\"0 0 40 40\" aria-hidden=\"true\">\n          <circle class=\"track\" part=\"track\" cx={this.cx} cy={this.cx} r={this.r} />\n          <circle\n            class=\"bar\"\n            part=\"bar\"\n            cx={this.cx}\n            cy={this.cx}\n            r={this.r}\n            stroke-dasharray={circumference}\n            stroke-dashoffset={this.indeterminate ? circumference * 0.7 : offset}\n            transform={`rotate(-90 ${this.cx} ${this.cx})`}\n          />\n        </svg>\n        {this.showValue && !this.indeterminate && (\n          <span class=\"value\" part=\"value\">{centerText}</span>\n        )}\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,eAAe,GAAG,MAAM,CAAC,q2CAAq2C,CAAC;;MCUx3C,eAAe,GAAA,MAAA;;;;;IAElB,KAAK,GAAW,CAAC;;IAEjB,GAAG,GAAW,GAAG;;IAEA,OAAO,GAAwB,SAAS;;IAExC,IAAI,GAAqB,IAAI;;IAE7B,aAAa,GAAY,KAAK;;IAE/C,SAAS,GAAY,KAAK;;AAE1B,IAAA,IAAI;;AAEJ,IAAA,KAAK;IAEI,CAAC,GAAG,EAAE;IACN,EAAE,GAAG,EAAE;IAEhB,OAAO,GAAA;AACb,QAAA,IAAI,IAAI,CAAC,GAAG,IAAI,CAAC;AAAE,YAAA,OAAO,CAAC;QAC3B,OAAO,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,CAAC;;IAGlE,MAAM,GAAA;QACJ,MAAM,aAAa,GAAG,CAAC,GAAG,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,CAAC;AAC1C,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,EAAE;QAC1B,MAAM,MAAM,GAAG,aAAa,IAAI,CAAC,GAAG,GAAG,GAAG,GAAG,CAAC;AAC9C,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,GAAG,CAAA,EAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA,EAAG,IAAI,CAAC,IAAI,CAAA,CAAE,GAAG,CAAA,EAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG;QACvF,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,IAAI,EAAC,aAAa,EAAA,eAAA,EACH,IAAI,CAAC,aAAa,GAAG,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,EAAA,eAAA,EAChD,CAAC,EAAA,eAAA,EACD,GAAG,EAAA,YAAA,EACN,IAAI,CAAC,KAAK,EAAA,EAEtB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAA,aAAA,EAAa,MAAM,EAAA,EAClE,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,EAAE,IAAI,CAAC,CAAC,EAAA,CAAI,EAC1E,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,KAAK,EACX,IAAI,EAAC,KAAK,EACV,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,CAAC,EAAE,IAAI,CAAC,CAAC,EAAA,kBAAA,EACS,aAAa,uBACZ,IAAI,CAAC,aAAa,GAAG,aAAa,GAAG,GAAG,GAAG,MAAM,EACpE,SAAS,EAAE,CAAA,WAAA,EAAc,IAAI,CAAC,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,EAAE,CAAA,CAAA,CAAG,EAAA,CAC9C,CACE,EACL,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,aAAa,KACpC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAA,EAAE,UAAU,CAAQ,CACrD,CACI;;;;;;;"}

package/dist/esm/ind-progress.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-D2yNiL0d.js';
+import { r as registerInstance, h, H as Host } from './index-Bls_NlWP.js';
 
 const progressCss = () => `:host{display:block;font-family:var(--ind-font-family-sans);font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));--_h:8px;--_fill:var(--ind-button-primary-bg, #2563eb)}:host([size="sm"]){--_h:4px}:host([size="md"]){--_h:8px}:host([size="lg"]){--_h:12px}:host([variant="success"]){--_fill:var(--ind-feedback-success-bg, #16a34a)}:host([variant="warning"]){--_fill:var(--ind-feedback-warning-bg, #f59e0b)}:host([variant="error"]){--_fill:var(--ind-feedback-error-bg, #dc2626)}.header{display:flex;justify-content:space-between;align-items:baseline;gap:var(--ind-spacing-3, 6px);margin-bottom:var(--ind-spacing-2, 4px)}.label{color:var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2))}.value{font-family:var(--ind-font-family-mono);font-weight:var(--ind-font-weight-semibold, 600);font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1)}.track{position:relative;width:100%;height:var(--_h);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);overflow:hidden}.fill{display:block;height:100%;background:var(--_fill);transition:width var(--ind-motion-duration-base, 200ms) var(--ind-motion-easing-standard, ease)}:host([indeterminate]) .fill{width:30%;animation:ind-progress-march 1.4s ease-in-out infinite}@keyframes ind-progress-march{0%{margin-left:-30%}100%{margin-left:100%}}@media (prefers-reduced-motion: reduce){:host([indeterminate]) .fill{animation:none;width:100%;opacity:0.5}}`;
 
@@ -35,7 +35,7 @@ const IndProgress = class {
     }
     render() {
         const pct = this.percent();
-        return (h(Host, { key: '0e74d2952b1fe8b2356927e0e38adbcb72d863c6', role: "progressbar", "aria-valuenow": this.indeterminate ? undefined : this.value, "aria-valuemin": 0, "aria-valuemax": this.max, "aria-label": this.label }, (this.label || this.showValue) && (h("div", { key: '1fbeb6fed63ac3fb1cb830408d6ee851ec9fe989', class: "header", part: "header" }, this.label && h("span", { key: '1a2a0e6bb58c4e69b5b19587906e7c53720587cb', class: "label", part: "label" }, this.label), this.showValue && !this.indeterminate && (h("span", { key: '7fa1c9ce1e0ec68abc1b478cfb373af8266467a3', class: "value", part: "value" }, this.valueLabel())))), h("div", { key: 'e821a5f203432e33199d111ba807eb6106068b14', class: "track", part: "track" }, h("div", { key: '88e1e2728d12adea9220b3cf8f68072e85bdc1dd', class: "fill", part: "fill", style: this.indeterminate ? undefined : { width: `${pct}%` } }))));
+        return (h(Host, { key: '97a35a339db17e295b11d1fe68f0024a44a5dc26', role: "progressbar", "aria-valuenow": this.indeterminate ? undefined : this.value, "aria-valuemin": 0, "aria-valuemax": this.max, "aria-label": this.label }, (this.label || this.showValue) && (h("div", { key: 'bfc9bc977d571e39c01c1342e6aa3c1897284f48', class: "header", part: "header" }, this.label && h("span", { key: '276b5bee53c566109d62946546320e85e61ea5f2', class: "label", part: "label" }, this.label), this.showValue && !this.indeterminate && (h("span", { key: 'dcbe59da993f2f88989e352dcf3aaeb3f6d1e286', class: "value", part: "value" }, this.valueLabel())))), h("div", { key: '3ace595c028a654ae027d44a96b738bf923bfcbf', class: "track", part: "track" }, h("div", { key: 'db526a2dc6a655090cf338f405415f61912cc4c2', class: "fill", part: "fill", style: this.indeterminate ? undefined : { width: `${pct}%` } }))));
     }
 };
 IndProgress.style = progressCss();

package/dist/esm/ind-pump-card.entry.js

@@ -0,0 +1,37 @@
+import { r as registerInstance, h, H as Host } from './index-Bls_NlWP.js';
+
+const cardCss = () => `:host{display:flex;flex-direction:column;gap:var(--ind-spacing-3, 6px);padding:var(--ind-spacing-5, 12px);background:var(--ind-surface-panel);border:1px solid var(--ind-surface-border-default);border-radius:var(--ind-radius-md, 3px);font-family:var(--ind-font-family-sans);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1);box-sizing:border-box;min-width:160px}.card-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--ind-spacing-3, 6px)}.card-title{font-size:var(--ind-font-size-xs, 10px);font-weight:var(--ind-font-weight-bold, 700);text-transform:uppercase;letter-spacing:0.08em;color:var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2))}.card-tag{font-family:var(--ind-font-family-mono);font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2))}.card-detail{font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0))}:host([state="fault"]){border-color:var(--ind-state-fault-bg, #dc2626);box-shadow:0 0 0 1px color-mix(in srgb, var(--ind-state-fault-bg, #dc2626) 30%, transparent)}:host([state="warning"]){border-color:color-mix(in srgb, var(--ind-state-warning-bg, #f59e0b) 60%, var(--ind-surface-border-default))}`;
+
+const equipmentCardCss = () => `.body{display:flex;align-items:center;gap:var(--ind-spacing-5, 12px)}.symbol{flex:0 0 auto}.metrics{display:flex;flex-direction:column;gap:var(--ind-spacing-2, 4px);margin-left:auto;align-items:flex-end;text-align:right}`;
+
+const pumpCardCss = () => `:host{min-width:200px}`;
+
+const IndPumpCard = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+    }
+    /** Equipment tag (e.g. "P-101"). */
+    tag;
+    /** Human label (e.g. "Feed pump"). */
+    label;
+    /** Process state — `running` animates the impeller, drives fault chrome. */
+    state = 'stopped';
+    /** Flow rate. */
+    flow;
+    /** Flow unit (default m³/h). */
+    flowUnit = 'm³/h';
+    /** Discharge pressure. */
+    pressure;
+    /** Pressure unit (default bar). */
+    pressureUnit = 'bar';
+    render() {
+        const name = this.label ?? this.tag ?? 'Pump';
+        return (h(Host, { key: '8fb545e6ac8a37e077984192fdce0dd9b7bdcceb', role: "group", "aria-label": `${name} — ${this.state}` }, h("div", { key: 'c98476ef85c1884e3a38a4af9e909d2dab0b02f2', class: "card-head" }, h("span", { key: '0353760dbe863230c512b559824429a4fa56e4cb', class: "card-title", part: "label" }, name), this.tag && h("span", { key: '860243b936398752a4399bd6a04f09e9e7b01988', class: "card-tag", part: "tag" }, this.tag)), h("div", { key: 'e95d0f3e3fccec39588126ff4bded6c2b4b6e93c', class: "body", part: "body" }, h("ind-pump", { key: 'a87093f9a8eabb59b3163d2f1dd5515b38228816', class: "symbol", state: this.state, size: "md" }), h("div", { key: '7ebb806b382a065cc78fb8defa78258d071f618e', class: "metrics", part: "metrics" }, this.flow !== undefined && (h("ind-value", { key: '12ebaa3a61e42bd2862b8b7a19c68fd334bec747', value: this.flow, unit: this.flowUnit, precision: 1, label: "Flow", size: "md" })), this.pressure !== undefined && (h("ind-value", { key: '417d7e38283f9a48f3fb2a4dc1f8adf058af481c', value: this.pressure, unit: this.pressureUnit, precision: 2, label: "Pressure", size: "sm" }))))));
+    }
+};
+IndPumpCard.style = cardCss() + (equipmentCardCss() + pumpCardCss());
+
+export { IndPumpCard as ind_pump_card };
+//# sourceMappingURL=ind-pump-card.entry.js.map
+
+//# sourceMappingURL=ind-pump-card.entry.js.map

package/dist/esm/ind-pump-card.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ind-pump-card.entry.js","sources":["src/components/molecules/_shared/card.css?tag=ind-pump-card&encapsulation=shadow","src/components/molecules/_shared/equipment-card.css?tag=ind-pump-card&encapsulation=shadow","src/components/molecules/pump-card/pump-card.css?tag=ind-pump-card&encapsulation=shadow","src/components/molecules/pump-card/pump-card.tsx"],"sourcesContent":["/* Shared chrome for molecule \"card\" components. Pulled in first via\n * `styleUrls: ['../_shared/card.css', 'xxx.css']` so each card can override. */\n:host {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ind-spacing-3, 6px);\n  padding: var(--ind-spacing-5, 12px);\n  background: var(--ind-surface-panel);\n  border: 1px solid var(--ind-surface-border-default);\n  border-radius: var(--ind-radius-md, 3px);\n  font-family: var(--ind-font-family-sans);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n  box-sizing: border-box;\n  min-width: 160px;\n}\n\n.card-head {\n  display: flex;\n  align-items: baseline;\n  justify-content: space-between;\n  gap: var(--ind-spacing-3, 6px);\n}\n\n.card-title {\n  font-size: var(--ind-font-size-xs, 10px);\n  font-weight: var(--ind-font-weight-bold, 700);\n  text-transform: uppercase;\n  letter-spacing: 0.08em;\n  color: var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));\n}\n\n.card-tag {\n  font-family: var(--ind-font-family-mono);\n  font-size: var(--ind-font-size-sm, 11px);\n  color: var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));\n}\n\n.card-detail {\n  font-size: var(--ind-font-size-sm, 11px);\n  color: var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));\n}\n\n/* Fault chrome cue, opt-in by reflecting state=\"fault\" on the host. */\n:host([state=\"fault\"]) {\n  border-color: var(--ind-state-fault-bg, #dc2626);\n  box-shadow: 0 0 0 1px color-mix(in srgb, var(--ind-state-fault-bg, #dc2626) 30%, transparent);\n}\n:host([state=\"warning\"]) {\n  border-color: color-mix(in srgb, var(--ind-state-warning-bg, #f59e0b) 60%, var(--ind-surface-border-default));\n}\n","/* Shared layout for the equipment faceplate cards (motor, pump, valve, tank).\n * Loaded after card.css and before each component's own sheet. */\n.body {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-5, 12px);\n}\n\n.symbol {\n  flex: 0 0 auto;\n}\n\n.metrics {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ind-spacing-2, 4px);\n  margin-left: auto;\n  align-items: flex-end;\n  text-align: right;\n}\n",":host {\n  min-width: 200px;\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\nimport type { EquipmentState } from '../../atoms/_equipment/types';\n\n/**\n * Pump faceplate: animated `<ind-pump>` symbol plus flow / pressure readouts.\n */\n@Component({\n  tag: 'ind-pump-card',\n  styleUrls: ['../_shared/card.css', '../_shared/equipment-card.css', 'pump-card.css'],\n  shadow: true,\n})\nexport class IndPumpCard {\n  /** Equipment tag (e.g. \"P-101\"). */\n  @Prop() tag?: string;\n  /** Human label (e.g. \"Feed pump\"). */\n  @Prop() label?: string;\n  /** Process state — `running` animates the impeller, drives fault chrome. */\n  @Prop({ reflect: true }) state: EquipmentState = 'stopped';\n  /** Flow rate. */\n  @Prop() flow?: number;\n  /** Flow unit (default m³/h). */\n  @Prop() flowUnit: string = 'm³/h';\n  /** Discharge pressure. */\n  @Prop() pressure?: number;\n  /** Pressure unit (default bar). */\n  @Prop() pressureUnit: string = 'bar';\n\n  render() {\n    const name = this.label ?? this.tag ?? 'Pump';\n    return (\n      <Host role=\"group\" aria-label={`${name} — ${this.state}`}>\n        <div class=\"card-head\">\n          <span class=\"card-title\" part=\"label\">{name}</span>\n          {this.tag && <span class=\"card-tag\" part=\"tag\">{this.tag}</span>}\n        </div>\n        <div class=\"body\" part=\"body\">\n          <ind-pump class=\"symbol\" state={this.state} size=\"md\" />\n          <div class=\"metrics\" part=\"metrics\">\n            {this.flow !== undefined && (\n              <ind-value value={this.flow} unit={this.flowUnit} precision={1} label=\"Flow\" size=\"md\" />\n            )}\n            {this.pressure !== undefined && (\n              <ind-value value={this.pressure} unit={this.pressureUnit} precision={2} label=\"Pressure\" size=\"sm\" />\n            )}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,OAAO,GAAG,MAAM,CAAC,2zCAA2zC,CAAC;;ACAn1C,MAAM,gBAAgB,GAAG,MAAM,CAAC,4NAA4N,CAAC;;ACA7P,MAAM,WAAW,GAAG,MAAM,CAAC,sBAAsB,CAAC;;MCWrC,WAAW,GAAA,MAAA;;;;;AAEd,IAAA,GAAG;;AAEH,IAAA,KAAK;;IAEY,KAAK,GAAmB,SAAS;;AAElD,IAAA,IAAI;;IAEJ,QAAQ,GAAW,MAAM;;AAEzB,IAAA,QAAQ;;IAER,YAAY,GAAW,KAAK;IAEpC,MAAM,GAAA;QACJ,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,GAAG,IAAI,MAAM;QAC7C,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,IAAI,EAAC,OAAO,EAAA,YAAA,EAAa,CAAA,EAAG,IAAI,CAAA,GAAA,EAAM,IAAI,CAAC,KAAK,CAAA,CAAE,EAAA,EACtD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,WAAW,EAAA,EACpB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,YAAY,EAAC,IAAI,EAAC,OAAO,EAAA,EAAE,IAAI,CAAQ,EAClD,IAAI,CAAC,GAAG,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,UAAU,EAAC,IAAI,EAAC,KAAK,EAAA,EAAE,IAAI,CAAC,GAAG,CAAQ,CAC5D,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM,EAAA,EAC3B,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,KAAK,EAAC,QAAQ,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAC,IAAI,EAAA,CAAG,EACxD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,SAAS,EAAA,EAChC,IAAI,CAAC,IAAI,KAAK,SAAS,KACtB,CAAA,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAW,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,GAAG,CAC1F,EACA,IAAI,CAAC,QAAQ,KAAK,SAAS,KAC1B,CAAA,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAW,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,CAAC,YAAY,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAC,UAAU,EAAC,IAAI,EAAC,IAAI,GAAG,CACtG,CACG,CACF,CACD;;;;;;;"}

package/dist/esm/ind-pump-control-panel.entry.js

@@ -0,0 +1,45 @@
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-Bls_NlWP.js';
+
+const panelCss = () => `:host{display:flex;flex-direction:column;background:var(--ind-surface-panel);border:1px solid var(--ind-surface-border-default);border-radius:var(--ind-radius-md, 3px);font-family:var(--ind-font-family-sans);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));box-sizing:border-box;overflow:hidden;font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1)}.panel-head{display:flex;align-items:center;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-4, 8px) var(--ind-spacing-5, 12px);border-bottom:1px solid var(--ind-surface-border-subtle);background:var(--ind-surface-raised);flex:0 0 auto}.panel-titles{display:flex;flex-direction:column;min-width:0}.panel-title{font-size:var(--ind-font-size-md, 13px);font-weight:var(--ind-font-weight-semibold, 600);line-height:1.2}.panel-subtitle{font-size:var(--ind-font-size-xs, 10px);text-transform:uppercase;letter-spacing:0.06em;color:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0))}.panel-tag{font-family:var(--ind-font-family-mono);font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-secondary)}.panel-actions{margin-left:auto;display:flex;align-items:center;gap:var(--ind-spacing-3, 6px)}.panel-body{display:flex;flex-direction:column;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-5, 12px);min-height:0}.panel-toolbar{display:flex;align-items:center;gap:var(--ind-spacing-3, 6px);padding:var(--ind-spacing-3, 6px) var(--ind-spacing-5, 12px);border-bottom:1px solid var(--ind-surface-border-subtle);flex:0 0 auto}.panel-list{display:flex;flex-direction:column;overflow:auto}.panel-grid{display:grid;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-5, 12px)}.panel-empty{padding:var(--ind-spacing-7, 20px);text-align:center;color:var(--ind-surface-text-muted);font-size:var(--ind-font-size-sm, 11px)}.panel-spacer{flex:1 1 auto}`;
+
+const controlPanelCss = () => `.panel-body>ind-motor-card,.panel-body>ind-pump-card,.panel-body>ind-valve-card,.panel-body>ind-start-stop-control,.panel-body>ind-setpoint-control,.panel-body>ind-speed-control,.panel-body>ind-mode-selector,.panel-body>ind-recipe-selector{border:0;padding:0;background:transparent;min-width:0}`;
+
+const pumpControlPanelCss = () => `:host{min-width:280px}`;
+
+const IndPumpControlPanel = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.indStart = createEvent(this, "indStart");
+        this.indStop = createEvent(this, "indStop");
+        this.indMode = createEvent(this, "indMode");
+    }
+    heading = 'Pump';
+    tag;
+    state = 'stopped';
+    flow;
+    pressure;
+    mode;
+    indStart;
+    indStop;
+    indMode;
+    runState() {
+        if (this.state === 'running')
+            return 'running';
+        if (this.state === 'fault')
+            return 'fault';
+        return 'stopped';
+    }
+    onMode = (e) => {
+        e.stopPropagation();
+        this.indMode.emit(e.detail);
+    };
+    render() {
+        return (h(Host, { key: 'd8912bba9bd856bd8d7441725e604a198af9cfad' }, h("div", { key: 'c2753a9668b3664af68836a35094280701dcbcf5', class: "panel-head" }, h("div", { key: 'd496718af739b6146b1a2488eb2546267d4c0e31', class: "panel-titles" }, h("span", { key: 'ac679e3704a44465ab547f5dda0a6ad6d7230f61', class: "panel-title", part: "heading" }, this.heading), this.tag && h("span", { key: '38aca6f60bf902877172a590d174896120efb07d', class: "panel-subtitle" }, this.tag))), h("div", { key: '7a388aa6bc9aef0e4a1ac7172d64ea673bf0b72a', class: "panel-body" }, h("ind-pump-card", { key: '068a75833a8476b9146d90127027b7b05d49d287', tag: this.tag, label: this.heading, state: this.state, flow: this.flow, pressure: this.pressure }), h("ind-start-stop-control", { key: '6711c260e7f9cb982a15f1efcc2e904f4a04bae5', label: this.heading, state: this.runState(), onIndStart: () => this.indStart.emit(), onIndStop: () => this.indStop.emit() }), h("ind-mode-selector", { key: '3b35daf8000b0cee1e3ba7e3724859bd07e79751', value: this.mode, onIndChange: this.onMode }))));
+    }
+};
+IndPumpControlPanel.style = panelCss() + (controlPanelCss() + pumpControlPanelCss());
+
+export { IndPumpControlPanel as ind_pump_control_panel };
+//# sourceMappingURL=ind-pump-control-panel.entry.js.map
+
+//# sourceMappingURL=ind-pump-control-panel.entry.js.map

package/dist/esm/ind-pump-control-panel.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ind-pump-control-panel.entry.js","sources":["src/components/organisms/_shared/panel.css?tag=ind-pump-control-panel&encapsulation=shadow","src/components/organisms/_shared/control-panel.css?tag=ind-pump-control-panel&encapsulation=shadow","src/components/organisms/pump-control-panel/pump-control-panel.css?tag=ind-pump-control-panel&encapsulation=shadow","src/components/organisms/pump-control-panel/pump-control-panel.tsx"],"sourcesContent":["/* Shared chrome for organism panels. Pulled in first via\n * `styleUrls: ['../_shared/panel.css', 'xxx.css']`. */\n:host {\n  display: flex;\n  flex-direction: column;\n  background: var(--ind-surface-panel);\n  border: 1px solid var(--ind-surface-border-default);\n  border-radius: var(--ind-radius-md, 3px);\n  font-family: var(--ind-font-family-sans);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n  box-sizing: border-box;\n  overflow: hidden;\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n}\n\n.panel-head {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-4, 8px) var(--ind-spacing-5, 12px);\n  border-bottom: 1px solid var(--ind-surface-border-subtle);\n  background: var(--ind-surface-raised);\n  flex: 0 0 auto;\n}\n\n.panel-titles {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.panel-title {\n  font-size: var(--ind-font-size-md, 13px);\n  font-weight: var(--ind-font-weight-semibold, 600);\n  line-height: 1.2;\n}\n\n.panel-subtitle {\n  font-size: var(--ind-font-size-xs, 10px);\n  text-transform: uppercase;\n  letter-spacing: 0.06em;\n  color: var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));\n}\n\n.panel-tag {\n  font-family: var(--ind-font-family-mono);\n  font-size: var(--ind-font-size-sm, 11px);\n  color: var(--ind-surface-text-secondary);\n}\n\n.panel-actions {\n  margin-left: auto;\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n}\n\n.panel-body {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-5, 12px);\n  min-height: 0;\n}\n\n.panel-toolbar {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n  padding: var(--ind-spacing-3, 6px) var(--ind-spacing-5, 12px);\n  border-bottom: 1px solid var(--ind-surface-border-subtle);\n  flex: 0 0 auto;\n}\n\n.panel-list {\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n}\n\n.panel-grid {\n  display: grid;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-5, 12px);\n}\n\n.panel-empty {\n  padding: var(--ind-spacing-7, 20px);\n  text-align: center;\n  color: var(--ind-surface-text-muted);\n  font-size: var(--ind-font-size-sm, 11px);\n}\n\n.panel-spacer {\n  flex: 1 1 auto;\n}\n","/* Flatten the faceplate / control molecules when embedded in a control panel,\n * so the panel provides the single card chrome. */\n.panel-body > ind-motor-card,\n.panel-body > ind-pump-card,\n.panel-body > ind-valve-card,\n.panel-body > ind-start-stop-control,\n.panel-body > ind-setpoint-control,\n.panel-body > ind-speed-control,\n.panel-body > ind-mode-selector,\n.panel-body > ind-recipe-selector {\n  border: 0;\n  padding: 0;\n  background: transparent;\n  min-width: 0;\n}\n",":host {\n  min-width: 280px;\n}\n","import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\nimport type { EquipmentState } from '../../atoms/_equipment/types';\nimport type { RunState } from '../../molecules/start-stop-control/start-stop-control';\n\n/**\n * Pump control panel: `<ind-pump-card>` faceplate plus start/stop and mode.\n */\n@Component({\n  tag: 'ind-pump-control-panel',\n  styleUrls: ['../_shared/panel.css', '../_shared/control-panel.css', 'pump-control-panel.css'],\n  shadow: true,\n})\nexport class IndPumpControlPanel {\n  @Prop() heading: string = 'Pump';\n  @Prop() tag?: string;\n  @Prop({ reflect: true }) state: EquipmentState = 'stopped';\n  @Prop() flow?: number;\n  @Prop() pressure?: number;\n  @Prop() mode?: string;\n\n  @Event() indStart!: EventEmitter<void>;\n  @Event() indStop!: EventEmitter<void>;\n  @Event() indMode!: EventEmitter<string>;\n\n  private runState(): RunState {\n    if (this.state === 'running') return 'running';\n    if (this.state === 'fault') return 'fault';\n    return 'stopped';\n  }\n\n  private onMode = (e: CustomEvent<string>) => {\n    e.stopPropagation();\n    this.indMode.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-pump-card\n            tag={this.tag}\n            label={this.heading}\n            state={this.state}\n            flow={this.flow}\n            pressure={this.pressure}\n          />\n          <ind-start-stop-control\n            label={this.heading}\n            state={this.runState()}\n            onIndStart={() => this.indStart.emit()}\n            onIndStop={() => this.indStop.emit()}\n          />\n          <ind-mode-selector value={this.mode} onIndChange={this.onMode} />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,yzDAAyzD,CAAC;;ACAl1D,MAAM,eAAe,GAAG,MAAM,CAAC,sSAAsS,CAAC;;ACAtU,MAAM,mBAAmB,GAAG,MAAM,CAAC,sBAAsB,CAAC;;MCY7C,mBAAmB,GAAA,MAAA;;;;;;;IACtB,OAAO,GAAW,MAAM;AACxB,IAAA,GAAG;IACc,KAAK,GAAmB,SAAS;AAClD,IAAA,IAAI;AACJ,IAAA,QAAQ;AACR,IAAA,IAAI;AAEH,IAAA,QAAQ;AACR,IAAA,OAAO;AACP,IAAA,OAAO;IAER,QAAQ,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS;AAAE,YAAA,OAAO,SAAS;AAC9C,QAAA,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO;AAAE,YAAA,OAAO,OAAO;AAC1C,QAAA,OAAO,SAAS;;AAGV,IAAA,MAAM,GAAG,CAAC,CAAsB,KAAI;QAC1C,CAAC,CAAC,eAAe,EAAE;QACnB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;AAC7B,KAAC;IAED,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,YAAY,EAAA,EACrB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,cAAc,EAAA,EACvB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,SAAS,EAAA,EAAE,IAAI,CAAC,OAAO,CAAQ,EAC7D,IAAI,CAAC,GAAG,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,gBAAgB,EAAA,EAAE,IAAI,CAAC,GAAG,CAAQ,CACvD,CACF,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,YAAY,EAAA,EACrB,CAAA,CAAA,eAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,KAAK,EAAE,IAAI,CAAC,OAAO,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,CACvB,EACF,CAAA,CAAA,wBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,IAAI,CAAC,OAAO,EACnB,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,EACtB,UAAU,EAAE,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,EACtC,SAAS,EAAE,MAAM,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,EAAA,CACpC,EACF,CAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAmB,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,WAAW,EAAE,IAAI,CAAC,MAAM,EAAA,CAAI,CAC7D,CACD;;;;;;;"}

package/dist/esm/ind-pump.entry.js

@@ -0,0 +1,29 @@
+import { r as registerInstance, h, H as Host } from './index-Bls_NlWP.js';
+
+const equipmentCss = () => `:host{display:inline-flex;flex-direction:column;align-items:center;gap:var(--ind-spacing-2, 4px);font-family:var(--ind-font-family-sans, system-ui, sans-serif);font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));--_w:48px;--_stroke:var(--ind-state-stopped-border, #8390a0);--_fill:var(--ind-state-stopped-bg, #5a6776);--_accent:var(--ind-state-stopped-bg, #5a6776)}:host([size="sm"]){--_w:32px}:host([size="md"]){--_w:48px}:host([size="lg"]){--_w:72px}:host([state="running"]){--_stroke:var(--ind-state-running-border, #4ade80);--_fill:var(--ind-state-running-bg, #16a34a);--_accent:var(--ind-state-running-bg, #16a34a)}:host([state="stopped"]){--_stroke:var(--ind-state-stopped-border, #8390a0);--_fill:var(--ind-state-stopped-bg, #5a6776);--_accent:var(--ind-state-stopped-bg, #5a6776)}:host([state="fault"]){--_stroke:var(--ind-state-fault-border, #f87171);--_fill:var(--ind-state-fault-bg, #dc2626);--_accent:var(--ind-state-fault-bg, #dc2626)}:host([state="warning"]){--_stroke:var(--ind-state-warning-border, #fcd34d);--_fill:var(--ind-state-warning-bg, #f59e0b);--_accent:var(--ind-state-warning-bg, #f59e0b)}:host([state="maintenance"]){--_stroke:var(--ind-state-maintenance-border, #60a5fa);--_fill:var(--ind-state-maintenance-bg, #2563eb);--_accent:var(--ind-state-maintenance-bg, #2563eb)}.symbol{display:block;width:var(--_w);height:auto;overflow:visible}.body{fill:color-mix(in srgb, var(--_fill) 22%, transparent);stroke:var(--_stroke);stroke-width:1.5;vector-effect:non-scaling-stroke}.accent{fill:var(--_accent);stroke:none}.stroke{fill:none;stroke:var(--_stroke);stroke-width:1.5;stroke-linecap:round;vector-effect:non-scaling-stroke}.caption{display:flex;flex-direction:column;align-items:center;line-height:var(--ind-font-line-height-tight, 1.1)}.tag{font-family:var(--ind-font-family-mono, ui-monospace, monospace);font-weight:var(--ind-font-weight-semibold, 600);font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1)}.label{color:var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));font-size:var(--ind-font-size-xs, 10px)}@media (prefers-reduced-motion: reduce){.spin,.pulse{animation:none !important}}`;
+
+const pumpCss = () => `:host([state="running"]) .spin{animation:ind-pump-spin 1.6s linear infinite}@keyframes ind-pump-spin{to{transform:rotate(360deg)}}`;
+
+const IndPump = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+    }
+    /** Process state. `running` animates the impeller. */
+    state = 'stopped';
+    /** Visual size. */
+    size = 'md';
+    /** Equipment tag (e.g. "P-101"). */
+    tag;
+    /** Human label (e.g. "Feed pump"). */
+    label;
+    render() {
+        const name = this.label ?? this.tag ?? 'pump';
+        return (h(Host, { key: 'c94d1f1822da5bb07293f43541481de5f3cc52dd', role: "img", "aria-label": `${name} — ${this.state}` }, h("svg", { key: '183f70a7dd2677df2f364ba67578f780422fbf69', class: "symbol", viewBox: "0 0 48 48", "aria-hidden": "true" }, h("circle", { key: 'e81a8a03649e3a8e17327f6d27992613393e381d', class: "body", cx: "22", cy: "24", r: "14" }), h("polygon", { key: '55f3562be5b500dfb5dcf49833fa2d537d05555f', class: "accent", points: "22,24 38,16 38,32" }), h("g", { key: 'f8db2b0032ba389cbad360c4a5b60ac286f1cddb', class: "spin", style: { transformOrigin: '22px 24px' } }, h("line", { key: 'ca98c47805ecd193cd74ebc7704b7056ad6dd7b1', class: "stroke", x1: "22", y1: "14", x2: "22", y2: "34" }), h("line", { key: '4b0cdfa1d2ddd30328f16fb97a12c87b9f900a49', class: "stroke", x1: "12", y1: "24", x2: "32", y2: "24" }))), (this.tag || this.label) && (h("div", { key: '6eae6c4f9de61beaadc795f265901fd60ce52700', class: "caption" }, this.tag && h("span", { key: 'd0d7b89021ccac34de8a5c7494e0ba93b2d97389', class: "tag" }, this.tag), this.label && h("span", { key: '3e594c3bae463c699a91f05f5cb00d01ad278c88', class: "label" }, this.label)))));
+    }
+};
+IndPump.style = equipmentCss() + pumpCss();
+
+export { IndPump as ind_pump };
+//# sourceMappingURL=ind-pump.entry.js.map
+
+//# sourceMappingURL=ind-pump.entry.js.map

package/dist/esm/ind-pump.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ind-pump.entry.js","sources":["src/components/atoms/_equipment/equipment.css?tag=ind-pump&encapsulation=shadow","src/components/atoms/pump/pump.css?tag=ind-pump&encapsulation=shadow","src/components/atoms/pump/pump.tsx"],"sourcesContent":["/* Shared base styles for ind-ds process-equipment symbols.\n * Referenced via styleUrls alongside each component's own CSS. */\n:host {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--ind-spacing-2, 4px);\n  font-family: var(--ind-font-family-sans, system-ui, sans-serif);\n  font-size: var(--ind-font-size-sm, 11px);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n  --_w: 48px;\n  --_stroke: var(--ind-state-stopped-border, #8390a0);\n  --_fill: var(--ind-state-stopped-bg, #5a6776);\n  --_accent: var(--ind-state-stopped-bg, #5a6776);\n}\n\n:host([size=\"sm\"]) { --_w: 32px; }\n:host([size=\"md\"]) { --_w: 48px; }\n:host([size=\"lg\"]) { --_w: 72px; }\n\n:host([state=\"running\"])     { --_stroke: var(--ind-state-running-border, #4ade80); --_fill: var(--ind-state-running-bg, #16a34a); --_accent: var(--ind-state-running-bg, #16a34a); }\n:host([state=\"stopped\"])     { --_stroke: var(--ind-state-stopped-border, #8390a0); --_fill: var(--ind-state-stopped-bg, #5a6776); --_accent: var(--ind-state-stopped-bg, #5a6776); }\n:host([state=\"fault\"])       { --_stroke: var(--ind-state-fault-border, #f87171); --_fill: var(--ind-state-fault-bg, #dc2626); --_accent: var(--ind-state-fault-bg, #dc2626); }\n:host([state=\"warning\"])     { --_stroke: var(--ind-state-warning-border, #fcd34d); --_fill: var(--ind-state-warning-bg, #f59e0b); --_accent: var(--ind-state-warning-bg, #f59e0b); }\n:host([state=\"maintenance\"]) { --_stroke: var(--ind-state-maintenance-border, #60a5fa); --_fill: var(--ind-state-maintenance-bg, #2563eb); --_accent: var(--ind-state-maintenance-bg, #2563eb); }\n\n.symbol {\n  display: block;\n  width: var(--_w);\n  height: auto;\n  overflow: visible;\n}\n\n.body {\n  fill: color-mix(in srgb, var(--_fill) 22%, transparent);\n  stroke: var(--_stroke);\n  stroke-width: 1.5;\n  vector-effect: non-scaling-stroke;\n}\n\n.accent {\n  fill: var(--_accent);\n  stroke: none;\n}\n\n.stroke {\n  fill: none;\n  stroke: var(--_stroke);\n  stroke-width: 1.5;\n  stroke-linecap: round;\n  vector-effect: non-scaling-stroke;\n}\n\n.caption {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  line-height: var(--ind-font-line-height-tight, 1.1);\n}\n\n.tag {\n  font-family: var(--ind-font-family-mono, ui-monospace, monospace);\n  font-weight: var(--ind-font-weight-semibold, 600);\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n}\n\n.label {\n  color: var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));\n  font-size: var(--ind-font-size-xs, 10px);\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .spin, .pulse { animation: none !important; }\n}\n",":host([state=\"running\"]) .spin {\n  animation: ind-pump-spin 1.6s linear infinite;\n}\n\n@keyframes ind-pump-spin {\n  to { transform: rotate(360deg); }\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\nimport type { EquipmentState, EquipmentSize } from '../_equipment/types';\n\n@Component({\n  tag: 'ind-pump',\n  styleUrls: ['../_equipment/equipment.css', 'pump.css'],\n  shadow: true,\n})\nexport class IndPump {\n  /** Process state. `running` animates the impeller. */\n  @Prop({ reflect: true }) state: EquipmentState = 'stopped';\n  /** Visual size. */\n  @Prop({ reflect: true }) size: EquipmentSize = 'md';\n  /** Equipment tag (e.g. \"P-101\"). */\n  @Prop() tag?: string;\n  /** Human label (e.g. \"Feed pump\"). */\n  @Prop() label?: string;\n\n  render() {\n    const name = this.label ?? this.tag ?? 'pump';\n    return (\n      <Host role=\"img\" aria-label={`${name} — ${this.state}`}>\n        {/* ISA centrifugal pump: circle body + triangular discharge. */}\n        <svg class=\"symbol\" viewBox=\"0 0 48 48\" aria-hidden=\"true\">\n          <circle class=\"body\" cx=\"22\" cy=\"24\" r=\"14\" />\n          <polygon class=\"accent\" points=\"22,24 38,16 38,32\" />\n          <g class=\"spin\" style={{ transformOrigin: '22px 24px' }}>\n            <line class=\"stroke\" x1=\"22\" y1=\"14\" x2=\"22\" y2=\"34\" />\n            <line class=\"stroke\" x1=\"12\" y1=\"24\" x2=\"32\" y2=\"24\" />\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"],"names":[],"mappings":";;AAAA,MAAM,YAAY,GAAG,MAAM,CAAC,ypEAAypE,CAAC;;ACAtrE,MAAM,OAAO,GAAG,MAAM,CAAC,kIAAkI,CAAC;;MCQ7I,OAAO,GAAA,MAAA;;;;;IAEO,KAAK,GAAmB,SAAS;;IAEjC,IAAI,GAAkB,IAAI;;AAE3C,IAAA,GAAG;;AAEH,IAAA,KAAK;IAEb,MAAM,GAAA;QACJ,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,GAAG,IAAI,MAAM;AAC7C,QAAA,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,IAAI,EAAC,KAAK,EAAA,YAAA,EAAa,CAAA,EAAG,IAAI,CAAA,GAAA,EAAM,IAAI,CAAC,KAAK,CAAA,CAAE,EAAA,EAEpD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,WAAW,iBAAa,MAAM,EAAA,EACxD,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,MAAM,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,IAAI,EAAA,CAAG,EAC9C,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,KAAK,EAAC,QAAQ,EAAC,MAAM,EAAC,mBAAmB,EAAA,CAAG,EACrD,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,eAAe,EAAE,WAAW,EAAE,EAAA,EACrD,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,QAAQ,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAA,CAAG,EACvD,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,QAAQ,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAA,CAAG,CACrD,CACA,EACL,CAAC,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,KAAK,MACtB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,SAAS,EAAA,EACjB,IAAI,CAAC,GAAG,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,KAAK,EAAA,EAAE,IAAI,CAAC,GAAG,CAAQ,EAC/C,IAAI,CAAC,KAAK,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,OAAO,EAAA,EAAE,IAAI,CAAC,KAAK,CAAQ,CAClD,CACP,CACI;;;;;;;"}

package/dist/esm/ind-recipe-management-panel.entry.js

@@ -0,0 +1,46 @@
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-Bls_NlWP.js';
+
+const panelCss = () => `:host{display:flex;flex-direction:column;background:var(--ind-surface-panel);border:1px solid var(--ind-surface-border-default);border-radius:var(--ind-radius-md, 3px);font-family:var(--ind-font-family-sans);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));box-sizing:border-box;overflow:hidden;font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1)}.panel-head{display:flex;align-items:center;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-4, 8px) var(--ind-spacing-5, 12px);border-bottom:1px solid var(--ind-surface-border-subtle);background:var(--ind-surface-raised);flex:0 0 auto}.panel-titles{display:flex;flex-direction:column;min-width:0}.panel-title{font-size:var(--ind-font-size-md, 13px);font-weight:var(--ind-font-weight-semibold, 600);line-height:1.2}.panel-subtitle{font-size:var(--ind-font-size-xs, 10px);text-transform:uppercase;letter-spacing:0.06em;color:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0))}.panel-tag{font-family:var(--ind-font-family-mono);font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-secondary)}.panel-actions{margin-left:auto;display:flex;align-items:center;gap:var(--ind-spacing-3, 6px)}.panel-body{display:flex;flex-direction:column;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-5, 12px);min-height:0}.panel-toolbar{display:flex;align-items:center;gap:var(--ind-spacing-3, 6px);padding:var(--ind-spacing-3, 6px) var(--ind-spacing-5, 12px);border-bottom:1px solid var(--ind-surface-border-subtle);flex:0 0 auto}.panel-list{display:flex;flex-direction:column;overflow:auto}.panel-grid{display:grid;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-5, 12px)}.panel-empty{padding:var(--ind-spacing-7, 20px);text-align:center;color:var(--ind-surface-text-muted);font-size:var(--ind-font-size-sm, 11px)}.panel-spacer{flex:1 1 auto}`;
+
+const controlPanelCss = () => `.panel-body>ind-motor-card,.panel-body>ind-pump-card,.panel-body>ind-valve-card,.panel-body>ind-start-stop-control,.panel-body>ind-setpoint-control,.panel-body>ind-speed-control,.panel-body>ind-mode-selector,.panel-body>ind-recipe-selector{border:0;padding:0;background:transparent;min-width:0}`;
+
+const recipeManagementPanelCss = () => `:host{min-width:340px}.params{display:flex;flex-direction:column;border:1px solid var(--ind-surface-border-subtle);border-radius:var(--ind-radius-sm, 2px)}`;
+
+const IndRecipeManagementPanel = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.indChange = createEvent(this, "indChange");
+        this.indLoad = createEvent(this, "indLoad");
+        this.indSave = createEvent(this, "indSave");
+    }
+    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 }))))))));
+    }
+};
+IndRecipeManagementPanel.style = panelCss() + (controlPanelCss() + recipeManagementPanelCss());
+
+export { IndRecipeManagementPanel as ind_recipe_management_panel };
+//# sourceMappingURL=ind-recipe-management-panel.entry.js.map
+
+//# sourceMappingURL=ind-recipe-management-panel.entry.js.map

package/dist/esm/ind-recipe-management-panel.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ind-recipe-management-panel.entry.js","sources":["src/components/organisms/_shared/panel.css?tag=ind-recipe-management-panel&encapsulation=shadow","src/components/organisms/_shared/control-panel.css?tag=ind-recipe-management-panel&encapsulation=shadow","src/components/organisms/recipe-management-panel/recipe-management-panel.css?tag=ind-recipe-management-panel&encapsulation=shadow","src/components/organisms/recipe-management-panel/recipe-management-panel.tsx"],"sourcesContent":["/* Shared chrome for organism panels. Pulled in first via\n * `styleUrls: ['../_shared/panel.css', 'xxx.css']`. */\n:host {\n  display: flex;\n  flex-direction: column;\n  background: var(--ind-surface-panel);\n  border: 1px solid var(--ind-surface-border-default);\n  border-radius: var(--ind-radius-md, 3px);\n  font-family: var(--ind-font-family-sans);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n  box-sizing: border-box;\n  overflow: hidden;\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n}\n\n.panel-head {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-4, 8px) var(--ind-spacing-5, 12px);\n  border-bottom: 1px solid var(--ind-surface-border-subtle);\n  background: var(--ind-surface-raised);\n  flex: 0 0 auto;\n}\n\n.panel-titles {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.panel-title {\n  font-size: var(--ind-font-size-md, 13px);\n  font-weight: var(--ind-font-weight-semibold, 600);\n  line-height: 1.2;\n}\n\n.panel-subtitle {\n  font-size: var(--ind-font-size-xs, 10px);\n  text-transform: uppercase;\n  letter-spacing: 0.06em;\n  color: var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));\n}\n\n.panel-tag {\n  font-family: var(--ind-font-family-mono);\n  font-size: var(--ind-font-size-sm, 11px);\n  color: var(--ind-surface-text-secondary);\n}\n\n.panel-actions {\n  margin-left: auto;\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n}\n\n.panel-body {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-5, 12px);\n  min-height: 0;\n}\n\n.panel-toolbar {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n  padding: var(--ind-spacing-3, 6px) var(--ind-spacing-5, 12px);\n  border-bottom: 1px solid var(--ind-surface-border-subtle);\n  flex: 0 0 auto;\n}\n\n.panel-list {\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n}\n\n.panel-grid {\n  display: grid;\n  gap: var(--ind-spacing-4, 8px);\n  padding: var(--ind-spacing-5, 12px);\n}\n\n.panel-empty {\n  padding: var(--ind-spacing-7, 20px);\n  text-align: center;\n  color: var(--ind-surface-text-muted);\n  font-size: var(--ind-font-size-sm, 11px);\n}\n\n.panel-spacer {\n  flex: 1 1 auto;\n}\n","/* Flatten the faceplate / control molecules when embedded in a control panel,\n * so the panel provides the single card chrome. */\n.panel-body > ind-motor-card,\n.panel-body > ind-pump-card,\n.panel-body > ind-valve-card,\n.panel-body > ind-start-stop-control,\n.panel-body > ind-setpoint-control,\n.panel-body > ind-speed-control,\n.panel-body > ind-mode-selector,\n.panel-body > ind-recipe-selector {\n  border: 0;\n  padding: 0;\n  background: transparent;\n  min-width: 0;\n}\n",":host {\n  min-width: 340px;\n}\n\n.params {\n  display: flex;\n  flex-direction: column;\n  border: 1px solid var(--ind-surface-border-subtle);\n  border-radius: var(--ind-radius-sm, 2px);\n}\n","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"],"names":[],"mappings":";;AAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,yzDAAyzD,CAAC;;ACAl1D,MAAM,eAAe,GAAG,MAAM,CAAC,sSAAsS,CAAC;;ACAtU,MAAM,wBAAwB,GAAG,MAAM,CAAC,2JAA2J,CAAC;;MCavL,wBAAwB,GAAA,MAAA;;;;;;;IAC3B,OAAO,GAAW,mBAAmB;;IAErC,OAAO,GAAmB,EAAE;;AAEX,IAAA,KAAK;;IAEtB,UAAU,GAAiB,EAAE;;IAE7B,QAAQ,GAAY,KAAK;AAExB,IAAA,SAAS;AACT,IAAA,OAAO;AACP,IAAA,OAAO;AAER,IAAA,QAAQ,GAAG,CAAC,CAAsB,KAAI;QAC5C,CAAC,CAAC,eAAe,EAAE;AACnB,QAAA,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM;QACrB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;AAC/B,KAAC;AACO,IAAA,MAAM,GAAG,CAAC,CAAsB,KAAI;QAC1C,CAAC,CAAC,eAAe,EAAE;QACnB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;AAC7B,KAAC;IAED,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,YAAY,EAAA,EACrB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,SAAS,EAAA,EAAE,IAAI,CAAC,OAAO,CAAQ,EAC9D,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,eAAe,EAAA,EACxB,CAAA,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,IAAI,EACT,KAAK,EAAC,MAAM,EACZ,QAAQ,EAAE,CAAC,IAAI,CAAC,QAAQ,EACxB,aAAa,EAAE,MAAM,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,EAAA,CACxC,CACE,CACF,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,YAAY,EAAA,EACrB,CAAA,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,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,EAAA,CACtB,EACD,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,KACzB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,EAAA,EAC9B,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,MACxB,CAAA,CAAA,yBAAA,EAAA,EACE,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,EAAA,CACxB,CACH,CAAC,CACE,CACP,CACG,CACD;;;;;;;"}

package/dist/esm/ind-recipe-selector.entry.js

@@ -0,0 +1,44 @@
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-Bls_NlWP.js';
+
+const cardCss = () => `:host{display:flex;flex-direction:column;gap:var(--ind-spacing-3, 6px);padding:var(--ind-spacing-5, 12px);background:var(--ind-surface-panel);border:1px solid var(--ind-surface-border-default);border-radius:var(--ind-radius-md, 3px);font-family:var(--ind-font-family-sans);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1);box-sizing:border-box;min-width:160px}.card-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--ind-spacing-3, 6px)}.card-title{font-size:var(--ind-font-size-xs, 10px);font-weight:var(--ind-font-weight-bold, 700);text-transform:uppercase;letter-spacing:0.08em;color:var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2))}.card-tag{font-family:var(--ind-font-family-mono);font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2))}.card-detail{font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0))}:host([state="fault"]){border-color:var(--ind-state-fault-bg, #dc2626);box-shadow:0 0 0 1px color-mix(in srgb, var(--ind-state-fault-bg, #dc2626) 30%, transparent)}:host([state="warning"]){border-color:color-mix(in srgb, var(--ind-state-warning-bg, #f59e0b) 60%, var(--ind-surface-border-default))}`;
+
+const recipeSelectorCss = () => `:host{min-width:240px}.row{display:flex;align-items:flex-end;gap:var(--ind-spacing-4, 8px)}.select{flex:1 1 auto}`;
+
+const IndRecipeSelector = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.indChange = createEvent(this, "indChange");
+        this.indLoad = createEvent(this, "indLoad");
+    }
+    /** Control label. */
+    label = 'Recipe';
+    /** Available recipes. */
+    options = [];
+    /** Selected recipe value (two-way). */
+    value;
+    placeholder = 'Select recipe…';
+    disabled = false;
+    loadLabel = 'Load';
+    /** Fires when the selection changes. */
+    indChange;
+    /** Fires when the operator loads the selected recipe. */
+    indLoad;
+    onChange = (e) => {
+        e.stopPropagation();
+        this.value = e.detail;
+        this.indChange.emit(e.detail);
+    };
+    onLoad = () => {
+        if (this.value)
+            this.indLoad.emit(this.value);
+    };
+    render() {
+        return (h(Host, { key: '61ac596cfd2c70314612f2fe0d74820809619d07' }, h("span", { key: 'f24e008646cda3e75eb767712be048486b8bfb98', class: "card-title", part: "label" }, this.label), h("div", { key: '9c49c3a8a4a79fb4035d788de2967c46df5035fb', class: "row", part: "row" }, h("ind-select", { key: 'f263602837657a924170225007485c4c1d416039', class: "select", part: "select", options: this.options, value: this.value, placeholder: this.placeholder, disabled: this.disabled, label: this.label, size: "md", onIndChange: this.onChange }), h("ind-button", { key: '6ec7f8b8b50e3565eaa711c3da1b3d40b811a996', variant: "primary", size: "md", label: this.loadLabel, disabled: this.disabled || !this.value, onIndActivate: this.onLoad }))));
+    }
+};
+IndRecipeSelector.style = cardCss() + recipeSelectorCss();
+
+export { IndRecipeSelector as ind_recipe_selector };
+//# sourceMappingURL=ind-recipe-selector.entry.js.map
+
+//# sourceMappingURL=ind-recipe-selector.entry.js.map

package/dist/esm/ind-recipe-selector.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ind-recipe-selector.entry.js","sources":["src/components/molecules/_shared/card.css?tag=ind-recipe-selector&encapsulation=shadow","src/components/molecules/recipe-selector/recipe-selector.css?tag=ind-recipe-selector&encapsulation=shadow","src/components/molecules/recipe-selector/recipe-selector.tsx"],"sourcesContent":["/* Shared chrome for molecule \"card\" components. Pulled in first via\n * `styleUrls: ['../_shared/card.css', 'xxx.css']` so each card can override. */\n:host {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ind-spacing-3, 6px);\n  padding: var(--ind-spacing-5, 12px);\n  background: var(--ind-surface-panel);\n  border: 1px solid var(--ind-surface-border-default);\n  border-radius: var(--ind-radius-md, 3px);\n  font-family: var(--ind-font-family-sans);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n  box-sizing: border-box;\n  min-width: 160px;\n}\n\n.card-head {\n  display: flex;\n  align-items: baseline;\n  justify-content: space-between;\n  gap: var(--ind-spacing-3, 6px);\n}\n\n.card-title {\n  font-size: var(--ind-font-size-xs, 10px);\n  font-weight: var(--ind-font-weight-bold, 700);\n  text-transform: uppercase;\n  letter-spacing: 0.08em;\n  color: var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));\n}\n\n.card-tag {\n  font-family: var(--ind-font-family-mono);\n  font-size: var(--ind-font-size-sm, 11px);\n  color: var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));\n}\n\n.card-detail {\n  font-size: var(--ind-font-size-sm, 11px);\n  color: var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));\n}\n\n/* Fault chrome cue, opt-in by reflecting state=\"fault\" on the host. */\n:host([state=\"fault\"]) {\n  border-color: var(--ind-state-fault-bg, #dc2626);\n  box-shadow: 0 0 0 1px color-mix(in srgb, var(--ind-state-fault-bg, #dc2626) 30%, transparent);\n}\n:host([state=\"warning\"]) {\n  border-color: color-mix(in srgb, var(--ind-state-warning-bg, #f59e0b) 60%, var(--ind-surface-border-default));\n}\n",":host {\n  min-width: 240px;\n}\n\n.row {\n  display: flex;\n  align-items: flex-end;\n  gap: var(--ind-spacing-4, 8px);\n}\n\n.select {\n  flex: 1 1 auto;\n}\n","import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\nimport type { SelectOption } from '../../atoms/select/select';\n\n/**\n * Recipe / program picker: an `<ind-select>` plus a Load command. Emits\n * `indChange` as the selection changes and `indLoad` when the operator\n * commits the recipe to the controller.\n */\n@Component({\n  tag: 'ind-recipe-selector',\n  styleUrls: ['../_shared/card.css', 'recipe-selector.css'],\n  shadow: true,\n})\nexport class IndRecipeSelector {\n  /** Control label. */\n  @Prop() label: string = 'Recipe';\n  /** Available recipes. */\n  @Prop() options: SelectOption[] = [];\n  /** Selected recipe value (two-way). */\n  @Prop({ mutable: true }) value?: string;\n  @Prop() placeholder: string = 'Select recipe…';\n  @Prop() disabled: boolean = false;\n  @Prop() loadLabel: string = 'Load';\n\n  /** Fires when the selection changes. */\n  @Event() indChange!: EventEmitter<string>;\n  /** Fires when the operator loads the selected recipe. */\n  @Event() indLoad!: EventEmitter<string>;\n\n  private onChange = (e: CustomEvent<string>) => {\n    e.stopPropagation();\n    this.value = e.detail;\n    this.indChange.emit(e.detail);\n  };\n\n  private onLoad = () => {\n    if (this.value) this.indLoad.emit(this.value);\n  };\n\n  render() {\n    return (\n      <Host>\n        <span class=\"card-title\" part=\"label\">{this.label}</span>\n        <div class=\"row\" part=\"row\">\n          <ind-select\n            class=\"select\"\n            part=\"select\"\n            options={this.options}\n            value={this.value}\n            placeholder={this.placeholder}\n            disabled={this.disabled}\n            label={this.label}\n            size=\"md\"\n            onIndChange={this.onChange}\n          />\n          <ind-button\n            variant=\"primary\"\n            size=\"md\"\n            label={this.loadLabel}\n            disabled={this.disabled || !this.value}\n            onIndActivate={this.onLoad}\n          />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,OAAO,GAAG,MAAM,CAAC,2zCAA2zC,CAAC;;ACAn1C,MAAM,iBAAiB,GAAG,MAAM,CAAC,iHAAiH,CAAC;;MCatI,iBAAiB,GAAA,MAAA;;;;;;;IAEpB,KAAK,GAAW,QAAQ;;IAExB,OAAO,GAAmB,EAAE;;AAEX,IAAA,KAAK;IACtB,WAAW,GAAW,gBAAgB;IACtC,QAAQ,GAAY,KAAK;IACzB,SAAS,GAAW,MAAM;;AAGzB,IAAA,SAAS;;AAET,IAAA,OAAO;AAER,IAAA,QAAQ,GAAG,CAAC,CAAsB,KAAI;QAC5C,CAAC,CAAC,eAAe,EAAE;AACnB,QAAA,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM;QACrB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;AAC/B,KAAC;IAEO,MAAM,GAAG,MAAK;QACpB,IAAI,IAAI,CAAC,KAAK;YAAE,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;AAC/C,KAAC;IAED,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,YAAY,EAAC,IAAI,EAAC,OAAO,EAAA,EAAE,IAAI,CAAC,KAAK,CAAQ,EACzD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,KAAK,EAAC,IAAI,EAAC,KAAK,EAAA,EACzB,CAAA,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,QAAQ,EACd,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAC,IAAI,EACT,WAAW,EAAE,IAAI,CAAC,QAAQ,EAAA,CAC1B,EACF,CAAA,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,IAAI,EACT,KAAK,EAAE,IAAI,CAAC,SAAS,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,KAAK,EACtC,aAAa,EAAE,IAAI,CAAC,MAAM,EAAA,CAC1B,CACE,CACD;;;;;;;"}

package/dist/esm/ind-scara-canvas.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-D2yNiL0d.js';
+import { r as registerInstance, h, H as Host } from './index-Bls_NlWP.js';
 
 const scaraCanvasCss = () => `:host{display:block;width:var(--ind-size-canvas-robot-width, 320px);height:var(--ind-size-canvas-robot-height, 220px);font-family:var(--ind-font-family-mono)}svg{display:block;width:100%;height:100%;background:var(--ind-surface-sunken, light-dark(#ffffff, #000000));border:1px solid var(--ind-surface-border-default);border-radius:var(--ind-radius-md, 3px)}.envelope{fill:none;stroke:var(--ind-surface-border-subtle);stroke-dasharray:2 4}.envelope-inner{stroke-dasharray:1 3;opacity:0.6}.axis{stroke:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));stroke-width:1}.axis-label{font-family:var(--ind-font-family-mono);font-size:9px;fill:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0))}.link{stroke-width:5;stroke-linecap:round;transition:stroke 240ms}.link-1{stroke:var(--ind-state-running-bg, #16a34a)}.link-2{stroke:var(--ind-state-running-border, #4ade80)}.wrist{stroke:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));stroke-width:2;stroke-linecap:round}.joint{fill:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));stroke:var(--ind-surface-border-strong);stroke-width:1}.joint.base{fill:var(--ind-state-stopped-bg, #5a6776);stroke:var(--ind-state-stopped-border, #8390a0)}.joint.effector{fill:var(--ind-state-warning-bg, #f59e0b);stroke:var(--ind-state-warning-border, #fcd34d)}.readout text{font-size:9px;fill:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));font-feature-settings:"tnum" 1}.readout tspan{fill:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));font-weight:700}:host([state="moving"]) .link{stroke-dasharray:4 2;animation:ind-scara-move 1.2s linear infinite}:host([state="fault"]) .link,:host([state="fault"]) .wrist{stroke:var(--ind-state-fault-bg, #dc2626)}:host([state="fault"]) .joint{stroke:var(--ind-state-fault-border, #f87171)}@keyframes ind-scara-move{to{stroke-dashoffset:-12}}@media (prefers-reduced-motion: reduce){:host([state="moving"]) .link{animation:none}}`;
 
@@ -44,7 +44,7 @@ const IndScaraCanvas = class {
         const wy = eey + wlen * Math.sin(j1r + j2r + j3r);
         const fmt = (n) => n.toFixed(1);
         const fmt0 = (n) => n.toFixed(0);
-        return (h(Host, { key: '0634f9fc9b197f66bf334c43c38e85c19066d090', role: "img", "aria-label": `SCARA arm: J1 ${fmt(j1)}°, J2 ${fmt(j2)}°, J3 ${fmt(j3)}°` }, h("svg", { key: 'c16607c36459cfad670b9ab913d46c23daf99883', viewBox: "0 0 320 220", part: "svg" }, h("circle", { key: '4fc539c4f5a658ffbb4a2a9594a864e04cd6e9fe', cx: cx, cy: cy, r: l1 + l2, class: "envelope envelope-outer" }), h("circle", { key: 'b493720a1f306e75dedf48dbd1ccb53850248230', cx: cx, cy: cy, r: Math.max(0, l1 - l2), class: "envelope envelope-inner" }), h("line", { key: 'e28c6dc2ac8e73bac4381bba4dfb4cdb983097c7', x1: "10", y1: cy, x2: "22", y2: cy, class: "axis" }), h("line", { key: '5f460ffa1860dd1484100e972d043fd9a1491621', x1: cx, y1: "6", x2: cx, y2: "18", class: "axis" }), h("text", { key: 'f4cb4f52a3279f7924aea8d8e642a91be18c38a5', x: "24", y: cy + 3, class: "axis-label" }, "X"), h("text", { key: 'd3d18e860674380af133295b763c52bc0adf591b', x: cx + 4, y: "14", class: "axis-label" }, "Y"), h("line", { key: 'cfad2277909207ee8a0f99fc73cc823db20f4f8e', x1: cx, y1: cy, x2: ex, y2: ey, class: "link link-1" }), h("line", { key: '2ea11a2363123b2f6876179a2519dc38e9882126', x1: ex, y1: ey, x2: eex, y2: eey, class: "link link-2" }), h("line", { key: 'ad0a714279eea710da7e72a2141aab8165576c34', x1: eex, y1: eey, x2: wx, y2: wy, class: "wrist" }), h("circle", { key: '89f2b18ca37ed7b0e67b0dee6ed28e0702cafa54', cx: cx, cy: cy, r: "8", class: "joint base" }), h("circle", { key: '44129fff9afa9becab60e20ab86933e4a111f854', cx: ex, cy: ey, r: "6", class: "joint elbow" }), h("circle", { key: 'bfa99f679b71e28f58c244267e5876c73c9cd6aa', cx: eex, cy: eey, r: "7", class: "joint effector" }), h("g", { key: '3753b9117625a70389a12c518330660d943a237f', class: "readout" }, h("text", { key: '420f362c46c764ea86fbf12128727600a1454e51', x: "10", y: "198" }, "J1 ", h("tspan", { key: '4f1afe52d964043034d93d02eb27b4fc4e7b7f3c' }, fmt(j1), "\u00B0")), h("text", { key: '185d3d66158b63322153d59a97d79792e5105957', x: "74", y: "198" }, "J2 ", h("tspan", { key: '9c6802f9ee9b2bb8ae3154880e2b7b1ffaf21167' }, fmt(j2), "\u00B0")), h("text", { key: 'b6d0a5aa47c925997cc7efa0c1cadd067f184243', x: "138", y: "198" }, "J3 ", h("tspan", { key: '5c06a24d477670deeceb6f80e3fb707b39b1b1e3' }, fmt(j3), "\u00B0")), h("text", { key: '99c96bf07d28555af967c4cb22a2856c1bdb46fb', x: "202", y: "198" }, "X ", h("tspan", { key: '4097b0a431bed9c608f5a43994ad213bfdd56663' }, fmt0(eex - cx))), h("text", { key: '56ccbac660ea805f260977c0e64fdf424f1d40fe', x: "254", y: "198" }, "Y ", h("tspan", { key: 'd4cfa6e17fc0da8494f8f526e7d5f27cf233dc22' }, fmt0(eey - cy)))))));
+        return (h(Host, { key: 'e220c57195ecb3c211223a9c678ad6a832c584cd', role: "img", "aria-label": `SCARA arm: J1 ${fmt(j1)}°, J2 ${fmt(j2)}°, J3 ${fmt(j3)}°` }, h("svg", { key: '7a04466cdcedb3e90bb45d0e86ee1d846f16d2fe', viewBox: "0 0 320 220", part: "svg" }, h("circle", { key: '9f1c589063eae5f24c60017e12b45afe5f44a714', cx: cx, cy: cy, r: l1 + l2, class: "envelope envelope-outer" }), h("circle", { key: 'a6228d89177c0dca40aaf37e85a08e59a04a2488', cx: cx, cy: cy, r: Math.max(0, l1 - l2), class: "envelope envelope-inner" }), h("line", { key: '21e8c9bbf7cf19afa8dd88f909c94e1b458c928d', x1: "10", y1: cy, x2: "22", y2: cy, class: "axis" }), h("line", { key: 'bd2a5eca21b2e7fc73828a601870c730cc153bbd', x1: cx, y1: "6", x2: cx, y2: "18", class: "axis" }), h("text", { key: 'dab2bdb3cd08468e10220174102d9d198658b26b', x: "24", y: cy + 3, class: "axis-label" }, "X"), h("text", { key: '66581ab90a79151eeb64522a5525de10e151d0ad', x: cx + 4, y: "14", class: "axis-label" }, "Y"), h("line", { key: '0f8c1214d584f7c9e062927af7ca0425242e6e2b', x1: cx, y1: cy, x2: ex, y2: ey, class: "link link-1" }), h("line", { key: 'e19107929c6f87d3b3e47042f017a73193714b30', x1: ex, y1: ey, x2: eex, y2: eey, class: "link link-2" }), h("line", { key: 'a4cb08318e5c5df59494f6b38477307477313378', x1: eex, y1: eey, x2: wx, y2: wy, class: "wrist" }), h("circle", { key: '25f7d34a6cc339b46a59437809bce8b7e5b4015b', cx: cx, cy: cy, r: "8", class: "joint base" }), h("circle", { key: '0fd90ea8c7b17654d927be0627ad2a0bcdb54c93', cx: ex, cy: ey, r: "6", class: "joint elbow" }), h("circle", { key: '528398188bef093e0d931bb23877022fd94900cf', cx: eex, cy: eey, r: "7", class: "joint effector" }), h("g", { key: '3fafeb02e9001d091436addbe37c53cfa5281df5', class: "readout" }, h("text", { key: '3d5c879baea3c1ef177fbd53153d846eb1158411', x: "10", y: "198" }, "J1 ", h("tspan", { key: 'df726f043b2a33357c2525c68a6f23861def214d' }, fmt(j1), "\u00B0")), h("text", { key: '68565b08ced6589ecd0a2d84cd738535ebe9fc63', x: "74", y: "198" }, "J2 ", h("tspan", { key: '65a013c07a5f9412b603557e39409d34ba5b4812' }, fmt(j2), "\u00B0")), h("text", { key: '88712594e3a0ac5e8e506ce467192d0bbcbf4a7f', x: "138", y: "198" }, "J3 ", h("tspan", { key: '31f1c81c381841747057257d6e4ee1af9d213dd8' }, fmt(j3), "\u00B0")), h("text", { key: '42d91dc495775b5bf29cc455e6d6404c72e2839f', x: "202", y: "198" }, "X ", h("tspan", { key: '00d7e9336de136e9ec0dd21ec85fd2a7a9b3ebf9' }, fmt0(eex - cx))), h("text", { key: '8ba2b283b6cd83942747e5df2c93d51b4dcb85bd', x: "254", y: "198" }, "Y ", h("tspan", { key: '767695ce2b72564dec42536bc618835070d4b1a7' }, fmt0(eey - cy)))))));
     }
 };
 IndScaraCanvas.style = scaraCanvasCss();