@oicl/openbridge-webcomponents 2.1.0-next.2 → 2.1.0-next.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -44287,7 +44287,7 @@
44287
44287
  "declarations": [
44288
44288
  {
44289
44289
  "kind": "class",
44290
- "description": "",
44290
+ "description": "Two-way analog valve symbol whose opening moves continuously from 0 to\n100 %.\n\nDraws the same symbol as the `obi-twoway-analog-*` icons. The shut bands at\nthe port ends and the handle are linear in the opening: exact at 100 %\n(`obi-twoway-analog-open`) and at 0 % (vertical handle, ports shut to the\ncentre), and close to the icons' 10/25/50/75 % steps in between. Used as\nthe icon of `obc-analog-valve`.",
44291
44291
  "name": "ObcValveAnalogTwoWayIcon",
44292
44292
  "members": [
44293
44293
  {
@@ -44297,9 +44297,9 @@
44297
44297
  "text": "number"
44298
44298
  },
44299
44299
  "default": "0",
44300
+ "description": "Opening in percent (0–100).\n\nAvailable when `closed==false`.",
44300
44301
  "attribute": "value",
44301
44302
  "availableWhen": "closed==false",
44302
- "description": "Available when `closed==false`.",
44303
44303
  "availableWhenIf": {
44304
44304
  "arg": "closed",
44305
44305
  "truthy": false
@@ -44312,6 +44312,7 @@
44312
44312
  "text": "boolean"
44313
44313
  },
44314
44314
  "default": "false",
44315
+ "description": "Shows the closed symbol.",
44315
44316
  "attribute": "closed"
44316
44317
  },
44317
44318
  {
@@ -44321,7 +44322,35 @@
44321
44322
  "text": "boolean"
44322
44323
  },
44323
44324
  "default": "false",
44325
+ "description": "Turns the symbol 90° for a vertical pipe.",
44324
44326
  "attribute": "vertical"
44327
+ },
44328
+ {
44329
+ "kind": "method",
44330
+ "name": "renderBands",
44331
+ "privacy": "private",
44332
+ "parameters": [
44333
+ {
44334
+ "name": "width",
44335
+ "type": {
44336
+ "text": "number"
44337
+ }
44338
+ }
44339
+ ]
44340
+ },
44341
+ {
44342
+ "kind": "method",
44343
+ "name": "renderHandle",
44344
+ "privacy": "private",
44345
+ "parameters": [
44346
+ {
44347
+ "name": "value",
44348
+ "type": {
44349
+ "text": "number"
44350
+ }
44351
+ }
44352
+ ],
44353
+ "description": "Horizontal at the top when open, turning to vertical and moving 2 units\ndown as the valve shuts, matching `obi-twoway-analog-open` at 100 %."
44325
44354
  }
44326
44355
  ],
44327
44356
  "attributes": [
@@ -44331,8 +44360,8 @@
44331
44360
  "text": "number"
44332
44361
  },
44333
44362
  "default": "0",
44334
- "fieldName": "value",
44335
- "description": "Available when `closed==false`."
44363
+ "description": "Opening in percent (0–100).\n\nAvailable when `closed==false`.",
44364
+ "fieldName": "value"
44336
44365
  },
44337
44366
  {
44338
44367
  "name": "closed",
@@ -44340,6 +44369,7 @@
44340
44369
  "text": "boolean"
44341
44370
  },
44342
44371
  "default": "false",
44372
+ "description": "Shows the closed symbol.",
44343
44373
  "fieldName": "closed"
44344
44374
  },
44345
44375
  {
@@ -44348,6 +44378,7 @@
44348
44378
  "text": "boolean"
44349
44379
  },
44350
44380
  "default": "false",
44381
+ "description": "Turns the symbol 90° for a vertical pipe.",
44351
44382
  "fieldName": "vertical"
44352
44383
  }
44353
44384
  ],
@@ -1,14 +1,38 @@
1
1
  import { LitElement } from 'lit';
2
2
  import '../../icons/icon-twoway-analog-closed.js';
3
3
  /**
4
+ * Two-way analog valve symbol whose opening moves continuously from 0 to
5
+ * 100 %.
6
+ *
7
+ * Draws the same symbol as the `obi-twoway-analog-*` icons. The shut bands at
8
+ * the port ends and the handle are linear in the opening: exact at 100 %
9
+ * (`obi-twoway-analog-open`) and at 0 % (vertical handle, ports shut to the
10
+ * centre), and close to the icons' 10/25/50/75 % steps in between. Used as
11
+ * the icon of `obc-analog-valve`.
12
+ *
13
+ * @property value - Opening in percent (0–100).
4
14
  * @availableWhen value closed==false
15
+ * @property closed - Shows the closed symbol.
16
+ * @property vertical - Turns the symbol 90° for a vertical pipe.
5
17
  * @stable
6
18
  */
7
19
  export declare class ObcValveAnalogTwoWayIcon extends LitElement {
8
- /** Available when `closed==false`. */
20
+ /**
21
+ * Opening in percent (0–100).
22
+ *
23
+ * Available when `closed==false`.
24
+ */
9
25
  value: number;
26
+ /** Shows the closed symbol. */
10
27
  closed: boolean;
28
+ /** Turns the symbol 90° for a vertical pipe. */
11
29
  vertical: boolean;
30
+ private renderBands;
31
+ /**
32
+ * Horizontal at the top when open, turning to vertical and moving 2 units
33
+ * down as the valve shuts, matching `obi-twoway-analog-open` at 100 %.
34
+ */
35
+ private renderHandle;
12
36
  render(): import('lit-html').TemplateResult<1>;
13
37
  static styles: import('lit').CSSResult;
14
38
  }
@@ -1 +1 @@
1
- {"version":3,"file":"valve-analog-two-way-icon.d.ts","sourceRoot":"","sources":["../../../src/automation/valve-analoge-two-way-icon/valve-analog-two-way-icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAuB,MAAM,KAAK,CAAC;AAIrD,OAAO,0CAA0C,CAAC;AAElD;;;GAGG;AACH,qBACa,wBAAyB,SAAQ,UAAU;IAC5B,KAAK,EAAE,MAAM,CAAK;IACjB,MAAM,EAAE,OAAO,CAAS;IACxB,QAAQ,EAAE,OAAO,CAAS;IAE5C,MAAM;IAoFf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,+BAA+B,EAAE,wBAAwB,CAAC;KAC3D;CACF"}
1
+ {"version":3,"file":"valve-analog-two-way-icon.d.ts","sourceRoot":"","sources":["../../../src/automation/valve-analoge-two-way-icon/valve-analog-two-way-icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAuB,MAAM,KAAK,CAAC;AAKrD,OAAO,0CAA0C,CAAC;AAclD;;;;;;;;;;;;;;;GAeG;AACH,qBACa,wBAAyB,SAAQ,UAAU;IAC5B,KAAK,EAAE,MAAM,CAAK;IACjB,MAAM,EAAE,OAAO,CAAS;IACxB,QAAQ,EAAE,OAAO,CAAS;IAErD,OAAO,CAAC,WAAW;IAYnB;;;OAGG;IACH,OAAO,CAAC,YAAY;IAWX,MAAM;IA8Bf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,+BAA+B,EAAE,wBAAwB,CAAC;KAC3D;CACF"}
@@ -1,10 +1,18 @@
1
1
  import { customElement } from "../../decorator.js";
2
+ import { clampPercent } from "../../svghelpers/math.js";
2
3
  import __decorate from "../../_virtual/_@oxc-project_runtime@0.150.0/helpers/esm/decorate.js";
3
4
  import "../../icons/icon-twoway-analog-closed.js";
4
5
  import valve_analog_two_way_icon_default from "./valve-analog-two-way-icon.css.js";
5
6
  import { LitElement, html, svg, unsafeCSS } from "lit";
6
7
  import { property } from "lit/decorators.js";
7
8
  //#region src/automation/valve-analoge-two-way-icon/valve-analog-two-way-icon.ts
9
+ var OUTLINE = "M11 11L3.5547 6.03645C2.89015 5.59342 2 6.06981 2 6.8685V19.1315C2 19.9302 2.89015 20.4066 3.5547 19.9635L11 15H13L20.4453 19.9635C21.1099 20.4066 22 19.9302 22 19.1315V6.8685C22 6.06981 21.1099 5.59342 20.4453 6.03645L13 11H11ZM3 6.8685L3 19.1315L10.6972 14H13.3028L21 19.1315V6.8685L13.3028 12H10.6972L3 6.8685Z";
10
+ var BODY = "M10.6972 12H13.3028L21 6.8685V19.1315L13.3028 14H10.6972L3 19.1315V6.8685L10.6972 12Z";
11
+ /** Width of the shut band at each port end when the opening is 0 %, in icon units. */
12
+ var BAND_RANGE = 7;
13
+ var SECONDARY = "fill: var(--automation-device-secondary-color)";
14
+ var TERTIARY = "fill: var(--automation-device-tertiary-color)";
15
+ var PRIMARY = "fill: var(--automation-device-primary-color)";
8
16
  var ObcValveAnalogTwoWayIcon = class ObcValveAnalogTwoWayIcon extends LitElement {
9
17
  constructor(..._args) {
10
18
  super(..._args);
@@ -12,22 +20,37 @@ var ObcValveAnalogTwoWayIcon = class ObcValveAnalogTwoWayIcon extends LitElement
12
20
  this.closed = false;
13
21
  this.vertical = false;
14
22
  }
23
+ renderBands(width) {
24
+ if (width <= 0) return null;
25
+ const left = 3 + width;
26
+ const right = 21 - width;
27
+ return svg`<g clip-path="url(#body)">
28
+ <rect x="2" y="0" width=${left - 2} height="24" style=${SECONDARY}/>
29
+ <rect x=${left} y="0" width="1" height="24" style=${TERTIARY}/>
30
+ <rect x=${right} y="0" width=${22 - right} height="24" style=${SECONDARY}/>
31
+ <rect x=${right - 1} y="0" width="1" height="24" style=${TERTIARY}/>
32
+ </g>`;
33
+ }
34
+ /**
35
+ * Horizontal at the top when open, turning to vertical and moving 2 units
36
+ * down as the valve shuts, matching `obi-twoway-analog-open` at 100 %.
37
+ */
38
+ renderHandle(value) {
39
+ const shut = 1 - value / 100;
40
+ const angle = -90 * shut;
41
+ const cx = 12;
42
+ const cy = 3.5 + 2 * shut;
43
+ return svg`<g transform="rotate(${angle} ${cx} ${cy})">
44
+ <rect x=${8} y=${cy - 1.5} width="8" height="3" rx="1.5" style=${TERTIARY}/>
45
+ <rect x=${9} y=${cy - .5} width="6" height="1" rx="0.5" style=${PRIMARY}/>
46
+ </g>`;
47
+ }
15
48
  render() {
16
49
  const transform = this.vertical ? "transform: rotate(90deg);" : "";
17
50
  if (this.closed) return html` <div class="wrapper" style="${transform}">
18
51
  <obi-twoway-analog-closed useCssColor> </obi-twoway-analog-closed>
19
52
  </div>`;
20
- const handleRotation = -(1 - this.value / 100) * 90;
21
- const handleTranslation = (1 - this.value / 100) * 2;
22
- const handle = svg`
23
- <g transform="translate(0, ${handleTranslation}) rotate(${handleRotation} 12 3.5) ">
24
- <path fill-rule="evenodd" clip-rule="evenodd" d="M9.5 5H14.5C15.3284 5 16 4.32843 16 3.5C16 2.67157 15.3284 2 14.5 2H9.5C8.67157 2 8 2.67157 8 3.5C8 4.32843 8.67157 5 9.5 5ZM9.5 4L14.5 4C14.7761 4 15 3.77614 15 3.5C15 3.22386 14.7761 3 14.5 3L9.5 3C9.22386 3 9 3.22386 9 3.5C9 3.77614 9.22386 4 9.5 4Z" fill="var(--automation-device-tertiary-color)"/>
25
- <path d="M9.5 4L14.5 4C14.7761 4 15 3.77614 15 3.5C15 3.22386 14.7761 3 14.5 3L9.5 3C9.22386 3 9 3.22386 9 3.5C9 3.77614 9.22386 4 9.5 4Z" fill="var(--automation-device-primary-color)"/>
26
- </g>
27
- `;
28
- const xmin = 10.5;
29
- const xmax = 2.5;
30
- const x = xmin + -8 * this.value / 100;
53
+ const value = clampPercent(this.value);
31
54
  return html`
32
55
  <div class="wrapper" style="${transform}">
33
56
  <svg
@@ -37,55 +60,13 @@ var ObcValveAnalogTwoWayIcon = class ObcValveAnalogTwoWayIcon extends LitElement
37
60
  fill="none"
38
61
  xmlns="http://www.w3.org/2000/svg"
39
62
  >
40
- <path
41
- d="M11 11L3.5547 6.03645C2.89015 5.59342 2 6.06981 2 6.8685V19.1315C2 19.9302 2.89015 20.4066 3.5547 19.9635L11 15H13L20.4453 19.9635C21.1099 20.4066 22 19.9302 22 19.1315V6.8685C22 6.06981 21.1099 5.59342 20.4453 6.03645L13 11H11ZM3 6.8685L3 19.1315L10.6972 14H13.3028L21 19.1315V6.8685L13.3028 12H10.6972L3 6.8685Z"
42
- fill="var(--automation-device-tertiary-color)"
43
- />
44
- <path
45
- d="M10.6972 12H13.3028L21 6.8685V19.1315L13.3028 14H10.6972L3 19.1315V6.8685L10.6972 12Z"
46
- fill="var(--automation-device-primary-color)"
47
- />
48
- ${handle}
49
- <g clip-path="url(#clip0)">
50
- <rect
51
- x=${xmax}
52
- y="0"
53
- width=${x - xmax}
54
- height="24"
55
- fill="var(--automation-device-secondary-color)"
56
- />
57
- <line
58
- x1=${x}
59
- y1="0"
60
- x2=${x}
61
- y2="24"
62
- stroke="var(--automation-device-tertiary-color)"
63
- stroke-width="1"
64
- />
65
-
66
- <rect
67
- x=${24 - x}
68
- y="0"
69
- width=${x - xmax}
70
- height="24"
71
- fill="var(--automation-device-secondary-color)"
72
- />
73
- <line
74
- x1=${24 - x}
75
- y1="0"
76
- x2=${24 - x}
77
- y2="24"
78
- stroke="var(--automation-device-tertiary-color)"
79
- stroke-width="1"
80
- />
81
- </g>
82
63
  <defs>
83
- <clipPath id="clip0">
84
- <path
85
- d="M10.6972 12H13.3028L21 6.8685V19.1315L13.3028 14H10.6972L3 19.1315V6.8685L10.6972 12Z"
86
- />
87
- </clipPath>
64
+ <clipPath id="body"><path d=${BODY} /></clipPath>
88
65
  </defs>
66
+ <path d=${OUTLINE} style=${TERTIARY} />
67
+ <path d=${BODY} style=${PRIMARY} />
68
+ ${this.renderBands(BAND_RANGE * (100 - value) / 100)}
69
+ ${this.renderHandle(value)}
89
70
  </svg>
90
71
  </div>
91
72
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"valve-analog-two-way-icon.js","names":[],"sources":["../../../src/automation/valve-analoge-two-way-icon/valve-analog-two-way-icon.ts"],"sourcesContent":["import {LitElement, html, svg, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport compentStyle from './valve-analog-two-way-icon.css?inline';\nimport {customElement} from '../../decorator.js';\nimport '../../icons/icon-twoway-analog-closed.js';\n\n/**\n * @availableWhen value closed==false\n * @stable\n */\n@customElement('obc-valve-analog-two-way-icon')\nexport class ObcValveAnalogTwoWayIcon extends LitElement {\n @property({type: Number}) value: number = 0;\n @property({type: Boolean}) closed: boolean = false;\n @property({type: Boolean}) vertical: boolean = false;\n\n override render() {\n const transform = this.vertical ? 'transform: rotate(90deg);' : '';\n if (this.closed) {\n return html` <div class=\"wrapper\" style=\"${transform}\">\n <obi-twoway-analog-closed useCssColor> </obi-twoway-analog-closed>\n </div>`;\n }\n\n const handleRotation = -(1 - this.value / 100) * 90;\n const handleTranslation = (1 - this.value / 100) * 2;\n const handle = svg`\n <g transform=\"translate(0, ${handleTranslation}) rotate(${handleRotation} 12 3.5) \">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M9.5 5H14.5C15.3284 5 16 4.32843 16 3.5C16 2.67157 15.3284 2 14.5 2H9.5C8.67157 2 8 2.67157 8 3.5C8 4.32843 8.67157 5 9.5 5ZM9.5 4L14.5 4C14.7761 4 15 3.77614 15 3.5C15 3.22386 14.7761 3 14.5 3L9.5 3C9.22386 3 9 3.22386 9 3.5C9 3.77614 9.22386 4 9.5 4Z\" fill=\"var(--automation-device-tertiary-color)\"/>\n <path d=\"M9.5 4L14.5 4C14.7761 4 15 3.77614 15 3.5C15 3.22386 14.7761 3 14.5 3L9.5 3C9.22386 3 9 3.22386 9 3.5C9 3.77614 9.22386 4 9.5 4Z\" fill=\"var(--automation-device-primary-color)\"/>\n </g>\n `;\n\n const xmin = 10.5;\n const xmax = 2.5;\n const x = xmin + ((xmax - xmin) * this.value) / 100;\n\n return html`\n <div class=\"wrapper\" style=\"${transform}\">\n <svg\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M11 11L3.5547 6.03645C2.89015 5.59342 2 6.06981 2 6.8685V19.1315C2 19.9302 2.89015 20.4066 3.5547 19.9635L11 15H13L20.4453 19.9635C21.1099 20.4066 22 19.9302 22 19.1315V6.8685C22 6.06981 21.1099 5.59342 20.4453 6.03645L13 11H11ZM3 6.8685L3 19.1315L10.6972 14H13.3028L21 19.1315V6.8685L13.3028 12H10.6972L3 6.8685Z\"\n fill=\"var(--automation-device-tertiary-color)\"\n />\n <path\n d=\"M10.6972 12H13.3028L21 6.8685V19.1315L13.3028 14H10.6972L3 19.1315V6.8685L10.6972 12Z\"\n fill=\"var(--automation-device-primary-color)\"\n />\n ${handle}\n <g clip-path=\"url(#clip0)\">\n <rect\n x=${xmax}\n y=\"0\"\n width=${x - xmax}\n height=\"24\"\n fill=\"var(--automation-device-secondary-color)\"\n />\n <line\n x1=${x}\n y1=\"0\"\n x2=${x}\n y2=\"24\"\n stroke=\"var(--automation-device-tertiary-color)\"\n stroke-width=\"1\"\n />\n\n <rect\n x=${24 - x}\n y=\"0\"\n width=${x - xmax}\n height=\"24\"\n fill=\"var(--automation-device-secondary-color)\"\n />\n <line\n x1=${24 - x}\n y1=\"0\"\n x2=${24 - x}\n y2=\"24\"\n stroke=\"var(--automation-device-tertiary-color)\"\n stroke-width=\"1\"\n />\n </g>\n <defs>\n <clipPath id=\"clip0\">\n <path\n d=\"M10.6972 12H13.3028L21 6.8685V19.1315L13.3028 14H10.6972L3 19.1315V6.8685L10.6972 12Z\"\n />\n </clipPath>\n </defs>\n </svg>\n </div>\n `;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-valve-analog-two-way-icon': ObcValveAnalogTwoWayIcon;\n }\n}\n"],"mappings":";;;;;;;AAWO,IAAM,2BAAN,MAAM,iCAAiC,WAAW;;;EACb,KAAA,QAAA;EACG,KAAA,SAAA;EACE,KAAA,WAAA;;CAE/C,SAAkB;EAChB,MAAM,YAAY,KAAK,WAAW,8BAA8B;EAChE,IAAI,KAAK,QACP,OAAO,IAAI,gCAAgC,UAAU;;;EAKvD,MAAM,iBAAiB,EAAE,IAAI,KAAK,QAAQ,OAAO;EACjD,MAAM,qBAAqB,IAAI,KAAK,QAAQ,OAAO;EACnD,MAAM,SAAS,GAAG;mCACa,kBAAkB,WAAW,eAAe;;;;;EAM3E,MAAM,OAAO;EACb,MAAM,OAAO;EACb,MAAM,IAAI,OAAS,KAAe,KAAK,QAAS;EAEhD,OAAO,IAAI;oCACqB,UAAU;;;;;;;;;;;;;;;;YAgBlC,OAAO;;;kBAGD,KAAK;;sBAED,IAAI,KAAK;;;;;mBAKZ,EAAE;;mBAEF,EAAE;;;;;;;kBAOH,KAAK,EAAE;;sBAEH,IAAI,KAAK;;;;;mBAKZ,KAAK,EAAE;;mBAEP,KAAK,EAAE;;;;;;;;;;;;;;;;CAgBxB;;EAEyB,KAAA,SAAA,UAAU,iCAAY;;AACjD;AAzFG,WAAA,CAAA,SAAS,EAAC,MAAM,OAAM,CAAC,CAAA,GAAA,yBAAA,WAAA,SAAA,KAAA,CAAA;AACvB,WAAA,CAAA,SAAS,EAAC,MAAM,QAAO,CAAC,CAAA,GAAA,yBAAA,WAAA,UAAA,KAAA,CAAA;AACxB,WAAA,CAAA,SAAS,EAAC,MAAM,QAAO,CAAC,CAAA,GAAA,yBAAA,WAAA,YAAA,KAAA,CAAA;AAJ1B,2BAAA,WAAA,CAAA,cAAc,+BAA+B,CAAA,GAAA,wBAAA"}
1
+ {"version":3,"file":"valve-analog-two-way-icon.js","names":[],"sources":["../../../src/automation/valve-analoge-two-way-icon/valve-analog-two-way-icon.ts"],"sourcesContent":["import {LitElement, html, svg, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport compentStyle from './valve-analog-two-way-icon.css?inline';\nimport {customElement} from '../../decorator.js';\nimport {clampPercent} from '../../svghelpers/math.js';\nimport '../../icons/icon-twoway-analog-closed.js';\n\nconst OUTLINE =\n 'M11 11L3.5547 6.03645C2.89015 5.59342 2 6.06981 2 6.8685V19.1315C2 19.9302 2.89015 20.4066 3.5547 19.9635L11 15H13L20.4453 19.9635C21.1099 20.4066 22 19.9302 22 19.1315V6.8685C22 6.06981 21.1099 5.59342 20.4453 6.03645L13 11H11ZM3 6.8685L3 19.1315L10.6972 14H13.3028L21 19.1315V6.8685L13.3028 12H10.6972L3 6.8685Z';\nconst BODY =\n 'M10.6972 12H13.3028L21 6.8685V19.1315L13.3028 14H10.6972L3 19.1315V6.8685L10.6972 12Z';\n\n/** Width of the shut band at each port end when the opening is 0 %, in icon units. */\nconst BAND_RANGE = 7;\n\nconst SECONDARY = 'fill: var(--automation-device-secondary-color)';\nconst TERTIARY = 'fill: var(--automation-device-tertiary-color)';\nconst PRIMARY = 'fill: var(--automation-device-primary-color)';\n\n/**\n * Two-way analog valve symbol whose opening moves continuously from 0 to\n * 100 %.\n *\n * Draws the same symbol as the `obi-twoway-analog-*` icons. The shut bands at\n * the port ends and the handle are linear in the opening: exact at 100 %\n * (`obi-twoway-analog-open`) and at 0 % (vertical handle, ports shut to the\n * centre), and close to the icons' 10/25/50/75 % steps in between. Used as\n * the icon of `obc-analog-valve`.\n *\n * @property value - Opening in percent (0–100).\n * @availableWhen value closed==false\n * @property closed - Shows the closed symbol.\n * @property vertical - Turns the symbol 90° for a vertical pipe.\n * @stable\n */\n@customElement('obc-valve-analog-two-way-icon')\nexport class ObcValveAnalogTwoWayIcon extends LitElement {\n @property({type: Number}) value: number = 0;\n @property({type: Boolean}) closed: boolean = false;\n @property({type: Boolean}) vertical: boolean = false;\n\n private renderBands(width: number) {\n if (width <= 0) return null;\n const left = 3 + width;\n const right = 21 - width;\n return svg`<g clip-path=\"url(#body)\">\n <rect x=\"2\" y=\"0\" width=${left - 2} height=\"24\" style=${SECONDARY}/>\n <rect x=${left} y=\"0\" width=\"1\" height=\"24\" style=${TERTIARY}/>\n <rect x=${right} y=\"0\" width=${22 - right} height=\"24\" style=${SECONDARY}/>\n <rect x=${right - 1} y=\"0\" width=\"1\" height=\"24\" style=${TERTIARY}/>\n </g>`;\n }\n\n /**\n * Horizontal at the top when open, turning to vertical and moving 2 units\n * down as the valve shuts, matching `obi-twoway-analog-open` at 100 %.\n */\n private renderHandle(value: number) {\n const shut = 1 - value / 100;\n const angle = -90 * shut;\n const cx = 12;\n const cy = 3.5 + 2 * shut;\n return svg`<g transform=\"rotate(${angle} ${cx} ${cy})\">\n <rect x=${cx - 4} y=${cy - 1.5} width=\"8\" height=\"3\" rx=\"1.5\" style=${TERTIARY}/>\n <rect x=${cx - 3} y=${cy - 0.5} width=\"6\" height=\"1\" rx=\"0.5\" style=${PRIMARY}/>\n </g>`;\n }\n\n override render() {\n const transform = this.vertical ? 'transform: rotate(90deg);' : '';\n if (this.closed) {\n return html` <div class=\"wrapper\" style=\"${transform}\">\n <obi-twoway-analog-closed useCssColor> </obi-twoway-analog-closed>\n </div>`;\n }\n\n const value = clampPercent(this.value);\n return html`\n <div class=\"wrapper\" style=\"${transform}\">\n <svg\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <defs>\n <clipPath id=\"body\"><path d=${BODY} /></clipPath>\n </defs>\n <path d=${OUTLINE} style=${TERTIARY} />\n <path d=${BODY} style=${PRIMARY} />\n ${this.renderBands((BAND_RANGE * (100 - value)) / 100)}\n ${this.renderHandle(value)}\n </svg>\n </div>\n `;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-valve-analog-two-way-icon': ObcValveAnalogTwoWayIcon;\n }\n}\n"],"mappings":";;;;;;;;AAOA,IAAM,UACJ;AACF,IAAM,OACJ;;AAGF,IAAM,aAAa;AAEnB,IAAM,YAAY;AAClB,IAAM,WAAW;AACjB,IAAM,UAAU;AAmBT,IAAM,2BAAN,MAAM,iCAAiC,WAAW;;;EACb,KAAA,QAAA;EACG,KAAA,SAAA;EACE,KAAA,WAAA;;CAE/C,YAAoB,OAAe;EACjC,IAAI,SAAS,GAAG,OAAO;EACvB,MAAM,OAAO,IAAI;EACjB,MAAM,QAAQ,KAAK;EACnB,OAAO,GAAG;gCACkB,OAAO,EAAE,qBAAqB,UAAU;gBACxD,KAAK,qCAAqC,SAAS;gBACnD,MAAM,eAAe,KAAK,MAAM,qBAAqB,UAAU;gBAC/D,QAAQ,EAAE,qCAAqC,SAAS;;CAEtE;;;;;CAMA,aAAqB,OAAe;EAClC,MAAM,OAAO,IAAI,QAAQ;EACzB,MAAM,QAAQ,MAAM;EACpB,MAAM,KAAK;EACX,MAAM,KAAK,MAAM,IAAI;EACrB,OAAO,GAAG,wBAAwB,MAAM,GAAG,GAAG,GAAG,GAAG;gBACxC,EAAO,KAAK,KAAK,IAAI,uCAAuC,SAAS;gBACrE,EAAO,KAAK,KAAK,GAAI,uCAAuC,QAAQ;;CAElF;CAEA,SAAkB;EAChB,MAAM,YAAY,KAAK,WAAW,8BAA8B;EAChE,IAAI,KAAK,QACP,OAAO,IAAI,gCAAgC,UAAU;;;EAKvD,MAAM,QAAQ,aAAa,KAAK,KAAK;EACrC,OAAO,IAAI;oCACqB,UAAU;;;;;;;;;0CASJ,KAAK;;oBAE3B,QAAQ,SAAS,SAAS;oBAC1B,KAAK,SAAS,QAAQ;YAC9B,KAAK,YAAa,cAAc,MAAM,SAAU,GAAG,EAAE;YACrD,KAAK,aAAa,KAAK,EAAE;;;;CAInC;;EAEyB,KAAA,SAAA,UAAU,iCAAY;;AACjD;AA9DG,WAAA,CAAA,SAAS,EAAC,MAAM,OAAM,CAAC,CAAA,GAAA,yBAAA,WAAA,SAAA,KAAA,CAAA;AACvB,WAAA,CAAA,SAAS,EAAC,MAAM,QAAO,CAAC,CAAA,GAAA,yBAAA,WAAA,UAAA,KAAA,CAAA;AACxB,WAAA,CAAA,SAAS,EAAC,MAAM,QAAO,CAAC,CAAA,GAAA,yBAAA,WAAA,YAAA,KAAA,CAAA;AAJ1B,2BAAA,WAAA,CAAA,cAAc,+BAA+B,CAAA,GAAA,wBAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oicl/openbridge-webcomponents",
3
- "version": "2.1.0-next.2",
3
+ "version": "2.1.0-next.3",
4
4
  "type": "module",
5
5
  "repository": {
6
6
  "type": "git",