@ind-ds/core 0.1.1 → 0.2.0

package/dist/components/ind-tank-level-card.js

@@ -0,0 +1,2 @@
+import{p as a,H as e,h as t,a as i,t as n}from"./index.js";import{d as s}from"./p-Dnxar2_f.js";import{d as r}from"./p-DC9NDak5.js";import{d}from"./p-BInyhy9s.js";const l=()=>`: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 c=()=>`.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 o=()=>`:host{min-width:210px}ind-linear-gauge{width:100%}`;const f=a(class a extends e{constructor(a){super();if(a!==false){this.__registerHost()}this.__attachShadow()}tag;label;state="running";level=0;alarm="none";capacity;unit="L";render(){const a=Math.min(100,Math.max(0,this.level));const e=this.label??this.tag??"Tank";const n=this.alarm==="high"?"high":this.alarm==="low"?"low":"none";return t(i,{key:"5d6a6f6b6548d7ba5addfdc1db0d823ca95b4ad4",role:"group","aria-label":`${e} level ${Math.round(a)} percent`},t("div",{key:"a7a312f8303325cf679702176dc905a715551a8b",class:"card-head"},t("span",{key:"2f063cf5494e5bed48e2e01ea4821030cdf974ca",class:"card-title",part:"label"},e),this.tag&&t("span",{key:"b41273e27e1ef980837ec53f6e678d52d3d850ea",class:"card-tag",part:"tag"},this.tag)),t("div",{key:"0add427bf608da5e11895e0f34b422a1fd0bcffd",class:"body",part:"body"},t("ind-tank",{key:"b20d9ff05ba43b9bdbb692420b27bae809ed62ef",class:"symbol",state:this.state,level:a,alarm:this.alarm,size:"md"}),t("div",{key:"a593e704843bf704266732312424f1c27b835532",class:"metrics",part:"metrics"},t("ind-value",{key:"91abab48fbc9e642e597a56ceb3720c4b8a9ecc9",value:a,unit:"%",precision:0,alarm:n,label:"Level",size:"lg"}),this.capacity!==undefined&&t("ind-value",{key:"f0cbf620bcd7e840a1f89e3b5c91ee6c3b2aa456",value:this.capacity*a/100,unit:this.unit,precision:0,label:"Volume",size:"sm"}))),t("ind-linear-gauge",{key:"6962c05beb268f96fdbb9608f33e42882bd0aff7",part:"gauge",value:a,min:0,max:100,orientation:"horizontal",unit:"%",size:"sm"}))}static get style(){return l()+(c()+o())}},[513,"ind-tank-level-card",{tag:[1],label:[1],state:[513],level:[2],alarm:[513],capacity:[2],unit:[1]}]);function b(){if(typeof customElements==="undefined"){return}const a=["ind-tank-level-card","ind-linear-gauge","ind-tank","ind-value"];a.forEach((a=>{switch(a){case"ind-tank-level-card":if(!customElements.get(n(a))){customElements.define(n(a),f)}break;case"ind-linear-gauge":if(!customElements.get(n(a))){s()}break;case"ind-tank":if(!customElements.get(n(a))){r()}break;case"ind-value":if(!customElements.get(n(a))){d()}break}}))}b();const u=f;const m=b;export{u as IndTankLevelCard,m as defineCustomElement};
+//# sourceMappingURL=ind-tank-level-card.js.map

package/dist/components/ind-tank-level-card.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cardCss","equipmentCardCss","tankLevelCardCss","IndTankLevelCard","__stencil_proxyCustomElement","HTMLElement","tag","label","state","level","alarm","capacity","unit","render","pct","Math","min","max","this","name","valueAlarm","h","Host","key","role","round","class","part","size","value","precision","undefined","orientation"],"sources":["src/components/molecules/_shared/card.css?tag=ind-tank-level-card&encapsulation=shadow","src/components/molecules/_shared/equipment-card.css?tag=ind-tank-level-card&encapsulation=shadow","src/components/molecules/tank-level-card/tank-level-card.css?tag=ind-tank-level-card&encapsulation=shadow","src/components/molecules/tank-level-card/tank-level-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: 210px;\n}\n\nind-linear-gauge {\n  width: 100%;\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\nimport type { EquipmentState } from '../../atoms/_equipment/types';\n\nexport type TankAlarm = 'none' | 'low' | 'high';\n\n/**\n * Tank level faceplate: `<ind-tank>` symbol with a level readout and a\n * `<ind-linear-gauge>` showing the fill against low/high alarm bands.\n */\n@Component({\n  tag: 'ind-tank-level-card',\n  styleUrls: ['../_shared/card.css', '../_shared/equipment-card.css', 'tank-level-card.css'],\n  shadow: true,\n})\nexport class IndTankLevelCard {\n  /** Equipment tag (e.g. \"T-204\"). */\n  @Prop() tag?: string;\n  /** Human label (e.g. \"Buffer tank\"). */\n  @Prop() label?: string;\n  /** Equipment state (drives fault chrome and tank outline). */\n  @Prop({ reflect: true }) state: EquipmentState = 'running';\n  /** Current level 0–100 %. */\n  @Prop() level: number = 0;\n  /** Alarm tint of the liquid. */\n  @Prop({ reflect: true }) alarm: TankAlarm = 'none';\n  /** Engineering capacity for the secondary readout (e.g. 5000). */\n  @Prop() capacity?: number;\n  /** Capacity unit (e.g. \"L\"). */\n  @Prop() unit: string = 'L';\n\n  render() {\n    const pct = Math.min(100, Math.max(0, this.level));\n    const name = this.label ?? this.tag ?? 'Tank';\n    const valueAlarm = this.alarm === 'high' ? 'high' : this.alarm === 'low' ? 'low' : 'none';\n    return (\n      <Host role=\"group\" aria-label={`${name} level ${Math.round(pct)} percent`}>\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-tank class=\"symbol\" state={this.state} level={pct} alarm={this.alarm} size=\"md\" />\n          <div class=\"metrics\" part=\"metrics\">\n            <ind-value value={pct} unit=\"%\" precision={0} alarm={valueAlarm} label=\"Level\" size=\"lg\" />\n            {this.capacity !== undefined && (\n              <ind-value\n                value={(this.capacity * pct) / 100}\n                unit={this.unit}\n                precision={0}\n                label=\"Volume\"\n                size=\"sm\"\n              />\n            )}\n          </div>\n        </div>\n        <ind-linear-gauge\n          part=\"gauge\"\n          value={pct}\n          min={0}\n          max={100}\n          orientation=\"horizontal\"\n          unit=\"%\"\n          size=\"sm\"\n        />\n      </Host>\n    );\n  }\n}\n"],"mappings":"kKAAA,MAAMA,EAAU,IAAM,8zCCAtB,MAAMC,EAAmB,IAAM,+NCA/B,MAAMC,EAAmB,IAAM,qD,MCclBC,EAAgBC,EAAA,MAAAD,UAAAE,E,iFAEnBC,IAEAC,MAEiBC,MAAwB,UAEzCC,MAAgB,EAECC,MAAmB,OAEpCC,SAEAC,KAAe,IAEvB,MAAAC,GACE,MAAMC,EAAMC,KAAKC,IAAI,IAAKD,KAAKE,IAAI,EAAGC,KAAKT,QAC3C,MAAMU,EAAOD,KAAKX,OAASW,KAAKZ,KAAO,OACvC,MAAMc,EAAaF,KAAKR,QAAU,OAAS,OAASQ,KAAKR,QAAU,MAAQ,MAAQ,OACnF,OACEW,EAACC,EAAI,CAAAC,IAAA,2CAACC,KAAK,QAAO,aAAa,GAAGL,WAAcJ,KAAKU,MAAMX,cACzDO,EAAA,OAAAE,IAAA,2CAAKG,MAAM,aACTL,EAAA,QAAAE,IAAA,2CAAMG,MAAM,aAAaC,KAAK,SAASR,GACtCD,KAAKZ,KAAOe,EAAA,QAAAE,IAAA,2CAAMG,MAAM,WAAWC,KAAK,OAAOT,KAAKZ,MAEvDe,EAAA,OAAAE,IAAA,2CAAKG,MAAM,OAAOC,KAAK,QACrBN,EAAA,YAAAE,IAAA,2CAAUG,MAAM,SAASlB,MAAOU,KAAKV,MAAOC,MAAOK,EAAKJ,MAAOQ,KAAKR,MAAOkB,KAAK,OAChFP,EAAA,OAAAE,IAAA,2CAAKG,MAAM,UAAUC,KAAK,WACxBN,EAAA,aAAAE,IAAA,2CAAWM,MAAOf,EAAKF,KAAK,IAAIkB,UAAW,EAAGpB,MAAOU,EAAYb,MAAM,QAAQqB,KAAK,OACnFV,KAAKP,WAAaoB,WACjBV,EAAA,aAAAE,IAAA,2CACEM,MAAQX,KAAKP,SAAWG,EAAO,IAC/BF,KAAMM,KAAKN,KACXkB,UAAW,EACXvB,MAAM,SACNqB,KAAK,SAKbP,EAAA,oBAAAE,IAAA,2CACEI,KAAK,QACLE,MAAOf,EACPE,IAAK,EACLC,IAAK,IACLe,YAAY,aACZpB,KAAK,IACLgB,KAAK,O","ignoreList":[]}

package/dist/components/ind-tank.d.ts

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

package/dist/components/ind-tank.js

@@ -0,0 +1,2 @@
+import{I as o,d as s}from"./p-DC9NDak5.js";const t=o;const a=s;export{t as IndTank,a as defineCustomElement};
+//# sourceMappingURL=ind-tank.js.map

package/dist/components/ind-tank.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":[],"mappings":"","ignoreList":[]}

package/dist/components/ind-temperature-control.d.ts

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

package/dist/components/ind-temperature-control.js

@@ -0,0 +1,2 @@
+import{p as e,H as a,c as t,h as i,a as n,t as s}from"./index.js";import{d as r}from"./p-BFESjyKK.js";const d=()=>`: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 o=()=>`:host{min-width:210px}.mode{display:inline-flex;align-items:center;gap:var(--ind-spacing-2, 4px);font-size:var(--ind-font-size-sm, 11px);font-weight:var(--ind-font-weight-medium, 500);color:var(--ind-surface-text-muted)}.mode-heating{color:var(--ind-state-fault-bg, #dc2626)}.mode-cooling{color:var(--ind-color-palette-cyan-300, #22d3ee)}`;const c=e(class e extends a{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.indChange=t(this,"indChange")}label;tag;value=20;pv;min=0;max=200;step=.5;precision=1;unit="°C";disabled=false;mode="idle";indChange;onChange=e=>{e.stopPropagation();this.value=e.detail;this.indChange.emit(e.detail)};render(){const e=this.mode==="heating"?"Heating":this.mode==="cooling"?"Cooling":"Idle";const a=this.mode==="heating"?"🔥":this.mode==="cooling"?"❄":"○";return i(n,{key:"0e8701bc6e89c38f88a4f9b7de7c20e5daeff9c2"},i("div",{key:"023aefad2dbebe2d6f79974010416c6aacd35abb",class:"card-head"},i("span",{key:"262f3a73e2e0a53b3fd6c1587aaa8e051e06b28c",class:"card-title",part:"label"},this.label),this.tag&&i("span",{key:"0c9a041e54488b1efa69fc56a8b18c95ec2796b2",class:"card-tag",part:"tag"},this.tag)),i("div",{key:"1b82accfe0f72b351c570ce6ad1a1752cbb1abac",class:`mode mode-${this.mode}`,part:"mode"},i("span",{key:"3e87998079be0552869ce9d4b716e061dc08cca0",class:"glyph","aria-hidden":"true"},a),i("span",{key:"1840ecae368882e89cef466bce4fa5193f50e857"},e)),i("ind-setpoint",{key:"7a7b98088e7928cbef79f10ff3b47d31b78b4bb6",part:"setpoint",value:this.value,pv:this.pv,min:this.min,max:this.max,step:this.step,precision:this.precision,unit:this.unit,disabled:this.disabled,size:"md",onIndChange:this.onChange}))}static get style(){return d()+o()}},[513,"ind-temperature-control",{label:[1],tag:[1],value:[1026],pv:[2],min:[2],max:[2],step:[2],precision:[2],unit:[1],disabled:[4],mode:[513]}]);function l(){if(typeof customElements==="undefined"){return}const e=["ind-temperature-control","ind-setpoint"];e.forEach((e=>{switch(e){case"ind-temperature-control":if(!customElements.get(s(e))){customElements.define(s(e),c)}break;case"ind-setpoint":if(!customElements.get(s(e))){r()}break}}))}l();const f=c;const p=l;export{f as IndTemperatureControl,p as defineCustomElement};
+//# sourceMappingURL=ind-temperature-control.js.map

package/dist/components/ind-temperature-control.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cardCss","temperatureControlCss","IndTemperatureControl","__stencil_proxyCustomElement","HTMLElement","label","tag","value","pv","min","max","step","precision","unit","disabled","mode","indChange","onChange","e","stopPropagation","this","detail","emit","render","modeLabel","glyph","h","Host","key","class","part","size","onIndChange"],"sources":["src/components/molecules/_shared/card.css?tag=ind-temperature-control&encapsulation=shadow","src/components/molecules/temperature-control/temperature-control.css?tag=ind-temperature-control&encapsulation=shadow","src/components/molecules/temperature-control/temperature-control.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: 210px;\n}\n\n.mode {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--ind-spacing-2, 4px);\n  font-size: var(--ind-font-size-sm, 11px);\n  font-weight: var(--ind-font-weight-medium, 500);\n  color: var(--ind-surface-text-muted);\n}\n\n.mode-heating { color: var(--ind-state-fault-bg, #dc2626); }\n.mode-cooling { color: var(--ind-color-palette-cyan-300, #22d3ee); }\n","import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\n\nexport type ThermalMode = 'idle' | 'heating' | 'cooling';\n\n/**\n * Temperature loop faceplate: setpoint vs process value plus a heating/cooling\n * indicator. Re-emits the committed setpoint.\n */\n@Component({\n  tag: 'ind-temperature-control',\n  styleUrls: ['../_shared/card.css', 'temperature-control.css'],\n  shadow: true,\n})\nexport class IndTemperatureControl {\n  /** Loop label (e.g. \"Reactor jacket\"). */\n  @Prop() label!: string;\n  /** Loop tag (e.g. \"TIC-301\"). */\n  @Prop() tag?: string;\n  /** Target temperature (two-way). */\n  @Prop({ mutable: true }) value: number = 20;\n  /** Live process temperature. */\n  @Prop() pv?: number;\n  @Prop() min: number = 0;\n  @Prop() max: number = 200;\n  @Prop() step: number = 0.5;\n  @Prop() precision: number = 1;\n  /** Temperature unit (default °C). */\n  @Prop() unit: string = '°C';\n  @Prop() disabled: boolean = false;\n  /** Current thermal action — drives the indicator. */\n  @Prop({ reflect: true }) mode: ThermalMode = 'idle';\n\n  /** Committed setpoint. */\n  @Event() indChange!: EventEmitter<number>;\n\n  private onChange = (e: CustomEvent<number>) => {\n    e.stopPropagation();\n    this.value = e.detail;\n    this.indChange.emit(e.detail);\n  };\n\n  render() {\n    const modeLabel = this.mode === 'heating' ? 'Heating' : this.mode === 'cooling' ? 'Cooling' : 'Idle';\n    const glyph = this.mode === 'heating' ? '🔥' : this.mode === 'cooling' ? '❄' : '○';\n    return (\n      <Host>\n        <div class=\"card-head\">\n          <span class=\"card-title\" part=\"label\">{this.label}</span>\n          {this.tag && <span class=\"card-tag\" part=\"tag\">{this.tag}</span>}\n        </div>\n        <div class={`mode mode-${this.mode}`} part=\"mode\">\n          <span class=\"glyph\" aria-hidden=\"true\">{glyph}</span>\n          <span>{modeLabel}</span>\n        </div>\n        <ind-setpoint\n          part=\"setpoint\"\n          value={this.value}\n          pv={this.pv}\n          min={this.min}\n          max={this.max}\n          step={this.step}\n          precision={this.precision}\n          unit={this.unit}\n          disabled={this.disabled}\n          size=\"md\"\n          onIndChange={this.onChange}\n        />\n      </Host>\n    );\n  }\n}\n"],"mappings":"sGAAA,MAAMA,EAAU,IAAM,8zCCAtB,MAAMC,EAAwB,IAAM,qV,MCavBC,EAAqBC,EAAA,MAAAD,UAAAE,E,oHAExBC,MAEAC,IAEiBC,MAAgB,GAEjCC,GACAC,IAAc,EACdC,IAAc,IACdC,KAAe,GACfC,UAAoB,EAEpBC,KAAe,KACfC,SAAoB,MAEHC,KAAoB,OAGpCC,UAEDC,SAAYC,IAClBA,EAAEC,kBACFC,KAAKb,MAAQW,EAAEG,OACfD,KAAKJ,UAAUM,KAAKJ,EAAEG,OAAO,EAG/B,MAAAE,GACE,MAAMC,EAAYJ,KAAKL,OAAS,UAAY,UAAYK,KAAKL,OAAS,UAAY,UAAY,OAC9F,MAAMU,EAAQL,KAAKL,OAAS,UAAY,KAAOK,KAAKL,OAAS,UAAY,IAAM,IAC/E,OACEW,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,aACTH,EAAA,QAAAE,IAAA,2CAAMC,MAAM,aAAaC,KAAK,SAASV,KAAKf,OAC3Ce,KAAKd,KAAOoB,EAAA,QAAAE,IAAA,2CAAMC,MAAM,WAAWC,KAAK,OAAOV,KAAKd,MAEvDoB,EAAA,OAAAE,IAAA,2CAAKC,MAAO,aAAaT,KAAKL,OAAQe,KAAK,QACzCJ,EAAA,QAAAE,IAAA,2CAAMC,MAAM,QAAO,cAAa,QAAQJ,GACxCC,EAAA,QAAAE,IAAA,4CAAOJ,IAETE,EAAA,gBAAAE,IAAA,2CACEE,KAAK,WACLvB,MAAOa,KAAKb,MACZC,GAAIY,KAAKZ,GACTC,IAAKW,KAAKX,IACVC,IAAKU,KAAKV,IACVC,KAAMS,KAAKT,KACXC,UAAWQ,KAAKR,UAChBC,KAAMO,KAAKP,KACXC,SAAUM,KAAKN,SACfiB,KAAK,KACLC,YAAaZ,KAAKH,W","ignoreList":[]}

package/dist/components/ind-textarea.js

@@ -1,2 +1,2 @@
-import{p as a,H as e,c as t,h as r,a as i,t as n}from"./index.js";const o=()=>`:host{display:inline-block;width:100%;font-family:var(--ind-font-family-sans);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5))}.wrap{display:flex;flex-direction:column;gap:var(--ind-spacing-2, 4px)}.label{font-size:var(--ind-font-size-sm, 11px);font-weight:var(--ind-font-weight-medium, 500);color:var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));letter-spacing:0.04em;text-transform:uppercase}.textarea{width:100%;box-sizing:border-box;padding:var(--ind-spacing-3, 6px) var(--ind-spacing-4, 8px);background:var(--ind-surface-sunken, light-dark(#ffffff, #000000));border:1px solid var(--ind-surface-border-default, #2a3340);border-radius:var(--ind-radius-md, 3px);font-family:inherit;font-size:var(--ind-font-size-base, 12px);line-height:var(--ind-font-line-height-normal, 1.4);color:inherit;resize:vertical;outline:none;font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1);transition:border-color var(--ind-motion-duration-fast, 120ms),     box-shadow   var(--ind-motion-duration-fast, 120ms)}.textarea:focus{border-color:var(--ind-surface-focus-ring, #22d3ee);box-shadow:0 0 0 2px color-mix(in srgb, var(--ind-surface-focus-ring, #22d3ee) 35%, transparent)}.textarea::placeholder{color:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));opacity:1}:host([variant="mono"]) .textarea{font-family:var(--ind-font-family-mono);font-size:var(--ind-font-size-sm, 11px);line-height:var(--ind-font-line-height-tight, 1.4);background:var(--ind-color-palette-neutral-0, #000000);color:var(--ind-color-palette-neutral-800, #d0d7e0);border-color:var(--ind-surface-border-strong, #5a6776)}:host([invalid]) .textarea{border-color:var(--ind-feedback-error-bg, #dc2626)}:host([invalid]) .textarea:focus{box-shadow:0 0 0 2px color-mix(in srgb, var(--ind-feedback-error-bg, #dc2626) 40%, transparent)}:host([readonly]) .textarea{cursor:default}:host([disabled]){opacity:0.55;pointer-events:none}`;const s=a(class a extends e{constructor(a){super();if(a!==false){this.__registerHost()}this.__attachShadow();this.indInput=t(this,"indInput");this.indChange=t(this,"indChange")}get host(){return this}value="";placeholder;label;name;rows=4;size="md";variant="default";disabled=false;readonly=false;invalid=false;autoScroll=false;indInput;indChange;componentDidLoad(){if(this.autoScroll)this.scrollToBottom()}onValueChange(){if(this.autoScroll)this.scrollToBottom()}scrollToBottom(){requestAnimationFrame((()=>{const a=this.host.shadowRoot?.querySelector("textarea");if(a)a.scrollTop=a.scrollHeight}))}onInput=a=>{const e=a.target.value;this.value=e;this.indInput.emit(e)};onChange=a=>{this.indChange.emit(a.target.value)};render(){return r(i,{key:"a4ca904c7a9ca65900e0ccc696aab66429bdde71"},r("label",{key:"57f1880efe8a30a2bd5e1253c81f058360519c9f",class:"wrap",part:"wrap"},this.label&&r("span",{key:"aa0367d91235eca6d69fd520617ea831b1ac71fc",class:"label",part:"label"},this.label),r("textarea",{key:"2248ea771f4ac6f8ae9fb0cc12ea4ed038e7ab24",part:"textarea",class:"textarea",placeholder:this.placeholder,rows:this.rows,disabled:this.disabled,readonly:this.readonly,name:this.name,"aria-invalid":this.invalid?"true":"false",onInput:this.onInput,onChange:this.onChange},this.value)))}static get watchers(){return{value:[{onValueChange:0}]}}static get style(){return o()}},[513,"ind-textarea",{value:[1025],placeholder:[1],label:[1],name:[1],rows:[2],size:[513],variant:[513],disabled:[516],readonly:[516],invalid:[516],autoScroll:[4,"auto-scroll"]},undefined,{value:[{onValueChange:0}]}]);function d(){if(typeof customElements==="undefined"){return}const a=["ind-textarea"];a.forEach((a=>{switch(a){case"ind-textarea":if(!customElements.get(n(a))){customElements.define(n(a),s)}break}}))}d();const l=s;const c=d;export{l as IndTextarea,c as defineCustomElement};
+import{p as a,H as e,c as t,h as r,a as i,t as n}from"./index.js";const o=()=>`:host{display:inline-block;width:100%;font-family:var(--ind-font-family-sans);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5))}.wrap{display:flex;flex-direction:column;gap:var(--ind-spacing-2, 4px)}.label{font-size:var(--ind-font-size-sm, 11px);font-weight:var(--ind-font-weight-medium, 500);color:var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));letter-spacing:0.04em;text-transform:uppercase}.textarea{width:100%;box-sizing:border-box;padding:var(--ind-spacing-3, 6px) var(--ind-spacing-4, 8px);background:var(--ind-surface-sunken, light-dark(#ffffff, #000000));border:1px solid var(--ind-surface-border-default, #2a3340);border-radius:var(--ind-radius-md, 3px);font-family:inherit;font-size:var(--ind-font-size-base, 12px);line-height:var(--ind-font-line-height-normal, 1.4);color:inherit;resize:vertical;outline:none;font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1);transition:border-color var(--ind-motion-duration-fast, 120ms),     box-shadow   var(--ind-motion-duration-fast, 120ms)}.textarea:focus{border-color:var(--ind-surface-focus-ring, #22d3ee);box-shadow:0 0 0 2px color-mix(in srgb, var(--ind-surface-focus-ring, #22d3ee) 35%, transparent)}.textarea::placeholder{color:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));opacity:1}:host([variant="mono"]) .textarea{font-family:var(--ind-font-family-mono);font-size:var(--ind-font-size-sm, 11px);line-height:var(--ind-font-line-height-tight, 1.4);background:var(--ind-color-palette-neutral-0, #000000);color:var(--ind-color-palette-neutral-800, #d0d7e0);border-color:var(--ind-surface-border-strong, #5a6776)}:host([invalid]) .textarea{border-color:var(--ind-feedback-error-bg, #dc2626)}:host([invalid]) .textarea:focus{box-shadow:0 0 0 2px color-mix(in srgb, var(--ind-feedback-error-bg, #dc2626) 40%, transparent)}:host([readonly]) .textarea{cursor:default}:host([disabled]){opacity:0.55;pointer-events:none}`;const s=a(class a extends e{constructor(a){super();if(a!==false){this.__registerHost()}this.__attachShadow();this.indInput=t(this,"indInput");this.indChange=t(this,"indChange")}get host(){return this}value="";placeholder;label;name;rows=4;size="md";variant="default";disabled=false;readonly=false;invalid=false;autoScroll=false;indInput;indChange;componentDidLoad(){if(this.autoScroll)this.scrollToBottom()}onValueChange(){if(this.autoScroll)this.scrollToBottom()}scrollToBottom(){requestAnimationFrame((()=>{const a=this.host.shadowRoot?.querySelector("textarea");if(a)a.scrollTop=a.scrollHeight}))}onInput=a=>{const e=a.target.value;this.value=e;this.indInput.emit(e)};onChange=a=>{this.indChange.emit(a.target.value)};render(){return r(i,{key:"57426919f6763e39da55fc5bf1366a5c9ce24436"},r("label",{key:"c0cc807246cd070846c50ad4124297fb1bd2d95d",class:"wrap",part:"wrap"},this.label&&r("span",{key:"e3a2d9a38526b6cee6f5b07e228dba59daf5d212",class:"label",part:"label"},this.label),r("textarea",{key:"8b0f6fa3c2b4457db390bf44b06c81e089724da2",part:"textarea",class:"textarea",placeholder:this.placeholder,rows:this.rows,disabled:this.disabled,readonly:this.readonly,name:this.name,"aria-invalid":this.invalid?"true":"false",onInput:this.onInput,onChange:this.onChange},this.value)))}static get watchers(){return{value:[{onValueChange:0}]}}static get style(){return o()}},[513,"ind-textarea",{value:[1025],placeholder:[1],label:[1],name:[1],rows:[2],size:[513],variant:[513],disabled:[516],readonly:[516],invalid:[516],autoScroll:[4,"auto-scroll"]},undefined,{value:[{onValueChange:0}]}]);function d(){if(typeof customElements==="undefined"){return}const a=["ind-textarea"];a.forEach((a=>{switch(a){case"ind-textarea":if(!customElements.get(n(a))){customElements.define(n(a),s)}break}}))}d();const l=s;const c=d;export{l as IndTextarea,c as defineCustomElement};
 //# sourceMappingURL=ind-textarea.js.map

package/dist/components/ind-timestamp.d.ts

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

package/dist/components/ind-timestamp.js

@@ -0,0 +1,2 @@
+import{p as t,H as e,h as s,a as n,t as i}from"./index.js";const a=()=>`:host{display:inline}.ts{font-family:var(--ind-font-family-mono, ui-monospace, monospace);font-size:var(--ind-font-size-sm, 11px);font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1);color:var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));white-space:nowrap}:host([format="relative"]) .ts{font-family:var(--ind-font-family-sans, system-ui, sans-serif)}`;const r=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow()}value;format="datetime";locale;seconds=true;date(){if(this.value===undefined)return new Date;return new Date(this.value)}relative(t){const e=t.getTime()-Date.now();const s=Math.abs(e);const n=new Intl.RelativeTimeFormat(this.locale,{numeric:"auto"});const i=[["day",864e5],["hour",36e5],["minute",6e4],["second",1e3]];for(const[t,a]of i){if(s>=a||t==="second"){return n.format(Math.round(e/a),t)}}return n.format(0,"second")}formatted(t){if(Number.isNaN(t.getTime()))return"--";const e=this.seconds?{second:"2-digit"}:{};switch(this.format){case"iso":return t.toISOString();case"date":return t.toLocaleDateString(this.locale);case"time":return t.toLocaleTimeString(this.locale,{hour:"2-digit",minute:"2-digit",...e});case"relative":return this.relative(t);case"datetime":default:return t.toLocaleString(this.locale,{year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",...e})}}render(){const t=this.date();const e=this.formatted(t);const i=Number.isNaN(t.getTime())?undefined:t.toISOString();return s(n,{key:"46b6ebf2b8408a8b533293ef5a40c5c9380d6b91"},s("time",{key:"6bc3d7c3e5286927d44594c5eccc7bd03209f83a",class:"ts",part:"time",dateTime:i},e))}static get style(){return a()}},[513,"ind-timestamp",{value:[8],format:[513],locale:[1],seconds:[4]}]);function o(){if(typeof customElements==="undefined"){return}const t=["ind-timestamp"];t.forEach((t=>{switch(t){case"ind-timestamp":if(!customElements.get(i(t))){customElements.define(i(t),r)}break}}))}o();const c=r;const d=o;export{c as IndTimestamp,d as defineCustomElement};
+//# sourceMappingURL=ind-timestamp.js.map

package/dist/components/ind-timestamp.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["timestampCss","IndTimestamp","__stencil_proxyCustomElement","HTMLElement","value","format","locale","seconds","date","this","undefined","Date","relative","d","diff","getTime","now","abs","Math","rtf","Intl","RelativeTimeFormat","numeric","units","unit","ms","round","formatted","Number","isNaN","sec","second","toISOString","toLocaleDateString","toLocaleTimeString","hour","minute","toLocaleString","year","month","day","render","text","iso","h","Host","key","class","part","dateTime"],"sources":["src/components/atoms/timestamp/timestamp.css?tag=ind-timestamp&encapsulation=shadow","src/components/atoms/timestamp/timestamp.tsx"],"sourcesContent":[":host {\n  display: inline;\n}\n\n.ts {\n  font-family: var(--ind-font-family-mono, ui-monospace, monospace);\n  font-size: var(--ind-font-size-sm, 11px);\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n  color: var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));\n  white-space: nowrap;\n}\n\n:host([format=\"relative\"]) .ts {\n  font-family: var(--ind-font-family-sans, system-ui, sans-serif);\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type TimestampFormat = 'datetime' | 'date' | 'time' | 'relative' | 'iso';\n\n@Component({\n  tag: 'ind-timestamp',\n  styleUrl: 'timestamp.css',\n  shadow: true,\n})\nexport class IndTimestamp {\n  /** ISO string or epoch milliseconds. Defaults to now when omitted. */\n  @Prop() value?: string | number;\n  /** Display format. */\n  @Prop({ reflect: true }) format: TimestampFormat = 'datetime';\n  /** BCP-47 locale for formatting. */\n  @Prop() locale?: string;\n  /** Show seconds for time/datetime formats. */\n  @Prop() seconds: boolean = true;\n\n  private date(): Date {\n    if (this.value === undefined) return new Date();\n    return new Date(this.value);\n  }\n\n  private relative(d: Date): string {\n    const diff = d.getTime() - Date.now();\n    const abs = Math.abs(diff);\n    const rtf = new Intl.RelativeTimeFormat(this.locale, { numeric: 'auto' });\n    const units: [Intl.RelativeTimeFormatUnit, number][] = [\n      ['day', 86400000],\n      ['hour', 3600000],\n      ['minute', 60000],\n      ['second', 1000],\n    ];\n    for (const [unit, ms] of units) {\n      if (abs >= ms || unit === 'second') {\n        return rtf.format(Math.round(diff / ms), unit);\n      }\n    }\n    return rtf.format(0, 'second');\n  }\n\n  private formatted(d: Date): string {\n    if (Number.isNaN(d.getTime())) return '--';\n    const sec = this.seconds ? { second: '2-digit' as const } : {};\n    switch (this.format) {\n      case 'iso':\n        return d.toISOString();\n      case 'date':\n        return d.toLocaleDateString(this.locale);\n      case 'time':\n        return d.toLocaleTimeString(this.locale, { hour: '2-digit', minute: '2-digit', ...sec });\n      case 'relative':\n        return this.relative(d);\n      case 'datetime':\n      default:\n        return d.toLocaleString(this.locale, {\n          year: 'numeric', month: '2-digit', day: '2-digit',\n          hour: '2-digit', minute: '2-digit', ...sec,\n        });\n    }\n  }\n\n  render() {\n    const d = this.date();\n    const text = this.formatted(d);\n    const iso = Number.isNaN(d.getTime()) ? undefined : d.toISOString();\n    return (\n      <Host>\n        <time class=\"ts\" part=\"time\" dateTime={iso}>{text}</time>\n      </Host>\n    );\n  }\n}\n"],"mappings":"2DAAA,MAAMA,EAAe,IAAM,4X,MCSdC,EAAYC,EAAA,MAAAD,UAAAE,E,iFAEfC,MAEiBC,OAA0B,WAE3CC,OAEAC,QAAmB,KAEnB,IAAAC,GACN,GAAIC,KAAKL,QAAUM,UAAW,OAAO,IAAIC,KACzC,OAAO,IAAIA,KAAKF,KAAKL,M,CAGf,QAAAQ,CAASC,GACf,MAAMC,EAAOD,EAAEE,UAAYJ,KAAKK,MAChC,MAAMC,EAAMC,KAAKD,IAAIH,GACrB,MAAMK,EAAM,IAAIC,KAAKC,mBAAmBZ,KAAKH,OAAQ,CAAEgB,QAAS,SAChE,MAAMC,EAAiD,CACrD,CAAC,MAAO,OACR,CAAC,OAAQ,MACT,CAAC,SAAU,KACX,CAAC,SAAU,MAEb,IAAK,MAAOC,EAAMC,KAAOF,EAAO,CAC9B,GAAIN,GAAOQ,GAAMD,IAAS,SAAU,CAClC,OAAOL,EAAId,OAAOa,KAAKQ,MAAMZ,EAAOW,GAAKD,E,EAG7C,OAAOL,EAAId,OAAO,EAAG,S,CAGf,SAAAsB,CAAUd,GAChB,GAAIe,OAAOC,MAAMhB,EAAEE,WAAY,MAAO,KACtC,MAAMe,EAAMrB,KAAKF,QAAU,CAAEwB,OAAQ,WAAuB,GAC5D,OAAQtB,KAAKJ,QACX,IAAK,MACH,OAAOQ,EAAEmB,cACX,IAAK,OACH,OAAOnB,EAAEoB,mBAAmBxB,KAAKH,QACnC,IAAK,OACH,OAAOO,EAAEqB,mBAAmBzB,KAAKH,OAAQ,CAAE6B,KAAM,UAAWC,OAAQ,aAAcN,IACpF,IAAK,WACH,OAAOrB,KAAKG,SAASC,GACvB,IAAK,WACL,QACE,OAAOA,EAAEwB,eAAe5B,KAAKH,OAAQ,CACnCgC,KAAM,UAAWC,MAAO,UAAWC,IAAK,UACxCL,KAAM,UAAWC,OAAQ,aAAcN,I,CAK/C,MAAAW,GACE,MAAM5B,EAAIJ,KAAKD,OACf,MAAMkC,EAAOjC,KAAKkB,UAAUd,GAC5B,MAAM8B,EAAMf,OAAOC,MAAMhB,EAAEE,WAAaL,UAAYG,EAAEmB,cACtD,OACEY,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,2CAAMC,MAAM,KAAKC,KAAK,OAAOC,SAAUN,GAAMD,G","ignoreList":[]}

package/dist/components/ind-toggle.d.ts

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

package/dist/components/ind-toggle.js

@@ -0,0 +1,2 @@
+import{p as t,H as e,c as a,h as s,a as i,t as n}from"./index.js";const r=()=>`:host{display:inline-flex;--_w:36px;--_h:18px;--_pad:2px}:host([size="sm"]){--_w:28px;--_h:14px}:host([size="lg"]){--_w:46px;--_h:24px}.control{display:inline-flex;align-items:center;gap:var(--ind-spacing-3, 6px);padding:0;margin:0;border:none;background:none;cursor:pointer;font-family:var(--ind-font-family-sans, system-ui, sans-serif);font-size:var(--ind-font-size-base, 12px);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5))}.control:disabled{cursor:not-allowed;opacity:0.5}.track{position:relative;display:inline-flex;align-items:center;width:var(--_w);height:var(--_h);background:var(--ind-state-stopped-bg, #5a6776);border:1px solid var(--ind-surface-border-strong, #5a6776);border-radius:var(--ind-radius-full, 9999px);transition:background-color var(--ind-motion-duration-base, 200ms) var(--ind-motion-easing-standard, ease)}.thumb{position:absolute;top:50%;left:var(--_pad);transform:translateY(-50%);width:calc(var(--_h) - var(--_pad) * 2);height:calc(var(--_h) - var(--_pad) * 2);background:#fff;border-radius:50%;box-shadow:0 1px 2px rgba(0, 0, 0, 0.4);transition:left var(--ind-motion-duration-base, 200ms) var(--ind-motion-easing-standard, ease)}.text{flex:1;text-align:center;font-size:8px;font-weight:var(--ind-font-weight-bold, 700);text-transform:uppercase;color:var(--ind-surface-text-inverse, #f4f6f8);padding:0 4px}:host([checked]) .track{background:var(--ind-state-running-bg, #16a34a);border-color:var(--ind-state-running-border, #4ade80)}:host([checked]) .thumb{left:calc(100% - var(--_h) + var(--_pad))}.control:focus-visible .track{outline:2px solid var(--ind-surface-focus-ring, #67e8f9);outline-offset:2px}@media (prefers-reduced-motion: reduce){.thumb,.track{transition:none}}`;const o=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.indChange=a(this,"indChange")}checked=false;disabled=false;size="md";label;textOn;textOff;indChange;toggle=()=>{if(this.disabled)return;this.checked=!this.checked;this.indChange.emit(this.checked)};onKey=t=>{if(t.key===" "||t.key==="Enter"){t.preventDefault();this.toggle()}};render(){return s(i,{key:"e6963c1c5825f77432a6ee86a5331c73c038dc2d"},s("button",{key:"d6fc26eba0b9c4afb63a5ff4aaf3acfcd35478dc",type:"button",class:"control",part:"control",role:"switch","aria-checked":this.checked?"true":"false","aria-label":this.label,disabled:this.disabled,onClick:this.toggle,onKeyDown:this.onKey},s("span",{key:"926f8adf483f6f336665e5fc56a655de039bd960",class:"track",part:"track"},(this.textOn||this.textOff)&&s("span",{key:"6c176290532cff821d8f0eaac895528e8db3766a",class:"text",part:"text","aria-hidden":"true"},this.checked?this.textOn:this.textOff),s("span",{key:"6c87d49ca15e9f0000edd6c74291d691efd38c8f",class:"thumb",part:"thumb"})),this.label&&s("span",{key:"a0caa6d714b57d701187bf669291b9989a4b5f5d",class:"label",part:"label"},this.label)))}static get style(){return r()}},[513,"ind-toggle",{checked:[1540],disabled:[516],size:[513],label:[1],textOn:[1,"text-on"],textOff:[1,"text-off"]}]);function d(){if(typeof customElements==="undefined"){return}const t=["ind-toggle"];t.forEach((t=>{switch(t){case"ind-toggle":if(!customElements.get(n(t))){customElements.define(n(t),o)}break}}))}d();const c=o;const l=d;export{c as IndToggle,l as defineCustomElement};
+//# sourceMappingURL=ind-toggle.js.map

package/dist/components/ind-toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["toggleCss","IndToggle","__stencil_proxyCustomElement","HTMLElement","checked","disabled","size","label","textOn","textOff","indChange","toggle","this","emit","onKey","e","key","preventDefault","render","h","Host","type","class","part","role","onClick","onKeyDown"],"sources":["src/components/atoms/toggle/toggle.css?tag=ind-toggle&encapsulation=shadow","src/components/atoms/toggle/toggle.tsx"],"sourcesContent":[":host {\n  display: inline-flex;\n  --_w: 36px;\n  --_h: 18px;\n  --_pad: 2px;\n}\n\n:host([size=\"sm\"]) { --_w: 28px; --_h: 14px; }\n:host([size=\"lg\"]) { --_w: 46px; --_h: 24px; }\n\n.control {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n  padding: 0;\n  margin: 0;\n  border: none;\n  background: none;\n  cursor: pointer;\n  font-family: var(--ind-font-family-sans, system-ui, sans-serif);\n  font-size: var(--ind-font-size-base, 12px);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n}\n\n.control:disabled { cursor: not-allowed; opacity: 0.5; }\n\n.track {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  width: var(--_w);\n  height: var(--_h);\n  background: var(--ind-state-stopped-bg, #5a6776);\n  border: 1px solid var(--ind-surface-border-strong, #5a6776);\n  border-radius: var(--ind-radius-full, 9999px);\n  transition: background-color var(--ind-motion-duration-base, 200ms) var(--ind-motion-easing-standard, ease);\n}\n\n.thumb {\n  position: absolute;\n  top: 50%;\n  left: var(--_pad);\n  transform: translateY(-50%);\n  width: calc(var(--_h) - var(--_pad) * 2);\n  height: calc(var(--_h) - var(--_pad) * 2);\n  background: #fff;\n  border-radius: 50%;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n  transition: left var(--ind-motion-duration-base, 200ms) var(--ind-motion-easing-standard, ease);\n}\n\n.text {\n  flex: 1;\n  text-align: center;\n  font-size: 8px;\n  font-weight: var(--ind-font-weight-bold, 700);\n  text-transform: uppercase;\n  color: var(--ind-surface-text-inverse, #f4f6f8);\n  padding: 0 4px;\n}\n\n:host([checked]) .track {\n  background: var(--ind-state-running-bg, #16a34a);\n  border-color: var(--ind-state-running-border, #4ade80);\n}\n\n:host([checked]) .thumb {\n  left: calc(100% - var(--_h) + var(--_pad));\n}\n\n.control:focus-visible .track {\n  outline: 2px solid var(--ind-surface-focus-ring, #67e8f9);\n  outline-offset: 2px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .thumb, .track { transition: none; }\n}\n","import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\n\nexport type ToggleSize = 'sm' | 'md' | 'lg';\n\n@Component({\n  tag: 'ind-toggle',\n  styleUrl: 'toggle.css',\n  shadow: true,\n})\nexport class IndToggle {\n  /** On/off state. */\n  @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n  /** Disabled. */\n  @Prop({ reflect: true }) disabled: boolean = false;\n  /** Size. */\n  @Prop({ reflect: true }) size: ToggleSize = 'md';\n  /** Visible label. Also the accessible name. */\n  @Prop() label?: string;\n  /** Text shown for the on state (in-track). */\n  @Prop() textOn?: string;\n  /** Text shown for the off state (in-track). */\n  @Prop() textOff?: string;\n\n  /** Fires when the state changes. */\n  @Event() indChange!: EventEmitter<boolean>;\n\n  private toggle = () => {\n    if (this.disabled) return;\n    this.checked = !this.checked;\n    this.indChange.emit(this.checked);\n  };\n\n  private onKey = (e: KeyboardEvent) => {\n    if (e.key === ' ' || e.key === 'Enter') {\n      e.preventDefault();\n      this.toggle();\n    }\n  };\n\n  render() {\n    return (\n      <Host>\n        <button\n          type=\"button\"\n          class=\"control\"\n          part=\"control\"\n          role=\"switch\"\n          aria-checked={this.checked ? 'true' : 'false'}\n          aria-label={this.label}\n          disabled={this.disabled}\n          onClick={this.toggle}\n          onKeyDown={this.onKey}\n        >\n          <span class=\"track\" part=\"track\">\n            {(this.textOn || this.textOff) && (\n              <span class=\"text\" part=\"text\" aria-hidden=\"true\">\n                {this.checked ? this.textOn : this.textOff}\n              </span>\n            )}\n            <span class=\"thumb\" part=\"thumb\" />\n          </span>\n          {this.label && <span class=\"label\" part=\"label\">{this.label}</span>}\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kEAAA,MAAMA,EAAY,IAAM,gsD,MCSXC,EAASC,EAAA,MAAAD,UAAAE,E,oHAEoBC,QAAmB,MAElCC,SAAoB,MAEpBC,KAAmB,KAEpCC,MAEAC,OAEAC,QAGCC,UAEDC,OAAS,KACf,GAAIC,KAAKP,SAAU,OACnBO,KAAKR,SAAWQ,KAAKR,QACrBQ,KAAKF,UAAUG,KAAKD,KAAKR,QAAQ,EAG3BU,MAASC,IACf,GAAIA,EAAEC,MAAQ,KAAOD,EAAEC,MAAQ,QAAS,CACtCD,EAAEE,iBACFL,KAAKD,Q,GAIT,MAAAO,GACE,OACEC,EAACC,EAAI,CAAAJ,IAAA,4CACHG,EAAA,UAAAH,IAAA,2CACEK,KAAK,SACLC,MAAM,UACNC,KAAK,UACLC,KAAK,SAAQ,eACCZ,KAAKR,QAAU,OAAS,QAAO,aACjCQ,KAAKL,MACjBF,SAAUO,KAAKP,SACfoB,QAASb,KAAKD,OACde,UAAWd,KAAKE,OAEhBK,EAAA,QAAAH,IAAA,2CAAMM,MAAM,QAAQC,KAAK,UACrBX,KAAKJ,QAAUI,KAAKH,UACpBU,EAAA,QAAAH,IAAA,2CAAMM,MAAM,OAAOC,KAAK,OAAM,cAAa,QACxCX,KAAKR,QAAUQ,KAAKJ,OAASI,KAAKH,SAGvCU,EAAA,QAAAH,IAAA,2CAAMM,MAAM,QAAQC,KAAK,WAE1BX,KAAKL,OAASY,EAAA,QAAAH,IAAA,2CAAMM,MAAM,QAAQC,KAAK,SAASX,KAAKL,Q","ignoreList":[]}

package/dist/components/ind-toolbar-action.js

@@ -1,2 +1,2 @@
-import{p as a,H as e,h as t,a as n,t as s}from"./index.js";const c=()=>`:host{display:flex;align-items:center;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-3, 6px) var(--ind-spacing-5, 12px);background:var(--ind-surface-panel);border-bottom:1px solid var(--ind-surface-border-default);font-family:var(--ind-font-family-sans);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));flex-wrap:wrap}.filter ::slotted(*){min-width:200px}.flags{display:flex;align-items:center;gap:var(--ind-spacing-4, 8px)}.spacer{flex:1}.counter{font-family:var(--ind-font-family-mono);font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1);color:var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));font-size:var(--ind-font-size-sm, 11px);white-space:nowrap}.actions{display:flex;gap:var(--ind-spacing-3, 6px)}`;const i=a(class a extends e{constructor(a){super();if(a!==false){this.__registerHost()}this.__attachShadow()}counter;render(){const a=this.counter!==undefined&&this.counter!==""&&this.counter!==null;return t(n,{key:"335b711876377ee50cfeaac4635c2794d5c038eb"},t("span",{key:"69cf5e6ca388c2bef9004cddd515db9c1d34f2f9",class:"filter",part:"filter"},t("slot",{key:"6a5d72136095b2531214ea2e28a39a795e8b7e2d",name:"filter"})),t("span",{key:"614f12f7432752c3deef9cca8174a503d7048878",class:"flags",part:"flags"},t("slot",{key:"db14ea5398c70574cb0b690db2e0578aafa6a545",name:"flags"})),t("span",{key:"07ff837c88d3228666b7bcd36ae52f9efa5b081d",class:"spacer"}),a&&t("span",{key:"ee9220383a9a4c9c471f4945da3c28f67dada3ee",class:"counter",part:"counter"},this.counter),t("span",{key:"53bc247add97382c56d4447b30c9b73e663fbe96",class:"actions",part:"actions"},t("slot",{key:"da6c78e96a87a412f44d620356268ef1a746fc99",name:"actions"})))}static get style(){return c()}},[769,"ind-toolbar-action",{counter:[8]}]);function r(){if(typeof customElements==="undefined"){return}const a=["ind-toolbar-action"];a.forEach((a=>{switch(a){case"ind-toolbar-action":if(!customElements.get(s(a))){customElements.define(s(a),i)}break}}))}r();const f=i;const d=r;export{f as IndToolbarAction,d as defineCustomElement};
+import{p as a,H as e,h as t,a as n,t as s}from"./index.js";const c=()=>`:host{display:flex;align-items:center;gap:var(--ind-spacing-4, 8px);padding:var(--ind-spacing-3, 6px) var(--ind-spacing-5, 12px);background:var(--ind-surface-panel);border-bottom:1px solid var(--ind-surface-border-default);font-family:var(--ind-font-family-sans);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));flex-wrap:wrap}.filter ::slotted(*){min-width:200px}.flags{display:flex;align-items:center;gap:var(--ind-spacing-4, 8px)}.spacer{flex:1}.counter{font-family:var(--ind-font-family-mono);font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1);color:var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));font-size:var(--ind-font-size-sm, 11px);white-space:nowrap}.actions{display:flex;gap:var(--ind-spacing-3, 6px)}`;const i=a(class a extends e{constructor(a){super();if(a!==false){this.__registerHost()}this.__attachShadow()}counter;render(){const a=this.counter!==undefined&&this.counter!==""&&this.counter!==null;return t(n,{key:"81aa8e4cad409b96e588cf4691bef6ebd66ce043"},t("span",{key:"3fc77803b13475a052d44eb78349532f225c89a6",class:"filter",part:"filter"},t("slot",{key:"52b82a86e26d0cceddd855e99c10451847c31b6b",name:"filter"})),t("span",{key:"ee63d41fc03f48290c8af4b9fecf2b3f3bd69037",class:"flags",part:"flags"},t("slot",{key:"8e9b7de789964881f0b563d52dac4df81aec34b1",name:"flags"})),t("span",{key:"8a326615b88b093098174cb4ed4cd862975c6223",class:"spacer"}),a&&t("span",{key:"287d17705a342b6d0051de2231fd21f8c75d83ac",class:"counter",part:"counter"},this.counter),t("span",{key:"cbeae4f7b493ed26aa3c1e3c0d85fd3184bb00aa",class:"actions",part:"actions"},t("slot",{key:"b6725f26e0fae0dc46d0cf34de3dbf894922777c",name:"actions"})))}static get style(){return c()}},[769,"ind-toolbar-action",{counter:[8]}]);function r(){if(typeof customElements==="undefined"){return}const a=["ind-toolbar-action"];a.forEach((a=>{switch(a){case"ind-toolbar-action":if(!customElements.get(s(a))){customElements.define(s(a),i)}break}}))}r();const d=i;const f=r;export{d as IndToolbarAction,f as defineCustomElement};
 //# sourceMappingURL=ind-toolbar-action.js.map

package/dist/components/ind-tree-node.d.ts

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

package/dist/components/ind-tree-node.js

@@ -0,0 +1,2 @@
+import{p as e,H as t,c as s,h as i,a as n,t as a}from"./index.js";const r=()=>`:host{display:block;font-family:var(--ind-font-family-sans, system-ui, sans-serif);font-size:var(--ind-font-size-base, 12px);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5))}.row{display:flex;align-items:center;gap:var(--ind-spacing-2, 4px);padding:2px var(--ind-spacing-3, 6px);cursor:pointer;border-radius:var(--ind-radius-sm, 2px);user-select:none}.row:hover{background:var(--ind-surface-raised, #1b222c)}.row:focus-visible{outline:2px solid var(--ind-surface-focus-ring, #67e8f9);outline-offset:-2px}:host([selected]) .row{background:color-mix(in srgb, var(--ind-button-primary-bg, #2563eb) 28%, transparent)}.indent{width:var(--_indent, 0);flex:none}.twisty{appearance:none;border:none;background:none;padding:0;width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ind-surface-text-muted, #7a8694);flex:none}.twisty.is-leaf{cursor:default}.twisty svg{width:12px;height:12px;transition:transform var(--ind-motion-duration-fast, 120ms) ease}.twisty svg path{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}:host([expanded]) .twisty svg{transform:rotate(90deg)}.icon{display:inline-flex;align-items:center}.icon:empty{display:none}.label{white-space:nowrap}.children{display:block}@media (prefers-reduced-motion: reduce){.twisty svg{transition:none}}`;const d=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.indSelect=s(this,"indSelect");this.indToggle=s(this,"indToggle")}level=0;expanded=false;leaf=false;selected=false;label;indSelect;indToggle;toggle=e=>{e.stopPropagation();if(this.leaf)return;this.expanded=!this.expanded;this.indToggle.emit(this.expanded)};select=()=>{this.indSelect.emit()};onKey=e=>{if(e.key==="Enter"||e.key===" "){e.preventDefault();this.select()}else if(e.key==="ArrowRight"&&!this.leaf&&!this.expanded){this.expanded=true;this.indToggle.emit(true)}else if(e.key==="ArrowLeft"&&!this.leaf&&this.expanded){this.expanded=false;this.indToggle.emit(false)}};render(){return i(n,{key:"412fc1efe18db56c9cc0a2fc8ba9564bf9c4d7bb"},i("div",{key:"05392b3770fd8add45281948656850dfe792a5d1",class:"row",part:"row",role:"treeitem","aria-expanded":this.leaf?undefined:this.expanded?"true":"false","aria-selected":this.selected?"true":"false",tabindex:"0",style:{"--_indent":`${this.level*16}px`},onClick:this.select,onKeyDown:this.onKey},i("span",{key:"63eec9a57c75ad32154ef4b70a7bcff647e4a2de",class:"indent","aria-hidden":"true"}),this.leaf?i("span",{class:"twisty is-leaf",part:"twisty","aria-hidden":"true"}):i("button",{type:"button",class:"twisty",part:"twisty","aria-label":this.expanded?"Collapse":"Expand",onClick:this.toggle},i("svg",{viewBox:"0 0 24 24","aria-hidden":"true"},i("path",{d:"M9 5l7 7-7 7"}))),i("span",{key:"d5c26f9bd8a479fb0dc261a0e2e0f147d978245f",class:"icon",part:"icon"},i("slot",{key:"9978ea0bc931f6611e95cde6d36328cd0418e4dc",name:"icon"})),i("span",{key:"d6d89358b351f02fa968ffc83e4a1ed60ae6f467",class:"label",part:"label"},this.label,i("slot",{key:"58e1550e39cde11164b6266c0e298e89b6eac826"}))),!this.leaf&&this.expanded&&i("div",{key:"c8e965f709868143d6f7a54a663e73cb41c4c498",class:"children",part:"children",role:"group"},i("slot",{key:"f4555d55f582041bc74f7b26975123803d9aca2f",name:"children"})))}static get style(){return r()}},[769,"ind-tree-node",{level:[2],expanded:[1540],leaf:[516],selected:[516],label:[1]}]);function o(){if(typeof customElements==="undefined"){return}const e=["ind-tree-node"];e.forEach((e=>{switch(e){case"ind-tree-node":if(!customElements.get(a(e))){customElements.define(a(e),d)}break}}))}o();const l=d;const c=o;export{l as IndTreeNode,c as defineCustomElement};
+//# sourceMappingURL=ind-tree-node.js.map

package/dist/components/ind-tree-node.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["treeNodeCss","IndTreeNode","__stencil_proxyCustomElement","HTMLElement","level","expanded","leaf","selected","label","indSelect","indToggle","toggle","e","stopPropagation","this","emit","select","onKey","key","preventDefault","render","h","Host","class","part","role","undefined","tabindex","style","onClick","onKeyDown","type","viewBox","d","name"],"sources":["src/components/atoms/tree-node/tree-node.css?tag=ind-tree-node&encapsulation=shadow","src/components/atoms/tree-node/tree-node.tsx"],"sourcesContent":[":host {\n  display: block;\n  font-family: var(--ind-font-family-sans, system-ui, sans-serif);\n  font-size: var(--ind-font-size-base, 12px);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n}\n\n.row {\n  display: flex;\n  align-items: center;\n  gap: var(--ind-spacing-2, 4px);\n  padding: 2px var(--ind-spacing-3, 6px);\n  cursor: pointer;\n  border-radius: var(--ind-radius-sm, 2px);\n  user-select: none;\n}\n\n.row:hover { background: var(--ind-surface-raised, #1b222c); }\n\n.row:focus-visible {\n  outline: 2px solid var(--ind-surface-focus-ring, #67e8f9);\n  outline-offset: -2px;\n}\n\n:host([selected]) .row {\n  background: color-mix(in srgb, var(--ind-button-primary-bg, #2563eb) 28%, transparent);\n}\n\n.indent { width: var(--_indent, 0); flex: none; }\n\n.twisty {\n  appearance: none;\n  border: none;\n  background: none;\n  padding: 0;\n  width: 16px;\n  height: 16px;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  color: var(--ind-surface-text-muted, #7a8694);\n  flex: none;\n}\n.twisty.is-leaf { cursor: default; }\n\n.twisty svg {\n  width: 12px;\n  height: 12px;\n  transition: transform var(--ind-motion-duration-fast, 120ms) ease;\n}\n.twisty svg path { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }\n\n:host([expanded]) .twisty svg { transform: rotate(90deg); }\n\n.icon { display: inline-flex; align-items: center; }\n.icon:empty { display: none; }\n\n.label { white-space: nowrap; }\n\n.children { display: block; }\n\n@media (prefers-reduced-motion: reduce) {\n  .twisty svg { transition: none; }\n}\n","import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\n\n@Component({\n  tag: 'ind-tree-node',\n  styleUrl: 'tree-node.css',\n  shadow: true,\n})\nexport class IndTreeNode {\n  /** Nesting depth (0 = root) — drives the indent. */\n  @Prop() level: number = 0;\n  /** Expanded state (ignored for leaf nodes). */\n  @Prop({ mutable: true, reflect: true }) expanded: boolean = false;\n  /** Leaf node — no twisty, not expandable. */\n  @Prop({ reflect: true }) leaf: boolean = false;\n  /** Selected state. */\n  @Prop({ reflect: true }) selected: boolean = false;\n  /** Visible text. Use the default slot for richer content. */\n  @Prop() label?: string;\n\n  /** Fires when the row is selected. */\n  @Event() indSelect!: EventEmitter<void>;\n  /** Fires when the twisty toggles expansion. */\n  @Event() indToggle!: EventEmitter<boolean>;\n\n  private toggle = (e: MouseEvent) => {\n    e.stopPropagation();\n    if (this.leaf) return;\n    this.expanded = !this.expanded;\n    this.indToggle.emit(this.expanded);\n  };\n\n  private select = () => {\n    this.indSelect.emit();\n  };\n\n  private onKey = (e: KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); this.select(); }\n    else if (e.key === 'ArrowRight' && !this.leaf && !this.expanded) { this.expanded = true; this.indToggle.emit(true); }\n    else if (e.key === 'ArrowLeft' && !this.leaf && this.expanded) { this.expanded = false; this.indToggle.emit(false); }\n  };\n\n  render() {\n    return (\n      <Host>\n        <div\n          class=\"row\"\n          part=\"row\"\n          role=\"treeitem\"\n          aria-expanded={this.leaf ? undefined : this.expanded ? 'true' : 'false'}\n          aria-selected={this.selected ? 'true' : 'false'}\n          tabindex=\"0\"\n          style={{ '--_indent': `${this.level * 16}px` }}\n          onClick={this.select}\n          onKeyDown={this.onKey}\n        >\n          <span class=\"indent\" aria-hidden=\"true\" />\n          {this.leaf ? (\n            <span class=\"twisty is-leaf\" part=\"twisty\" aria-hidden=\"true\" />\n          ) : (\n            <button type=\"button\" class=\"twisty\" part=\"twisty\" aria-label={this.expanded ? 'Collapse' : 'Expand'} onClick={this.toggle}>\n              <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M9 5l7 7-7 7\" /></svg>\n            </button>\n          )}\n          <span class=\"icon\" part=\"icon\"><slot name=\"icon\" /></span>\n          <span class=\"label\" part=\"label\">{this.label}<slot /></span>\n        </div>\n        {!this.leaf && this.expanded && (\n          <div class=\"children\" part=\"children\" role=\"group\">\n            <slot name=\"children\" />\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"kEAAA,MAAMA,EAAc,IAAM,61C,MCObC,EAAWC,EAAA,MAAAD,UAAAE,E,uJAEdC,MAAgB,EAEgBC,SAAoB,MAEnCC,KAAgB,MAEhBC,SAAoB,MAErCC,MAGCC,UAEAC,UAEDC,OAAUC,IAChBA,EAAEC,kBACF,GAAIC,KAAKR,KAAM,OACfQ,KAAKT,UAAYS,KAAKT,SACtBS,KAAKJ,UAAUK,KAAKD,KAAKT,SAAS,EAG5BW,OAAS,KACfF,KAAKL,UAAUM,MAAM,EAGfE,MAASL,IACf,GAAIA,EAAEM,MAAQ,SAAWN,EAAEM,MAAQ,IAAK,CAAEN,EAAEO,iBAAkBL,KAAKE,Q,MAC9D,GAAIJ,EAAEM,MAAQ,eAAiBJ,KAAKR,OAASQ,KAAKT,SAAU,CAAES,KAAKT,SAAW,KAAMS,KAAKJ,UAAUK,KAAK,K,MACxG,GAAIH,EAAEM,MAAQ,cAAgBJ,KAAKR,MAAQQ,KAAKT,SAAU,CAAES,KAAKT,SAAW,MAAOS,KAAKJ,UAAUK,KAAK,M,GAG9G,MAAAK,GACE,OACEC,EAACC,EAAI,CAAAJ,IAAA,4CACHG,EAAA,OAAAH,IAAA,2CACEK,MAAM,MACNC,KAAK,MACLC,KAAK,WAAU,gBACAX,KAAKR,KAAOoB,UAAYZ,KAAKT,SAAW,OAAS,QAAO,gBACxDS,KAAKP,SAAW,OAAS,QACxCoB,SAAS,IACTC,MAAO,CAAE,YAAa,GAAGd,KAAKV,MAAQ,QACtCyB,QAASf,KAAKE,OACdc,UAAWhB,KAAKG,OAEhBI,EAAA,QAAAH,IAAA,2CAAMK,MAAM,SAAQ,cAAa,SAChCT,KAAKR,KACJe,EAAA,QAAME,MAAM,iBAAiBC,KAAK,SAAQ,cAAa,SAEvDH,EAAA,UAAQU,KAAK,SAASR,MAAM,SAASC,KAAK,SAAQ,aAAaV,KAAKT,SAAW,WAAa,SAAUwB,QAASf,KAAKH,QAClHU,EAAA,OAAKW,QAAQ,YAAW,cAAa,QAAOX,EAAA,QAAMY,EAAE,mBAGxDZ,EAAA,QAAAH,IAAA,2CAAMK,MAAM,OAAOC,KAAK,QAAOH,EAAA,QAAAH,IAAA,2CAAMgB,KAAK,UAC1Cb,EAAA,QAAAH,IAAA,2CAAMK,MAAM,QAAQC,KAAK,SAASV,KAAKN,MAAMa,EAAA,QAAAH,IAAA,gDAE7CJ,KAAKR,MAAQQ,KAAKT,UAClBgB,EAAA,OAAAH,IAAA,2CAAKK,MAAM,WAAWC,KAAK,WAAWC,KAAK,SACzCJ,EAAA,QAAAH,IAAA,2CAAMgB,KAAK,c","ignoreList":[]}

package/dist/components/ind-trend-viewer.d.ts

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

package/dist/components/ind-trend-viewer.js

@@ -0,0 +1,2 @@
+import{p as e,H as a,h as i,a as n,t as s}from"./index.js";import{d as r}from"./p-5RlFcxee.js";const t=()=>`: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 d=()=>`:host{min-width:360px}.series{display:flex;flex-direction:column;gap:var(--ind-spacing-2, 4px)}.series-head{display:flex;align-items:baseline;gap:var(--ind-spacing-3, 6px);font-size:var(--ind-font-size-sm, 11px)}.series-label{color:var(--ind-surface-text-secondary)}.series-value{margin-left:auto;font-family:var(--ind-font-family-mono);font-weight:var(--ind-font-weight-semibold, 600);color:var(--ind-surface-text-primary)}.legend{width:10px;height:10px;border-radius:2px;flex:0 0 auto;background:var(--ind-surface-text-muted)}.legend-running{background:var(--ind-state-running-bg, #16a34a)}.legend-warning{background:var(--ind-state-warning-bg, #f59e0b)}.legend-fault{background:var(--ind-state-fault-bg, #dc2626)}.legend-default{background:var(--ind-color-palette-cyan-300, #22d3ee)}.series-spark{width:100%;height:40px}`;const l=e(class e extends a{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow()}heading="Trends";series=[];last(e){if(!e.points.length)return"--";const a=e.points[e.points.length-1];return e.precision!==undefined?a.toFixed(e.precision):String(a)}render(){return i(n,{key:"41e4221a264008e8405251a8701cc16576758fe7"},i("div",{key:"9c0684d404e77dbb2de77d1873b933f58a420e85",class:"panel-head"},i("span",{key:"596e6de04ef55e07038c9d7c78cbf258767c7699",class:"panel-title",part:"heading"},this.heading)),i("div",{key:"fd80bafe1fbe0a0f7bccc713a6ec0a13b5eb53b3",class:"panel-body"},this.series.length===0?i("div",{class:"panel-empty"},"No series"):this.series.map(((e,a)=>i("div",{class:"series",part:"series",key:a},i("div",{class:"series-head"},i("span",{class:`legend legend-${e.variant??"default"}`,"aria-hidden":"true"}),i("span",{class:"series-label"},e.label),i("span",{class:"series-value"},this.last(e),e.unit?` ${e.unit}`:"")),i("ind-sparkline",{class:"series-spark",points:e.points,variant:e.variant??"default",area:true}))))))}static get style(){return t()+d()}},[513,"ind-trend-viewer",{heading:[1],series:[16]}]);function o(){if(typeof customElements==="undefined"){return}const e=["ind-trend-viewer","ind-sparkline"];e.forEach((e=>{switch(e){case"ind-trend-viewer":if(!customElements.get(s(e))){customElements.define(s(e),l)}break;case"ind-sparkline":if(!customElements.get(s(e))){r()}break}}))}o();const p=l;const c=o;export{p as IndTrendViewer,c as defineCustomElement};
+//# sourceMappingURL=ind-trend-viewer.js.map

package/dist/components/ind-trend-viewer.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["panelCss","trendViewerCss","IndTrendViewer","__stencil_proxyCustomElement","HTMLElement","heading","series","last","s","points","length","v","precision","undefined","toFixed","String","render","h","Host","key","class","part","this","map","i","variant","label","unit","area"],"sources":["src/components/organisms/_shared/panel.css?tag=ind-trend-viewer&encapsulation=shadow","src/components/organisms/trend-viewer/trend-viewer.css?tag=ind-trend-viewer&encapsulation=shadow","src/components/organisms/trend-viewer/trend-viewer.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: 360px;\n}\n\n.series {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ind-spacing-2, 4px);\n}\n\n.series-head {\n  display: flex;\n  align-items: baseline;\n  gap: var(--ind-spacing-3, 6px);\n  font-size: var(--ind-font-size-sm, 11px);\n}\n\n.series-label {\n  color: var(--ind-surface-text-secondary);\n}\n\n.series-value {\n  margin-left: auto;\n  font-family: var(--ind-font-family-mono);\n  font-weight: var(--ind-font-weight-semibold, 600);\n  color: var(--ind-surface-text-primary);\n}\n\n.legend {\n  width: 10px;\n  height: 10px;\n  border-radius: 2px;\n  flex: 0 0 auto;\n  background: var(--ind-surface-text-muted);\n}\n\n.legend-running { background: var(--ind-state-running-bg, #16a34a); }\n.legend-warning { background: var(--ind-state-warning-bg, #f59e0b); }\n.legend-fault { background: var(--ind-state-fault-bg, #dc2626); }\n.legend-default { background: var(--ind-color-palette-cyan-300, #22d3ee); }\n\n.series-spark {\n  width: 100%;\n  height: 40px;\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\nimport type { TrendVariant } from '../../molecules/trend-widget/trend-widget';\n\nexport interface TrendSeries {\n  label: string;\n  points: number[];\n  unit?: string;\n  variant?: TrendVariant;\n  precision?: number;\n}\n\n/**\n * Multi-series trend viewer. Stacks one labelled `<ind-sparkline>` per series\n * with the current value, for comparing several tags without a full charting\n * library.\n */\n@Component({\n  tag: 'ind-trend-viewer',\n  styleUrls: ['../_shared/panel.css', 'trend-viewer.css'],\n  shadow: true,\n})\nexport class IndTrendViewer {\n  @Prop() heading: string = 'Trends';\n  /** Series to plot. */\n  @Prop() series: TrendSeries[] = [];\n\n  private last(s: TrendSeries): string {\n    if (!s.points.length) return '--';\n    const v = s.points[s.points.length - 1];\n    return s.precision !== undefined ? v.toFixed(s.precision) : String(v);\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"panel-head\">\n          <span class=\"panel-title\" part=\"heading\">{this.heading}</span>\n        </div>\n        <div class=\"panel-body\">\n          {this.series.length === 0 ? (\n            <div class=\"panel-empty\">No series</div>\n          ) : (\n            this.series.map((s, i) => (\n              <div class=\"series\" part=\"series\" key={i}>\n                <div class=\"series-head\">\n                  <span class={`legend legend-${s.variant ?? 'default'}`} aria-hidden=\"true\"></span>\n                  <span class=\"series-label\">{s.label}</span>\n                  <span class=\"series-value\">\n                    {this.last(s)}{s.unit ? ` ${s.unit}` : ''}\n                  </span>\n                </div>\n                <ind-sparkline class=\"series-spark\" points={s.points} variant={s.variant ?? 'default'} area></ind-sparkline>\n              </div>\n            ))\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"+FAAA,MAAMA,EAAW,IAAM,4zDCAvB,MAAMC,EAAiB,IAAM,0zB,MCqBhBC,EAAcC,EAAA,MAAAD,UAAAE,E,iFACjBC,QAAkB,SAElBC,OAAwB,GAExB,IAAAC,CAAKC,GACX,IAAKA,EAAEC,OAAOC,OAAQ,MAAO,KAC7B,MAAMC,EAAIH,EAAEC,OAAOD,EAAEC,OAAOC,OAAS,GACrC,OAAOF,EAAEI,YAAcC,UAAYF,EAAEG,QAAQN,EAAEI,WAAaG,OAAOJ,E,CAGrE,MAAAK,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,cACTH,EAAA,QAAAE,IAAA,2CAAMC,MAAM,cAAcC,KAAK,WAAWC,KAAKjB,UAEjDY,EAAA,OAAAE,IAAA,2CAAKC,MAAM,cACRE,KAAKhB,OAAOI,SAAW,EACtBO,EAAA,OAAKG,MAAM,eAAa,aAExBE,KAAKhB,OAAOiB,KAAI,CAACf,EAAGgB,IAClBP,EAAA,OAAKG,MAAM,SAASC,KAAK,SAASF,IAAKK,GACrCP,EAAA,OAAKG,MAAM,eACTH,EAAA,QAAMG,MAAO,iBAAiBZ,EAAEiB,SAAW,YAAW,cAAc,SACpER,EAAA,QAAMG,MAAM,gBAAgBZ,EAAEkB,OAC9BT,EAAA,QAAMG,MAAM,gBACTE,KAAKf,KAAKC,GAAIA,EAAEmB,KAAO,IAAInB,EAAEmB,OAAS,KAG3CV,EAAA,iBAAeG,MAAM,eAAeX,OAAQD,EAAEC,OAAQgB,QAASjB,EAAEiB,SAAW,UAAWG,KAAI,W","ignoreList":[]}

package/dist/components/ind-trend-widget.d.ts

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

package/dist/components/ind-trend-widget.js

@@ -0,0 +1,2 @@
+import{p as e,H as a,h as t,a as i,t as n}from"./index.js";import{d as s}from"./p-5RlFcxee.js";import{d as r}from"./p-BInyhy9s.js";const d=()=>`: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 o=()=>`:host{min-width:200px}.spark{width:100%;height:44px}.bounds{display:flex;justify-content:space-between;font-size:var(--ind-font-size-xs, 10px);color:var(--ind-surface-text-muted)}`;const c=e(class e extends a{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow()}label;tag;value;unit;precision=1;points=[];min;max;variant="default";current(){if(this.value!==undefined)return this.value;return this.points.length?this.points[this.points.length-1]:undefined}render(){const e=this.current();const a=this.min??(this.points.length?Math.min(...this.points):undefined);const n=this.max??(this.points.length?Math.max(...this.points):undefined);return t(i,{key:"eb9a651961a5989007c7c746f435552249f64938",role:"group","aria-label":this.label},t("div",{key:"e4e3160f886ed6d0419f49c722d4e47cb6fc2a5a",class:"card-head"},t("span",{key:"cb6534bfb01a54e30c5d4ab46b9c11de6f6f633d",class:"card-title",part:"label"},this.label),this.tag&&t("span",{key:"1e9f94807667aab363d7b7ee49b60e0fefd55f7b",class:"card-tag",part:"tag"},this.tag)),e!==undefined&&t("ind-value",{key:"4e1ee4fd15d6dc61ded72b81f5393ea5a996f234",part:"value",value:e,unit:this.unit,precision:this.precision,size:"lg"}),this.points.length>1&&t("ind-sparkline",{key:"eee4f130adbb659f75ab6c1a004f770bf5ff92ad",class:"spark",part:"spark",points:this.points,min:this.min,max:this.max,variant:this.variant,area:true}),a!==undefined&&n!==undefined&&t("div",{key:"bb09835b6ee49b2aa80a05867222cf7893bfbf89",class:"bounds",part:"bounds"},t("span",{key:"d9e5ec2921d758508439e573eae0bd07a3c5bc30"},"min ",a.toFixed(this.precision)),t("span",{key:"8e889674c72bc88d2915c15209534bfe92ed10c9"},"max ",n.toFixed(this.precision))))}static get style(){return d()+o()}},[513,"ind-trend-widget",{label:[1],tag:[1],value:[2],unit:[1],precision:[2],points:[16],min:[2],max:[2],variant:[1]}]);function f(){if(typeof customElements==="undefined"){return}const e=["ind-trend-widget","ind-sparkline","ind-value"];e.forEach((e=>{switch(e){case"ind-trend-widget":if(!customElements.get(n(e))){customElements.define(n(e),c)}break;case"ind-sparkline":if(!customElements.get(n(e))){s()}break;case"ind-value":if(!customElements.get(n(e))){r()}break}}))}f();const l=c;const u=f;export{l as IndTrendWidget,u as defineCustomElement};
+//# sourceMappingURL=ind-trend-widget.js.map

package/dist/components/ind-trend-widget.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cardCss","trendWidgetCss","IndTrendWidget","__stencil_proxyCustomElement","HTMLElement","label","tag","value","unit","precision","points","min","max","variant","current","this","undefined","length","render","cur","lo","Math","hi","h","Host","key","role","class","part","size","area","toFixed"],"sources":["src/components/molecules/_shared/card.css?tag=ind-trend-widget&encapsulation=shadow","src/components/molecules/trend-widget/trend-widget.css?tag=ind-trend-widget&encapsulation=shadow","src/components/molecules/trend-widget/trend-widget.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: 200px;\n}\n\n.spark {\n  width: 100%;\n  height: 44px;\n}\n\n.bounds {\n  display: flex;\n  justify-content: space-between;\n  font-size: var(--ind-font-size-xs, 10px);\n  color: var(--ind-surface-text-muted);\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type TrendVariant = 'default' | 'running' | 'warning' | 'fault';\n\n/**\n * Compact trend widget: current value, an `<ind-sparkline>` of the recent\n * window, and min/max bounds. For dense dashboards where a full trend chart is\n * too heavy.\n */\n@Component({\n  tag: 'ind-trend-widget',\n  styleUrls: ['../_shared/card.css', 'trend-widget.css'],\n  shadow: true,\n})\nexport class IndTrendWidget {\n  /** Series label (e.g. \"Discharge pressure\"). */\n  @Prop() label!: string;\n  /** Process tag. */\n  @Prop() tag?: string;\n  /** Current value (defaults to the last point). */\n  @Prop() value?: number;\n  /** Engineering unit. */\n  @Prop() unit?: string;\n  /** Decimal places. */\n  @Prop() precision: number = 1;\n  /** Recent samples. */\n  @Prop() points: number[] = [];\n  /** Sparkline lower bound (auto if omitted). */\n  @Prop() min?: number;\n  /** Sparkline upper bound (auto if omitted). */\n  @Prop() max?: number;\n  /** Sparkline color variant. */\n  @Prop() variant: TrendVariant = 'default';\n\n  private current(): number | undefined {\n    if (this.value !== undefined) return this.value;\n    return this.points.length ? this.points[this.points.length - 1] : undefined;\n  }\n\n  render() {\n    const cur = this.current();\n    const lo = this.min ?? (this.points.length ? Math.min(...this.points) : undefined);\n    const hi = this.max ?? (this.points.length ? Math.max(...this.points) : undefined);\n    return (\n      <Host role=\"group\" aria-label={this.label}>\n        <div class=\"card-head\">\n          <span class=\"card-title\" part=\"label\">{this.label}</span>\n          {this.tag && <span class=\"card-tag\" part=\"tag\">{this.tag}</span>}\n        </div>\n        {cur !== undefined && (\n          <ind-value part=\"value\" value={cur} unit={this.unit} precision={this.precision} size=\"lg\" />\n        )}\n        {this.points.length > 1 && (\n          <ind-sparkline\n            class=\"spark\"\n            part=\"spark\"\n            points={this.points}\n            min={this.min}\n            max={this.max}\n            variant={this.variant}\n            area\n          />\n        )}\n        {lo !== undefined && hi !== undefined && (\n          <div class=\"bounds\" part=\"bounds\">\n            <span>min {lo.toFixed(this.precision)}</span>\n            <span>max {hi.toFixed(this.precision)}</span>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"mIAAA,MAAMA,EAAU,IAAM,8zCCAtB,MAAMC,EAAiB,IAAM,sL,MCchBC,EAAcC,EAAA,MAAAD,UAAAE,E,iFAEjBC,MAEAC,IAEAC,MAEAC,KAEAC,UAAoB,EAEpBC,OAAmB,GAEnBC,IAEAC,IAEAC,QAAwB,UAExB,OAAAC,GACN,GAAIC,KAAKR,QAAUS,UAAW,OAAOD,KAAKR,MAC1C,OAAOQ,KAAKL,OAAOO,OAASF,KAAKL,OAAOK,KAAKL,OAAOO,OAAS,GAAKD,S,CAGpE,MAAAE,GACE,MAAMC,EAAMJ,KAAKD,UACjB,MAAMM,EAAKL,KAAKJ,MAAQI,KAAKL,OAAOO,OAASI,KAAKV,OAAOI,KAAKL,QAAUM,WACxE,MAAMM,EAAKP,KAAKH,MAAQG,KAAKL,OAAOO,OAASI,KAAKT,OAAOG,KAAKL,QAAUM,WACxE,OACEO,EAACC,EAAI,CAAAC,IAAA,2CAACC,KAAK,QAAO,aAAaX,KAAKV,OAClCkB,EAAA,OAAAE,IAAA,2CAAKE,MAAM,aACTJ,EAAA,QAAAE,IAAA,2CAAME,MAAM,aAAaC,KAAK,SAASb,KAAKV,OAC3CU,KAAKT,KAAOiB,EAAA,QAAAE,IAAA,2CAAME,MAAM,WAAWC,KAAK,OAAOb,KAAKT,MAEtDa,IAAQH,WACPO,EAAA,aAAAE,IAAA,2CAAWG,KAAK,QAAQrB,MAAOY,EAAKX,KAAMO,KAAKP,KAAMC,UAAWM,KAAKN,UAAWoB,KAAK,OAEtFd,KAAKL,OAAOO,OAAS,GACpBM,EAAA,iBAAAE,IAAA,2CACEE,MAAM,QACNC,KAAK,QACLlB,OAAQK,KAAKL,OACbC,IAAKI,KAAKJ,IACVC,IAAKG,KAAKH,IACVC,QAASE,KAAKF,QACdiB,KAAI,OAGPV,IAAOJ,WAAaM,IAAON,WAC1BO,EAAA,OAAAE,IAAA,2CAAKE,MAAM,SAASC,KAAK,UACvBL,EAAA,QAAAE,IAAA,mDAAWL,EAAGW,QAAQhB,KAAKN,YAC3Bc,EAAA,QAAAE,IAAA,mDAAWH,EAAGS,QAAQhB,KAAKN,a","ignoreList":[]}

package/dist/components/ind-unit-label.d.ts

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

package/dist/components/ind-unit-label.js

@@ -0,0 +1,2 @@
+import{p as s,H as e,h as t,a as i,t as n}from"./index.js";const a=()=>`:host{display:inline;--_size:var(--ind-font-size-sm, 11px)}:host([size="sm"]){--_size:var(--ind-font-size-xs, 10px)}:host([size="md"]){--_size:var(--ind-font-size-sm, 11px)}:host([size="lg"]){--_size:var(--ind-font-size-base, 12px)}.unit{font-family:var(--ind-font-family-sans, system-ui, sans-serif);font-size:var(--_size);font-weight:var(--ind-font-weight-regular, 400);color:var(--ind-surface-text-muted, #7a8694);white-space:nowrap}`;const o=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.__attachShadow()}unit;size="md";render(){return t(i,{key:"a9e238538522e256db732662118527fdc2673283"},t("span",{key:"d5398ae306ff94e2f9ccfd608e9f28f03b749be7",class:"unit",part:"unit"},this.unit??t("slot",{key:"6791682a0b3ab6e537a7ad4dd321a5d279a3e38d"})))}static get style(){return a()}},[769,"ind-unit-label",{unit:[1],size:[513]}]);function r(){if(typeof customElements==="undefined"){return}const s=["ind-unit-label"];s.forEach((s=>{switch(s){case"ind-unit-label":if(!customElements.get(n(s))){customElements.define(n(s),o)}break}}))}r();const d=o;const f=r;export{d as IndUnitLabel,f as defineCustomElement};
+//# sourceMappingURL=ind-unit-label.js.map

package/dist/components/ind-unit-label.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["unitLabelCss","IndUnitLabel","__stencil_proxyCustomElement","HTMLElement","unit","size","render","h","Host","key","class","part","this"],"sources":["src/components/atoms/unit-label/unit-label.css?tag=ind-unit-label&encapsulation=shadow","src/components/atoms/unit-label/unit-label.tsx"],"sourcesContent":[":host {\n  display: inline;\n  --_size: var(--ind-font-size-sm, 11px);\n}\n\n:host([size=\"sm\"]) { --_size: var(--ind-font-size-xs, 10px); }\n:host([size=\"md\"]) { --_size: var(--ind-font-size-sm, 11px); }\n:host([size=\"lg\"]) { --_size: var(--ind-font-size-base, 12px); }\n\n.unit {\n  font-family: var(--ind-font-family-sans, system-ui, sans-serif);\n  font-size: var(--_size);\n  font-weight: var(--ind-font-weight-regular, 400);\n  color: var(--ind-surface-text-muted, #7a8694);\n  white-space: nowrap;\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type UnitLabelSize = 'sm' | 'md' | 'lg';\n\n@Component({\n  tag: 'ind-unit-label',\n  styleUrl: 'unit-label.css',\n  shadow: true,\n})\nexport class IndUnitLabel {\n  /** Engineering unit text, e.g. \"bar\", \"°C\", \"m³/h\". Falls back to the slot. */\n  @Prop() unit?: string;\n  /** Size. */\n  @Prop({ reflect: true }) size: UnitLabelSize = 'md';\n\n  render() {\n    return (\n      <Host>\n        <span class=\"unit\" part=\"unit\">\n          {this.unit ?? <slot />}\n        </span>\n      </Host>\n    );\n  }\n}\n"],"mappings":"2DAAA,MAAMA,EAAe,IAAM,ub,MCSdC,EAAYC,EAAA,MAAAD,UAAAE,E,iFAEfC,KAEiBC,KAAsB,KAE/C,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,2CAAMC,MAAM,OAAOC,KAAK,QACrBC,KAAKR,MAAQG,EAAA,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/components/ind-value.js

@@ -1,2 +1,2 @@
-import{p as a,H as e,h as r,a as n,t}from"./index.js";const i=()=>`:host{display:inline-flex;flex-direction:column;gap:var(--ind-spacing-2, 4px);padding:var(--ind-spacing-4, 8px) var(--ind-spacing-5, 12px);background:var(--ind-surface-sunken, #000);border:1px solid var(--ind-surface-border-default, #2a3340);border-radius:var(--ind-radius-md, 3px);font-family:var(--ind-font-family-sans);font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));min-width:96px;transition:background-color var(--ind-motion-duration-base, 200ms),     border-color var(--ind-motion-duration-base, 200ms),     color var(--ind-motion-duration-base, 200ms)}.header{display:flex;gap:var(--ind-spacing-3, 6px);align-items:baseline;font-size:var(--ind-font-size-sm, 11px);line-height:var(--ind-font-line-height-tight, 1.1);color:var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2))}.tag{font-family:var(--ind-font-family-mono);font-weight:var(--ind-font-weight-semibold, 600);letter-spacing:0.02em}.label{color:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0))}.readout{display:flex;align-items:baseline;gap:var(--ind-spacing-2, 4px);line-height:1}.number{font-family:var(--ind-font-family-mono);font-weight:var(--ind-font-weight-bold, 700);font-variant-numeric:tabular-nums}.unit{font-size:var(--ind-font-size-sm, 11px);color:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));font-weight:var(--ind-font-weight-medium, 500)}.trend{font-size:var(--ind-font-size-md, 13px);margin-left:var(--ind-spacing-2, 4px)}:host([size="sm"]) .number{font-size:var(--ind-font-size-xl, 16px)}:host([size="md"]) .number{font-size:var(--ind-font-size-2xl, 20px)}:host([size="lg"]) .number{font-size:var(--ind-font-size-3xl, 28px)}:host([alarm="high-high"]){background:var(--ind-alarm-high-high-bg, #dc2626);color:var(--ind-alarm-high-high-fg, #ffffff);border-color:var(--ind-alarm-high-high-border, #f87171)}:host([alarm="high"]){background:var(--ind-alarm-high-bg, #f59e0b);color:var(--ind-alarm-high-fg, #000000);border-color:var(--ind-alarm-high-border, #fcd34d)}:host([alarm="low"]){background:var(--ind-alarm-low-bg, #0891b2);color:var(--ind-alarm-low-fg, #ffffff);border-color:var(--ind-alarm-low-border, #22d3ee)}:host([alarm="low-low"]){background:var(--ind-alarm-low-low-bg, #7c3aed);color:var(--ind-alarm-low-low-fg, #ffffff);border-color:var(--ind-alarm-low-low-border, #a78bfa)}:host([alarm]:not([alarm="none"])) .header,:host([alarm]:not([alarm="none"])) .tag,:host([alarm]:not([alarm="none"])) .label,:host([alarm]:not([alarm="none"])) .unit{color:inherit}:host([alarm]:not([alarm="none"])) .label,:host([alarm]:not([alarm="none"])) .unit{opacity:0.85}:host([alarm]:not([alarm="none"])) .tag{opacity:1;font-weight:var(--ind-font-weight-bold, 700)}:host([trend="up"]) .trend{color:var(--ind-trend-up-fg, #fcd34d)}:host([trend="down"]) .trend{color:var(--ind-trend-down-fg, #22d3ee)}:host([trend="stable"]) .trend{color:var(--ind-trend-stable-fg, #8390a0)}`;const o=a(class a extends e{constructor(a){super();if(a!==false){this.__registerHost()}this.__attachShadow()}value;unit;precision;alarm="none";trend="none";size="md";label;tag;formatted(){if(typeof this.value==="string")return this.value;if(!Number.isFinite(this.value))return"--";if(this.precision!==undefined)return this.value.toFixed(this.precision);return String(this.value)}render(){const a=this.label??this.tag??"process value";const e=this.alarm!=="none"?`, alarm ${this.alarm}`:"";return r(n,{key:"cda5c03f956f161e618626d2aef0aac40409281a",role:"group","aria-label":`${a}: ${this.formatted()}${this.unit?" "+this.unit:""}${e}`,"aria-live":this.alarm==="high-high"?"assertive":"polite"},(this.tag||this.label)&&r("div",{key:"8fe9dfd6fb733e6ba0e7e607efc5d023736cca9e",class:"header",part:"header"},this.tag&&r("span",{key:"adec308000bce2cee378504fffedf8662a091c8c",class:"tag",part:"tag"},this.tag),this.label&&r("span",{key:"4de4405dfbb798ca1781ade6fd7e1419089226ca",class:"label",part:"label"},this.label)),r("div",{key:"b7f9e66b333a6d7e3341585af4bba571dae65bf6",class:"readout",part:"readout"},r("span",{key:"c6a942f2a64187cf9acd75b112d262928556d84b",class:"number",part:"number"},this.formatted()),this.unit&&r("span",{key:"39714e17d50497d59afe6e81eca9b51cf2182332",class:"unit",part:"unit"},this.unit),this.trend!=="none"&&r("span",{key:"1e4f671cc86bf24617f26e3db4eb3709160291b3",class:"trend",part:"trend","aria-hidden":"true"},this.trend==="up"?"▲":this.trend==="down"?"▼":"◆")))}static get style(){return i()}},[513,"ind-value",{value:[8],unit:[1],precision:[2],alarm:[513],trend:[513],size:[513],label:[1],tag:[1]}]);function s(){if(typeof customElements==="undefined"){return}const a=["ind-value"];a.forEach((a=>{switch(a){case"ind-value":if(!customElements.get(t(a))){customElements.define(t(a),o)}break}}))}s();const d=o;const l=s;export{d as IndValue,l as defineCustomElement};
+import{I as s,d as o}from"./p-BInyhy9s.js";const t=s;const n=o;export{t as IndValue,n as defineCustomElement};
 //# sourceMappingURL=ind-value.js.map

package/dist/components/ind-value.js.map

@@ -1 +1 @@
-{"version":3,"names":["valueCss","IndValue","__stencil_proxyCustomElement","HTMLElement","value","unit","precision","alarm","trend","size","label","tag","formatted","this","Number","isFinite","undefined","toFixed","String","render","accessibleName","alarmSuffix","h","Host","key","role","class","part"],"sources":["src/components/atoms/value/value.css?tag=ind-value&encapsulation=shadow","src/components/atoms/value/value.tsx"],"sourcesContent":[":host {\n  display: inline-flex;\n  flex-direction: column;\n  gap: var(--ind-spacing-2, 4px);\n  padding: var(--ind-spacing-4, 8px) var(--ind-spacing-5, 12px);\n  background: var(--ind-surface-sunken, #000);\n  border: 1px solid var(--ind-surface-border-default, #2a3340);\n  border-radius: var(--ind-radius-md, 3px);\n  font-family: var(--ind-font-family-sans);\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n  min-width: 96px;\n  transition:\n    background-color var(--ind-motion-duration-base, 200ms),\n    border-color var(--ind-motion-duration-base, 200ms),\n    color var(--ind-motion-duration-base, 200ms);\n}\n\n.header {\n  display: flex;\n  gap: var(--ind-spacing-3, 6px);\n  align-items: baseline;\n  font-size: var(--ind-font-size-sm, 11px);\n  line-height: var(--ind-font-line-height-tight, 1.1);\n  color: var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));\n}\n\n.tag {\n  font-family: var(--ind-font-family-mono);\n  font-weight: var(--ind-font-weight-semibold, 600);\n  letter-spacing: 0.02em;\n}\n\n.label {\n  color: var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));\n}\n\n.readout {\n  display: flex;\n  align-items: baseline;\n  gap: var(--ind-spacing-2, 4px);\n  line-height: 1;\n}\n\n.number {\n  font-family: var(--ind-font-family-mono);\n  font-weight: var(--ind-font-weight-bold, 700);\n  font-variant-numeric: tabular-nums;\n}\n\n.unit {\n  font-size: var(--ind-font-size-sm, 11px);\n  color: var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));\n  font-weight: var(--ind-font-weight-medium, 500);\n}\n\n.trend {\n  font-size: var(--ind-font-size-md, 13px);\n  margin-left: var(--ind-spacing-2, 4px);\n}\n\n:host([size=\"sm\"]) .number { font-size: var(--ind-font-size-xl, 16px); }\n:host([size=\"md\"]) .number { font-size: var(--ind-font-size-2xl, 20px); }\n:host([size=\"lg\"]) .number { font-size: var(--ind-font-size-3xl, 28px); }\n\n/* Alarm highlight — uses the ISA-18.2 alarm tokens directly. */\n:host([alarm=\"high-high\"]) {\n  background: var(--ind-alarm-high-high-bg, #dc2626);\n  color: var(--ind-alarm-high-high-fg, #ffffff);\n  border-color: var(--ind-alarm-high-high-border, #f87171);\n}\n:host([alarm=\"high\"]) {\n  background: var(--ind-alarm-high-bg, #f59e0b);\n  color: var(--ind-alarm-high-fg, #000000);\n  border-color: var(--ind-alarm-high-border, #fcd34d);\n}\n:host([alarm=\"low\"]) {\n  background: var(--ind-alarm-low-bg, #0891b2);\n  color: var(--ind-alarm-low-fg, #ffffff);\n  border-color: var(--ind-alarm-low-border, #22d3ee);\n}\n:host([alarm=\"low-low\"]) {\n  background: var(--ind-alarm-low-low-bg, #7c3aed);\n  color: var(--ind-alarm-low-low-fg, #ffffff);\n  border-color: var(--ind-alarm-low-low-border, #a78bfa);\n}\n\n/* When in an alarm state, force every descendant to inherit the host color\n * (which is the high-contrast alarm fg, e.g. black on amber for \"high\").\n *\n * We have to override `.header` explicitly because it sets its own color —\n * otherwise `.label` and `.tag` inherit *from .header*, not from :host,\n * and stay at the original muted neutral color (broken contrast on alarm bg).\n */\n:host([alarm]:not([alarm=\"none\"])) .header,\n:host([alarm]:not([alarm=\"none\"])) .tag,\n:host([alarm]:not([alarm=\"none\"])) .label,\n:host([alarm]:not([alarm=\"none\"])) .unit {\n  color: inherit;\n}\n\n/* The tag identifies WHICH instrument is alarming — keep it at full opacity\n * so operators can read it at a glance. Label/unit can be slightly faded. */\n:host([alarm]:not([alarm=\"none\"])) .label,\n:host([alarm]:not([alarm=\"none\"])) .unit {\n  opacity: 0.85;\n}\n:host([alarm]:not([alarm=\"none\"])) .tag {\n  opacity: 1;\n  font-weight: var(--ind-font-weight-bold, 700);\n}\n\n:host([trend=\"up\"])     .trend { color: var(--ind-trend-up-fg, #fcd34d); }\n:host([trend=\"down\"])   .trend { color: var(--ind-trend-down-fg, #22d3ee); }\n:host([trend=\"stable\"]) .trend { color: var(--ind-trend-stable-fg, #8390a0); }\n","import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type ValueAlarm = 'none' | 'low-low' | 'low' | 'high' | 'high-high';\nexport type ValueTrend = 'none' | 'up' | 'down' | 'stable';\nexport type ValueSize = 'sm' | 'md' | 'lg';\n\n@Component({\n  tag: 'ind-value',\n  styleUrl: 'value.css',\n  shadow: true,\n})\nexport class IndValue {\n  /** Raw value to display. Numeric values are formatted with `precision`. */\n  @Prop() value!: number | string;\n\n  /** Engineering unit shown after the number (e.g. \"bar\", \"°C\", \"m³/h\"). */\n  @Prop() unit?: string;\n\n  /** Decimal places when `value` is numeric. Default: as-is. */\n  @Prop() precision?: number;\n\n  /** Active alarm priority. Highlights the readout with the ISA-18.2 color. */\n  @Prop({ reflect: true }) alarm: ValueAlarm = 'none';\n\n  /** Process trend direction. Renders a small arrow next to the unit. */\n  @Prop({ reflect: true }) trend: ValueTrend = 'none';\n\n  /** Readout size — `lg` is appropriate for primary KPIs (uses the 3xl font). */\n  @Prop({ reflect: true }) size: ValueSize = 'md';\n\n  /** Human label shown above the number (e.g. \"Discharge pressure\"). */\n  @Prop() label?: string;\n\n  /** Equipment tag shown above the number (e.g. \"PT-101\"). */\n  @Prop() tag?: string;\n\n  private formatted(): string {\n    if (typeof this.value === 'string') return this.value;\n    if (!Number.isFinite(this.value)) return '--';\n    if (this.precision !== undefined) return this.value.toFixed(this.precision);\n    return String(this.value);\n  }\n\n  render() {\n    const accessibleName = this.label ?? this.tag ?? 'process value';\n    const alarmSuffix = this.alarm !== 'none' ? `, alarm ${this.alarm}` : '';\n    return (\n      <Host\n        role=\"group\"\n        aria-label={`${accessibleName}: ${this.formatted()}${this.unit ? ' ' + this.unit : ''}${alarmSuffix}`}\n        aria-live={this.alarm === 'high-high' ? 'assertive' : 'polite'}\n      >\n        {(this.tag || this.label) && (\n          <div class=\"header\" part=\"header\">\n            {this.tag && <span class=\"tag\" part=\"tag\">{this.tag}</span>}\n            {this.label && <span class=\"label\" part=\"label\">{this.label}</span>}\n          </div>\n        )}\n        <div class=\"readout\" part=\"readout\">\n          <span class=\"number\" part=\"number\">{this.formatted()}</span>\n          {this.unit && <span class=\"unit\" part=\"unit\">{this.unit}</span>}\n          {this.trend !== 'none' && (\n            <span class=\"trend\" part=\"trend\" aria-hidden=\"true\">\n              {this.trend === 'up' ? '▲' : this.trend === 'down' ? '▼' : '◆'}\n            </span>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sDAAA,MAAMA,EAAW,IAAM,u5F,MCWVC,EAAQC,EAAA,MAAAD,UAAAE,E,iFAEXC,MAGAC,KAGAC,UAGiBC,MAAoB,OAGpBC,MAAoB,OAGpBC,KAAkB,KAGnCC,MAGAC,IAEA,SAAAC,GACN,UAAWC,KAAKT,QAAU,SAAU,OAAOS,KAAKT,MAChD,IAAKU,OAAOC,SAASF,KAAKT,OAAQ,MAAO,KACzC,GAAIS,KAAKP,YAAcU,UAAW,OAAOH,KAAKT,MAAMa,QAAQJ,KAAKP,WACjE,OAAOY,OAAOL,KAAKT,M,CAGrB,MAAAe,GACE,MAAMC,EAAiBP,KAAKH,OAASG,KAAKF,KAAO,gBACjD,MAAMU,EAAcR,KAAKN,QAAU,OAAS,WAAWM,KAAKN,QAAU,GACtE,OACEe,EAACC,EAAI,CAAAC,IAAA,2CACHC,KAAK,QAAO,aACA,GAAGL,MAAmBP,KAAKD,cAAcC,KAAKR,KAAO,IAAMQ,KAAKR,KAAO,KAAKgB,IAAa,YAC1FR,KAAKN,QAAU,YAAc,YAAc,WAEpDM,KAAKF,KAAOE,KAAKH,QACjBY,EAAA,OAAAE,IAAA,2CAAKE,MAAM,SAASC,KAAK,UACtBd,KAAKF,KAAOW,EAAA,QAAAE,IAAA,2CAAME,MAAM,MAAMC,KAAK,OAAOd,KAAKF,KAC/CE,KAAKH,OAASY,EAAA,QAAAE,IAAA,2CAAME,MAAM,QAAQC,KAAK,SAASd,KAAKH,QAG1DY,EAAA,OAAAE,IAAA,2CAAKE,MAAM,UAAUC,KAAK,WACxBL,EAAA,QAAAE,IAAA,2CAAME,MAAM,SAASC,KAAK,UAAUd,KAAKD,aACxCC,KAAKR,MAAQiB,EAAA,QAAAE,IAAA,2CAAME,MAAM,OAAOC,KAAK,QAAQd,KAAKR,MAClDQ,KAAKL,QAAU,QACdc,EAAA,QAAAE,IAAA,2CAAME,MAAM,QAAQC,KAAK,QAAO,cAAa,QAC1Cd,KAAKL,QAAU,KAAO,IAAMK,KAAKL,QAAU,OAAS,IAAM,M","ignoreList":[]}
+{"version":3,"names":[],"sources":[],"mappings":"","ignoreList":[]}

package/dist/components/ind-valve-card.d.ts

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

package/dist/components/ind-valve-card.js

@@ -0,0 +1,2 @@
+import{I as o,d as s}from"./p-WD-5DMF4.js";const t=o;const p=s;export{t as IndValveCard,p as defineCustomElement};
+//# sourceMappingURL=ind-valve-card.js.map

package/dist/components/ind-valve-card.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":[],"mappings":"","ignoreList":[]}

package/dist/components/ind-valve-control-panel.d.ts

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

package/dist/components/ind-valve-control-panel.js

@@ -0,0 +1,2 @@
+import{p as e,H as a,c as n,h as i,a as t,t as d}from"./index.js";import{d as s}from"./p-CRSC4h1X.js";import{d as o}from"./p-Ca70rR-o.js";import{d as r}from"./p-CNo94Sf0.js";import{d as l}from"./p-D3gnEPFv.js";import{d as c}from"./p-DGb-eiYo.js";import{d as p}from"./p-BInyhy9s.js";import{d as f}from"./p-Dp1wiEsR.js";import{d as b}from"./p-WD-5DMF4.js";const m=()=>`: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 u=()=>`.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 v=()=>`:host{min-width:280px}.panel-body>ind-speed-control{border:0;padding:0;background:transparent;min-width:0}`;const g=e(class e extends a{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.indOpen=n(this,"indOpen");this.indClose=n(this,"indClose");this.indStop=n(this,"indStop");this.indPosition=n(this,"indPosition")}heading="Valve";tag;state="closed";position;modulating=false;positionSetpoint=0;indOpen;indClose;indStop;indPosition;onPosition=e=>{e.stopPropagation();this.positionSetpoint=e.detail;this.indPosition.emit(e.detail)};render(){return i(t,{key:"74b95bc52371eaf3cf2f9c6fc8dac870f9d0a924"},i("div",{key:"8eb914ce80e6ecec77ca7d90701c7b8740c7a88d",class:"panel-head"},i("div",{key:"039a4ddd60abd0fac126532f7fee460520133f19",class:"panel-titles"},i("span",{key:"54b8fe643cfda21aac90342cd4b410dcbf0dffd8",class:"panel-title",part:"heading"},this.heading),this.tag&&i("span",{key:"d68d221bd943d800eb4769f4508f1286d66d9807",class:"panel-subtitle"},this.tag))),i("div",{key:"8c48ba95fefb7786345402d7dabfdfb9295ba72c",class:"panel-body"},i("ind-valve-card",{key:"980a0022a24169b5b61ea84eb3b8bb0eef4e4b5a",tag:this.tag,label:this.heading,state:this.state,position:this.position}),i("ind-command-group",{key:"21c3046744b5bdbceeefc6e8923427eb78d485e1",label:"Valve commands"},i("ind-button",{key:"f4a1689c2a5d40b6c784db28e1c4e22ca95ab2dd",variant:"primary",size:"sm",label:"Open",disabled:this.state==="open",onIndActivate:()=>this.indOpen.emit()}),i("ind-button",{key:"8cb97ed73c20e47aab7c0a489a0efe02afa30f7c",variant:"default",size:"sm",label:"Stop",onIndActivate:()=>this.indStop.emit()}),i("ind-button",{key:"9e9977fa80e7b587dd72c292bdb43e92cf2c817c",variant:"danger",size:"sm",label:"Close",disabled:this.state==="closed",onIndActivate:()=>this.indClose.emit()})),this.modulating&&i("ind-speed-control",{key:"d18050f458cac0757676b87cbcd0d9db816ba94a",label:"Position setpoint",value:this.positionSetpoint,unit:"%",onIndChange:this.onPosition})))}static get style(){return m()+(u()+v())}},[513,"ind-valve-control-panel",{heading:[1],tag:[1],state:[513],position:[2],modulating:[4],positionSetpoint:[1026,"position-setpoint"]}]);function h(){if(typeof customElements==="undefined"){return}const e=["ind-valve-control-panel","ind-button","ind-command-group","ind-knob","ind-slider","ind-speed-control","ind-value","ind-valve","ind-valve-card"];e.forEach((e=>{switch(e){case"ind-valve-control-panel":if(!customElements.get(d(e))){customElements.define(d(e),g)}break;case"ind-button":if(!customElements.get(d(e))){s()}break;case"ind-command-group":if(!customElements.get(d(e))){o()}break;case"ind-knob":if(!customElements.get(d(e))){r()}break;case"ind-slider":if(!customElements.get(d(e))){l()}break;case"ind-speed-control":if(!customElements.get(d(e))){c()}break;case"ind-value":if(!customElements.get(d(e))){p()}break;case"ind-valve":if(!customElements.get(d(e))){f()}break;case"ind-valve-card":if(!customElements.get(d(e))){b()}break}}))}h();const x=g;const y=h;export{x as IndValveControlPanel,y as defineCustomElement};
+//# sourceMappingURL=ind-valve-control-panel.js.map

package/dist/components/ind-valve-control-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["panelCss","controlPanelCss","valveControlPanelCss","IndValveControlPanel","__stencil_proxyCustomElement","HTMLElement","heading","tag","state","position","modulating","positionSetpoint","indOpen","indClose","indStop","indPosition","onPosition","e","stopPropagation","this","detail","emit","render","h","Host","key","class","part","label","variant","size","disabled","onIndActivate","value","unit","onIndChange"],"sources":["src/components/organisms/_shared/panel.css?tag=ind-valve-control-panel&encapsulation=shadow","src/components/organisms/_shared/control-panel.css?tag=ind-valve-control-panel&encapsulation=shadow","src/components/organisms/valve-control-panel/valve-control-panel.css?tag=ind-valve-control-panel&encapsulation=shadow","src/components/organisms/valve-control-panel/valve-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\n.panel-body > ind-speed-control {\n  border: 0;\n  padding: 0;\n  background: transparent;\n  min-width: 0;\n}\n","import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\nimport type { ValveState } from '../../atoms/valve/valve';\n\n/**\n * Valve control panel: `<ind-valve-card>` faceplate plus Open / Close / Stop\n * commands and an optional position setpoint for modulating valves.\n */\n@Component({\n  tag: 'ind-valve-control-panel',\n  styleUrls: ['../_shared/panel.css', '../_shared/control-panel.css', 'valve-control-panel.css'],\n  shadow: true,\n})\nexport class IndValveControlPanel {\n  @Prop() heading: string = 'Valve';\n  @Prop() tag?: string;\n  @Prop({ reflect: true }) state: ValveState = 'closed';\n  /** Current position 0–100 %. Omit for on/off valves. */\n  @Prop() position?: number;\n  /** Allow position control (modulating valve). */\n  @Prop() modulating: boolean = false;\n  /** Position setpoint (two-way). */\n  @Prop({ mutable: true }) positionSetpoint: number = 0;\n\n  @Event() indOpen!: EventEmitter<void>;\n  @Event() indClose!: EventEmitter<void>;\n  @Event() indStop!: EventEmitter<void>;\n  @Event() indPosition!: EventEmitter<number>;\n\n  private onPosition = (e: CustomEvent<number>) => {\n    e.stopPropagation();\n    this.positionSetpoint = e.detail;\n    this.indPosition.emit(e.detail);\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class=\"panel-head\">\n          <div class=\"panel-titles\">\n            <span class=\"panel-title\" part=\"heading\">{this.heading}</span>\n            {this.tag && <span class=\"panel-subtitle\">{this.tag}</span>}\n          </div>\n        </div>\n        <div class=\"panel-body\">\n          <ind-valve-card tag={this.tag} label={this.heading} state={this.state} position={this.position} />\n          <ind-command-group label=\"Valve commands\">\n            <ind-button variant=\"primary\" size=\"sm\" label=\"Open\" disabled={this.state === 'open'} onIndActivate={() => this.indOpen.emit()} />\n            <ind-button variant=\"default\" size=\"sm\" label=\"Stop\" onIndActivate={() => this.indStop.emit()} />\n            <ind-button variant=\"danger\" size=\"sm\" label=\"Close\" disabled={this.state === 'closed'} onIndActivate={() => this.indClose.emit()} />\n          </ind-command-group>\n          {this.modulating && (\n            <ind-speed-control label=\"Position setpoint\" value={this.positionSetpoint} unit=\"%\" onIndChange={this.onPosition} />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kWAAA,MAAMA,EAAW,IAAM,4zDCAvB,MAAMC,EAAkB,IAAM,ySCA9B,MAAMC,EAAuB,IAAM,6G,MCYtBC,EAAoBC,EAAA,MAAAD,UAAAE,E,uNACvBC,QAAkB,QAClBC,IACiBC,MAAoB,SAErCC,SAEAC,WAAsB,MAELC,iBAA2B,EAE3CC,QACAC,SACAC,QACAC,YAEDC,WAAcC,IACpBA,EAAEC,kBACFC,KAAKR,iBAAmBM,EAAEG,OAC1BD,KAAKJ,YAAYM,KAAKJ,EAAEG,OAAO,EAGjC,MAAAE,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,cACTH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,gBACTH,EAAA,QAAAE,IAAA,2CAAMC,MAAM,cAAcC,KAAK,WAAWR,KAAKb,SAC9Ca,KAAKZ,KAAOgB,EAAA,QAAAE,IAAA,2CAAMC,MAAM,kBAAkBP,KAAKZ,OAGpDgB,EAAA,OAAAE,IAAA,2CAAKC,MAAM,cACTH,EAAA,kBAAAE,IAAA,2CAAgBlB,IAAKY,KAAKZ,IAAKqB,MAAOT,KAAKb,QAASE,MAAOW,KAAKX,MAAOC,SAAUU,KAAKV,WACtFc,EAAA,qBAAAE,IAAA,2CAAmBG,MAAM,kBACvBL,EAAA,cAAAE,IAAA,2CAAYI,QAAQ,UAAUC,KAAK,KAAKF,MAAM,OAAOG,SAAUZ,KAAKX,QAAU,OAAQwB,cAAe,IAAMb,KAAKP,QAAQS,SACxHE,EAAA,cAAAE,IAAA,2CAAYI,QAAQ,UAAUC,KAAK,KAAKF,MAAM,OAAOI,cAAe,IAAMb,KAAKL,QAAQO,SACvFE,EAAA,cAAAE,IAAA,2CAAYI,QAAQ,SAASC,KAAK,KAAKF,MAAM,QAAQG,SAAUZ,KAAKX,QAAU,SAAUwB,cAAe,IAAMb,KAAKN,SAASQ,UAE5HF,KAAKT,YACJa,EAAA,qBAAAE,IAAA,2CAAmBG,MAAM,oBAAoBK,MAAOd,KAAKR,iBAAkBuB,KAAK,IAAIC,YAAahB,KAAKH,c","ignoreList":[]}

package/dist/components/ind-valve.js

@@ -1,2 +1,2 @@
-import{p as t,H as a,h as e,a as s,t as i}from"./index.js";const r=()=>`:host{display:inline-flex;flex-direction:column;align-items:center;gap:var(--ind-spacing-2, 4px);font-family:var(--ind-font-family-sans);font-size:var(--ind-font-size-base, 12px);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1)}.symbol{--_w:var(--ind-valve-width, 48px);--_fill:var(--ind-state-stopped-bg, #5a6776);--_stroke:var(--ind-state-stopped-border, #8390a0);width:var(--_w);height:calc(var(--_w) / 2);display:block}:host([orientation="vertical"]) .symbol{transform:rotate(90deg)}:host([size="sm"]) .symbol{--_w:32px}:host([size="md"]) .symbol{--_w:48px}:host([size="lg"]) .symbol{--_w:72px}.left,.right{fill:var(--_fill);stroke:var(--_stroke);stroke-width:1.25;stroke-linejoin:round;transition:fill var(--ind-motion-duration-base, 200ms),     stroke var(--ind-motion-duration-base, 200ms)}.stem{stroke:var(--_stroke);stroke-width:2;stroke-linecap:round}:host([state="open"]) .symbol{--_fill:var(--ind-state-running-bg, #16a34a);--_stroke:var(--ind-state-running-border, #4ade80)}:host([state="closed"]) .symbol{--_fill:var(--ind-state-stopped-bg, #5a6776);--_stroke:var(--ind-state-stopped-border, #8390a0)}:host([state="fault"]) .symbol{--_fill:var(--ind-state-fault-bg, #dc2626);--_stroke:var(--ind-state-fault-border, #f87171)}:host([state="transit"]) .symbol{--_fill:var(--ind-state-warning-bg, #f59e0b);--_stroke:var(--ind-state-warning-border, #fcd34d)}:host([state="transit"]) .left,:host([state="transit"]) .right{stroke-dasharray:4 2;animation:ind-valve-march var(--ind-motion-blink-slow, 1000ms) linear infinite}@keyframes ind-valve-march{to{stroke-dashoffset:-6}}.caption{display:flex;gap:var(--ind-spacing-3, 6px);align-items:baseline;font-size:var(--ind-font-size-sm, 11px)}.tag{font-family:var(--ind-font-family-mono);font-weight:var(--ind-font-weight-semibold, 600)}.label{color:var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0))}@media (prefers-reduced-motion: reduce){:host([state="transit"]) .left,:host([state="transit"]) .right{animation:none;stroke-dasharray:4 2}}`;const n=t(class t extends a{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow()}state="closed";orientation="horizontal";size="md";label;tag;render(){const t=this.label??this.tag??"valve";return e(s,{key:"f0a9a4f7a1401c7ffc091bb10e52d13854e0fd42",role:"img","aria-label":`${t} — ${this.state}`},e("svg",{key:"1ba7a6466df31802d8ca141016670c6c301bc066",class:"symbol",part:"symbol",viewBox:"0 0 32 16","aria-hidden":"true"},e("polygon",{key:"89f77217a84e53606ce38e126c8ce87358fafb8b",class:"left",part:"left",points:"2,2 2,14 16,8"}),e("polygon",{key:"12ca5cd5ad1c117c48cc54275fe98509daba3267",class:"right",part:"right",points:"30,2 30,14 16,8"}),e("line",{key:"24510448beca41c7ab421b61c06de63840bddf99",class:"stem",part:"stem",x1:"16",y1:"2",x2:"16",y2:"14"})),(this.tag||this.label)&&e("div",{key:"18b6f7a60c0fdb8b5b7a688d5f6151811a9d587b",class:"caption",part:"caption"},this.tag&&e("span",{key:"7a8eb4c486380e3cb1a92e1ab3bdcbd2689cbd50",class:"tag",part:"tag"},this.tag),this.label&&e("span",{key:"6281ca7b4ae18e455a28b18890d28c58f38c14c1",class:"label",part:"label"},this.label)))}static get style(){return r()}},[513,"ind-valve",{state:[513],orientation:[513],size:[513],label:[1],tag:[1]}]);function o(){if(typeof customElements==="undefined"){return}const t=["ind-valve"];t.forEach((t=>{switch(t){case"ind-valve":if(!customElements.get(i(t))){customElements.define(i(t),n)}break}}))}o();const l=n;const d=o;export{l as IndValve,d as defineCustomElement};
+import{I as s,d as o}from"./p-Dp1wiEsR.js";const p=s;const t=o;export{p as IndValve,t as defineCustomElement};
 //# sourceMappingURL=ind-valve.js.map

package/dist/components/ind-valve.js.map

@@ -1 +1 @@
-{"version":3,"names":["valveCss","IndValve","__stencil_proxyCustomElement","HTMLElement","state","orientation","size","label","tag","render","name","this","h","Host","key","role","class","part","viewBox","points","x1","y1","x2","y2"],"sources":["src/components/atoms/valve/valve.css?tag=ind-valve&encapsulation=shadow","src/components/atoms/valve/valve.tsx"],"sourcesContent":[":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);\n  font-size: var(--ind-font-size-base, 12px);\n  /* `light-dark()` makes the fallback adapt to the page's color-scheme so the\n   * caption stays readable even if the atom lands on a surface whose theme\n   * doesn't match the loaded tokens (e.g. Storybook autodocs on white). */\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n}\n\n.symbol {\n  --_w: var(--ind-valve-width, 48px);\n  --_fill:   var(--ind-state-stopped-bg, #5a6776);\n  --_stroke: var(--ind-state-stopped-border, #8390a0);\n\n  width: var(--_w);\n  height: calc(var(--_w) / 2);\n  display: block;\n}\n\n:host([orientation=\"vertical\"]) .symbol {\n  transform: rotate(90deg);\n}\n\n:host([size=\"sm\"]) .symbol { --_w: 32px; }\n:host([size=\"md\"]) .symbol { --_w: 48px; }\n:host([size=\"lg\"]) .symbol { --_w: 72px; }\n\n.left,\n.right {\n  fill: var(--_fill);\n  stroke: var(--_stroke);\n  stroke-width: 1.25;\n  stroke-linejoin: round;\n  transition:\n    fill var(--ind-motion-duration-base, 200ms),\n    stroke var(--ind-motion-duration-base, 200ms);\n}\n\n.stem {\n  stroke: var(--_stroke);\n  stroke-width: 2;\n  stroke-linecap: round;\n}\n\n:host([state=\"open\"]) .symbol {\n  --_fill:   var(--ind-state-running-bg, #16a34a);\n  --_stroke: var(--ind-state-running-border, #4ade80);\n}\n:host([state=\"closed\"]) .symbol {\n  --_fill:   var(--ind-state-stopped-bg, #5a6776);\n  --_stroke: var(--ind-state-stopped-border, #8390a0);\n}\n:host([state=\"fault\"]) .symbol {\n  --_fill:   var(--ind-state-fault-bg, #dc2626);\n  --_stroke: var(--ind-state-fault-border, #f87171);\n}\n:host([state=\"transit\"]) .symbol {\n  --_fill:   var(--ind-state-warning-bg, #f59e0b);\n  --_stroke: var(--ind-state-warning-border, #fcd34d);\n}\n\n/* Transit: marching ants on the perimeter — universally read as\n * \"in motion / transitioning\" by control room operators. */\n:host([state=\"transit\"]) .left,\n:host([state=\"transit\"]) .right {\n  stroke-dasharray: 4 2;\n  animation: ind-valve-march var(--ind-motion-blink-slow, 1000ms) linear infinite;\n}\n\n@keyframes ind-valve-march {\n  to { stroke-dashoffset: -6; }\n}\n\n.caption {\n  display: flex;\n  gap: var(--ind-spacing-3, 6px);\n  align-items: baseline;\n  font-size: var(--ind-font-size-sm, 11px);\n}\n\n.tag {\n  font-family: var(--ind-font-family-mono);\n  font-weight: var(--ind-font-weight-semibold, 600);\n}\n\n.label {\n  color: var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));\n}\n\n@media (prefers-reduced-motion: reduce) {\n  :host([state=\"transit\"]) .left,\n  :host([state=\"transit\"]) .right {\n    animation: none;\n    stroke-dasharray: 4 2;\n  }\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type ValveState = 'open' | 'closed' | 'transit' | 'fault';\nexport type ValveOrientation = 'horizontal' | 'vertical';\nexport type ValveSize = 'sm' | 'md' | 'lg';\n\n@Component({\n  tag: 'ind-valve',\n  styleUrl: 'valve.css',\n  shadow: true,\n})\nexport class IndValve {\n  /** Valve state. `transit` is mid-stroke (transitioning between open and closed). */\n  @Prop({ reflect: true }) state: ValveState = 'closed';\n\n  /** Render the symbol along the flow direction. */\n  @Prop({ reflect: true }) orientation: ValveOrientation = 'horizontal';\n\n  /** Visual size. */\n  @Prop({ reflect: true }) size: ValveSize = 'md';\n\n  /** Human label rendered as caption (e.g. \"Discharge valve\"). */\n  @Prop() label?: string;\n\n  /** Equipment tag rendered as caption (e.g. \"V-12\"). */\n  @Prop() tag?: string;\n\n  render() {\n    const name = this.label ?? this.tag ?? 'valve';\n    return (\n      <Host\n        role=\"img\"\n        aria-label={`${name} — ${this.state}`}\n      >\n        {/* ISA-5.1 bowtie symbol. ViewBox is 32×16 so the natural ratio is 2:1. */}\n        <svg class=\"symbol\" part=\"symbol\" viewBox=\"0 0 32 16\" aria-hidden=\"true\">\n          <polygon class=\"left\"  part=\"left\"  points=\"2,2 2,14 16,8\" />\n          <polygon class=\"right\" part=\"right\" points=\"30,2 30,14 16,8\" />\n          <line    class=\"stem\"  part=\"stem\"  x1=\"16\" y1=\"2\" x2=\"16\" y2=\"14\" />\n        </svg>\n        {(this.tag || this.label) && (\n          <div class=\"caption\" part=\"caption\">\n            {this.tag && <span class=\"tag\" part=\"tag\">{this.tag}</span>}\n            {this.label && <span class=\"label\" part=\"label\">{this.label}</span>}\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"2DAAA,MAAMA,EAAW,IAAM,wiE,MCWVC,EAAQC,EAAA,MAAAD,UAAAE,E,iFAEMC,MAAoB,SAGpBC,YAAgC,aAGhCC,KAAkB,KAGnCC,MAGAC,IAER,MAAAC,GACE,MAAMC,EAAOC,KAAKJ,OAASI,KAAKH,KAAO,QACvC,OACEI,EAACC,EAAI,CAAAC,IAAA,2CACHC,KAAK,MAAK,aACE,GAAGL,OAAUC,KAAKP,SAG9BQ,EAAA,OAAAE,IAAA,2CAAKE,MAAM,SAASC,KAAK,SAASC,QAAQ,YAAW,cAAa,QAChEN,EAAA,WAAAE,IAAA,2CAASE,MAAM,OAAQC,KAAK,OAAQE,OAAO,kBAC3CP,EAAA,WAAAE,IAAA,2CAASE,MAAM,QAAQC,KAAK,QAAQE,OAAO,oBAC3CP,EAAA,QAAAE,IAAA,2CAASE,MAAM,OAAQC,KAAK,OAAQG,GAAG,KAAKC,GAAG,IAAIC,GAAG,KAAKC,GAAG,SAE9DZ,KAAKH,KAAOG,KAAKJ,QACjBK,EAAA,OAAAE,IAAA,2CAAKE,MAAM,UAAUC,KAAK,WACvBN,KAAKH,KAAOI,EAAA,QAAAE,IAAA,2CAAME,MAAM,MAAMC,KAAK,OAAON,KAAKH,KAC/CG,KAAKJ,OAASK,EAAA,QAAAE,IAAA,2CAAME,MAAM,QAAQC,KAAK,SAASN,KAAKJ,Q","ignoreList":[]}
+{"version":3,"names":[],"sources":[],"mappings":"","ignoreList":[]}

package/dist/components/ind-workstation-monitor.d.ts

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

package/dist/components/ind-workstation-monitor.js

@@ -0,0 +1,2 @@
+import{p as e,H as a,h as i,a as t,t as n}from"./index.js";import{d as s}from"./p-D79nNJVt.js";import{d}from"./p-D-FsSjAC.js";import{d as r}from"./p-BInyhy9s.js";const o=()=>`: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 c=()=>`:host{min-width:320px}ind-progress{width:100%}.job{display:flex;align-items:baseline;gap:var(--ind-spacing-3, 6px)}.job-label{font-size:var(--ind-font-size-xs, 10px);text-transform:uppercase;letter-spacing:0.06em;color:var(--ind-surface-text-muted)}.job-name{font-size:var(--ind-font-size-md, 13px);font-weight:var(--ind-font-weight-semibold, 600)}.figures{display:flex;gap:var(--ind-spacing-7, 20px)}`;const l=e(class e extends a{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow()}heading="Workstation";station;operator;job;state="unknown";produced=0;rejected=0;target;render(){const e=this.state==="unknown"?"neutral":this.state;const a=this.target?Math.min(100,this.produced/this.target*100):undefined;return i(t,{key:"3042387aab261c601e8fae021d9de8108ef1b751"},i("div",{key:"72dd0b1789eaadef3818056688ac612cc33d28cd",class:"panel-head"},i("ind-status-dot",{key:"148cb8a09100f76e1983a55a4eea037e5f428c83",state:e,size:"md"}),i("div",{key:"f0d61a7876169d7a3c56bf71570087c46d0a727c",class:"panel-titles"},i("span",{key:"058b303344dff73cb12ba6d5816d9ce93104a243",class:"panel-title",part:"heading"},this.heading,this.station?` · ${this.station}`:""),this.operator&&i("span",{key:"0740383db6db47bd0f40dbab0b130c61dbb19c7e",class:"panel-subtitle"},"Operator: ",this.operator))),i("div",{key:"8965c44f49adf59d4d0eb669162d0c7a7d110546",class:"panel-body"},this.job&&i("div",{key:"7c3a5b63e1342a4c7032d014511ed50fa162f82e",class:"job",part:"job"},i("span",{key:"3e72a454ab981f49ce22610babb3333770eda389",class:"job-label"},"Job"),i("span",{key:"923b7a3833b50ca1f04c14fc2c68d0b771230408",class:"job-name"},this.job)),i("div",{key:"6524d5b7481463bc19f41b3fc44cecab08600789",class:"figures",part:"figures"},i("ind-value",{key:"e8fef2d434b95122645e40c70498f3d5f811302b",value:this.produced,label:"Produced",size:"lg"}),i("ind-value",{key:"ee3011ffd166646361a0c728f26d5dc2f5952439",value:this.rejected,label:"Rejected",alarm:this.rejected>0?"high":"none",size:"md"}),this.target!==undefined&&i("ind-value",{key:"ba782302d9ceb5ec0b25bdea3077973a41fcf77a",value:this.target,label:"Target",size:"md"})),a!==undefined&&i("ind-progress",{key:"b0c35cce15e739653d6f1b0bd217da85c8e33c8d",value:a,max:100,variant:"success",size:"md","show-value":true})))}static get style(){return o()+c()}},[513,"ind-workstation-monitor",{heading:[1],station:[1],operator:[1],job:[1],state:[513],produced:[2],rejected:[2],target:[2]}]);function p(){if(typeof customElements==="undefined"){return}const e=["ind-workstation-monitor","ind-progress","ind-status-dot","ind-value"];e.forEach((e=>{switch(e){case"ind-workstation-monitor":if(!customElements.get(n(e))){customElements.define(n(e),l)}break;case"ind-progress":if(!customElements.get(n(e))){s()}break;case"ind-status-dot":if(!customElements.get(n(e))){d()}break;case"ind-value":if(!customElements.get(n(e))){r()}break}}))}p();const f=l;const b=p;export{f as IndWorkstationMonitor,b as defineCustomElement};
+//# sourceMappingURL=ind-workstation-monitor.js.map