@kubex/zinc 1.1.76 → 1.1.78

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 (16) hide show
  1. package/dist/custom-elements.json +1049 -955
  2. package/dist/vscode.html-custom-data.json +53 -43
  3. package/dist/web-types.json +156 -131
  4. package/dist/zn.d.ts +21 -1
  5. package/dist/zn.min.js +129 -104
  6. package/docs/pages/components/preview-frame.md +14 -6
  7. package/docs/pages/components/rating.md +59 -0
  8. package/docs/pages/components/theme-editor.md +4 -0
  9. package/package.json +1 -1
  10. package/src/components/preview-frame/preview-frame.component.ts +12 -2
  11. package/src/components/preview-frame/preview-frame.test.ts +38 -0
  12. package/src/components/rating/rating.component.ts +112 -55
  13. package/src/components/rating/rating.scss +24 -0
  14. package/src/components/theme-editor/theme-editor.component.ts +7 -4
  15. package/src/components/theme-editor/theme-editor.scss +4 -2
  16. package/src/components/theme-editor/theme-editor.test.ts +16 -0
package/dist/custom-elements.json CHANGED
@@ -47,6 +47,79 @@
47
47
  }
48
48
  ]
49
49
  },
50
+ {
51
+ "kind": "javascript-module",
52
+ "path": "components/action-bar/action-bar.js",
53
+ "declarations": [
54
+ {
55
+ "kind": "class",
56
+ "description": "",
57
+ "name": "ZnActionBar",
58
+ "cssProperties": [
59
+ {
60
+ "description": "An example CSS custom property.",
61
+ "name": "--example"
62
+ }
63
+ ],
64
+ "cssParts": [
65
+ {
66
+ "description": "The component's base wrapper.",
67
+ "name": "base"
68
+ }
69
+ ],
70
+ "slots": [
71
+ {
72
+ "description": "The default slot.",
73
+ "name": ""
74
+ },
75
+ {
76
+ "description": "An example slot.",
77
+ "name": "example"
78
+ }
79
+ ],
80
+ "members": [
81
+ {
82
+ "kind": "field",
83
+ "name": "localize",
84
+ "privacy": "private",
85
+ "readonly": true,
86
+ "default": "new LocalizeController(this)"
87
+ }
88
+ ],
89
+ "events": [
90
+ {
91
+ "description": "Emitted as an example.",
92
+ "name": "zn-event-name"
93
+ }
94
+ ],
95
+ "superclass": {
96
+ "name": "ZincElement",
97
+ "module": "/src/internal/zinc-element"
98
+ },
99
+ "summary": "Short summary of the component's intended use.",
100
+ "tagNameWithoutPrefix": "action-bar",
101
+ "tagName": "zn-action-bar",
102
+ "customElement": true,
103
+ "jsDoc": "/**\n * @summary Short summary of the component's intended use.\n * @documentation https://zinc.style/components/action-bar\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-example\n *\n * @event zn-event-name - Emitted as an example.\n *\n * @slot - The default slot.\n * @slot example - An example slot.\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --example - An example CSS custom property.\n */",
104
+ "documentation": "https://zinc.style/components/action-bar",
105
+ "status": "experimental",
106
+ "since": "1.0",
107
+ "dependencies": [
108
+ "zn-example"
109
+ ]
110
+ }
111
+ ],
112
+ "exports": [
113
+ {
114
+ "kind": "js",
115
+ "name": "default",
116
+ "declaration": {
117
+ "name": "ZnActionBar",
118
+ "module": "components/action-bar/action-bar.js"
119
+ }
120
+ }
121
+ ]
122
+ },
50
123
  {
51
124
  "kind": "javascript-module",
52
125
  "path": "components/alert/alert.js",
@@ -241,79 +314,6 @@
241
314
  }
242
315
  ]
243
316
  },
244
- {
245
- "kind": "javascript-module",
246
- "path": "components/action-bar/action-bar.js",
247
- "declarations": [
248
- {
249
- "kind": "class",
250
- "description": "",
251
- "name": "ZnActionBar",
252
- "cssProperties": [
253
- {
254
- "description": "An example CSS custom property.",
255
- "name": "--example"
256
- }
257
- ],
258
- "cssParts": [
259
- {
260
- "description": "The component's base wrapper.",
261
- "name": "base"
262
- }
263
- ],
264
- "slots": [
265
- {
266
- "description": "The default slot.",
267
- "name": ""
268
- },
269
- {
270
- "description": "An example slot.",
271
- "name": "example"
272
- }
273
- ],
274
- "members": [
275
- {
276
- "kind": "field",
277
- "name": "localize",
278
- "privacy": "private",
279
- "readonly": true,
280
- "default": "new LocalizeController(this)"
281
- }
282
- ],
283
- "events": [
284
- {
285
- "description": "Emitted as an example.",
286
- "name": "zn-event-name"
287
- }
288
- ],
289
- "superclass": {
290
- "name": "ZincElement",
291
- "module": "/src/internal/zinc-element"
292
- },
293
- "summary": "Short summary of the component's intended use.",
294
- "tagNameWithoutPrefix": "action-bar",
295
- "tagName": "zn-action-bar",
296
- "customElement": true,
297
- "jsDoc": "/**\n * @summary Short summary of the component's intended use.\n * @documentation https://zinc.style/components/action-bar\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-example\n *\n * @event zn-event-name - Emitted as an example.\n *\n * @slot - The default slot.\n * @slot example - An example slot.\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --example - An example CSS custom property.\n */",
298
- "documentation": "https://zinc.style/components/action-bar",
299
- "status": "experimental",
300
- "since": "1.0",
301
- "dependencies": [
302
- "zn-example"
303
- ]
304
- }
305
- ],
306
- "exports": [
307
- {
308
- "kind": "js",
309
- "name": "default",
310
- "declaration": {
311
- "name": "ZnActionBar",
312
- "module": "components/action-bar/action-bar.js"
313
- }
314
- }
315
- ]
316
- },
317
317
  {
318
318
  "kind": "javascript-module",
319
319
  "path": "components/animated-button/animated-button.js",
@@ -29069,7 +29069,7 @@
29069
29069
  "text": "boolean"
29070
29070
  },
29071
29071
  "default": "false",
29072
- "description": "Lets pointer input through to the embedded page. The preview is inert by\ndefault: clicks never reach the frame, so the previewed page can't be\nnavigated or submitted from inside the preview. Cross-origin content can't\nbe reached from here to cancel its own handlers, so this blocks pointer\ninput entirely — hover goes with it. Scrolling doesn't: an overflowing\npage is scrolled by the panel rather than by the frame (see _contentHeight).",
29072
+ "description": "Lets pointer input through to the embedded page. The preview is inert by\ndefault: clicks never reach the frame, so the previewed page can't be\nnavigated or submitted from inside the preview. Cross-origin content can't\nbe reached from here to cancel its own handlers, so this blocks pointer\ninput entirely — hover goes with it. Scrolling doesn't: an overflowing\npage is scrolled by the panel rather than by the frame (see _contentHeight).\n\nSet, the frame becomes a real viewport instead: it stays the panel's own\nheight and the embed scrolls itself, so there is one scrollbar rather than\na panel scrolling an oversized frame, and the embed's viewport-relative\nlayout (`100vh`, `position: fixed`, sticky headers) sizes to what's on\nscreen. _contentHeight is ignored while this is set.",
29073
29073
  "attribute": "interactive",
29074
29074
  "reflects": true
29075
29075
  },
@@ -29097,7 +29097,7 @@
29097
29097
  },
29098
29098
  "privacy": "private",
29099
29099
  "default": "0",
29100
- "description": "Height of the embedded page's content, when it's known: reported by the\nembed (`height` on hp-preview:rendered, or an hp-preview:height message) or\nmeasured directly for a same-origin embed. The frame is laid out at this\nheight rather than the panel's, so the page never scrolls inside the frame\n— the panel scrolls instead, which is what makes an overflowing preview\nreachable while pointer input to the frame is blocked. 0 = unknown, and the\nframe falls back to filling the panel."
29100
+ "description": "Height of the embedded page's content, when it's known: reported by the\nembed (`height` on hp-preview:rendered, or an hp-preview:height message) or\nmeasured directly for a same-origin embed. The frame is laid out at this\nheight rather than the panel's, so the page never scrolls inside the frame\n— the panel scrolls instead, which is what makes an overflowing preview\nreachable while pointer input to the frame is blocked. 0 = unknown, and the\nframe falls back to filling the panel. Kept up to date either way, but only\nlaid out when the frame is inert: an `interactive` frame scrolls itself."
29101
29101
  },
29102
29102
  {
29103
29103
  "kind": "field",
@@ -29385,7 +29385,7 @@
29385
29385
  "text": "boolean"
29386
29386
  },
29387
29387
  "default": "false",
29388
- "description": "Lets pointer input through to the embedded page. The preview is inert by\ndefault: clicks never reach the frame, so the previewed page can't be\nnavigated or submitted from inside the preview. Cross-origin content can't\nbe reached from here to cancel its own handlers, so this blocks pointer\ninput entirely — hover goes with it. Scrolling doesn't: an overflowing\npage is scrolled by the panel rather than by the frame (see _contentHeight).",
29388
+ "description": "Lets pointer input through to the embedded page. The preview is inert by\ndefault: clicks never reach the frame, so the previewed page can't be\nnavigated or submitted from inside the preview. Cross-origin content can't\nbe reached from here to cancel its own handlers, so this blocks pointer\ninput entirely — hover goes with it. Scrolling doesn't: an overflowing\npage is scrolled by the panel rather than by the frame (see _contentHeight).\n\nSet, the frame becomes a real viewport instead: it stays the panel's own\nheight and the embed scrolls itself, so there is one scrollbar rather than\na panel scrolling an oversized frame, and the embed's viewport-relative\nlayout (`100vh`, `position: fixed`, sticky headers) sizes to what's on\nscreen. _contentHeight is ignored while this is set.",
29389
29389
  "fieldName": "interactive"
29390
29390
  }
29391
29391
  ],
@@ -32072,12 +32072,32 @@
32072
32072
  {
32073
32073
  "description": "An example CSS custom property.",
32074
32074
  "name": "--example"
32075
+ },
32076
+ {
32077
+ "description": "The color of the preview value.",
32078
+ "name": "--preview-color"
32079
+ },
32080
+ {
32081
+ "description": "The font size of the preview value.",
32082
+ "name": "--preview-size"
32075
32083
  }
32076
32084
  ],
32077
32085
  "cssParts": [
32086
+ {
32087
+ "description": "The form control that wraps the symbols and help text.",
32088
+ "name": "form-control"
32089
+ },
32090
+ {
32091
+ "description": "The help text's wrapper.",
32092
+ "name": "form-control-help-text"
32093
+ },
32078
32094
  {
32079
32095
  "description": "The component's base wrapper.",
32080
32096
  "name": "base"
32097
+ },
32098
+ {
32099
+ "description": "The value shown next to the symbols when `preview` is enabled.",
32100
+ "name": "preview"
32081
32101
  }
32082
32102
  ],
32083
32103
  "slots": [
@@ -32088,6 +32108,10 @@
32088
32108
  {
32089
32109
  "description": "An example slot.",
32090
32110
  "name": "example"
32111
+ },
32112
+ {
32113
+ "description": "Text that describes how to use the rating. Alternatively, you can use the `help-text` attribute.",
32114
+ "name": "help-text"
32091
32115
  }
32092
32116
  ],
32093
32117
  "members": [
@@ -32098,6 +32122,13 @@
32098
32122
  "readonly": true,
32099
32123
  "default": "new FormControlController(this, { assumeInteractionOn: ['zn-blur', 'zn-input'] })"
32100
32124
  },
32125
+ {
32126
+ "kind": "field",
32127
+ "name": "hasSlotController",
32128
+ "privacy": "private",
32129
+ "readonly": true,
32130
+ "default": "new HasSlotController(this, 'help-text')"
32131
+ },
32101
32132
  {
32102
32133
  "kind": "field",
32103
32134
  "name": "rating",
@@ -32105,6 +32136,13 @@
32105
32136
  "text": "HTMLElement"
32106
32137
  }
32107
32138
  },
32139
+ {
32140
+ "kind": "field",
32141
+ "name": "symbols",
32142
+ "type": {
32143
+ "text": "HTMLElement"
32144
+ }
32145
+ },
32108
32146
  {
32109
32147
  "kind": "field",
32110
32148
  "name": "hoverValue",
@@ -32131,6 +32169,16 @@
32131
32169
  },
32132
32170
  "attribute": "label"
32133
32171
  },
32172
+ {
32173
+ "kind": "field",
32174
+ "name": "helpText",
32175
+ "type": {
32176
+ "text": "string"
32177
+ },
32178
+ "default": "''",
32179
+ "description": "The rating's help text. If you need to display HTML, use the `help-text` slot instead.",
32180
+ "attribute": "help-text"
32181
+ },
32134
32182
  {
32135
32183
  "kind": "field",
32136
32184
  "name": "name",
@@ -32184,6 +32232,16 @@
32184
32232
  "default": "false",
32185
32233
  "attribute": "disabled"
32186
32234
  },
32235
+ {
32236
+ "kind": "field",
32237
+ "name": "preview",
32238
+ "type": {
32239
+ "text": "boolean"
32240
+ },
32241
+ "default": "false",
32242
+ "description": "Displays the value alongside the symbols, updating live as the pointer moves across them.",
32243
+ "attribute": "preview"
32244
+ },
32187
32245
  {
32188
32246
  "kind": "field",
32189
32247
  "name": "size",
@@ -32285,6 +32343,24 @@
32285
32343
  }
32286
32344
  ]
32287
32345
  },
32346
+ {
32347
+ "kind": "method",
32348
+ "name": "_formatValue",
32349
+ "privacy": "private",
32350
+ "return": {
32351
+ "type": {
32352
+ "text": "string"
32353
+ }
32354
+ },
32355
+ "parameters": [
32356
+ {
32357
+ "name": "value",
32358
+ "type": {
32359
+ "text": "number"
32360
+ }
32361
+ }
32362
+ ]
32363
+ },
32288
32364
  {
32289
32365
  "kind": "method",
32290
32366
  "name": "_getValueFromMousePosition",
@@ -32432,6 +32508,15 @@
32432
32508
  },
32433
32509
  "fieldName": "label"
32434
32510
  },
32511
+ {
32512
+ "name": "help-text",
32513
+ "type": {
32514
+ "text": "string"
32515
+ },
32516
+ "default": "''",
32517
+ "description": "The rating's help text. If you need to display HTML, use the `help-text` slot instead.",
32518
+ "fieldName": "helpText"
32519
+ },
32435
32520
  {
32436
32521
  "name": "name",
32437
32522
  "type": {
@@ -32479,6 +32564,15 @@
32479
32564
  "default": "false",
32480
32565
  "fieldName": "disabled"
32481
32566
  },
32567
+ {
32568
+ "name": "preview",
32569
+ "type": {
32570
+ "text": "boolean"
32571
+ },
32572
+ "default": "false",
32573
+ "description": "Displays the value alongside the symbols, updating live as the pointer moves across them.",
32574
+ "fieldName": "preview"
32575
+ },
32482
32576
  {
32483
32577
  "name": "size",
32484
32578
  "type": {
@@ -32503,7 +32597,7 @@
32503
32597
  "tagNameWithoutPrefix": "rating",
32504
32598
  "tagName": "zn-rating",
32505
32599
  "customElement": true,
32506
- "jsDoc": "/**\n * @summary Short summary of the component's intended use.\n * @documentation https://zinc.style/components/rating\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-example\n *\n * @event zn-event-name - Emitted as an example.\n *\n * @slot - The default slot.\n * @slot example - An example slot.\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --example - An example CSS custom property.\n */",
32600
+ "jsDoc": "/**\n * @summary Short summary of the component's intended use.\n * @documentation https://zinc.style/components/rating\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-example\n *\n * @event zn-event-name - Emitted as an example.\n *\n * @slot - The default slot.\n * @slot example - An example slot.\n * @slot help-text - Text that describes how to use the rating. Alternatively, you can use the `help-text` attribute.\n *\n * @csspart form-control - The form control that wraps the symbols and help text.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart base - The component's base wrapper.\n * @csspart preview - The value shown next to the symbols when `preview` is enabled.\n *\n * @cssproperty --example - An example CSS custom property.\n * @cssproperty --preview-color - The color of the preview value.\n * @cssproperty --preview-size - The font size of the preview value.\n */",
32507
32601
  "documentation": "https://zinc.style/components/rating",
32508
32602
  "status": "experimental",
32509
32603
  "since": "1.0",
@@ -38862,845 +38956,887 @@
38862
38956
  },
38863
38957
  {
38864
38958
  "kind": "javascript-module",
38865
- "path": "components/textarea/textarea.js",
38959
+ "path": "components/tabs/tabs.js",
38866
38960
  "declarations": [
38867
38961
  {
38868
38962
  "kind": "class",
38869
38963
  "description": "",
38870
- "name": "ZnTextarea",
38871
- "cssParts": [
38872
- {
38873
- "description": "The form control that wraps the label, input, and help text.",
38874
- "name": "form-control"
38875
- },
38876
- {
38877
- "description": "The label's wrapper.",
38878
- "name": "form-control-label"
38879
- },
38880
- {
38881
- "description": "The input's wrapper.",
38882
- "name": "form-control-input"
38883
- },
38964
+ "name": "ZnTabs",
38965
+ "cssProperties": [
38884
38966
  {
38885
- "description": "The help text's wrapper.",
38886
- "name": "form-control-help-text"
38887
- },
38967
+ "description": "An example CSS custom property.",
38968
+ "name": "--example"
38969
+ }
38970
+ ],
38971
+ "cssParts": [
38888
38972
  {
38889
38973
  "description": "The component's base wrapper.",
38890
38974
  "name": "base"
38891
- },
38892
- {
38893
- "description": "The internal `<textarea>` control.",
38894
- "name": "textarea"
38895
38975
  }
38896
38976
  ],
38897
38977
  "slots": [
38898
38978
  {
38899
- "description": "The textareas label. Alternatively, you can use the `label` attribute.",
38900
- "name": "label"
38901
- },
38902
- {
38903
- "description": "Used to add text that is displayed in a tooltip next to the label. Alternatively, you can use the `label-tooltip` attribute.",
38904
- "name": "label-tooltip"
38905
- },
38906
- {
38907
- "description": "Used to add contextual text that is displayed above the textarea, on the right. Alternatively, you can use the `context-note` attribute.",
38908
- "name": "context-note"
38979
+ "description": "The default slot.",
38980
+ "name": ""
38909
38981
  },
38910
38982
  {
38911
- "description": "Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.",
38912
- "name": "help-text"
38983
+ "description": "An example slot.",
38984
+ "name": "example"
38913
38985
  }
38914
38986
  ],
38915
38987
  "members": [
38916
38988
  {
38917
38989
  "kind": "field",
38918
- "name": "formControlController",
38919
- "privacy": "private",
38920
- "readonly": true,
38921
- "default": "new FormControlController(this, { assumeInteractionOn: ['zn-blur', 'zn-input'] })"
38922
- },
38923
- {
38924
- "kind": "field",
38925
- "name": "hasSlotController",
38926
- "privacy": "private",
38927
- "readonly": true,
38928
- "default": "new HasSlotController(this, 'help-text', 'label')"
38929
- },
38930
- {
38931
- "kind": "field",
38932
- "name": "resizeObserver",
38933
- "privacy": "private",
38934
- "readonly": true,
38935
- "default": "new ResizeController(this, { target: null, callback: () => this.setTextareaHeight(), })"
38936
- },
38937
- {
38938
- "kind": "field",
38939
- "name": "_didInitFromContent",
38990
+ "name": "masterId",
38940
38991
  "type": {
38941
- "text": "boolean"
38992
+ "text": "string"
38942
38993
  },
38943
- "privacy": "private",
38944
- "default": "false",
38945
- "description": "Ensures we only attempt to derive the initial value from light DOM content once"
38946
- },
38947
- {
38948
- "kind": "field",
38949
- "name": "formControl",
38950
- "type": {
38951
- "text": "HTMLElement"
38952
- }
38953
- },
38954
- {
38955
- "kind": "field",
38956
- "name": "input",
38957
- "type": {
38958
- "text": "HTMLTextAreaElement"
38959
- }
38994
+ "attribute": "master-id",
38995
+ "reflects": true
38960
38996
  },
38961
38997
  {
38962
38998
  "kind": "field",
38963
- "name": "hasFocus",
38999
+ "name": "defaultUri",
38964
39000
  "type": {
38965
- "text": "boolean"
39001
+ "text": "string"
38966
39002
  },
38967
- "default": "false"
39003
+ "default": "''",
39004
+ "attribute": "default-uri",
39005
+ "reflects": true
38968
39006
  },
38969
39007
  {
38970
39008
  "kind": "field",
38971
- "name": "title",
39009
+ "name": "_current",
38972
39010
  "type": {
38973
39011
  "text": "string"
38974
39012
  },
38975
39013
  "default": "''",
38976
- "attribute": "title"
39014
+ "attribute": "active",
39015
+ "reflects": true
38977
39016
  },
38978
39017
  {
38979
39018
  "kind": "field",
38980
- "name": "name",
39019
+ "name": "_split",
38981
39020
  "type": {
38982
- "text": "string"
39021
+ "text": "number"
38983
39022
  },
38984
- "default": "''",
38985
- "description": "The name of the textarea, submitted as a name/value pair with form data.",
38986
- "attribute": "name"
39023
+ "attribute": "split",
39024
+ "reflects": true
38987
39025
  },
38988
39026
  {
38989
39027
  "kind": "field",
38990
- "name": "value",
39028
+ "name": "_splitMin",
38991
39029
  "type": {
38992
- "text": "string"
39030
+ "text": "number"
38993
39031
  },
38994
- "default": "''",
38995
- "description": "The current value of the textarea, submitted as a name/value pair with form data.",
38996
- "attribute": "value"
39032
+ "default": "60",
39033
+ "attribute": "split-min",
39034
+ "reflects": true
38997
39035
  },
38998
39036
  {
38999
39037
  "kind": "field",
39000
- "name": "size",
39038
+ "name": "_splitMinSecondary",
39001
39039
  "type": {
39002
- "text": "'small' | 'medium' | 'large'"
39040
+ "text": "number"
39003
39041
  },
39004
- "default": "'medium'",
39005
- "description": "The text area's size.",
39006
- "attribute": "size",
39042
+ "attribute": "split-min-secondary",
39007
39043
  "reflects": true
39008
39044
  },
39009
39045
  {
39010
39046
  "kind": "field",
39011
- "name": "label",
39047
+ "name": "_splitMax",
39012
39048
  "type": {
39013
- "text": "string"
39049
+ "text": "number"
39014
39050
  },
39015
- "default": "''",
39016
- "description": "The textarea label. If you need to display HTML, use the `label` slot instead.",
39017
- "attribute": "label"
39051
+ "attribute": "split-max",
39052
+ "reflects": true
39018
39053
  },
39019
39054
  {
39020
39055
  "kind": "field",
39021
- "name": "labelTooltip",
39056
+ "name": "primaryCaption",
39022
39057
  "type": {
39023
39058
  "text": "string"
39024
39059
  },
39025
- "default": "''",
39026
- "description": "Text that appears in a tooltip next to the label. If you need to display HTML in the tooltip, use the `label-tooltip` slot instead.",
39027
- "attribute": "label-tooltip"
39060
+ "default": "'Navigation'",
39061
+ "attribute": "primary-caption",
39062
+ "reflects": true
39028
39063
  },
39029
39064
  {
39030
39065
  "kind": "field",
39031
- "name": "contextNote",
39066
+ "name": "secondaryCaption",
39032
39067
  "type": {
39033
39068
  "text": "string"
39034
39069
  },
39035
- "default": "''",
39036
- "description": "Text that appears above the textarea, on the right, to add additional context. If you need to display HTML in this text, use the `context-note` slot instead.",
39037
- "attribute": "context-note"
39070
+ "default": "'Content'",
39071
+ "attribute": "secondary-caption",
39072
+ "reflects": true
39038
39073
  },
39039
39074
  {
39040
39075
  "kind": "field",
39041
- "name": "helpText",
39076
+ "name": "noPrefetch",
39042
39077
  "type": {
39043
- "text": "string"
39078
+ "text": "boolean"
39044
39079
  },
39045
- "default": "''",
39046
- "description": "The text area's help text. If you need to display HTML, use the `help-text` slot instead.",
39047
- "attribute": "help-text"
39080
+ "default": "false",
39081
+ "attribute": "no-prefetch",
39082
+ "reflects": true
39048
39083
  },
39049
39084
  {
39050
39085
  "kind": "field",
39051
- "name": "placeholder",
39086
+ "name": "noCache",
39052
39087
  "type": {
39053
- "text": "string"
39088
+ "text": "boolean"
39054
39089
  },
39055
- "default": "''",
39056
- "description": "Placeholder text to show as a hint when the input is empty.",
39057
- "attribute": "placeholder"
39090
+ "default": "false",
39091
+ "attribute": "no-cache",
39092
+ "reflects": true
39058
39093
  },
39059
39094
  {
39060
39095
  "kind": "field",
39061
- "name": "rows",
39096
+ "name": "localStorage",
39062
39097
  "type": {
39063
- "text": "number"
39098
+ "text": "boolean"
39064
39099
  },
39065
- "default": "4",
39066
- "description": "The number of rows to display by default.",
39067
- "attribute": "rows"
39100
+ "attribute": "local-storage",
39101
+ "reflects": true
39068
39102
  },
39069
39103
  {
39070
39104
  "kind": "field",
39071
- "name": "resize",
39105
+ "name": "storeKey",
39072
39106
  "type": {
39073
- "text": "'none' | 'vertical' | 'auto'"
39107
+ "text": "string"
39074
39108
  },
39075
- "default": "'vertical'",
39076
- "description": "Controls how the textarea can be resized.",
39077
- "attribute": "resize"
39109
+ "attribute": "store-key"
39078
39110
  },
39079
39111
  {
39080
39112
  "kind": "field",
39081
- "name": "disabled",
39113
+ "name": "storeTtl",
39082
39114
  "type": {
39083
- "text": "boolean"
39115
+ "text": "number"
39084
39116
  },
39085
- "default": "false",
39086
- "description": "Disables the textarea.",
39087
- "attribute": "disabled",
39117
+ "default": "0",
39118
+ "attribute": "store-ttl",
39088
39119
  "reflects": true
39089
39120
  },
39090
39121
  {
39091
39122
  "kind": "field",
39092
- "name": "readonly",
39123
+ "name": "padded",
39093
39124
  "type": {
39094
39125
  "text": "boolean"
39095
39126
  },
39096
39127
  "default": "false",
39097
- "description": "Makes the textarea readonly.",
39098
- "attribute": "readonly",
39128
+ "attribute": "padded",
39099
39129
  "reflects": true
39100
39130
  },
39101
39131
  {
39102
39132
  "kind": "field",
39103
- "name": "form",
39133
+ "name": "fetchStyle",
39104
39134
  "type": {
39105
39135
  "text": "string"
39106
39136
  },
39107
- "default": "''",
39108
- "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.",
39109
- "attribute": "form",
39137
+ "default": "\"\"",
39138
+ "attribute": "fetch-style",
39110
39139
  "reflects": true
39111
39140
  },
39112
39141
  {
39113
39142
  "kind": "field",
39114
- "name": "flush",
39143
+ "name": "fullWidth",
39115
39144
  "type": {
39116
39145
  "text": "boolean"
39117
39146
  },
39118
39147
  "default": "false",
39119
- "attribute": "flush",
39148
+ "attribute": "full-width",
39120
39149
  "reflects": true
39121
39150
  },
39122
39151
  {
39123
39152
  "kind": "field",
39124
- "name": "required",
39153
+ "name": "paddedRight",
39125
39154
  "type": {
39126
39155
  "text": "boolean"
39127
39156
  },
39128
39157
  "default": "false",
39129
- "description": "Makes the textarea a required field.",
39130
- "attribute": "required",
39158
+ "attribute": "padded-right",
39131
39159
  "reflects": true
39132
39160
  },
39133
39161
  {
39134
39162
  "kind": "field",
39135
- "name": "minlength",
39163
+ "name": "monitor",
39136
39164
  "type": {
39137
- "text": "number"
39165
+ "text": "string"
39138
39166
  },
39139
- "description": "The minimum length of input that will be considered valid.",
39140
- "attribute": "minlength"
39167
+ "attribute": "monitor"
39141
39168
  },
39142
39169
  {
39143
39170
  "kind": "field",
39144
- "name": "maxlength",
39171
+ "name": "caption",
39145
39172
  "type": {
39146
- "text": "number"
39173
+ "text": "string"
39147
39174
  },
39148
- "description": "The maximum length of input that will be considered valid.",
39149
- "attribute": "maxlength"
39175
+ "attribute": "caption"
39150
39176
  },
39151
39177
  {
39152
39178
  "kind": "field",
39153
- "name": "autocapitalize",
39179
+ "name": "description",
39154
39180
  "type": {
39155
- "text": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'"
39181
+ "text": "string"
39156
39182
  },
39157
- "description": "Controls whether and how text input is automatically capitalized as it is entered by the user.",
39158
- "attribute": "autocapitalize"
39183
+ "attribute": "description"
39159
39184
  },
39160
39185
  {
39161
39186
  "kind": "field",
39162
- "name": "autocorrect",
39187
+ "name": "preload",
39163
39188
  "type": {
39164
- "text": "string"
39189
+ "text": "boolean"
39165
39190
  },
39166
- "description": "Indicates whether the browser's autocorrect feature is on or off.",
39167
- "attribute": "autocorrect"
39191
+ "privacy": "protected",
39192
+ "default": "true"
39168
39193
  },
39169
39194
  {
39170
39195
  "kind": "field",
39171
- "name": "autocomplete",
39196
+ "name": "_store",
39172
39197
  "type": {
39173
- "text": "string"
39198
+ "text": "Store"
39174
39199
  },
39175
- "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.",
39176
- "attribute": "autocomplete"
39200
+ "privacy": "protected"
39177
39201
  },
39178
39202
  {
39179
39203
  "kind": "field",
39180
- "name": "autofocus",
39204
+ "name": "_activeClicks",
39181
39205
  "type": {
39182
- "text": "boolean"
39206
+ "text": "number"
39183
39207
  },
39184
- "description": "Indicates that the input should receive focus on page load.",
39185
- "attribute": "autofocus"
39208
+ "privacy": "protected",
39209
+ "default": "0"
39186
39210
  },
39187
39211
  {
39188
39212
  "kind": "field",
39189
- "name": "enterkeyhint",
39213
+ "name": "_panel",
39190
39214
  "type": {
39191
- "text": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'"
39215
+ "text": "Element | null | undefined"
39192
39216
  },
39193
- "description": "Used to customize the label or icon of the Enter key on virtual keyboards.",
39194
- "attribute": "enterkeyhint"
39217
+ "privacy": "private"
39195
39218
  },
39196
39219
  {
39197
39220
  "kind": "field",
39198
- "name": "spellcheck",
39221
+ "name": "_panels",
39199
39222
  "type": {
39200
- "text": "boolean"
39223
+ "text": "Map<string, Element[]>"
39201
39224
  },
39202
- "default": "true",
39203
- "description": "Enables spell checking on the textarea.",
39204
- "attribute": "spellcheck"
39225
+ "privacy": "private",
39226
+ "default": "new Map<string, Element[]>()"
39205
39227
  },
39206
39228
  {
39207
39229
  "kind": "field",
39208
- "name": "inputmode",
39230
+ "name": "_activeTab",
39209
39231
  "type": {
39210
- "text": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'"
39232
+ "text": "Element | null"
39211
39233
  },
39212
- "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.",
39213
- "attribute": "inputmode"
39234
+ "privacy": "private",
39235
+ "default": "null"
39214
39236
  },
39215
39237
  {
39216
39238
  "kind": "field",
39217
- "name": "defaultValue",
39239
+ "name": "_tabs",
39218
39240
  "type": {
39219
- "text": "string"
39241
+ "text": "HTMLElement[]"
39220
39242
  },
39221
- "default": "''",
39222
- "description": "The default value of the form control. Primarily used for resetting the form control."
39243
+ "privacy": "private",
39244
+ "default": "[]"
39223
39245
  },
39224
39246
  {
39225
39247
  "kind": "field",
39226
- "name": "transparent",
39248
+ "name": "_actions",
39227
39249
  "type": {
39228
- "text": "boolean"
39250
+ "text": "HTMLElement[]"
39229
39251
  },
39230
- "default": "false",
39231
- "attribute": "transparent"
39252
+ "privacy": "private",
39253
+ "default": "[]"
39232
39254
  },
39233
39255
  {
39234
39256
  "kind": "field",
39235
- "name": "validity",
39236
- "description": "Gets the validity state object",
39237
- "readonly": true
39257
+ "name": "_knownUri",
39258
+ "type": {
39259
+ "text": "Map<string, string>"
39260
+ },
39261
+ "privacy": "private",
39262
+ "default": "new Map<string, string>()"
39238
39263
  },
39239
39264
  {
39240
39265
  "kind": "field",
39241
- "name": "validationMessage",
39242
- "description": "Gets the validation message",
39243
- "readonly": true
39266
+ "name": "_defaultTab",
39267
+ "type": {
39268
+ "text": "string"
39269
+ },
39270
+ "privacy": "private",
39271
+ "default": "''"
39272
+ },
39273
+ {
39274
+ "kind": "field",
39275
+ "name": "hasSlotController",
39276
+ "privacy": "private",
39277
+ "readonly": true,
39278
+ "default": "new HasSlotController(this, '[default]', 'bottom', 'right', 'left', 'top', 'actions')"
39279
+ },
39280
+ {
39281
+ "kind": "field",
39282
+ "name": "_domObserver",
39283
+ "privacy": "private",
39284
+ "readonly": true,
39285
+ "default": "new MutationController(this, { target: null, config: {childList: true, subtree: true}, callback: mutations => { mutations.forEach(mutation => { if (mutation.type !== 'childList') return; if (mutation.addedNodes.length > 0) { this._registerTabs(); } if (mutation.removedNodes.length > 0) { mutation.removedNodes.forEach(node => { const id = node instanceof HTMLElement ? node.id : ''; if (id) this.removeTabAndPanel(id); }); } }); }, })"
39286
+ },
39287
+ {
39288
+ "kind": "field",
39289
+ "name": "_monitorObserver",
39290
+ "privacy": "private",
39291
+ "readonly": true,
39292
+ "default": "new MutationController(this, { target: null, config: {childList: true, subtree: true}, callback: mutations => { mutations.forEach(mutation => { if (mutation.type !== 'childList') return; mutation.addedNodes.forEach(node => { if (node instanceof HTMLElement && node.id === this.monitor) { this.reRegisterTabs(); const storedValue = this.getStoredTab(); if (storedValue !== null) { this.restoreStoredTab(storedValue); } } }); }); }, })"
39244
39293
  },
39245
39294
  {
39246
39295
  "kind": "method",
39247
- "name": "handleBlur",
39248
- "privacy": "private"
39296
+ "name": "monitorDom"
39249
39297
  },
39250
39298
  {
39251
39299
  "kind": "method",
39252
- "name": "handleChange",
39253
- "privacy": "private"
39300
+ "name": "getTabStoreKey",
39301
+ "privacy": "protected",
39302
+ "return": {
39303
+ "type": {
39304
+ "text": "string | null"
39305
+ }
39306
+ },
39307
+ "description": "The key the active tab is persisted under. Null disables persistence."
39254
39308
  },
39255
39309
  {
39256
39310
  "kind": "method",
39257
- "name": "handleFocus",
39258
- "privacy": "private"
39311
+ "name": "getStoredTab",
39312
+ "privacy": "protected",
39313
+ "return": {
39314
+ "type": {
39315
+ "text": "string | null"
39316
+ }
39317
+ }
39259
39318
  },
39260
39319
  {
39261
39320
  "kind": "method",
39262
- "name": "handleInput",
39263
- "privacy": "private"
39321
+ "name": "storeActiveTab",
39322
+ "privacy": "protected",
39323
+ "parameters": [
39324
+ {
39325
+ "name": "tabName",
39326
+ "type": {
39327
+ "text": "string"
39328
+ }
39329
+ }
39330
+ ]
39264
39331
  },
39265
39332
  {
39266
39333
  "kind": "method",
39267
- "name": "handleInvalid",
39268
- "privacy": "private",
39334
+ "name": "restoreStoredTab",
39335
+ "privacy": "protected",
39269
39336
  "parameters": [
39270
39337
  {
39271
- "name": "event",
39338
+ "name": "stored",
39272
39339
  "type": {
39273
- "text": "Event"
39340
+ "text": "string"
39274
39341
  }
39275
39342
  }
39276
39343
  ]
39277
39344
  },
39278
39345
  {
39279
39346
  "kind": "method",
39280
- "name": "handleKeyDown",
39347
+ "name": "activateDefaultTab",
39348
+ "privacy": "protected",
39349
+ "description": "Activates the tab the container starts on, ignoring any stored selection."
39350
+ },
39351
+ {
39352
+ "kind": "field",
39353
+ "name": "handlePopState",
39354
+ "privacy": "private",
39355
+ "readonly": true
39356
+ },
39357
+ {
39358
+ "kind": "method",
39359
+ "name": "pushTabHistory",
39281
39360
  "privacy": "private",
39282
39361
  "parameters": [
39283
39362
  {
39284
- "name": "event",
39363
+ "name": "tabName",
39285
39364
  "type": {
39286
- "text": "KeyboardEvent"
39365
+ "text": "string"
39287
39366
  }
39288
39367
  }
39289
39368
  ]
39290
39369
  },
39291
39370
  {
39292
39371
  "kind": "method",
39293
- "name": "setTextareaHeight",
39294
- "privacy": "private"
39372
+ "name": "getUriForTabId",
39373
+ "privacy": "private",
39374
+ "return": {
39375
+ "type": {
39376
+ "text": "string | null"
39377
+ }
39378
+ },
39379
+ "parameters": [
39380
+ {
39381
+ "name": "tabId",
39382
+ "type": {
39383
+ "text": "string"
39384
+ }
39385
+ }
39386
+ ]
39295
39387
  },
39296
39388
  {
39297
39389
  "kind": "method",
39298
- "name": "handleDisabledChange"
39390
+ "name": "_addPanel",
39391
+ "parameters": [
39392
+ {
39393
+ "name": "panel",
39394
+ "type": {
39395
+ "text": "HTMLElement"
39396
+ }
39397
+ }
39398
+ ]
39299
39399
  },
39300
39400
  {
39301
39401
  "kind": "method",
39302
- "name": "handleRowsChange"
39402
+ "name": "_addTab",
39403
+ "parameters": [
39404
+ {
39405
+ "name": "tab",
39406
+ "type": {
39407
+ "text": "HTMLElement"
39408
+ }
39409
+ }
39410
+ ]
39303
39411
  },
39304
39412
  {
39305
- "kind": "method",
39306
- "name": "handleValueChange"
39413
+ "kind": "field",
39414
+ "name": "reRegisterTabs"
39307
39415
  },
39308
39416
  {
39309
39417
  "kind": "method",
39310
- "name": "focus",
39418
+ "name": "switchTab",
39311
39419
  "parameters": [
39312
39420
  {
39313
- "name": "options",
39314
- "optional": true,
39421
+ "name": "inc",
39315
39422
  "type": {
39316
- "text": "FocusOptions"
39423
+ "text": "number"
39317
39424
  }
39318
39425
  }
39319
- ],
39320
- "description": "Sets focus on the textarea."
39426
+ ]
39321
39427
  },
39322
39428
  {
39323
39429
  "kind": "method",
39324
- "name": "blur",
39325
- "description": "Removes focus from the textarea."
39430
+ "name": "nextTab"
39326
39431
  },
39327
39432
  {
39328
39433
  "kind": "method",
39329
- "name": "select",
39330
- "description": "Selects all the text in the textarea."
39434
+ "name": "previousTab"
39331
39435
  },
39332
39436
  {
39333
39437
  "kind": "method",
39334
- "name": "scrollPosition",
39438
+ "name": "_prepareTab",
39439
+ "parameters": [
39440
+ {
39441
+ "name": "tabId",
39442
+ "type": {
39443
+ "text": "string"
39444
+ }
39445
+ }
39446
+ ]
39447
+ },
39448
+ {
39449
+ "kind": "method",
39450
+ "name": "_uriToId",
39335
39451
  "return": {
39336
39452
  "type": {
39337
- "text": "{ top: number; left: number } | undefined"
39453
+ "text": "string"
39338
39454
  }
39339
39455
  },
39340
39456
  "parameters": [
39341
39457
  {
39342
- "name": "position",
39343
- "optional": true,
39458
+ "name": "tabUri",
39344
39459
  "type": {
39345
- "text": "{ top?: number; left?: number }"
39460
+ "text": "string"
39346
39461
  }
39347
39462
  }
39348
- ],
39349
- "description": "Gets or sets the textarea scroll position."
39463
+ ]
39350
39464
  },
39351
39465
  {
39352
39466
  "kind": "method",
39353
- "name": "setSelectionRange",
39467
+ "name": "_createUriPanel",
39468
+ "return": {
39469
+ "type": {
39470
+ "text": "HTMLDivElement"
39471
+ }
39472
+ },
39354
39473
  "parameters": [
39355
39474
  {
39356
- "name": "selectionStart",
39475
+ "name": "tabEle",
39357
39476
  "type": {
39358
- "text": "number"
39477
+ "text": "Element"
39359
39478
  }
39360
39479
  },
39361
39480
  {
39362
- "name": "selectionEnd",
39481
+ "name": "tabUri",
39363
39482
  "type": {
39364
- "text": "number"
39483
+ "text": "string"
39365
39484
  }
39366
39485
  },
39367
39486
  {
39368
- "name": "selectionDirection",
39369
- "default": "'none'",
39487
+ "name": "tabId",
39370
39488
  "type": {
39371
- "text": "'forward' | 'backward' | 'none'"
39489
+ "text": "string"
39372
39490
  }
39373
39491
  }
39374
- ],
39375
- "description": "Sets the start and end positions of the text selection (0-based)."
39492
+ ]
39376
39493
  },
39377
39494
  {
39378
39495
  "kind": "method",
39379
- "name": "setRangeText",
39496
+ "name": "_handleClick",
39380
39497
  "parameters": [
39381
39498
  {
39382
- "name": "replacement",
39499
+ "name": "event",
39500
+ "type": {
39501
+ "text": "PointerEvent"
39502
+ }
39503
+ }
39504
+ ]
39505
+ },
39506
+ {
39507
+ "kind": "method",
39508
+ "name": "fetchUriTab",
39509
+ "parameters": [
39510
+ {
39511
+ "name": "target",
39512
+ "type": {
39513
+ "text": "HTMLElement"
39514
+ }
39515
+ }
39516
+ ]
39517
+ },
39518
+ {
39519
+ "kind": "method",
39520
+ "name": "clickTab",
39521
+ "parameters": [
39522
+ {
39523
+ "name": "target",
39524
+ "type": {
39525
+ "text": "HTMLElement"
39526
+ }
39527
+ },
39528
+ {
39529
+ "name": "refresh",
39530
+ "type": {
39531
+ "text": "boolean"
39532
+ }
39533
+ },
39534
+ {
39535
+ "name": "pushHistory",
39536
+ "default": "false"
39537
+ }
39538
+ ]
39539
+ },
39540
+ {
39541
+ "kind": "method",
39542
+ "name": "getRefTab",
39543
+ "parameters": [
39544
+ {
39545
+ "name": "target",
39546
+ "type": {
39547
+ "text": "HTMLElement"
39548
+ }
39549
+ }
39550
+ ]
39551
+ },
39552
+ {
39553
+ "kind": "method",
39554
+ "name": "setActiveTab",
39555
+ "parameters": [
39556
+ {
39557
+ "name": "tabName",
39383
39558
  "type": {
39384
39559
  "text": "string"
39385
39560
  }
39386
39561
  },
39387
39562
  {
39388
- "name": "start",
39389
- "optional": true,
39563
+ "name": "store",
39390
39564
  "type": {
39391
- "text": "number"
39565
+ "text": "boolean"
39392
39566
  }
39393
39567
  },
39394
39568
  {
39395
- "name": "end",
39396
- "optional": true,
39569
+ "name": "refresh",
39397
39570
  "type": {
39398
- "text": "number"
39571
+ "text": "boolean"
39399
39572
  }
39400
39573
  },
39401
39574
  {
39402
- "name": "selectMode",
39403
- "default": "'preserve'",
39575
+ "name": "refTab",
39576
+ "default": "null",
39404
39577
  "type": {
39405
- "text": "'select' | 'start' | 'end' | 'preserve'"
39578
+ "text": "string | null"
39406
39579
  }
39580
+ },
39581
+ {
39582
+ "name": "pushHistory",
39583
+ "default": "false"
39407
39584
  }
39408
- ],
39409
- "description": "Replaces a range of text with a new string."
39585
+ ]
39410
39586
  },
39411
39587
  {
39412
39588
  "kind": "method",
39413
- "name": "checkValidity",
39414
- "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
39589
+ "name": "_setTabEleActive",
39590
+ "parameters": [
39591
+ {
39592
+ "name": "ele",
39593
+ "type": {
39594
+ "text": "Element"
39595
+ }
39596
+ },
39597
+ {
39598
+ "name": "active",
39599
+ "type": {
39600
+ "text": "boolean"
39601
+ }
39602
+ }
39603
+ ]
39415
39604
  },
39416
39605
  {
39417
39606
  "kind": "method",
39418
- "name": "getForm",
39607
+ "name": "selectTab",
39419
39608
  "return": {
39420
39609
  "type": {
39421
- "text": "HTMLFormElement | null"
39610
+ "text": "boolean"
39422
39611
  }
39423
39612
  },
39424
- "description": "Gets the associated form, if one exists."
39613
+ "parameters": [
39614
+ {
39615
+ "name": "tabName",
39616
+ "type": {
39617
+ "text": "string"
39618
+ }
39619
+ },
39620
+ {
39621
+ "name": "refresh",
39622
+ "type": {
39623
+ "text": "boolean"
39624
+ }
39625
+ }
39626
+ ]
39425
39627
  },
39426
39628
  {
39427
39629
  "kind": "method",
39428
- "name": "reportValidity",
39429
- "description": "Checks for validity and shows the browser's validation message if the control is invalid."
39630
+ "name": "getActiveTab",
39631
+ "return": {
39632
+ "type": {
39633
+ "text": "Element[]"
39634
+ }
39635
+ }
39430
39636
  },
39431
39637
  {
39432
39638
  "kind": "method",
39433
- "name": "setCustomValidity",
39639
+ "name": "observerDom"
39640
+ },
39641
+ {
39642
+ "kind": "method",
39643
+ "name": "removeTabAndPanel",
39434
39644
  "parameters": [
39435
39645
  {
39436
- "name": "message",
39646
+ "name": "tabId",
39437
39647
  "type": {
39438
39648
  "text": "string"
39439
39649
  }
39440
39650
  }
39441
- ],
39442
- "description": "Sets a custom validation message. Pass an empty string to restore validity."
39651
+ ]
39652
+ },
39653
+ {
39654
+ "kind": "field",
39655
+ "name": "_registerTabs"
39443
39656
  }
39444
39657
  ],
39445
39658
  "events": [
39446
39659
  {
39447
- "description": "Emitted when the control loses focus.",
39448
- "name": "zn-blur"
39449
- },
39450
- {
39451
- "description": "Emitted when an alteration to the control's value is committed by the user.",
39452
- "name": "zn-change"
39453
- },
39454
- {
39455
- "description": "Emitted when the control gains focus.",
39456
- "name": "zn-focus"
39457
- },
39458
- {
39459
- "description": "Emitted when the control receives input.",
39460
- "name": "zn-input"
39461
- },
39462
- {
39463
- "description": "Emitted when the form control has been checked for validity and its constraints aren't satisfied.",
39464
- "name": "zn-invalid"
39660
+ "description": "Emitted as an example.",
39661
+ "name": "zn-event-name"
39465
39662
  }
39466
39663
  ],
39467
39664
  "attributes": [
39468
39665
  {
39469
- "name": "title",
39666
+ "name": "master-id",
39470
39667
  "type": {
39471
39668
  "text": "string"
39472
39669
  },
39473
- "default": "''",
39474
- "fieldName": "title"
39670
+ "fieldName": "masterId"
39475
39671
  },
39476
39672
  {
39477
- "name": "name",
39673
+ "name": "default-uri",
39478
39674
  "type": {
39479
39675
  "text": "string"
39480
39676
  },
39481
39677
  "default": "''",
39482
- "description": "The name of the textarea, submitted as a name/value pair with form data.",
39483
- "fieldName": "name"
39678
+ "fieldName": "defaultUri"
39484
39679
  },
39485
39680
  {
39486
- "name": "value",
39681
+ "name": "active",
39487
39682
  "type": {
39488
39683
  "text": "string"
39489
39684
  },
39490
39685
  "default": "''",
39491
- "description": "The current value of the textarea, submitted as a name/value pair with form data.",
39492
- "fieldName": "value"
39686
+ "fieldName": "_current"
39493
39687
  },
39494
39688
  {
39495
- "name": "size",
39689
+ "name": "split",
39496
39690
  "type": {
39497
- "text": "'small' | 'medium' | 'large'"
39691
+ "text": "number"
39498
39692
  },
39499
- "default": "'medium'",
39500
- "description": "The text area's size.",
39501
- "fieldName": "size"
39693
+ "fieldName": "_split"
39502
39694
  },
39503
39695
  {
39504
- "name": "label",
39696
+ "name": "split-min",
39505
39697
  "type": {
39506
- "text": "string"
39698
+ "text": "number"
39507
39699
  },
39508
- "default": "''",
39509
- "description": "The textarea label. If you need to display HTML, use the `label` slot instead.",
39510
- "fieldName": "label"
39700
+ "default": "60",
39701
+ "fieldName": "_splitMin"
39511
39702
  },
39512
39703
  {
39513
- "name": "label-tooltip",
39704
+ "name": "split-min-secondary",
39514
39705
  "type": {
39515
- "text": "string"
39706
+ "text": "number"
39516
39707
  },
39517
- "default": "''",
39518
- "description": "Text that appears in a tooltip next to the label. If you need to display HTML in the tooltip, use the `label-tooltip` slot instead.",
39519
- "fieldName": "labelTooltip"
39708
+ "fieldName": "_splitMinSecondary"
39520
39709
  },
39521
39710
  {
39522
- "name": "context-note",
39711
+ "name": "split-max",
39523
39712
  "type": {
39524
- "text": "string"
39713
+ "text": "number"
39525
39714
  },
39526
- "default": "''",
39527
- "description": "Text that appears above the textarea, on the right, to add additional context. If you need to display HTML in this text, use the `context-note` slot instead.",
39528
- "fieldName": "contextNote"
39715
+ "fieldName": "_splitMax"
39529
39716
  },
39530
39717
  {
39531
- "name": "help-text",
39718
+ "name": "primary-caption",
39532
39719
  "type": {
39533
39720
  "text": "string"
39534
39721
  },
39535
- "default": "''",
39536
- "description": "The text area's help text. If you need to display HTML, use the `help-text` slot instead.",
39537
- "fieldName": "helpText"
39722
+ "default": "'Navigation'",
39723
+ "fieldName": "primaryCaption"
39538
39724
  },
39539
39725
  {
39540
- "name": "placeholder",
39726
+ "name": "secondary-caption",
39541
39727
  "type": {
39542
39728
  "text": "string"
39543
39729
  },
39544
- "default": "''",
39545
- "description": "Placeholder text to show as a hint when the input is empty.",
39546
- "fieldName": "placeholder"
39547
- },
39548
- {
39549
- "name": "rows",
39550
- "type": {
39551
- "text": "number"
39552
- },
39553
- "default": "4",
39554
- "description": "The number of rows to display by default.",
39555
- "fieldName": "rows"
39556
- },
39557
- {
39558
- "name": "resize",
39559
- "type": {
39560
- "text": "'none' | 'vertical' | 'auto'"
39561
- },
39562
- "default": "'vertical'",
39563
- "description": "Controls how the textarea can be resized.",
39564
- "fieldName": "resize"
39565
- },
39566
- {
39567
- "name": "disabled",
39568
- "type": {
39569
- "text": "boolean"
39570
- },
39571
- "default": "false",
39572
- "description": "Disables the textarea.",
39573
- "fieldName": "disabled"
39730
+ "default": "'Content'",
39731
+ "fieldName": "secondaryCaption"
39574
39732
  },
39575
39733
  {
39576
- "name": "readonly",
39734
+ "name": "no-prefetch",
39577
39735
  "type": {
39578
39736
  "text": "boolean"
39579
39737
  },
39580
39738
  "default": "false",
39581
- "description": "Makes the textarea readonly.",
39582
- "fieldName": "readonly"
39583
- },
39584
- {
39585
- "name": "form",
39586
- "type": {
39587
- "text": "string"
39588
- },
39589
- "default": "''",
39590
- "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.",
39591
- "fieldName": "form"
39739
+ "fieldName": "noPrefetch"
39592
39740
  },
39593
39741
  {
39594
- "name": "flush",
39742
+ "name": "no-cache",
39595
39743
  "type": {
39596
39744
  "text": "boolean"
39597
39745
  },
39598
39746
  "default": "false",
39599
- "fieldName": "flush"
39747
+ "fieldName": "noCache"
39600
39748
  },
39601
39749
  {
39602
- "name": "required",
39750
+ "name": "local-storage",
39603
39751
  "type": {
39604
39752
  "text": "boolean"
39605
39753
  },
39606
- "default": "false",
39607
- "description": "Makes the textarea a required field.",
39608
- "fieldName": "required"
39754
+ "fieldName": "localStorage"
39609
39755
  },
39610
39756
  {
39611
- "name": "minlength",
39757
+ "name": "store-key",
39612
39758
  "type": {
39613
- "text": "number"
39759
+ "text": "string"
39614
39760
  },
39615
- "description": "The minimum length of input that will be considered valid.",
39616
- "fieldName": "minlength"
39761
+ "fieldName": "storeKey"
39617
39762
  },
39618
39763
  {
39619
- "name": "maxlength",
39764
+ "name": "store-ttl",
39620
39765
  "type": {
39621
39766
  "text": "number"
39622
39767
  },
39623
- "description": "The maximum length of input that will be considered valid.",
39624
- "fieldName": "maxlength"
39625
- },
39626
- {
39627
- "name": "autocapitalize",
39628
- "type": {
39629
- "text": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'"
39630
- },
39631
- "description": "Controls whether and how text input is automatically capitalized as it is entered by the user.",
39632
- "fieldName": "autocapitalize"
39768
+ "default": "0",
39769
+ "fieldName": "storeTtl"
39633
39770
  },
39634
39771
  {
39635
- "name": "autocorrect",
39772
+ "name": "padded",
39636
39773
  "type": {
39637
- "text": "string"
39774
+ "text": "boolean"
39638
39775
  },
39639
- "description": "Indicates whether the browser's autocorrect feature is on or off.",
39640
- "fieldName": "autocorrect"
39776
+ "default": "false",
39777
+ "fieldName": "padded"
39641
39778
  },
39642
39779
  {
39643
- "name": "autocomplete",
39780
+ "name": "fetch-style",
39644
39781
  "type": {
39645
39782
  "text": "string"
39646
39783
  },
39647
- "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.",
39648
- "fieldName": "autocomplete"
39784
+ "default": "\"\"",
39785
+ "fieldName": "fetchStyle"
39649
39786
  },
39650
39787
  {
39651
- "name": "autofocus",
39788
+ "name": "full-width",
39652
39789
  "type": {
39653
39790
  "text": "boolean"
39654
39791
  },
39655
- "description": "Indicates that the input should receive focus on page load.",
39656
- "fieldName": "autofocus"
39792
+ "default": "false",
39793
+ "fieldName": "fullWidth"
39657
39794
  },
39658
39795
  {
39659
- "name": "enterkeyhint",
39796
+ "name": "padded-right",
39660
39797
  "type": {
39661
- "text": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'"
39798
+ "text": "boolean"
39662
39799
  },
39663
- "description": "Used to customize the label or icon of the Enter key on virtual keyboards.",
39664
- "fieldName": "enterkeyhint"
39800
+ "default": "false",
39801
+ "fieldName": "paddedRight"
39665
39802
  },
39666
39803
  {
39667
- "name": "spellcheck",
39804
+ "name": "monitor",
39668
39805
  "type": {
39669
- "text": "boolean"
39806
+ "text": "string"
39670
39807
  },
39671
- "default": "true",
39672
- "description": "Enables spell checking on the textarea.",
39673
- "fieldName": "spellcheck"
39808
+ "fieldName": "monitor"
39674
39809
  },
39675
39810
  {
39676
- "name": "inputmode",
39811
+ "name": "caption",
39677
39812
  "type": {
39678
- "text": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'"
39813
+ "text": "string"
39679
39814
  },
39680
- "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.",
39681
- "fieldName": "inputmode"
39815
+ "fieldName": "caption"
39682
39816
  },
39683
39817
  {
39684
- "name": "transparent",
39818
+ "name": "description",
39685
39819
  "type": {
39686
- "text": "boolean"
39820
+ "text": "string"
39687
39821
  },
39688
- "default": "false",
39689
- "fieldName": "transparent"
39822
+ "fieldName": "description"
39690
39823
  }
39691
39824
  ],
39692
39825
  "superclass": {
39693
39826
  "name": "ZincElement",
39694
39827
  "module": "/src/internal/zinc-element"
39695
39828
  },
39696
- "summary": "Textareas collect data from the user and allow multiple lines of text.",
39697
- "tagNameWithoutPrefix": "textarea",
39698
- "tagName": "zn-textarea",
39829
+ "summary": "Short summary of the component's intended use.",
39830
+ "tagNameWithoutPrefix": "tabs",
39831
+ "tagName": "zn-tabs",
39699
39832
  "customElement": true,
39700
- "jsDoc": "/**\n * @summary Textareas collect data from the user and allow multiple lines of text.\n * @documentation https://zinc.style/components/textarea\n * @status stable\n * @since 2.0\n *\n * @slot label - The textareas label. Alternatively, you can use the `label` attribute.\n * @slot label-tooltip - Used to add text that is displayed in a tooltip next to the label. Alternatively, you can use the `label-tooltip` attribute.\n * @slot context-note - Used to add contextual text that is displayed above the textarea, on the right. Alternatively, you can use the `context-note` attribute.\n * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n *\n * @event zn-blur - Emitted when the control loses focus.\n * @event zn-change - Emitted when an alteration to the control's value is committed by the user.\n * @event zn-focus - Emitted when the control gains focus.\n * @event zn-input - Emitted when the control receives input.\n * @event zn-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 textarea - The internal `<textarea>` control.\n */",
39701
- "documentation": "https://zinc.style/components/textarea",
39702
- "status": "stable",
39703
- "since": "2.0"
39833
+ "jsDoc": "/**\n * @summary Short summary of the component's intended use.\n * @documentation https://zinc.style/components/tabs\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-example\n *\n * @event zn-event-name - Emitted as an example.\n *\n * @slot - The default slot.\n * @slot example - An example slot.\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --example - An example CSS custom property.\n */",
39834
+ "documentation": "https://zinc.style/components/tabs",
39835
+ "status": "experimental",
39836
+ "since": "1.0",
39837
+ "dependencies": [
39838
+ "zn-example"
39839
+ ]
39704
39840
  }
39705
39841
  ],
39706
39842
  "exports": [
@@ -39708,895 +39844,853 @@
39708
39844
  "kind": "js",
39709
39845
  "name": "default",
39710
39846
  "declaration": {
39711
- "name": "ZnTextarea",
39712
- "module": "components/textarea/textarea.js"
39847
+ "name": "ZnTabs",
39848
+ "module": "components/tabs/tabs.js"
39713
39849
  }
39714
39850
  }
39715
39851
  ]
39716
39852
  },
39717
39853
  {
39718
39854
  "kind": "javascript-module",
39719
- "path": "components/tabs/tabs.js",
39855
+ "path": "components/textarea/textarea.js",
39720
39856
  "declarations": [
39721
39857
  {
39722
39858
  "kind": "class",
39723
39859
  "description": "",
39724
- "name": "ZnTabs",
39725
- "cssProperties": [
39726
- {
39727
- "description": "An example CSS custom property.",
39728
- "name": "--example"
39729
- }
39730
- ],
39860
+ "name": "ZnTextarea",
39731
39861
  "cssParts": [
39862
+ {
39863
+ "description": "The form control that wraps the label, input, and help text.",
39864
+ "name": "form-control"
39865
+ },
39866
+ {
39867
+ "description": "The label's wrapper.",
39868
+ "name": "form-control-label"
39869
+ },
39870
+ {
39871
+ "description": "The input's wrapper.",
39872
+ "name": "form-control-input"
39873
+ },
39874
+ {
39875
+ "description": "The help text's wrapper.",
39876
+ "name": "form-control-help-text"
39877
+ },
39732
39878
  {
39733
39879
  "description": "The component's base wrapper.",
39734
39880
  "name": "base"
39881
+ },
39882
+ {
39883
+ "description": "The internal `<textarea>` control.",
39884
+ "name": "textarea"
39735
39885
  }
39736
39886
  ],
39737
39887
  "slots": [
39738
39888
  {
39739
- "description": "The default slot.",
39740
- "name": ""
39889
+ "description": "The textareas label. Alternatively, you can use the `label` attribute.",
39890
+ "name": "label"
39741
39891
  },
39742
39892
  {
39743
- "description": "An example slot.",
39744
- "name": "example"
39893
+ "description": "Used to add text that is displayed in a tooltip next to the label. Alternatively, you can use the `label-tooltip` attribute.",
39894
+ "name": "label-tooltip"
39895
+ },
39896
+ {
39897
+ "description": "Used to add contextual text that is displayed above the textarea, on the right. Alternatively, you can use the `context-note` attribute.",
39898
+ "name": "context-note"
39899
+ },
39900
+ {
39901
+ "description": "Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.",
39902
+ "name": "help-text"
39745
39903
  }
39746
39904
  ],
39747
39905
  "members": [
39748
39906
  {
39749
39907
  "kind": "field",
39750
- "name": "masterId",
39751
- "type": {
39752
- "text": "string"
39753
- },
39754
- "attribute": "master-id",
39755
- "reflects": true
39908
+ "name": "formControlController",
39909
+ "privacy": "private",
39910
+ "readonly": true,
39911
+ "default": "new FormControlController(this, { assumeInteractionOn: ['zn-blur', 'zn-input'] })"
39756
39912
  },
39757
39913
  {
39758
39914
  "kind": "field",
39759
- "name": "defaultUri",
39915
+ "name": "hasSlotController",
39916
+ "privacy": "private",
39917
+ "readonly": true,
39918
+ "default": "new HasSlotController(this, 'help-text', 'label')"
39919
+ },
39920
+ {
39921
+ "kind": "field",
39922
+ "name": "resizeObserver",
39923
+ "privacy": "private",
39924
+ "readonly": true,
39925
+ "default": "new ResizeController(this, { target: null, callback: () => this.setTextareaHeight(), })"
39926
+ },
39927
+ {
39928
+ "kind": "field",
39929
+ "name": "_didInitFromContent",
39760
39930
  "type": {
39761
- "text": "string"
39931
+ "text": "boolean"
39762
39932
  },
39763
- "default": "''",
39764
- "attribute": "default-uri",
39765
- "reflects": true
39933
+ "privacy": "private",
39934
+ "default": "false",
39935
+ "description": "Ensures we only attempt to derive the initial value from light DOM content once"
39766
39936
  },
39767
39937
  {
39768
39938
  "kind": "field",
39769
- "name": "_current",
39939
+ "name": "formControl",
39770
39940
  "type": {
39771
- "text": "string"
39772
- },
39773
- "default": "''",
39774
- "attribute": "active",
39775
- "reflects": true
39941
+ "text": "HTMLElement"
39942
+ }
39776
39943
  },
39777
39944
  {
39778
39945
  "kind": "field",
39779
- "name": "_split",
39946
+ "name": "input",
39780
39947
  "type": {
39781
- "text": "number"
39782
- },
39783
- "attribute": "split",
39784
- "reflects": true
39948
+ "text": "HTMLTextAreaElement"
39949
+ }
39785
39950
  },
39786
39951
  {
39787
39952
  "kind": "field",
39788
- "name": "_splitMin",
39953
+ "name": "hasFocus",
39789
39954
  "type": {
39790
- "text": "number"
39955
+ "text": "boolean"
39791
39956
  },
39792
- "default": "60",
39793
- "attribute": "split-min",
39794
- "reflects": true
39957
+ "default": "false"
39795
39958
  },
39796
39959
  {
39797
39960
  "kind": "field",
39798
- "name": "_splitMinSecondary",
39961
+ "name": "title",
39799
39962
  "type": {
39800
- "text": "number"
39963
+ "text": "string"
39801
39964
  },
39802
- "attribute": "split-min-secondary",
39803
- "reflects": true
39965
+ "default": "''",
39966
+ "attribute": "title"
39804
39967
  },
39805
39968
  {
39806
39969
  "kind": "field",
39807
- "name": "_splitMax",
39970
+ "name": "name",
39808
39971
  "type": {
39809
- "text": "number"
39972
+ "text": "string"
39810
39973
  },
39811
- "attribute": "split-max",
39812
- "reflects": true
39974
+ "default": "''",
39975
+ "description": "The name of the textarea, submitted as a name/value pair with form data.",
39976
+ "attribute": "name"
39813
39977
  },
39814
39978
  {
39815
39979
  "kind": "field",
39816
- "name": "primaryCaption",
39980
+ "name": "value",
39817
39981
  "type": {
39818
39982
  "text": "string"
39819
39983
  },
39820
- "default": "'Navigation'",
39821
- "attribute": "primary-caption",
39822
- "reflects": true
39984
+ "default": "''",
39985
+ "description": "The current value of the textarea, submitted as a name/value pair with form data.",
39986
+ "attribute": "value"
39823
39987
  },
39824
39988
  {
39825
39989
  "kind": "field",
39826
- "name": "secondaryCaption",
39990
+ "name": "size",
39827
39991
  "type": {
39828
- "text": "string"
39992
+ "text": "'small' | 'medium' | 'large'"
39829
39993
  },
39830
- "default": "'Content'",
39831
- "attribute": "secondary-caption",
39994
+ "default": "'medium'",
39995
+ "description": "The text area's size.",
39996
+ "attribute": "size",
39832
39997
  "reflects": true
39833
39998
  },
39834
39999
  {
39835
40000
  "kind": "field",
39836
- "name": "noPrefetch",
40001
+ "name": "label",
39837
40002
  "type": {
39838
- "text": "boolean"
40003
+ "text": "string"
39839
40004
  },
39840
- "default": "false",
39841
- "attribute": "no-prefetch",
39842
- "reflects": true
40005
+ "default": "''",
40006
+ "description": "The textarea label. If you need to display HTML, use the `label` slot instead.",
40007
+ "attribute": "label"
39843
40008
  },
39844
40009
  {
39845
40010
  "kind": "field",
39846
- "name": "noCache",
40011
+ "name": "labelTooltip",
39847
40012
  "type": {
39848
- "text": "boolean"
40013
+ "text": "string"
39849
40014
  },
39850
- "default": "false",
39851
- "attribute": "no-cache",
39852
- "reflects": true
40015
+ "default": "''",
40016
+ "description": "Text that appears in a tooltip next to the label. If you need to display HTML in the tooltip, use the `label-tooltip` slot instead.",
40017
+ "attribute": "label-tooltip"
39853
40018
  },
39854
40019
  {
39855
40020
  "kind": "field",
39856
- "name": "localStorage",
40021
+ "name": "contextNote",
39857
40022
  "type": {
39858
- "text": "boolean"
40023
+ "text": "string"
39859
40024
  },
39860
- "attribute": "local-storage",
39861
- "reflects": true
40025
+ "default": "''",
40026
+ "description": "Text that appears above the textarea, on the right, to add additional context. If you need to display HTML in this text, use the `context-note` slot instead.",
40027
+ "attribute": "context-note"
39862
40028
  },
39863
40029
  {
39864
40030
  "kind": "field",
39865
- "name": "storeKey",
40031
+ "name": "helpText",
39866
40032
  "type": {
39867
40033
  "text": "string"
39868
40034
  },
39869
- "attribute": "store-key"
40035
+ "default": "''",
40036
+ "description": "The text area's help text. If you need to display HTML, use the `help-text` slot instead.",
40037
+ "attribute": "help-text"
39870
40038
  },
39871
40039
  {
39872
40040
  "kind": "field",
39873
- "name": "storeTtl",
40041
+ "name": "placeholder",
39874
40042
  "type": {
39875
- "text": "number"
40043
+ "text": "string"
39876
40044
  },
39877
- "default": "0",
39878
- "attribute": "store-ttl",
39879
- "reflects": true
40045
+ "default": "''",
40046
+ "description": "Placeholder text to show as a hint when the input is empty.",
40047
+ "attribute": "placeholder"
39880
40048
  },
39881
40049
  {
39882
40050
  "kind": "field",
39883
- "name": "padded",
40051
+ "name": "rows",
39884
40052
  "type": {
39885
- "text": "boolean"
40053
+ "text": "number"
39886
40054
  },
39887
- "default": "false",
39888
- "attribute": "padded",
39889
- "reflects": true
40055
+ "default": "4",
40056
+ "description": "The number of rows to display by default.",
40057
+ "attribute": "rows"
39890
40058
  },
39891
40059
  {
39892
40060
  "kind": "field",
39893
- "name": "fetchStyle",
40061
+ "name": "resize",
39894
40062
  "type": {
39895
- "text": "string"
40063
+ "text": "'none' | 'vertical' | 'auto'"
39896
40064
  },
39897
- "default": "\"\"",
39898
- "attribute": "fetch-style",
39899
- "reflects": true
40065
+ "default": "'vertical'",
40066
+ "description": "Controls how the textarea can be resized.",
40067
+ "attribute": "resize"
39900
40068
  },
39901
40069
  {
39902
40070
  "kind": "field",
39903
- "name": "fullWidth",
40071
+ "name": "disabled",
39904
40072
  "type": {
39905
40073
  "text": "boolean"
39906
40074
  },
39907
40075
  "default": "false",
39908
- "attribute": "full-width",
40076
+ "description": "Disables the textarea.",
40077
+ "attribute": "disabled",
39909
40078
  "reflects": true
39910
40079
  },
39911
40080
  {
39912
40081
  "kind": "field",
39913
- "name": "paddedRight",
40082
+ "name": "readonly",
39914
40083
  "type": {
39915
40084
  "text": "boolean"
39916
40085
  },
39917
40086
  "default": "false",
39918
- "attribute": "padded-right",
40087
+ "description": "Makes the textarea readonly.",
40088
+ "attribute": "readonly",
39919
40089
  "reflects": true
39920
40090
  },
39921
40091
  {
39922
40092
  "kind": "field",
39923
- "name": "monitor",
40093
+ "name": "form",
39924
40094
  "type": {
39925
40095
  "text": "string"
39926
40096
  },
39927
- "attribute": "monitor"
40097
+ "default": "''",
40098
+ "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.",
40099
+ "attribute": "form",
40100
+ "reflects": true
39928
40101
  },
39929
40102
  {
39930
40103
  "kind": "field",
39931
- "name": "caption",
40104
+ "name": "flush",
39932
40105
  "type": {
39933
- "text": "string"
40106
+ "text": "boolean"
39934
40107
  },
39935
- "attribute": "caption"
40108
+ "default": "false",
40109
+ "attribute": "flush",
40110
+ "reflects": true
39936
40111
  },
39937
40112
  {
39938
40113
  "kind": "field",
39939
- "name": "description",
40114
+ "name": "required",
39940
40115
  "type": {
39941
- "text": "string"
40116
+ "text": "boolean"
39942
40117
  },
39943
- "attribute": "description"
40118
+ "default": "false",
40119
+ "description": "Makes the textarea a required field.",
40120
+ "attribute": "required",
40121
+ "reflects": true
39944
40122
  },
39945
40123
  {
39946
40124
  "kind": "field",
39947
- "name": "preload",
40125
+ "name": "minlength",
39948
40126
  "type": {
39949
- "text": "boolean"
40127
+ "text": "number"
39950
40128
  },
39951
- "privacy": "protected",
39952
- "default": "true"
40129
+ "description": "The minimum length of input that will be considered valid.",
40130
+ "attribute": "minlength"
39953
40131
  },
39954
40132
  {
39955
40133
  "kind": "field",
39956
- "name": "_store",
40134
+ "name": "maxlength",
39957
40135
  "type": {
39958
- "text": "Store"
40136
+ "text": "number"
39959
40137
  },
39960
- "privacy": "protected"
40138
+ "description": "The maximum length of input that will be considered valid.",
40139
+ "attribute": "maxlength"
39961
40140
  },
39962
40141
  {
39963
40142
  "kind": "field",
39964
- "name": "_activeClicks",
40143
+ "name": "autocapitalize",
39965
40144
  "type": {
39966
- "text": "number"
40145
+ "text": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'"
39967
40146
  },
39968
- "privacy": "protected",
39969
- "default": "0"
40147
+ "description": "Controls whether and how text input is automatically capitalized as it is entered by the user.",
40148
+ "attribute": "autocapitalize"
39970
40149
  },
39971
40150
  {
39972
40151
  "kind": "field",
39973
- "name": "_panel",
40152
+ "name": "autocorrect",
39974
40153
  "type": {
39975
- "text": "Element | null | undefined"
40154
+ "text": "string"
39976
40155
  },
39977
- "privacy": "private"
40156
+ "description": "Indicates whether the browser's autocorrect feature is on or off.",
40157
+ "attribute": "autocorrect"
39978
40158
  },
39979
40159
  {
39980
40160
  "kind": "field",
39981
- "name": "_panels",
40161
+ "name": "autocomplete",
39982
40162
  "type": {
39983
- "text": "Map<string, Element[]>"
40163
+ "text": "string"
39984
40164
  },
39985
- "privacy": "private",
39986
- "default": "new Map<string, Element[]>()"
40165
+ "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.",
40166
+ "attribute": "autocomplete"
39987
40167
  },
39988
40168
  {
39989
40169
  "kind": "field",
39990
- "name": "_activeTab",
40170
+ "name": "autofocus",
39991
40171
  "type": {
39992
- "text": "Element | null"
40172
+ "text": "boolean"
39993
40173
  },
39994
- "privacy": "private",
39995
- "default": "null"
40174
+ "description": "Indicates that the input should receive focus on page load.",
40175
+ "attribute": "autofocus"
39996
40176
  },
39997
40177
  {
39998
40178
  "kind": "field",
39999
- "name": "_tabs",
40179
+ "name": "enterkeyhint",
40000
40180
  "type": {
40001
- "text": "HTMLElement[]"
40181
+ "text": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'"
40002
40182
  },
40003
- "privacy": "private",
40004
- "default": "[]"
40183
+ "description": "Used to customize the label or icon of the Enter key on virtual keyboards.",
40184
+ "attribute": "enterkeyhint"
40005
40185
  },
40006
40186
  {
40007
40187
  "kind": "field",
40008
- "name": "_actions",
40188
+ "name": "spellcheck",
40009
40189
  "type": {
40010
- "text": "HTMLElement[]"
40190
+ "text": "boolean"
40011
40191
  },
40012
- "privacy": "private",
40013
- "default": "[]"
40192
+ "default": "true",
40193
+ "description": "Enables spell checking on the textarea.",
40194
+ "attribute": "spellcheck"
40014
40195
  },
40015
40196
  {
40016
40197
  "kind": "field",
40017
- "name": "_knownUri",
40198
+ "name": "inputmode",
40018
40199
  "type": {
40019
- "text": "Map<string, string>"
40200
+ "text": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'"
40020
40201
  },
40021
- "privacy": "private",
40022
- "default": "new Map<string, string>()"
40202
+ "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.",
40203
+ "attribute": "inputmode"
40023
40204
  },
40024
40205
  {
40025
40206
  "kind": "field",
40026
- "name": "_defaultTab",
40207
+ "name": "defaultValue",
40027
40208
  "type": {
40028
40209
  "text": "string"
40029
40210
  },
40030
- "privacy": "private",
40031
- "default": "''"
40211
+ "default": "''",
40212
+ "description": "The default value of the form control. Primarily used for resetting the form control."
40032
40213
  },
40033
40214
  {
40034
40215
  "kind": "field",
40035
- "name": "hasSlotController",
40036
- "privacy": "private",
40037
- "readonly": true,
40038
- "default": "new HasSlotController(this, '[default]', 'bottom', 'right', 'left', 'top', 'actions')"
40216
+ "name": "transparent",
40217
+ "type": {
40218
+ "text": "boolean"
40219
+ },
40220
+ "default": "false",
40221
+ "attribute": "transparent"
40039
40222
  },
40040
40223
  {
40041
40224
  "kind": "field",
40042
- "name": "_domObserver",
40043
- "privacy": "private",
40044
- "readonly": true,
40045
- "default": "new MutationController(this, { target: null, config: {childList: true, subtree: true}, callback: mutations => { mutations.forEach(mutation => { if (mutation.type !== 'childList') return; if (mutation.addedNodes.length > 0) { this._registerTabs(); } if (mutation.removedNodes.length > 0) { mutation.removedNodes.forEach(node => { const id = node instanceof HTMLElement ? node.id : ''; if (id) this.removeTabAndPanel(id); }); } }); }, })"
40225
+ "name": "validity",
40226
+ "description": "Gets the validity state object",
40227
+ "readonly": true
40046
40228
  },
40047
40229
  {
40048
40230
  "kind": "field",
40049
- "name": "_monitorObserver",
40050
- "privacy": "private",
40051
- "readonly": true,
40052
- "default": "new MutationController(this, { target: null, config: {childList: true, subtree: true}, callback: mutations => { mutations.forEach(mutation => { if (mutation.type !== 'childList') return; mutation.addedNodes.forEach(node => { if (node instanceof HTMLElement && node.id === this.monitor) { this.reRegisterTabs(); const storedValue = this.getStoredTab(); if (storedValue !== null) { this.restoreStoredTab(storedValue); } } }); }); }, })"
40053
- },
40054
- {
40055
- "kind": "method",
40056
- "name": "monitorDom"
40057
- },
40058
- {
40059
- "kind": "method",
40060
- "name": "getTabStoreKey",
40061
- "privacy": "protected",
40062
- "return": {
40063
- "type": {
40064
- "text": "string | null"
40065
- }
40066
- },
40067
- "description": "The key the active tab is persisted under. Null disables persistence."
40068
- },
40069
- {
40070
- "kind": "method",
40071
- "name": "getStoredTab",
40072
- "privacy": "protected",
40073
- "return": {
40074
- "type": {
40075
- "text": "string | null"
40076
- }
40077
- }
40231
+ "name": "validationMessage",
40232
+ "description": "Gets the validation message",
40233
+ "readonly": true
40078
40234
  },
40079
40235
  {
40080
40236
  "kind": "method",
40081
- "name": "storeActiveTab",
40082
- "privacy": "protected",
40083
- "parameters": [
40084
- {
40085
- "name": "tabName",
40086
- "type": {
40087
- "text": "string"
40088
- }
40089
- }
40090
- ]
40237
+ "name": "handleBlur",
40238
+ "privacy": "private"
40091
40239
  },
40092
40240
  {
40093
40241
  "kind": "method",
40094
- "name": "restoreStoredTab",
40095
- "privacy": "protected",
40096
- "parameters": [
40097
- {
40098
- "name": "stored",
40099
- "type": {
40100
- "text": "string"
40101
- }
40102
- }
40103
- ]
40242
+ "name": "handleChange",
40243
+ "privacy": "private"
40104
40244
  },
40105
40245
  {
40106
40246
  "kind": "method",
40107
- "name": "activateDefaultTab",
40108
- "privacy": "protected",
40109
- "description": "Activates the tab the container starts on, ignoring any stored selection."
40110
- },
40111
- {
40112
- "kind": "field",
40113
- "name": "handlePopState",
40114
- "privacy": "private",
40115
- "readonly": true
40247
+ "name": "handleFocus",
40248
+ "privacy": "private"
40116
40249
  },
40117
40250
  {
40118
40251
  "kind": "method",
40119
- "name": "pushTabHistory",
40120
- "privacy": "private",
40121
- "parameters": [
40122
- {
40123
- "name": "tabName",
40124
- "type": {
40125
- "text": "string"
40126
- }
40127
- }
40128
- ]
40252
+ "name": "handleInput",
40253
+ "privacy": "private"
40129
40254
  },
40130
40255
  {
40131
40256
  "kind": "method",
40132
- "name": "getUriForTabId",
40257
+ "name": "handleInvalid",
40133
40258
  "privacy": "private",
40134
- "return": {
40135
- "type": {
40136
- "text": "string | null"
40137
- }
40138
- },
40139
40259
  "parameters": [
40140
40260
  {
40141
- "name": "tabId",
40261
+ "name": "event",
40142
40262
  "type": {
40143
- "text": "string"
40263
+ "text": "Event"
40144
40264
  }
40145
40265
  }
40146
40266
  ]
40147
40267
  },
40148
40268
  {
40149
40269
  "kind": "method",
40150
- "name": "_addPanel",
40270
+ "name": "handleKeyDown",
40271
+ "privacy": "private",
40151
40272
  "parameters": [
40152
40273
  {
40153
- "name": "panel",
40274
+ "name": "event",
40154
40275
  "type": {
40155
- "text": "HTMLElement"
40276
+ "text": "KeyboardEvent"
40156
40277
  }
40157
40278
  }
40158
40279
  ]
40159
40280
  },
40160
40281
  {
40161
40282
  "kind": "method",
40162
- "name": "_addTab",
40163
- "parameters": [
40164
- {
40165
- "name": "tab",
40166
- "type": {
40167
- "text": "HTMLElement"
40168
- }
40169
- }
40170
- ]
40171
- },
40172
- {
40173
- "kind": "field",
40174
- "name": "reRegisterTabs"
40283
+ "name": "setTextareaHeight",
40284
+ "privacy": "private"
40175
40285
  },
40176
40286
  {
40177
40287
  "kind": "method",
40178
- "name": "switchTab",
40179
- "parameters": [
40180
- {
40181
- "name": "inc",
40182
- "type": {
40183
- "text": "number"
40184
- }
40185
- }
40186
- ]
40288
+ "name": "handleDisabledChange"
40187
40289
  },
40188
40290
  {
40189
40291
  "kind": "method",
40190
- "name": "nextTab"
40292
+ "name": "handleRowsChange"
40191
40293
  },
40192
40294
  {
40193
40295
  "kind": "method",
40194
- "name": "previousTab"
40296
+ "name": "handleValueChange"
40195
40297
  },
40196
40298
  {
40197
40299
  "kind": "method",
40198
- "name": "_prepareTab",
40300
+ "name": "focus",
40199
40301
  "parameters": [
40200
40302
  {
40201
- "name": "tabId",
40303
+ "name": "options",
40304
+ "optional": true,
40202
40305
  "type": {
40203
- "text": "string"
40306
+ "text": "FocusOptions"
40204
40307
  }
40205
40308
  }
40206
- ]
40309
+ ],
40310
+ "description": "Sets focus on the textarea."
40207
40311
  },
40208
40312
  {
40209
40313
  "kind": "method",
40210
- "name": "_uriToId",
40211
- "return": {
40212
- "type": {
40213
- "text": "string"
40214
- }
40215
- },
40216
- "parameters": [
40217
- {
40218
- "name": "tabUri",
40219
- "type": {
40220
- "text": "string"
40221
- }
40222
- }
40223
- ]
40314
+ "name": "blur",
40315
+ "description": "Removes focus from the textarea."
40224
40316
  },
40225
40317
  {
40226
40318
  "kind": "method",
40227
- "name": "_createUriPanel",
40228
- "return": {
40229
- "type": {
40230
- "text": "HTMLDivElement"
40231
- }
40232
- },
40233
- "parameters": [
40234
- {
40235
- "name": "tabEle",
40236
- "type": {
40237
- "text": "Element"
40238
- }
40239
- },
40240
- {
40241
- "name": "tabUri",
40242
- "type": {
40243
- "text": "string"
40244
- }
40245
- },
40246
- {
40247
- "name": "tabId",
40248
- "type": {
40249
- "text": "string"
40250
- }
40251
- }
40252
- ]
40319
+ "name": "select",
40320
+ "description": "Selects all the text in the textarea."
40253
40321
  },
40254
40322
  {
40255
40323
  "kind": "method",
40256
- "name": "_handleClick",
40257
- "parameters": [
40258
- {
40259
- "name": "event",
40260
- "type": {
40261
- "text": "PointerEvent"
40262
- }
40324
+ "name": "scrollPosition",
40325
+ "return": {
40326
+ "type": {
40327
+ "text": "{ top: number; left: number } | undefined"
40263
40328
  }
40264
- ]
40265
- },
40266
- {
40267
- "kind": "method",
40268
- "name": "fetchUriTab",
40329
+ },
40269
40330
  "parameters": [
40270
40331
  {
40271
- "name": "target",
40332
+ "name": "position",
40333
+ "optional": true,
40272
40334
  "type": {
40273
- "text": "HTMLElement"
40335
+ "text": "{ top?: number; left?: number }"
40274
40336
  }
40275
40337
  }
40276
- ]
40338
+ ],
40339
+ "description": "Gets or sets the textarea scroll position."
40277
40340
  },
40278
40341
  {
40279
40342
  "kind": "method",
40280
- "name": "clickTab",
40343
+ "name": "setSelectionRange",
40281
40344
  "parameters": [
40282
40345
  {
40283
- "name": "target",
40346
+ "name": "selectionStart",
40284
40347
  "type": {
40285
- "text": "HTMLElement"
40348
+ "text": "number"
40286
40349
  }
40287
40350
  },
40288
40351
  {
40289
- "name": "refresh",
40352
+ "name": "selectionEnd",
40290
40353
  "type": {
40291
- "text": "boolean"
40354
+ "text": "number"
40292
40355
  }
40293
40356
  },
40294
40357
  {
40295
- "name": "pushHistory",
40296
- "default": "false"
40297
- }
40298
- ]
40299
- },
40300
- {
40301
- "kind": "method",
40302
- "name": "getRefTab",
40303
- "parameters": [
40304
- {
40305
- "name": "target",
40358
+ "name": "selectionDirection",
40359
+ "default": "'none'",
40306
40360
  "type": {
40307
- "text": "HTMLElement"
40361
+ "text": "'forward' | 'backward' | 'none'"
40308
40362
  }
40309
40363
  }
40310
- ]
40364
+ ],
40365
+ "description": "Sets the start and end positions of the text selection (0-based)."
40311
40366
  },
40312
40367
  {
40313
40368
  "kind": "method",
40314
- "name": "setActiveTab",
40369
+ "name": "setRangeText",
40315
40370
  "parameters": [
40316
40371
  {
40317
- "name": "tabName",
40372
+ "name": "replacement",
40318
40373
  "type": {
40319
40374
  "text": "string"
40320
40375
  }
40321
40376
  },
40322
40377
  {
40323
- "name": "store",
40378
+ "name": "start",
40379
+ "optional": true,
40324
40380
  "type": {
40325
- "text": "boolean"
40381
+ "text": "number"
40326
40382
  }
40327
40383
  },
40328
40384
  {
40329
- "name": "refresh",
40385
+ "name": "end",
40386
+ "optional": true,
40330
40387
  "type": {
40331
- "text": "boolean"
40388
+ "text": "number"
40332
40389
  }
40333
40390
  },
40334
40391
  {
40335
- "name": "refTab",
40336
- "default": "null",
40392
+ "name": "selectMode",
40393
+ "default": "'preserve'",
40337
40394
  "type": {
40338
- "text": "string | null"
40395
+ "text": "'select' | 'start' | 'end' | 'preserve'"
40339
40396
  }
40340
- },
40341
- {
40342
- "name": "pushHistory",
40343
- "default": "false"
40344
40397
  }
40345
- ]
40398
+ ],
40399
+ "description": "Replaces a range of text with a new string."
40346
40400
  },
40347
40401
  {
40348
40402
  "kind": "method",
40349
- "name": "_setTabEleActive",
40350
- "parameters": [
40351
- {
40352
- "name": "ele",
40353
- "type": {
40354
- "text": "Element"
40355
- }
40356
- },
40357
- {
40358
- "name": "active",
40359
- "type": {
40360
- "text": "boolean"
40361
- }
40362
- }
40363
- ]
40403
+ "name": "checkValidity",
40404
+ "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
40364
40405
  },
40365
40406
  {
40366
40407
  "kind": "method",
40367
- "name": "selectTab",
40408
+ "name": "getForm",
40368
40409
  "return": {
40369
40410
  "type": {
40370
- "text": "boolean"
40411
+ "text": "HTMLFormElement | null"
40371
40412
  }
40372
40413
  },
40373
- "parameters": [
40374
- {
40375
- "name": "tabName",
40376
- "type": {
40377
- "text": "string"
40378
- }
40379
- },
40380
- {
40381
- "name": "refresh",
40382
- "type": {
40383
- "text": "boolean"
40384
- }
40385
- }
40386
- ]
40387
- },
40388
- {
40389
- "kind": "method",
40390
- "name": "getActiveTab",
40391
- "return": {
40392
- "type": {
40393
- "text": "Element[]"
40394
- }
40395
- }
40414
+ "description": "Gets the associated form, if one exists."
40396
40415
  },
40397
40416
  {
40398
40417
  "kind": "method",
40399
- "name": "observerDom"
40418
+ "name": "reportValidity",
40419
+ "description": "Checks for validity and shows the browser's validation message if the control is invalid."
40400
40420
  },
40401
40421
  {
40402
40422
  "kind": "method",
40403
- "name": "removeTabAndPanel",
40423
+ "name": "setCustomValidity",
40404
40424
  "parameters": [
40405
40425
  {
40406
- "name": "tabId",
40426
+ "name": "message",
40407
40427
  "type": {
40408
40428
  "text": "string"
40409
40429
  }
40410
40430
  }
40411
- ]
40412
- },
40413
- {
40414
- "kind": "field",
40415
- "name": "_registerTabs"
40431
+ ],
40432
+ "description": "Sets a custom validation message. Pass an empty string to restore validity."
40416
40433
  }
40417
40434
  ],
40418
40435
  "events": [
40419
40436
  {
40420
- "description": "Emitted as an example.",
40421
- "name": "zn-event-name"
40437
+ "description": "Emitted when the control loses focus.",
40438
+ "name": "zn-blur"
40439
+ },
40440
+ {
40441
+ "description": "Emitted when an alteration to the control's value is committed by the user.",
40442
+ "name": "zn-change"
40443
+ },
40444
+ {
40445
+ "description": "Emitted when the control gains focus.",
40446
+ "name": "zn-focus"
40447
+ },
40448
+ {
40449
+ "description": "Emitted when the control receives input.",
40450
+ "name": "zn-input"
40451
+ },
40452
+ {
40453
+ "description": "Emitted when the form control has been checked for validity and its constraints aren't satisfied.",
40454
+ "name": "zn-invalid"
40422
40455
  }
40423
40456
  ],
40424
40457
  "attributes": [
40425
40458
  {
40426
- "name": "master-id",
40459
+ "name": "title",
40427
40460
  "type": {
40428
40461
  "text": "string"
40429
40462
  },
40430
- "fieldName": "masterId"
40463
+ "default": "''",
40464
+ "fieldName": "title"
40431
40465
  },
40432
40466
  {
40433
- "name": "default-uri",
40467
+ "name": "name",
40434
40468
  "type": {
40435
40469
  "text": "string"
40436
40470
  },
40437
40471
  "default": "''",
40438
- "fieldName": "defaultUri"
40472
+ "description": "The name of the textarea, submitted as a name/value pair with form data.",
40473
+ "fieldName": "name"
40439
40474
  },
40440
40475
  {
40441
- "name": "active",
40476
+ "name": "value",
40442
40477
  "type": {
40443
40478
  "text": "string"
40444
40479
  },
40445
40480
  "default": "''",
40446
- "fieldName": "_current"
40481
+ "description": "The current value of the textarea, submitted as a name/value pair with form data.",
40482
+ "fieldName": "value"
40447
40483
  },
40448
40484
  {
40449
- "name": "split",
40485
+ "name": "size",
40450
40486
  "type": {
40451
- "text": "number"
40487
+ "text": "'small' | 'medium' | 'large'"
40452
40488
  },
40453
- "fieldName": "_split"
40489
+ "default": "'medium'",
40490
+ "description": "The text area's size.",
40491
+ "fieldName": "size"
40454
40492
  },
40455
40493
  {
40456
- "name": "split-min",
40494
+ "name": "label",
40457
40495
  "type": {
40458
- "text": "number"
40496
+ "text": "string"
40459
40497
  },
40460
- "default": "60",
40461
- "fieldName": "_splitMin"
40498
+ "default": "''",
40499
+ "description": "The textarea label. If you need to display HTML, use the `label` slot instead.",
40500
+ "fieldName": "label"
40462
40501
  },
40463
40502
  {
40464
- "name": "split-min-secondary",
40503
+ "name": "label-tooltip",
40465
40504
  "type": {
40466
- "text": "number"
40505
+ "text": "string"
40467
40506
  },
40468
- "fieldName": "_splitMinSecondary"
40507
+ "default": "''",
40508
+ "description": "Text that appears in a tooltip next to the label. If you need to display HTML in the tooltip, use the `label-tooltip` slot instead.",
40509
+ "fieldName": "labelTooltip"
40469
40510
  },
40470
40511
  {
40471
- "name": "split-max",
40512
+ "name": "context-note",
40472
40513
  "type": {
40473
- "text": "number"
40514
+ "text": "string"
40474
40515
  },
40475
- "fieldName": "_splitMax"
40516
+ "default": "''",
40517
+ "description": "Text that appears above the textarea, on the right, to add additional context. If you need to display HTML in this text, use the `context-note` slot instead.",
40518
+ "fieldName": "contextNote"
40476
40519
  },
40477
40520
  {
40478
- "name": "primary-caption",
40521
+ "name": "help-text",
40479
40522
  "type": {
40480
40523
  "text": "string"
40481
40524
  },
40482
- "default": "'Navigation'",
40483
- "fieldName": "primaryCaption"
40525
+ "default": "''",
40526
+ "description": "The text area's help text. If you need to display HTML, use the `help-text` slot instead.",
40527
+ "fieldName": "helpText"
40484
40528
  },
40485
40529
  {
40486
- "name": "secondary-caption",
40530
+ "name": "placeholder",
40487
40531
  "type": {
40488
40532
  "text": "string"
40489
40533
  },
40490
- "default": "'Content'",
40491
- "fieldName": "secondaryCaption"
40534
+ "default": "''",
40535
+ "description": "Placeholder text to show as a hint when the input is empty.",
40536
+ "fieldName": "placeholder"
40492
40537
  },
40493
40538
  {
40494
- "name": "no-prefetch",
40539
+ "name": "rows",
40495
40540
  "type": {
40496
- "text": "boolean"
40541
+ "text": "number"
40497
40542
  },
40498
- "default": "false",
40499
- "fieldName": "noPrefetch"
40543
+ "default": "4",
40544
+ "description": "The number of rows to display by default.",
40545
+ "fieldName": "rows"
40500
40546
  },
40501
40547
  {
40502
- "name": "no-cache",
40548
+ "name": "resize",
40549
+ "type": {
40550
+ "text": "'none' | 'vertical' | 'auto'"
40551
+ },
40552
+ "default": "'vertical'",
40553
+ "description": "Controls how the textarea can be resized.",
40554
+ "fieldName": "resize"
40555
+ },
40556
+ {
40557
+ "name": "disabled",
40503
40558
  "type": {
40504
40559
  "text": "boolean"
40505
40560
  },
40506
40561
  "default": "false",
40507
- "fieldName": "noCache"
40562
+ "description": "Disables the textarea.",
40563
+ "fieldName": "disabled"
40508
40564
  },
40509
40565
  {
40510
- "name": "local-storage",
40566
+ "name": "readonly",
40511
40567
  "type": {
40512
40568
  "text": "boolean"
40513
40569
  },
40514
- "fieldName": "localStorage"
40570
+ "default": "false",
40571
+ "description": "Makes the textarea readonly.",
40572
+ "fieldName": "readonly"
40515
40573
  },
40516
40574
  {
40517
- "name": "store-key",
40575
+ "name": "form",
40518
40576
  "type": {
40519
40577
  "text": "string"
40520
40578
  },
40521
- "fieldName": "storeKey"
40579
+ "default": "''",
40580
+ "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.",
40581
+ "fieldName": "form"
40522
40582
  },
40523
40583
  {
40524
- "name": "store-ttl",
40584
+ "name": "flush",
40525
40585
  "type": {
40526
- "text": "number"
40586
+ "text": "boolean"
40527
40587
  },
40528
- "default": "0",
40529
- "fieldName": "storeTtl"
40588
+ "default": "false",
40589
+ "fieldName": "flush"
40530
40590
  },
40531
40591
  {
40532
- "name": "padded",
40592
+ "name": "required",
40533
40593
  "type": {
40534
40594
  "text": "boolean"
40535
40595
  },
40536
40596
  "default": "false",
40537
- "fieldName": "padded"
40597
+ "description": "Makes the textarea a required field.",
40598
+ "fieldName": "required"
40538
40599
  },
40539
40600
  {
40540
- "name": "fetch-style",
40601
+ "name": "minlength",
40541
40602
  "type": {
40542
- "text": "string"
40603
+ "text": "number"
40543
40604
  },
40544
- "default": "\"\"",
40545
- "fieldName": "fetchStyle"
40605
+ "description": "The minimum length of input that will be considered valid.",
40606
+ "fieldName": "minlength"
40546
40607
  },
40547
40608
  {
40548
- "name": "full-width",
40609
+ "name": "maxlength",
40549
40610
  "type": {
40550
- "text": "boolean"
40611
+ "text": "number"
40551
40612
  },
40552
- "default": "false",
40553
- "fieldName": "fullWidth"
40613
+ "description": "The maximum length of input that will be considered valid.",
40614
+ "fieldName": "maxlength"
40554
40615
  },
40555
40616
  {
40556
- "name": "padded-right",
40617
+ "name": "autocapitalize",
40557
40618
  "type": {
40558
- "text": "boolean"
40619
+ "text": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'"
40559
40620
  },
40560
- "default": "false",
40561
- "fieldName": "paddedRight"
40621
+ "description": "Controls whether and how text input is automatically capitalized as it is entered by the user.",
40622
+ "fieldName": "autocapitalize"
40562
40623
  },
40563
40624
  {
40564
- "name": "monitor",
40625
+ "name": "autocorrect",
40565
40626
  "type": {
40566
40627
  "text": "string"
40567
40628
  },
40568
- "fieldName": "monitor"
40629
+ "description": "Indicates whether the browser's autocorrect feature is on or off.",
40630
+ "fieldName": "autocorrect"
40569
40631
  },
40570
40632
  {
40571
- "name": "caption",
40633
+ "name": "autocomplete",
40572
40634
  "type": {
40573
40635
  "text": "string"
40574
40636
  },
40575
- "fieldName": "caption"
40637
+ "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.",
40638
+ "fieldName": "autocomplete"
40576
40639
  },
40577
40640
  {
40578
- "name": "description",
40641
+ "name": "autofocus",
40579
40642
  "type": {
40580
- "text": "string"
40643
+ "text": "boolean"
40581
40644
  },
40582
- "fieldName": "description"
40645
+ "description": "Indicates that the input should receive focus on page load.",
40646
+ "fieldName": "autofocus"
40647
+ },
40648
+ {
40649
+ "name": "enterkeyhint",
40650
+ "type": {
40651
+ "text": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'"
40652
+ },
40653
+ "description": "Used to customize the label or icon of the Enter key on virtual keyboards.",
40654
+ "fieldName": "enterkeyhint"
40655
+ },
40656
+ {
40657
+ "name": "spellcheck",
40658
+ "type": {
40659
+ "text": "boolean"
40660
+ },
40661
+ "default": "true",
40662
+ "description": "Enables spell checking on the textarea.",
40663
+ "fieldName": "spellcheck"
40664
+ },
40665
+ {
40666
+ "name": "inputmode",
40667
+ "type": {
40668
+ "text": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'"
40669
+ },
40670
+ "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.",
40671
+ "fieldName": "inputmode"
40672
+ },
40673
+ {
40674
+ "name": "transparent",
40675
+ "type": {
40676
+ "text": "boolean"
40677
+ },
40678
+ "default": "false",
40679
+ "fieldName": "transparent"
40583
40680
  }
40584
40681
  ],
40585
40682
  "superclass": {
40586
40683
  "name": "ZincElement",
40587
40684
  "module": "/src/internal/zinc-element"
40588
40685
  },
40589
- "summary": "Short summary of the component's intended use.",
40590
- "tagNameWithoutPrefix": "tabs",
40591
- "tagName": "zn-tabs",
40686
+ "summary": "Textareas collect data from the user and allow multiple lines of text.",
40687
+ "tagNameWithoutPrefix": "textarea",
40688
+ "tagName": "zn-textarea",
40592
40689
  "customElement": true,
40593
- "jsDoc": "/**\n * @summary Short summary of the component's intended use.\n * @documentation https://zinc.style/components/tabs\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-example\n *\n * @event zn-event-name - Emitted as an example.\n *\n * @slot - The default slot.\n * @slot example - An example slot.\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --example - An example CSS custom property.\n */",
40594
- "documentation": "https://zinc.style/components/tabs",
40595
- "status": "experimental",
40596
- "since": "1.0",
40597
- "dependencies": [
40598
- "zn-example"
40599
- ]
40690
+ "jsDoc": "/**\n * @summary Textareas collect data from the user and allow multiple lines of text.\n * @documentation https://zinc.style/components/textarea\n * @status stable\n * @since 2.0\n *\n * @slot label - The textareas label. Alternatively, you can use the `label` attribute.\n * @slot label-tooltip - Used to add text that is displayed in a tooltip next to the label. Alternatively, you can use the `label-tooltip` attribute.\n * @slot context-note - Used to add contextual text that is displayed above the textarea, on the right. Alternatively, you can use the `context-note` attribute.\n * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n *\n * @event zn-blur - Emitted when the control loses focus.\n * @event zn-change - Emitted when an alteration to the control's value is committed by the user.\n * @event zn-focus - Emitted when the control gains focus.\n * @event zn-input - Emitted when the control receives input.\n * @event zn-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 textarea - The internal `<textarea>` control.\n */",
40691
+ "documentation": "https://zinc.style/components/textarea",
40692
+ "status": "stable",
40693
+ "since": "2.0"
40600
40694
  }
40601
40695
  ],
40602
40696
  "exports": [
@@ -40604,8 +40698,8 @@
40604
40698
  "kind": "js",
40605
40699
  "name": "default",
40606
40700
  "declaration": {
40607
- "name": "ZnTabs",
40608
- "module": "components/tabs/tabs.js"
40701
+ "name": "ZnTextarea",
40702
+ "module": "components/textarea/textarea.js"
40609
40703
  }
40610
40704
  }
40611
40705
  ]
@@ -44374,7 +44468,7 @@
44374
44468
  "package": {
44375
44469
  "name": "@kubex/zinc",
44376
44470
  "description": "A collection of web components for building web applications based off of @shoelace-style/Shoelace",
44377
- "version": "1.1.76",
44471
+ "version": "1.1.78",
44378
44472
  "author": "",
44379
44473
  "license": "MIT"
44380
44474
  }