@3t-transform/threeteeui 0.1.21 → 0.1.22

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.
Files changed (120) hide show
  1. package/dist/cjs/{index-b8a62ede.js → index-dc6cc829.js} +2 -88
  2. package/dist/cjs/loader.cjs.js +3 -4
  3. package/dist/cjs/tttx-button.cjs.entry.js +24 -24
  4. package/dist/cjs/tttx-filter.cjs.entry.js +152 -152
  5. package/dist/cjs/tttx-form.cjs.entry.js +363 -363
  6. package/dist/cjs/tttx-icon.cjs.entry.js +11 -11
  7. package/dist/cjs/tttx-keyvalue-block.cjs.entry.js +59 -59
  8. package/dist/cjs/tttx-list.cjs.entry.js +43 -43
  9. package/dist/cjs/tttx-loading-spinner.cjs.entry.js +16 -16
  10. package/dist/cjs/tttx-sorter.cjs.entry.js +112 -0
  11. package/dist/cjs/tttx-standalone-input.cjs.entry.js +60 -60
  12. package/dist/cjs/tttx-toolbar.cjs.entry.js +10 -10
  13. package/dist/cjs/tttx.cjs.js +3 -7
  14. package/dist/collection/collection-manifest.json +3 -2
  15. package/dist/collection/components/atoms/tttx-button/tttx-button.js +110 -110
  16. package/dist/collection/components/atoms/tttx-button/tttx-button.stories.js +14 -14
  17. package/dist/collection/components/atoms/tttx-icon/tttx-icon.js +62 -62
  18. package/dist/collection/components/atoms/tttx-icon/tttx-icon.stories.js +22 -22
  19. package/dist/collection/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.js +109 -109
  20. package/dist/collection/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.stories.js +38 -38
  21. package/dist/collection/components/atoms/tttx-loading-spinner/tttx-loading-spinner.js +67 -67
  22. package/dist/collection/components/atoms/tttx-loading-spinner/tttx-loading-spinner.stories.js +17 -17
  23. package/dist/collection/components/molecules/tttx-filter/tttx-filter.js +325 -325
  24. package/dist/collection/components/molecules/tttx-filter/tttx-filter.stories.js +89 -89
  25. package/dist/collection/components/molecules/tttx-form/lib/setErrorState.js +35 -35
  26. package/dist/collection/components/molecules/tttx-form/lib/validityCheck.js +58 -58
  27. package/dist/collection/components/molecules/tttx-form/tttx-form.js +364 -364
  28. package/dist/collection/components/molecules/tttx-form/tttx-form.stories.js +127 -127
  29. package/dist/collection/components/molecules/tttx-list/tttx-list.js +105 -105
  30. package/dist/collection/components/molecules/tttx-list/tttx-list.stories.js +43 -43
  31. package/dist/collection/components/molecules/tttx-sorter/tttx-sorter.css +116 -0
  32. package/dist/collection/components/molecules/tttx-sorter/tttx-sorter.js +224 -0
  33. package/dist/collection/components/molecules/tttx-sorter/tttx-sorter.stories.js +47 -0
  34. package/dist/collection/components/molecules/tttx-standalone-input/tttx-standalone-input.js +627 -627
  35. package/dist/collection/components/molecules/tttx-standalone-input/tttx-standalone-input.stories.js +157 -157
  36. package/dist/collection/components/molecules/tttx-toolbar/tttx-toolbar.js +44 -44
  37. package/dist/collection/components/molecules/tttx-toolbar/tttx-toolbar.stories.js +14 -14
  38. package/dist/collection/components/palette.stories.js +7 -7
  39. package/dist/collection/docs/gettingstarted-developer.stories.js +5 -5
  40. package/dist/collection/icons.js +2838 -2838
  41. package/dist/collection/index.js +1 -1
  42. package/dist/collection/shared/domsanitiser.options.js +14 -14
  43. package/dist/components/index.d.ts +1 -9
  44. package/dist/components/index.js +2 -1
  45. package/dist/components/tttx-button.js +48 -48
  46. package/dist/components/tttx-filter.js +184 -184
  47. package/dist/components/tttx-form.js +380 -380
  48. package/dist/components/tttx-icon2.js +28 -28
  49. package/dist/components/tttx-keyvalue-block.js +76 -76
  50. package/dist/components/tttx-list.js +65 -65
  51. package/dist/components/tttx-loading-spinner.js +33 -33
  52. package/dist/components/tttx-sorter.d.ts +11 -0
  53. package/dist/components/tttx-sorter.js +141 -0
  54. package/dist/components/tttx-standalone-input.js +107 -107
  55. package/dist/components/tttx-toolbar.js +26 -26
  56. package/dist/esm/{index-e888a5f4.js → index-86faeaab.js} +3 -88
  57. package/dist/esm/loader.js +3 -4
  58. package/dist/esm/polyfills/core-js.js +0 -0
  59. package/dist/esm/polyfills/css-shim.js +1 -1
  60. package/dist/esm/polyfills/dom.js +0 -0
  61. package/dist/esm/polyfills/es5-html-element.js +0 -0
  62. package/dist/esm/polyfills/index.js +0 -0
  63. package/dist/esm/polyfills/system.js +0 -0
  64. package/dist/esm/tttx-button.entry.js +24 -24
  65. package/dist/esm/tttx-filter.entry.js +152 -152
  66. package/dist/esm/tttx-form.entry.js +363 -363
  67. package/dist/esm/tttx-icon.entry.js +11 -11
  68. package/dist/esm/tttx-keyvalue-block.entry.js +59 -59
  69. package/dist/esm/tttx-list.entry.js +43 -43
  70. package/dist/esm/tttx-loading-spinner.entry.js +16 -16
  71. package/dist/esm/tttx-sorter.entry.js +108 -0
  72. package/dist/esm/tttx-standalone-input.entry.js +60 -60
  73. package/dist/esm/tttx-toolbar.entry.js +10 -10
  74. package/dist/esm/tttx.js +3 -4
  75. package/dist/tttx/p-12fc0b16.entry.js +3 -0
  76. package/dist/tttx/p-52a47b7c.js +2 -0
  77. package/dist/tttx/p-5d9b6bc0.entry.js +1 -0
  78. package/dist/tttx/{p-41f5b296.entry.js → p-603f6ebe.entry.js} +1 -1
  79. package/dist/tttx/{p-e145951b.entry.js → p-72b4c98a.entry.js} +1 -1
  80. package/dist/tttx/{p-043f9b8a.entry.js → p-8f3badad.entry.js} +1 -1
  81. package/dist/tttx/{p-4cf3e1e0.entry.js → p-ae48fe5a.entry.js} +1 -1
  82. package/dist/tttx/{p-01f4628e.entry.js → p-bdb054b2.entry.js} +1 -1
  83. package/dist/tttx/{p-dc5c356b.entry.js → p-c72d1a03.entry.js} +1 -1
  84. package/dist/tttx/{p-96bbf1ed.entry.js → p-e25d5fe2.entry.js} +1 -1
  85. package/dist/tttx/{p-b3a03986.entry.js → p-f1d7eb35.entry.js} +1 -1
  86. package/dist/tttx/tttx.esm.js +1 -1
  87. package/dist/types/components/atoms/tttx-button/tttx-button.d.ts +10 -10
  88. package/dist/types/components/atoms/tttx-button/tttx-button.stories.d.ts +10 -10
  89. package/dist/types/components/atoms/tttx-icon/tttx-icon.d.ts +5 -5
  90. package/dist/types/components/atoms/tttx-icon/tttx-icon.stories.d.ts +20 -20
  91. package/dist/types/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.d.ts +7 -7
  92. package/dist/types/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.stories.d.ts +9 -9
  93. package/dist/types/components/atoms/tttx-loading-spinner/tttx-loading-spinner.d.ts +6 -6
  94. package/dist/types/components/atoms/tttx-loading-spinner/tttx-loading-spinner.stories.d.ts +17 -17
  95. package/dist/types/components/molecules/tttx-filter/tttx-filter.d.ts +37 -37
  96. package/dist/types/components/molecules/tttx-filter/tttx-filter.stories.d.ts +43 -43
  97. package/dist/types/components/molecules/tttx-form/lib/setErrorState.d.ts +13 -13
  98. package/dist/types/components/molecules/tttx-form/lib/validityCheck.d.ts +17 -17
  99. package/dist/types/components/molecules/tttx-form/tttx-form.d.ts +114 -114
  100. package/dist/types/components/molecules/tttx-form/tttx-form.stories.d.ts +13 -13
  101. package/dist/types/components/molecules/tttx-list/tttx-list.d.ts +11 -11
  102. package/dist/types/components/molecules/tttx-list/tttx-list.stories.d.ts +14 -14
  103. package/dist/types/components/molecules/tttx-sorter/interfaces.d.ts +9 -0
  104. package/dist/types/components/molecules/tttx-sorter/tttx-sorter.d.ts +19 -0
  105. package/dist/types/components/molecules/tttx-sorter/tttx-sorter.stories.d.ts +30 -0
  106. package/dist/types/components/molecules/tttx-standalone-input/tttx-standalone-input.d.ts +56 -56
  107. package/dist/types/components/molecules/tttx-standalone-input/tttx-standalone-input.stories.d.ts +123 -123
  108. package/dist/types/components/molecules/tttx-toolbar/tttx-toolbar.d.ts +4 -4
  109. package/dist/types/components/molecules/tttx-toolbar/tttx-toolbar.stories.d.ts +13 -13
  110. package/dist/types/components/palette.stories.d.ts +6 -6
  111. package/dist/types/components.d.ts +27 -0
  112. package/dist/types/docs/gettingstarted-developer.stories.d.ts +5 -5
  113. package/dist/types/icons.d.ts +2 -2
  114. package/dist/types/index.d.ts +1 -1
  115. package/dist/types/shared/domsanitiser.options.d.ts +10 -10
  116. package/dist/types/stencil-public-runtime.d.ts +3 -59
  117. package/loader/index.d.ts +0 -9
  118. package/package.json +1 -1
  119. package/dist/tttx/p-6dff6b5a.entry.js +0 -3
  120. package/dist/tttx/p-f764ffc4.js +0 -2
@@ -1,627 +1,627 @@
1
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
2
- import { Host, h } from '@stencil/core';
3
- export class TttxInput {
4
- constructor() {
5
- this.label = undefined;
6
- this.showerrormsg = undefined;
7
- this.showerrorbubble = true;
8
- this.errormsg = undefined;
9
- this.iconleft = undefined;
10
- this.iconright = undefined;
11
- this.inputicon = undefined;
12
- this.inline = undefined;
13
- this.inputAutocapitalize = undefined;
14
- this.inputAutofocus = undefined;
15
- this.inputKeyhint = undefined;
16
- this.inputIndex = undefined;
17
- this.inputTitle = undefined;
18
- this.autocomplete = undefined;
19
- this.checked = undefined;
20
- this.disabled = undefined;
21
- this.max = undefined;
22
- this.maxlength = undefined;
23
- this.min = undefined;
24
- this.minlength = undefined;
25
- this.name = undefined;
26
- this.pattern = undefined;
27
- this.placeholder = undefined;
28
- this.readonly = undefined;
29
- this.required = undefined;
30
- this.step = undefined;
31
- this.type = 'text';
32
- this.value = undefined;
33
- }
34
- handleChange(event) {
35
- const target = event.target;
36
- this.value = target.value;
37
- this.valueChanged.emit(target.value);
38
- }
39
- handleFocus(event) {
40
- const target = event.target;
41
- this.focusChanged.emit(target.value);
42
- }
43
- handleBlur(event) {
44
- const target = event.target;
45
- this.blurChanged.emit(target.value);
46
- }
47
- handleInvalid(event) {
48
- event.preventDefault();
49
- const target = event.target;
50
- this.invalidChanged.emit(target.value);
51
- }
52
- render() {
53
- const classNames = ['standalone', this.showerrormsg ? 'invalid' : ''].join(' ');
54
- return (h(Host, null, h("label", { class: this.inline ? 'inputInline' : 'inputBlock' }, this.label, !this.required ? h("span", { class: "optional" }, "\u00A0(optional)") : '', h("div", { class: "input-container" }, this.inputicon && (h("tttx-icon", { class: "input-icon", icon: this.inputicon, color: "grey" })), this.iconleft && (h("tttx-icon", { id: "icon-left", icon: this.iconleft, color: "grey" })), this.iconright && (h("tttx-icon", { id: "icon-right", icon: this.iconright, color: "grey" })), h("input", { class: classNames, autocapitalize: this.inputAutocapitalize, autofocus: this.inputAutofocus, enterkeyhint: this.inputKeyhint, tabindex: this.inputIndex, title: this.inputTitle, autocomplete: this.autocomplete, checked: this.checked, disabled: this.disabled, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readonly: this.readonly, required: this.required, step: this.step, type: this.type, value: this.value, onBlur: this.handleBlur.bind(this), onFocus: this.handleFocus.bind(this), onInput: this.handleChange.bind(this), onInvalid: this.handleInvalid.bind(this) }), this.showerrorbubble && (h("span", { class: ['errorBubble', this.showerrormsg && this.errormsg ? 'visible' : ''].join(' ') }, h("span", { class: "material-symbols-rounded validationicon" }, "warning"), " ", this.errormsg))))));
55
- }
56
- static get is() { return "tttx-standalone-input"; }
57
- static get encapsulation() { return "scoped"; }
58
- static get originalStyleUrls() {
59
- return {
60
- "$": ["./tttx-standalone-input.scss"]
61
- };
62
- }
63
- static get styleUrls() {
64
- return {
65
- "$": ["tttx-standalone-input.css"]
66
- };
67
- }
68
- static get properties() {
69
- return {
70
- "label": {
71
- "type": "string",
72
- "mutable": false,
73
- "complexType": {
74
- "original": "string",
75
- "resolved": "string",
76
- "references": {}
77
- },
78
- "required": false,
79
- "optional": false,
80
- "docs": {
81
- "tags": [],
82
- "text": ""
83
- },
84
- "attribute": "label",
85
- "reflect": false
86
- },
87
- "showerrormsg": {
88
- "type": "boolean",
89
- "mutable": false,
90
- "complexType": {
91
- "original": "boolean",
92
- "resolved": "boolean",
93
- "references": {}
94
- },
95
- "required": false,
96
- "optional": false,
97
- "docs": {
98
- "tags": [],
99
- "text": ""
100
- },
101
- "attribute": "showerrormsg",
102
- "reflect": false
103
- },
104
- "showerrorbubble": {
105
- "type": "boolean",
106
- "mutable": false,
107
- "complexType": {
108
- "original": "boolean",
109
- "resolved": "boolean",
110
- "references": {}
111
- },
112
- "required": false,
113
- "optional": false,
114
- "docs": {
115
- "tags": [],
116
- "text": ""
117
- },
118
- "attribute": "showerrorbubble",
119
- "reflect": false,
120
- "defaultValue": "true"
121
- },
122
- "errormsg": {
123
- "type": "string",
124
- "mutable": false,
125
- "complexType": {
126
- "original": "string",
127
- "resolved": "string",
128
- "references": {}
129
- },
130
- "required": false,
131
- "optional": false,
132
- "docs": {
133
- "tags": [],
134
- "text": ""
135
- },
136
- "attribute": "errormsg",
137
- "reflect": false
138
- },
139
- "iconleft": {
140
- "type": "string",
141
- "mutable": false,
142
- "complexType": {
143
- "original": "string",
144
- "resolved": "string",
145
- "references": {}
146
- },
147
- "required": false,
148
- "optional": false,
149
- "docs": {
150
- "tags": [],
151
- "text": ""
152
- },
153
- "attribute": "iconleft",
154
- "reflect": false
155
- },
156
- "iconright": {
157
- "type": "string",
158
- "mutable": false,
159
- "complexType": {
160
- "original": "string",
161
- "resolved": "string",
162
- "references": {}
163
- },
164
- "required": false,
165
- "optional": false,
166
- "docs": {
167
- "tags": [],
168
- "text": ""
169
- },
170
- "attribute": "iconright",
171
- "reflect": false
172
- },
173
- "inputicon": {
174
- "type": "string",
175
- "mutable": false,
176
- "complexType": {
177
- "original": "string",
178
- "resolved": "string",
179
- "references": {}
180
- },
181
- "required": false,
182
- "optional": false,
183
- "docs": {
184
- "tags": [],
185
- "text": ""
186
- },
187
- "attribute": "inputicon",
188
- "reflect": false
189
- },
190
- "inline": {
191
- "type": "boolean",
192
- "mutable": false,
193
- "complexType": {
194
- "original": "boolean",
195
- "resolved": "boolean",
196
- "references": {}
197
- },
198
- "required": false,
199
- "optional": false,
200
- "docs": {
201
- "tags": [],
202
- "text": ""
203
- },
204
- "attribute": "inline",
205
- "reflect": false
206
- },
207
- "inputAutocapitalize": {
208
- "type": "string",
209
- "mutable": false,
210
- "complexType": {
211
- "original": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'",
212
- "resolved": "\"characters\" | \"none\" | \"off\" | \"on\" | \"sentences\" | \"words\"",
213
- "references": {}
214
- },
215
- "required": false,
216
- "optional": false,
217
- "docs": {
218
- "tags": [],
219
- "text": ""
220
- },
221
- "attribute": "input-autocapitalize",
222
- "reflect": false
223
- },
224
- "inputAutofocus": {
225
- "type": "boolean",
226
- "mutable": false,
227
- "complexType": {
228
- "original": "boolean",
229
- "resolved": "boolean",
230
- "references": {}
231
- },
232
- "required": false,
233
- "optional": false,
234
- "docs": {
235
- "tags": [],
236
- "text": ""
237
- },
238
- "attribute": "input-autofocus",
239
- "reflect": false
240
- },
241
- "inputKeyhint": {
242
- "type": "string",
243
- "mutable": false,
244
- "complexType": {
245
- "original": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'",
246
- "resolved": "\"done\" | \"enter\" | \"go\" | \"next\" | \"previous\" | \"search\" | \"send\"",
247
- "references": {}
248
- },
249
- "required": false,
250
- "optional": false,
251
- "docs": {
252
- "tags": [],
253
- "text": "Defines what action to present for the enter key on virtual keyboards"
254
- },
255
- "attribute": "input-keyhint",
256
- "reflect": false
257
- },
258
- "inputIndex": {
259
- "type": "any",
260
- "mutable": false,
261
- "complexType": {
262
- "original": "string | number",
263
- "resolved": "number | string",
264
- "references": {}
265
- },
266
- "required": false,
267
- "optional": false,
268
- "docs": {
269
- "tags": [{
270
- "name": "example",
271
- "text": "<caption>In HTML (like `index.html`)</caption>\n<tttx-standalone-input input-index=\"1\" />"
272
- }, {
273
- "name": "example",
274
- "text": "<caption>In TSX files</caption>\n<tttx-standalone-input inputIndex={1} />"
275
- }],
276
- "text": "tabindex - Allows the HTML elements to be focusable"
277
- },
278
- "attribute": "input-index",
279
- "reflect": false
280
- },
281
- "inputTitle": {
282
- "type": "string",
283
- "mutable": false,
284
- "complexType": {
285
- "original": "string",
286
- "resolved": "string",
287
- "references": {}
288
- },
289
- "required": false,
290
- "optional": false,
291
- "docs": {
292
- "tags": [],
293
- "text": ""
294
- },
295
- "attribute": "input-title",
296
- "reflect": false
297
- },
298
- "autocomplete": {
299
- "type": "string",
300
- "mutable": false,
301
- "complexType": {
302
- "original": "'off' | 'on'",
303
- "resolved": "\"off\" | \"on\"",
304
- "references": {}
305
- },
306
- "required": false,
307
- "optional": false,
308
- "docs": {
309
- "tags": [],
310
- "text": ""
311
- },
312
- "attribute": "autocomplete",
313
- "reflect": false
314
- },
315
- "checked": {
316
- "type": "boolean",
317
- "mutable": false,
318
- "complexType": {
319
- "original": "boolean",
320
- "resolved": "boolean",
321
- "references": {}
322
- },
323
- "required": false,
324
- "optional": false,
325
- "docs": {
326
- "tags": [],
327
- "text": ""
328
- },
329
- "attribute": "checked",
330
- "reflect": false
331
- },
332
- "disabled": {
333
- "type": "boolean",
334
- "mutable": false,
335
- "complexType": {
336
- "original": "boolean",
337
- "resolved": "boolean",
338
- "references": {}
339
- },
340
- "required": false,
341
- "optional": false,
342
- "docs": {
343
- "tags": [],
344
- "text": ""
345
- },
346
- "attribute": "disabled",
347
- "reflect": false
348
- },
349
- "max": {
350
- "type": "any",
351
- "mutable": false,
352
- "complexType": {
353
- "original": "MinMaxDates | number",
354
- "resolved": "`${number}${number}${number}${number}-${number}${number}-${number}${number}T${number}${number}:${number}${number}` | `${number}${number}${number}${number}-${number}${number}-${number}${number}` | `${number}${number}${number}${number}-${number}${number}` | `${number}${number}${number}${number}-W${number}${number}` | `${number}${number}:${number}${number}` | number",
355
- "references": {
356
- "MinMaxDates": {
357
- "location": "local"
358
- }
359
- }
360
- },
361
- "required": false,
362
- "optional": false,
363
- "docs": {
364
- "tags": [],
365
- "text": ""
366
- },
367
- "attribute": "max",
368
- "reflect": false
369
- },
370
- "maxlength": {
371
- "type": "any",
372
- "mutable": false,
373
- "complexType": {
374
- "original": "string | number",
375
- "resolved": "number | string",
376
- "references": {}
377
- },
378
- "required": false,
379
- "optional": false,
380
- "docs": {
381
- "tags": [],
382
- "text": ""
383
- },
384
- "attribute": "maxlength",
385
- "reflect": false
386
- },
387
- "min": {
388
- "type": "any",
389
- "mutable": false,
390
- "complexType": {
391
- "original": "MinMaxDates | number",
392
- "resolved": "`${number}${number}${number}${number}-${number}${number}-${number}${number}T${number}${number}:${number}${number}` | `${number}${number}${number}${number}-${number}${number}-${number}${number}` | `${number}${number}${number}${number}-${number}${number}` | `${number}${number}${number}${number}-W${number}${number}` | `${number}${number}:${number}${number}` | number",
393
- "references": {
394
- "MinMaxDates": {
395
- "location": "local"
396
- }
397
- }
398
- },
399
- "required": false,
400
- "optional": false,
401
- "docs": {
402
- "tags": [],
403
- "text": ""
404
- },
405
- "attribute": "min",
406
- "reflect": false
407
- },
408
- "minlength": {
409
- "type": "any",
410
- "mutable": false,
411
- "complexType": {
412
- "original": "string | number",
413
- "resolved": "number | string",
414
- "references": {}
415
- },
416
- "required": false,
417
- "optional": false,
418
- "docs": {
419
- "tags": [],
420
- "text": ""
421
- },
422
- "attribute": "minlength",
423
- "reflect": false
424
- },
425
- "name": {
426
- "type": "string",
427
- "mutable": false,
428
- "complexType": {
429
- "original": "string",
430
- "resolved": "string",
431
- "references": {}
432
- },
433
- "required": false,
434
- "optional": false,
435
- "docs": {
436
- "tags": [],
437
- "text": ""
438
- },
439
- "attribute": "name",
440
- "reflect": false
441
- },
442
- "pattern": {
443
- "type": "string",
444
- "mutable": false,
445
- "complexType": {
446
- "original": "string",
447
- "resolved": "string",
448
- "references": {}
449
- },
450
- "required": false,
451
- "optional": false,
452
- "docs": {
453
- "tags": [],
454
- "text": ""
455
- },
456
- "attribute": "pattern",
457
- "reflect": false
458
- },
459
- "placeholder": {
460
- "type": "string",
461
- "mutable": false,
462
- "complexType": {
463
- "original": "string",
464
- "resolved": "string",
465
- "references": {}
466
- },
467
- "required": false,
468
- "optional": false,
469
- "docs": {
470
- "tags": [],
471
- "text": ""
472
- },
473
- "attribute": "placeholder",
474
- "reflect": false
475
- },
476
- "readonly": {
477
- "type": "any",
478
- "mutable": false,
479
- "complexType": {
480
- "original": "string | boolean",
481
- "resolved": "boolean | string",
482
- "references": {}
483
- },
484
- "required": false,
485
- "optional": false,
486
- "docs": {
487
- "tags": [],
488
- "text": ""
489
- },
490
- "attribute": "readonly",
491
- "reflect": false
492
- },
493
- "required": {
494
- "type": "boolean",
495
- "mutable": false,
496
- "complexType": {
497
- "original": "boolean",
498
- "resolved": "boolean",
499
- "references": {}
500
- },
501
- "required": false,
502
- "optional": false,
503
- "docs": {
504
- "tags": [],
505
- "text": ""
506
- },
507
- "attribute": "required",
508
- "reflect": false
509
- },
510
- "step": {
511
- "type": "any",
512
- "mutable": false,
513
- "complexType": {
514
- "original": "string | number",
515
- "resolved": "number | string",
516
- "references": {}
517
- },
518
- "required": false,
519
- "optional": false,
520
- "docs": {
521
- "tags": [],
522
- "text": ""
523
- },
524
- "attribute": "step",
525
- "reflect": false
526
- },
527
- "type": {
528
- "type": "string",
529
- "mutable": false,
530
- "complexType": {
531
- "original": "string",
532
- "resolved": "string",
533
- "references": {}
534
- },
535
- "required": false,
536
- "optional": false,
537
- "docs": {
538
- "tags": [],
539
- "text": ""
540
- },
541
- "attribute": "type",
542
- "reflect": false,
543
- "defaultValue": "'text'"
544
- },
545
- "value": {
546
- "type": "any",
547
- "mutable": true,
548
- "complexType": {
549
- "original": "string | number",
550
- "resolved": "number | string",
551
- "references": {}
552
- },
553
- "required": false,
554
- "optional": false,
555
- "docs": {
556
- "tags": [],
557
- "text": ""
558
- },
559
- "attribute": "value",
560
- "reflect": false
561
- }
562
- };
563
- }
564
- static get events() {
565
- return [{
566
- "method": "valueChanged",
567
- "name": "valueChanged",
568
- "bubbles": true,
569
- "cancelable": true,
570
- "composed": true,
571
- "docs": {
572
- "tags": [],
573
- "text": ""
574
- },
575
- "complexType": {
576
- "original": "string",
577
- "resolved": "string",
578
- "references": {}
579
- }
580
- }, {
581
- "method": "focusChanged",
582
- "name": "focusChanged",
583
- "bubbles": true,
584
- "cancelable": true,
585
- "composed": true,
586
- "docs": {
587
- "tags": [],
588
- "text": ""
589
- },
590
- "complexType": {
591
- "original": "string",
592
- "resolved": "string",
593
- "references": {}
594
- }
595
- }, {
596
- "method": "blurChanged",
597
- "name": "blurChanged",
598
- "bubbles": true,
599
- "cancelable": true,
600
- "composed": true,
601
- "docs": {
602
- "tags": [],
603
- "text": ""
604
- },
605
- "complexType": {
606
- "original": "string",
607
- "resolved": "string",
608
- "references": {}
609
- }
610
- }, {
611
- "method": "invalidChanged",
612
- "name": "invalidChanged",
613
- "bubbles": true,
614
- "cancelable": true,
615
- "composed": true,
616
- "docs": {
617
- "tags": [],
618
- "text": ""
619
- },
620
- "complexType": {
621
- "original": "string",
622
- "resolved": "string",
623
- "references": {}
624
- }
625
- }];
626
- }
627
- }
1
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
2
+ import { Host, h } from '@stencil/core';
3
+ export class TttxInput {
4
+ constructor() {
5
+ this.label = undefined;
6
+ this.showerrormsg = undefined;
7
+ this.showerrorbubble = true;
8
+ this.errormsg = undefined;
9
+ this.iconleft = undefined;
10
+ this.iconright = undefined;
11
+ this.inputicon = undefined;
12
+ this.inline = undefined;
13
+ this.inputAutocapitalize = undefined;
14
+ this.inputAutofocus = undefined;
15
+ this.inputKeyhint = undefined;
16
+ this.inputIndex = undefined;
17
+ this.inputTitle = undefined;
18
+ this.autocomplete = undefined;
19
+ this.checked = undefined;
20
+ this.disabled = undefined;
21
+ this.max = undefined;
22
+ this.maxlength = undefined;
23
+ this.min = undefined;
24
+ this.minlength = undefined;
25
+ this.name = undefined;
26
+ this.pattern = undefined;
27
+ this.placeholder = undefined;
28
+ this.readonly = undefined;
29
+ this.required = undefined;
30
+ this.step = undefined;
31
+ this.type = 'text';
32
+ this.value = undefined;
33
+ }
34
+ handleChange(event) {
35
+ const target = event.target;
36
+ this.value = target.value;
37
+ this.valueChanged.emit(target.value);
38
+ }
39
+ handleFocus(event) {
40
+ const target = event.target;
41
+ this.focusChanged.emit(target.value);
42
+ }
43
+ handleBlur(event) {
44
+ const target = event.target;
45
+ this.blurChanged.emit(target.value);
46
+ }
47
+ handleInvalid(event) {
48
+ event.preventDefault();
49
+ const target = event.target;
50
+ this.invalidChanged.emit(target.value);
51
+ }
52
+ render() {
53
+ const classNames = ['standalone', this.showerrormsg ? 'invalid' : ''].join(' ');
54
+ return (h(Host, null, h("label", { class: this.inline ? 'inputInline' : 'inputBlock' }, this.label, !this.required ? h("span", { class: "optional" }, "\u00A0(optional)") : '', h("div", { class: "input-container" }, this.inputicon && (h("tttx-icon", { class: "input-icon", icon: this.inputicon, color: "grey" })), this.iconleft && (h("tttx-icon", { id: "icon-left", icon: this.iconleft, color: "grey" })), this.iconright && (h("tttx-icon", { id: "icon-right", icon: this.iconright, color: "grey" })), h("input", { class: classNames, autocapitalize: this.inputAutocapitalize, autofocus: this.inputAutofocus, enterkeyhint: this.inputKeyhint, tabindex: this.inputIndex, title: this.inputTitle, autocomplete: this.autocomplete, checked: this.checked, disabled: this.disabled, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readonly: this.readonly, required: this.required, step: this.step, type: this.type, value: this.value, onBlur: this.handleBlur.bind(this), onFocus: this.handleFocus.bind(this), onInput: this.handleChange.bind(this), onInvalid: this.handleInvalid.bind(this) }), this.showerrorbubble && (h("span", { class: ['errorBubble', this.showerrormsg && this.errormsg ? 'visible' : ''].join(' ') }, h("span", { class: "material-symbols-rounded validationicon" }, "warning"), " ", this.errormsg))))));
55
+ }
56
+ static get is() { return "tttx-standalone-input"; }
57
+ static get encapsulation() { return "scoped"; }
58
+ static get originalStyleUrls() {
59
+ return {
60
+ "$": ["./tttx-standalone-input.scss"]
61
+ };
62
+ }
63
+ static get styleUrls() {
64
+ return {
65
+ "$": ["tttx-standalone-input.css"]
66
+ };
67
+ }
68
+ static get properties() {
69
+ return {
70
+ "label": {
71
+ "type": "string",
72
+ "mutable": false,
73
+ "complexType": {
74
+ "original": "string",
75
+ "resolved": "string",
76
+ "references": {}
77
+ },
78
+ "required": false,
79
+ "optional": false,
80
+ "docs": {
81
+ "tags": [],
82
+ "text": ""
83
+ },
84
+ "attribute": "label",
85
+ "reflect": false
86
+ },
87
+ "showerrormsg": {
88
+ "type": "boolean",
89
+ "mutable": false,
90
+ "complexType": {
91
+ "original": "boolean",
92
+ "resolved": "boolean",
93
+ "references": {}
94
+ },
95
+ "required": false,
96
+ "optional": false,
97
+ "docs": {
98
+ "tags": [],
99
+ "text": ""
100
+ },
101
+ "attribute": "showerrormsg",
102
+ "reflect": false
103
+ },
104
+ "showerrorbubble": {
105
+ "type": "boolean",
106
+ "mutable": false,
107
+ "complexType": {
108
+ "original": "boolean",
109
+ "resolved": "boolean",
110
+ "references": {}
111
+ },
112
+ "required": false,
113
+ "optional": false,
114
+ "docs": {
115
+ "tags": [],
116
+ "text": ""
117
+ },
118
+ "attribute": "showerrorbubble",
119
+ "reflect": false,
120
+ "defaultValue": "true"
121
+ },
122
+ "errormsg": {
123
+ "type": "string",
124
+ "mutable": false,
125
+ "complexType": {
126
+ "original": "string",
127
+ "resolved": "string",
128
+ "references": {}
129
+ },
130
+ "required": false,
131
+ "optional": false,
132
+ "docs": {
133
+ "tags": [],
134
+ "text": ""
135
+ },
136
+ "attribute": "errormsg",
137
+ "reflect": false
138
+ },
139
+ "iconleft": {
140
+ "type": "string",
141
+ "mutable": false,
142
+ "complexType": {
143
+ "original": "string",
144
+ "resolved": "string",
145
+ "references": {}
146
+ },
147
+ "required": false,
148
+ "optional": false,
149
+ "docs": {
150
+ "tags": [],
151
+ "text": ""
152
+ },
153
+ "attribute": "iconleft",
154
+ "reflect": false
155
+ },
156
+ "iconright": {
157
+ "type": "string",
158
+ "mutable": false,
159
+ "complexType": {
160
+ "original": "string",
161
+ "resolved": "string",
162
+ "references": {}
163
+ },
164
+ "required": false,
165
+ "optional": false,
166
+ "docs": {
167
+ "tags": [],
168
+ "text": ""
169
+ },
170
+ "attribute": "iconright",
171
+ "reflect": false
172
+ },
173
+ "inputicon": {
174
+ "type": "string",
175
+ "mutable": false,
176
+ "complexType": {
177
+ "original": "string",
178
+ "resolved": "string",
179
+ "references": {}
180
+ },
181
+ "required": false,
182
+ "optional": false,
183
+ "docs": {
184
+ "tags": [],
185
+ "text": ""
186
+ },
187
+ "attribute": "inputicon",
188
+ "reflect": false
189
+ },
190
+ "inline": {
191
+ "type": "boolean",
192
+ "mutable": false,
193
+ "complexType": {
194
+ "original": "boolean",
195
+ "resolved": "boolean",
196
+ "references": {}
197
+ },
198
+ "required": false,
199
+ "optional": false,
200
+ "docs": {
201
+ "tags": [],
202
+ "text": ""
203
+ },
204
+ "attribute": "inline",
205
+ "reflect": false
206
+ },
207
+ "inputAutocapitalize": {
208
+ "type": "string",
209
+ "mutable": false,
210
+ "complexType": {
211
+ "original": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'",
212
+ "resolved": "\"characters\" | \"none\" | \"off\" | \"on\" | \"sentences\" | \"words\"",
213
+ "references": {}
214
+ },
215
+ "required": false,
216
+ "optional": false,
217
+ "docs": {
218
+ "tags": [],
219
+ "text": ""
220
+ },
221
+ "attribute": "input-autocapitalize",
222
+ "reflect": false
223
+ },
224
+ "inputAutofocus": {
225
+ "type": "boolean",
226
+ "mutable": false,
227
+ "complexType": {
228
+ "original": "boolean",
229
+ "resolved": "boolean",
230
+ "references": {}
231
+ },
232
+ "required": false,
233
+ "optional": false,
234
+ "docs": {
235
+ "tags": [],
236
+ "text": ""
237
+ },
238
+ "attribute": "input-autofocus",
239
+ "reflect": false
240
+ },
241
+ "inputKeyhint": {
242
+ "type": "string",
243
+ "mutable": false,
244
+ "complexType": {
245
+ "original": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'",
246
+ "resolved": "\"done\" | \"enter\" | \"go\" | \"next\" | \"previous\" | \"search\" | \"send\"",
247
+ "references": {}
248
+ },
249
+ "required": false,
250
+ "optional": false,
251
+ "docs": {
252
+ "tags": [],
253
+ "text": "Defines what action to present for the enter key on virtual keyboards"
254
+ },
255
+ "attribute": "input-keyhint",
256
+ "reflect": false
257
+ },
258
+ "inputIndex": {
259
+ "type": "any",
260
+ "mutable": false,
261
+ "complexType": {
262
+ "original": "string | number",
263
+ "resolved": "number | string",
264
+ "references": {}
265
+ },
266
+ "required": false,
267
+ "optional": false,
268
+ "docs": {
269
+ "tags": [{
270
+ "name": "example",
271
+ "text": "<caption>In HTML (like `index.html`)</caption>\n<tttx-standalone-input input-index=\"1\" />"
272
+ }, {
273
+ "name": "example",
274
+ "text": "<caption>In TSX files</caption>\n<tttx-standalone-input inputIndex={1} />"
275
+ }],
276
+ "text": "tabindex - Allows the HTML elements to be focusable"
277
+ },
278
+ "attribute": "input-index",
279
+ "reflect": false
280
+ },
281
+ "inputTitle": {
282
+ "type": "string",
283
+ "mutable": false,
284
+ "complexType": {
285
+ "original": "string",
286
+ "resolved": "string",
287
+ "references": {}
288
+ },
289
+ "required": false,
290
+ "optional": false,
291
+ "docs": {
292
+ "tags": [],
293
+ "text": ""
294
+ },
295
+ "attribute": "input-title",
296
+ "reflect": false
297
+ },
298
+ "autocomplete": {
299
+ "type": "string",
300
+ "mutable": false,
301
+ "complexType": {
302
+ "original": "'off' | 'on'",
303
+ "resolved": "\"off\" | \"on\"",
304
+ "references": {}
305
+ },
306
+ "required": false,
307
+ "optional": false,
308
+ "docs": {
309
+ "tags": [],
310
+ "text": ""
311
+ },
312
+ "attribute": "autocomplete",
313
+ "reflect": false
314
+ },
315
+ "checked": {
316
+ "type": "boolean",
317
+ "mutable": false,
318
+ "complexType": {
319
+ "original": "boolean",
320
+ "resolved": "boolean",
321
+ "references": {}
322
+ },
323
+ "required": false,
324
+ "optional": false,
325
+ "docs": {
326
+ "tags": [],
327
+ "text": ""
328
+ },
329
+ "attribute": "checked",
330
+ "reflect": false
331
+ },
332
+ "disabled": {
333
+ "type": "boolean",
334
+ "mutable": false,
335
+ "complexType": {
336
+ "original": "boolean",
337
+ "resolved": "boolean",
338
+ "references": {}
339
+ },
340
+ "required": false,
341
+ "optional": false,
342
+ "docs": {
343
+ "tags": [],
344
+ "text": ""
345
+ },
346
+ "attribute": "disabled",
347
+ "reflect": false
348
+ },
349
+ "max": {
350
+ "type": "any",
351
+ "mutable": false,
352
+ "complexType": {
353
+ "original": "MinMaxDates | number",
354
+ "resolved": "`${number}${number}${number}${number}-${number}${number}-${number}${number}T${number}${number}:${number}${number}` | `${number}${number}${number}${number}-${number}${number}-${number}${number}` | `${number}${number}${number}${number}-${number}${number}` | `${number}${number}${number}${number}-W${number}${number}` | `${number}${number}:${number}${number}` | number",
355
+ "references": {
356
+ "MinMaxDates": {
357
+ "location": "local"
358
+ }
359
+ }
360
+ },
361
+ "required": false,
362
+ "optional": false,
363
+ "docs": {
364
+ "tags": [],
365
+ "text": ""
366
+ },
367
+ "attribute": "max",
368
+ "reflect": false
369
+ },
370
+ "maxlength": {
371
+ "type": "any",
372
+ "mutable": false,
373
+ "complexType": {
374
+ "original": "string | number",
375
+ "resolved": "number | string",
376
+ "references": {}
377
+ },
378
+ "required": false,
379
+ "optional": false,
380
+ "docs": {
381
+ "tags": [],
382
+ "text": ""
383
+ },
384
+ "attribute": "maxlength",
385
+ "reflect": false
386
+ },
387
+ "min": {
388
+ "type": "any",
389
+ "mutable": false,
390
+ "complexType": {
391
+ "original": "MinMaxDates | number",
392
+ "resolved": "`${number}${number}${number}${number}-${number}${number}-${number}${number}T${number}${number}:${number}${number}` | `${number}${number}${number}${number}-${number}${number}-${number}${number}` | `${number}${number}${number}${number}-${number}${number}` | `${number}${number}${number}${number}-W${number}${number}` | `${number}${number}:${number}${number}` | number",
393
+ "references": {
394
+ "MinMaxDates": {
395
+ "location": "local"
396
+ }
397
+ }
398
+ },
399
+ "required": false,
400
+ "optional": false,
401
+ "docs": {
402
+ "tags": [],
403
+ "text": ""
404
+ },
405
+ "attribute": "min",
406
+ "reflect": false
407
+ },
408
+ "minlength": {
409
+ "type": "any",
410
+ "mutable": false,
411
+ "complexType": {
412
+ "original": "string | number",
413
+ "resolved": "number | string",
414
+ "references": {}
415
+ },
416
+ "required": false,
417
+ "optional": false,
418
+ "docs": {
419
+ "tags": [],
420
+ "text": ""
421
+ },
422
+ "attribute": "minlength",
423
+ "reflect": false
424
+ },
425
+ "name": {
426
+ "type": "string",
427
+ "mutable": false,
428
+ "complexType": {
429
+ "original": "string",
430
+ "resolved": "string",
431
+ "references": {}
432
+ },
433
+ "required": false,
434
+ "optional": false,
435
+ "docs": {
436
+ "tags": [],
437
+ "text": ""
438
+ },
439
+ "attribute": "name",
440
+ "reflect": false
441
+ },
442
+ "pattern": {
443
+ "type": "string",
444
+ "mutable": false,
445
+ "complexType": {
446
+ "original": "string",
447
+ "resolved": "string",
448
+ "references": {}
449
+ },
450
+ "required": false,
451
+ "optional": false,
452
+ "docs": {
453
+ "tags": [],
454
+ "text": ""
455
+ },
456
+ "attribute": "pattern",
457
+ "reflect": false
458
+ },
459
+ "placeholder": {
460
+ "type": "string",
461
+ "mutable": false,
462
+ "complexType": {
463
+ "original": "string",
464
+ "resolved": "string",
465
+ "references": {}
466
+ },
467
+ "required": false,
468
+ "optional": false,
469
+ "docs": {
470
+ "tags": [],
471
+ "text": ""
472
+ },
473
+ "attribute": "placeholder",
474
+ "reflect": false
475
+ },
476
+ "readonly": {
477
+ "type": "any",
478
+ "mutable": false,
479
+ "complexType": {
480
+ "original": "string | boolean",
481
+ "resolved": "boolean | string",
482
+ "references": {}
483
+ },
484
+ "required": false,
485
+ "optional": false,
486
+ "docs": {
487
+ "tags": [],
488
+ "text": ""
489
+ },
490
+ "attribute": "readonly",
491
+ "reflect": false
492
+ },
493
+ "required": {
494
+ "type": "boolean",
495
+ "mutable": false,
496
+ "complexType": {
497
+ "original": "boolean",
498
+ "resolved": "boolean",
499
+ "references": {}
500
+ },
501
+ "required": false,
502
+ "optional": false,
503
+ "docs": {
504
+ "tags": [],
505
+ "text": ""
506
+ },
507
+ "attribute": "required",
508
+ "reflect": false
509
+ },
510
+ "step": {
511
+ "type": "any",
512
+ "mutable": false,
513
+ "complexType": {
514
+ "original": "string | number",
515
+ "resolved": "number | string",
516
+ "references": {}
517
+ },
518
+ "required": false,
519
+ "optional": false,
520
+ "docs": {
521
+ "tags": [],
522
+ "text": ""
523
+ },
524
+ "attribute": "step",
525
+ "reflect": false
526
+ },
527
+ "type": {
528
+ "type": "string",
529
+ "mutable": false,
530
+ "complexType": {
531
+ "original": "string",
532
+ "resolved": "string",
533
+ "references": {}
534
+ },
535
+ "required": false,
536
+ "optional": false,
537
+ "docs": {
538
+ "tags": [],
539
+ "text": ""
540
+ },
541
+ "attribute": "type",
542
+ "reflect": false,
543
+ "defaultValue": "'text'"
544
+ },
545
+ "value": {
546
+ "type": "any",
547
+ "mutable": true,
548
+ "complexType": {
549
+ "original": "string | number",
550
+ "resolved": "number | string",
551
+ "references": {}
552
+ },
553
+ "required": false,
554
+ "optional": false,
555
+ "docs": {
556
+ "tags": [],
557
+ "text": ""
558
+ },
559
+ "attribute": "value",
560
+ "reflect": false
561
+ }
562
+ };
563
+ }
564
+ static get events() {
565
+ return [{
566
+ "method": "valueChanged",
567
+ "name": "valueChanged",
568
+ "bubbles": true,
569
+ "cancelable": true,
570
+ "composed": true,
571
+ "docs": {
572
+ "tags": [],
573
+ "text": ""
574
+ },
575
+ "complexType": {
576
+ "original": "string",
577
+ "resolved": "string",
578
+ "references": {}
579
+ }
580
+ }, {
581
+ "method": "focusChanged",
582
+ "name": "focusChanged",
583
+ "bubbles": true,
584
+ "cancelable": true,
585
+ "composed": true,
586
+ "docs": {
587
+ "tags": [],
588
+ "text": ""
589
+ },
590
+ "complexType": {
591
+ "original": "string",
592
+ "resolved": "string",
593
+ "references": {}
594
+ }
595
+ }, {
596
+ "method": "blurChanged",
597
+ "name": "blurChanged",
598
+ "bubbles": true,
599
+ "cancelable": true,
600
+ "composed": true,
601
+ "docs": {
602
+ "tags": [],
603
+ "text": ""
604
+ },
605
+ "complexType": {
606
+ "original": "string",
607
+ "resolved": "string",
608
+ "references": {}
609
+ }
610
+ }, {
611
+ "method": "invalidChanged",
612
+ "name": "invalidChanged",
613
+ "bubbles": true,
614
+ "cancelable": true,
615
+ "composed": true,
616
+ "docs": {
617
+ "tags": [],
618
+ "text": ""
619
+ },
620
+ "complexType": {
621
+ "original": "string",
622
+ "resolved": "string",
623
+ "references": {}
624
+ }
625
+ }];
626
+ }
627
+ }