@ind-ds/core 0.1.0 → 0.2.0

package/dist/types/index.d.ts

@@ -14,8 +14,58 @@ export type { TextareaSize, TextareaVariant } from './components/atoms/textarea/
 export type { DialogSize } from './components/atoms/dialog/dialog';
 export type { ScaraState } from './components/atoms/scara-canvas/scara-canvas';
 export type { ShelfSlot, ShelfSlotState } from './components/atoms/shelf-canvas/shelf-canvas';
+export type { BadgeVariant, BadgeSize } from './components/atoms/badge/badge';
+export type { CounterVariant, CounterSize } from './components/atoms/counter/counter';
+export type { SignalQualitySize } from './components/atoms/signal-quality/signal-quality';
+export type { ConnectionState, ConnectionSize } from './components/atoms/connection-indicator/connection-indicator';
+export type { HeartbeatSize } from './components/atoms/heartbeat/heartbeat';
+export type { SparklineVariant } from './components/atoms/sparkline/sparkline';
+export type { ProgressRingVariant, ProgressRingSize } from './components/atoms/progress-ring/progress-ring';
+export type { EquipmentState, EquipmentSize } from './components/atoms/_equipment/types';
+export type { ConveyorDirection } from './components/atoms/conveyor/conveyor';
+export type { PipeOrientation, PipeFlow, PipeTone } from './components/atoms/pipe/pipe';
+export type { ToggleSize } from './components/atoms/toggle/toggle';
+export type { SelectorPosition } from './components/atoms/selector-switch/selector-switch';
+export type { EstopSize } from './components/atoms/estop/estop';
+export type { SliderSize } from './components/atoms/slider/slider';
+export type { SetpointSize } from './components/atoms/setpoint/setpoint';
+export type { KnobSize } from './components/atoms/knob/knob';
+export type { DateTimeMode, DateTimeSize } from './components/atoms/datetime-picker/datetime-picker';
+export type { IconName, IconSize } from './components/atoms/icon/icon';
+export type { LabelTone, LabelSize } from './components/atoms/label/label';
+export type { UnitLabelSize } from './components/atoms/unit-label/unit-label';
+export type { TimestampFormat } from './components/atoms/timestamp/timestamp';
+export type { TagNameSize } from './components/atoms/tag-name/tag-name';
+export type { AlarmCountSize } from './components/atoms/alarm-count/alarm-count';
+export type { GaugeZone, GaugeSize } from './components/atoms/gauge/gauge';
+export type { LinearGaugeZone, LinearGaugeOrientation, LinearGaugeSize } from './components/atoms/linear-gauge/linear-gauge';
+export type { XyVariant } from './components/atoms/xy-point/xy-point';
+export type { ProcessSymbolShape, ProcessSymbolState, ProcessSymbolSize } from './components/atoms/process-symbol/process-symbol';
 export type { HealthState } from './components/molecules/health-card/health-card';
 export type { FillRowVariant } from './components/molecules/fill-row/fill-row';
+export type { TagCardState, TagCardAlarm, TagCardTrend } from './components/molecules/tag-card/tag-card';
+export type { EquipmentCardState } from './components/molecules/equipment-status-card/equipment-status-card';
+export type { TankAlarm } from './components/molecules/tank-level-card/tank-level-card';
+export type { KpiTrend, KpiVariant } from './components/molecules/kpi-card/kpi-card';
+export type { EnergyTrend } from './components/molecules/energy-card/energy-card';
+export type { RunState } from './components/molecules/start-stop-control/start-stop-control';
+export type { SpeedControlVariant } from './components/molecules/speed-control/speed-control';
+export type { ThermalMode } from './components/molecules/temperature-control/temperature-control';
+export type { CommandGroupOrientation } from './components/molecules/command-group/command-group';
+export type { TrendVariant } from './components/molecules/trend-widget/trend-widget';
+export type { AlarmRowPriority } from './components/molecules/alarm-row/alarm-row';
+export type { EventSeverity } from './components/molecules/event-row/event-row';
+export type { DataQuality } from './components/molecules/historical-value-row/historical-value-row';
 export type { AppHeaderConnectionState } from './components/organisms/app-header/app-header';
 export type { StatusBarState } from './components/organisms/status-bar/status-bar';
+export type { AlarmPanelItem } from './components/organisms/alarm-panel/alarm-panel';
+export type { EventJournalItem } from './components/organisms/event-journal/event-journal';
+export type { HistorianSample } from './components/organisms/historian-viewer/historian-viewer';
+export type { TrendSeries } from './components/organisms/trend-viewer/trend-viewer';
+export type { BatchState, BatchParam } from './components/organisms/batch-control-panel/batch-control-panel';
+export type { AssetItem } from './components/organisms/asset-overview/asset-overview';
+export type { MaintenanceDueItem } from './components/organisms/maintenance-dashboard/maintenance-dashboard';
+export type { DiagnosticMetric } from './components/organisms/device-diagnostics-panel/device-diagnostics-panel';
+export type { FirmwareState } from './components/organisms/firmware-update-panel/firmware-update-panel';
+export type { LineStation } from './components/organisms/production-line-overview/production-line-overview';
 //# sourceMappingURL=index.d.ts.map

package/package.json

@@ -1,87 +1,88 @@
-{
-  "name": "@ind-ds/core",
-  "version": "0.1.0",
-  "description": "Web components for the industrial HMI/SCADA design system — Stencil-built, framework-agnostic.",
-  "keywords": [
-    "web-components",
-    "stencil",
-    "design-system",
-    "hmi",
-    "scada",
-    "industrial",
-    "isa-18.2",
-    "custom-elements",
-    "ui-kit"
-  ],
-  "license": "MIT",
-  "author": "ind-ds contributors",
-  "homepage": "https://github.com/christophe77/in-ds#readme",
-  "bugs": {
-    "url": "https://github.com/christophe77/in-ds/issues"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/christophe77/in-ds.git",
-    "directory": "packages/core"
-  },
-  "type": "module",
-  "sideEffects": [
-    "**/*.css",
-    "dist/ind-ds/*",
-    "dist/esm/loader.js",
-    "loader/**"
-  ],
-  "main": "dist/index.cjs.js",
-  "module": "dist/index.js",
-  "es2017": "dist/esm/index.js",
-  "types": "dist/types/index.d.ts",
-  "unpkg": "dist/ind-ds/ind-ds.esm.js",
-  "collection": "dist/collection/collection-manifest.json",
-  "collection:main": "dist/collection/index.js",
-  "exports": {
-    ".": {
-      "types": "./dist/types/index.d.ts",
-      "import": "./dist/index.js",
-      "require": "./dist/index.cjs.js"
-    },
-    "./loader": {
-      "types": "./loader/index.d.ts",
-      "import": "./loader/index.js",
-      "require": "./loader/index.cjs.js"
-    },
-    "./components/*": {
-      "types": "./dist/components/*.d.ts",
-      "import": "./dist/components/*.js"
-    },
-    "./dist/components": {
-      "types": "./dist/components/index.d.ts",
-      "import": "./dist/components/index.js"
-    },
-    "./css/utilities": "./utilities.css",
-    "./dist/*": "./dist/*"
-  },
-  "files": [
-    "dist",
-    "loader",
-    "utilities.css",
-    "README.md"
-  ],
-  "scripts": {
-    "build": "stencil build",
-    "dev": "stencil build --dev --watch --serve",
-    "test": "stencil test --spec --e2e",
-    "clean": "rimraf dist loader www src/components.d.ts"
-  },
-  "publishConfig": {
-    "access": "public",
-    "provenance": true
-  },
-  "dependencies": {
-    "@ind-ds/tokens": "workspace:*"
-  },
-  "devDependencies": {
-    "@stencil/core": "^4.22.0",
-    "@stencil/react-output-target": "^1.5.3",
-    "rimraf": "^5.0.5"
-  }
-}
+{
+  "name": "@ind-ds/core",
+  "version": "0.2.0",
+  "description": "Web components for the industrial HMI/SCADA design system — Stencil-built, framework-agnostic.",
+  "keywords": [
+    "web-components",
+    "stencil",
+    "design-system",
+    "hmi",
+    "scada",
+    "industrial",
+    "isa-18.2",
+    "custom-elements",
+    "ui-kit"
+  ],
+  "license": "MIT",
+  "author": "ind-ds contributors",
+  "homepage": "https://github.com/christophe77/ind-ds#readme",
+  "bugs": {
+    "url": "https://github.com/christophe77/ind-ds/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/christophe77/ind-ds.git",
+    "directory": "packages/core"
+  },
+  "type": "module",
+  "sideEffects": [
+    "**/*.css",
+    "dist/ind-ds/*",
+    "dist/esm/loader.js",
+    "dist/components/**",
+    "loader/**"
+  ],
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.js",
+  "es2017": "dist/esm/index.js",
+  "types": "./dist/types/index.d.ts",
+  "unpkg": "dist/ind-ds/ind-ds.esm.js",
+  "collection": "dist/collection/collection-manifest.json",
+  "collection:main": "dist/collection/index.js",
+  "exports": {
+    ".": {
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs.js"
+    },
+    "./loader": {
+      "types": "./loader/index.d.ts",
+      "import": "./loader/index.js",
+      "require": "./loader/index.cjs.js"
+    },
+    "./components/*": {
+      "types": "./dist/components/*.d.ts",
+      "import": "./dist/components/*.js"
+    },
+    "./dist/components": {
+      "types": "./dist/components/index.d.ts",
+      "import": "./dist/components/index.js"
+    },
+    "./css/utilities": "./utilities.css",
+    "./dist/*": "./dist/*"
+  },
+  "files": [
+    "dist",
+    "loader",
+    "utilities.css",
+    "README.md"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "provenance": true
+  },
+  "dependencies": {
+    "@ind-ds/tokens": "0.2.0"
+  },
+  "devDependencies": {
+    "@stencil/core": "^4.22.0",
+    "@stencil/react-output-target": "^1.5.3",
+    "rimraf": "^5.0.5"
+  },
+  "scripts": {
+    "build": "stencil build",
+    "dev": "stencil build --dev --watch --serve",
+    "test": "stencil test --spec --e2e",
+    "clean": "rimraf dist loader www src/components.d.ts"
+  }
+}

package/dist/cjs/ind-input.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"ind-input.cjs.entry.js","mappings":"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","names":["h","Host"],"sources":["src/components/atoms/input/input.css?tag=ind-input&encapsulation=shadow","src/components/atoms/input/input.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  font-family: var(--ind-font-family-sans);\n  color: var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));\n  --_h: var(--ind-size-input-md, 32px);\n}\n\n:host([size=\"sm\"]) { --_h: var(--ind-size-input-sm, 24px); }\n:host([size=\"md\"]) { --_h: var(--ind-size-input-md, 32px); }\n:host([size=\"lg\"]) { --_h: var(--ind-size-input-lg, 40px); }\n\n.wrap {\n  display: inline-flex;\n  flex-direction: column;\n  gap: var(--ind-spacing-2, 4px);\n  min-width: 160px;\n  max-width: 100%;\n}\n\n.label {\n  font-size: var(--ind-font-size-sm, 11px);\n  font-weight: var(--ind-font-weight-medium, 500);\n  color: var(--ind-surface-text-secondary, light-dark(#2a3340, #aab5c2));\n  letter-spacing: 0.04em;\n  text-transform: uppercase;\n}\n\n.field {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n  height: var(--_h);\n  padding: 0 var(--ind-spacing-4, 8px);\n  background: var(--ind-surface-sunken, light-dark(#ffffff, #000000));\n  border: 1px solid var(--ind-surface-border-default, #2a3340);\n  border-radius: var(--ind-radius-md, 3px);\n  transition:\n    border-color var(--ind-motion-duration-fast, 120ms),\n    box-shadow   var(--ind-motion-duration-fast, 120ms);\n}\n\n.field.is-focus {\n  border-color: var(--ind-surface-focus-ring, #22d3ee);\n  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ind-surface-focus-ring, #22d3ee) 35%, transparent);\n}\n\n.input {\n  flex: 1;\n  min-width: 0;\n  height: 100%;\n  background: transparent;\n  border: none;\n  outline: none;\n  padding: 0;\n  font: inherit;\n  color: inherit;\n  font-feature-settings: var(--ind-font-feature-tabular, \"tnum\" 1);\n}\n\n.input::placeholder {\n  color: var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));\n  opacity: 1;\n}\n\n:host([type=\"number\"]) .input {\n  font-family: var(--ind-font-family-mono);\n  font-variant-numeric: tabular-nums;\n}\n\n:host([invalid]) .field {\n  border-color: var(--ind-feedback-error-bg, #dc2626);\n}\n:host([invalid]) .field.is-focus {\n  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ind-feedback-error-bg, #dc2626) 40%, transparent);\n}\n\n:host([disabled]) {\n  opacity: 0.55;\n  pointer-events: none;\n}\n\n:host([readonly]) .field {\n  background: var(--ind-surface-panel, light-dark(#f4f6f9, #11161c));\n}\n\n::slotted([slot=\"prefix\"]),\n::slotted([slot=\"suffix\"]) {\n  color: var(--ind-surface-text-muted, light-dark(#5a6776, #8390a0));\n  font-size: var(--ind-font-size-sm, 11px);\n  font-family: var(--ind-font-family-mono);\n  white-space: nowrap;\n}\n","import {\n  Component,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Element,\n  Method,\n  h,\n  Host,\n} from '@stencil/core';\n\nexport type InputType = 'text' | 'number' | 'email' | 'password' | 'search' | 'tel' | 'url';\nexport type InputSize = 'sm' | 'md' | 'lg';\nexport type InputMode = 'text' | 'numeric' | 'decimal' | 'tel' | 'url' | 'email' | 'search' | 'none';\n\n@Component({\n  tag: 'ind-input',\n  styleUrl: 'input.css',\n  shadow: true,\n})\nexport class IndInput {\n  @Element() host!: HTMLElement;\n\n  @Prop({ reflect: true }) type: InputType = 'text';\n  @Prop({ reflect: true }) size: InputSize = 'md';\n  @Prop({ mutable: true }) value: string = '';\n  @Prop() placeholder?: string;\n  @Prop({ reflect: true }) disabled: boolean = false;\n  @Prop({ reflect: true }) readonly: boolean = false;\n  @Prop({ reflect: true }) invalid: boolean = false;\n  @Prop() label?: string;\n  @Prop() name?: string;\n  @Prop() min?: number | string;\n  @Prop() max?: number | string;\n  @Prop() step?: number | string;\n  @Prop() pattern?: string;\n  @Prop() autocomplete?: string;\n  /** Maps to the native `inputmode` attribute — named `mode` to avoid clashing with `HTMLElement.inputMode`. */\n  @Prop({ attribute: 'inputmode' }) mode?: InputMode;\n\n  @State() private hasFocus = false;\n\n  /** Fires on every keystroke. */\n  @Event() indInput!: EventEmitter<string>;\n  /** Fires on change (blur or Enter). */\n  @Event() indChange!: EventEmitter<string>;\n\n  /** Programmatically focus the underlying input. */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.host.shadowRoot?.querySelector('input')?.focus();\n  }\n\n  private onInput = (e: Event) => {\n    const v = (e.target as HTMLInputElement).value;\n    this.value = v;\n    this.indInput.emit(v);\n  };\n\n  private onChange = (e: Event) => {\n    const v = (e.target as HTMLInputElement).value;\n    this.indChange.emit(v);\n  };\n\n  render() {\n    return (\n      <Host>\n        <label class=\"wrap\" part=\"wrap\">\n          {this.label && <span class=\"label\" part=\"label\">{this.label}</span>}\n          <span class={{ field: true, 'is-focus': this.hasFocus }} part=\"field\">\n            <slot name=\"prefix\" />\n            <input\n              part=\"input\"\n              class=\"input\"\n              type={this.type}\n              value={this.value}\n              placeholder={this.placeholder}\n              disabled={this.disabled}\n              readonly={this.readonly}\n              name={this.name}\n              min={this.min as unknown as string}\n              max={this.max as unknown as string}\n              step={this.step as unknown as string}\n              pattern={this.pattern}\n              autocomplete={this.autocomplete as unknown as 'on' | 'off'}\n              inputMode={this.mode as unknown as undefined}\n              aria-invalid={this.invalid ? 'true' : 'false'}\n              onFocus={() => (this.hasFocus = true)}\n              onBlur={() => (this.hasFocus = false)}\n              onInput={this.onInput}\n              onChange={this.onChange}\n            />\n            <slot name=\"suffix\" />\n          </span>\n        </label>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/ind-led.cjs.entry.js

@@ -1,29 +0,0 @@
-'use strict';
-
-var index = require('./index-ph7ZTjuY.js');
-
-const ledCss = () => `:host{display:inline-flex;align-items:center;gap:var(--ind-spacing-3, 6px);font-family:var(--ind-font-family-sans, system-ui, sans-serif);font-size:var(--ind-font-size-base, 12px);font-weight:var(--ind-font-weight-medium, 500);line-height:var(--ind-font-line-height-tight, 1.1);color:var(--ind-surface-text-primary, light-dark(#11161c, #eef1f5));font-feature-settings:var(--ind-font-feature-tabular, "tnum" 1)}.led{--_size:var(--ind-led-size, 12px);--_bg:var(--ind-state-stopped-bg, #5a6776);--_border:var(--ind-state-stopped-border, #8390a0);--_glow:var(--ind-state-stopped-glow, rgba(131, 144, 160, 0.35));display:inline-block;width:var(--_size);height:var(--_size);border-radius:50%;background:radial-gradient(     circle at 30% 30%,     color-mix(in srgb, var(--_bg) 65%, white),     var(--_bg) 70%   );border:1px solid var(--_border);box-shadow:0 0 0 1px color-mix(in srgb, var(--_bg) 25%, transparent),     0 0 8px var(--_glow),     inset 0 1px 2px rgba(0, 0, 0, 0.45);transition:background-color var(--ind-motion-duration-base, 200ms) var(--ind-motion-easing-standard, ease)}:host([size="sm"]) .led{--_size:8px}:host([size="md"]) .led{--_size:12px}:host([size="lg"]) .led{--_size:18px}:host([state="running"]) .led{--_bg:var(--ind-state-running-bg, #16a34a);--_border:var(--ind-state-running-border, #4ade80);--_glow:var(--ind-state-running-glow, rgba(34, 197, 94, 0.6))}:host([state="stopped"]) .led{--_bg:var(--ind-state-stopped-bg, #5a6776);--_border:var(--ind-state-stopped-border, #8390a0);--_glow:var(--ind-state-stopped-glow, rgba(131, 144, 160, 0.35))}:host([state="fault"]) .led{--_bg:var(--ind-state-fault-bg, #dc2626);--_border:var(--ind-state-fault-border, #f87171);--_glow:var(--ind-state-fault-glow, rgba(220, 38, 38, 0.7))}:host([state="warning"]) .led{--_bg:var(--ind-state-warning-bg, #f59e0b);--_border:var(--ind-state-warning-border, #fcd34d);--_glow:var(--ind-state-warning-glow, rgba(245, 158, 11, 0.6))}:host([state="maintenance"]) .led{--_bg:var(--ind-state-maintenance-bg, #2563eb);--_border:var(--ind-state-maintenance-border, #60a5fa);--_glow:var(--ind-state-maintenance-glow, rgba(37, 99, 235, 0.6))}:host([blinking]) .led{animation:ind-led-blink var(--ind-motion-blink-fast, 400ms) steps(2, end) infinite}:host([blinking][state="fault"]) .led{animation-duration:var(--ind-motion-blink-urgent, 200ms)}@keyframes ind-led-blink{50%{opacity:0.2;box-shadow:none}}@media (prefers-reduced-motion: reduce){:host([blinking]) .led{animation:none;opacity:1;outline:2px solid var(--_border);outline-offset:2px}}`;
-
-const IndLed = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    /** Process state driving the LED color and ARIA live politeness. */
-    state = 'stopped';
-    /** Visual size. */
-    size = 'md';
-    /** Blink. For SCADA, fast blink = unacknowledged condition. Stops respecting prefers-reduced-motion. */
-    blinking = false;
-    /** Optional visible label rendered next to the LED. Always becomes the accessible name. */
-    label;
-    render() {
-        const accessibleName = this.label ?? `${this.state} indicator`;
-        return (index.h(index.Host, { key: 'babe0b6e1a80181397c53ec0234ce3ff8d5741b4', role: "status", "aria-label": accessibleName, "aria-live": this.state === 'fault' ? 'assertive' : 'polite' }, index.h("span", { key: 'd7ca8697299f70715fdbe101d541c3313508e434', class: "led", part: "led", "aria-hidden": "true" }), this.label && index.h("span", { key: 'f39a9b21eabd4380db866e9bfb2591bcaeac3ce4', class: "label", part: "label" }, this.label)));
-    }
-};
-IndLed.style = ledCss();
-
-exports.ind_led = IndLed;
-//# sourceMappingURL=ind-led.entry.cjs.js.map
-
-//# sourceMappingURL=ind-led.cjs.entry.js.map

package/dist/cjs/ind-led.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"ind-led.cjs.entry.js","mappings":";;;;AAAA,MAAM,MAAM,GAAG,MAAM,CAAC,s+EAAs+E,CAAC;;MCUh/E,MAAM,GAAA,MAAA;;;;;IAEQ,KAAK,GAAa,SAAS;;IAG3B,IAAI,GAAY,IAAI;;IAGpB,QAAQ,GAAY,KAAK;;AAG1C,IAAA,KAAK;IAEb,MAAM,GAAA;QACJ,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,IAAI,CAAA,EAAG,IAAI,CAAC,KAAK,CAAA,UAAA,CAAY;AAC9D,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,IAAI,EAAC,QAAQ,EAAA,YAAA,EACD,cAAc,EAAA,WAAA,EACf,IAAI,CAAC,KAAK,KAAK,OAAO,GAAG,WAAW,GAAG,QAAQ,EAAA,EAE1DD,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,KAAK,EAAC,IAAI,EAAC,KAAK,EAAA,aAAA,EAAa,MAAM,EAAA,CAAG,EACjD,IAAI,CAAC,KAAK,IAAIA,mEAAM,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CAC9D;;;;;;;","names":["h","Host"],"sources":["src/components/atoms/led/led.css?tag=ind-led&encapsulation=shadow","src/components/atoms/led/led.tsx"],"sourcesContent":[":host {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--ind-spacing-3, 6px);\n  font-family: var(--ind-font-family-sans, system-ui, sans-serif);\n  font-size: var(--ind-font-size-base, 12px);\n  font-weight: var(--ind-font-weight-medium, 500);\n  line-height: var(--ind-font-line-height-tight, 1.1);\n  /* `light-dark()` makes the label readable even if the LED lands on a surface\n   * whose theme doesn't match the loaded tokens (Storybook autodocs, embedded\n   * widget on a third-party site, etc.). */\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.led {\n  --_size: var(--ind-led-size, 12px);\n  --_bg: var(--ind-state-stopped-bg, #5a6776);\n  --_border: var(--ind-state-stopped-border, #8390a0);\n  --_glow: var(--ind-state-stopped-glow, rgba(131, 144, 160, 0.35));\n\n  display: inline-block;\n  width: var(--_size);\n  height: var(--_size);\n  border-radius: 50%;\n  background: radial-gradient(\n    circle at 30% 30%,\n    color-mix(in srgb, var(--_bg) 65%, white),\n    var(--_bg) 70%\n  );\n  border: 1px solid var(--_border);\n  box-shadow:\n    0 0 0 1px color-mix(in srgb, var(--_bg) 25%, transparent),\n    0 0 8px var(--_glow),\n    inset 0 1px 2px rgba(0, 0, 0, 0.45);\n  transition: background-color var(--ind-motion-duration-base, 200ms) var(--ind-motion-easing-standard, ease);\n}\n\n:host([size=\"sm\"]) .led { --_size: 8px; }\n:host([size=\"md\"]) .led { --_size: 12px; }\n:host([size=\"lg\"]) .led { --_size: 18px; }\n\n/* Each state ships hard-coded fallbacks so the component stays visible even\n * if tokens fail to load (build-order glitch, sandbox without CSS imports).\n */\n:host([state=\"running\"]) .led {\n  --_bg: var(--ind-state-running-bg, #16a34a);\n  --_border: var(--ind-state-running-border, #4ade80);\n  --_glow: var(--ind-state-running-glow, rgba(34, 197, 94, 0.6));\n}\n:host([state=\"stopped\"]) .led {\n  --_bg: var(--ind-state-stopped-bg, #5a6776);\n  --_border: var(--ind-state-stopped-border, #8390a0);\n  --_glow: var(--ind-state-stopped-glow, rgba(131, 144, 160, 0.35));\n}\n:host([state=\"fault\"]) .led {\n  --_bg: var(--ind-state-fault-bg, #dc2626);\n  --_border: var(--ind-state-fault-border, #f87171);\n  --_glow: var(--ind-state-fault-glow, rgba(220, 38, 38, 0.7));\n}\n:host([state=\"warning\"]) .led {\n  --_bg: var(--ind-state-warning-bg, #f59e0b);\n  --_border: var(--ind-state-warning-border, #fcd34d);\n  --_glow: var(--ind-state-warning-glow, rgba(245, 158, 11, 0.6));\n}\n:host([state=\"maintenance\"]) .led {\n  --_bg: var(--ind-state-maintenance-bg, #2563eb);\n  --_border: var(--ind-state-maintenance-border, #60a5fa);\n  --_glow: var(--ind-state-maintenance-glow, rgba(37, 99, 235, 0.6));\n}\n\n:host([blinking]) .led {\n  animation: ind-led-blink var(--ind-motion-blink-fast, 400ms) steps(2, end) infinite;\n}\n:host([blinking][state=\"fault\"]) .led {\n  animation-duration: var(--ind-motion-blink-urgent, 200ms);\n}\n\n@keyframes ind-led-blink {\n  50% { opacity: 0.2; box-shadow: none; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  :host([blinking]) .led {\n    animation: none;\n    opacity: 1;\n    /* Substitute: a solid outline ring so the alarm condition is still visible without motion. */\n    outline: 2px solid var(--_border);\n    outline-offset: 2px;\n  }\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type LedState = 'running' | 'stopped' | 'fault' | 'warning' | 'maintenance';\nexport type LedSize = 'sm' | 'md' | 'lg';\n\n@Component({\n  tag: 'ind-led',\n  styleUrl: 'led.css',\n  shadow: true,\n})\nexport class IndLed {\n  /** Process state driving the LED color and ARIA live politeness. */\n  @Prop({ reflect: true }) state: LedState = 'stopped';\n\n  /** Visual size. */\n  @Prop({ reflect: true }) size: LedSize = 'md';\n\n  /** Blink. For SCADA, fast blink = unacknowledged condition. Stops respecting prefers-reduced-motion. */\n  @Prop({ reflect: true }) blinking: boolean = false;\n\n  /** Optional visible label rendered next to the LED. Always becomes the accessible name. */\n  @Prop() label?: string;\n\n  render() {\n    const accessibleName = this.label ?? `${this.state} indicator`;\n    return (\n      <Host\n        role=\"status\"\n        aria-label={accessibleName}\n        aria-live={this.state === 'fault' ? 'assertive' : 'polite'}\n      >\n        <span class=\"led\" part=\"led\" aria-hidden=\"true\" />\n        {this.label && <span class=\"label\" part=\"label\">{this.label}</span>}\n      </Host>\n    );\n  }\n}\n"],"version":3}