@synergy-design-system/components 1.0.0-main.3 → 1.0.0-main.4

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 (144) hide show
  1. package/dist/chunks/chunk.2FIY3TX5.js +32 -0
  2. package/dist/chunks/chunk.2FIY3TX5.js.map +7 -0
  3. package/dist/chunks/chunk.5OIEI73E.js +45 -0
  4. package/dist/chunks/chunk.5OIEI73E.js.map +7 -0
  5. package/dist/chunks/chunk.5PZUAKCS.js +202 -0
  6. package/dist/chunks/chunk.5PZUAKCS.js.map +7 -0
  7. package/dist/chunks/chunk.6C4JXZZN.js +15 -0
  8. package/dist/chunks/chunk.6C4JXZZN.js.map +7 -0
  9. package/dist/chunks/chunk.7EGSHKGV.js +12 -0
  10. package/dist/chunks/chunk.7EGSHKGV.js.map +7 -0
  11. package/dist/chunks/chunk.A3SKDWCT.js +42 -0
  12. package/dist/chunks/chunk.A3SKDWCT.js.map +7 -0
  13. package/dist/chunks/chunk.BQPK6UKU.js +498 -0
  14. package/dist/chunks/chunk.BQPK6UKU.js.map +7 -0
  15. package/dist/chunks/chunk.BREU4ILT.js +28 -0
  16. package/dist/chunks/chunk.BREU4ILT.js.map +7 -0
  17. package/dist/chunks/chunk.C7624ITA.js +30 -0
  18. package/dist/chunks/chunk.C7624ITA.js.map +7 -0
  19. package/dist/chunks/chunk.DJOAQ4JU.js +36 -0
  20. package/dist/chunks/chunk.DJOAQ4JU.js.map +7 -0
  21. package/dist/chunks/chunk.DREO4ZTN.js +10 -0
  22. package/dist/chunks/chunk.DREO4ZTN.js.map +7 -0
  23. package/dist/chunks/chunk.EW2JZPYV.js +12 -0
  24. package/dist/chunks/chunk.EW2JZPYV.js.map +7 -0
  25. package/dist/chunks/chunk.FUYWF5Y2.js +278 -0
  26. package/dist/chunks/chunk.FUYWF5Y2.js.map +7 -0
  27. package/dist/chunks/chunk.ILONRPL4.js +10 -0
  28. package/dist/chunks/chunk.ILONRPL4.js.map +7 -0
  29. package/dist/chunks/chunk.N2I6HVX3.js +71 -0
  30. package/dist/chunks/chunk.N2I6HVX3.js.map +7 -0
  31. package/dist/chunks/chunk.O7USYXBT.js +23 -0
  32. package/dist/chunks/chunk.O7USYXBT.js.map +7 -0
  33. package/dist/chunks/chunk.P22LQI5J.js +376 -0
  34. package/dist/chunks/chunk.P22LQI5J.js.map +7 -0
  35. package/dist/chunks/chunk.Q77OTWF2.js +378 -0
  36. package/dist/chunks/chunk.Q77OTWF2.js.map +7 -0
  37. package/dist/chunks/chunk.R6VNLE6N.js +11 -0
  38. package/dist/chunks/chunk.R6VNLE6N.js.map +7 -0
  39. package/dist/chunks/chunk.SLLG4KJR.js +63 -0
  40. package/dist/chunks/chunk.SLLG4KJR.js.map +7 -0
  41. package/dist/chunks/chunk.U7ZJ22QM.js +128 -0
  42. package/dist/chunks/chunk.U7ZJ22QM.js.map +7 -0
  43. package/dist/chunks/chunk.WDCAHRYG.js +273 -0
  44. package/dist/chunks/chunk.WDCAHRYG.js.map +7 -0
  45. package/dist/chunks/chunk.WTCUSH7V.js +42 -0
  46. package/dist/chunks/chunk.WTCUSH7V.js.map +7 -0
  47. package/dist/chunks/chunk.XGXFE6IF.js +49 -0
  48. package/dist/chunks/chunk.XGXFE6IF.js.map +7 -0
  49. package/dist/components/button/button.component.d.ts +123 -0
  50. package/dist/components/button/button.component.js +24 -0
  51. package/dist/components/button/button.component.js.map +7 -0
  52. package/dist/components/button/button.custom.styles.d.ts +2 -0
  53. package/dist/components/button/button.custom.styles.js +8 -0
  54. package/dist/components/button/button.custom.styles.js.map +7 -0
  55. package/dist/components/button/button.d.ts +8 -0
  56. package/dist/components/button/button.js +25 -0
  57. package/dist/components/button/button.js.map +7 -0
  58. package/dist/components/button/button.styles.d.ts +2 -0
  59. package/dist/components/button/button.styles.js +10 -0
  60. package/dist/components/button/button.styles.js.map +7 -0
  61. package/dist/components/checkbox/checkbox.custom.styles.d.ts +2 -0
  62. package/dist/components/checkbox/checkbox.custom.styles.js +11 -0
  63. package/dist/components/checkbox/checkbox.custom.styles.js.map +7 -0
  64. package/dist/components/icon/icon.component.d.ts +42 -0
  65. package/dist/components/icon/icon.component.js +15 -0
  66. package/dist/components/icon/icon.component.js.map +7 -0
  67. package/dist/components/icon/icon.d.ts +8 -0
  68. package/dist/components/icon/icon.js +19 -0
  69. package/dist/components/icon/icon.js.map +7 -0
  70. package/dist/components/icon/icon.styles.d.ts +2 -0
  71. package/dist/components/icon/icon.styles.js +9 -0
  72. package/dist/components/icon/icon.styles.js.map +7 -0
  73. package/dist/components/icon/library.d.ts +19 -0
  74. package/dist/components/icon/library.default.d.ts +3 -0
  75. package/dist/components/icon/library.default.js +9 -0
  76. package/dist/components/icon/library.default.js.map +7 -0
  77. package/dist/components/icon/library.js +19 -0
  78. package/dist/components/icon/library.js.map +7 -0
  79. package/dist/components/icon/library.system.d.ts +3 -0
  80. package/dist/components/icon/library.system.js +8 -0
  81. package/dist/components/icon/library.system.js.map +7 -0
  82. package/dist/components/input/input.component.d.ts +175 -0
  83. package/dist/components/input/input.component.js +22 -0
  84. package/dist/components/input/input.component.js.map +7 -0
  85. package/dist/components/input/input.custom.styles.d.ts +2 -0
  86. package/dist/components/input/input.custom.styles.js +8 -0
  87. package/dist/components/input/input.custom.styles.js.map +7 -0
  88. package/dist/components/input/input.d.ts +8 -0
  89. package/dist/components/input/input.js +23 -0
  90. package/dist/components/input/input.js.map +7 -0
  91. package/dist/components/input/input.styles.d.ts +2 -0
  92. package/dist/components/input/input.styles.js +10 -0
  93. package/dist/components/input/input.styles.js.map +7 -0
  94. package/dist/components/spinner/spinner.component.d.ts +20 -0
  95. package/dist/components/spinner/spinner.component.js +13 -0
  96. package/dist/components/spinner/spinner.component.js.map +7 -0
  97. package/dist/components/spinner/spinner.styles.d.ts +2 -0
  98. package/dist/components/spinner/spinner.styles.js +9 -0
  99. package/dist/components/spinner/spinner.styles.js.map +7 -0
  100. package/dist/components/textarea/textarea.custom.styles.d.ts +2 -0
  101. package/dist/components/textarea/textarea.custom.styles.js +11 -0
  102. package/dist/components/textarea/textarea.custom.styles.js.map +7 -0
  103. package/dist/custom-elements.json +1870 -0
  104. package/dist/events/events.d.ts +8 -0
  105. package/dist/events/syn-blur.d.ts +6 -0
  106. package/dist/events/syn-change.d.ts +6 -0
  107. package/dist/events/syn-clear.d.ts +6 -0
  108. package/dist/events/syn-error.d.ts +8 -0
  109. package/dist/events/syn-focus.d.ts +6 -0
  110. package/dist/events/syn-input.d.ts +6 -0
  111. package/dist/events/syn-invalid.d.ts +6 -0
  112. package/dist/events/syn-load.d.ts +6 -0
  113. package/dist/internal/default-value.d.ts +2 -0
  114. package/dist/internal/form.d.ts +73 -0
  115. package/dist/internal/slot.d.ts +23 -0
  116. package/dist/internal/synergy-element.d.ts +47 -0
  117. package/dist/internal/test/form-control-base-tests.d.ts +7 -0
  118. package/dist/internal/watch.d.ts +26 -0
  119. package/dist/styles/component.styles.d.ts +2 -0
  120. package/dist/styles/form-control.styles.d.ts +2 -0
  121. package/dist/synergy-autoloader.d.ts +4 -0
  122. package/dist/synergy-autoloader.js +41 -0
  123. package/dist/synergy-autoloader.js.map +7 -0
  124. package/dist/synergy.d.ts +4 -0
  125. package/dist/synergy.js +38 -0
  126. package/dist/synergy.js.map +7 -0
  127. package/dist/translations/de.d.ts +3 -0
  128. package/dist/translations/de.js +46 -0
  129. package/dist/translations/de.js.map +7 -0
  130. package/dist/translations/en.d.ts +3 -0
  131. package/dist/translations/en.js +8 -0
  132. package/dist/translations/en.js.map +7 -0
  133. package/dist/utilities/base-path.d.ts +18 -0
  134. package/dist/utilities/base-path.js +10 -0
  135. package/dist/utilities/base-path.js.map +7 -0
  136. package/dist/utilities/form.d.ts +11 -0
  137. package/dist/utilities/form.js +11 -0
  138. package/dist/utilities/form.js.map +7 -0
  139. package/dist/utilities/localize.d.ts +33 -0
  140. package/dist/utilities/localize.js +11 -0
  141. package/dist/utilities/localize.js.map +7 -0
  142. package/dist/vscode.html-custom-data.json +371 -0
  143. package/dist/web-types.json +738 -0
  144. package/package.json +2 -2
@@ -0,0 +1,1870 @@
1
+ {
2
+ "schemaVersion": "1.0.0",
3
+ "readme": "",
4
+ "modules": [
5
+ {
6
+ "kind": "javascript-module",
7
+ "path": "components/button/button.js",
8
+ "declarations": [
9
+ {
10
+ "kind": "class",
11
+ "description": "",
12
+ "name": "SynButton",
13
+ "cssParts": [
14
+ {
15
+ "description": "The component's base wrapper.",
16
+ "name": "base"
17
+ },
18
+ {
19
+ "description": "The container that wraps the prefix.",
20
+ "name": "prefix"
21
+ },
22
+ {
23
+ "description": "The button's label.",
24
+ "name": "label"
25
+ },
26
+ {
27
+ "description": "The container that wraps the suffix.",
28
+ "name": "suffix"
29
+ },
30
+ {
31
+ "description": "The button's caret icon, an `<syn-icon>` element.",
32
+ "name": "caret"
33
+ },
34
+ {
35
+ "description": "The spinner that shows when the button is in the loading state.",
36
+ "name": "spinner"
37
+ }
38
+ ],
39
+ "slots": [
40
+ {
41
+ "description": "The button's label.",
42
+ "name": ""
43
+ },
44
+ {
45
+ "description": "A presentational prefix icon or similar element.",
46
+ "name": "prefix"
47
+ },
48
+ {
49
+ "description": "A presentational suffix icon or similar element.",
50
+ "name": "suffix"
51
+ }
52
+ ],
53
+ "members": [
54
+ {
55
+ "kind": "field",
56
+ "name": "dependencies",
57
+ "type": {
58
+ "text": "object"
59
+ },
60
+ "static": true,
61
+ "default": "{\n 'syn-icon': SynIcon,\n 'syn-spinner': SynSpinner\n }"
62
+ },
63
+ {
64
+ "kind": "field",
65
+ "name": "formControlController",
66
+ "privacy": "private",
67
+ "readonly": true,
68
+ "default": "new FormControlController(this, {\n form: input => {\n // Buttons support a form attribute that points to an arbitrary form, so if this attribute is set we need to query\n // the form from the same root using its id\n if (input.hasAttribute('form')) {\n const doc = input.getRootNode() as Document | ShadowRoot;\n const formId = input.getAttribute('form')!;\n return doc.getElementById(formId) as HTMLFormElement;\n }\n\n // Fall back to the closest containing form\n return input.closest('form');\n },\n assumeInteractionOn: ['click']\n })"
69
+ },
70
+ {
71
+ "kind": "field",
72
+ "name": "hasSlotController",
73
+ "privacy": "private",
74
+ "readonly": true,
75
+ "default": "new HasSlotController(this, '[default]', 'prefix', 'suffix')"
76
+ },
77
+ {
78
+ "kind": "field",
79
+ "name": "localize",
80
+ "privacy": "private",
81
+ "readonly": true,
82
+ "default": "new LocalizeController(this)"
83
+ },
84
+ {
85
+ "kind": "field",
86
+ "name": "button",
87
+ "type": {
88
+ "text": "HTMLButtonElement | HTMLLinkElement"
89
+ }
90
+ },
91
+ {
92
+ "kind": "field",
93
+ "name": "hasFocus",
94
+ "type": {
95
+ "text": "boolean"
96
+ },
97
+ "privacy": "private",
98
+ "default": "false"
99
+ },
100
+ {
101
+ "kind": "field",
102
+ "name": "invalid",
103
+ "type": {
104
+ "text": "boolean"
105
+ },
106
+ "default": "false"
107
+ },
108
+ {
109
+ "kind": "field",
110
+ "name": "title",
111
+ "type": {
112
+ "text": "string"
113
+ },
114
+ "default": "''",
115
+ "attribute": "title"
116
+ },
117
+ {
118
+ "kind": "field",
119
+ "name": "variant",
120
+ "type": {
121
+ "text": "'default' | 'outline' | 'text'"
122
+ },
123
+ "default": "'default'",
124
+ "description": "The button's theme variant.",
125
+ "attribute": "variant",
126
+ "reflects": true
127
+ },
128
+ {
129
+ "kind": "field",
130
+ "name": "size",
131
+ "type": {
132
+ "text": "'small' | 'medium' | 'large'"
133
+ },
134
+ "default": "'medium'",
135
+ "description": "The button's size.",
136
+ "attribute": "size",
137
+ "reflects": true
138
+ },
139
+ {
140
+ "kind": "field",
141
+ "name": "caret",
142
+ "type": {
143
+ "text": "boolean"
144
+ },
145
+ "default": "false",
146
+ "description": "Draws the button with a caret. Used to indicate that the button triggers a dropdown menu or similar behavior.",
147
+ "attribute": "caret",
148
+ "reflects": true
149
+ },
150
+ {
151
+ "kind": "field",
152
+ "name": "disabled",
153
+ "type": {
154
+ "text": "boolean"
155
+ },
156
+ "default": "false",
157
+ "description": "Disables the button.",
158
+ "attribute": "disabled",
159
+ "reflects": true
160
+ },
161
+ {
162
+ "kind": "field",
163
+ "name": "loading",
164
+ "type": {
165
+ "text": "boolean"
166
+ },
167
+ "default": "false",
168
+ "description": "Draws the button in a loading state.",
169
+ "attribute": "loading",
170
+ "reflects": true
171
+ },
172
+ {
173
+ "kind": "field",
174
+ "name": "type",
175
+ "type": {
176
+ "text": "'button' | 'submit' | 'reset'"
177
+ },
178
+ "default": "'button'",
179
+ "description": "The type of button. Note that the default value is `button` instead of `submit`, which is opposite of how native\n`<button>` elements behave. When the type is `submit`, the button will submit the surrounding form.",
180
+ "attribute": "type"
181
+ },
182
+ {
183
+ "kind": "field",
184
+ "name": "name",
185
+ "type": {
186
+ "text": "string"
187
+ },
188
+ "default": "''",
189
+ "description": "The name of the button, submitted as a name/value pair with form data, but only when this button is the submitter.\nThis attribute is ignored when `href` is present.",
190
+ "attribute": "name"
191
+ },
192
+ {
193
+ "kind": "field",
194
+ "name": "value",
195
+ "type": {
196
+ "text": "string"
197
+ },
198
+ "default": "''",
199
+ "description": "The value of the button, submitted as a pair with the button's name as part of the form data, but only when this\nbutton is the submitter. This attribute is ignored when `href` is present.",
200
+ "attribute": "value"
201
+ },
202
+ {
203
+ "kind": "field",
204
+ "name": "href",
205
+ "type": {
206
+ "text": "string"
207
+ },
208
+ "default": "''",
209
+ "description": "When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.",
210
+ "attribute": "href"
211
+ },
212
+ {
213
+ "kind": "field",
214
+ "name": "target",
215
+ "type": {
216
+ "text": "'_blank' | '_parent' | '_self' | '_top'"
217
+ },
218
+ "description": "Tells the browser where to open the link. Only used when `href` is present.",
219
+ "attribute": "target"
220
+ },
221
+ {
222
+ "kind": "field",
223
+ "name": "rel",
224
+ "type": {
225
+ "text": "string"
226
+ },
227
+ "default": "'noreferrer noopener'",
228
+ "description": "When using `href`, this attribute will map to the underlying link's `rel` attribute. Unlike regular links, the\ndefault is `noreferrer noopener` to prevent security exploits. However, if you're using `target` to point to a\nspecific tab/window, this will prevent that from working correctly. You can remove or change the default value by\nsetting the attribute to an empty string or a value of your choice, respectively.",
229
+ "attribute": "rel"
230
+ },
231
+ {
232
+ "kind": "field",
233
+ "name": "download",
234
+ "type": {
235
+ "text": "string | undefined"
236
+ },
237
+ "description": "Tells the browser to download the linked file as this filename. Only used when `href` is present.",
238
+ "attribute": "download"
239
+ },
240
+ {
241
+ "kind": "field",
242
+ "name": "form",
243
+ "type": {
244
+ "text": "string"
245
+ },
246
+ "description": "The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\nvalue of this attribute must be an id of a form in the same document or shadow root as the button.",
247
+ "attribute": "form"
248
+ },
249
+ {
250
+ "kind": "field",
251
+ "name": "formAction",
252
+ "type": {
253
+ "text": "string"
254
+ },
255
+ "description": "Used to override the form owner's `action` attribute.",
256
+ "attribute": "formaction"
257
+ },
258
+ {
259
+ "kind": "field",
260
+ "name": "formEnctype",
261
+ "type": {
262
+ "text": "'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain'"
263
+ },
264
+ "description": "Used to override the form owner's `enctype` attribute.",
265
+ "attribute": "formenctype"
266
+ },
267
+ {
268
+ "kind": "field",
269
+ "name": "formMethod",
270
+ "type": {
271
+ "text": "'post' | 'get'"
272
+ },
273
+ "description": "Used to override the form owner's `method` attribute.",
274
+ "attribute": "formmethod"
275
+ },
276
+ {
277
+ "kind": "field",
278
+ "name": "formNoValidate",
279
+ "type": {
280
+ "text": "boolean"
281
+ },
282
+ "description": "Used to override the form owner's `novalidate` attribute.",
283
+ "attribute": "formnovalidate"
284
+ },
285
+ {
286
+ "kind": "field",
287
+ "name": "formTarget",
288
+ "type": {
289
+ "text": "'_self' | '_blank' | '_parent' | '_top' | string"
290
+ },
291
+ "description": "Used to override the form owner's `target` attribute.",
292
+ "attribute": "formtarget"
293
+ },
294
+ {
295
+ "kind": "field",
296
+ "name": "validity",
297
+ "description": "Gets the validity state object",
298
+ "readonly": true
299
+ },
300
+ {
301
+ "kind": "field",
302
+ "name": "validationMessage",
303
+ "description": "Gets the validation message",
304
+ "readonly": true
305
+ },
306
+ {
307
+ "kind": "method",
308
+ "name": "handleBlur",
309
+ "privacy": "private"
310
+ },
311
+ {
312
+ "kind": "method",
313
+ "name": "handleFocus",
314
+ "privacy": "private"
315
+ },
316
+ {
317
+ "kind": "method",
318
+ "name": "handleClick",
319
+ "privacy": "private"
320
+ },
321
+ {
322
+ "kind": "method",
323
+ "name": "handleInvalid",
324
+ "privacy": "private",
325
+ "parameters": [
326
+ {
327
+ "name": "event",
328
+ "type": {
329
+ "text": "Event"
330
+ }
331
+ }
332
+ ]
333
+ },
334
+ {
335
+ "kind": "method",
336
+ "name": "isButton",
337
+ "privacy": "private"
338
+ },
339
+ {
340
+ "kind": "method",
341
+ "name": "isLink",
342
+ "privacy": "private"
343
+ },
344
+ {
345
+ "kind": "method",
346
+ "name": "handleDisabledChange"
347
+ },
348
+ {
349
+ "kind": "method",
350
+ "name": "click",
351
+ "description": "Simulates a click on the button."
352
+ },
353
+ {
354
+ "kind": "method",
355
+ "name": "focus",
356
+ "parameters": [
357
+ {
358
+ "name": "options",
359
+ "optional": true,
360
+ "type": {
361
+ "text": "FocusOptions"
362
+ }
363
+ }
364
+ ],
365
+ "description": "Sets focus on the button."
366
+ },
367
+ {
368
+ "kind": "method",
369
+ "name": "blur",
370
+ "description": "Removes focus from the button."
371
+ },
372
+ {
373
+ "kind": "method",
374
+ "name": "checkValidity",
375
+ "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
376
+ },
377
+ {
378
+ "kind": "method",
379
+ "name": "getForm",
380
+ "return": {
381
+ "type": {
382
+ "text": "HTMLFormElement | null"
383
+ }
384
+ },
385
+ "description": "Gets the associated form, if one exists."
386
+ },
387
+ {
388
+ "kind": "method",
389
+ "name": "reportValidity",
390
+ "description": "Checks for validity and shows the browser's validation message if the control is invalid."
391
+ },
392
+ {
393
+ "kind": "method",
394
+ "name": "setCustomValidity",
395
+ "parameters": [
396
+ {
397
+ "name": "message",
398
+ "type": {
399
+ "text": "string"
400
+ }
401
+ }
402
+ ],
403
+ "description": "Sets a custom validation message. Pass an empty string to restore validity."
404
+ }
405
+ ],
406
+ "events": [
407
+ {
408
+ "description": "Emitted when the button loses focus.",
409
+ "name": "syn-blur",
410
+ "reactName": "onSynBlur",
411
+ "eventName": "SynBlurEvent"
412
+ },
413
+ {
414
+ "description": "Emitted when the button gains focus.",
415
+ "name": "syn-focus",
416
+ "reactName": "onSynFocus",
417
+ "eventName": "SynFocusEvent"
418
+ },
419
+ {
420
+ "description": "Emitted when the form control has been checked for validity and its constraints aren't satisfied.",
421
+ "name": "syn-invalid",
422
+ "reactName": "onSynInvalid",
423
+ "eventName": "SynInvalidEvent"
424
+ }
425
+ ],
426
+ "attributes": [
427
+ {
428
+ "name": "title",
429
+ "type": {
430
+ "text": "string"
431
+ },
432
+ "default": "''",
433
+ "fieldName": "title"
434
+ },
435
+ {
436
+ "name": "variant",
437
+ "type": {
438
+ "text": "'default' | 'outline' | 'text'"
439
+ },
440
+ "default": "'default'",
441
+ "description": "The button's theme variant.",
442
+ "fieldName": "variant"
443
+ },
444
+ {
445
+ "name": "size",
446
+ "type": {
447
+ "text": "'small' | 'medium' | 'large'"
448
+ },
449
+ "default": "'medium'",
450
+ "description": "The button's size.",
451
+ "fieldName": "size"
452
+ },
453
+ {
454
+ "name": "caret",
455
+ "type": {
456
+ "text": "boolean"
457
+ },
458
+ "default": "false",
459
+ "description": "Draws the button with a caret. Used to indicate that the button triggers a dropdown menu or similar behavior.",
460
+ "fieldName": "caret"
461
+ },
462
+ {
463
+ "name": "disabled",
464
+ "type": {
465
+ "text": "boolean"
466
+ },
467
+ "default": "false",
468
+ "description": "Disables the button.",
469
+ "fieldName": "disabled"
470
+ },
471
+ {
472
+ "name": "loading",
473
+ "type": {
474
+ "text": "boolean"
475
+ },
476
+ "default": "false",
477
+ "description": "Draws the button in a loading state.",
478
+ "fieldName": "loading"
479
+ },
480
+ {
481
+ "name": "type",
482
+ "type": {
483
+ "text": "'button' | 'submit' | 'reset'"
484
+ },
485
+ "default": "'button'",
486
+ "description": "The type of button. Note that the default value is `button` instead of `submit`, which is opposite of how native\n`<button>` elements behave. When the type is `submit`, the button will submit the surrounding form.",
487
+ "fieldName": "type"
488
+ },
489
+ {
490
+ "name": "name",
491
+ "type": {
492
+ "text": "string"
493
+ },
494
+ "default": "''",
495
+ "description": "The name of the button, submitted as a name/value pair with form data, but only when this button is the submitter.\nThis attribute is ignored when `href` is present.",
496
+ "fieldName": "name"
497
+ },
498
+ {
499
+ "name": "value",
500
+ "type": {
501
+ "text": "string"
502
+ },
503
+ "default": "''",
504
+ "description": "The value of the button, submitted as a pair with the button's name as part of the form data, but only when this\nbutton is the submitter. This attribute is ignored when `href` is present.",
505
+ "fieldName": "value"
506
+ },
507
+ {
508
+ "name": "href",
509
+ "type": {
510
+ "text": "string"
511
+ },
512
+ "default": "''",
513
+ "description": "When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.",
514
+ "fieldName": "href"
515
+ },
516
+ {
517
+ "name": "target",
518
+ "type": {
519
+ "text": "'_blank' | '_parent' | '_self' | '_top'"
520
+ },
521
+ "description": "Tells the browser where to open the link. Only used when `href` is present.",
522
+ "fieldName": "target"
523
+ },
524
+ {
525
+ "name": "rel",
526
+ "type": {
527
+ "text": "string"
528
+ },
529
+ "default": "'noreferrer noopener'",
530
+ "description": "When using `href`, this attribute will map to the underlying link's `rel` attribute. Unlike regular links, the\ndefault is `noreferrer noopener` to prevent security exploits. However, if you're using `target` to point to a\nspecific tab/window, this will prevent that from working correctly. You can remove or change the default value by\nsetting the attribute to an empty string or a value of your choice, respectively.",
531
+ "fieldName": "rel"
532
+ },
533
+ {
534
+ "name": "download",
535
+ "type": {
536
+ "text": "string | undefined"
537
+ },
538
+ "description": "Tells the browser to download the linked file as this filename. Only used when `href` is present.",
539
+ "fieldName": "download"
540
+ },
541
+ {
542
+ "name": "form",
543
+ "type": {
544
+ "text": "string"
545
+ },
546
+ "description": "The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\nvalue of this attribute must be an id of a form in the same document or shadow root as the button.",
547
+ "fieldName": "form"
548
+ },
549
+ {
550
+ "name": "formaction",
551
+ "type": {
552
+ "text": "string"
553
+ },
554
+ "description": "Used to override the form owner's `action` attribute.",
555
+ "fieldName": "formAction"
556
+ },
557
+ {
558
+ "name": "formenctype",
559
+ "type": {
560
+ "text": "'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain'"
561
+ },
562
+ "description": "Used to override the form owner's `enctype` attribute.",
563
+ "fieldName": "formEnctype"
564
+ },
565
+ {
566
+ "name": "formmethod",
567
+ "type": {
568
+ "text": "'post' | 'get'"
569
+ },
570
+ "description": "Used to override the form owner's `method` attribute.",
571
+ "fieldName": "formMethod"
572
+ },
573
+ {
574
+ "name": "formnovalidate",
575
+ "type": {
576
+ "text": "boolean"
577
+ },
578
+ "description": "Used to override the form owner's `novalidate` attribute.",
579
+ "fieldName": "formNoValidate"
580
+ },
581
+ {
582
+ "name": "formtarget",
583
+ "type": {
584
+ "text": "'_self' | '_blank' | '_parent' | '_top' | string"
585
+ },
586
+ "description": "Used to override the form owner's `target` attribute.",
587
+ "fieldName": "formTarget"
588
+ }
589
+ ],
590
+ "superclass": {
591
+ "name": "SynergyElement",
592
+ "module": "/src/internal/synergy-element.js"
593
+ },
594
+ "summary": "Buttons represent actions that are available to the user.",
595
+ "tagNameWithoutPrefix": "button",
596
+ "tagName": "syn-button",
597
+ "customElement": true,
598
+ "jsDoc": "/**\n * @summary Buttons represent actions that are available to the user.\n * @documentation https://synergy.style/components/button\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n * @dependency syn-spinner\n *\n * @event syn-blur - Emitted when the button loses focus.\n * @event syn-focus - Emitted when the button gains focus.\n * @event syn-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n *\n * @slot - The button's label.\n * @slot prefix - A presentational prefix icon or similar element.\n * @slot suffix - A presentational suffix icon or similar element.\n *\n * @csspart base - The component's base wrapper.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart label - The button's label.\n * @csspart suffix - The container that wraps the suffix.\n * @csspart caret - The button's caret icon, an `<syn-icon>` element.\n * @csspart spinner - The spinner that shows when the button is in the loading state.\n */",
599
+ "documentation": "https://synergy.style/components/button",
600
+ "status": "stable",
601
+ "since": "2.0",
602
+ "dependencies": [
603
+ "syn-icon",
604
+ "syn-spinner"
605
+ ]
606
+ }
607
+ ],
608
+ "exports": [
609
+ {
610
+ "kind": "js",
611
+ "name": "default",
612
+ "declaration": {
613
+ "name": "SynButton",
614
+ "module": "components/button/button.js"
615
+ }
616
+ }
617
+ ]
618
+ },
619
+ {
620
+ "kind": "javascript-module",
621
+ "path": "components/icon/icon.js",
622
+ "declarations": [
623
+ {
624
+ "kind": "class",
625
+ "description": "",
626
+ "name": "SynIcon",
627
+ "cssParts": [
628
+ {
629
+ "description": "The internal SVG element.",
630
+ "name": "svg"
631
+ },
632
+ {
633
+ "description": "The <use> element generated when using `spriteSheet: true`",
634
+ "name": "use"
635
+ }
636
+ ],
637
+ "members": [
638
+ {
639
+ "kind": "field",
640
+ "name": "initialRender",
641
+ "type": {
642
+ "text": "boolean"
643
+ },
644
+ "privacy": "private",
645
+ "default": "false"
646
+ },
647
+ {
648
+ "kind": "method",
649
+ "name": "resolveIcon",
650
+ "privacy": "private",
651
+ "return": {
652
+ "type": {
653
+ "text": "Promise<SVGResult>"
654
+ }
655
+ },
656
+ "parameters": [
657
+ {
658
+ "name": "url",
659
+ "type": {
660
+ "text": "string"
661
+ }
662
+ },
663
+ {
664
+ "name": "library",
665
+ "optional": true,
666
+ "type": {
667
+ "text": "IconLibrary"
668
+ }
669
+ }
670
+ ],
671
+ "description": "Given a URL, this function returns the resulting SVG element or an appropriate error symbol."
672
+ },
673
+ {
674
+ "kind": "field",
675
+ "name": "svg",
676
+ "type": {
677
+ "text": "SVGElement | HTMLTemplateResult | null"
678
+ },
679
+ "privacy": "private",
680
+ "default": "null"
681
+ },
682
+ {
683
+ "kind": "field",
684
+ "name": "name",
685
+ "type": {
686
+ "text": "string | undefined"
687
+ },
688
+ "description": "The name of the icon to draw. Available names depend on the icon library being used.",
689
+ "attribute": "name",
690
+ "reflects": true
691
+ },
692
+ {
693
+ "kind": "field",
694
+ "name": "src",
695
+ "type": {
696
+ "text": "string | undefined"
697
+ },
698
+ "description": "An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and\ncan result in XSS attacks.",
699
+ "attribute": "src"
700
+ },
701
+ {
702
+ "kind": "field",
703
+ "name": "label",
704
+ "type": {
705
+ "text": "string"
706
+ },
707
+ "default": "''",
708
+ "description": "An alternate description to use for assistive devices. If omitted, the icon will be considered presentational and\nignored by assistive devices.",
709
+ "attribute": "label"
710
+ },
711
+ {
712
+ "kind": "field",
713
+ "name": "library",
714
+ "type": {
715
+ "text": "string"
716
+ },
717
+ "default": "'default'",
718
+ "description": "The name of a registered custom icon library.",
719
+ "attribute": "library",
720
+ "reflects": true
721
+ },
722
+ {
723
+ "kind": "method",
724
+ "name": "getIconSource",
725
+ "privacy": "private",
726
+ "return": {
727
+ "type": {
728
+ "text": "IconSource"
729
+ }
730
+ }
731
+ },
732
+ {
733
+ "kind": "method",
734
+ "name": "handleLabelChange"
735
+ },
736
+ {
737
+ "kind": "method",
738
+ "name": "setIcon"
739
+ }
740
+ ],
741
+ "events": [
742
+ {
743
+ "description": "Emitted when the icon has loaded. When using `spriteSheet: true` this will not emit.",
744
+ "name": "syn-load",
745
+ "reactName": "onSynLoad",
746
+ "eventName": "SynLoadEvent"
747
+ },
748
+ {
749
+ "description": "Emitted when the icon fails to load due to an error. When using `spriteSheet: true` this will not emit.",
750
+ "name": "syn-error",
751
+ "reactName": "onSynError",
752
+ "eventName": "SynErrorEvent"
753
+ }
754
+ ],
755
+ "attributes": [
756
+ {
757
+ "name": "name",
758
+ "type": {
759
+ "text": "string | undefined"
760
+ },
761
+ "description": "The name of the icon to draw. Available names depend on the icon library being used.",
762
+ "fieldName": "name"
763
+ },
764
+ {
765
+ "name": "src",
766
+ "type": {
767
+ "text": "string | undefined"
768
+ },
769
+ "description": "An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and\ncan result in XSS attacks.",
770
+ "fieldName": "src"
771
+ },
772
+ {
773
+ "name": "label",
774
+ "type": {
775
+ "text": "string"
776
+ },
777
+ "default": "''",
778
+ "description": "An alternate description to use for assistive devices. If omitted, the icon will be considered presentational and\nignored by assistive devices.",
779
+ "fieldName": "label"
780
+ },
781
+ {
782
+ "name": "library",
783
+ "type": {
784
+ "text": "string"
785
+ },
786
+ "default": "'default'",
787
+ "description": "The name of a registered custom icon library.",
788
+ "fieldName": "library"
789
+ }
790
+ ],
791
+ "superclass": {
792
+ "name": "SynergyElement",
793
+ "module": "/src/internal/synergy-element.js"
794
+ },
795
+ "summary": "Icons are symbols that can be used to represent various options within an application.",
796
+ "tagNameWithoutPrefix": "icon",
797
+ "tagName": "syn-icon",
798
+ "customElement": true,
799
+ "jsDoc": "/**\n * @summary Icons are symbols that can be used to represent various options within an application.\n * @documentation https://synergy.style/components/icon\n * @status stable\n * @since 2.0\n *\n * @event syn-load - Emitted when the icon has loaded. When using `spriteSheet: true` this will not emit.\n * @event syn-error - Emitted when the icon fails to load due to an error. When using `spriteSheet: true` this will not emit.\n *\n * @csspart svg - The internal SVG element.\n * @csspart use - The <use> element generated when using `spriteSheet: true`\n */",
800
+ "documentation": "https://synergy.style/components/icon",
801
+ "status": "stable",
802
+ "since": "2.0"
803
+ }
804
+ ],
805
+ "exports": [
806
+ {
807
+ "kind": "js",
808
+ "name": "default",
809
+ "declaration": {
810
+ "name": "SynIcon",
811
+ "module": "components/icon/icon.js"
812
+ }
813
+ }
814
+ ]
815
+ },
816
+ {
817
+ "kind": "javascript-module",
818
+ "path": "components/input/input.js",
819
+ "declarations": [
820
+ {
821
+ "kind": "class",
822
+ "description": "",
823
+ "name": "SynInput",
824
+ "cssParts": [
825
+ {
826
+ "description": "The form control that wraps the label, input, and help text.",
827
+ "name": "form-control"
828
+ },
829
+ {
830
+ "description": "The label's wrapper.",
831
+ "name": "form-control-label"
832
+ },
833
+ {
834
+ "description": "The input's wrapper.",
835
+ "name": "form-control-input"
836
+ },
837
+ {
838
+ "description": "The help text's wrapper.",
839
+ "name": "form-control-help-text"
840
+ },
841
+ {
842
+ "description": "The component's base wrapper.",
843
+ "name": "base"
844
+ },
845
+ {
846
+ "description": "The internal `<input>` control.",
847
+ "name": "input"
848
+ },
849
+ {
850
+ "description": "The container that wraps the prefix.",
851
+ "name": "prefix"
852
+ },
853
+ {
854
+ "description": "The clear button.",
855
+ "name": "clear-button"
856
+ },
857
+ {
858
+ "description": "The password toggle button.",
859
+ "name": "password-toggle-button"
860
+ },
861
+ {
862
+ "description": "The container that wraps the suffix.",
863
+ "name": "suffix"
864
+ }
865
+ ],
866
+ "slots": [
867
+ {
868
+ "description": "The input's label. Alternatively, you can use the `label` attribute.",
869
+ "name": "label"
870
+ },
871
+ {
872
+ "description": "Used to prepend a presentational icon or similar element to the input.",
873
+ "name": "prefix"
874
+ },
875
+ {
876
+ "description": "Used to append a presentational icon or similar element to the input.",
877
+ "name": "suffix"
878
+ },
879
+ {
880
+ "description": "An icon to use in lieu of the default clear icon.",
881
+ "name": "clear-icon"
882
+ },
883
+ {
884
+ "description": "An icon to use in lieu of the default show password icon.",
885
+ "name": "show-password-icon"
886
+ },
887
+ {
888
+ "description": "An icon to use in lieu of the default hide password icon.",
889
+ "name": "hide-password-icon"
890
+ },
891
+ {
892
+ "description": "Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.",
893
+ "name": "help-text"
894
+ }
895
+ ],
896
+ "members": [
897
+ {
898
+ "kind": "field",
899
+ "name": "dependencies",
900
+ "type": {
901
+ "text": "object"
902
+ },
903
+ "static": true,
904
+ "default": "{ 'syn-icon': SynIcon }"
905
+ },
906
+ {
907
+ "kind": "field",
908
+ "name": "formControlController",
909
+ "privacy": "private",
910
+ "readonly": true,
911
+ "default": "new FormControlController(this, {\n assumeInteractionOn: ['syn-blur', 'syn-input']\n })"
912
+ },
913
+ {
914
+ "kind": "field",
915
+ "name": "hasSlotController",
916
+ "privacy": "private",
917
+ "readonly": true,
918
+ "default": "new HasSlotController(this, 'help-text', 'label', 'prefix', 'suffix')"
919
+ },
920
+ {
921
+ "kind": "field",
922
+ "name": "localize",
923
+ "privacy": "private",
924
+ "readonly": true,
925
+ "default": "new LocalizeController(this)"
926
+ },
927
+ {
928
+ "kind": "field",
929
+ "name": "input",
930
+ "type": {
931
+ "text": "HTMLInputElement"
932
+ }
933
+ },
934
+ {
935
+ "kind": "field",
936
+ "name": "hasFocus",
937
+ "type": {
938
+ "text": "boolean"
939
+ },
940
+ "privacy": "private",
941
+ "default": "false"
942
+ },
943
+ {
944
+ "kind": "field",
945
+ "name": "title",
946
+ "type": {
947
+ "text": "string"
948
+ },
949
+ "default": "''",
950
+ "attribute": "title"
951
+ },
952
+ {
953
+ "kind": "field",
954
+ "name": "__numberInput",
955
+ "privacy": "private"
956
+ },
957
+ {
958
+ "kind": "field",
959
+ "name": "__dateInput",
960
+ "privacy": "private"
961
+ },
962
+ {
963
+ "kind": "field",
964
+ "name": "type",
965
+ "type": {
966
+ "text": "| 'date'\n | 'datetime-local'\n | 'email'\n | 'number'\n | 'password'\n | 'search'\n | 'tel'\n | 'text'\n | 'time'\n | 'url'"
967
+ },
968
+ "default": "'text'",
969
+ "description": "The type of input. Works the same as a native `<input>` element, but only a subset of types are supported. Defaults\nto `text`.",
970
+ "attribute": "type",
971
+ "reflects": true
972
+ },
973
+ {
974
+ "kind": "field",
975
+ "name": "name",
976
+ "type": {
977
+ "text": "string"
978
+ },
979
+ "default": "''",
980
+ "description": "The name of the input, submitted as a name/value pair with form data.",
981
+ "attribute": "name"
982
+ },
983
+ {
984
+ "kind": "field",
985
+ "name": "value",
986
+ "type": {
987
+ "text": "string"
988
+ },
989
+ "default": "''",
990
+ "description": "The current value of the input, submitted as a name/value pair with form data.",
991
+ "attribute": "value"
992
+ },
993
+ {
994
+ "kind": "field",
995
+ "name": "defaultValue",
996
+ "type": {
997
+ "text": "string"
998
+ },
999
+ "default": "''",
1000
+ "description": "The default value of the form control. Primarily used for resetting the form control."
1001
+ },
1002
+ {
1003
+ "kind": "field",
1004
+ "name": "size",
1005
+ "type": {
1006
+ "text": "'small' | 'medium' | 'large'"
1007
+ },
1008
+ "default": "'medium'",
1009
+ "description": "The input's size.",
1010
+ "attribute": "size",
1011
+ "reflects": true
1012
+ },
1013
+ {
1014
+ "kind": "field",
1015
+ "name": "label",
1016
+ "type": {
1017
+ "text": "string"
1018
+ },
1019
+ "default": "''",
1020
+ "description": "The input's label. If you need to display HTML, use the `label` slot instead.",
1021
+ "attribute": "label"
1022
+ },
1023
+ {
1024
+ "kind": "field",
1025
+ "name": "helpText",
1026
+ "type": {
1027
+ "text": "string"
1028
+ },
1029
+ "default": "''",
1030
+ "description": "The input's help text. If you need to display HTML, use the `help-text` slot instead.",
1031
+ "attribute": "help-text"
1032
+ },
1033
+ {
1034
+ "kind": "field",
1035
+ "name": "clearable",
1036
+ "type": {
1037
+ "text": "boolean"
1038
+ },
1039
+ "default": "false",
1040
+ "description": "Adds a clear button when the input is not empty.",
1041
+ "attribute": "clearable"
1042
+ },
1043
+ {
1044
+ "kind": "field",
1045
+ "name": "disabled",
1046
+ "type": {
1047
+ "text": "boolean"
1048
+ },
1049
+ "default": "false",
1050
+ "description": "Disables the input.",
1051
+ "attribute": "disabled",
1052
+ "reflects": true
1053
+ },
1054
+ {
1055
+ "kind": "field",
1056
+ "name": "placeholder",
1057
+ "type": {
1058
+ "text": "string"
1059
+ },
1060
+ "default": "''",
1061
+ "description": "Placeholder text to show as a hint when the input is empty.",
1062
+ "attribute": "placeholder"
1063
+ },
1064
+ {
1065
+ "kind": "field",
1066
+ "name": "readonly",
1067
+ "type": {
1068
+ "text": "boolean"
1069
+ },
1070
+ "default": "false",
1071
+ "description": "Makes the input readonly.",
1072
+ "attribute": "readonly",
1073
+ "reflects": true
1074
+ },
1075
+ {
1076
+ "kind": "field",
1077
+ "name": "passwordToggle",
1078
+ "type": {
1079
+ "text": "boolean"
1080
+ },
1081
+ "default": "false",
1082
+ "description": "Adds a button to toggle the password's visibility. Only applies to password types.",
1083
+ "attribute": "password-toggle"
1084
+ },
1085
+ {
1086
+ "kind": "field",
1087
+ "name": "passwordVisible",
1088
+ "type": {
1089
+ "text": "boolean"
1090
+ },
1091
+ "default": "false",
1092
+ "description": "Determines whether or not the password is currently visible. Only applies to password input types.",
1093
+ "attribute": "password-visible"
1094
+ },
1095
+ {
1096
+ "kind": "field",
1097
+ "name": "noSpinButtons",
1098
+ "type": {
1099
+ "text": "boolean"
1100
+ },
1101
+ "default": "false",
1102
+ "description": "Hides the browser's built-in increment/decrement spin buttons for number inputs.",
1103
+ "attribute": "no-spin-buttons"
1104
+ },
1105
+ {
1106
+ "kind": "field",
1107
+ "name": "form",
1108
+ "type": {
1109
+ "text": "string"
1110
+ },
1111
+ "default": "''",
1112
+ "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
1113
+ "attribute": "form",
1114
+ "reflects": true
1115
+ },
1116
+ {
1117
+ "kind": "field",
1118
+ "name": "required",
1119
+ "type": {
1120
+ "text": "boolean"
1121
+ },
1122
+ "default": "false",
1123
+ "description": "Makes the input a required field.",
1124
+ "attribute": "required",
1125
+ "reflects": true
1126
+ },
1127
+ {
1128
+ "kind": "field",
1129
+ "name": "pattern",
1130
+ "type": {
1131
+ "text": "string"
1132
+ },
1133
+ "description": "A regular expression pattern to validate input against.",
1134
+ "attribute": "pattern"
1135
+ },
1136
+ {
1137
+ "kind": "field",
1138
+ "name": "minlength",
1139
+ "type": {
1140
+ "text": "number"
1141
+ },
1142
+ "description": "The minimum length of input that will be considered valid.",
1143
+ "attribute": "minlength"
1144
+ },
1145
+ {
1146
+ "kind": "field",
1147
+ "name": "maxlength",
1148
+ "type": {
1149
+ "text": "number"
1150
+ },
1151
+ "description": "The maximum length of input that will be considered valid.",
1152
+ "attribute": "maxlength"
1153
+ },
1154
+ {
1155
+ "kind": "field",
1156
+ "name": "min",
1157
+ "type": {
1158
+ "text": "number | string"
1159
+ },
1160
+ "description": "The input's minimum value. Only applies to date and number input types.",
1161
+ "attribute": "min"
1162
+ },
1163
+ {
1164
+ "kind": "field",
1165
+ "name": "max",
1166
+ "type": {
1167
+ "text": "number | string"
1168
+ },
1169
+ "description": "The input's maximum value. Only applies to date and number input types.",
1170
+ "attribute": "max"
1171
+ },
1172
+ {
1173
+ "kind": "field",
1174
+ "name": "step",
1175
+ "type": {
1176
+ "text": "number | 'any'"
1177
+ },
1178
+ "description": "Specifies the granularity that the value must adhere to, or the special value `any` which means no stepping is\nimplied, allowing any numeric value. Only applies to date and number input types.",
1179
+ "attribute": "step"
1180
+ },
1181
+ {
1182
+ "kind": "field",
1183
+ "name": "autocapitalize",
1184
+ "type": {
1185
+ "text": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'"
1186
+ },
1187
+ "description": "Controls whether and how text input is automatically capitalized as it is entered by the user.",
1188
+ "attribute": "autocapitalize"
1189
+ },
1190
+ {
1191
+ "kind": "field",
1192
+ "name": "autocorrect",
1193
+ "type": {
1194
+ "text": "'off' | 'on'"
1195
+ },
1196
+ "description": "Indicates whether the browser's autocorrect feature is on or off.",
1197
+ "attribute": "autocorrect"
1198
+ },
1199
+ {
1200
+ "kind": "field",
1201
+ "name": "autocomplete",
1202
+ "type": {
1203
+ "text": "string"
1204
+ },
1205
+ "description": "Specifies what permission the browser has to provide assistance in filling out form field values. Refer to\n[this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.",
1206
+ "attribute": "autocomplete"
1207
+ },
1208
+ {
1209
+ "kind": "field",
1210
+ "name": "autofocus",
1211
+ "type": {
1212
+ "text": "boolean"
1213
+ },
1214
+ "description": "Indicates that the input should receive focus on page load.",
1215
+ "attribute": "autofocus"
1216
+ },
1217
+ {
1218
+ "kind": "field",
1219
+ "name": "enterkeyhint",
1220
+ "type": {
1221
+ "text": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'"
1222
+ },
1223
+ "description": "Used to customize the label or icon of the Enter key on virtual keyboards.",
1224
+ "attribute": "enterkeyhint"
1225
+ },
1226
+ {
1227
+ "kind": "field",
1228
+ "name": "spellcheck",
1229
+ "type": {
1230
+ "text": "boolean"
1231
+ },
1232
+ "default": "true",
1233
+ "description": "Enables spell checking on the input.",
1234
+ "attribute": "spellcheck"
1235
+ },
1236
+ {
1237
+ "kind": "field",
1238
+ "name": "inputmode",
1239
+ "type": {
1240
+ "text": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'"
1241
+ },
1242
+ "description": "Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual\nkeyboard on supportive devices.",
1243
+ "attribute": "inputmode"
1244
+ },
1245
+ {
1246
+ "kind": "field",
1247
+ "name": "valueAsDate",
1248
+ "description": "Gets or sets the current value as a `Date` object. Returns `null` if the value can't be converted. This will use the native `<input type=\"{{type}}\">` implementation and may result in an error."
1249
+ },
1250
+ {
1251
+ "kind": "field",
1252
+ "name": "valueAsNumber",
1253
+ "description": "Gets or sets the current value as a number. Returns `NaN` if the value can't be converted."
1254
+ },
1255
+ {
1256
+ "kind": "field",
1257
+ "name": "validity",
1258
+ "description": "Gets the validity state object",
1259
+ "readonly": true
1260
+ },
1261
+ {
1262
+ "kind": "field",
1263
+ "name": "validationMessage",
1264
+ "description": "Gets the validation message",
1265
+ "readonly": true
1266
+ },
1267
+ {
1268
+ "kind": "method",
1269
+ "name": "handleBlur",
1270
+ "privacy": "private"
1271
+ },
1272
+ {
1273
+ "kind": "method",
1274
+ "name": "handleChange",
1275
+ "privacy": "private"
1276
+ },
1277
+ {
1278
+ "kind": "method",
1279
+ "name": "handleClearClick",
1280
+ "privacy": "private",
1281
+ "parameters": [
1282
+ {
1283
+ "name": "event",
1284
+ "type": {
1285
+ "text": "MouseEvent"
1286
+ }
1287
+ }
1288
+ ]
1289
+ },
1290
+ {
1291
+ "kind": "method",
1292
+ "name": "handleFocus",
1293
+ "privacy": "private"
1294
+ },
1295
+ {
1296
+ "kind": "method",
1297
+ "name": "handleInput",
1298
+ "privacy": "private"
1299
+ },
1300
+ {
1301
+ "kind": "method",
1302
+ "name": "handleInvalid",
1303
+ "privacy": "private",
1304
+ "parameters": [
1305
+ {
1306
+ "name": "event",
1307
+ "type": {
1308
+ "text": "Event"
1309
+ }
1310
+ }
1311
+ ]
1312
+ },
1313
+ {
1314
+ "kind": "method",
1315
+ "name": "handleKeyDown",
1316
+ "privacy": "private",
1317
+ "parameters": [
1318
+ {
1319
+ "name": "event",
1320
+ "type": {
1321
+ "text": "KeyboardEvent"
1322
+ }
1323
+ }
1324
+ ]
1325
+ },
1326
+ {
1327
+ "kind": "method",
1328
+ "name": "handlePasswordToggle",
1329
+ "privacy": "private"
1330
+ },
1331
+ {
1332
+ "kind": "method",
1333
+ "name": "handleDisabledChange"
1334
+ },
1335
+ {
1336
+ "kind": "method",
1337
+ "name": "handleStepChange"
1338
+ },
1339
+ {
1340
+ "kind": "method",
1341
+ "name": "handleValueChange"
1342
+ },
1343
+ {
1344
+ "kind": "method",
1345
+ "name": "focus",
1346
+ "parameters": [
1347
+ {
1348
+ "name": "options",
1349
+ "optional": true,
1350
+ "type": {
1351
+ "text": "FocusOptions"
1352
+ }
1353
+ }
1354
+ ],
1355
+ "description": "Sets focus on the input."
1356
+ },
1357
+ {
1358
+ "kind": "method",
1359
+ "name": "blur",
1360
+ "description": "Removes focus from the input."
1361
+ },
1362
+ {
1363
+ "kind": "method",
1364
+ "name": "select",
1365
+ "description": "Selects all the text in the input."
1366
+ },
1367
+ {
1368
+ "kind": "method",
1369
+ "name": "setSelectionRange",
1370
+ "parameters": [
1371
+ {
1372
+ "name": "selectionStart",
1373
+ "type": {
1374
+ "text": "number"
1375
+ }
1376
+ },
1377
+ {
1378
+ "name": "selectionEnd",
1379
+ "type": {
1380
+ "text": "number"
1381
+ }
1382
+ },
1383
+ {
1384
+ "name": "selectionDirection",
1385
+ "default": "'none'",
1386
+ "type": {
1387
+ "text": "'forward' | 'backward' | 'none'"
1388
+ }
1389
+ }
1390
+ ],
1391
+ "description": "Sets the start and end positions of the text selection (0-based)."
1392
+ },
1393
+ {
1394
+ "kind": "method",
1395
+ "name": "setRangeText",
1396
+ "parameters": [
1397
+ {
1398
+ "name": "replacement",
1399
+ "type": {
1400
+ "text": "string"
1401
+ }
1402
+ },
1403
+ {
1404
+ "name": "start",
1405
+ "optional": true,
1406
+ "type": {
1407
+ "text": "number"
1408
+ }
1409
+ },
1410
+ {
1411
+ "name": "end",
1412
+ "optional": true,
1413
+ "type": {
1414
+ "text": "number"
1415
+ }
1416
+ },
1417
+ {
1418
+ "name": "selectMode",
1419
+ "optional": true,
1420
+ "type": {
1421
+ "text": "'select' | 'start' | 'end' | 'preserve'"
1422
+ }
1423
+ }
1424
+ ],
1425
+ "description": "Replaces a range of text with a new string."
1426
+ },
1427
+ {
1428
+ "kind": "method",
1429
+ "name": "showPicker",
1430
+ "description": "Displays the browser picker for an input element (only works if the browser supports it for the input type)."
1431
+ },
1432
+ {
1433
+ "kind": "method",
1434
+ "name": "stepUp",
1435
+ "description": "Increments the value of a numeric input type by the value of the step attribute."
1436
+ },
1437
+ {
1438
+ "kind": "method",
1439
+ "name": "stepDown",
1440
+ "description": "Decrements the value of a numeric input type by the value of the step attribute."
1441
+ },
1442
+ {
1443
+ "kind": "method",
1444
+ "name": "checkValidity",
1445
+ "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
1446
+ },
1447
+ {
1448
+ "kind": "method",
1449
+ "name": "getForm",
1450
+ "return": {
1451
+ "type": {
1452
+ "text": "HTMLFormElement | null"
1453
+ }
1454
+ },
1455
+ "description": "Gets the associated form, if one exists."
1456
+ },
1457
+ {
1458
+ "kind": "method",
1459
+ "name": "reportValidity",
1460
+ "description": "Checks for validity and shows the browser's validation message if the control is invalid."
1461
+ },
1462
+ {
1463
+ "kind": "method",
1464
+ "name": "setCustomValidity",
1465
+ "parameters": [
1466
+ {
1467
+ "name": "message",
1468
+ "type": {
1469
+ "text": "string"
1470
+ }
1471
+ }
1472
+ ],
1473
+ "description": "Sets a custom validation message. Pass an empty string to restore validity."
1474
+ }
1475
+ ],
1476
+ "events": [
1477
+ {
1478
+ "description": "Emitted when the control loses focus.",
1479
+ "name": "syn-blur",
1480
+ "reactName": "onSynBlur",
1481
+ "eventName": "SynBlurEvent"
1482
+ },
1483
+ {
1484
+ "description": "Emitted when an alteration to the control's value is committed by the user.",
1485
+ "name": "syn-change",
1486
+ "reactName": "onSynChange",
1487
+ "eventName": "SynChangeEvent"
1488
+ },
1489
+ {
1490
+ "description": "Emitted when the clear button is activated.",
1491
+ "name": "syn-clear",
1492
+ "reactName": "onSynClear",
1493
+ "eventName": "SynClearEvent"
1494
+ },
1495
+ {
1496
+ "description": "Emitted when the control gains focus.",
1497
+ "name": "syn-focus",
1498
+ "reactName": "onSynFocus",
1499
+ "eventName": "SynFocusEvent"
1500
+ },
1501
+ {
1502
+ "description": "Emitted when the control receives input.",
1503
+ "name": "syn-input",
1504
+ "reactName": "onSynInput",
1505
+ "eventName": "SynInputEvent"
1506
+ },
1507
+ {
1508
+ "description": "Emitted when the form control has been checked for validity and its constraints aren't satisfied.",
1509
+ "name": "syn-invalid",
1510
+ "reactName": "onSynInvalid",
1511
+ "eventName": "SynInvalidEvent"
1512
+ }
1513
+ ],
1514
+ "attributes": [
1515
+ {
1516
+ "name": "title",
1517
+ "type": {
1518
+ "text": "string"
1519
+ },
1520
+ "default": "''",
1521
+ "fieldName": "title"
1522
+ },
1523
+ {
1524
+ "name": "type",
1525
+ "type": {
1526
+ "text": "| 'date'\n | 'datetime-local'\n | 'email'\n | 'number'\n | 'password'\n | 'search'\n | 'tel'\n | 'text'\n | 'time'\n | 'url'"
1527
+ },
1528
+ "default": "'text'",
1529
+ "description": "The type of input. Works the same as a native `<input>` element, but only a subset of types are supported. Defaults\nto `text`.",
1530
+ "fieldName": "type"
1531
+ },
1532
+ {
1533
+ "name": "name",
1534
+ "type": {
1535
+ "text": "string"
1536
+ },
1537
+ "default": "''",
1538
+ "description": "The name of the input, submitted as a name/value pair with form data.",
1539
+ "fieldName": "name"
1540
+ },
1541
+ {
1542
+ "name": "value",
1543
+ "type": {
1544
+ "text": "string"
1545
+ },
1546
+ "default": "''",
1547
+ "description": "The current value of the input, submitted as a name/value pair with form data.",
1548
+ "fieldName": "value"
1549
+ },
1550
+ {
1551
+ "name": "size",
1552
+ "type": {
1553
+ "text": "'small' | 'medium' | 'large'"
1554
+ },
1555
+ "default": "'medium'",
1556
+ "description": "The input's size.",
1557
+ "fieldName": "size"
1558
+ },
1559
+ {
1560
+ "name": "label",
1561
+ "type": {
1562
+ "text": "string"
1563
+ },
1564
+ "default": "''",
1565
+ "description": "The input's label. If you need to display HTML, use the `label` slot instead.",
1566
+ "fieldName": "label"
1567
+ },
1568
+ {
1569
+ "name": "help-text",
1570
+ "type": {
1571
+ "text": "string"
1572
+ },
1573
+ "default": "''",
1574
+ "description": "The input's help text. If you need to display HTML, use the `help-text` slot instead.",
1575
+ "fieldName": "helpText"
1576
+ },
1577
+ {
1578
+ "name": "clearable",
1579
+ "type": {
1580
+ "text": "boolean"
1581
+ },
1582
+ "default": "false",
1583
+ "description": "Adds a clear button when the input is not empty.",
1584
+ "fieldName": "clearable"
1585
+ },
1586
+ {
1587
+ "name": "disabled",
1588
+ "type": {
1589
+ "text": "boolean"
1590
+ },
1591
+ "default": "false",
1592
+ "description": "Disables the input.",
1593
+ "fieldName": "disabled"
1594
+ },
1595
+ {
1596
+ "name": "placeholder",
1597
+ "type": {
1598
+ "text": "string"
1599
+ },
1600
+ "default": "''",
1601
+ "description": "Placeholder text to show as a hint when the input is empty.",
1602
+ "fieldName": "placeholder"
1603
+ },
1604
+ {
1605
+ "name": "readonly",
1606
+ "type": {
1607
+ "text": "boolean"
1608
+ },
1609
+ "default": "false",
1610
+ "description": "Makes the input readonly.",
1611
+ "fieldName": "readonly"
1612
+ },
1613
+ {
1614
+ "name": "password-toggle",
1615
+ "type": {
1616
+ "text": "boolean"
1617
+ },
1618
+ "default": "false",
1619
+ "description": "Adds a button to toggle the password's visibility. Only applies to password types.",
1620
+ "fieldName": "passwordToggle"
1621
+ },
1622
+ {
1623
+ "name": "password-visible",
1624
+ "type": {
1625
+ "text": "boolean"
1626
+ },
1627
+ "default": "false",
1628
+ "description": "Determines whether or not the password is currently visible. Only applies to password input types.",
1629
+ "fieldName": "passwordVisible"
1630
+ },
1631
+ {
1632
+ "name": "no-spin-buttons",
1633
+ "type": {
1634
+ "text": "boolean"
1635
+ },
1636
+ "default": "false",
1637
+ "description": "Hides the browser's built-in increment/decrement spin buttons for number inputs.",
1638
+ "fieldName": "noSpinButtons"
1639
+ },
1640
+ {
1641
+ "name": "form",
1642
+ "type": {
1643
+ "text": "string"
1644
+ },
1645
+ "default": "''",
1646
+ "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
1647
+ "fieldName": "form"
1648
+ },
1649
+ {
1650
+ "name": "required",
1651
+ "type": {
1652
+ "text": "boolean"
1653
+ },
1654
+ "default": "false",
1655
+ "description": "Makes the input a required field.",
1656
+ "fieldName": "required"
1657
+ },
1658
+ {
1659
+ "name": "pattern",
1660
+ "type": {
1661
+ "text": "string"
1662
+ },
1663
+ "description": "A regular expression pattern to validate input against.",
1664
+ "fieldName": "pattern"
1665
+ },
1666
+ {
1667
+ "name": "minlength",
1668
+ "type": {
1669
+ "text": "number"
1670
+ },
1671
+ "description": "The minimum length of input that will be considered valid.",
1672
+ "fieldName": "minlength"
1673
+ },
1674
+ {
1675
+ "name": "maxlength",
1676
+ "type": {
1677
+ "text": "number"
1678
+ },
1679
+ "description": "The maximum length of input that will be considered valid.",
1680
+ "fieldName": "maxlength"
1681
+ },
1682
+ {
1683
+ "name": "min",
1684
+ "type": {
1685
+ "text": "number | string"
1686
+ },
1687
+ "description": "The input's minimum value. Only applies to date and number input types.",
1688
+ "fieldName": "min"
1689
+ },
1690
+ {
1691
+ "name": "max",
1692
+ "type": {
1693
+ "text": "number | string"
1694
+ },
1695
+ "description": "The input's maximum value. Only applies to date and number input types.",
1696
+ "fieldName": "max"
1697
+ },
1698
+ {
1699
+ "name": "step",
1700
+ "type": {
1701
+ "text": "number | 'any'"
1702
+ },
1703
+ "description": "Specifies the granularity that the value must adhere to, or the special value `any` which means no stepping is\nimplied, allowing any numeric value. Only applies to date and number input types.",
1704
+ "fieldName": "step"
1705
+ },
1706
+ {
1707
+ "name": "autocapitalize",
1708
+ "type": {
1709
+ "text": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'"
1710
+ },
1711
+ "description": "Controls whether and how text input is automatically capitalized as it is entered by the user.",
1712
+ "fieldName": "autocapitalize"
1713
+ },
1714
+ {
1715
+ "name": "autocorrect",
1716
+ "type": {
1717
+ "text": "'off' | 'on'"
1718
+ },
1719
+ "description": "Indicates whether the browser's autocorrect feature is on or off.",
1720
+ "fieldName": "autocorrect"
1721
+ },
1722
+ {
1723
+ "name": "autocomplete",
1724
+ "type": {
1725
+ "text": "string"
1726
+ },
1727
+ "description": "Specifies what permission the browser has to provide assistance in filling out form field values. Refer to\n[this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.",
1728
+ "fieldName": "autocomplete"
1729
+ },
1730
+ {
1731
+ "name": "autofocus",
1732
+ "type": {
1733
+ "text": "boolean"
1734
+ },
1735
+ "description": "Indicates that the input should receive focus on page load.",
1736
+ "fieldName": "autofocus"
1737
+ },
1738
+ {
1739
+ "name": "enterkeyhint",
1740
+ "type": {
1741
+ "text": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'"
1742
+ },
1743
+ "description": "Used to customize the label or icon of the Enter key on virtual keyboards.",
1744
+ "fieldName": "enterkeyhint"
1745
+ },
1746
+ {
1747
+ "name": "spellcheck",
1748
+ "type": {
1749
+ "text": "boolean"
1750
+ },
1751
+ "default": "true",
1752
+ "description": "Enables spell checking on the input.",
1753
+ "fieldName": "spellcheck"
1754
+ },
1755
+ {
1756
+ "name": "inputmode",
1757
+ "type": {
1758
+ "text": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'"
1759
+ },
1760
+ "description": "Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual\nkeyboard on supportive devices.",
1761
+ "fieldName": "inputmode"
1762
+ }
1763
+ ],
1764
+ "superclass": {
1765
+ "name": "SynergyElement",
1766
+ "module": "/src/internal/synergy-element.js"
1767
+ },
1768
+ "summary": "Inputs collect data from the user.",
1769
+ "tagNameWithoutPrefix": "input",
1770
+ "tagName": "syn-input",
1771
+ "customElement": true,
1772
+ "jsDoc": "/**\n * @summary Inputs collect data from the user.\n * @documentation https://synergy.style/components/input\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n *\n * @slot label - The input's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - Used to prepend a presentational icon or similar element to the input.\n * @slot suffix - Used to append a presentational icon or similar element to the input.\n * @slot clear-icon - An icon to use in lieu of the default clear icon.\n * @slot show-password-icon - An icon to use in lieu of the default show password icon.\n * @slot hide-password-icon - An icon to use in lieu of the default hide password icon.\n * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n *\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-change - Emitted when an alteration to the control's value is committed by the user.\n * @event syn-clear - Emitted when the clear button is activated.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-input - Emitted when the control receives input.\n * @event syn-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n *\n * @csspart form-control - The form control that wraps the label, input, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The input's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart base - The component's base wrapper.\n * @csspart input - The internal `<input>` control.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart clear-button - The clear button.\n * @csspart password-toggle-button - The password toggle button.\n * @csspart suffix - The container that wraps the suffix.\n */",
1773
+ "documentation": "https://synergy.style/components/input",
1774
+ "status": "stable",
1775
+ "since": "2.0",
1776
+ "dependencies": [
1777
+ "syn-icon"
1778
+ ]
1779
+ }
1780
+ ],
1781
+ "exports": [
1782
+ {
1783
+ "kind": "js",
1784
+ "name": "default",
1785
+ "declaration": {
1786
+ "name": "SynInput",
1787
+ "module": "components/input/input.js"
1788
+ }
1789
+ }
1790
+ ]
1791
+ },
1792
+ {
1793
+ "kind": "javascript-module",
1794
+ "path": "components/spinner/spinner.js",
1795
+ "declarations": [
1796
+ {
1797
+ "kind": "class",
1798
+ "description": "",
1799
+ "name": "SynSpinner",
1800
+ "cssProperties": [
1801
+ {
1802
+ "description": "The width of the track.",
1803
+ "name": "--track-width"
1804
+ },
1805
+ {
1806
+ "description": "The color of the track.",
1807
+ "name": "--track-color"
1808
+ },
1809
+ {
1810
+ "description": "The color of the spinner's indicator.",
1811
+ "name": "--indicator-color"
1812
+ },
1813
+ {
1814
+ "description": "The time it takes for the spinner to complete one animation cycle.",
1815
+ "name": "--speed"
1816
+ }
1817
+ ],
1818
+ "cssParts": [
1819
+ {
1820
+ "description": "The component's base wrapper.",
1821
+ "name": "base"
1822
+ }
1823
+ ],
1824
+ "members": [
1825
+ {
1826
+ "kind": "field",
1827
+ "name": "localize",
1828
+ "privacy": "private",
1829
+ "readonly": true,
1830
+ "default": "new LocalizeController(this)"
1831
+ }
1832
+ ],
1833
+ "superclass": {
1834
+ "name": "SynergyElement",
1835
+ "module": "/src/internal/synergy-element.js"
1836
+ },
1837
+ "summary": "Spinners are used to show the progress of an indeterminate operation.",
1838
+ "tagNameWithoutPrefix": "spinner",
1839
+ "tagName": "syn-spinner",
1840
+ "customElement": true,
1841
+ "jsDoc": "/**\n * @summary Spinners are used to show the progress of an indeterminate operation.\n * @documentation https://synergy.style/components/spinner\n * @status stable\n * @since 2.0\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --track-width - The width of the track.\n * @cssproperty --track-color - The color of the track.\n * @cssproperty --indicator-color - The color of the spinner's indicator.\n * @cssproperty --speed - The time it takes for the spinner to complete one animation cycle.\n */",
1842
+ "documentation": "https://synergy.style/components/spinner",
1843
+ "status": "stable",
1844
+ "since": "2.0"
1845
+ }
1846
+ ],
1847
+ "exports": [
1848
+ {
1849
+ "kind": "js",
1850
+ "name": "default",
1851
+ "declaration": {
1852
+ "name": "SynSpinner",
1853
+ "module": "components/spinner/spinner.js"
1854
+ }
1855
+ }
1856
+ ]
1857
+ }
1858
+ ],
1859
+ "package": {
1860
+ "name": "@synergy-design-system/components",
1861
+ "description": "",
1862
+ "version": "1.0.0-main.3",
1863
+ "author": {
1864
+ "name": "SICK Global UX Foundation",
1865
+ "url": "https://www.sick.com"
1866
+ },
1867
+ "homepage": "https://github.com/SickDesignSystem/synergy/tree/main/packages/components",
1868
+ "license": "ISC"
1869
+ }
1870
+ }