mbg-val-input 0.0.1 → 0.1.0

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.
package/demo/index.html CHANGED
@@ -6,25 +6,124 @@
6
6
  <style>
7
7
  body {
8
8
  background: #fafafa;
9
+ font-family: sans-serif;
10
+ }
11
+
12
+ h1 {
13
+ margin: 1rem;
14
+ }
15
+
16
+ #container {
17
+ display: flex;
18
+ min-height: 100vh;
19
+ }
20
+
21
+ #demo {
22
+ background-color: whitesmoke;
23
+ padding: 0 1rem 1rem 1rem;
24
+ width: 50%;
25
+ }
26
+
27
+ #selector {
28
+ background-color: gainsboro;
29
+ padding: 0 1rem 1rem 1rem;
30
+ width: 50%;
31
+ }
32
+
33
+ #submit {
34
+ margin-top: 2rem;
35
+ padding: 0.5rem 2rem;
36
+ font-weight: bold;
9
37
  }
10
38
  </style>
11
39
  </head>
12
40
  <body>
13
- <div id="demo"></div>
41
+ <h1>mbg-val-input Demo</h1>
42
+ <div id="container">
43
+ <div id="demo"></div>
44
+ <div id="selector">
45
+ <form id="bType">
46
+ <h2>Select a bType to demo</h2>
47
+ <label for="bTypeSelect">bType:</label>
48
+ <select id="bTypeSelect">
49
+ <option value="">---</option>
50
+ <option value="BOOLEAN" desc="Boolean">Boolean</option>
51
+ <option value="INT8" desc="Integer size 8">Integer size 8</option>
52
+ <option value="INT16">Integer size 16</option>
53
+ <option value="INT24">Integer size 24</option>
54
+ <option value="INT32">Integer size 32</option>
55
+ <option value="INT64">Integer size 64</option>
56
+ <option value="INT128">Integer size 128</option>
57
+ <option value="INT8U">Unsigned Integer size 8</option>
58
+ <option value="INT16U">Unsigned Integer size 16</option>
59
+ <option value="INT24U">Unsigned Integer size 24</option>
60
+ <option value="INT32U">Unsigned Integer size 32</option>
61
+ <option value="FLOAT32">Float size 32</option>
62
+ <option value="FLOAT64">Float size 64</option>
63
+ <option value="Octet6">Octet String size 6</option>
64
+ <option value="Octet16">Octet String size 16</option>
65
+ <option value="Octet64">Octet String size 64</option>
66
+ <option value="VisString32">Visible String size 32</option>
67
+ <option value="VisString64">Visible String size 64</option>
68
+ <option value="VisString65">Visible String size 65</option>
69
+ <option value="VisString129">Visible String size 129</option>
70
+ <option value="VisString255">Visible String size 255</option>
71
+ <option value="Unicode255">Unicode String size 255</option>
72
+ <option value="Quality">Quality</option>
73
+ <option value="Currency">Currency</option>
74
+ </select>
75
+ </form>
76
+
77
+ <form id="label">
78
+ <h2>Set a Label</h2>
79
+ <label for="labelInput">Label:</label>
80
+ <input type="text" id="labelInput">
81
+ </form>
82
+
83
+ <form id="default">
84
+ <h2>Set a Default Value</h2>
85
+ <label for="defaultInput">Default Value:</label>
86
+ <input type="text" id="defaultInput">
87
+ </form>
14
88
 
89
+ <button id="submit" type="submit">Submit</button>
90
+ </div>
91
+ </div>
15
92
  <script type="module">
16
93
  import { html, render } from 'lit';
17
94
  import '../dist/src/mbg-val-input.js';
18
95
 
19
- const header = 'Hello owc World!';
20
- render(
21
- html`
22
- <mbg-val-input .header=${header}>
23
- some light-dom
24
- </mbg-val-input>
25
- `,
26
- document.querySelector('#demo')
27
- );
96
+ document.querySelector('#submit').addEventListener('click', (e) => {
97
+ e.preventDefault();
98
+ const bType = document.querySelector('#bTypeSelect').value;
99
+ const label = document.querySelector('#labelInput').value;
100
+ const defaultVal = document.querySelector('#defaultInput').value;
101
+ render(
102
+ html`
103
+ <div>
104
+ <h2>Please enter a value: ${bType}</h2>
105
+ <mbg-val-input bType="${bType}" label="${label}" default="${defaultVal}">
106
+ </mbg-val-input>
107
+ </div>
108
+ `,
109
+ document.querySelector('#demo')
110
+ );
111
+ });
112
+
113
+ document.querySelector('#selector').addEventListener('keypress', (e) => {
114
+ if (e.key === 'Enter') {
115
+ e.preventDefault();
116
+ document.querySelector('#submit').click();
117
+ }
118
+ });
119
+
120
+ document.querySelector('#bTypeSelect').addEventListener('change', (e) => {
121
+ e.preventDefault();
122
+ document.querySelector('#labelInput').value = '';
123
+ document.querySelector('#defaultInput').value = '';
124
+ document.querySelector('#submit').click();
125
+ });
126
+
28
127
  </script>
29
128
  </body>
30
129
  </html>
@@ -1,5 +1,7 @@
1
1
  import { LitElement, TemplateResult } from 'lit';
2
2
  import '@material/web/textfield/outlined-text-field.js';
3
+ import '@material/web/select/filled-select.js';
4
+ import '@material/web/select/select-option.js';
3
5
  import '@material/web/switch/switch.js';
4
6
  /** Web Component for inputting IEC61850-6 "Val" values */
5
7
  export declare class MbgValInput extends LitElement {
@@ -9,7 +11,18 @@ export declare class MbgValInput extends LitElement {
9
11
  enumVals: string[];
10
12
  label: string;
11
13
  input?: HTMLInputElement;
14
+ private updateValue;
15
+ private parseBTypeSize;
16
+ private handleBigIntInput;
17
+ private handleIntInput;
12
18
  intInput(size: 8 | 16 | 24 | 32 | 64 | 128, signed?: boolean): TemplateResult<1>;
19
+ private handleFloatInput;
20
+ floatInput(): TemplateResult<1>;
21
+ private handleOctetInput;
22
+ octetInput(size: 6 | 16 | 64): TemplateResult<1>;
23
+ private handleStringInput;
24
+ stringInput(size: 32 | 64 | 65 | 129 | 255): TemplateResult<1>;
25
+ qualityInput(): TemplateResult<1>;
13
26
  get value(): string;
14
27
  set value(val: string);
15
28
  get inputs(): Partial<Record<string, TemplateResult>>;
@@ -2,40 +2,302 @@ import { __decorate } from "tslib";
2
2
  /* eslint-disable import/no-extraneous-dependencies */
3
3
  import { html, css, LitElement, nothing } from 'lit';
4
4
  import { property, query } from 'lit/decorators.js';
5
+ import { currencyInput } from './currency-input.js';
5
6
  import '@material/web/textfield/outlined-text-field.js';
7
+ import '@material/web/select/filled-select.js';
8
+ import '@material/web/select/select-option.js';
6
9
  import '@material/web/switch/switch.js';
7
10
  function xmlBoolean(val) {
8
- return ['true', '1'].includes(val?.toLowerCase().trim() ?? "false");
11
+ return ['true', '1'].includes(val?.toLowerCase().trim() ?? 'false');
12
+ }
13
+ function isValidInt(value, size, signed) {
14
+ const min = signed ? -(2 ** (size - 1)) : 0;
15
+ const max = signed ? 2 ** (size - 1) - 1 : 2 ** size - 1;
16
+ return value >= min && value <= max;
17
+ }
18
+ function isValidBigInt(value, size) {
19
+ if (size === 64) {
20
+ return value >= -9223372036854775808n && value <= 9223372036854775807n;
21
+ }
22
+ if (size === 128) {
23
+ return (value >= -170141183460469231731687303715884105728n &&
24
+ value <= 170141183460469231731687303715884105727n);
25
+ }
26
+ return false;
27
+ }
28
+ function sanitizeAndValidateInt(value, size, isUserInput, isSigned = true) {
29
+ // allow leading negative sign
30
+ const signed = value[0] === '-' ? '-' : '';
31
+ const negative = signed === '-';
32
+ // remove leading zeros and invalid characters
33
+ let sanitized = value.replace(/[^0-9]/g, '').replace(/^0+(?=\d)/, '');
34
+ // handle special cases
35
+ if (negative && !sanitized.startsWith('-')) {
36
+ sanitized = signed + sanitized;
37
+ }
38
+ if (sanitized === '-0') {
39
+ sanitized = '0';
40
+ }
41
+ // ensure input was properly sanitized
42
+ const intRegex = /^-?\d*$/;
43
+ if (!intRegex.test(sanitized)) {
44
+ return '';
45
+ }
46
+ // allow leading negative sign only if it is from user input
47
+ if (sanitized === '') {
48
+ if (isUserInput) {
49
+ return sanitized;
50
+ }
51
+ return '';
52
+ }
53
+ // parse and validate
54
+ if (sanitized !== '') {
55
+ if (size === 64 || size === 128) {
56
+ const parsedValue = BigInt(sanitized);
57
+ if (Number.isNaN(parsedValue) || !isValidBigInt(parsedValue, size)) {
58
+ return '';
59
+ }
60
+ }
61
+ else {
62
+ const parsedValue = Number(sanitized);
63
+ if (Number.isNaN(parsedValue) ||
64
+ !isValidInt(parsedValue, size, isSigned)) {
65
+ return '';
66
+ }
67
+ }
68
+ }
69
+ return sanitized;
70
+ }
71
+ function isValidFloat(value, size) {
72
+ if (size === 32) {
73
+ return value >= -3.4028235e38 && value <= 3.4028235e38;
74
+ }
75
+ if (size === 64) {
76
+ return value >= -1.7976931348623157e308 && value <= 1.7976931348623157e308;
77
+ }
78
+ return false;
79
+ }
80
+ /** Removes invalid characters and validates the float value input */
81
+ function sanitizeAndValidateFloat(value, isUserInput, size) {
82
+ let sanitized = '';
83
+ // allow leading negative sign
84
+ const signed = value[0] === '-' ? '-' : '';
85
+ const negative = signed === '-';
86
+ // account for Euler's number
87
+ if (value === 'e' || value === '-e') {
88
+ sanitized = '2.7182818284590452354';
89
+ return signed + sanitized;
90
+ }
91
+ // remove leading zeros and invalid characters
92
+ sanitized = value
93
+ .replace(/[^0-9eE.+-]/g, '')
94
+ .replace(/(?<![eE])\+|(?<![eE])-/, '');
95
+ // handle multiple exponents
96
+ const numExponents = sanitized.split(/[eE]/).length - 1;
97
+ if (numExponents > 1) {
98
+ sanitized = sanitized.replace(/[eE].*?[eE]/g, 'E0');
99
+ }
100
+ if (sanitized.endsWith('e') || sanitized.endsWith('E')) {
101
+ sanitized += '0';
102
+ }
103
+ // handle multiple decimal points
104
+ const numDecimalPoints = sanitized.split('.').length - 1;
105
+ if (numDecimalPoints > 1) {
106
+ sanitized = sanitized.replace(/\.(?=.*\.)/g, '');
107
+ }
108
+ // remove leading zeros
109
+ sanitized = sanitized.replace(/^0+(?=\d)/, '');
110
+ sanitized = sanitized.replace(/^-0+(?=\d)/, '-');
111
+ // handle special cases
112
+ if (sanitized === '0e' || sanitized === '-0e') {
113
+ return '0';
114
+ }
115
+ if (negative && !sanitized.startsWith('-')) {
116
+ sanitized = signed + sanitized;
117
+ }
118
+ if (sanitized === '.') {
119
+ sanitized = '0.';
120
+ }
121
+ // ensure input was properly sanitized
122
+ const floatRegex = /^-?\d*(\.\d*)?([eE][-+]?\d*)?$/;
123
+ if (!floatRegex.test(sanitized)) {
124
+ return '';
125
+ }
126
+ // allow leading negative sign only if it is from user input
127
+ if (sanitized === '-') {
128
+ if (isUserInput) {
129
+ return sanitized;
130
+ }
131
+ return '';
132
+ }
133
+ // parse into float and validate
134
+ if (sanitized !== '') {
135
+ const parsedValue = parseFloat(sanitized);
136
+ if (Number.isNaN(parsedValue) || !isValidFloat(parsedValue, size)) {
137
+ return '';
138
+ }
139
+ }
140
+ return sanitized;
141
+ }
142
+ function sanitizeOctet(value) {
143
+ return value.replace(/[^0-9a-fA-F]/g, '');
9
144
  }
10
145
  /** Web Component for inputting IEC61850-6 "Val" values */
11
146
  export class MbgValInput extends LitElement {
12
147
  constructor() {
13
148
  super(...arguments);
14
149
  // If the DA/BDA is assigned a Val in DataTypeTemplates
15
- this.default = "";
150
+ this.default = '';
16
151
  // if bType === "Enum"
17
152
  this.enumVals = [];
18
153
  this.label = 'Val';
19
154
  }
155
+ updateValue(event, userValue) {
156
+ this.value = userValue;
157
+ // eslint-disable-next-line no-param-reassign
158
+ event.target.value = userValue;
159
+ }
160
+ parseBTypeSize() {
161
+ const match = this.bType?.match(/INT(\d+)/);
162
+ return match ? parseInt(match[1], 10) : 0;
163
+ }
164
+ handleBigIntInput(event) {
165
+ const input = event.target.value;
166
+ const validatedInput = sanitizeAndValidateInt(input, this.parseBTypeSize(), true);
167
+ const validatedDefault = sanitizeAndValidateInt(this.default, this.parseBTypeSize(), false);
168
+ if (validatedInput === '') {
169
+ this.updateValue(event, validatedDefault ?? '0');
170
+ return;
171
+ }
172
+ this.updateValue(event, validatedInput);
173
+ }
174
+ handleIntInput(event) {
175
+ const input = event.target.value;
176
+ const signed = !this.bType?.endsWith('U');
177
+ const validatedDefault = sanitizeAndValidateInt(this.default, this.parseBTypeSize(), false, signed);
178
+ // set default if input is empty
179
+ if (input === '') {
180
+ this.updateValue(event, validatedDefault ?? 0);
181
+ }
182
+ }
20
183
  intInput(size, signed = true) {
21
184
  const min = signed ? -(2 ** (size - 1)) : 0;
22
- const max = signed ? 2 ** (size - 1) - 1 : 2 ** (size) - 1;
185
+ const max = signed ? 2 ** (size - 1) - 1 : 2 ** size - 1;
186
+ const validatedDefault = sanitizeAndValidateInt(this.default, this.parseBTypeSize(), false, signed);
23
187
  if (size > 52) {
24
- return html `<md-outlined-text-field id="input" label="${this.label}" type="number" step="1" value="${this.default ?? nothing}"></md-outlined-text-field>`;
188
+ return html `<md-outlined-text-field
189
+ id="input"
190
+ label="${this.label}"
191
+ type="text"
192
+ value="${validatedDefault ?? nothing}"
193
+ @input="${this.handleBigIntInput}"
194
+ ></md-outlined-text-field>`;
195
+ }
196
+ return html `<md-outlined-text-field
197
+ id="input"
198
+ label="${this.label}"
199
+ type="number"
200
+ step="1"
201
+ min="${min}"
202
+ max="${max}"
203
+ value="${validatedDefault ?? nothing}"
204
+ @input="${this.handleIntInput}"
205
+ ></md-outlined-text-field>`;
206
+ }
207
+ handleFloatInput(event) {
208
+ const input = event.target.value;
209
+ const validatedInput = sanitizeAndValidateFloat(input, true, this.bType === 'FLOAT32' ? 32 : 64);
210
+ const validatedDefault = sanitizeAndValidateFloat(this.default, false, this.bType === 'FLOAT32' ? 32 : 64);
211
+ if (validatedInput === '') {
212
+ this.updateValue(event, validatedDefault ?? '0');
213
+ return;
214
+ }
215
+ this.updateValue(event, validatedInput);
216
+ }
217
+ floatInput() {
218
+ const validatedDefault = sanitizeAndValidateFloat(this.default, false, this.bType === 'FLOAT32' ? 32 : 64);
219
+ return html `
220
+ <md-outlined-text-field
221
+ id="$input"
222
+ label="${this.label}"
223
+ type="text"
224
+ value="${validatedDefault ?? nothing}"
225
+ @input="${this.handleFloatInput}"
226
+ ></md-outlined-text-field>
227
+ `;
228
+ }
229
+ handleOctetInput(event) {
230
+ const input = event.target.value;
231
+ let sanitizedInput = sanitizeOctet(input);
232
+ if (sanitizedInput === '') {
233
+ sanitizedInput = sanitizeOctet(this.default) ?? '';
25
234
  }
26
- return html `<md-outlined-text-field id="input" label="${this.label}" type="number" step="1" min="${min}" max="${max}" value="${this.default ?? nothing}"></md-outlined-text-field>`;
235
+ this.updateValue(event, sanitizedInput);
236
+ }
237
+ octetInput(size) {
238
+ return html `
239
+ <md-outlined-text-field
240
+ id="input"
241
+ label="${this.label}"
242
+ value="${sanitizeOctet(this.default) ?? nothing}"
243
+ maxlength="${size * 2}"
244
+ @input="${this.handleOctetInput}"
245
+ ></md-outlined-text-field>
246
+ `;
247
+ }
248
+ handleStringInput(event) {
249
+ let input = event.target.value;
250
+ if (input === '') {
251
+ input = this.default ?? '';
252
+ }
253
+ this.updateValue(event, input);
254
+ }
255
+ stringInput(size) {
256
+ return html `
257
+ <md-outlined-text-field
258
+ id="input"
259
+ label="${this.label}"
260
+ value="${this.default ?? nothing}"
261
+ maxlength="${size}"
262
+ @input="${this.handleStringInput}"
263
+ ></md-outlined-text-field>
264
+ `;
265
+ }
266
+ qualityInput() {
267
+ return html `
268
+ <md-filled-select id="input" label="${this.label}">
269
+ <md-select-option value="QUALITY_VALIDITY_GOOD" ?selected=${this.default === 'QUALITY_VALIDITY_GOOD'}>
270
+ <div slot="headline">QUALITY_VALIDITY_GOOD</div>
271
+ </md-select-option>
272
+ <md-select-option value="QUALITY_VALIDITY_INVALID" ?selected=${this.default === 'QUALITY_VALIDITY_INVALID'}>
273
+ <div slot="headline">QUALITY_VALIDITY_INVALID</div>
274
+ </md-select-option>
275
+ </md-select-option>
276
+ <md-select-option value="QUALITY_VALIDITY_RESERVED" ?selected=${this.default === 'QUALITY_VALIDITY_RESERVED'}>
277
+ <div slot="headline">QUALITY_VALIDITY_RESERVED</div>
278
+ </md-select-option>
279
+ </md-select-option>
280
+ <md-select-option value="QUALITY_VALIDITY_QUESTIONABLE" ?selected=${this.default === 'QUALITY_VALIDITY_QUESTIONABLE'}>
281
+ <div slot="headline">QUALITY_VALIDITY_QUESTIONABLE</div>
282
+ </md-select-option>
283
+ </md-filled-select>
284
+ `;
27
285
  }
28
286
  get value() {
29
287
  if (this.bType === 'BOOLEAN') {
30
- return this.input.selected ? "true" : "false";
288
+ return this.input.selected ? 'true' : 'false';
31
289
  }
32
- return this.input?.value ?? "";
290
+ return this.input?.value ?? '';
33
291
  }
34
292
  set value(val) {
35
293
  this.input?.setAttribute('value', val);
36
294
  }
37
295
  get inputs() {
38
- return { BOOLEAN: html `<label>${this.label} <md-switch id="input" ?selected=${xmlBoolean(this.default)}></md-switch></label>`,
296
+ return {
297
+ BOOLEAN: html `<label
298
+ >${this.label}
299
+ <md-switch id="input" ?selected=${xmlBoolean(this.default)}></md-switch
300
+ ></label>`,
39
301
  INT8: this.intInput(8),
40
302
  INT16: this.intInput(16),
41
303
  INT24: this.intInput(24),
@@ -45,14 +307,32 @@ export class MbgValInput extends LitElement {
45
307
  INT8U: this.intInput(8, false),
46
308
  INT16U: this.intInput(16, false),
47
309
  INT24U: this.intInput(24, false),
48
- INT32U: this.intInput(32, false), };
310
+ INT32U: this.intInput(32, false),
311
+ FLOAT32: this.floatInput(),
312
+ FLOAT64: this.floatInput(),
313
+ Octet6: this.octetInput(6),
314
+ Octet16: this.octetInput(16),
315
+ Octet64: this.octetInput(64),
316
+ VisString32: this.stringInput(32),
317
+ VisString64: this.stringInput(64),
318
+ VisString65: this.stringInput(65),
319
+ VisString129: this.stringInput(129),
320
+ VisString255: this.stringInput(255),
321
+ Unicode255: this.stringInput(255),
322
+ Quality: this.qualityInput(),
323
+ Currency: currencyInput(this.label, this.default),
324
+ };
49
325
  }
50
326
  render() {
51
- return this.inputs[this.bType ?? ''] ?? html `<md-outlined-text-field id="input" label="${this.label}" value="${this.default ?? nothing}"></md-outlined-text-field>`;
327
+ return (this.inputs[this.bType ?? ''] ??
328
+ html `<md-outlined-text-field
329
+ id="input"
330
+ label="${this.label}"
331
+ value="${this.default ?? nothing}"
332
+ ></md-outlined-text-field>`);
52
333
  }
53
334
  }
54
- MbgValInput.styles = css `
55
- `;
335
+ MbgValInput.styles = css ``;
56
336
  __decorate([
57
337
  property({ type: String })
58
338
  ], MbgValInput.prototype, "bType", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"MbgValInput.js","sourceRoot":"","sources":["../../src/MbgValInput.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable import/no-extraneous-dependencies */\nimport { html, css, LitElement, TemplateResult, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport type { MdSwitch } from '@material/web/switch/switch.js';\n\nimport '@material/web/textfield/outlined-text-field.js';\nimport '@material/web/switch/switch.js';\n\nfunction xmlBoolean(val?: string) {\n return ['true', '1'].includes(val?.toLowerCase().trim()??\"false\");\n}\n\n/** Web Component for inputting IEC61850-6 \"Val\" values */\nexport class MbgValInput extends LitElement {\n static styles = css`\n `;\n\n @property({ type: String }) bType?: string;\n \n // If the DA/BDA is assigned a Val in DataTypeTemplates\n @property({ type: String }) default = \"\";\n\n // if bType === \"Enum\"\n @property({ type: Array }) enumVals: string[] = [];\n\n @property({type: String}) label = 'Val';\n\n @query('#input') input?: HTMLInputElement;\n\n intInput(size: 8 | 16 | 24 | 32 | 64 | 128, signed = true) {\n const min = signed? -(2**(size-1)) : 0;\n const max = signed? 2**(size-1)-1 : 2**(size)-1;\n\n if (size > 52) {\n return html`<md-outlined-text-field id=\"input\" label=\"${this.label}\" type=\"number\" step=\"1\" value=\"${this.default??nothing}\"></md-outlined-text-field>`;\n }\n\n return html`<md-outlined-text-field id=\"input\" label=\"${this.label}\" type=\"number\" step=\"1\" min=\"${min}\" max=\"${max}\" value=\"${this.default??nothing}\"></md-outlined-text-field>`;\n }\n\n get value() {\n if (this.bType === 'BOOLEAN') {\n return (this.input as unknown as MdSwitch).selected? \"true\" : \"false\";\n }\n return this.input?.value??\"\";\n }\n\n set value(val: string) {\n this.input?.setAttribute('value', val);\n }\n\n get inputs(): Partial<Record<string, TemplateResult>> {\n return {BOOLEAN: html`<label>${this.label} <md-switch id=\"input\" ?selected=${xmlBoolean(this.default)}></md-switch></label>`,\n INT8: this.intInput(8),\n INT16: this.intInput(16),\n INT24: this.intInput(24),\n INT32: this.intInput(32),\n INT64: this.intInput(64),\n INT128: this.intInput(128),\n INT8U: this.intInput(8, false),\n INT16U: this.intInput(16, false),\n INT24U: this.intInput(24, false),\n INT32U: this.intInput(32, false),};\n }\n\n render() {\n return this.inputs[this.bType??'']??html`<md-outlined-text-field id=\"input\" label=\"${this.label}\" value=\"${this.default??nothing}\"></md-outlined-text-field>`;\n }\n}\n"]}
1
+ {"version":3,"file":"MbgValInput.js","sourceRoot":"","sources":["../../src/MbgValInput.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable import/no-extraneous-dependencies */\nimport { html, css, LitElement, TemplateResult, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport type { MdSwitch } from '@material/web/switch/switch.js';\nimport { currencyInput } from './currency-input.js';\n\nimport '@material/web/textfield/outlined-text-field.js';\nimport '@material/web/select/filled-select.js';\nimport '@material/web/select/select-option.js';\nimport '@material/web/switch/switch.js';\n\nfunction xmlBoolean(val?: string) {\n return ['true', '1'].includes(val?.toLowerCase().trim() ?? 'false');\n}\n\nfunction isValidInt(value: number, size: number, signed: boolean): boolean {\n const min = signed ? -(2 ** (size - 1)) : 0;\n const max = signed ? 2 ** (size - 1) - 1 : 2 ** size - 1;\n return value >= min && value <= max;\n}\n\nfunction isValidBigInt(value: bigint, size: 64 | 128): boolean {\n if (size === 64) {\n return value >= -9223372036854775808n && value <= 9223372036854775807n;\n }\n if (size === 128) {\n return (\n value >= -170141183460469231731687303715884105728n &&\n value <= 170141183460469231731687303715884105727n\n );\n }\n return false;\n}\n\nfunction sanitizeAndValidateInt(\n value: string,\n size: number,\n isUserInput: boolean,\n isSigned = true,\n) {\n // allow leading negative sign\n const signed = value[0] === '-' ? '-' : '';\n const negative = signed === '-';\n\n // remove leading zeros and invalid characters\n let sanitized = value.replace(/[^0-9]/g, '').replace(/^0+(?=\\d)/, '');\n\n // handle special cases\n if (negative && !sanitized.startsWith('-')) {\n sanitized = signed + sanitized;\n }\n if (sanitized === '-0') {\n sanitized = '0';\n }\n\n // ensure input was properly sanitized\n const intRegex = /^-?\\d*$/;\n if (!intRegex.test(sanitized)) {\n return '';\n }\n\n // allow leading negative sign only if it is from user input\n if (sanitized === '') {\n if (isUserInput) {\n return sanitized;\n }\n return '';\n }\n\n // parse and validate\n if (sanitized !== '') {\n if (size === 64 || size === 128) {\n const parsedValue = BigInt(sanitized);\n if (Number.isNaN(parsedValue) || !isValidBigInt(parsedValue, size)) {\n return '';\n }\n } else {\n const parsedValue = Number(sanitized);\n if (\n Number.isNaN(parsedValue) ||\n !isValidInt(parsedValue, size, isSigned)\n ) {\n return '';\n }\n }\n }\n\n return sanitized;\n}\n\nfunction isValidFloat(value: number, size: 32 | 64): boolean {\n if (size === 32) {\n return value >= -3.4028235e38 && value <= 3.4028235e38;\n }\n if (size === 64) {\n return value >= -1.7976931348623157e308 && value <= 1.7976931348623157e308;\n }\n return false;\n}\n\n/** Removes invalid characters and validates the float value input */\nfunction sanitizeAndValidateFloat(\n value: string,\n isUserInput: boolean,\n size: 32 | 64,\n) {\n let sanitized = '';\n\n // allow leading negative sign\n const signed = value[0] === '-' ? '-' : '';\n const negative = signed === '-';\n\n // account for Euler's number\n if (value === 'e' || value === '-e') {\n sanitized = '2.7182818284590452354';\n return signed + sanitized;\n }\n\n // remove leading zeros and invalid characters\n sanitized = value\n .replace(/[^0-9eE.+-]/g, '')\n .replace(/(?<![eE])\\+|(?<![eE])-/, '');\n\n // handle multiple exponents\n const numExponents = sanitized.split(/[eE]/).length - 1;\n if (numExponents > 1) {\n sanitized = sanitized.replace(/[eE].*?[eE]/g, 'E0');\n }\n if (sanitized.endsWith('e') || sanitized.endsWith('E')) {\n sanitized += '0';\n }\n\n // handle multiple decimal points\n const numDecimalPoints = sanitized.split('.').length - 1;\n if (numDecimalPoints > 1) {\n sanitized = sanitized.replace(/\\.(?=.*\\.)/g, '');\n }\n\n // remove leading zeros\n sanitized = sanitized.replace(/^0+(?=\\d)/, '');\n sanitized = sanitized.replace(/^-0+(?=\\d)/, '-');\n\n // handle special cases\n if (sanitized === '0e' || sanitized === '-0e') {\n return '0';\n }\n if (negative && !sanitized.startsWith('-')) {\n sanitized = signed + sanitized;\n }\n if (sanitized === '.') {\n sanitized = '0.';\n }\n\n // ensure input was properly sanitized\n const floatRegex = /^-?\\d*(\\.\\d*)?([eE][-+]?\\d*)?$/;\n if (!floatRegex.test(sanitized)) {\n return '';\n }\n\n // allow leading negative sign only if it is from user input\n if (sanitized === '-') {\n if (isUserInput) {\n return sanitized;\n }\n return '';\n }\n\n // parse into float and validate\n if (sanitized !== '') {\n const parsedValue = parseFloat(sanitized);\n if (Number.isNaN(parsedValue) || !isValidFloat(parsedValue, size)) {\n return '';\n }\n }\n\n return sanitized;\n}\n\nfunction sanitizeOctet(value: string) {\n return value.replace(/[^0-9a-fA-F]/g, '');\n}\n\n/** Web Component for inputting IEC61850-6 \"Val\" values */\nexport class MbgValInput extends LitElement {\n static styles = css``;\n\n @property({ type: String }) bType?: string;\n\n // If the DA/BDA is assigned a Val in DataTypeTemplates\n @property({ type: String }) default = '';\n\n // if bType === \"Enum\"\n @property({ type: Array }) enumVals: string[] = [];\n\n @property({ type: String }) label = 'Val';\n\n @query('#input') input?: HTMLInputElement;\n\n private updateValue(event: Event, userValue: string) {\n this.value = userValue;\n // eslint-disable-next-line no-param-reassign\n (event.target as HTMLInputElement).value = userValue;\n }\n\n private parseBTypeSize() {\n const match = this.bType?.match(/INT(\\d+)/);\n return match ? parseInt(match[1], 10) : 0;\n }\n\n private handleBigIntInput(event: Event) {\n const input = (event.target as HTMLInputElement).value;\n const validatedInput = sanitizeAndValidateInt(\n input,\n this.parseBTypeSize(),\n true,\n );\n const validatedDefault = sanitizeAndValidateInt(\n this.default,\n this.parseBTypeSize(),\n false,\n );\n\n if (validatedInput === '') {\n this.updateValue(event, validatedDefault ?? '0');\n return;\n }\n\n this.updateValue(event, validatedInput);\n }\n\n private handleIntInput(event: Event) {\n const input = (event.target as HTMLInputElement).value;\n const signed = !this.bType?.endsWith('U');\n const validatedDefault = sanitizeAndValidateInt(\n this.default,\n this.parseBTypeSize(),\n false,\n signed,\n );\n\n // set default if input is empty\n if (input === '') {\n this.updateValue(event, validatedDefault ?? 0);\n }\n }\n\n intInput(size: 8 | 16 | 24 | 32 | 64 | 128, signed = true) {\n const min = signed ? -(2 ** (size - 1)) : 0;\n const max = signed ? 2 ** (size - 1) - 1 : 2 ** size - 1;\n\n const validatedDefault = sanitizeAndValidateInt(\n this.default,\n this.parseBTypeSize(),\n false,\n signed,\n );\n\n if (size > 52) {\n return html`<md-outlined-text-field\n id=\"input\"\n label=\"${this.label}\"\n type=\"text\"\n value=\"${validatedDefault ?? nothing}\"\n @input=\"${this.handleBigIntInput}\"\n ></md-outlined-text-field>`;\n }\n\n return html`<md-outlined-text-field\n id=\"input\"\n label=\"${this.label}\"\n type=\"number\"\n step=\"1\"\n min=\"${min}\"\n max=\"${max}\"\n value=\"${validatedDefault ?? nothing}\"\n @input=\"${this.handleIntInput}\"\n ></md-outlined-text-field>`;\n }\n\n private handleFloatInput(event: Event) {\n const input = (event.target as HTMLInputElement).value;\n const validatedInput = sanitizeAndValidateFloat(\n input,\n true,\n this.bType === 'FLOAT32' ? 32 : 64,\n );\n const validatedDefault = sanitizeAndValidateFloat(\n this.default,\n false,\n this.bType === 'FLOAT32' ? 32 : 64,\n );\n\n if (validatedInput === '') {\n this.updateValue(event, validatedDefault ?? '0');\n return;\n }\n\n this.updateValue(event, validatedInput);\n }\n\n floatInput() {\n const validatedDefault = sanitizeAndValidateFloat(\n this.default,\n false,\n this.bType === 'FLOAT32' ? 32 : 64,\n );\n return html`\n <md-outlined-text-field\n id=\"$input\"\n label=\"${this.label}\"\n type=\"text\"\n value=\"${validatedDefault ?? nothing}\"\n @input=\"${this.handleFloatInput}\"\n ></md-outlined-text-field>\n `;\n }\n\n private handleOctetInput(event: Event) {\n const input = (event.target as HTMLInputElement).value;\n let sanitizedInput = sanitizeOctet(input);\n if (sanitizedInput === '') {\n sanitizedInput = sanitizeOctet(this.default) ?? '';\n }\n this.updateValue(event, sanitizedInput);\n }\n\n octetInput(size: 6 | 16 | 64) {\n return html`\n <md-outlined-text-field\n id=\"input\"\n label=\"${this.label}\"\n value=\"${sanitizeOctet(this.default) ?? nothing}\"\n maxlength=\"${size * 2}\"\n @input=\"${this.handleOctetInput}\"\n ></md-outlined-text-field>\n `;\n }\n\n private handleStringInput(event: Event) {\n let input = (event.target as HTMLInputElement).value;\n if (input === '') {\n input = this.default ?? '';\n }\n this.updateValue(event, input);\n }\n\n stringInput(size: 32 | 64 | 65 | 129 | 255) {\n return html`\n <md-outlined-text-field\n id=\"input\"\n label=\"${this.label}\"\n value=\"${this.default ?? nothing}\"\n maxlength=\"${size}\"\n @input=\"${this.handleStringInput}\"\n ></md-outlined-text-field>\n `;\n }\n\n qualityInput() {\n return html`\n <md-filled-select id=\"input\" label=\"${this.label}\">\n <md-select-option value=\"QUALITY_VALIDITY_GOOD\" ?selected=${this.default === 'QUALITY_VALIDITY_GOOD'}>\n <div slot=\"headline\">QUALITY_VALIDITY_GOOD</div>\n </md-select-option>\n <md-select-option value=\"QUALITY_VALIDITY_INVALID\" ?selected=${this.default === 'QUALITY_VALIDITY_INVALID'}>\n <div slot=\"headline\">QUALITY_VALIDITY_INVALID</div>\n </md-select-option>\n </md-select-option>\n <md-select-option value=\"QUALITY_VALIDITY_RESERVED\" ?selected=${this.default === 'QUALITY_VALIDITY_RESERVED'}>\n <div slot=\"headline\">QUALITY_VALIDITY_RESERVED</div>\n </md-select-option>\n </md-select-option>\n <md-select-option value=\"QUALITY_VALIDITY_QUESTIONABLE\" ?selected=${this.default === 'QUALITY_VALIDITY_QUESTIONABLE'}>\n <div slot=\"headline\">QUALITY_VALIDITY_QUESTIONABLE</div>\n </md-select-option>\n </md-filled-select>\n `;\n }\n\n get value() {\n if (this.bType === 'BOOLEAN') {\n return (this.input as unknown as MdSwitch).selected ? 'true' : 'false';\n }\n return this.input?.value ?? '';\n }\n\n set value(val: string) {\n this.input?.setAttribute('value', val);\n }\n\n get inputs(): Partial<Record<string, TemplateResult>> {\n return {\n BOOLEAN: html`<label\n >${this.label}\n <md-switch id=\"input\" ?selected=${xmlBoolean(this.default)}></md-switch\n ></label>`,\n INT8: this.intInput(8),\n INT16: this.intInput(16),\n INT24: this.intInput(24),\n INT32: this.intInput(32),\n INT64: this.intInput(64),\n INT128: this.intInput(128),\n INT8U: this.intInput(8, false),\n INT16U: this.intInput(16, false),\n INT24U: this.intInput(24, false),\n INT32U: this.intInput(32, false),\n FLOAT32: this.floatInput(),\n FLOAT64: this.floatInput(),\n Octet6: this.octetInput(6),\n Octet16: this.octetInput(16),\n Octet64: this.octetInput(64),\n VisString32: this.stringInput(32),\n VisString64: this.stringInput(64),\n VisString65: this.stringInput(65),\n VisString129: this.stringInput(129),\n VisString255: this.stringInput(255),\n Unicode255: this.stringInput(255),\n Quality: this.qualityInput(),\n Currency: currencyInput(this.label, this.default),\n };\n }\n\n render() {\n return (\n this.inputs[this.bType ?? ''] ??\n html`<md-outlined-text-field\n id=\"input\"\n label=\"${this.label}\"\n value=\"${this.default ?? nothing}\"\n ></md-outlined-text-field>`\n );\n }\n}\n"]}
@@ -0,0 +1,3 @@
1
+ import '@material/web/select/filled-select.js';
2
+ import '@material/web/select/select-option.js';
3
+ export declare function currencyInput(label: string, defaultVal: string): import("lit-html").TemplateResult<1>;